/* Theme Name: petravandendolder Theme URI: https://underscores.me/ Author: Underscores.me Author URI: https://underscores.me/ Description: Description Version: 1.0.0 License: GNU General Public License v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: petravandendolder Tags: This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. petravandendolder is based on Underscores https://underscores.me/, (C) 2012-2015 Automattic, Inc. Underscores is distributed under the terms of the GNU GPL v2 or later. Normalizing styles have been helped along thanks to the fine work of Nicolas Gallagher and Jonathan Neal https://necolas.github.com/normalize.css/ */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Normalize # Typography # Elements # Forms # Navigation ## Links ## Menus # Accessibility # Alignments # Clearings # Widgets # Content ## Posts and pages ## Asides ## Comments # Infinite scroll # Media ## Captions ## Galleries --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Normalize --------------------------------------------------------------*/ /* CSS reset */ html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; } input { -webkit-appearance: none; } article, aside, figure, footer, header, nav, section, details, summary {display: block;} /* Handle box-sizing while better addressing child elements: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } /* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */ /* Responsive images and other embedded objects */ /* if you don't have full control over `img` tags (if you have to overcome attributes), consider adding height: auto */ img, object, embed {max-width: 100%;} /* Note: keeping IMG here will cause problems if you're using foreground images as sprites. In fact, it *will* cause problems with Google Maps' controls at small size. If this is the case for you, try uncommenting the following: #map img { max-width: none; } */ /* force a vertical scrollbar to prevent a jumpy page */ html {overflow-y: scroll;} /* we use a lot of ULs that aren't bulleted. you'll have to restore the bullets within content, which is fine because they're probably customized anyway */ ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;} del {text-decoration: line-through;} abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;} /* tables still need cellspacing="0" in the markup */ table {border-collapse: collapse; border-spacing: 0;} th {font-weight: bold; vertical-align: bottom;} td {font-weight: normal; vertical-align: top;} hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;} input, select {vertical-align: middle;} pre { white-space: pre; /* CSS2 */ white-space: pre-wrap; /* CSS 2.1 */ white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ word-wrap: break-word; /* IE */ } input[type="radio"] {vertical-align: text-bottom;} input[type="checkbox"] {vertical-align: bottom;} .ie7 input[type="checkbox"] {vertical-align: baseline;} .ie6 input {vertical-align: text-bottom;} select, input, textarea {font: 99% sans-serif;} table {font-size: inherit; font: 100%;} small {font-size: 85%;} strong {font-weight: bold;} td, td img {vertical-align: top;} /* Make sure sup and sub don't mess with your line-heights https://gist.github.com/413930 */ sub, sup {font-size: 75%; line-height: 0; position: relative;} sup {top: -0.5em;} sub {bottom: -0.25em;} /* standardize any monospaced elements */ pre, code, kbd, samp {font-family: monospace, sans-serif;} /* hand cursor on clickable elements */ .clickable, label, input[type=button], input[type=submit], input[type=file], button {cursor: pointer;} /* Webkit browsers add a 2px margin outside the chrome of form elements */ button, input, select, textarea {margin: 0;} /* make buttons play nice in IE */ button, input[type=button] {width: auto; overflow: visible;} /* scale images in IE7 more attractively */ .ie7 img {-ms-interpolation-mode: bicubic;} /* prevent BG image flicker upon hover (commented out as usage is rare, and the filter syntax messes with some pre-processors) .ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));} */ /* let's clear some floats */ .clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } html.touch *:hover {pointer-events: none !important;} /* ======================= Ending CSS reset ================================== */ /* normal: 400 medium: 500 bold: 700 paars: #473d94 donker-paars: #2f164f licht paars: #b4abc0 blog licht paars: #59509e rgba(71,61,148,0.8) */ .content_block h1, .content_block h2, .content_block h3, .teaser h4, .content_block h5, .page_content h1, .page_content h2, .tribe-events-single-event-title, .tribe-events-widget-events-list__header-title, .blog-logo, .content_block.blog span, .tribe-events-page-title {font-family: 'Lobster Two', cursive;} #mainnavigation li a, #mainnavigation-home h2, .content_block.content, .tribe-events-schedule, .tribe-events-back, .tribe-events-cal-links, .tribe-events-single-section-title, table, td, dt, dd, .navigation, #kolom_left .nav-previous, #wrap .page_content ul li, #main-page-content, #tribe-events-pg-template {font-family: 'Nunito', sans-serif;} #agenda .item_date h2, #agenda .item_date h3, .page_content.no-foto h2, .page_content p, .content_block p, .blog-text, #blog .blog_item, .combi_right h4, #reageren, #reageren h3, #kolom_left, #promo .quote_subtitle, .tribe-event-url .item_text, #top-navigatie, .youtube_content, .tribe-events-nav-previous a, .tribe-events-nav-next a, .tribe-events-loop h4, .tribe-events-loop .tijd, #footer, .tribe-events-loop .locatie {font-family: 'Ubuntu', sans-serif;} a {cursor:pointer;} .page_content a:hover {background-color:#2f164f;color:white;} .container {margin: 0 auto;padding:0 25px;max-width:990px;position: relative;} .content_block h1, .page_content h1, .tribe-events-single-event-title, .tribe-events-page-title {font-weight: 400;font-size:1.9375em;margin-bottom:37px;color:#2f164f;} .content_block h2 {font-weight: 400;font-size:1.9375em;margin-bottom:37px;} .page_content h2 {color:#2f164f;font-weight: 400;font-size:1.9375em;margin-bottom:37px;border-bottom: 1px solid #2f164f;font-size: 1.9375em;margin: 0 auto 15px auto;padding-bottom: 15px;text-align: center;width: 30%;} .content_block p {font-size:0.9375em;font-weight: 400;margin-bottom:22px;line-height:0.8em;} .content_block h3 {font-size:28px;} .content_block h5 {font-weight: 400; font-size:1.9375em;} .accent {color:#473d94;} .page_content.no-foto h2 {color:#473d94;font-weight:700;border-bottom:none;font-size:1.5em;margin:0;padding-bottom:10px;padding-top:25px;text-align:left;width:auto;} .page_content.no-foto img.alignright {float:right;margin-left:20px;} .page_content.no-foto img.alignleft {float:left;margin-right:20px;} .page.contact #content_right a {color:white;} .page.contact #content_right a:hover {background-color:white;color:#2f164f;} .page {position:relative;} #header {border-top: 35px solid #473d94;} #header.front-page .container {max-width:740px;} #header.front-page .content_block h2 {font-size:1.6375em;} #logo {float:left;width:237px;height:149px;margin-top:35px;position:relative;z-index:35;} #sitename {float:left;background-color:white;border-top:50px solid white;} #sitename h1, #sitename p {margin-bottom:0;} #sitename h1 {padding-left: 10px;text-transform: uppercase;width:142px;} #sitename p.subtitle {margin-left: 10px;margin-top:2px;height:1em;line-height:1em;margin-top:7px;text-transform: uppercase;} #mainnavigation-home {position:relative;overflow:hidden;} #top-navigatie {position:absolute;width:100%;z-index:50;color:#473d94;font-size:0.85em;margin-top:8px;} #top-navigatie li {display:inline;margin-right:4px;} #top-navigatie li:after {content:"|";margin-left:5px;} #top-navigatie li:nth-child(3):after {content:"";} #top-navigatie li.active:before {content:"\f0da";font-family: 'FontAwesome';color:#473d94;margin-right:4px;} #top-navigatie li a {text-decoration: none;} #top-navigatie li.active a {font-weight:700;} #top-navigatie li a:hover {text-decoration: underline;} #top-navigatie li.active a:hover {text-decoration: none;} #blog #top-navigatie li {background-color: transparent;} .single #blog #header-page {} .single #blog #wrap {position:relative;z-index:40;top:0px;margin-bottom:0px;margin-top:0px;} .container.blog {top:0;} #kolom_left {float:left;width: 237px;} #content_blog {float:left;width:74%;} #blog_pictures {height:255px;} #blog-picture-bar .blog_top_foto-1 {float:left;width: 100%;height:255px;} #blog-picture-bar .blog_top_foto-2 {float:left;width: 351px;height:255px;} #blog-picture-bar .blog_top_foto-2.blog_foto-1 {border-right:7px solid white;} #blog-picture-bar .blog_top_foto-2.blog_foto-2 {border-left:8px solid white;border-right:0px;} #blog-picture-bar .blog_top_foto-3 {float:left;width: 33.3333%;height:255px;} #blog-picture-bar .blog_top_foto-3.blog_foto-1 {border-right:10px solid white;} #blog-picture-bar .blog_top_foto-3.blog_foto-2 {border-left:4px solid white;border-right:4px solid white;} #blog-picture-bar .blog_top_foto-3.blog_foto-3 {border-left:10px solid white;} .header_tekst p {font-weight:700;} .front-page .content_block.title, .front-page .content_block.picture, .front-page .content_block.blog {height:370px;} .content_block.title, .content_block.picture,.content_block.blog {float:left;width:50%;height:470px;} #mainnavigation-home .content_block.picture, #mainnavigation-home .content_block.blog {cursor: pointer;} #mainnavigation-home .content_block.picture {background-color:black;} #header-page {overflow:hidden;} .picture_transparency {width:100%;height:100%;padding-top:160px;background-color:rgba(71, 61, 148, 0.3);} .picture_transparency:hover {background-color:rgba(71, 61, 148, 0.6);transition: background-color 0.3s ease-in-out 0s;} .blog_transparency {width:100%;height:100%;padding-top:145px;} .blog_transparency:hover {background-color:rgba(71, 61, 148, 0.6);transition: background-color 0.3s ease-in-out 0s;} .content_block.title {background-color: white;padding-top:50px;padding-left:60px;} .content_block.picture {background-color: black;text-align: center;vertical-align: middle;color: white;text-transform: uppercase;} .content_block.blog {background-color: #473d94;text-align: center;vertical-align: middle;color: white;text-transform: uppercase;} .content_block.blog span {text-transform: uppercase;} .content_block.content {float:left;width:50%;height:470px;text-align:center;padding:20px;} .content_block.content h1 {border-bottom: 1px solid #2f164f;padding-bottom: 15px;margin: 0px 50px 25px 50px;} .content_block.content p {line-height: 2em;} #tribe-events-content-wrapper.tribe-clearfix::before {display:inherit;} .content_block.agenda h1, .tribe-events-single-event-title, .tribe-events-page-title {margin-top: 50px;margin-bottom:25px;} .agenda_item {width: 100%;padding:20px 50px;overflow:hidden;color:white;} #agenda {margin-bottom: 50px;} #agenda li:nth-child(odd) {background-color:#473d94;} #agenda li:nth-child(even) {background-color:#59509e;} .item-left {width:33.3333%;float:left;} .item_img {float:left;width:50%;height:125px;background-color:white;} .item_date {float:left;width:50%;height:125px;border-right:1px solid white;text-align:center;} .item_date h2 {font-size: 3.5em;font-weight: 700;margin-bottom:0px;border-bottom:none;padding-bottom:0px;width:100%;color:white;line-height:1.15em;} .item_date h3 {font-size: 1.8em;font-weight: 700;margin-bottom:0px;} .item_text {width:66.6666%;float:left;padding-left:50px;padding-top:25px;font-weight:400;} .item_text h4 {font-size:1.2em;font-weight:700;margin-bottom:5px;} .tijd, .locatie {font-size:1.2em;font-weight:400;} .tijd {margin-right:30px;} .tijd i, .locatie i {margin-right:5px;} /*blog*/ #blog .header_site_left {float:left;width:50%;height:116px;background-color:#473d94;} #blog .header_site_right {float:right;width:50%;height:116px;background-color:#2f164f;} #blog #header_site .container {height:116px;background-color:#2f164f;max-width:940px;} #blog li:nth-child(odd) {background-color:#473d94;} #blog li:nth-child(even) {background-color:#59509e;} .blog_item {width: 100%;padding:20px 50px;overflow:hidden;color:white;} .blog_item:hover {background-color:rgba(255, 255, 255, 0.2);transition: background-color 0.3s ease-in-out 0s;} .blog-left {width:33.3333%;float:left;} .blog_img {float:left;width:50%;height:125px;background-color:white;} .blog_date {float:left;width:50%;height:125px;border-right:1px solid white;text-align:center;} .blog_date h2 {font-size: 3.5em;line-height:1em;font-weight: 700;margin-bottom:0px;border-bottom:none;padding-bottom:0px;width:100%;color:white;line-height:1.15em;} .blog_date h3 {font-size: 1.8em;line-height:1em;font-weight: 700;margin-bottom:0px;text-transform: lowercase;} .blog_text {width:66.6666%;float:left;padding-left:50px;padding-top:0px;} .blog_text h4 {font-size:1.2em;font-weight:700;margin-bottom:25px;} .nav-previous {float:left;} .nav-next {float:right;} .nav-previous, .nav-next {background-color:#2f164f;margin-top:20px;} .nav-previous a, .nav-next a {color:white;font-weight:700;text-decoration:none;padding:10px;display:block;cursor:pointer;} .nav-previous a:before {content: '\f053';font-family: 'FontAwesome';float: left;margin-right: 0.5em;line-height:1.5em;font-weight: 400;} .nav-next a:after {content: '\f054';font-family: 'FontAwesome';float: right;margin-left: 0.5em;line-height:1.5em;font-weight:400;} .navigation h2.screen-reader-text {display:none;} .single #blog .navigation {overflow:hidden;border-bottom:1px solid #2f164f;padding-bottom: 10px;} #kolom_left .page_content.no-foto h2 {color:#473d94;font-weight:700;border-bottom:none;font-size:80px;line-height:70px;padding:0;margin:0;margin:25px 0 0;text-align:center;width:auto;} .single #blog #logo {margin-top:10px;float:none;} .single #blog #logo a:hover {background-color:transparent;} .single #blog .page_content h1 {text-align:center;margin-top:40px;} .single #blog .nav-previous {background-color:transparent;margin-top:20px;} .single #blog .nav-previous a {text-align:center;background-color: #2f164f;} .single #blog .nav-previous a:before {content: '\f053';font-family: 'FontAwesome';float: none;margin-right: 0.5em;line-height:1.5em;font-weight: 400;verticale-align:middle;} .single #blog .blog_date {float:left;width:100%;height:125px;border-right:1px solid white;text-align:center;} .single #blog #auteur {font-style: italic;line-height:1.8em;height:1.8em;} .single #blog #reacties {line-height:1.8em;height:1.8em;} .single #blog #reacties p {font-weight: 700;} .single #blog #content_blog .page_content.no-foto h2 {padding-top:0px;} .single #blog #kolom_left .nav-previous {margin-left:67px;} #reageren {line-height: 1.8em;} #reageren h3, #reageren .comment-reply-title {font-size: 1.5em;line-height:1em;font-weight: 400;margin-bottom:0px;text-transform: lowercase;margin:25px 0 50px 0;} #reageren .reageren {font-weight: 700;color:#2f164f;} #comments .comment-list {list-style-type:none;} #blog #comments .comment {background-color:transparent;} #blog #comments .comment-body {padding-bottom:25px;border-bottom: 1px solid #2f164f;margin-bottom:25px;} #blog #comments .comment-body img.avatar {display:none;} #blog #reactie-auteur {width:50%;float:left;margin-bottom:25px;} #blog #reactie-auteur span {font-weight:700;color:#2f164f;} #blog #reactie-date {font-style: italic;float:right;width:50%;margin-bottom:25px;text-align: right;} #blog .reply a {text-decoration: none;font-weight: 700;margin-top:10px;color:#2f164f;display: block;width: auto;text-transform: lowercase;} #blog .reply a:hover {text-decoration: underline;} #blog .reply a:before {content: '\f054';font-family: 'FontAwesome';float: left;margin-right: 0.5em;line-height:1.8em;font-weight: 700;} #blog #comments ul.children {border-bottom: 1px solid #2f164f;} #blog #comments ul.children li {margin-left:50px;border-bottom:none;} #blog #comments ul.children li .comment-body {border-bottom:none;padding-bottom:0;} #reageren .comment-reply-title {color:#2f164f;font-weight:700;margin-bottom:25px;} #reageren .comment-form-comment label {display:none;} #reageren .comment-form-comment textarea {width:100%;border: 1px solid #2f164f;} #reageren .form-submit input[type='submit'] {float:right;background-color:#2f164f;color:white;text-transform: lowercase;border:1px solid #2f164f;padding:10px;margin-top:10px;} #reageren .comment-form-author label, #reageren .comment-form-email label, #reageren .comment-form-url label {clear:both;float:left;width:90px;} #reageren .comment-form-author input, #reageren .comment-form-email input, #reageren .comment-form-url input {float:left;width:200px;} #reageren .comment-form-author, #reageren .comment-form-email, #reageren .comment-form-url {width:100%;overflow:hidden;} .nav-previous a:hover, .nav-next a:hover {background-color:#473d94;} #foto.content_block.picture.blog {float:left;margin:0;width:100%;height:150px;width:100%;} .single-post #blog .page_content {width:100%;margin-top:35px;} #blog .page_content p {margin-bottom: 1.5em;} #blog .page_content.alignleft {float:left;width:50%;} #blog .page_content.alignright {float:right;width:50%;text-align:right;} #fluitiste #header_site {background-color:#473d94;} #fluitiste #mainnavigation li a:hover, #fluitiste #mainnavigation li.current-menu-item a {background-color:#2f164f;border-top:66px solid #b4abc0;} #onderwijskundige #header_site {background-color:#2f164f;} #onderwijskundige #mainnavigation li a:hover, #onderwijskundige #mainnavigation li.current-menu-item a {background-color:#473d94;border-top:66px solid #b4abc0;} #header_site {position:absolute;top:66px;height:116px;width:100%;} #header_site #sitename h1 {margin-left:10px;padding-left:0px;padding-bottom:2px;line-height: 1em;width:132px;border-bottom:2px solid #b4abc0;} #mainnavigation li {float:left;} #mainnavigation li a {font-size:16px;line-height:16px;display:block;text-decoration:none;color: white;cursor:pointer;padding:64px 18px 36px 18px;border-top:66px solid white;} #wrap {position:relative;clear:both;overflow:hidden;margin-top:25px;color:#473d94;} #wrap .page_content ul {margin: 20px 35px;} #wrap .page_content ul li {line-height:1.8em;} #wrap .page_content ul li:before {content: '\f068';font-family: 'FontAwesome';float: left;margin-right: -1.5em;margin-left:-20px;} #main-page-content {color:#473d94;} #foto.content_block.picture {margin-right:1%;width:49%;} #content_right.content_block.content {margin-left:1%;width:49%;} .tribe-events-widget-events-list .tribe-events-widget-events-list__header .tribe-events-widget-events-list__header-title{ text-transform: lowercase; margin-bottom: 5px; height: 40px; font-size: 28px; font-family: 'Lobster Two', cursive; color: white; } .tribe-events-widget-events-list .tribe-events-widget-events-list__events .tribe-events-widget-events-list__event-row { flex-direction: column; justify-content: center; align-items: center; } .tribe-events-widget-events-list .tribe-events-widget-events-list__events .tribe-events-widget-events-list__event-row .tribe-events-widget-events-list__event-date-tag-month, .tribe-events-widget-events-list .tribe-events-widget-events-list__events .tribe-events-widget-events-list__event-row .tribe-events-widget-events-list__event-date-tag-daynum, .tribe-events-widget-events-list .tribe-events-widget-events-list__events .tribe-events-widget-events-list__event-row .tribe-events-widget-events-list__event-datetime, .tribe-events-widget-events-list .tribe-events-widget-events-list__events .tribe-events-widget-events-list__event-row .tribe-events-widget-events-list__event-title-link { margin-bottom: 5px; line-height: 1.5em; font-size: 0.9375em; font-weight: bold; font-family: 'Ubuntu', sans-serif; color: white; pointer-events: none; } .tribe-events-widget-events-list .tribe-events-widget-events-list__view-more { display: none; } #teasers {clear:both;color:white;text-align:center;margin-top:25px;overflow:hidden;} .teaser {float:left;height:200px;background-color:#2f164f;} .teaser a {display:block;cursor:pointer;height:200px;color:white;text-decoration:none;} .teaser a:hover {background-color: rgba(255, 255, 255, 0.2);} .teaser a:hover .fluitles_background {background-color: rgba(71, 61, 148, 0.4)} .teaser.left {width:23.5%;margin-right:1%;} .teaser.left li {padding:0px;margin:0;display:block;} .teaser.left a {padding:5px;height:200px;} .teaser.center {width:23.5%;margin-left:1%;margin-right:1%;} .teaser.right_combi {width:49%;margin-left:1%} .teaser .fluitles_background {background-color: rgba(71, 61, 148, 0.6);height:100%;} .teaser h3 {text-transform:lowercase;margin-bottom:5px;height:40px;} .teaser h2 {font-weight:700;margin-bottom:0px;} .teaser h4 {margin-bottom:10px;} .teaser p {margin-bottom:5px;line-height:1.5em;} .teaser_middle {padding-top:75px;} .teaser_middle2 {padding-top:62px;height:200px;} .combi_left {height:200px;} .combi_left, .combi_right {float:left;width:50%;} .combi_right h4 {margin-bottom:0px;} .combi_right h3 {margin-bottom:0px;} #link-bar {clear:both;color:white;text-align:center;margin-top:25px;overflow:hidden;} #link-bar .link {float:left;height:200px;background-color:#2f164f;} #link-bar .link.col1 {width:23.5%;margin-right:1%;} #link-bar .link.col2 {width:23.5%;margin-right:1%;margin-left:1%;} #link-bar .link.col3 {width:23.5%;margin-right:1%;margin-left:1%;} #link-bar .link.col4 {width:23.5%;margin-left:1%;} #link-bar .link a {text-decoration:none;} #link-bar .link a div {display:block;height:200px;} #link-bar .link h3 {color:white;padding-top:75px;} #link-bar .link a div:hover {opacity:0.5;-webkit-transition: opacity 0.3s ease-in-out;-moz-transition: opacity 0.3s ease-in-out;-o-transition: opacity 0.3s ease-in-out;transition: opacity 0.3s ease-in-out;} .picture-images-1 {width:100%;height:807px;float:left;} .picture-images-2 {width:50%;height:385px;float:left;border-right:20px solid white;} .picture-images-3 {width:33.3333%;height:252px;float:left;border-right:20px solid white;} .picture-images-4 {width:25%;height:193px;float:left;border-right:20px solid white;} #video-bar {margin-bottom:20px;overflow:hidden;} .youtube_opname {position:relative;width:33.3333%;height:293px;float:left;border-right:20px solid white;cursor:pointer;margin-bottom:20px;} .youtube_button {margin:0;padding:0;height:293px;background: rgba(71, 61, 148, 0.8) url("images/youtube_button.png") no-repeat center center;} .youtube_content {position:absolute;width:100%;bottom:20px;font-size:1.3em;color:white;text-align:center;} .youtube_content h2 {font-weight:700;display:inline-block;} .youtube_content span, .youtube_content p {font-weight: 300;} #main-page-content .youtube_content h2, #main-page-content .youtube_content span, #main-page-content .youtube_content p {line-height:1em;} .youtube_opname:hover .youtube_button {background-color:rgba(71, 61, 148, 0.5);transition: background-color 0.3s ease-in-out 0s;} #main-page-content {clear:both;overflow:hidden;} .page_content {margin: 25px 0 25px 0;} .page_content h1 {padding-bottom: 10px;margin: 0;text-align:left;} .page_content p {line-height: 2em;} #main-page-content p {text-align:center;line-height:2em;} .main-page-content-img {width:100%;height:300px;background-color:#b4abc0;margin-top:25px;} table {margin-top:20px;width:50%;} thead td {font-size:1.3em;font-weight:700;padding-bottom:5px;border-bottom:1px solid #473d94;} tbody td {padding-top:10px;padding-bottom:10px;border-bottom:1px solid #473d94;} #promo {margin-top:25px;overflow:hidden;} #promo h5 {color:#473d94; text-align:center;padding:0 10%;} #promo .quote_subtitle {color:#473d94; text-align:center;font-size:1.2em;} #footer {min-height:250px;background-color:#2f164f;margin-top:25px;padding:50px 0;overflow:hidden;color:white;} #footer .container {font-weight:300;} #footer #contact, #footer #links {float:left;width:50%;} #footer #contact h3, #footer #links h3 {font-size:1em;text-transform:uppercase;padding-bottom:30px;font-weight:700;} #footer .footer-content p {line-height:1.5em;} #footer .small {font-size:0.8em;margin-top:50px;} #footer #icons {margin-top:30px;} #footer #links a, #footer a {text-decoration:underline;color:white;} #footer #links .icon {float:left;margin-right:30px;cursor:pointer;border: 3px solid white;width:40px;height:40px;font-size:20px;border-radius:50%;text-align:center;padding-top:4px;} #footer.footer-fluitiste {background-color:#473d94;} #footer.footer-fluitiste .blog-logo {background-color:#473d94;} #footer.footer-fluitiste .blog-logo:hover, #footer.footer-fluitiste #links .icon:hover {background-color:#2f164f;} #footer .blog-logo {background-color:#2f164f;} #footer .blog-logo:hover, #footer #links .icon:hover {background-color:#473d94;} .blog-logo {position:relative;float:left;width:40px;height:40px;background-color:#473d94;border: 3px solid white;border-radius:50%;font-size:20px;text-align:center;padding-top:4px;} .squar {border-bottom: 15px solid white;border-left: 15px solid transparent;bottom: -6px;position: absolute;right: 2px;-ms-transform: rotate(19deg); /* IE 9 */-webkit-transform: rotate(19deg); /* Chrome, Safari, Opera */transform: rotate(19deg);width: 15px;} .blog-link, .blog-logo {cursor:pointer;} .blog-link:hover .blog-logo, .blog-logo:hover {background-color:#2f164f;} .blog-text {text-align:center;margin-bottom:5px;color:#473d94;} .blog-top {position:absolute;top:19px;right:0px;margin-right:25px;z-index:45;} .blog-top .blog-logo {box-shadow:0px 2px 4px rgba(0, 0, 0, 0.7);color:white;} .blog-top .squar {box-shadow:4px 4px 4px rgba(0, 0, 0, 0.3);} /*Agenda*/ #agenda .agenda_item .item_date h2 {font-size:4em;color:white;text-align:center;padding-top:0;} #wrap #agenda ul {margin:0;} #wrap #agenda ul li:before {content:"";} #agenda .tribe-events-sub-nav {display:none;} #agenda ul.tribe-events-sub-nav li {background-color: transparent;} .tribe-events-schedule, .tribe-events-nav-previous a, .tribe-events-nav-next a, .tribe-events-single-section-title, dt {color:#2f164f;} .tribe-events-single-event-description, dd, #tribe-events-content a {color:#473d94;} #tribe-events-content a {text-decoration:none;} #tribe-events-content a:hover {background-color: transparent;text-decoration: underline;} #tribe-events .tribe-events-button, .tribe-events-button {background-color:#2f164f;border-radius:0px;} .single-tribe_events .tribe-events-content {width:50%;padding-right:25px;} .tribe-events-single-event-description {float:left;} .tribe-events-back {margin-top:20px;} .tribe-events-back:hover {text-decoration: underline;} .tribe-events-schedule h2 {font-size: 1.5em;font-weight: 700;margin-bottom:0px;} .single-tribe_events .tribe-events-event-image {display:inline-block;} .tribe-events-event-image {width:50%;} #tribe-events-content.tribe-events-list {margin-bottom:0px;} .tribe-events-loop .tijd, .tribe-events-loop .locatie {font-weight: 300;} /*.agenda_item:hover {background-color:rgba(255, 255, 255, 0.1);}*/ #tribe-events-list-widget-2 .widgettitle {display:none;} #agenda .tribe-events-notices {border:none;margin:0;padding:0;text-shadow:none;background-color:transparent;color:#473d94;} #agenda .tribe-events-notices li {background-color:transparent;} #tribe-events-list-widget-2 p {padding-top:75px;} #tribe-events-list-widget-2 .tribe-events-list-widget-events p {padding-top:0;} /*Contact*/ .page.contact #content_right.content_block.content {background-color:#473d94;} .page.contact .content_block.content h1 {color:white;border-color:white;} .page.contact .content_block.content p {text-align:left;color:white;} /*RESPONSIVE*/ @media only screen and (max-width: 980px) { #mainnavigation li a {padding: 65px 8px 36px;font-size:0.85em;} .content_block.content h1 {padding-bottom:5px;margin-bottom:10px;} .content_block.content p {line-height:1.8em;} /* Agenda*/ #agenda .item_text h4 {font-size:1.1em;} #agenda .tijd, .locatie {font-size:1em;} #agenda .tijd {margin-right:15px;} /* Blog*/ #blog .blog_text h4 {margin-bottom:15px;} #blog #content_blog {width:71%;} } @media only screen and (max-width: 875px) { .content_block.content p {line-height:1.5em;} /* Agenda*/ #agenda .item_text h4 {font-size:0.9em;} #agenda .tijd, #agenda .locatie {font-size:0.85em;} #agenda .tijd {margin-right:15px;} /* Media*/ .youtube_opname {width:50%;height:390px;} a:nth-child(odd) .youtube_opname {border-right:10px solid white;} a:nth-child(even) .youtube_opname {border-right:0px;border-left:10px solid white;} .youtube_button {height:390px;} /* Blog*/ #blog .blog_text h4 {margin-bottom:15px;} #blog #content_blog {width:66%;} #blog #blog-picture-bar .blog_top_foto-3 {height:215px;} } @media only screen and (max-width: 767px) { #fluitiste-menu, #onderwijskundige-menu {display:none;} #foto.content_block.picture {width: 100%;margin:0 0 20px 0;padding:0;} #content_right.content_block.content {width:100%;margin:0;padding:0;} .page.contact #content_right.content_block.content {padding:20px;} .content_block.content {height:auto;} .content_block.content p {line-height:2em;} .teaser.left {width:49%;margin-bottom:15px;} .teaser.center {width:49%;margin-right:0;margin-bottom:15px;} .teaser.right_combi {width:100%;margin:0;padding:0;} .main-page-content-img {height:200px;} .picture-images-4 {height:150px;} #link-bar .link, #link-bar .link a div {height:140px;} #link-bar .link h3 {padding-top:50px;} html#front-page {padding-top:0 !important;} /* Agenda*/ #agenda .item-left {width:100%;border-bottom: 1px solid white;padding-bottom: 20px;} #agenda .item_img, #agenda .item_date {width:25%;} #agenda .item_date {border-right:none;} #agenda .item_text {width:100%;padding-left:0px;} #agenda .item_text h4 {font-size:1.1em;} #agenda .tijd, #agenda #agenda .locatie {font-size:1em;} /* Blog*/ #blog .blog_item {padding:20px;} #blog .blog_text {padding-left:30px;} #blog .blog_text h4 {font-size:1.1em;} #blog .blog_text p {font-size:0.9em;} #blog #kolom_left {width:100%;} #blog #content_blog {width:100%;padding-top:50px;} .single #blog .page_content h1 {text-align: left;} .single #blog #kolom_left .nav-previous {margin-left: 0px;} .single #blog .blog_date h2 {text-align:left;} .single #blog .blog_date h3 {text-align:left;margin-left:20px;} .single #blog .blog_date p {text-align:left;margin-left:25px;} /* Front-page*/ .front-page .content_block.title {padding-left:15px;} .front-page #header.front-page .content_block h2 {font-size:1.5em;} } @media only screen and (max-width: 600px) { #footer #contact, #footer #links {width: 100%;margin:0;padding:0;text-align: center;margin-bottom:50px;} #fluitiste #footer #icons {margin: 30px auto 0px auto;width: 250px;} #onderwijskundige #footer #icons {margin: 30px auto 0px auto;width: 180px;} .picture-images-4 {height:95px;border-right: 15px solid white;} #link-bar .link, #link-bar .link a div {height:120px;} #link-bar .link h3 {padding-top:45px;font-size:20px;} /* Agenda*/ #agenda .item_img, #agenda .item_date {width:33.3333%;} #agenda .item_text h4 {font-size:0.85em;} #agenda .tijd, #agenda .locatie {font-size:0.75em;} /* Media*/ .youtube_opname {height:300px;} .youtube_button {height:300px;} .youtube_content {font-size:0.9em;padding:0 10px;} /* Blog*/ #blog .blog-left {width:100%;margin:0;border-bottom: 1px solid white;padding-bottom: 20px;} #blog .blog_img, #blog .blog_date {width:25%;} #blog .blog_date {border-right:none;} #blog .blog_text {width:100%;padding-left:0px;padding-top:20px;font-size:1.2em;} /* Front-page*/ .front-page .content_block.title, .front-page .content_block.picture, .front-page .content_block.blog {height:235px;padding-top:0px;} .front-page #logo {margin:0px;padding-top:35px;width:220px;height:200px;} .front-page #logo img {width:195px;} #header.front-page .content_block h2 {font-size:1.2em;} .front-page .picture_transparency {padding-top:110px;} .front-page .blog_transparency {padding-top:80px;} } @media only screen and (max-width: 500px) { .teaser.left, .teaser.center {width:100%;margin:0 0 15px 0;} .picture-images-4 {height:90px;border-right: 10px solid white;} #link-bar .link, #link-bar .link a div {height:80px;} #link-bar .link h3 {padding-top:30px;font-size:16px;} table {width:75%;} /* Agenda*/ #agenda .container {padding-left:0;padding-right:0;} #agenda .agenda_item {padding:20px;} #agenda .item_img, #agenda .item_date {width:30%;} #agenda .item_text {padding-top:20px;} #agenda .item_text h4 {font-size:0.85em;line-height:1.5em;} #agenda .tijd, #agenda .locatie {font-size:0.75em;} #agenda .tijd, #agenda .locatie {float:left;width:100%;line-height:1.8em;} /* Media*/ .youtube_opname {height:250px;} .youtube_button {height:250px;} /* Blog*/ #blog .blog_img, #blog .blog_date {width:33.3333%;} #blog #blog_pictures {height:200px;} #blog #blog-picture-bar .blog_top_foto-3 {height:125px;} #blog .page_content p {font-size:0.9em;} /* Front-page*/ .front-page .content_block.title, .front-page .content_block.picture, .front-page .content_block.blog {height:180px;padding-top:0px;} .front-page #logo {margin:0px;padding-top:35px;width:190px;height:150px;} .front-page #logo img {width:140px;} #header.front-page .content_block h2 {font-size:0.95em;} .front-page .picture_transparency {padding-top:75px;} .front-page .blog_transparency {padding-top:45px;} } @media only screen and (max-width: 400px) { .page_content.no-foto img.alignright, .page_content.no-foto img.alignleft {width:100%;margin:0;padding:0;height:auto;float:left;} #link-bar .link, #link-bar .link a div {height:70px;} #link-bar .link h3 {padding-top:25px;font-size:14px;} /* Agenda*/ #agenda .item_img, #agenda .item_date {width:50%;} /* Blog*/ #blog .blog_img, #blog .blog_date {width:50%;} /* Front-page*/ .front-page .content_block.title, .front-page .content_block.picture, .front-page .content_block.blog {height:140px;padding-top:0px;} .front-page #logo {margin:0px;padding-top:30px;width:130px;height:120px;} .front-page #logo img {width:120px;} #header.front-page .content_block h2 {font-size:0.8em;} .front-page .picture_transparency {padding-top:65px;} .front-page .blog_transparency {padding-top:35px;} } @media only screen and (max-width: 345px) { #blog-navigation {display:none;} .picture-images-4 {height:55px;border-right: 10px solid white;} /* Media*/ a .youtube_opname {width:100%;border: none !important;} /* Front-page*/ .front-page #logo {margin:0px;padding-top:30px;width:115px;height:120px;} .front-page #logo img {width:105px;} #header.front-page .content_block h2 {font-size:0.7em;} }