/*
Theme Name: Supreme College
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: Sixtyseven
Author URI:  https://www.sixtyseven.com
Template: salient
Version: 1.0
*/

/* BASE */

.inner_row {
    padding-left: 30px;
    margin-left: -15px;
    width: calc(100% + 30px);
}

/* TYPE */

body, body p {
    font-size: 20px;
}

@media (max-width: 690px) {
    body, body p {
        font-size: 17px;
        line-height: 21px;
    }
}

body, body p, body p a, body strong, body a,
h1, h3, h4, h6,
body #slide-out-widget-area[class*="slide-out-from-right"] .off-canvas-menu-container li a {
    font-family: 'futura-pt', sans-serif;
    font-weight: normal;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: subpixel-antialiased;
}

body .wpb_row > .col.span_12.dark h2,
body .wpb_row > .col.span_12.dark h3,
body .wpb_row > .col.span_12.dark h4,
body .wpb_row > .col.span_12.dark h6 {
    color: #2a4d90;
}

h2, h5 {
    font-family: 'garamond-premier-pro-display', serif;
    font-weight: 400;  
    font-style: normal;
}

h1 {
    font-size: 45px;
    line-height: 33px;
    text-transform: uppercase;
}

@media (max-width: 800px) {
    h1 {
        font-size: 36px;
        line-height: 30px;
    }
}

h1 + *, h2 + * {
    margin-top: 30px;
}

h2 {
    font-size: 60px;
    text-indent: -30px;
    line-height: 36px;
}
h2 strong {
    font-size: 45px;
    letter-spacing: -0.5px;
    text-transform: uppercase;
}

@media (max-width: 800px) {
    h2 {
        font-size: 45px !important;
        text-indent: -15px;
    }
    h2 strong {
        font-size: 30px;
    }
}

h3 {
    font-size: 30px;
    font-weight: 500;
    line-height: 23px;
    text-transform: uppercase;
}

p {
    padding-bottom: 20px;
}

.lead p {
    font-weight: 500;
}

.small p {
    font-size: 15px;
}

h4 {
    font-size: 27px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

h5 {
    font-size: 30px;
    line-height: 24px;
}

h6 {
    font-size: 21px;
    font-weight: 500;
    font-weight: 500;
    line-height: 17px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.light h2, 
.light h3,
.light h4,
.light p,
.light ul li {
    color: #ffffff !important;
}

/* HEADER */

@media (min-width: 1000px) and (max-width: 1280px) {
    #header-outer[data-transparent-header="true"] #logo .dark-version {
        height: 45px;
    }
    #header-outer:not(.small-nav) #logo .stnd { 
        height: 50px!important;
	}
    body #header-outer.small-nav #logo img, 
    body #header-outer.small-nav .logo-spacing img {
        height: 45px !important;
    }
    
    body #header-outer[data-lhe="default"] #top nav > ul > li > a {
        padding-left: 12px;
        padding-right: 12px;
    }
}

#top nav ul li a {
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
}
@media (min-width: 1430px) {
    #top nav ul li a {
        font-size: 18px;
    }
}

#top nav ul li.lang-switch a {
    padding-left: 3px !important;
    padding-right: 3px !important;
    font-size: 14px;
}
#top nav ul li.lang-switch.current_page_item a {
    text-decoration: underline;
}

body #header-outer.transparent.dark-slide > #top nav > ul > li > a {
    opacity: 1;
}
body #header-outer.transparent[data-lhe="default"].dark-slide #top nav > ul > li > a:hover {
    color: #a9c913 !important;
} 

/* FANCY LISTS */

.nectar-fancy-ul[data-list-icon="dot"] ul li:before {
    content: url('/wp-content/uploads/2019/12/li-img-blue.svg');
    top: 7px;
}

.col.span_12.light .nectar-fancy-ul[data-list-icon="dot"] ul li:before {
    content: url('/wp-content/uploads/2019/12/li-img-green.svg');
    top: 7px;
}

.nectar-fancy-ul[data-list-icon="dot"] ul li {
    padding-bottom: 10px;
}

/* CUSTOMIZATION */

/* MYP VWO / HERO */

.first-section .row-bg-wrap:before {
    content: '';
    display: block;
    width: 10vw;
    height: 10vw;
    position: absolute;
    border: 15px solid #2A4D90;
    z-index: 10;
    left: 0;
    border-radius: 50%;
    top: 33%;
    transform: translate(-50%, -50%);
}
@media (max-width: 1000px) {
    .first-section .row-bg-wrap:before {
        width: 50vw;
        height: 50vw;
    }
}

@media (min-width: 1280px) {    
    .first-section .row-bg-wrap:after {
        content: '';
        display: block;
        width: 25vw;
        height: 25vw;
        position: absolute;
        border: 15px solid #a9c913;
        z-index: 10;
        right: 0;
        border-radius: 50%;
        top: 40%;
        transform: translate(50%, -50%);
    }
}

