FootB_R2/* ================================================================================ ===== CSS STYLES FOR ===== ===== SCHOOLWEBSITE.NU SKIN ===== ================================================================================ */ /* nieuwe dnn */ /* #ControlBar_ControlPanel:before { position:absolute; left:5px; top:5px; width:46px; height:46px; z-index:99; content:" "; background:transparent url(images/logoW2W_w.png) no-repeat center center; background-size:auto 75%; animation:w2w_pop 3s normal 0s 1; } @keyframes w2w_pop{0%,75%{transform:scale(0);}100%{transform:scale(1);}} */ .sc-content-block-menu { display: none !important;} #ControlNav { margin-left:60px!important; } #ControlNav:before { position:absolute; left:5px; top:4px; width:46px; height:46px; z-index:99; content:" "; background:transparent url(images/logoW2W_w.png) no-repeat center center; background-size:auto 65%; animation:w2w_pop 1.5s normal 0s 1; } @keyframes w2w_pop{0%,50%{transform:scale(0);}100%{transform:scale(1);}} /* ---------------------- klikbaar op logo via css3? http://stackoverflow.com/questions/3859101/what-does-ahref-do-in-css ---------------------- */ /* html{background:#272727} */ /* html{background:#272727} */ /* oude dnn #ControlBar_conrolbar_logo{display:none!important;} #ControlBar .ServiceIcon{height:100%;background:transparent url(images/logoW2W_w.png) no-repeat center center;background-size:auto 65%;animation:w2w_pop 3s normal 0s 1;} @keyframes w2w_pop{0%,75%{transform:scale(0);}100%{transform:scale(1);}} */ /* ================================================================================ GENERAL SETTINGS ================================================================================ */ @font-face { font-family: "Ionicons"; src: url("fonts/Ionicons_2_0_1/ionicons.eot"); src: url("fonts/Ionicons_2_0_1/ionicons.eot#iefix") format("embedded-opentype"), url("fonts/Ionicons_2_0_1/ionicons.ttf") format("truetype"), url("fonts/Ionicons_2_0_1/ionicons.woff") format("woff"), url("fonts/Ionicons_2_0_1/ionicons.svg#Ionicons") format("svg"); font-weight:normal; font-style:normal; } html { margin:0px; padding:0px; overflow-y:scroll; /* Altijd een scrollbalk afdwingen i.v.m. verspringingen */ } .noScroll { position:fixed; width:100%; } body { text-align:left; } #Body { } /* Achtergrondkleuren + afbeeldingen hier */ #Form { } /* om hoogte op minimaal 100% te zetten, mag wel groter */ /* HEADINGS */ H1, H2, H3, H4, H5 { font-family: 'Open Sans', serif; font-weight:700; letter-spacing:normal; color:#13235b; } /* --- CMS editor: */ H1 {font-size:50px; margin-top:0px; } H2 {font-size:22px; font-weight:700; } H3 {font-size:20px; font-weight:600;} H4 {font-size:18px; } H5 {font-size:16px; } /* HTML */ a:link, a:visited { text-decoration:none!important; } a:hover, a:active { text-decoration:none!important;} table {font-size:inherit;} /* om de lettergrootte in de editor gelijk te zetten */ table tr {} table tr th {} table tr td { vertical-align:top;} /* DNN SPECIFIC */ .Head, .SubHead, .SubSubHead, .Normal, .NormalTextBox, .NormalRed, .NormalBold, .CommandButton { font-family: inherit; color:inherit; line-height:inherit; font-size:inherit; } .Head { font-size:15px;} /* style for module titles */ .SubHead {font-size:14px;} /* style of item titles on edit and admin pages */ .SubSubHead { font-size:13px;} /* module title style used instead of Head for compact rendering by QuickLinks and Signin modules */ .NormalBold { font-weight:bold;} .CommandButton { text-shadow:none!important; } /* text style for buttons and link buttons used in the portal admin pages */ A.CommandButton:link {} /* hyperlink style for buttons and link buttons used in the portal admin pages */ A.CommandButton:visited {} A.CommandButton:hover {} A.CommandButton:active {} .StandardButton {} /* button style for standard HTML buttons */ /* COMMON ISSUES */ img {border:0px;} /* geen standaard rand bij afbeeldingen wanneer er gelinkt wordt */ input[type=submit], input[type=button] {} input[type=submit]:hover, input[type=button]:hover {} /* * { transition:background-color 0.3s ease; -webkit-transition:background-color 0.3s ease;} */ #homeRij1 *, #FootB3 * { transition: all 0.225s ease; } #RijTopL * { transition: all 0.05s ease; } #Menu { transition:background-color 0.1s ease; } /* DNN tab fix*/ ul.dnnAdminTabNav { height:auto !important} html > body > form #ControlBar_ControlPanel { z-index:1202 !important} /* Clearfix */ .clear{clear:both; display:block; height:0; overflow:hidden; visibility:hidden; width:0;} .clearfix:after{clear:both; content:'.'; display:block; font-size:0; height:0; line-height:0; visibility:hidden; width:0;} * html .clearfix,:first-child+html .clearfix{zoom:1;} body, .Content, .Normal { font-family: 'Lato', serif; font-weight:400; font-size:15px; line-height:1.7; color:#3c3c3b; } .WS17 body, .Content, .Normal { color:#2e3192; } p { margin:0; } /* ================================================================================ MAIN LAYOUT ================================================================================ */ .UserMode0.isHome #dnn_ContentPane { } .ControlPanel { } .siteNotResp #Form { background:linear-gradient(180deg, rgba(255,255,255,.25) 0%, transparent 50%, transparent 100%); } #Wrapper { background-color:#ffffff; text-align:left; margin:0px auto;max-width:1400px; position:relative; box-shadow:0px 0px 25px 0px rgba(0,0,0,.2); font-family: 'Open Sans', serif; font-weight:400; } .InnerWrapper { margin:0px auto;max-width:940px; position:relative;} #HeadMobMenu, #Wrapper.isSeq { background:#ffffff none no-repeat 20px 260px; } #homeRij1 { background:#ffffff url(images/bg01.png) no-repeat center top; padding:25px 0 53px 0; background-position-y:bottom; } .WS1 #homeRij1 { background-position-y:top; } /* .WS1 #Wrapper.isSeq { background-image:url(images/bg_seq.png); } */ .WS0 #homeRij1 { background-image:url(images/bg_0_home.png); background-position-y:-360px; padding-bottom:0; } .WS0 #HeadMobMenu, .WS0 #Wrapper.isSeq { background-image:url(images/bg_0.png); } #Body.siteResp { background-repeat:no-repeat; background-position-x:40%; background-position-y:-165px; background-size:500px auto; } .WS1 #homeRij1, #Body.WS1.siteResp, .WS1 #Wrapper.isSeq { background-image:url(images/bg01.png); } .WS2 #homeRij1, #Body.WS2.siteResp, .WS2 #Wrapper.isSeq { background-image:url(images/bg_2.png); } .WS2 #homeRij1, #Body.WS2.siteResp, .WS2 #Wrapper.isSeq { background-image:url(images/bg_2.png); } .WS3 #homeRij1, #Body.WS3.siteResp, .WS3 #Wrapper.isSeq { background-image:url(images/bg_3BK.png); } .WS4 #homeRij1, #Body.WS4.siteResp, .WS4 #Wrapper.isSeq { background-image:url(images/bg_4.png); } .WS5 #homeRij1, #Body.WS5.siteResp, .WS5 #Wrapper.isSeq { background-image:url(images/bg_5.png); } .WS6 #homeRij1, #Body.WS6.siteResp, .WS6 #Wrapper.isSeq { background-image:url(images/bg_6.png); } .WS7 #homeRij1, #Body.WS7.siteResp, .WS7 #Wrapper.isSeq { background-image:url(images/bg_7.png); } .WS8 #homeRij1, #Body.WS8.siteResp, .WS8 #Wrapper.isSeq { background-image:url(images/bg_8.png); } .WS9 #homeRij1, #Body.WS9.siteResp, .WS9 #Wrapper.isSeq { background-image:url(images/bg_9.png); } .WS10 #homeRij1, #Body.WS10.siteResp, .WS10 #Wrapper.isSeq { background-image:url(images/bg_10.png); } .WS11 #homeRij1, #Body.WS11.siteResp, .WS11 #Wrapper.isSeq { background-image:url(images/bg_11.png); } .WS12 #homeRij1, #Body.WS12.siteResp, .WS12 #Wrapper.isSeq { background-image:url(images/bg_12.png); } .WS13 #homeRij1, #Body.WS13.siteResp, .WS13 #Wrapper.isSeq { background-image:url(images/bg_13.png); } .WS14 #homeRij1, #Body.WS14.siteResp, .WS14 #Wrapper.isSeq { background-image:url(images/bg_14.png); } .WS15 #homeRij1, #Body.WS15.siteResp, .WS15 #Wrapper.isSeq { background-image:url(images/bg_15.png); } .WS16 #homeRij1, #Body.WS16.siteResp, .WS16 #Wrapper.isSeq { background-image:url(images/bg_16.png); } /* RESPONSIVE > #homeRij1, dubbele image voor repeating y, second row at 50% left positioning */ #Body #HeadMobMenu { background-position:-100px -90px; } /* HEADER SECTION */ /* .mobZoekAan.mobMenuFlashUit ~.mobMenuAan #HeadMobZoek #MobielZoeken, */ .mobZoekAan.mobMenuAan #HeadMobZoek #MobielZoeken { xxbox-shadow:0px -4px 0px 0px #eb5d40 inset; /* als #HeadMobHorzSplit */ } #Logo { position:absolute; top:16px; left:0px; z-index:11; width:562px; height:104px; } .fontIonicons { font-family: "Ionicons"; font-size:32px; } #MobileMenuTrigger { /* position:absolute; right:0px; top:0; */ height:50px; width:50px; line-height:50px; z-index:980; overflow:hidden; font-family: "Ionicons"; font-size:32px; vertical-align:middle; text-align:center; color:#fff; display:none; cursor:pointer; } #HeadMobHorzSplit { width:100%; height:0px; /* background:#eb5d40; margin-bottom:10px; */ } #GoHomeTrigger { /* height:50px; width:50px; line-height:50px; z-index:980; overflow:hidden; font-family: "Ionicons"; font-size:32px; vertical-align:middle; text-align:center; color:#fff; display:none; cursor:pointer; */ } /* SEARCH */ #Search { position:absolute; right:0; top:0; height:50px; width:50px; z-index:1050; overflow:hidden; transition:width 0.2s ease; -webkit-transition:width 0.2s ease; } #Search.active { width:240px;} #Search #dnn_dnnSEARCH_ClassicSearch { white-space:nowrap; position:relative; display:block; height:50px;} #Search .SkinObject{font-family: "Ionicons"; font-size:32px; vertical-align:middle; height:50px; width:50px; color:#fff !important; display:block; text-align:center;position:absolute; right:0; top:0;} #Search .SkinObject:hover { text-decoration:none !important} #Search #dnn_dnnSEARCH_ClassicSearch .searchInputContainer{ position:absolute !important; right:55px; top:0; padding:10px 0 10px 10px} #Search .NormalTextBox { -webkit-appearance:none; height:30px; border:0; padding:0 10px; width:160px} #Search .NormalTextBox:focus { outline:none} /* SEARCH PREVIEW NOOIT TONEN */ #Search .searchSkinObjectPreview, #Search .searchInputContainer a.dnnSearchBoxClearText, #MobielZoeken .searchSkinObjectPreview, #MobielZoeken .searchInputContainer a.dnnSearchBoxClearText { display:none !important; } /* PANES SECTION */ /* belangerijk voor rondjes.... home */ #Content { z-index: 1; display: block; position: relative; } #MapsPane { min-height:400px; height:400px; } /* ========== LOGO'S ========== */ .WS0 #siteLogo, .WS0 #LogoMob{ background-image:url(images/logo0.png); width:220px; } .WS1 #siteLogo, .WS1 #LogoMob{ background-image:url(images/logo1.png); width:212px; } .WS2 #siteLogo, .WS2 #LogoMob{ background-image:url(images/logo2.png); width:328px; } .WS3 #siteLogo, .WS3 #LogoMob{ background-image:url(images/logo3.png); width:210px; } .WS4 #siteLogo, .WS4 #LogoMob{ background-image:url(images/logo4.png); width:201px; } .WS5 #siteLogo, .WS5 #LogoMob{ background-image:url(images/logo5.png); width:172px; } .WS6 #siteLogo, .WS6 #LogoMob{ background-image:url(images/logo6.png); width:191px; } .WS7 #siteLogo, .WS7 #LogoMob{ background-image:url(images/logo7.png); width:99px; background-position:center center; } .WS8 #siteLogo, .WS8 #LogoMob{ background-image:url(images/logo8.png); width:107px; background-position:center center; } .WS9 #siteLogo, .WS9 #LogoMob{ background-image:url(images/logo9.png); width:229px; background-position:center center; } .WS10 #siteLogo, .WS10 #LogoMob{ background-image:url(images/logo10.png); width:193px; background-position:center center; } .WS11 #siteLogo, .WS11 #LogoMob{ background-image:url(images/logo11.png); width:95px; background-position:center center; } .WS12 #siteLogo, .WS12 #LogoMob{ background-image:url(images/logo12.png); width:199px; background-position:center center; } .WS13 #siteLogo, .WS13 #LogoMob{ background-image:url(images/logo13.png); width:216px; background-position:center center; } .WS14 #siteLogo, .WS14 #LogoMob{ background-image:url(images/logo14.png); width:129px; background-position:center center; } .WS15 #siteLogo, .WS15 #LogoMob{ background-image:url(images/logo15.png); width:148px; background-position:center center; } .WS16 #siteLogo, .WS16 #LogoMob{ background-image:url(images/logo16.png); height:120px; width:247px; background-position:center center; height: 120px; background-size: contain; background-position: left;} .WS17 #siteLogo, .WS17 #LogoMob{ background-image:url(images/logo17.png); width:215px; background-position:center center; } .WS0 #footLogo { width:216px; background-image:url(images/logo0.png); background-size:83% auto; } .WS1 #footLogo { width:212px; background-image:url(images/logo1.png); background-size:83% auto; } .WS2 #footLogo { width:325px; background-image:url(images/logo2.png); background-size:65% auto; background-position-x:45%; } .WS3 #footLogo { width:177px; background-image:url(images/logo3.png); background-size:83% auto; } .WS4 #footLogo { width:195px; background-image:url(images/logo4.png); background-size:83% auto; } .WS5 #footLogo { width:162px; background-image:url(images/logo5.png); background-size:133px auto; } .WS6 #footLogo { width:258px; background-image:url(images/logo6.png); background-size:136px auto; } .WS7 #footLogo { width:106px; background-image:url(images/logo7.png); background-size:85px auto; } .WS8 #footLogo { width:101px; background-image:url(images/logo8.png); background-size:78px auto; } .WS9 #footLogo { width:260px; background-image:url(images/logo9.png); background-size:230px auto; } .WS10 #footLogo { width:226px; background-image:url(images/logo10.png); background-size:193px auto; } .WS11 #footLogo { width:110px; background-image:url(images/logo11.png); background-size:80px auto; } .WS12 #footLogo { width:234px; background-image:url(images/logo12.png); background-size:200px auto; } .WS13 #footLogo { width:223px; background-image:url(images/logo13.png); background-size:182px auto; } .WS14 #footLogo { width:132px; background-image:url(images/logo14.png); background-size:107px auto; } .WS15 #footLogo { width:224px; background-image:url(images/logo15.png); background-size:112px auto; } .WS16 #footLogo { width:212px; background-image:url(images/logo16.png); background-size:181px auto; background-size:contain; } .WS17 #footLogo { width:212px; background-image:url(images/logo17.png); background-size:150px auto; } /* =============================== WIKI VERVOLG ===================================== */ .PageSchoolWiki .WikiTopPane {} .PageSchoolWiki .one-third { /* width:32%; margin-right:4%; */ width: 33%; padding-left: 10px; min-width:270px; padding-right:45px; } .PageSchoolWiki .two-third { padding-left:10px; /* width:64%; */ width:auto; } /* =============================== WIKI MAIN/BANNER ===================================== */ .WikiBanner { text-align:center; background-repeat:no-repeat; background-position: center center; background-size:cover; width: 100vw; max-width: 1400px; overflow: visible; /* buiten 960px width wrapper */ } .WikiBanner h2 { min-height: 50px; } .WikiBanner p.SearchSubTitle { } .PageSchoolWiki #Breadcrumb { display:none; } #seqMain .SchoolWikiWrapper { padding-top:55px; } #dnn_WikiBottomPane { margin-top:30px; padding-bottom: 30px; background-color: transparent; /* kleur via opmaak.css, met boxsh lichtere tint */ box-shadow: 0px 2000px 0px rgb(255,255,255,.75) inset; margin-bottom: -60px; } .WikiBanner .WikiSearchWrapper { display:inline-block; padding:15px; margin:200px 0 0 0; background-color:rgba(255,255,255,.75); text-align:center; } .WikiBanner .WikiSearchWrapper .SearchSubTitle {padding-bottom:20px; font-weight:700; } .WikiBanner .WikiSearchWrapper .SearchContent { position:relative} .WikiBanner .WikiSearchWrapper .SearchContent .CustomSearch { padding:0 10px; font-size:16px; box-sizing:border-box;width:100%; border:0; border-bottom:2px solid #101a5f; height: 40px; /* voor IE, 16-11-18 */ /* background-color:transparent; */ line-height:40px;} .WikiBanner .WikiSearchWrapper .SearchContent .CustomSearch:focus { outline:none; background-color:#fff; border-bottom:2px solid #000;} .WikiBanner .WikiSearchWrapper .CustomSubmit { position:absolute; right:3px; top:-3px;} .CustomSubmit:after{content:"\f4a4"; font-family:"Ionicons"; font-size:28px; cursor:pointer;} .CustomSubmit:hover {color:#eb5d40} .PageSchoolWiki span[id*="blNoMoreCriteria"] {display:none} /* .Popviewer {Padding:20px 0; } */ .Popviewer .InnerWrapper { padding:15px 0px; width:85%; } .Popviewer .pubLinkWrapper .pubLink { display:inline-block; padding:0 15px 0 0; } .Popviewer .pubLinkWrapper .pubLink:before { content:"ยป"; } .HiddenSideBar { display:none; } .CustomSearchSideWrapper {background-color:#eee; padding:20px 10px 20px 20px;} .CustomSearchSideWrapper .CustomSearch { box-sizing:border-box; padding:0 5px; line-height:30px; width:calc(100% - 45px); display:inline-block; vertical-align:middle; } .CustomSearchSideWrapper .CustomSubmit { display:inline-block; width:40px; height:30px; text-align:center; line-height:30px; vertical-align:middle; } .SchoolWiki {} .SchoolWiki .subLevel{ list-style:none; /* overflow:hidden; */ margin:0; padding:0;} .SchoolWiki .subLevel .item{ display:block; width:30.666%; float:left; margin-right:4%; margin-bottom:20px; } .SchoolWiki .subLevel .item a {transition:all 0.3s ease; /* background-color:#94c01e; border:3px solid #0e9ad7; */ color:#fff!important; white-space:nowrap; /* overflow:hidden; */ box-sizing:border-box; text-overflow:ellipsis; display:block; line-height:60px; padding:0 15px; color:#fff; font-size:18px; font-weight:bold;} .SchoolWiki .subLevel .item a:hover { } /* .SchoolWiki .subLevel .item:nth-of-type(4n+1) a{ background-color:#94c01e; border:3px solid #0e9ad7 } .SchoolWiki .subLevel .item:nth-of-type(4n+2) a{ background-color:#0e9ad7; border:3px solid #bcd873 } .SchoolWiki .subLevel .item:nth-of-type(4n+3) a {background-color:#12a437; border:3px solid #94c01e } .SchoolWiki .subLevel .item:nth-of-type(4n) a{ background-color:#e85122; border:3px solid #d9effa } */ .SchoolWiki .subLevel .item:nth-of-type(3n){ margin-right:0; } .pubArticleList {padding-bottom:20px;} #icr_sidebar .OuterNavBlock.pm_block.sb_tagcloud { display:none; } /* STIJLING / OPMAAK HUISTIJL / RSP #Form .WikiBanner { display: block; margin: 0px auto; text-align:center; background-position:center 30%; background-repeat:no-repeat; background-size:0px 0px;padding:0px; width:90%; } #Form .WikiSearchWrapper { display:block; margin-top:0px; padding-top:200px; background-image:inherit; background-repeat:no-repeat; background-size:auto 180px;background-position:center top; } #Form .WikiSearchWrapper > div { max-width:480px; display:block; margin:0px auto; } #Form .WikiSearchWrapper > .SearchContent { max-width:360px; background:#fffadf!important; box-shadow: 0px 0px 0px 4px #fffadf, 0px 0px 0px 7px #1c3f93; } #Form .WikiBanner .WikiSearchWrapper .SearchContent .CustomSearch { border-bottom:none!important; } #Form .WikiBanner .WikiSearchWrapper .SearchContent .CustomSubmit:after { font-size:32px; color:#1c3f93; font-weight:700; top: -5px; position: relative; right: 5px; } */ .isHome #Breadcrumb {display:none} /* ========== VLAKKEN ========== */ .CMS, .one-half, .one-third, .two-third, .isSeq #SubMenu, .isSeq #seqMainCMS { float:left; box-sizing:border-box; -webkit-box-sizing:border-box; } .isHome .two-third { width:590px; } .isHome .one-third { width:325px; margin-right:0px; float:right; } .CMS { display:inline-block; position:relative; } .CMS50p { width:50%; } .CMS33p { width:33%; } .CMSwid { width:100%; } #hR1a { width:401px; } #hR1b { width:252px; } .WS17 #hR1a { width:33%; } .WS17 #hR1b { width:33%; } .WS0 #hR1a { width:450px; } .WS0 #hR1b { width:215px; } .WS0 #hR1c { width:215px; } .isSeq #SubMenu { width:320px; padding-left:10px; } .isSeq #seqMainCMS { width:100%; } .isSeq.topHasKids #seqMainCMS { max-width:620px; } /* 940-320 = 620 */ .siteNoLeftMenu .isSeq #seqMainCMS { xxxwidth:100%; } /* .blokL,.blokR { float:left; box-sizing:border-box; -webkit-box-sizing:border-box; } .blokL { width:50%; } .blokR { width:50%; } .blokL .BLOK {float:right; } .BLOK { padding-left:25px; padding-right:25px; width:440px; } */ .EQHeight, .EQHeight2 { min-height:0;} .webSlogan { color:#fff; font-family: 'Finger Paint', cursive; font-size:35px; min-height:55px; } /* ================================================================================ PANES SPECIFIEKE STYLING ================================================================================ */ #homeRij1 .InnerWrapper { } #HRvoorRij1b, #HRvoorRij1c { display:none; } .row3 {padding:45px 0;} .SchoolFilmPane, .NieuwsBriefPane, .TwitterPane {padding:25px 0 0 0;} #homeRij3 { background:#ffffff; padding:25px 0 35px 0; } /* ================================================================================ OPMAAK HEADER ================================================================================ */ /* ================================================================================ PANES ================================================================================ */ .WideWrapper { display:block; clear:both; padding:25px 0px 35px 0px; } /* margin-top : positie stippellijn @home,schoolnieuws */ .siteNotResp.siteLeftMenu #seqMainCMS.two-third /* HEEFT LEFT MENU BAR ... */ { margin-left:50px; } /* ================================================================================ TOP ROW ================================================================================ */ #RijTop { min-height:43px; } #RijTop .InnerWrapper { height:inherit; min-height:inherit; } #RijTopL, #RijTopR { float:left; width:50%; } #RijTopL { max-width:142px; } /* drie knoppen */ #RijTopR { white-space:nowrap; } /* no break */ #RijTop .SM { float:left; display:block; margin-right:6px; margin-top:7px; width:27px; height:27px; border-radius:50%; font-family: "Ionicons"; line-height:27px; text-align:center; color:#ffffff; box-shadow:0px 0px 0px 1px rgba(255,255,255,.5) inset, 1px 1px 3px 0px rgba(0,0,0,.33) inset; box-shadow:0px 0px 0px 1.5px rgba(255,255,255,.5) inset, 1px 1px 3px 0px rgba(0,0,0,.33) inset; } #SM1 { background:#39bfd4; font-size:17px; } #SM2 { background:#0071b9; font-size:19px; } #SM3 { background:#d03518; font-size:15px; line-height:29px; } #RijTop .SM:hover { box-shadow:0px 0px 0px 2px #ffffff; background:#ffffff; } #RijTop #SM1:hover { color:#39bfd4; } #RijTop #SM2:hover { color:#0071b9; } #RijTop #SM3:hover { color:#d03518; } #RijTopR { text-align:right; float: right; } #RijTopR a { color:#ffffff; font-size:13px; line-height:30px; margin-top:5px; height:30px; display:inline-block; padding:0px 7px; font-weight:900; } #RijTopR span { font-weight:900; } #RijTopR a:hover { background:#ffffff; } .WS1 #RijTopR a:hover { color:#eb5d40; } /* PALET */ .WS2 #RijTopR a:hover { color:#39bed3; } .WS17 #RijTopR a:hover { color:#39bed3; } /* ================================================================================ ROW LOGO ================================================================================ */ #RijLogo { min-height:135px; } #RijLogo .InnerWrapper { min-height:inherit; } #wijZijn { display:block; position:absolute; right:10px; top:48px; } #wijZijn,#wijZijnMob { height:40px; width:220px; background:url(images/wijzijn_viviani.png) no-repeat center center; } .WS17 #wijZijn { display:none;} .WS17 #wijZijn,#wijZijnMob {display:none;} #wijZijnMob { width:100%; } /* ================================================================================ BANNER ================================================================================ */ /* flickity */ .flickity-enabled { position: relative;} .flickity-enabled:focus { outline: none;} .flickity-viewport { overflow: hidden; position: relative; height: 100%;} .flickity-slider { position: absolute; width: 100%; height: 100%;} /* draggable */ .flickity-enabled.is-draggable { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: -webkit-grab; cursor: grab;} .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: -webkit-grabbing; cursor: grabbing;} /* ---- page dots ---- */ .flickity-page-dots { position: absolute; width: 100%; bottom: 25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1;} .flickity-rtl .flickity-page-dots { direction: rtl;} .flickity-page-dots .dot { display: inline-block; width: 10px; height: 10px; margin: 0 6px; background: #fff; border-radius: 50%; cursor: pointer; border:2px solid #fff;} .flickity-page-dots .dot.is-selected { } /* ================================================================================ OPMAAK HOME ================================================================================ */ #ZoekKnop { } #ZoekKnopTrig, #ZoekKnopTrigOff { cursor:pointer; position:absolute; display:block; right:0px; margin-top:4px; /* background:transparent url(images/zoek.png) no-repeat center center; */ font-family: "Ionicons"; margin-left:5px; width:32px; height:32px; line-height:32px; font-size:32px; font-weight:400; text-align:center; color:#fff; } #ZoekKnopTrigOff { display:none; font-size:28px; } #bigZoek #dnn_zkVeld_cmdSearch:after { margin-top:-3px;} #bigZoek #dnn_zkVeld_cmdSearch:after, #ZoekKnopTrig:after /* HANDWERK BK */ { width:12px; height:12px; top:9px; left:9px; display:block; position:absolute; content:" "; border-radius: 50%; box-shadow: -1.75px -1.75px 0 0 #fff; } #bigZoek #dnn_zkVeld_cmdSearch:after { left:8px; } #ZoekKnopTrigOff:hover, #ZoekKnopTrig:hover { background:#ffffff; } #bigZoek #dnn_zkVeld_cmdSearch:hover { transform:scale(1.1); } .isHome h1 { margin-bottom:10px; font-size:30px; } .isHome h2 { font-size:27px; font-weight:normal; letter-spacing:-1px; margin-bottom:0px; } /* Kom eens langs ... */ #hR1a .DNNModuleContent { width:inherit; } #hR1b .DNNModuleContent { width:inherit; } #hR1c .DNNModuleContent { width:243px; height:85px; } .WS0 #hR1b .DNNModuleContent, .WS0 #hR1c .DNNModuleContent { width:214px; height:85px; } #hR1a, #hR1b { } #homeRij1 h1 { line-height:60px!important; margin-bottom:20px!important; } .WS1 #hR1a h1 { color:#eb5d40;} .WS2 #hR1a h1 { color:#39bfd4;} .WS1 #hR1b h1 { color:#7f939e;} .WS2 #hR1b h1 { color:#0071b9;} #homeRij1 h1 div { content:" "; width:57px; height:57px; margin-right:20px; margin-left:20px; display: block; float: left; margin-right: 19px; background-repeat:no-repeat; background-position:center bottom; } /* #hR1a h1 div { background-image:url(images/h1_deco_news.png); } #hR1b h1 div { background-image:url(images/h1_deco_agenda.png); } */ #homeRij1 h1 div { background-repeat:no-repeat; } #hR1a h1 div { background-position:top left; } #hR1b h1 div { background-position:top right; } .WS1 #homeRij1 h1 div { background-image:url(images/rij1_deco_w1.png); } .WS2 #homeRij1 h1 div { background-image:url(images/rij1_deco_w2.png); } .WS3 #homeRij1 h1 div { background-image:url(images/rij1_deco_w3.png); } .WS4 #homeRij1 h1 div { background-image:url(images/rij1_deco_w4.png); } .WS5 #homeRij1 h1 div { background-image:url(images/rij1_deco_w5.png); } .WS6 #homeRij1 h1 div { background-image:url(images/rij1_deco_w6.png); } .WS7 #homeRij1 h1 div { background-image:url(images/rij1_deco_w7.png); } .WS8 #homeRij1 h1 div { background-image:url(images/rij1_deco_w8.png); } .WS9 #homeRij1 h1 div { background-image:url(images/rij1_deco_w9.png); } /* helft zijn PLATTE PSD's - ronding niet 100% */ .WS10 #homeRij1 h1 div { background-image:url(images/rij1_deco_w10.png); } .WS11 #homeRij1 h1 div { background-image:url(images/rij1_deco_w11.png); } .WS12 #homeRij1 h1 div { background-image:url(images/rij1_deco_w12.png); } .WS13 #homeRij1 h1 div { background-image:url(images/rij1_deco_w13.png); } .WS14 #homeRij1 h1 div { background-image:url(images/rij1_deco_w14.png); } .WS15 #homeRij1 h1 div { background-image:url(images/rij1_deco_w15.png); } .WS16 #homeRij1 h1 div { background-image:url(images/rij1_deco_w16.png); } .WS17 #homeRij1 h1 div { background-image:url(images/rij1_deco_w16.png); } #homeRij1 a { overflow:visible; } .WS14 #homeRij1 h1 div { background-image:url(images/rij1_deco_w14.png); } .WS0 #hR1b a, #hR1c a { display:block; color:#ffffff; font-size:25px; font-weight:300; line-height:33px; margin-top:11px; } .WS0 #hR1a { margin-top:11px; } .WS0 #hRb1 a, .WS0 #hRc1 a { margin-top:0px; } #hR1c1 a { margin-top:0px; } .WS0 #hR1b div, #hR1c div { padding:7px 23px; } .WS0 #hR1b span, #hR1c div span { font-weight:700; } #homeRij1 .CMS_h { margin-right:22px; } #homeRij1 .CMS_h .DnnModule { min-height:375px; } .WS0 #homeRij1 .CMS_h .DnnModule { min-height:180px; } /* wid */ .WS0 #homeRij1 #hR1a, .WS0 #homeRij1 #hR1b { margin-right:30px; } .WS0 #homeRij1 #hR1c { margin-right:0px; } #homeRij1 .CMS_h .KNOP { display:inline-block; bottom:0px; position:absolute; transform:translate(3px,37px); } .myHR { width:100%; height:5px; display:block; clear:both; } #HRvoorRij1c, #HRvoorRij00 { display:none!important; } /* voor bestuur: */ #HRvoorOS { display:none; } /* ----------------------- RIJ 2 ------------------- */ #HRvoorRij2 { margin-top:45px; } #homeRij2 { padding:0px; height:90px; } #homeRij2 .InnerWrapper { z-index:9; } /* RSP, over content/maps */ #homeRij2 .i { display:inline-block; float:left; height:90px; margin-top:25px; } .WS4 #homeRij2 .i { height:150px;} #homeRij2 .ii { width:inherit; height:inherit; background-repeat:no-repeat; background-position:center center; } #R2L1 { width:215px; } #R2L2 { width:195px; margin-left:45px; } .WS4 #R2L2 { width:250px;} .WS3 #R2L2 { width:167px; margin-left:45px; } #R2L3 { width:130px; margin-left:55px; } .WS3 #R2L3 { width:167px; margin-left:55px; } .WS10 #R2L3 { width:167px; margin-left:55px; } .WS12 #R2L3 { width:192px; } .WS13 #R2L3{ width:215px; } .WS17 #R2L3, .WS17 #R2L2, .WS17 #R2L4{ width:215px; } #R2L4 { width:130px; margin-left:65px; } #R2L1 .ii { background-image:url(images/rij2_logo1.png); } #R2L2 .ii { background-image:url(images/vivikids.png); background-size:contain; } .WS4 #R2L2 .ii { background-image:url(images/logo17.png); } .WS1 #R2L2 .ii { background-image:url(images/Jiddo.png); } .WS3 #R2L2 .ii { background-image:url(images/Tinten.png) !important; } .WS10 #R2L2 .ii { background-image:url(images/OKCE.png); } .WS12 #R2L2 .ii { background-image:url(images/vivikids-bso-hettalent.png); background-size: contain; transform: scale(1); background-color: #fff; } .WS13 #R2L2 .ii { background-image:url(images/BSO.jpg); } .WS15 #R2L2 .ii { background-image:url(images/Vivikids-Zwaluw2.png); background-size: contain; } .WS17 #R2L2 .ii { background-image:url(images/logo4.png); background-size: contain; } /* Bron */ #R2L3 .ii { background-image:url(images/rij2_logo3.png); } .WS3 #R2L3 .ii { background-image:url(images/Ukenpuk.jpg); } .WS10 #R2L3 .ii { background-image:url(images/Jiddo.png); } .WS12 #R2L3 .ii { background-image:url(images/PeuterSednalogo.png); } .WS13 #R2L3 .ii { background-image:url(images/Dribbel.jpg); } .WS15 #R2L3 .ii { background-image:url(images/paswijs.png); background-size:contain } .WS17 #R2L3 .ii { background-image:url(images/Vivikids-Zwaluw2.png); background-size: contain;} /* Zwaluw */ #R2L4 .ii { background-color:#e0e0e0; transform:scale(.5); } .WS6 #R2L4 .ii { background-image:url(images/bredeschool.jpg); height:inherit; width:inherit; transform:none; background-repeat:no-repeat; background-color:#FFF; } .WS9 #R2L4 .ii { background-image:url(images/De-Veldwachter.jpg); height:inherit; width:inherit; transform:none; background-repeat:no-repeat; background-color:#FFF; } .WS4 #R2L4 .ii { background-image:url(images/Duimelot.PNG); height:inherit; width:inherit; transform:none; background-repeat:no-repeat; background-color:#FFF; } .WS12 #R2L4 .ii { background-image:url(images/kinderopvang-kleinduimpje_logo2.png); transform: scale(1);background-color:#FFF; } .WS13 #R2L4 .ii { background-image:url(images/bredeschool.jpg); height:inherit; width:inherit; transform:none; background-repeat:no-repeat; background-color:#FFF;} .WS15 #R2L4 .ii { background-image:url(images/regio.png); background-size:contain; height:inherit; width:inherit; transform:none; background-repeat:no-repeat; background-color:#FFF;} .WS17 #R2L4 .ii { background-image:url(images/Vivikids-BSO-Talent.png);transform: scale(1); background-color: #fff; background-size: contain; } /* Talent */ .WS15 a{display:inline-block;} .regioimage {padding-top:20px;} .isHome.WS0 H1 { color:#393580; text-align:center; font-weight:normal; font-size:38px; } .isHome.WS0 H1 span { font-weight:bold; } /* ================================================================================ FOOTER ================================================================================ */ /* #Footer { background:#f0f0f0; } #Footer #Logo2 { background-color:#fff; position:absolute; top:0; left:0; max-width:155px; padding:20px 10px; margin-bottom:20px; z-index:911; border-style:solid; border-width:1px; } #Footer #Logo2 a { display:block} #Footer #Logo2 a img { max-width:70%; display:block; margin:0 15%; } #Footer .FooterPane {margin:0 230px; padding-top:13px; color:inherit} #Footer .FooterPane a:link, #Footer .FooterPane a:visited, #Footer .FooterPane a:active {color: inherit} /* xxx #Footer .SocialMediaIcons {position:absolute; top:0; right:0; z-index:911; max-width:230px} */ /* LOGIN */ #Login { display:block; position:absolute; height:5px; width:5px; overflow:visible; bottom:0px; top: auto; transform: translate(10px,15px); z-index:99; } #Login a.LoginKey { font-family: "Ionicons"; opacity:0; transition:opacity 0.3s ease; -webkit-transition:opacity 0.3s ease; margin:0 10px 0 0; font-size:20px; line-height:32px; text-align:center; width:32px; height:32px; display:inline-block; vertical-align:top; zoom:1; *display:inline; color:#fff; border-radius: 0px; border:none; /* background-color:#e30613; border-color:#e30613; box-shadow: 0px 3px 5px rgba(0,0,0,.25); js: .WSjs_KEY */ } #Login a.LoginKey:hover { text-decoration:none; opacity:1;} .LoginKey, .LoginKey:visited, .LoginKey:active { background-image:none!important; } .isHome .ContentPane { xxxpadding:0px!important; } /* --------- GROOTE TEKENING BREEDTE BOTTOM... ---------- */ .isSeq #Content { /*background:transparent url(images/seq_bottom_bg_repX.png) repeat-x center bottom; /* bij resp klein : > url(images/seq_bottom_bg.png) */ } .isSeq .InnerWrapper.SubPanesWrapper { padding-bottom:50px; /*padding-bottom:410px;/* 20px overlap... volgens vormgevers !!! */ /*background:transparent url(images/seq_bottom_bg.png) no-repeat center bottom; background-size:1400px 430px; */ } #homeRij3 { padding-bottom:0px; } #GMapKnop { position: absolute; margin-top: -60px; right:20px; z-index: 99; } #GMapKnop .KNOP { background:#ffffff; } #GMapKnop .KNOP:hover { box-shadow:0px 0px 0px 3px #fff; } #Foot { /* filter:contrast(150%) brightness(125%); on self */ /* -webkit-mask-composite: xor; /* on multiple images applied !!! */ color:#fff; /* height:330px; */ } /* STICKY FOOTER */ body, html ,#Form { height:100%; } #Wrapper { min-height:100%; position:relative; } /* #Content { padding-bottom: 175px; } #Foot { position:absolute; width:100%; display:block; bottom: 178px; } */ #footAdr { width:322px; height:165px; overflow:hidden; background:#009de1; z-index:10; position:absolute; border-radius:6px; display:inline-block; bottom:60px; /* logged in */ } .UserMode0 #footAdr { /* bottom:-14px; /* usermode0 */ } #footAdrInn { margin:4px 0px 0px 4px; width:314px; height:154px; background:#ffffff; border-radius:4px; } .F1 { font-family: 'Gochi Hand', cursive; } #footAdrInn .blok { padding-top:15px; padding-left:26px; line-height:22px; color:#000; font-size:16px; height:22px; } #footAdrInn .blok div { line-height:22px; height:22px; } #footAdrInn .blok .F1.txt { color:#a0c417; font-size:27px; margin-bottom:4px; } #footAdrInn .blok .F1 { font-size:17px; } #FootB { position:absolute; bottom:-178px; width:100%; height:172px; /* of wat meer/minder 6px voor bottom margin !!! */ background-image:url(images/footer_bg.png); background-repeat:repeat; background-position:center bottom; background-size: 1400px auto; margin-bottom:6px; /* is FootC */ /* z-index:9; NEE.. gaat ie over popupkalender... dit zit op heel hoog nivo */ } #FootC { width:100%; height:6px; position:absolute; bottom:0px; box-shadow:0px 6px 0px 0px #fff; /* voorkom evt bg repeat-y bij seq pages */ } #FootBB { height:96px; margin-top:30px; color:#fff; } #FootBB div {font-family: 'Open Sans', serif;font-weight:700;font-size:17px; } #footLogo { height:inherit; background:#ffffff none no-repeat center center; border-radius:15px; } #footLogo { background-size:176px auto; } #FootB1, #FootB2, #FootB3 { float:left; height:inherit; } #FootB1 div, #FootB2 div, #FootB3 div { float:none; display:block; clear: both; } .footWM { margin-left:80px; } /* default */ /* --- desktop: footer width margin, afh van "smal logo of korte naam adres/email" */ .WS1 .footWM { margin-left:110px; } .WS4 .footWM { margin-left:100px; } .WS5 .footWM { margin-left:120px; } .FootB_R1, .FootB_R2 .FootB_R3{ height:47px; line-height:48px; } #FootB3 .if { border-radius:100%; width:33px; height:33px; float:left; margin-left:2px; margin-right:17px; margin-top:7px; /* 47 - 37 50% +2px = 7px margin-top, 2px is outer shadow color... */ background:none no-repeat center center; } #FootB3 .FootB_R1 .if { background-image:url(images/foot_email.png); } #FootB3 .FootB_R2 .if { background-image:url(images/foot_phone.png); } #FootB3 .FootB_R3 .if {font-family: "Ionicons"; color:#fff; font-size:23px; text-align:center;} #Body #FootB3 a:hover .if { box-shadow:0px 0px 0px 3px #ffffff, 2px 2px 3px 0px rgba(0,0,0,.125) inset, 1px 1px 2px 2px rgba(0,0,0,.25); } #footAdres { margin-top:15px; margin-left:238px; width:auto; max-width:400px; display:inline-block; float:left; overflow:visible; font-family: 'Open Sans', serif; font-weight:400; color:#000; font-size:18px; line-height:20px; text-align:left; } #footAdres span { margin-left:10px; margin-right:10px; font-size:22px; line-height:30px; } #footAdres a { color:#fff; } #footAdres a:hover { color:#f1b000; color:#0094d8; background:#fff; box-shadow:0px 0px 0px 3px #fff; border-radius:8px; } /* FB --- footer en home grote knop --- */ .smT_FB, .smT_FB .smTile_fx { background:transparent!important; } #Foot #tegSM_1 { position:absolute; right:0px; top:20px; } #Foot #tegSM_1 .smTile_ico_knop { border-radius:5px; background:#fff!important; color:#0094d8; font-size:58px!important; line-height:70px; font-weight:400; } #Foot #tegSM_1 .smTile_ico_knop span { margin-left:10px; } #Foot #tegSM_1 .smTile_fx { background:#13235b!important; box-shadow:0px 0px 0px 2px #fff inset; border-radius:5px; } /* #Foot #tegSM_1:hover .smTile_ico_knop, #Foot #tegSM_1:active .smTile_ico_knop { visibility:hidden; } */ #Foot #tegSM_9 /* WEBRED */ { margin-top: 22px; margin-left: 25px; } /* ================== TILES DNN-RETURN ================== */ .pubReturnLink { margin:3px; } /* ================== TILES / FIXED CONTROLS ================== */ #fixTiles { position: fixed; z-index: 700; top: 50%; /* margin-top: -55px; > js hoogte blok 50% */ display:none; /* js onload */ /* left: 0; */ right: 5px; transform:translate(80px,0px); transition:transform 0.33s ease 1.5s; } #fixTiles.fixTiles_posLeft { right:auto; left:5px; transform:translate(-80px,0px); } #fixTiles.fixTiles_posTop { top:70px; /* js : top geen % dan margin-top niet aanpassen, deze is precies fixed */ } #fixTiles a.smTile { margin-left:0px; clear:both; margin-bottom:10px; } #fixTiles.show { transform:translate(0px,0px); display:block; } /* =============== TEGEL EFFECT ============= */ a.smTile { width:50px; height:50px; display:inline-block; float:left; margin-left:10px; /* multiple */ } a.smTile .smTile_ico { font-family: "Ionicons"; color:#ffffff; text-align:center; line-height:50px; width:50px; height:50px; display:inline-block; float:left; position:relative; font-size:30px!important; /* defailt */ } a.smTile.smT_FB .smTile_ico { font-size:34px!important; } a.smTile.smT_TW .smTile_ico { font-size:32px!important; } a.smTile.smT_GP .smTile_ico { font-size:34px!important; } a.smTile.smT_LI .smTile_ico { font-size:38px!important; } a.smTile.smT_IG .smTile_ico { font-size:38px!important; } a.smTile.smT_ADM .smTile_ico { font-size:32px!important; } #tegFix3 .smTile_ico { } /* nieuws */ #tegFix4 .smTile_ico { font-size:29px!important; } /* agenda */ #tegFix5 .smTile_ico { font-size:45px!important; } /* contact */ #tegFix6 .smTile_ico { font-size:43px!important; } /* foto's */ /* opmaaken voor tiles voor deze site ... */ a.smTile.smT_site, a.smTile.smT_site .smTile_Expand { border-radius:10px 10px 10px 0px; } a.smTile.smT_site .smTile_ico { font-size:34px!important; } .smT_site, .smT_site .smTile_fx { background:#941b81; } .smT_site, .smT_site .smTile_fx { background:#312a74; } .smT_FB, .smT_FB .smTile_fx { background:#4c75ba; } .smT_TW, .smT_TW .smTile_fx { background:#00acee; } .smT_GP, .smT_GP .smTile_fx { background:#e41319; } .smT_LI, .smT_LI .smTile_fx { background:#0177b5; } .smT_IG, .smT_IG .smTile_fx { background:#947e5f; } .smT_ADM, .smT_ADM .smTile_fx { /* w2w = background:#f58f31; */ background:#e30613; } #tegFix1, #tegFix1 .smTile_fx { background:#941b81; } /* homepage */ /* #tegFix2, #tegFix2 .smTile_fx { background:#941b81; } /* zoeken */ #tegSM_9 { margin-right:30px; } #tegSM_9, #tegSM_9 .smTile_Expand { border-radius:10px; } /* .smT_FB.smTileVerloop .smTile_ico_knop, .smT_FB.smTileVerloop .smTile_fx { box-shadow:0px -25px 15px -5px rgba(0,0,0,.33) inset; } .smT_TW.smTileVerloop .smTile_ico_knop, .smT_TW.smTileVerloop .smTile_fx { box-shadow:0px 15px 10px -5px rgba(255,255,255,.5) inset; } .smT_GP.smTileVerloop .smTile_ico_knop, .smT_GP.smTileVerloop .smTile_fx { background:linear-gradient(170deg, #eb6a52, #e41319, #cf3e29); } .smT_IG.smTileVerloop .smTile_ico_knop, .smT_IG.smTileVerloop .smTile_fx { box-shadow:0px 10px 10px 0px rgba(101,79,65,.5) inset; } .smT_LI.smTileVerloop .smTile_ico_knop, .smT_LI.smTileVerloop .smTile_fx { box-shadow:0px 20px 10px -5px rgba(134,188,213,.75) inset; } */ .smTile_Expand .smTile_fx { width:inherit; height:inherit; transition: all .2s ease; } .smTile_txt { font-family:"Open Sans", sans-serif; font-weight:700; font-size:15px; line-height:50px; color:#ffffff; text-align:right; height:inherit; float:left; width:175px; /* "Volg ons op Facebook" */ } .smTile_Expand { z-index:9999; position:relative; height:inherit; text-align:left; visibility:hidden; overflow:hidden; top:-50px; width: 225px; /* _txt +50 */ } .smTile_txt { text-align:center; } /* .smT_site .smTile_Expand { width:280px; } .smT_site .smTile_txt { width:240px; } */ .smT_FB .smTile_Expand { xxwidth:230px; } .smT_FB .smTile_txt { xxwidth:190px; } .smT_TW .smTile_Expand { width:220px; } .smT_TW .smTile_txt { width:180px; } .smT_IG .smTile_Expand { width:240px; } .smT_IG .smTile_txt { width:200px; } .smT_GP .smTile_Expand { width:220px; } .smT_GP .smTile_txt { width:180px; } .smT_ADM .smTile_Expand { width:170px; } .smT_ADM .smTile_txt { width:130px; } .smTileW150 .smTile_Expand { width:180px!important; } .smTileW150 .smTile_txt { width:150px!important; } .smTileW160 .smTile_Expand { width:190px!important; } .smTileW160 .smTile_txt { width:160px!important; } .smTileW170 .smTile_Expand { width:200px!important; } .smTileW170 .smTile_txt { width:170px!important; } .smTileW180 .smTile_Expand { width:210px!important; } .smTileW180 .smTile_txt { width:180px!important; } .smTileW190 .smTile_Expand { width:220px!important; } .smTileW190 .smTile_txt { width:190px!important; } .smTileW200 .smTile_Expand { width:230px!important; } .smTileW200 .smTile_txt { width:200px!important; } .smTileW210 .smTile_Expand { width:240px!important; } .smTileW210 .smTile_txt { width:210px!important; } .smTileW220 .smTile_Expand { width:250px!important; } .smTileW220 .smTile_txt { width:220px!important; } .smTileW230 .smTile_Expand { width:260px!important; } .smTileW230 .smTile_txt { width:230px!important; } .smTileW240 .smTile_Expand { width:270px!important; } .smTileW240 .smTile_txt { width:240px!important; } .smTileW250 .smTile_Expand { width:280px!important; } .smTileW250 .smTile_txt { width:250px!important; } .smTileW260 .smTile_Expand { width:290px!important; } .smTileW260 .smTile_txt { width:260px!important; } .smTileW270 .smTile_Expand { width:300px!important; } .smTileW270 .smTile_txt { width:270px!important; } a.smTile .smTile_Expand .smTile_ico { position:absolute; float:none; position:absolute; right:5px; } a.smTile:hover div, a.smTile:active div {visibility:visible; } a.smTile:hover .smTile_Expand .smTile_fx, a.smTile:active .smTile_Expand .smTile_fx { transform: translate(0px,0)!important; } a.smTile.TEASE div{visibility:visible; } a.smTile.TEASE .smTile_Expand .smTile_fx { transform: translate(0px,0)!important; } /* --- Right expand --- */ .smTile_expR .smTile_Expand .smTile_fx { transform: translate(-175px,0); } /* als _txt, neg */ /* --- Left expand --- */ /* tile verdwijnt */ a.smTile.smTile_expL .smTile_Expand .smTile_ico { right:0px; xxdisplay:none!important; } a.smTile.smTile_expL .smTile_Expand .smTile_fx { xxmargin-left:35px!important; } a.smTile.smTile_expL .smTile_Expand .smTile_txt { xxxwidth:inherit!important; } a.smTile.smTile_expL .smTile_Expand { margin-left:20px; } a.smTile.smTile_expL .smTile_Expand { xxleft:-175px; } /* als _txt */ a.smTile.smTile_expL .smTile_Expand .smTile_fx { xxtransform: translate(175px,0); } /* als _txt */ /* a.smTile.smTile_expL.smT_GP .smTile_Expand { left:-170px; } */ a.smTile.smTileW150.smTile_expL .smTile_Expand { left:-150px; } a.smTile.smTileW150.smTile_expL .smTile_Expand .smTile_fx { transform: translate(150px,0); } a.smTile.smTileW160.smTile_expL .smTile_Expand { left:-160px; } a.smTile.smTileW160.smTile_expL .smTile_Expand .smTile_fx { transform: translate(160px,0); } a.smTile.smTileW170.smTile_expL .smTile_Expand { left:-170px; } a.smTile.smTileW170.smTile_expL .smTile_Expand .smTile_fx { transform: translate(170px,0); } a.smTile.smTileW180.smTile_expL .smTile_Expand { left:-180px; } a.smTile.smTileW180.smTile_expL .smTile_Expand .smTile_fx { transform: translate(180px,0); } a.smTile.smTileW190.smTile_expL .smTile_Expand { left:-190px; } a.smTile.smTileW190.smTile_expL .smTile_Expand .smTile_fx { transform: translate(190px,0); } a.smTile.smTileW200.smTile_expL .smTile_Expand { left:-200px; } a.smTile.smTileW200.smTile_expL .smTile_Expand .smTile_fx { transform: translate(200px,0); } a.smTile.smTileW210.smTile_expL .smTile_Expand { left:-210px; } a.smTile.smTileW210.smTile_expL .smTile_Expand .smTile_fx { transform: translate(210px,0); } a.smTile.smTileW220.smTile_expL .smTile_Expand { left:-220px; } a.smTile.smTileW220.smTile_expL .smTile_Expand .smTile_fx { transform: translate(220px,0); } a.smTile.smTileW230.smTile_expL .smTile_Expand { left:-230px; } a.smTile.smTileW230.smTile_expL .smTile_Expand .smTile_fx { transform: translate(230px,0); } a.smTile.smTileW240.smTile_expL .smTile_Expand { left:-240px; } a.smTile.smTileW240.smTile_expL .smTile_Expand .smTile_fx { transform: translate(240px,0); } a.smTile.smTileW250.smTile_expL .smTile_Expand { left:-250px; } a.smTile.smTileW250.smTile_expL .smTile_Expand .smTile_fx { transform: translate(250px,0); } a.smTile.smTileW260.smTile_expL .smTile_Expand { left:-260px; } a.smTile.smTileW260.smTile_expL .smTile_Expand .smTile_fx { transform: translate(260px,0); } a.smTile.smTileW270.smTile_expL .smTile_Expand { left:-270px; } a.smTile.smTileW270.smTile_expL .smTile_Expand .smTile_fx { transform: translate(270px,0); } /* --- Center expand --- */ a.smTile.smTile_expC:hover .smTile_Expand .smTile_fx, a.smTile.smTile_expC:active .smTile_Expand .smTile_fx { transform: scaleX(1); } a.smTile.smTile_expC .smTile_Expand { left:-88px; } /* als _txt , 50% */ a.smTile.smTile_expC .smTile_Expand .smTile_fx { transform: scaleX(0); transition: all .2s linear; } a.smTile.smTile_expC .smTile_txt { float:right; text-align:left; } a.smTile.smTile_expC .smTile_fx .smTile_ico { float:right; } /* --- Top expand --- */ .smTile_expT .smTile_Expand { transform: rotate(-90deg); transform-origin:25px 25px; /* 50px van blok */ } .smTile_expT .smTile_Expand .smTile_fx { transform: translate(-175px,0); /* ????? */ } /* als _txt, neg */ /* --- Top/schuin 30deg expand --- */ .smTile_expTS .smTile_Expand { top:-65px; left:-5px; box-shadow:-5px 5px 10px 0px rgba(0,0,0,.3); transform: rotate(-30deg); transform-origin:25px 25px; /* 50px van blok */ } .smTile_expTS .smTile_Expand .smTile_fx { transition: transform .15s ease; transform:scale(.25); } /* als _txt, neg */ /* --- Top/schuin 15deg expand --- */ .smTile_expTSS .smTile_Expand { top:-70px; box-shadow:-5px 5px 10px 0px rgba(0,0,0,.3); transform: rotate(-15deg); transform-origin:25px 25px; /* 50px van blok */ } .smTile_expTSS .smTile_Expand .smTile_fx { transition: transform .15s ease; transform:scale(.25); } /* als _txt, neg */ /* --- Bottom/schuin expand --- */ .smTile_expBS .smTile_Expand { top:40px; left:-157px; box-shadow:-5px 5px 10px 0px rgba(0,0,0,.3); transform: rotate(-30deg); transform-origin:25px 25px; /* 50px van blok */ } .smTile_expBS .smTile_Expand .smTile_fx { transition: transform .15s ease; transform:scale(.25); } /* als _txt, neg */ /* --- Schuin expand algemeen EFFECT, knop donkerder --- */ /* TODO alg via spec klas > hover knop donkerder [2] ook hover over vlak */ a.smTile.smTile_expTS:hover .smTile_ico_knop, a.smTile.smTile_expTS:active .smTile_ico_knop, a.smTile.smTile_expBS:hover .smTile_ico_knop, a.smTile.smTile_expBS:active .smTile_ico_knop { box-shadow:0px -50px 0px 0px rgba(0,0,0,.25) inset; } a.smTile.smT_ADM:hover, a.smTile.smT_ADM:active { } a.smTile.smT_ADM:hover .smTile_ico_knop, a.smTile.smT_ADM:active .smTile_ico_knop { box-shadow:none; background:#c51a1b; border-radius:10px; } .smTile_Expand .smTile_fx { } /* ============= DISALE TILES =============== via js functie "disableTegels_zelfdeLink()" herkend dat ie zelfde link heeft, dan disablen of evt zelf via js/aspx toevoegen */ a.smTileDis { background:rgba(128,128,128,.67)!important; } a.smTileDis .smTile_fx { background:#707070!important; } a.smTileDis .smTile_Expand { display:none!important; } /* ==== HAMB MENU FOOTER, ICON FACEBOOK MET EFFECT ==== */ #MobileMenuFB { display:inline-block; margin-top:5px; margin-left:5px; width:40px; height:40px; line-height:40px; font-size: 30px; color:#fff; text-align:center; width:auto; transform:translate(-175px,0); transition:transform 0.33s ease; } #MobileMenuFB1 { font-size: 15px; font-weight: bold; padding-left:10px; margin:0px -10px 0px 0px; vertical-align:top; width:170px; display:inline-block; visibility:hidden; } #MobileMenuFB2 { width:40px; height:40px; line-height:40px; font-size: 30px; display:inline-block; font-family: "Ionicons"; background: #4c75ba; } #MobileMenuFB:hover { transform:translate(0px,0); background: #4c75ba; padding-right:3px; margin-right:10px; } /* marg: geen hover aan/uit bij transistion */ #MobileMenuFB:hover #MobileMenuFB1 { visibility:inherit; margin-right:-19px; } /* "F" dichtbij tekst */ #MobileMenuFB:hover #MobileMenuFB2 { background:transparent;} #dnn_ctr37940_ViewLoader_lblMessage { font-family:'Bree Serif', serif; color:#fff; padding:20px; line-height:60px; } /*SocialMedia*/ /* .SocialMediaIconsPane{ display:inline-block; vertical-align:top} .SocialMediaIcons {padding-top:10px; color:#fff;} .SocialMediaIcons .SocialMediaIcon {font-family: "Ionicons"; margin:0 10px 0 0;border-width:2px; border-style:solid; font-size:18px; background-color:#fff; border-radius:50%; line-height:27px; text-align:center; width:27px; height:27px; display:inline-block; vertical-align:top; zoom:1; *display:inline; } .SocialMediaIcons .SocialMediaIcon[title="facebook"] { font-size:24px; line-height:29px;} .SocialMediaIcons .SocialMediaIcon:hover { text-decoration:none; color: inherit; border-color: currentColor} */ /* ================================================================================ MENU'S ================================================================================ */ #MenuHolder { min-height:40px; display:inline-block; position:relative; width:100%; clear:both; } #MenuHolder .InnerWrapper { } #Menu { } #Menu { z-index:1001; /* padding-top:75px; float:right; */ width:100%; } /* =================== RADMENU =================== */ /* === Root Items === */ .RadMenu_MainMenu { z-index: 910 !important; background-color:transparent!important; } .RadMenu_MainMenu .rmRootGroup .rmItem { margin: 0px; padding: 0px; margin-right: 12px; } .RadMenu_MainMenu .rmRootGroup .rmItem .rmLink { margin: 0px; padding: 0px; cursor:pointer; text-decoration: none; } .RadMenu_MainMenu .rmRootGroup .rmItem .rmLink .rmText { margin: 0px; padding:0; text-align:center; display: block; white-space: nowrap; background:inherit; text-transform:lowercase; height:32px; line-height:32px; overflow:hidden; margin:4px 0px 0px 0px; padding:0px 8px 0px 8px; font-family: 'Open Sans', serif; font-size:17px; font-weight:700; color:#ffffff; } .WS12 .RadMenu_MainMenu .rmRootGroup .rmItem .rmLink .rmText { padding:0px 8px 0px 7px; } /* HOME knop grafisch .RadMenu_MainMenu.MainMenuL .rmItem:nth-child(1) .rmRootLink .rmText { color:transparent; width:35px!important; font-size:0px; background-image:url(images/menu_home2.png)!important; background-repeat:no-repeat!important; background-position:center center!important; }*/ /* LEFT / RIGHT SPLIT */ .RadMenu_MainMenu { float:left; } .RadMenu_MainMenu .rmRootGroup .rmItem .rmLink .rmText { transition:transform 0.1s ease; } .RadMenu_MainMenu .rmRootGroup .rmItem .rmLink:hover .rmText{ } .RadMenu_MainMenu .rmRootGroup .rmItem .rmLink:hover .rmText:after { } .RadMenu_MainMenu .rmRootGroup .rmItem .rmSelected .rmText { } /* === Sub Items === */ .RadMenu_MainMenu .rmSlide { margin-top:15px; } .RadMenu_MainMenu .rmSlide .rmSlide { margin-top:-7px; margin-top:-7.5px; margin-left:5px; margin-right:5px; } .RadMenu_MainMenu .rmGroup { border-width:3px; border-style:solid; border-color:transparent; } .RadMenu_MainMenu .rmGroup .rmItem { margin: 0px; padding: 0px; } .RadMenu_MainMenu .rmGroup .rmItem .rmLink { margin: 0px; padding: 0px; cursor:pointer; text-decoration: none; box-shadow:none; } .RadMenu_MainMenu .rmGroup .rmItem .rmLink .rmText { margin: 0px 5px; padding:0 20px 0px 9px; display: block; white-space: nowrap; min-width:130px; background:transparent!important; line-height:32px; height:auto; min-height:32px; width:auto; text-align:left; color:#ffffff; } .RadMenu_MainMenu .rmGroup .rmItem.rmFirst > .rmLink { padding-top:10px; } .RadMenu_MainMenu .rmGroup .rmItem.rmLast > .rmLink { padding-bottom:10px; } .RadMenu_MainMenu .rmGroup .rmItem .rmSelected .rmText { } .RadMenu_MainMenu .rmRootGroup > .rmItem .rmLink .rmText:hover, .RadMenu_MainMenu .rmRootGroup > .rmItem .rmLink .rmText:active { background-color:#fff!important; color:#1d1d1b; } .RadMenu_MainMenu .rmGroup .rmItem .rmLink .rmText:hover { xxbackground-color:#fff!important; } /* ================================================================================================================== RADPANELBAR (SEQ PAGES) ================================================================================================================== */ .RadPanelBar_MainMenu { z-index:910 !important; padding:0px!important; border:0px!important; background:transparent; } #dnn_LeftNarrowPane #icr_sidebar { display:block; } .RadPanelBar .rpExpandable .rpExpandHandle, .RadPanelBar .rpExpanded .rpExpandHandle { display:none!important; } /* .sb_categorieslist naar .pm_block */ #dnn_LeftNarrowPane .pm_block ul.pm_block_normallist, .RadPanelBar_MainMenu .rpRootGroup { margin:0px !important; padding:0px !important; border:0px !important; } .RadPanelBar_MainMenu .rpRootGroup .rpItem { margin:0px !important; padding:0px !important; border:0px !important; } #dnn_LeftNarrowPane .pm_block ul.pm_block_normallist li, .RadPanelBar_MainMenu .rpRootGroup .rpItem .rpLink { margin:0px !important; padding:0px !important; border:0px !important; cursor:pointer; } .RadPanelBar_MainMenu .rpRootGroup .rpItem .rpLink .rpOut { margin:0px !important; padding:0px !important; border:0px !important; display:block;} #dnn_LeftNarrowPane .pm_block ul.pm_block_normallist a, .RadPanelBar_MainMenu .rpRootGroup .rpItem .rpLink .rpOut .rpText { margin:0px !important; border:0px !important; display:block; white-space:normal; font-size:17px; min-height:18px; xxxfont-family: 'Lato', sans-serif; font-size: 20px; letter-spacing: normal !important; line-height:22px; padding:0px 0px 13px 0px!important; /* same lineheight as topmenu dropdown 35px.. measurement in PS */ background-color:transparent!important; } .RadPanelBar_MainMenu .rpGroup .rpItem .rpLink .rpOut .rpText { } /* -------- background on selected/hover -------- */ .RadPanelBar_MainMenu .rpRootGroup .rpItem .rpLink .rpOut .rpText:hover, .RadPanelBar_MainMenu .rpRootGroup .rpItem .rpLink .rpOut .rpText:active, #Wrapper .pm_block ul.pm_block_normallist li a:hover, #Wrapper .pm_block ul.pm_block_normallist li a:active { text-decoration:none !important; } .RadPanelBar_MainMenu .rpRootGroup .rpItem .rpSelected .rpOut .rpText { text-decoration:none !important; } /* -------- subitems stylen -------- */ .RadPanelBar_MainMenu .rpGroup { margin:0px !important; padding:0px !important; border:0px !important; } .RadPanelBar_MainMenu .rpGroup .rpItem { margin:0px !important; padding:0px 0px 0px 0px !important; border:0px !important; } .RadPanelBar_MainMenu .rpGroup .rpItem .rpLink { margin:0px !important; padding:0px !important; border:0px !important; cursor:pointer; } .RadPanelBar_MainMenu .rpGroup .rpItem .rpLink .rpOut { margin:0px !important; padding:0px !important; border:0px !important; display:block;} .RadPanelBar_MainMenu .rpGroup .rpItem .rpLink .rpOut .rpText { margin:0px !important; border:0px !important; display:block; white-space: normal; } .RadPanelBar_MainMenu .rpGroup .rpItem .rpLink .rpOut .rpText:before { content:"\f21b"; font-family: "Ionicons"; font-size: 7px; margin:0px 5px 0px 1px; position: relative; top:-2px; } .RadPanelBar_MainMenu .rpGroup .rpItem .rpLink .rpOut .rpText:hover { text-decoration:none !important;} .RadPanelBar_MainMenu .rpGroup .rpItem .rpSelected .rpOut .rpText { } /* ================================================================================ NEW DNN:RADMENU ================================================================================ */ #Menu { position:relative; z-index:960; isolation:isolate; padding:0; } .DesktopMenu .RadMenu_MainMenu .rmHorizontal{white-space: nowrap; position:relative; display: flex;} .DesktopMenu .RadMenu_MainMenu ul, .DesktopMenu .RadMenu_MainMenu li { margin:0px; padding:0px; list-style:none;} /* !!!!!!!!!! Fake RadMenu */ /* --ROOT-- */ .DesktopMenu .rmHorizontal .rmSlide {display:block !important; box-sizing:border-box; z-index:111; top:100%; left:0; overflow:hidden; height:0; position: absolute; } .DesktopMenu .rmHorizontal.rmRootGroup > .rmItem.rmLast > .rmSlide {left:auto; right:0} .DesktopMenu .rmHorizontal .rmGroup {opacity:0; transition:opacity 0.3s ease, transform 0.3s ease; transform:translate(0,0px); } .DesktopMenu .rmHorizontal .rmItem {margin: 0 12px 0 0; padding: 0px; position: relative; clear: none; } .DesktopMenu .rmHorizontal .rmItem .rmLink { cursor: pointer; text-decoration: none; display:block; margin: 0px; padding: 0px; } .DesktopMenu .rmHorizontal .rmItem .rmLink .rmText{width:100%; box-sizing: border-box; padding:0px 10px; line-height: 30px; font-size: 17px; display: block; white-space: nowrap; } /*first,last,only*/ .DesktopMenu .rmHorizontal .rmItem.rmFirst{} .DesktopMenu .rmHorizontal .rmItem.rmLast {} .DesktopMenu .rmHorizontal .rmItem.rmOnly {} /*expanded,hover,selected,breadcrumb*/ .DesktopMenu .rmHorizontal.rmRootGroup .rmItem:has(.rmSlide:hover) > .rmLink > .rmText {} .DesktopMenu .rmHorizontal.rmRootGroup .rmItem:hover > .rmLink .rmText { } .DesktopMenu .rmHorizontal.rmRootGroup > .rmItem.rmSelected > .rmLink > .rmText { } .DesktopMenu .rmHorizontal.rmRootGroup > .rmItem.rmBreadcrumb > .rmLink > .rmText { } /*--SUB--*/ .DesktopMenu .rmHorizontal .rmLevel0 .rmGroup {transform:translate(-20px, 0px); } .DesktopMenu .rmHorizontal .rmItem:hover > .rmSlide { overflow:visible; height:auto; transform:translate(0px, 0px); padding:0px; border-radius:15px; padding-top: 15px;} .DesktopMenu .rmHorizontal .rmItem:hover > .rmSlide > .rmGroup {opacity:1; transform:translate(0px, 0px);} .DesktopMenu .rmHorizontal .rmSlide .rmItem:hover .rmSlide {left:100%; top:0; padding: 8px 0 0 0!important; } .DesktopMenu .rmHorizontal .rmGroup .rmItem {width:100%; margin:0;/* background-color: red; */ } .DesktopMenu .rmHorizontal .rmGroup .rmItem .rmLink {margin:0; padding:0; width:100%; display:block;} .DesktopMenu .rmHorizontal .rmGroup .rmItem .rmLink .rmText{ padding:0 10px !important; min-width:175px; line-height:34px; font-size:17px; padding:0 30px; white-space:nowrap; border-left-width: 3px;border-left-style: solid; border-right-width: 3px;border-right-style: solid;} /*first,last,only*/ .DesktopMenu .rmHorizontal .rmGroup .rmItem.rmFirst {} .DesktopMenu .rmHorizontal .rmGroup .rmItem.rmFirst > .rmLink > .rmText{border-top-width: 3px; border-top-style: solid} .DesktopMenu .rmHorizontal .rmGroup .rmItem.rmLast > .rmLink > .rmText{border-bottom-width: 3px; border-bottom-style: solid; } .DesktopMenu .rmHorizontal .rmGroup .rmItem.rmOnly > .rmLink > .rmText{} /*expanded,hover,selected,breadcrumb*/ .DesktopMenu .rmHorizontal .rmGroup .rmItem:has(.rmSlide:hover) > .rmLink > .rmText {} .DesktopMenu .rmHorizontal .rmGroup .rmItem:hover > .rmLink .rmText {} .DesktopMenu .rmHorizontal .rmGroup .rmItem.rmSelected > .rmLink > .rmText {} .DesktopMenu .rmHorizontal .rmGroup .rmItem.rmBreadcrumb > .rmLink > .rmText {} .DesktopMenu .rmSlide{margin:0; } /* !!!!!!!!!! Fake Panelbar / submenu */ #Wrapper .DesktopMenu ul.rmRootGroup.rmVertical {width:100%; position: relative; z-index: 100; } #Wrapper .DesktopMenu .rmVertical .rmSlide {position:static} #Wrapper .DesktopMenu .rmVertical .rmGroup{transform:translateY(0px); transform:translateX(0px);} #Wrapper .DesktopMenu .rmVertical .rmGroup .rmItem {height:35px} #Wrapper .DesktopMenu .RadMenu ul.rmRootGroup{ background-color:transparent; border:0; /* margin-top:25px; */} #Wrapper .DesktopMenu .rmVertical .rmItem {padding:0 0} #Wrapper .DesktopMenu .rmVertical .rmItem .rmLink {padding:0;margin:0;} #Wrapper .DesktopMenu .rmVertical .rmItem .rmLink .rmText{ margin:0;padding:0 0 13px 0;/* min-width:100px; */background-color:transparent !important; font-size:17px; text-align: left; line-height: 22px; font-size: 20px; font-weight: 400; height:22px } #Wrapper .DesktopMenu .rmVertical .rmSlide {display:none !important} #Wrapper .DesktopMenu .rmVertical .rmItem.rmBreadcrumb > .rmSlide {display:block !important; height:auto; } #Wrapper .DesktopMenu .rmVertical .rmItem.rmBreadcrumb > .rmSlide > .rmGroup {opacity:1} /*sub*/ #Wrapper .DesktopMenu .rmVertical .rmSlide .rmItem {padding-left:20px;} /*expanded,hover,selected,breadcrumb */ #Wrapper .DesktopMenu .rmVertical .rmItem .rmLink:hover { text-decoration:none !important} #Wrapper .DesktopMenu .rmVertical .rmItem:has(.rmSlide:hover) > .rmLink > .rmText { } /* ================================================================================ DNN AGENDA STYLING ================================================================================ */ #Body .RadCalendar_Default .rcMainTable th, #Body .RadCalendar_Default .rcMainTable td a { color:#000000; } #Body .RadCalendar_Default .rcMainTable td.rcSelected a { color:#ffffff; } #Body .RadCalendar.RadCalendar_Default.WSjs_KEY { xxtransform: scale(1.25); xxtransform-origin:25% -25px; } .RadPicker_Default .rcCalPopup { } #Body .RadCalendar_Default tr { background:#ffffff; } /* .WSjs_KEY op _Default */ #Content .RadAjaxPanel .CommandButton { transition:none!important; /* table... gaat bewegen... bij toeven clases */ margin-top:0px; /* vaak witruimte ingesteld, nu op 0, net als pickup datum veld */ } #Wrapper #seqMain .rcCalPopup.rcCalPopupInn { opacity: 1!important; margin-left: 10px; text-indent: 0px; font-size: 28px; } #Wrapper #seqMain .rcCalPopup.rcCalPopupInn, .EventBkArr { font-family: "Ionicons"; font-weight: 400; } .EventNextPrev, /* rij td's boven header [vorige maand] titel maand [volgende maand] */ td.EventNextPrev + td { display:inline-block; float:left; position:relative; width:auto; } #seqMain .rcCalPopup.CommandButton { /* datum sel knop */ margin-left: 10px; text-indent: 0px; font-size: 28px; font-family: "Ionicons"; font-weight: 400; float: left; width: auto; } #Wrapper #seqMain .RadPicker_Default .riTextBox { border-radius: 0px; border-color: #ffffff; font-family: 'Lato', serif; color:#3c3c3b; font-size: 14px; font-weight: bold; margin-left:5px; /* voor witruimte met "vandaag", erg rommelig met classes/tables/etc. */ max-width:90px; /* voor popup changing (opacity 0 naar 1) */ height:42px!important; /* LETOP conform hoogte .CommandButton << handmatig */ } #Wrapper #seqMain .rcCalPopup.rcCalPopupInn, .EventBkArr { font-family: "Ionicons"; font-weight:400; } #Wrapper #seqMain .rcCalPopup.rcCalPopupInn { xxopacity:1!important; margin-left:10px; /* neemt line-height etc. over van .CommandButton */ text-indent: 0px; /* for standaard DatePicker.Default.css */ font-size:28px; /* zoiets.. iets wat groter als .CommandButton */ } .EventPrev .EventBkArr { margin-right:8px; } /* 50% of 15px padding */ .EventNext .EventBkArr { margin-left:8px; } .EventBkKnp { min-width:60px; } #Wrapper #seqMain .EvtDateControls { padding-top:10px; xxxpadding-bottom: 35px; } #Wrapper .EventNextPrev { padding:0px; } /* style='text-align:center;' weg... */ #Wrapper .EventPrev { } #Wrapper .EventPrev a { left:0px; } #Wrapper .EventNext a { right:0px;float:right; margin:0px; } .EventBkTit { overflow: visible; white-space: nowrap; } #Wrapper.UserMode0 .TopIconBar.EvtHdrRgtCol { display:none; } /* ook via dnn in te stellen !!! */ /* ================================================================================ SCROLL 2 TOP ================================================================================ */ #back-to-top, .touch-device #back-to-top:hover { bottom:25px; right:10px; display:none; height:45px; position:fixed; text-shadow:none; width:45px; z-index:1010;/* boven hamb menu knop! */ line-height:45px; text-align:center; font-family: "Ionicons"; font-size:28px; transition:all .2s ease; transition:all .2s ease; /* border-radius: 50%; */ color:#ffffff; background:#000; } #back-to-top:hover { text-decoration:none; } /* ================================================================================ SocialShare ================================================================================ */ .SocialShare { float:right; margin:15px 0} .SocialShare .SocialShareLabel { float:left; line-height:32px;} .SocialShare:after{ content: ""; display:block; clear:both;} .SocialShare [class^="SS_"] {cursor:pointer; display: block; width: 32px; height: 32px; font-size: 26px; text-align:center; line-height: 32px; margin: 0 0 0 10px; float: left; position: relative;} .SocialShare [class^="SS_"]:before { font-family: 'Ionicons'; color: #fff; display:block; content: ""; width: 100%; height: 100%; border-width:1px; border-style:solid } .SocialShare [class^="SS_"]:hover:before { background-color:#fff !important} .SocialShare .SS_FaceBook { } .SocialShare .SS_FaceBook:before { content: "\f231";} .SocialShare .SS_Google { } .SocialShare .SS_Google:before { content: "\f235";} .SocialShare .SS_LinkedIn {} .SocialShare .SS_LinkedIn:before { content: "\f239";} .SocialShare .SS_Twitter { } .SocialShare .SS_Twitter:before { content: "\f243";} /* ================================================================================ PUBLICATIE MODULE ================================================================================ */ /* ARTICLE LIST */ .pubControls { padding-bottom:10px } .pubArticleList{} .pubArticleList .pubItem {padding-bottom:20px;} .pubArticleList .pubItem .pubThumbNail { height:120px;} .pubArticleList .pubItem .pubLink { font-size:22px; font-family:"Open Sans", sans-serif; font-weight:700; } .pubArticleList .pubItem .pubMetaData { font-size:12px; padding-bottom:5px; color:#333;} .pubArticleList .pubItem .pubReturnLink { float:left} /* ARTICLE DETAILS */ .pubArticleDetails {} .pubArticleDetails h1 { font-size:50px; } .pubArticleDetails .pubMetaData { color:#333; font-size:12px; padding-bottom:5px;} .pubArticleDetails .pubContent { margin-bottom:10px;} .pubArticleDetails .pubReturnLink { /* overflow:hidden; ?? */} .pubArticleDetails .pubReturnLink a { float:right;} /* ARTICLE VIEWER */ .pubBannerWrapper{} .pubBannerWrapper .pubItem{ width:100%; background-repeat:no-repeat; background-size:cover; background-position:center center; } .pubBannerWrapper .pubItem .pubTitle, .pubBannerWrapper .pubItem .pubSummary { display:none;} .pubArticleHomeViewer {} .pubArticleHomeViewer h1 { color:#fff; text-align:center; padding:0 0 45px 0} .pubArticleHomeViewer .pubItem {} .pubArticleHomeViewer .pubItem.pubItemNumber4 { margin-right:0;} .pubArticleHomeViewer .pubItem .pubThumbnail { height:140px; background-position:center center; background-repeat:no-repeat; background-size:cover} .pubArticleHomeViewer .pubItem .pubTitle { /* font-size:22px; color:#fff; font-family: 'Open Sans', sans-serif; font-weight:700; line-height:1.25 */ } .pubArticleHomeViewer .pubItem .pubSummary { color:#fff; padding:0 0 20px 0;} #MeerNieuws { display:none} /* COMMENT VIEWER */ .pubCommentViewer .pubItem {} .pubCommentViewer .pubItem .pubMetaData {font-size:11px; color:#999;} /* SIDEBAR */ .pmsb_wrap { } .pmsb_wrap .pm_block.sb_searchinputbox { display:none} .pmsb_wrap .pm_block .pm_block_header { font-size:25px; font-weight:400; color:#0dad99; /* font-family: 'Finger Paint', cursive; 'Finger Paint', cursive; ?? */ color:#101a5f; /* aanp BK kleur was niet conform school/scholen, huisstijl donker blauw nu */ } .pmsb_wrap .pm_block ul { } .pmsb_wrap .pm_block ul li { } .pmsb_wrap .pm_block ul li a, .pmsb_wrap .pm_block ul li span { } .pmsb_wrap .navBlockItemLink, #linkBack { color:#444 !important} /* ================================================================================ flickity ================================================================================ */ .flickity-enabled { position: relative;} .flickity-enabled:focus { outline: none;} .flickity-viewport { overflow: hidden; position: relative; height: 100%;} .flickity-slider { position: absolute; width: 100%; height: 100%;} /* draggable */ .flickity-enabled.is-draggable { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: -webkit-grab; cursor: grab;} .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: -webkit-grabbing; cursor: grabbing;} /* ---- page dots ---- */ .flickity-page-dots { position: absolute; width: 100%; bottom: 25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; position:relative; max-width:940px; text-align:left; margin:0px auto; } .flickity-rtl .flickity-page-dots { direction: rtl;} .flickity-page-dots .dot { display: inline-block; width: 10px; height: 10px; margin: 0 6px; background:transparent; border-radius: 50%; cursor: pointer; border:2px solid #ffffff;} .flickity-page-dots .dot.is-selected { background: #fff!important; } /* ================================================================================ TWitterModule ================================================================================ */ .TweetItemList .TweetItem { overflow:hidden} .TweetItemList .TweetItem .TwitterImage { max-width:30%; float:left;} .TweetItemList .TweetItem .TwitterText { max-width:60%; float:right; word-break:normal} .DnnModule ul.TweetItemList { max-width:100% !important} /* ================================================================================ Events Module ================================================================================ */ td.EventNextPrev + td { letter-spacing:normal; font-weight:400; font-size:26px!important; color:#ea5297; padding:10px 0px; text-shadow:none!important; line-height: 20px!important; } .isSeq .ThemeDefault .Event { border:none!important; border-color:transparent!important; background-color:transparent!important; height:auto!important; } .isSeq .ThemeDefault .EventOtherMonthDay { background-color:rgba(0,0,0,.075)!important; } .DetailEventDetails1 .EventDetailsText { padding-bottom:15px;} .DetailEventDetails1 ~ .DetailCommands li { color:#fff;} .DetailEventDetails1 ~ .DetailCommands li > a { text-shadow:none; box-shadow:none; background:none; border-radius:0; display:inline-block; color: inherit !important; padding:0 15px; font-weight:700; height:32px; line-height:33px; border-width:1px; border-style:solid; cursor:pointer; text-transform:uppercase; margin:15px 0} .DetailEventDetails1 ~ .DetailCommands li > a:hover { background-color:#fff;} .DetailEventDetails1 ~ .DetailCommands li > a[title="Printen"] { display:none} .ModDNNEventsC .ListDataGrid, .ModDNNEventsC .ListDataGrid td, .ModDNNEventsC .ListDataGrid tr, .ModDNNEventsC .ListDataGrid td.ListDescription {border:0 !important; background-color:transparent !important} .ModDNNEventsC .EvtDateControls {padding-bottom:20px;} .ModDNNEventsC .EventItem {padding-bottom:30px; font-family: 'Open Sans', sans-serif; } .ModDNNEventsC .EventItem .EventTitle { border:0 !important; background-image:none; text-align:left; background-color:transparent !important; height:auto !important; font-size:22px !important; } .ModDNNEventsC .EventItem .EventTitle a {font-family: 'Open Sans', sans-serif;} .ModDNNEventsC .EventItem .EventDate { font-weight:700; text-transform:uppercase} /* ================================================================================ FOTO Module ================================================================================ */ .ModSimpleGalleryC {} .view{ border-collapse:collapse; padding:0; width:100%} .view .album-item { padding:10px 4px; text-align:left !important} .view .album-item >img { height:auto !important; width:100% !important; border:0 !important} .View { border-collapse:collapse; padding:0; width:100%} .View .photo-frame { text-align:left; width:100%; padding:0;border-collapse:collapse; } .View .photo-frame ~ span { text-align:center; display:block; padding-bottom:10px;} .View .photo-frame .mid--x,.View .photo-frame .midx-- { width:0; display:none} .View .photo-frame td[valign="top"] { width:100%;} .View .photo-frame td a { display:block; padding-left:4px;} .View .photo-frame td a img { border:0 !important; height:auto !important; width:100% !important} /* ================================================================================ NieuwsBrieven Module ================================================================================ */ .NewsletterSubscription{} .NewsletterSubscription .SubScriptionInput input{ width:100%; border: 1px solid #c9c9c9; background:#ffffff; border-radius:3px; padding:8px; box-sizing:border-box; -webkit-box-sizing: border-box; } .NewsletterSubscription .SubscriptionActions {} /* ================================================================================ Formulieren Module ================================================================================ */ .DnnModule-EngageSurvey {} .DnnModule-EngageSurvey .survey-listing{} .DnnModule-EngageSurvey .survey-listing ul.sl-repeater {border-width:1px; border:0;} .DnnModule-EngageSurvey .survey-listing ul.sl-repeater li { background:none;border:0; border-bottom-width:1px; border-top-style:solid; padding:15px 0; } .DnnModule-EngageSurvey .survey-listing ul.sl-repeater li span.sl-repeater-data { width:auto !important} .DnnModule-EngageSurvey .survey-listing ul.sl-repeater li span.sl-repeater-data .sl-title { font-size:22px; font-family: 'Open Sans', sans-serif; } .DnnModule-EngageSurvey .survey-title { font-size:22px; font-family: 'Open Sans', sans-serif; padding-top:30px;} .DnnModule-EngageSurvey .section-wrap {} .DnnModule-EngageSurvey .section-wrap .question { font-weight:400;} .DnnModule-EngageSurvey .section-wrap input[type="text"]{ display:block; width:75%; max-width:450px; margin-bottom:5px; border:1px solid #c9c9c9; padding:8px; box-shadow:0px 1px 0px 0px rgba(255, 255, 255, 0.8), inset 0px 1px 2px 0px rgba(0, 0, 0, 0.1); color:#333; border-radius:3px;} .DnnModule-EngageSurvey .section-wrap select {display:block; width:75%; max-width:250px; margin-bottom:18px; border:1px solid #c9c9c9; padding:8px; box-shadow:0px 1px 0px 0px rgba(255, 255, 255, 0.8), inset 0px 1px 2px 0px rgba(0, 0, 0, 0.1); color:#333; border-radius:3px;} .DnnModule-EngageSurvey input[type="submit"]{ color:#fff; margin:25px 15px 0 0; text-shadow:none; box-shadow:none; background:none; border-radius:0; display:inline-block; color: fff; padding:0 15px; font-weight:700; height:32px; line-height:33px; border-width:1px; border-style:solid; cursor:pointer; text-transform:uppercase; } .DnnModule-EngageSurvey input[type="submit"]:hover { background-color:#fff;} ul.sl-repeater li span.sl-repeater-actions { clear:both; padding-top:20px;} /* ================================================================================ Contact Module ================================================================================ */ .ModLesscherContactFormC .dnnFormItem input[type="submit"]{text-shadow:none; box-shadow:none; background:none; border-radius:0; display:inline-block; color: fff; padding:0 15px; font-weight:700; height:32px; line-height:33px; border-width:1px; border-style:solid; cursor:pointer; text-transform:uppercase; margin:15px 0} .ModLesscherContactFormC .dnnFormItem input[type="submit"]:hover {background-color:#fff;} /* ================================================================================ SEARCH RESULTS ================================================================================ */ .dnnSearchResultPanel { display:none} .dnnSearchResultAdvancedTip { display:none} .dnnSearchBox_advanced { display:none} .dnnSearchResultItem-Link { display:none;} .dnnSearchBoxPanel .dnnSearchBox { margin-left:0; margin-right:0; width:auto !important;} #dnnSearchResult_dnnSearchBox_input { position:relative; width:auto !important; background-color:transparent} .dnnSearchBox > a.dnnSearchButton { right:7px !important;} .dnnSearchBox > a.dnnSearchBoxClearText { right:35px !important; top:5px;} .pubArticleViewer.Search .pubItem { padding:15px 0;} /* ================================================================================ CONTAINER LAYOUT'S ================================================================================ */ .Container {} .ContainerHeader { } .ContainerContent {} .ContainerContent .ModDNNHTMLC img{ max-width:100%} .ContainerFooter {} /*fonts*/ .Font1{font-family: 'Open Sans', sans-serif; } .Font2{font-family: 'Lily Script One', cursive; } /* =================================================================================================== =================================================================================================== HEADMOB2016 - HAMB MENU 2016 CUSTOMIZE =================================================================================================== =================================================================================================== */ /* 1 - LOGO ROW 2 - TILES ROW 3 - SEARCH ROW 4 - MENU ROW 9 - OPMAAK */ /* ###################################################################### */ /* ####################### ALL ROWS - ALGEMEEN ####################### */ /* ###################################################################### */ .isMob { display:none; } .isNotMob { } /* rsp fe. <980px : switch */ /* ############################################################### */ /* ####################### 1 - LOGO ROW ####################### */ /* ############################################################### */ #HeadMobLogo { background:transparent; } #HeadMobLogo.mobHeadShown #LogoMob { transform:scale(1); transform-origin:center top; } #HeadMobLogo.mobHeadAway #LogoMob { transform:scale(.9); transform-origin:center top; } #LogoMob { width:240px; height:130px; background:transparent none no-repeat center 33%; background-size:100% auto; margin:0px auto; position:relative; max-width:90%; } #LogoMob { transition: all 0.6s; } /* ################################################################ */ /* ####################### 2 - TILES ROW ####################### */ /* ################################################################ */ #HeadMobTiles { height:70px; text-align:center; background:transparent; } #HeadMobTiles .InnerWrapper { min-height:inherit; } #HeadMobTiles div { word-spacing:5px; } /* #MobileMenuTrigger, #MobileMenu, */ #HeadMobTiles .HeadMobBut { margin-bottom: 10px; margin-top: 10px; /* width:50px; */ width:20%; /* conform "knopen" site */ max-width:75px; height:50px; display:inline-block!important; float:none!important; line-height: 50px; z-index: 980; overflow: hidden; font-family: "Ionicons"; font-size: 32px; vertical-align: bottom; -webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-align: center; color: #fff; cursor:pointer; /* border-radius: 5px; */ } #HeadMobTiles .HeadMobBut.klikaan { transform:scale(.95); transition:transform-scale 0.2s ease; /* conform: js > function mobBarKlik() */ } #HeadMobTiles .HeadMobBut.klikuit { } #HeadMobTiles .HeadMobBut { } #HeadMobTiles .HeadMobBut span { font-family:'Open Sans'; font-size:20px; color:#fff; margin-left:10px; margin-right:5px; font-weight: bold; transform: translateY(-4px); display:none; } #HeadMobTiles .HeadMobBut.HeadMobButAct, #HeadMobTiles .HeadMobBut.klikaan { min-width:150px; max-width:200px; } #HeadMobTiles .HeadMobBut.HeadMobButAct span, #HeadMobTiles .HeadMobBut.klikaan span { display: inline-block; } .mobMenuAan #MobileMenuTrigger div { } /* ################################################################# */ /* ####################### ? - WACHT EFFECT ##################### */ /* ################################################################# */ #HeadMobTiles.wacht { margin-left:50%; } #MobiNav .wacht .hamtxt { overflow:visible; } #MobiNav .wacht .hamtxt:after { z-index:99999; overflow:visible; position:absolute; /* margin-left:20px; NIET! over twee regels... foute pos > right:*/ right:-35px; top:-7px; width:40px; height:40px; line-height:40px; text-align:center; font-size:36px; content:"\f29a"; /* load-a */ /* xxcontent:"\f29d"; /* load-d */ box-shadow:none; font-weight:normal; color:#ffffff; /* text-shadow:1px 1px 2px #000; xxtext-shadow:0px 0px 10px #000; xbackground:none; border-radius:50%;*/ } #HeadMobTiles.wacht div { background:transparent; box-shadow:none; margin-left:-35px; width:70px; height:inherit; line-height:70px; font-size:50px; color:#3c3c3b; } #MobiNav .wacht .hamtxt:after, #HeadMobTiles.wacht div { font-family: "Ionicons"; animation:w2w_wachtdraai 1.25s linear 0s 999; /* 999x draaien */ } @keyframes w2w_wachtdraai{ 0% {transform:rotate(0deg) scale(0.75);} 50%{transform:rotate(180deg) scale(1.25);} 100%{transform:rotate(360deg) scale(0.75);} } /* ################################################################# */ /* ####################### 3 - SEARCH ROW ####################### */ /* ################################################################# */ /*
*/ #Body.mobZoekAan { } #HeadMobZoek { overflow:hidden; xdisplay:none; display:block; margin:0px 6px; } #HeadMobZoek #dnn_mobZkVeld_cmdSearch, #HeadMobZoek .knopZOEK { width:90px!important; } #MobielZoeken { padding:25px 0px 35px 0px; transition:margin .2s ease; margin-top:-175px; /* SUX ! TODO */ color:#330000; background: #7f939e; /* STYLING */ min-height: 75px; margin-bottom: 20px!important; } .mobZoekAan #MobielZoeken { max-width: 480px; margin: 0px auto; } #MobielZoekenHolder .searchInputContainer { display: initial !important; margin: initial!important; position: initial!important; width:100%!important; /* < IE */ } #MobielZoekenHolder { display:block; max-width:90%; margin:0px auto; } #MobielZoekenHolder, #dnn_mobZkVeld_txtSearch { font-size:0; word-spacing:0; /* hide   */ } #dnn_mobZkVeld_cmdSearch, #webredKNOP, a.knopZOEK, #Content .CommandButton { margin-top:12px; display:inline-block; /* font-family: "Ionicons"; font-size:32px; html:  */ font-size:20px; color: #fff; vertical-align:middle; cursor:pointer; font-weight:bold; text-align:center; width:30px; height:40px; line-height:40px; width:25%; color:#fff!important; xxposition:absolute; /* NEE */ margin-left:0; margin-right:5px; padding:0 15px; float:right; width: 130px; xxxborder-radius:5px; } #Content .CommandButton { float:left; width:auto; border:none!important; transition:all 0.15s linear; } #Content .CommandButton:hover { } .dnnFormItem input[type="text"], .dnnFormItem select, .dnnFormItem textarea, .dnnFormItem input[type="email"], .dnnFormItem input[type="search"], .dnnFormItem input[type="password"] { border-radius:0px!important; background:#fff; padding:8px; } #Wrapper .WSjs_inp { border:none!important; xxxoutline:none!important; font-size:inherit; } #Wrapper .WSjs_inp:focus { background:#fff!important; outline-style: solid!important; outline-width:4px!important; /* background:repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #fcfcff 10px, #fcfcff 20px)!important; */ } a.knopZOEK { margin-left:-135px; } #footAdr a.lnk, #footAdr a.lnk:link, #footAdr a.lnk:visited { color:inherit!important; } #footAdr a.lnk:active, #footAdr a.lnk:hover { color:rgb(2,139,255)!important; } #dnn_mobZkVeld_txtSearch { width:92%; padding-left:2%; padding-right:2%; margin-left:2%; margin-right:2%; background: #ffffff; border:none; outline: none; line-height:34px; min-height:34px; font-size: 18px; font-weight:600; } #dnn_mobZkVeld_txtSearch:after { clear:both; } .focusOpZoek #dnn_mobZkVeld_txtSearch { box-shadow:none!important; } #dnn_mobZkVeld_txtSearch:focus:not(:empty) { } /* editing searchbox, keyboard shown */ #dnn_mobZkVeld_txtSearch:empty:focus { } .focusOpZoek #dnn_mobZkVeld_txtSearch::-webkit-input-placeholder { color:transparent!important; } .focusOpZoek #dnn_mobZkVeld_txtSearch::-ms-input-placeholder { color:transparent!important; } .focusOpZoek #dnn_mobZkVeld_txtSearch::-moz-input-placeholder { color:transparent!important; } /* placeholder searchbox "Zoeken..." f.e. */ ::-webkit-input-placeholder { color:#7f939e!important; } ::-ms-input-placeholder { color:#7f939e!important;} ::-moz-input-placeholder { color:#7f939e!important; opacity:1; } #MobielZoekenInputTrigger { font-weight:bold; } #MobileMenu #MobielZoekenInput { color:#fff!important; font-size:15px; font-weight:bold; background:#26b28e; } #MobileMenu #MobielZoekenInput:not(:empty), #MobileMenu #MobielZoekenInput:focus { background:#fff!important; } /* ############################################################### */ /* ####################### 4 - MENU ROW ####################### */ /* ############################################################### */ #HeadMobMenu { overflow:hidden; } /* ======================= 4.1 menu row vlak ======================= */ #MobileMenu { width:100%; background:transparent; margin:0px auto 0px auto; max-width:480px; overflow:hidden; display:inherit; } /* PALET */ #MobileMenu { /* background: #ffffff;/* url(images/bg_seq.png) no-repeat -20% 0px; background-size: 100% auto; */ } #MobileMenu #MobiNav /* > ul */ { display:inherit; transition:margin .2s ease; } #MobileMenu.active { margin-top:0%; display:block; height:100%;} /* on/off */ #MobileMenu.active #MobiNav { display:inherit; } /* ======================= 4.2 menu opmaak ======================= */ #MobileMenu ul {list-style:none; } #MobileMenu #MobiNav > li { xxxborder-bottom:1px solid rgba(255,255,255,0.3);} #MobileMenu #MobiNav > li.haschild { /* overflow:hidden; */ } #MobileMenu #MobiNav li { position:relative; display:block; width:100%; min-height:30px; line-height:30px; box-sizing:border-box; -webkit-box-sizing:border-box; padding:10px 0 10px 10px; } #MobileMenu #MobiNav li.haschild { padding:10px 0 10px 10px; } #MobileMenu #MobiNav div.hamnode { /* -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; */ cursor:pointer!important; text-decoration:none !important; display:inline-block; position:absolute; z-index:1000; font-family: "Ionicons"; font-size: 24px; text-align:center; color:#fff; transition:all 0.25s ease; height: 30px; line-height: 30px; width: 30px; top: 7px; right:7px; border:none; margin-top:0px; /* < border weg */ } #MobileMenu #MobiNav .subLevel div.hamnode { top:3px; } #MobileMenu #MobiNav .hamnode:hover, #MobileMenu #MobiNav .hamnode:active { xxbackground: #532e5d!important; xxxbox-shadow:0px 0px 0px 2px #ffffff; } #MobileMenu #MobiNav .nonode:hover, #MobileMenu #MobiNav .nonode:active /* GEEN NODE evt wel blokje IS WEG*/ { xxbackground:#532e5d!important; } #MobileMenu #MobiNav .subLevel { display:none; margin: 0px; } /* #MobileMenu #MobiNav li.haschild .hamnode:after { content:"\f104"; } */ #MobileMenu #MobiNav li.haschild.active > .hamnode { transform: scaleY(-1); } #MobileMenu #MobiNav li a { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; overflow:hidden; text-overflow:ellipsis; color: inherit !important; position:relative; display:inline; width:auto; /* z-index:900; */ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} #MobileMenu #MobiNav li.haschild.active > .subLevel { display:block; } #MobileMenu #MobiNav div.haminspring { float: left; display: inline-block; position: relative; } #MobileMenu #MobiNav div.hamblok { max-width:calc(100% - 100px); display: inline-block; position: relative; } /* ---- #MOBILEMENU MET FOOTER ---- */ #MobileMenu { } #MobileMenuFooter { height:50px; position: absolute; bottom:50px; /* = #MobileMenu nav */ width:100%; background:#941b81; } /* ======================= 4.9 opmaak menu opmaak ======================= */ /* ####################### 9 - OPMAAK ############################################### */ /* ---- BASIS #MOBILEMENU ---- */ .isMob { background:transparent; } #HeadMobLogo { height:130px; } /* breedte vlak */ #MobielZoeken, #MobileNav, #MobileMenuFooter { width:inherit; max-width:inherit; } #MobielZoekenInput { appearance:none; -webkit-appearance:none; height:32px; padding: 0px 10px; border:0; border-radius:0;} #MobielZoekenInputTrigger {font-family: "Ionicons"; font-size:32px; color: inherit; display:inline-block; vertical-align:middle; padding:0 10px; cursor:pointer} #MobileMenu #MobileNav { position:relative; } #MobileMenu #MobileMenuHeader { line-height:50px; } #MobileMenuTrigger { background:#af54a1;} #wegMobileMenu #MobiNav .item .hamlink { } /* mrg! */ #wegMobileMenu #MobiNav .item .hamlink.hassublvl { width:calc( 100% - 60px); } /* blokje + margin blokje R */ /* #MobileMenu.active #MobileNav */ /* .mobMenuAan #MobileNav */ #MobileMenu.active #MobileNav { overflow-y:auto; } #wegMobileMenu ul ul { margin-left:0px; } #MobileMenu #MobielZoeken .MobielZoekenIntroTxt { padding-left:20px; } /* uitlijnen op tekst-items van menu */ #MobileMenu #MobielZoeken .MobielZoekenIntroTxt { padding-right:10px; vertical-align: middle; } /* ------------------------- PIJLTJE DOWN BIJ HOOFDKNOP ------------------------- */ #MobileMenu #MobiNav li .subLevel { padding-top:15px; padding-bottom:15px; } #MobileMenu #MobiNav li li .subLevel { padding-top:0px; padding-bottom:0px; } #MobileMenu #MobiNav li .subLevel:before { position:absolute; left:50%; left:29px; top:33px; width:40px; height:40px; z-index:99; margin-left:-20px; font-family: 'Ionicons'; color: #a00; display:block; content: ""; text-align:center; font-size:60px; content: "\f35f"; } #MobileMenu #MobiNav li li .subLevel:before { display:none; } #MobileMenu #MobiNav li .subLevel:before { } #MobileMenu #MobiNav li .subLevel > .item { } #MobileMenu #MobiNav li .subLevel > .item { transform-origin:center center; animation:hammenu_pop .2s normal 0s 1; } @keyframes hammenu_pop {0% {transform:scaleY(0);} 100%{transform:scaleY(1);}} #MobileMenu #MobiNav .item, #MobileMenu #MobiNav .item.haschild { padding:0px 0px; margin:0px; } #MobileMenu #MobiNav .hamitem { padding:6px 0px; } #MobileMenu #MobiNav .subLevel .hamitem { padding:4px 0px; box-shadow: 0px 0px 0px 2px rgba(255,255,255,.25); } /* #MobileMenu #MobiNav .item .item, #MobileMenu #MobiNav .item .item.haschild { padding:0px!important; margin:0px; } */ #MobileMenu #MobiNav .item .hamlink { margin:0px; /* width: calc( 100% - 70px); !!! */ padding: 3px 5px; /* witruimt vanw border empty bij + en - */ } #MobileMenu #MobiNav .subLevel .item .hamlink { margin:-3px 0px; } #MobileMenu #MobiNav li .disabled .hamtxt { color:#ccc!important; } #MobileMenu #MobiNav li .breadcrumb .hamtxt { background:rgba(255,255,255,.3); } #MobileMenu #MobiNav li .hamtxt { cursor:pointer;} #MobileMenu #MobiNav > .item { border-bottom:2px solid transparent; } #MobileMenu #MobiNav > .item.last { border-bottom:none; } /* -- #MobileMenu #MobiNav li .selected .hamtxt:after { display:inline-flex; content:" "; margin-left:10px; transform:translate(0px,-5px); width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 12px solid #532e5d; } #MobileMenu #MobiNav li .hamlink.selected:hover .hamtxt:after, #MobileMenu #MobiNav li .hamlink.selected:active .hamtxt:after { border-left-color: #ffffff; } */ /* ------------ AANPASSEN DESIGN ----------- */ #MobileMenu #MobiNav { color: inherit; font-size:16px; margin:-200% 2% 0px 2%; /* margin-top is fallback > js berekend later : 2% is uitlijnen zoekbox*/ padding:0px 0px 20px 0px; /* wit ruimt boven/onder menu lijst */ /* SCROLL MEE BACKGROUND */ } #MobileMenu #MobiNav > li { border-bottom:none; } #MobileMenu #MobiNav li .hamlink { /* margin:5px; /* width: calc( 100% - 70px); !!! */ } #MobileMenu #MobiNav li .hamtxt { /* border-radius:5px; */ padding-top:2px; padding-bottom:2px; padding-left:10px; padding-right:10px; display:inline-block; width: auto; line-height:25px; } /* ---------- OPMAAK MENU ------------- */ /* #MobileMenu nav { padding:0px; } */ #MobiNav .item { margin:10px 0px; } #MobiNav .item .item { margin:0px; } #MobileMenu #MobiNav li.haschild > .subLevel { padding-left:0px; } #MobileMenu .haminspring {} #MobileMenu ul ul .haminspring:after { display:block; float:left; width:auto; height:18px; font-family: "Ionicons"; line-height:30px; color:inherit; font-size: 24px; font-weight:bold; margin-top:1px; margin-left:15px; margin-right: -5px; min-width: 10px; letter-spacing:4px; color:#ffffff; } /* ronde streep */ /* SPATIES #MobileMenu ul ul .haminspring:after { content:"\00a0\00a0\00a0"; } #MobileMenu ul ul ul .haminspring:after { content:"\00a0\00a0\00a0\00a0\00a0"; } #MobileMenu ul ul ul ul .haminspring:after { content:"\00a0\00a0\00a0\00a0\00a0\00a0\00a0"; } */ /* #MobileMenu ul ul ul .haminspring:after { content:"\f125"; } #MobileMenu ul ul ul ul .haminspring:after { content:"\f125\f125"; } #MobileMenu ul ul ul ul ul .haminspring:after { content:"\f125\f125\f125"; } #MobileMenu ul ul ul ul ul ul .haminspring:after { content:"\f125\f125\f125\f125"; } #MobileMenu ul ul ul ul ul ul ul .haminspring:after { content:"\f125\f125\f125\f125\f125"; } #MobileMenu ul ul ul ul ul ul ul ul .haminspring:after { content:"\f125\f125\f125\f125\f125\f125"; } */ #MobileMenu ul ul ul .haminspring:after { content:"\f363"; } #MobileMenu ul ul ul ul .haminspring:after { content:"\f363\f363"; } #MobileMenu ul ul ul ul ul .haminspring:after { content:"\f363\f363\f363"; } #MobileMenu ul ul ul ul ul ul .haminspring:after { content:"\f363\f363\f363\f363"; } #MobileMenu ul ul ul ul ul ul ul .haminspring:after { content:"\f363\f363\f363\f363\f363"; } #MobileMenu ul ul ul ul ul ul ul ul .haminspring:after { content:"\f363\f363\f363\f363\f363\f363"; } /* #MobileMenu ul ul ul ul .haminspring:after { content:"\f208\00a0\f208\00a0\f208"; } */ #MobileMenu #MobiNav li.haschild.active >.GetSubLevel { /* xxxbackground-color:#009e4d; /* KNOP [+] / [-] */ } #MobileMenu #MobiNav li.haschild .GetSubLevel { border-color:transparent; background:#f7a703; color:#ffffff!important; /* heel licht geel / blauw */ xxxborder-radius:7px 0px 7px 0px; /* huisstijl */ xxxmargin-left:0px; } #MobileMenu #MobiNav > li.haschild { } #MobiNav .active .active .active { } /* #MobiNav .active .active .active .active { background:transparent; } in welk nivo achtergrond kleur niet donkerder maken */ #MobiNav .item .hamlink { text-decoration:none!important; text-align:left; width:calc( 100% - 50px); /* extra veel witruimte, scroll over +/- knoppen rechts... en lange teksten... */ } #MobiNav .hamitem .hamlink .hamtxt /* --- ROOT ITEM --- */ { font-size: 18px; font-weight: bold; color:#ffffff!important; } #MobiNav .subLevel .hamitem .hamlink .hamtxt /* --- SUB ITEMS --- */ { font-size: 15px; } #MobiNav .item .hamlink.breadcrumb .hamtxt { color:#ffffff!important; } /* ------------------------- SELECTED ANDERE KLEUR ------------------------- */ #MobiNav .item .hamlink.selected .hamtxt { /* background:#f8e8e9; */ } #MobileMenu .item .hamlink.selected .haminspring:after { /* color:#f8e8e9; */ } /* ------------------------- HOVER ------------------------- */ #MobMenuClose:hover, #MobMenuClose:active, #MobZoekClose:hover, #MobZoekClose:active, a.GetSubLevel:hover, a.GetSubLevel:active { background-color: #e30613!important; } #MobiNav .item .hamlink:hover , #MobiNav .item .hamlink:active { /* background: rgba(131,211,190,.5); = background:#c1e9df; /* is cyaan/groen licht als inputveld bij zoek */ } #MobiNav .item .hamlink:hover .hamtxt, #MobiNav .item .hamlink:active .hamtxt { color:#ffffff!important; } #MobileMenu .item .hamlink:hover .haminspring:after, #MobileMenu .item .hamlink:active .haminspring:after { color:#ffffff; } .WS1 #MobiNav .item .hamlink:hover .hamtxt, .WS1 #MobiNav .item .hamlink:active .hamtxt { background:#e30613!important; } .WS2 #MobiNav .item .hamlink:hover .hamtxt, .WS2 #MobiNav .item .hamlink:active .hamtxt { background:#0071b9!important; } /* ------------------------- ACTIVE-ON-KLIK ------------------------- */ #MobiNav .item .hamlink:active .hamtxt { xxbackground:#312a74!important; } /* =================================================================================================== =================================================================================================== BIG ZOEK DESKTOP =================================================================================================== =================================================================================================== */ /* ================================================================================ BIG ZOEK DESKTOP ================================================================================ */ /* ================== BIG ZOEK (DESKTOP) ================== */ #bigZoek { display:block; visibility:hidden; position:relative; z-index:990; z-index:90; /* width:100%; left:0; */ height:0px; overflow:visible; transition:all 0.5s ease!important; width:380px; /* zoekveld 360px */ float:right; margin-right:5%; } #Zoeken { margin-top:55px; width:100%; height:68px; overflow:visible; } #ZoekenHolder { position:absolute;width:340px; margin:19px 0px 0px 19px; background:#e9f5fd; /* zoek vlak zelf */ } #ZoekenInput { appearance:none; -webkit-appearance:none; padding: 0px 10px; border:0; border-radius:0;} #ZoekenInput { color:#fff!important; font-size:15px; font-weight:bold; background:#eee; } /*( #dnn_zkVeld_txtSearch::-webkit-input-placeholder, #dnn_zkVeld_txtSearch::input-placeholder, #dnn_zkVeld_txtSearch::placeholder, #dnn_zkVeld_txtSearch:-moz-placeholder, #dnn_zkVeld_txtSearch::-moz-placeholder, #dnn_zkVeld_txtSearch:-ms-input-placeholder { color:#ff0000!important; opacity:0!important; } */ #dnn_zkVeld_txtSearch /* INPUT */ { margin-right:30px;margin-left:10px; width:79%; color:#ffffff; border:none; outline: none; background:transparent!important; } #ZoekenInput, #dnn_zkVeld_txtSearch { margin-top:2px; height: 22px; line-height: 22px; color: #131d49; font-family: 'Signika', sans-serif; /* als topmenu */ font-size: 21px; } #dnn_zkVeld_txtSearch[placeholder] { font-weight:400; color:transparent; } #dnn_zkVeld_txtSearch::-webkit-input-placeholder { font-weight:400; color:transparent; } #dnn_zkVeld_txtSearch::-moz-placeholder { font-weight:400; color:transparent;} #dnn_zkVeld_txtSearch:-ms-input-placeholder { font-weight:400; color:transparent; } /* LEEG VELD: */ #dnn_zkVeld_txtSearch[placeholder]:empty { font-weight:500; color:#131d49; xxfont-size:20px; } #dnn_zkVeld_txtSearch::-webkit-input-placeholder:empty { font-weight:500; color:#131d49; xxfont-size:20px; } #dnn_zkVeld_txtSearch::-moz-placeholder:empty {font-weight:500; color:#131d49; xxfont-size:20px; } #dnn_zkVeld_txtSearch:-ms-input-placeholder:empty { font-weight:500; color:#131d49; xxfont-size:20px; } /* via js: #dnn_zkVeld_txtSearch:not(:empty), #dnn_zkVeld_txtSearch:focus { xxcolor:#95c11f!important; } */ /* ======= POPUP =========== */ #dnn_zkVeld_cmdSearch { font-family: "Ionicons"; font-size:27px; display:inline-block; cursor:pointer; position:absolute; vertical-align:middle; cursor:pointer; font-weight:400; text-align:center; width:30px; height:30px; line-height:30px; line-height: 27px; color: #fff; font-size: 32px; font-weight: 400; text-align: center; color:#131d49; } /* via js: .focusZoekHdr #dnn_zkVeld_txtSearch , .focusZoekHdr #dnn_zkVeld_cmdSearch { color:#3c3c3c; } */ #bigZoek #dnn_zkVeld_txtSearch { color:#3c3c3c; } #bigZoek #dnn_zkVeld_txtSearch[placeholder] { color:#3c3c3c; } #bigZoek #dnn_zkVeld_txtSearch::-webkit-input-placeholder { color:#3c3c3c; } #bigZoek #dnn_zkVeld_txtSearch::-moz-placeholder { color:#3c3c3c;} #bigZoek #dnn_zkVeld_txtSearch:-ms-input-placeholder { color:#3c3c3c; } #bigZoek #dnn_zkVeld_cmdSearch { color:#3c3c3c; xxxtext-shadow:0.5px 0px 0px #e7550d; } #bigZoek #ZoekenHolder { background:#ffffff; box-shadow:0px 0px 0px 3px #ffffff; } /* .focusZoekHdr #ZoekenHolder { transform: scale(1.25); transform-origin:center right; } */ /* SEARCH PREVIEW NOOIT TONEN */ .searchInputContainer a.dnnSearchBoxClearText, .searchSkinObjectPreview { display:none!important; } #Search .searchSkinObjectPreview, #Search .searchInputContainer a.dnnSearchBoxClearText, #MobileZoeken .searchSkinObjectPreview, #MobileZoeken .searchInputContainer a.dnnSearchBoxClearText { display:none !important; } /* ================================================================================ MEDIA QUERIES ================================================================================ */ .InstagramFeed {margin:50px auto 0px auto; max-width: 940px;} .crt-logo.crt-tag {display: none !important;} /* ================================================================================ MEDIA QUERIES ================================================================================ */ /* ------ DESIGN ------ */ @media only screen and (max-width: 945px) { #HeadMobMenu {} .isHome #BigBanner { } #bigZoek { display:none!important; } /* desktopzoek balk */ #RijTop .InnerWrapper { margin: 0px 15px } #RijTop { min-height: 53px; padding:5px 0px; } /* borderline on top ipv on bottom.... :] */ #RijTop, #RijTop .InnerWrapper { transform:scaleY(-1); } #RijTopL a .SM { transform:scale(1.5); transform-origin:0 0; margin-right:17px; } #RijTopR { margin-top:5px; } #webredKNOP, #MenuHolder { display:none!important; } #RijLogo { display:none!important; } #Body #Wrapper .CMS { max-width:96%; width:96%; margin:0px auto; display:block; position:relative; clear:both; float:none; } #homeRij1 .CMS_h .KNOP { transform: translate(3px,7px); } #hR1c h1 { display:none; } #hR1c { width:243px; } #FootB3 { margin-left:63px; } /* ------ MOB INTERF ------ */ #Body { background-color:#ffffff!important; } /* nodig voor RI (responsive interface) */ #HeadMobMenu { background-color:transparent!important; } .isMob { display:block; } .isNotMob { display:none; } .isBest #HeadMobViv { display:none; } .RadMenu, .RadPanelBar,#SubMenu{display:none;} #MobileMenuTrigger {display:block;} .CMS345px, .CMS33p { clear:both; margin:0px auto; display:block; float:none; width:345px; max-width: 90%; } #Wrapper.isHome #Content { background:#ffffff; } #HRvoorRij2 { margin-top:0px; } #HRvoorRij1b, #HRvoorRij1c { display:block; margin:0; padding:0; } /* best: */ #HRvoorOS { display:block; } .bgR1 { } #homeRij1 .InnerWrapper { background-image:inherit; } #hR1aBG, #hR1bBG, #hR1cBG /* RESP */ { background-image:inherit; background-position:center top; background-size:auto 100%; } #hR1aBG { background-position:-27% top; } #hR1bBG { background-position:140% top; } #hR1cBG { background-position:-80% 10%; background-size:auto 150%; } #homeRij1, #homeRij1 .InnerWrapper { background-position:-1px -1px; background-repeat:no-repeat; background-size:1px 1px; } #homeRij1 { padding:0px; /* margin-top: -20px; /* tricky.. door ronding grafisch veranderd witruimte, smaller screen displays: less margin-top */ } #hR1b h1, #hR1c h1 { margin-bottom: 0px; } #hR1b, #hR1c { } .notBest #hR1a, .notBest #hR1b { padding-top:20px; padding-bottom:60px; } .notBest #homeRij1 .CMS_h .KNOP { bottom:20px; } .notBest #hR1c { padding-top:20px; padding-bottom:30px; } /* #hR3a, #hR3b { padding-bottom:80px; } #hR3c { padding-bottom:40px; } #KNOP3c1 { margin-top:10px!important; } */ .isBest #hR1aBG, .isBest #hR1bBG { padding-top:30px; } /* a en b */ .isBest #hR1aBG, .isBest #hR1cBG { padding-bottom:30px; } /* a en c ... b en c "samen" */ /* best.: */ #ovzSch { max-width: 90%; margin: 0px 3% 0px 7%; } #homeRij2 { background:#ffffff; } #pubXMOD .pubItem { width: 50%!important; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki { display:block; margin:0px auto 30px auto; max-width:640px; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul { display:flex; flex-wrap: wrap; justify-content: center; /* flex-direction: column; op een rij ! */ } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li { float: none; display: inline-flex; width: auto; padding: 5px; margin:auto; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li a { width: 285px; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(1) { order:1; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(2) { order:3; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(3) { order:5; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(4) { order:7; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(5) { order:2; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(6) { order:4; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(7) { order:6; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li:nth-of-type(8) { order:8; } /* ======= SEQ PAGES ======= */ #seqMainInner { padding-top:0px!important; padding-bottom:30px!important; } #Breadcrumb { display:none!important; } #dnn_ContentPane { margin-left:30px!important; } .isSeq .two-third {width:80%; width:calc(100%-60px); } #FootAA { margin-left:30px; } #Header #MobileMenuTrigger {left:52px;} /* #GoHomeTrigger { display:block; background:#af54a1; } */ /* ======= DESIGN ========= */ .isHome .two-third { width:auto!important; padding-left:5%!important; padding-right:5%!important; float:none!important; } a.KNOP { margin-bottom: 10px; } #homeIntro .Normal { padding-right:0px!important; padding-bottom:30px!important; } #homeVlakIntroButs { margin-left:auto; margin-right:auto; float:none; clear:both; } .CMS50p { width:100%!important; } /* .BLOK { padding-left:5%; padding-right:5%; margin:0px auto; float:none!important; max-width:100%!important; width:auto!important; } */ .mobZoekAan .isSeq #Content, .mobMenuAan .isSeq #Content { background-position:75% -150px!important; } #SeqBread { display:none; } #homeRij1 h1, .isSeq h1 { line-height: 36px; font-size: 36px; padding-top: 30px; margin-top: 0px; margin-bottom: 20px; } #pubXMOD .pubItem .pubL, #pubXMOD .pubItem .pubR { margin:0px auto!important; max-width:235px!important; position:relative!important; float:none!important; display:block!important; } #pubXMOD .pubItem .pubR div { margin-right:20px!important; } #homeRij3h { width:90%; } #homeRij3 .PhotoWrapper { width: 50%!important; } #tegSM_1 { display:none; } /* #Content { padding-bottom: 143px; } /* ugly */ .isSeq #Content { padding-bottom: 0px; } #FootB1 { display:none; } /* logo weg! */ } @media only screen and (max-width: 768px) { .InnerWrapper { xxxmax-width:480px; } #Search, #xxxFooter #Logo2, #Login, .flickity-page-dots, #Breadcrumb, #icrPager, .pubControls {display:none;} /* .one-half, .one-third, .two-third, .one-fourth, .three-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth, .one-sixth, .five-sixth {float:none; margin-right:0; width:100%;} */ /*Header*/ #Header .InnerWrapper{ xxxmax-width:none;} #Logo { /* transform-origin:center 0px; transform:scale(.8); */ left:67%; } #w2wmadeHFCM { display:none; } /* break footer */ #FootB { height:335px; bottom:-341px; } #FootB { height:245px; bottom:-254px; } /* logo weg */ #FootBB { width: 90%; } #FootB2 .FootB_R1 { margin-top:10px; } #FootB2, #FootB3 { clear: left; margin:0px auto!important; } .FootB_R1, .FootB_R2 { height: 37px; line-height: 38px; } /*aanpassinge Paddings en Fonts*/ #Body #Wrapper h1 { font-size:30px; padding:0;} #Body #Wrapper h2 { font-size:24px; } #Body #BigBanner h1 { line-height:1.2; } #dnn_ContentPane { margin:0px 15px!important; } #FootAA { margin-left:15px; } .isSeq .two-third {width:80%; width:calc(100%-30px); } .pubArticleHomeViewer h1 {padding:0 0 10px 0} .pubArticleHomeViewer .pubItem .pubSummary { padding:0;} .pubArticleHomeViewer .pubItem .pubTitle { padding:20px 0 10px 0} .SubTab .row1 {padding-top:75px;} .row3 {padding:10px 0 0 0} .SchoolFilmPane, .NieuwsBriefPane, .TwitterPane {padding:0} #Content .Container {margin-bottom:25px;} /*events*/ .ModDNNEventsC .ThemeMinimalExtropy .EventItem {padding-bottom:15px;} .ThemeDefault .EventDay .EventDayScroll > div > a { padding:0 !important; width:23px !important; text-indent:30px; position:relative} .ThemeDefault .EventDay .EventDayScroll > div > a:before { content:"\f14a"; color:#fff !important; width:23px; height:23px; line-height:23px; text-align:center; position:absolute; left:0; top:0; text-indent:0; font-family: 'Ionicons'; font-size:19px; } /*LightBox Aanpassingen voor PhotoModule*/ #jquery-lightbox {} #jquery-lightbox #lightbox-container-image-box { width:auto !important; height:100% !important; min-height:150px; } #jquery-lightbox #lightbox-container-image-box #lightbox-image { width:100% !important; } #jquery-lightbox #lightbox-container-image-data-box { width:100% !important} #jquery-lightbox #lightbox-container-image-details-currentNumber { display:none !important;} #jquery-lightbox #lightbox-container-image-details-nav{ display:none !important;} /*ContactFormulier */ .ModLesscherContactFormC {} .ModLesscherContactFormC .dnnFormItem{} .ModLesscherContactFormC .dnnFormItem .dnnLabel { width:100%; text-align:left; padding:0 !important; margin:0 !important} .ModLesscherContactFormC .dnnFormItem .dnnLabel + input[type="text"] { width:100% !important; padding:8px 0 !important; max-width:none !important } .ModLesscherContactFormC .dnnFormItem .dnnLabel + textarea { width:100% !important; padding:8px 0 !important; max-width:none !important } .ModLesscherContactFormC .dnnFormItem .dnnLabel + img[id*="captchaImage"] { width:100% !important;} /*footer */ #xxxFooter .FooterPane {margin:0; padding-top:13px; display: block; text-align:center} /* xxx #Footer .SocialMediaIcons {position: relative; top:auto; right:auto; display: block; max-width:100%; padding:15px 0; text-align:center} */ } @media only screen and (max-width: 640px) { /* ======= WIKI (GROEN V PINSTER) ======= */ /* alle blokken op 1 rij plaatsen ! */ #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul { flex-direction: column; } #Form .UserMode0 .WikiFullPane .Mod2sxcC .SchoolWiki ul li { order:1!important; } .isSeq .pubItem .pubTitle { font-size:18px!important; padding-top: 6px!important; } } @media only screen and (max-width: 560px) { #MobileAdminTrigger.HeadMobBut { display:none!important; } /* admin webred niet op mobieltjes... Vincent @20160811 */ /* verklein seq big visual bottom > 50% .isSeq #Content { background-size: 700px 215px!important; } .isSeq .InnerWrapper.SubPanesWrapper { padding-bottom: 205px!important; } */ #Breadcrumb { display:none; } #dnn_ContentPane { margin-left:10px!important; } #FootAA { margin-left:10px!important; } .isSeq .two-third { width:90%; width:calc(100%-20px); } #footAbg div { transform: scaleY(.75); transform-origin: bottom; } #footAdr { height:225px; bottom: 0px; } #footAdrInn { height:174px; } } @media only screen and (max-width: 485px) { #homeRij1 { margin-top: 0px; } #pubXMOD .pubItem { width: 100%!important; } } @media only screen and (max-width: 450px){ #BigBanner { background-size:auto 115%!important; } /* tekst header leesbaar houden .... */ }