@media (min-width: 1000px) and (max-width: 1500px) {
    .first-section .col.span_12 {
        margin-bottom: 75px !important;
    }
}

@media (min-width: 1000px) {
    .first-section h2 {
        transform: scale(0.75) translateX(10%);
        transform-origin: right top;
        text-align: right;
    }
}

@media (min-width: 1000px) and (max-width: 1280px) {
    .first-section h2 {
        transform: scale(0.75);
        transform-origin: left top;
    }
}

@media (max-width: 1280px) {
    .first-section h2 {
        color: #ffffff !important;
        text-align: left;
    }
}

@media (max-width: 1000px) {
    .first-section p {
        max-width: 85%;
    }
    .first-section .row-bg-overlay {
        background-image: linear-gradient(to right, rgba(74,76,86,.9), rgba(74,76,86,.75) 75%, transparent);
    }
    .first-section .row-bg {
        background-position: left 57% center !important;
    }
}

/* Voor wie */
body .voor-wie h2 {
    color: #a9c913 !important;
    transform: scale(1.3);
    transform-origin: left bottom;
}
body .voor-wie .row-bg-wrap .row-bg-overlay {
    border: solid 15px #a9c913;
    border-radius: 50%;
    left: 3%;
    width: 37vw;
    height: 37vw;
    transform: scale(1.22);
    z-index: 10;
}
@media (max-width: 1600px) {
    body .voor-wie .row-bg-wrap .row-bg-overlay {
        border-color: rgba(0,0,0,0.15);
        width: 35vw;
        height: 35vw
    }
}
@media (max-width: 690px) {
    body .voor-wie .row-bg-wrap .row-bg-overlay {
        left: -25%;
        width: 400px;
        height: 400px;
    }
}

/* Anders leren */
.anders-leren .bg-arrow-right .column-image-bg {
    background-size: 101%;
    background-repeat: no-repeat;
    background-position: right -1px center;
}

.anders-leren .vc_col-sm-6.bg-arrow-right ~ .vc_col-sm-6 p {
    color: #a9c913;
    font-family: 'garamond-premier-pro-display', serif;
    letter-spacing: 0.75px;
    line-height: 30px;
}

html body .anders-leren .row-white-circle .row-bg {
    border: solid 15px #ffffff;
    border-radius: 50%;
    left: -30%;
    width: 37vw;
    height: 37vw;
    transform: scale(1.22);
    z-index: 0;
    top: 20%;
}

.blue-circle h6 {
    display: inline-block;
    position: relative;
    text-align: center;
}
.blue-circle h6:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    height: 300px;
    border: solid 15px #2a4d90;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    z-index:-1;
}


@media (max-width: 1000px) {
    html body .anders-leren .row-white-circle p {
        max-width: 85%;
    }
    html body .anders-leren .row-white-circle .row-bg-wrap {
        background-image: linear-gradient(to right bottom, rgba(225,230,236,.9), rgba(225,230,236,.66) 75%, transparent);
    }
    html body .anders-leren .row-white-circle .row-bg {
        width: 50vw;
        height: 50vw;
    }
    html body .anders-leren .bg-arrow-right h3 {
        margin-top: 30px;
    }
    html body .anders-leren .bg-arrow-right p {
        padding: 20px 45px 20px 0;
    }
    html body .anders-leren .bg-arrow-right .column-image-bg {
        background-image: none !important;
    }
    html body .anders-leren .vc_col-sm-6.bg-arrow-right ~ .vc_col-sm-6 .column-bg-overlay {
        margin-left: -30px;
        width: calc(100% + 30px);
    }
    body .blue-circle {
        margin-top: 125px;
        margin-bottom: 100px !important;
    }
} 

/* Ons team */

html body .ons-team .row-bg-wrap .row-bg-overlay {
    border: solid 15px #a9c913;
    border-radius: 50%;
    left: 3%;
    width: 37vw;
    height: 37vw;
    transform: scale(1.22);
    z-index: 10;
}
@media (max-width: 690px) {
    html body .ons-team .row-bg-wrap .row-bg-overlay {
        left: -25%;
        width: 400px;
        height: 400px;
    }
}

html body .ons-team h5, .ons-team h5 {
    color: #a9c913;
}

/* Aanmelden */
html body .aanmelden .bg-arrow-right .column-image-bg {
    background-size: 101%;
    background-repeat: no-repeat;
    background-position: right -1px center;
}

.aanmelden .inner_row {
    background-color: #A9C927;
}

@media (max-width: 1000px) {
    html body .aanmelden .vc_col-sm-4 .column-bg-overlay {
        margin-left: -30px;
        width: calc(100% + 30px);
    }
    html body .aanmelden h2 {
        margin-top: 30px;
        margin-left: -30px;
    }
    html body .aanmelden .lead p {
        padding: 20px 45px 0 0;
    }
    html body .aanmelden .bg-arrow-right .column-image-bg {
        background-image: none !important;
    }
}

/* Contact */

html body .contact > .row-bg-wrap:after {
    content: '';
    position: absolute;
    border: solid 15px #a9c913;
    border-radius: 50%;
    left: -25%;
    width: 25vw;
    height: 25vw;
    transform: scale(1.22);
    z-index: 10;
    top: 15%;
}

@media (max-width: 1500px) {
    html body .contact .col.span_12 {
        margin-bottom: 50px !important;
    }
}

/* Nieuws */

body[data-header-resize="1"].single-post .container-wrap {
    padding-top: 0;
}

.meta-category {
	display: none;
}

.excerpt:after {
    content: 'Read more';
    display: block;
    color: #a9c913;
    margin-top: 15px;
}

/* Formulieren */

body .gform_wrapper .top_label .gfield_label {
  margin-top:20px;
  margin-bottom:0px;
      font-size: 18px;
    font-family: 'futura-pt', sans-serif;
    font-weight: normal;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: subpixel-antialiased;
}

.gchoice_select_all, .gform_wrapper ul.gfield_checkbox li input[type=checkbox]:checked+label, 
.gform_wrapper ul.gfield_radio li input[type=radio]:checked+label {
    font-weight: 700;
    color: #a9c913;
}

.gform_wrapper .gfield_required {
    color: #ff8b00;
    margin-left: 4px;
}

.gform_wrapper div.validation_error {
    color: #a9c913;
    font-size: 1em;
    font-weight: 700;
    margin-bottom: 25px;
    border-top: 2px solid #a9c913;
    border-bottom: 2px solid #a9c913;
    padding: 16px 0;
    clear: both;
    width: 100%;
    text-align: center;
}

.gform_wrapper li.gfield.gfield_error, .gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
    margin-bottom: 6px!important;
    padding-bottom: 6px;
    padding-top: 8px;
    padding-left: 10px;
    padding-right: 10px;
}

.gform_wrapper .gfield_error .gfield_label {
    color: #fff;
}

.gform_wrapper li.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), .gform_wrapper li.gfield_error textarea {
    border: 1px solid #fff;
}

.gform_wrapper li.gfield.gfield_error.gfield_contains_required {
    padding-right: 10px;
}

.gform_wrapper li.gfield.gfield_error, .gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
    background-color: rgba(255,223,224,.25);
    margin-bottom: 6px!important;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    padding-bottom: 6px;
    padding-top: 8px;
    box-sizing: border-box;
}

.gform_wrapper .validation_message {
    color: #ff8b00;
    font-weight: 700;
    letter-spacing: normal;
}

body .gform_wrapper ul li.gfield {
    padding-top: 0;
    font-size: 25px;
}

.gform_wrapper div.validation_error {
    display: none!important;
}

body .gform_wrapper .description, body .gform_wrapper .gfield_description, body .gform_wrapper .gsection_description, body .gform_wrapper .instruction {
    font-size: 15px;
}
.nectar-button {
    letter-spacing: -0.5px;
    text-transform: uppercase;
	font-family: 'futura-pt', sans-serif;
    font-weight: 500;
	font-size:1.5em;
}
/* Landingspagina's */

h2 strong {
    font-size: 40px;
    letter-spacing: -0.5px;
    text-transform: uppercase;
}

.first-section .vc_custom_heading {
    font-size: 45px;
	transform: scale(1.3);
	margin-left: 100px;
}

.first-section .vc_custom_heading strong {
    letter-spacing: -0.5px;
    text-transform: uppercase;
	font-family: 'futura-pt', sans-serif;
    font-weight: normal;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: subpixel-antialiased;
	    transform: scale(1.3);
}




/* ==============================================================
AGENDA
=================================================================*/

.maanden {
    margin-bottom: 20px;
}

.maanden a {
    margin-right:10px;
}

.maand {
    margin-top: 2.5rem;
    margin-bottom: 1.5rem;
}

.agenda-item {
    padding: 25px 15px;
    border-left: solid 3px #2a4d90;
    background-color:#ffffff;
    box-shadow: 0 10px 50px rgba(0,0,0,0.08), 0 13px 45px rgba(0,0,0,0.08);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
            flex-wrap:wrap;
    margin-bottom:20px;
}
.agenda-item:target {
    border-left-width: 6px;
}
.agenda-item .date {
    color:#2a4d90;
    font-size:16px;
    display: block;
}

.agenda-item .subject {
    color:#2a4d90;
    font-size:22px;
    display: block;
    font-weight: bold;
}

.agenda-item[id]:before {
    content: '';
    display: block;
    height: 75px;
    width: 100%;
    margin-top: -75px;
    visibility: hidden;
}