﻿@import url('https://fonts.googleapis.com/css?family=Frank+Ruhl+Libre');

@font-face {
    font-family: 'Montserrat';
    src: url('/fonts/Montserrat/Montserrat-Regular.ttf');
}

@font-face {
    font-family: 'Montserrat-Black';
    src: url('/fonts/Montserrat/Montserrat-Black.ttf');
}

@font-face {
    font-family: 'Montserrat-BlackItalic';
    src: url('/fonts/Montserrat/Montserrat-BlackItalic.ttf');
}

@font-face {
    font-family: 'Montserrat-Bold';
    src: url('/fonts/Montserrat/Montserrat-Bold.ttf');
}

@font-face {
    font-family: 'Montserrat-BoldItalic';
    src: url('/fonts/Montserrat/Montserrat-BoldItalic.ttf');
}

@font-face {
    font-family: 'Montserrat-ExtraBold';
    src: url('/fonts/Montserrat/Montserrat-ExtraBold.ttf');
}

@font-face {
    font-family: 'Montserrat-ExtraBoldItalic';
    src: url('/fonts/Montserrat/Montserrat-ExtraBoldItalic.ttf');
}

@font-face {
    font-family: 'Montserrat-ExtraLight';
    src: url('/fonts/Montserrat/Montserrat-ExtraLight.ttf');
}

@font-face {
    font-family: 'Montserrat-ExtraLightItalic';
    src: url('/fonts/Montserrat/Montserrat-ExtraLightItalic.ttf');
}

@font-face {
    font-family: 'Montserrat-Italic';
    src: url('/fonts/Montserrat/Montserrat-Italic.ttf');
}

@font-face {
    font-family: 'Montserrat-Light';
    src: url('/fonts/Montserrat/Montserrat-Light.ttf');
}

@font-face {
    font-family: 'Montserrat-LightItalic';
    src: url('/fonts/Montserrat/Montserrat-LightItalic.ttf');
}

@font-face {
    font-family: 'Montserrat-Medium';
    src: url('/fonts/Montserrat/Montserrat-Medium.ttf');
}

@font-face {
    font-family: 'Montserrat-MediumItalic';
    src: url('/fonts/Montserrat/Montserrat-MediumItalic.ttf');
}

@font-face {
    font-family: 'Montserrat-Regular';
    src: url('/fonts/Montserrat/Montserrat-Regular.ttf');
}

@font-face {
    font-family: 'Montserrat-SemiBold';
    src: url('/fonts/Montserrat/Montserrat-SemiBold.ttf');
}

@font-face {
    font-family: 'Montserrat-SemiBoldItalic';
    src: url('/fonts/Montserrat/Montserrat-SemiBoldItalic.ttf');
}

@font-face {
    font-family: 'Montserrat-Thin';
    src: url('/fonts/Montserrat/Montserrat-Thin.ttf');
}

@font-face {
    font-family: 'Montserrat-ThinItalic';
    src: url('/fonts/Montserrat/Montserrat-ThinItalic.ttf');
}

@font-face {
    font-family: 'FrankRuhlLibre-Black';
    src: url('/fonts/FrankRuhLibre/FrankRuhlLibre-Black.ttf');
}

@font-face {
    font-family: 'FrankRuhlLibre-Bold';
    src: url('/fonts/FrankRuhLibre/FrankRuhlLibre-Bold.ttf');
}

@font-face {
    font-family: 'FrankRuhlLibre-Light';
    src: url('/fonts/FrankRuhLibre/FrankRuhlLibre-Light.ttf');
}

@font-face {
    font-family: 'FrankRuhlLibre-Medium';
    src: url('/fonts/FrankRuhLibre/FrankRuhlLibre-Medium.ttf');
}

@font-face {
    font-family: 'FrankRuhlLibre-Regular';
    src: url('/fonts/FrankRuhLibre/FrankRuhlLibre-Regular.ttf');
}

@font-face {
    font-family: 'FrankRuhlLibre';
    src: url('/fonts/FrankRuhLibre/FrankRuhlLibre-Regular.ttf');
}

@font-face {
    font-family: 'materialdesignicons-webfont';
    src: url('/fonts/icons/materialdesignicons-webfont.ttf');
}

@font-face {
    font-family: 'MaterialIcons-Regular';
    src: url('/fonts/icons/MaterialIcons-Regular.ttf');
}

body {
    margin: 0;
    padding: 112px 0 0 0;
    font-family: 'Montserrat', sans-serif;
    text-rendering: optimizeLegibility;
    font-kerning: normal;
    font-variant-ligatures: common-ligatures contextual;
    font-feature-settings: "kern", "liga", "clig", "calt";
    touch-action: manipulation;
    box-sizing: border-box;
}

a {
    color: #F9AD19;
}

img {
    border: 0;
}

.material-icons {
    font-family: MaterialIcons-Regular;
    font-style: normal;
}

.navbar .nav-item .dropdown-menu {
    background: rgba(61,64,66,0.90) !important;
}

.navbar .nav-item .dropdown-item {
    color: rgba(255,255,255,.5) !important;
}

    .navbar .nav-item .dropdown-item:hover {
        color: #F9AE19 !important;
        background: rgba(61,64,66,0.90) !important;
    }

.navbar .about {
    padding: 0 20px;
}

.navbar .nav-item .nav-link {
    font-family: FrankRuhlLibre-Bold !important;
    font-size: 17px !important;
    color: #FFFFFF !important;
}

    .navbar .nav-item .nav-link:hover {
        color: #F9AE19 !important;
    }

@media all and (min-width: 992px) {
    .navbar .nav-item .dropdown-menu {
        display: none;
    }

    .navbar .nav-item:hover .nav-link {
    }

    .navbar .nav-item:hover .dropdown-menu {
        display: block;
    }

    .navbar .nav-item .dropdown-menu {
        margin-top: 0;
    }
}

#header {
    position: fixed;
    width: 1400px;
    height: 112px;
    width: 100%;
    top: 0;
    /*margin: 0 0 0 -555px;
    left: 50%;
    top: 0px;*/
    /*background: #3d4042;*/
    z-index: 99999;
}


.headerDivider {
    border-left: 1px solid #9e9fa0;
    margin: 0 40px;
}

.headerLink {
    display: block;
    font-family: FrankRuhlLibre-Bold;
    font-size: 17px;
    color: #FFFFFF;
    letter-spacing: 0;
    line-height: 28px;
    text-decoration: none;
}

#header .logo {
    display: block;
    float: left;
    padding: 10px 0 0 105px;
}

    #header .logo img {
    }

        #header .logo img.logo-big {
            display: inline;
        }

        #header .logo img.logo-small {
            display: none;
        }

#header.compact {
    height: 112px;
}

    #header.compact .logo img {
    }

        #header.compact .logo img.logo-big {
            display: none;
        }

        #header.compact .logo img.logo-small {
            display: inline;
        }

#header #main-nav {
    display: block;
    margin-top: 40px;
    float: right;
}

    #header #main-nav div.li {
        float: left;
        position: relative;
    }

        #header #main-nav div.li a {
            display: block;
            font-family: FrankRuhlLibre-Bold;
            font-size: 17px;
            color: #FFFFFF;
            letter-spacing: 0;
            line-height: 28px;
            text-decoration: none;
            padding-left: 20px;
        }

            #header #main-nav div.li a .arrow {
                font-size: 16px;
                vertical-align: middle;
            }

            #header #main-nav div.li a:hover,
            #header #main-nav div.li.current a {
                color: #F9AE19;
            }

        #header #main-nav div.li i {
            display: inline;
        }

#ResponsiveMenuTrigger {
    position: absolute;
    display: none;
    right: 50px;
    top: 30px;
    text-decoration: none;
}

    #ResponsiveMenuTrigger i {
        color: #FFFFFF;
        font-size: 38px;
    }

#header #main-nav .sub-nav {
    position: absolute;
    top: 20px;
    left: 0;
    background: rgba(61,64,66,0.90);
    list-style: none;
    padding: 15px 40px 20px 20px;
    display: none;
}

    #header #main-nav .sub-nav li {
        padding-right: 0;
    }

        #header #main-nav .sub-nav li a {
            display: block;
            padding-left: 0px;
            white-space: nowrap;
            font-family: FrankRuhlLibre-Black;
            font-size: 14px;
            color: #FFFFFF;
            letter-spacing: 0;
            line-height: 28px;
        }

            #header #main-nav .sub-nav li a:hover,
            #header #main-nav .sub-nav li a.current {
                color: #F9AE19;
            }

.submenu-buttons:hover {
    color: #F9AE19;
    border-color: #F9AE19;
}

.submenu-buttons-inv:hover {
    color: #F9AE19;
    border-color: #F9AE19;
    background: white;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #header #main-nav div.li {
        display: table-cell;
        max-width: 150px;
        width: auto;
    }

        #header #main-nav div.li.li-about {
            max-width: 100px;
        }
}

.header-buttons {
    margin: 40px 140px 0 30px;
    float: right;
    border-left: 1px solid #9e9fa0;
}

#paypal-button {
    display: inline-block;
}

.divSubscribe {
    display: inline;
    position: relative;
    padding-left: 18px;
}

#footer {
    height: auto;
    background: #3d4042;
}

    #footer .logo {
        display: block;
        padding: 60px 0;
    }

        #footer .logo img {
        }

    #footer .img-map {
        margin: 0 20px 53px 0;
    }

    #footer .footer-content {
        float: right; /*border-top: 1px solid #696a6b;*/
        width: 70%;
        color: #FFFFFF;
        letter-spacing: 0;
        padding: 20px 0;
    }

        #footer .footer-content .address {
            font-family: FrankRuhlLibre-Bold;
            font-size: 14px;
            line-height: 14px;
            margin-bottom: 25px;
        }

        #footer .footer-content .phone-email {
            font-family: Montserrat-SemiBold;
            font-size: 12px;
            line-height: 20px;
        }

            #footer .footer-content .phone-email a {
                color: #FFFFFF;
                text-decoration: none;
            }

                #footer .footer-content .phone-email a:hover {
                    text-decoration: underline;
                }

            #footer .footer-content .phone-email span {
                font-family: FrankRuhlLibre-Regular;
                font-size: 12px;
                color: #F9AE19;
            }

        #footer .footer-content .sub-address-text {
            font-family: FrankRuhlLibre-Regular;
            font-size: 9px;
            color: #D0D0D0;
            letter-spacing: 0.8px;
            line-height: 9px;
        }

        #footer .footer-content .menu-header {
            font-family: Montserrat-Regular;
            font-size: 12px;
            color: #FFFFFF;
            letter-spacing: 0.8px;
            line-height: 20px;
        }

        #footer .footer-content .menu-item {
            font-family: Montserrat-SemiBold;
            font-size: 12px;
            color: #FFFFFF;
            letter-spacing: 0.8px;
            line-height: 11px;
        }

        #footer .footer-content .social-area {
            font-family: Montserrat-SemiBold;
            font-size: 10px;
            color: #FFFFFF;
            letter-spacing: 0.8px;
        }

        #footer .footer-content .bottom-text {
            opacity: 0.6;
            font-family: Montserrat-SemiBold;
            font-size: 10px;
            color: #FFFFFF;
            letter-spacing: 0.8px;
        }

#subscribe-newsletter {
    height: auto;
    background: #F9AE19;
    font-family: FrankRuhlLibre-Bold;
    font-size: 32px;
    color: #FFFFFF;
    letter-spacing: 0;
    line-height: 28px;
}

    #subscribe-newsletter .content {
        width: 800px;
        padding: 40px 0 50px;
    }

    #subscribe-newsletter input[type="text"],
    #subscribe-newsletter #SubscribeNewsletterThankyouText {
        display: inline-block;
        background-color: #F9AE19;
        margin: 0 25px 10px 50px;
        border: 0;
        border-bottom: 1px solid #FFFFFF;
        font-family: Montserrat-SemiBold;
        font-size: 14px;
        color: #FFFFFF;
        letter-spacing: 1px;
        text-align: center;
        line-height: 18px;
        height: 38px;
        padding: 0;
        width: 280px;
    }

.wide-centered, .outer-content, .title-section {
    
    margin: 0 auto;
}

.content {
    margin: 0 auto;
}

    .content.donation {
        color: #FFF !important;
        position: relative;
    }

        .content.donation h1 {
            color: #FFF !important;
        }

.content-inner {
    width: 792px;
    margin: 0 auto;
}

.breadcrumb {
    display: block;
    list-style: none;
    margin: 0;
    padding: 65px 0 0;
    line-height: 28px;
    background: none !important;
}

    .breadcrumb li {
        display: inline-block;
        font-family: Montserrat-SemiBold;
        color: #F9AE19;
        font-size: 14px;
    }

        .breadcrumb li a {
            font-family: Montserrat-SemiBold;
            color: #F9AE19;
            letter-spacing: 0;
            line-height: 28px;
            text-decoration: none;
        }

            .breadcrumb li a:hover {
                text-decoration: underline;
            }

        .breadcrumb li.active {
            color: #F9AE19;
        }

.title-section {
    background: #f1f1f1;
    border-bottom: 1px solid #d8d8d8; /*margin-bottom:55px;*/
}

h1 {
    font-family: Montserrat-Bold;
    font-size: 48px;
    color: #3D4042;
    letter-spacing: 0;
    line-height: 48px;
    margin: 25px 0 50px;
    padding: 0
}

.clear {
    clear: both;
    height: 1px;
    line-height: 1px;
}

.contact-map-address {
    float: left;
    width: 42%;
    margin-bottom: 35px;
}

    .contact-map-address p {
        padding: 0;
        margin: 0;
    }

.contact-form {
    float: right;
    width: 57%;
    background: #f1f1f1;
    border-top: 1px solid #d8d8d8;
    margin-bottom: 35px !important;
    margin-top: 0 !important;
    padding-top: 50px;
}

    .contact-form .form-fields {
        padding: 0 50px 0 45px;
    }

        .contact-form .form-fields .field,
        .project-detail-form .form-fields .field {
            width: 47%;
            margin-left: 1%
        }

.input-validation-error {
    border-bottom: 1px solid #FF0000 !important;
}

label.input-validation-error {
    border-bottom: inherit !important;
    color: #FF0000 !important;
}

/* Content pages: */

.content-page-splash {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    height: 620px;
}

    .content-page-splash.donation {
        height: 130px !important;
    }

.content-page-splash {
    height: 360px !important;
}

    .content-page-splash .video-icon {
        transform: rotate(-360deg);
        font-family: Material-Design-Icons;
        font-size: 70px;
        color: #F9AE19;
        text-align: center;
    }

    .content-page-splash .title {
        position: absolute;
        width: 400px;
        font-family: FrankRuhlLibre-Bold;
        font-size: 40px;
        color: #FFFFFF;
        letter-spacing: 0;
        text-align: center;
        line-height: 40px;
        padding: 300px 0 0;
        left: 10%;
    }

    .content-page-splash .video-item {
        display: none;
    }

.article {
    margin-top: 75px;
    margin-bottom: 75px;
    font-family: FrankRuhlLibre-Regular;
    font-size: 18px;
    color: #595959;
    letter-spacing: 0.25px;
    line-height: 22px;
    text-align: justify
}

.bullet {
    font-family: Montserrat-SemiBold;
    font-size: 14px;
    color: #5A696C;
    letter-spacing: 0;
    line-height: 28px;
}

    .bullet i {
        transform: rotate(180deg);
        color: #F9AE19;
    }

    .bullet.big-24 {
        font-size: 24px !important;
    }

.article .bullet.big i {
    font-size: 18px;
    vertical-align: bottom;
}

.article .title, .cust-title {
    font-family: FrankRuhlLibre-Bold;
    font-size: 40px;
    color: #3D4042;
    letter-spacing: 0;
    line-height: 40px;
    text-align: left;
}

.article .title {
    margin-bottom: 30px;
}

.article .intro, .cust-intro {
    font-family: FrankRuhlLibre-Regular;
    font-size: 20px;
    color: #595959;
    letter-spacing: 0.25px;
    line-height: 22px;
}

.article .intro {
    padding-bottom: 70px;
    border-bottom: 1px solid #d8d8d8;
    margin-bottom: 20px;
}

}

.article.row-mode .bullet i, .bullet.big i {
    font-size: 20px;
    vertical-align: bottom;
}

.article.row-mode .title {
    float: left;
    width: 510px;
    margin-right: 30px;
    text-align: left;
}

.article.row-mode .title-quote {
    width: 510px;
    margin: auto auto;
    text-align: center;
    color: #FFFFFF;
    font-family: FrankRuhlLibre-Bold;
    font-size: 40px;
    letter-spacing: 0;
    line-height: 40px;
}

.article.row-mode .descr {
    float: left;
    width: 450px;
    margin-right: 10px;
}

    .article.row-mode .descr p {
        margin: 0px;
    }

.article.clipped150 {
    position: relative;
    height: 154px;
    overflow: hidden;
}

.article .fader {
    display: none;
}

.article.clipped150 .fader {
    display: block;
    position: absolute;
    background-image: linear-gradient(to bottom, rgba(255,255,255, 0), rgba(255,255,255, 0) 50%, rgba(255,255,255, 1) 100%);
    top: 0;
    left: 0;
}

.dots-after {
    margin-top: -75px;
    margin-bottom: 55px;
    font-family: FrankRuhlLibre-Regular;
    font-size: 16px;
    color: #595959;
    line-height: 20px;
}

.backgrounded-article {
    background-color: #3D4042;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    padding-top: 140px;
    padding-bottom: 60px;
    margin: 0;
}

    .backgrounded-article .title, .backgrounded-article .descr {
        color: #FFFFFF;
    }

.article.backgrounded-article .title {
    width: 470px;
}

.article.backgrounded-article .descr {
    width: 470px;
    text-align: left;
}

.article.backgrounded-article .content {
    min-height: 160px;
    border-bottom: 1px solid #FFFFFF;
}

.image-gallery {
    background: #f1f1f1;
    padding: 90px 0 85px;
}

    .image-gallery .content {
        background: #FFFFFF;
    }

    .image-gallery .info-section {
        float: left;
        width: 340px;
        margin: 45px 25px 25px;
    }

    .image-gallery .gal-label {
        font-family: Montserrat-SemiBold;
        font-size: 14px;
        color: #F9AE19;
        letter-spacing: 0;
        line-height: 28px;
    }

    .image-gallery .gal-title {
        font-family: Montserrat-SemiBold;
        font-size: 40px;
        color: #1D1F24;
        letter-spacing: 0;
        line-height: 40px;
        margin: 105px 0 25px;
    }

    .image-gallery .gal-description {
        font-family: FrankRuhlLibre-Regular;
        font-size: 14px;
        color: #1D1F24;
        letter-spacing: -0.2px;
        line-height: 18px;
    }

    .image-gallery .gal-images {
        float: right;
        width: 792px;
    }

        .image-gallery .gal-images img {
            display: none;
            max-width: 792px;
            max-height: 533px;
        }

            .image-gallery .gal-images img:first-child {
                display: block;
            }

    .image-gallery .img-pointer {
        transform: rotate(180deg);
        background: #EDEDED;
    }

        .image-gallery .img-pointer.active {
            background: #F9AE19;
        }

    .image-gallery.detail-page {
        margin-bottom: 30px;
        background: none;
    }

        .image-gallery.detail-page .gal-images {
            float: none;
            width: 100%;
            letter-spacing: 10px;
        }

            .image-gallery.detail-page .gal-images img {
                display: block;
                float: left;
                max-width: 32%;
                margin: 0 1% 3% 0;
            }

.dp-imageGallery {
    padding: 0 29px;
}

    .dp-imageGallery .gal-images {
        letter-spacing: 10px;
    }

.btn-transparent, .btn-orange, .btn-grey {
    display: block;
    font-family: Montserrat-SemiBold;
    font-size: 14px;
    color: #FFFFFF;
    letter-spacing: 1px;
    text-align: center;
    line-height: 18px;
    text-decoration: none;
    padding: 10px 15px;
}

.btn-transparent {
    border: 1px solid #FFFFFF;
}

.btn-orange {
    background: #F9AE19;
    border: 2px solid #F9AE19;
}

.btn-grey {
    background: #3d4042;
    border: none;
}

.header-buttons .btn-transparent {
    letter-spacing: 0;
    line-height: 28px;
    padding-top: 0;
    padding-bottom: 0;
}

.header-buttons .btn-orange {
    border: 1px solid #F9AE19;
    letter-spacing: 0;
    line-height: 28px;
    padding-top: 0;
    padding-bottom: 0;
}

.image-caption {
    font-family: FrankRuhlLibre-Regular;
    font-size: 16px;
    color: #9e9fa0;
    letter-spacing: 0;
    line-height: 22px;
    text-align: center;
    margin-top: 0;
}

    .image-caption span {
        color: #F9AE19;
    }

    .image-caption p {
        padding: 0;
        margin: 0;
    }

/* ====== DONATION PAGE ======== */
.donationProjects {
}

    .donationProjects .projects-container {
        width: 100%;
        height: auto;
        margin: auto auto;
        display: inline-block;
    }

.don-ecard {
    padding-left: 90px;
}

.projects-container .list-item {
    width: 20% !important;
    cursor: pointer;
}

.projects-container .project-item { /*width: 100%;*/
    display: inline-block;
    position: relative;
    overflow: hidden;
}

.donation .contactForm {
    padding: 50px 0 20px 90px !important;
}

.projects-container .project-image {
    border-radius: 50%;
    width: 130px;
    height: 130px;
    margin: 10px;
}

.project-item .project-select {
    position: absolute; /*background: #F9AE19;*/
    width: 136px;
    height: 137px;
    opacity: 1.0;
    border-radius: 50%;
    left: 5px;
    top: 5px;
    cursor: pointer;
    border: 2px solid #DEDEDE;
}

.projectName {
    width: 80%;
    cursor: pointer;
}

.dp-info {
    font-size: 30px;
    cursor: pointer;
    position: absolute;
    right: 40px;
    top: 150px;
}

.project-selected {
    color: #F9AE19;
    border-color: #F9AE19 !important;
}

.projectSectionTitle {
    font-size: 36px;
    padding: 8px 0 40px 0;
}

.ProjectSectionSubTitle,
.don-title {
    text-decoration: underline;
    font-size: 28px;
    padding-bottom: 30px;
}

.ecard-fields {
    display: none;
}

.projects-container .item-list .grid .list-item {
    position: relative;
}

.customProjectList {
    width: 25%;
    float: right;
    display: inline-block;
    padding: 40px;
    padding-top: 10px;
}

.customProjectSelect {
    display: inline-block;
    width: 100%;
    margin-right: 50px;
    padding-left: 15px;
    margin-bottom: 20px;
    background: #f1f1f1;
    border: 1px solid #d8d8d8;
    height: 180px;
    position: relative;
}

    .customProjectSelect .school {
        color: #F9AE19;
        text-transform: uppercase;
        padding: 15px 0;
        font-size: 14px;
    }

    .customProjectSelect .title {
        font-size: 16px;
        font-weight: 600;
    }

    .customProjectSelect .read-more {
        position: absolute;
        display: block !important;
        bottom: 0;
    }

.customProjectSubTitle {
    display: inline;
    font-size: 20px;
    padding-bottom: 30px;
    text-transform: uppercase;
    font-family: 'FrankRuhlLibre-Regular';
}

/*.customProjectSelect:hover {
    color: #F9AE19;
    cursor: pointer;
}*/

.school-project-image {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.customProject-selected {
    border: 1px solid #F9AE19;
}

.formValidation {
    border: 1px solid red;
    padding: 10px;
}

#paypal-button-container {
    width: 450px;
    margin: 0 auto;
    display: none;
}

.donation {
}

.dotTitle {
    font-size: 16px;
    display: inline;
    position: absolute;
    padding-left: 12px;
}

.don-gift-fields {
    padding: 10px 0;
}

.don-type-radio {
    display: inline;
}

.don-amount-plus,
.don-amount-minus {
    position: absolute;
    width: 5px;
    height: 5px;
}

.don-amount-plus {
    top: -20px
}

.don-amount-minus {
    top: -10px;
}

.don-ecard {
}

.don-ecard-section {
    display: none;
}

.donationSuccessful {
    display: none;
    width: 100%;
    text-align: center;
    padding-top: 100px;
}

.dp_model-inner {
    z-index: 9999;
    width: 60%;
    margin: 140px 20%;
    max-width: 60%;
    background: white;
    border: 2px solid black;
    color: #595959;
}

.dp_model-header {
    height: 80px;
    background: #3d4042;
    position: relative;
}

.dp_model-headerText {
    color: #FFF;
    padding: 20px;
    font-size: 26px;
}

.dp-close {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

.dp-close-inner {
    border: 1px solid black;
    padding: 4px;
    font-size: 22px;
    color: #F9AE19;
}

.dp_model-title {
    background: #f1f1f1;
    border-bottom: 1px solid #d8d8d8;
    padding: 5px 20px; /*border-left: 1px solid black;*/
}

.dp_model-body {
    padding: 20px;
    display: none;
    position: absolute;
    z-index: 9999;
}

.dp-summary {
    height: 450px;
    padding-left: 90px;
    display: inline-block;
    width: 60%;
}

.dp-summary-left {
    display: inline-block;
    width: 60%;
}

.dp-summary-right {
    display: inline-block;
    width: 40%;
}

.fixedBody {
    position: fixed;
}

.completed {
    margin-top: 30px;
}

    .completed span {
        border: 1px solid black;
        padding: 10px;
        width: 100%;
        opacity: 0;
        font-size: 28px;
    }

.contactInformationTitle {
    display: inline;
    font-size: 22px;
    color: #F9AE19;
    padding-bottom: 30px;
    text-transform: uppercase;
    font-family: 'FrankRuhlLibre-Regular';
}

.completed-inner {
    text-align: center;
}

.fadeinout {
    animation: fadeInOut 6s;
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 25;
    }

    90% {
        opacity: 100;
    }

    100% {
        opacity: 0;
    }
}

.modal-body {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background: rgba(0,0,0,0.4);
    display: -webkit-flex;
    display: -ms-flexbox;
    display: none;
    height: 100%;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1337;
}

/* ==============================================================*/

/* Homepage */
.missionStatement {
    padding: 40px;
}

    .missionStatement p {
        padding: 0 20px;
    }

.home-splash {
    height: 603px;
    background-size: cover;
}

    .home-splash .content {
        padding-top: 170px;
    }

    .home-splash .pre-header {
        font-family: Montserrat-Light;
        font-size: 20px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 28px;
    }

    .home-splash .splash-header {
        font-family: Montserrat-SemiBold;
        font-size: 54px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 54px;
    }

    .home-splash .sub-header {
        font-family: FrankRuhlLibre-Regular;
        font-size: 24px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 28px;
        margin-top: 20px;
    }

    .home-splash .left-area {
        width: 460px;
        height: 325px;
        padding-left: 30px;
        position: relative;
    }

        .home-splash .left-area .dots-paging {
            position: absolute;
            bottom: 10px;
        }

            .home-splash .left-area .dots-paging a {
                display: inline-block;
                text-decoration: none;
                font-size: 10px;
                margin-right: 10px;
            }

                .home-splash .left-area .dots-paging a i {
                    color: #FFFFFF
                }

                .home-splash .left-area .dots-paging a.active i {
                    color: #F9AE19
                }

    .home-splash .right-area {
        width: 700px;
        height: 400px;
        float: right;
        background: url('/images/dots.png') no-repeat;
        margin-top: -75px;
    }

    .home-splash .control {
        margin-top: 80px;
        white-space: nowrap;
    }

    .home-splash .hdr-carouselBallContainer {
        margin-top: 50px;
        margin-left: 50px;
    }

.hdr-carouselBalls.selected {
    background-color: #F9AE19;
}

.hdr-carouselBalls {
    display: inline-block;
    cursor: pointer;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #fff;
    margin: 2px 10px;
}

.home-title-section {
    margin-bottom: 40px;
}

    .home-title-section .content {
    }

        .home-title-section .content.article {
            margin-top: 0;
            padding-top: 75px;
        }

        .home-title-section .content.article {
        }

    .home-title-section .article .bullet {
        font-family: Montserrat-SemiBold;
        font-size: 14px;
        color: #5A696C;
        letter-spacing: 0;
        line-height: 28px;
        margin-bottom: 20px;
        background: url('/images/grey-dots.png') repeat-x 120px 10px;
    }

    .home-title-section .content.article .title {
        font-family: FrankRuhlLibre-Black;
        font-size: 48px;
        color: #3D4042;
        letter-spacing: 0;
        line-height: 48px;
    }

.home-project {
    position: relative;
    height: 340px;
    background: #F9AE19;
    width: 49%;
    float: right;
    margin: 0 0 45px 0;
    background-position-x: right;
    background-repeat: no-repeat;
}

    .home-project.first {
        float: left;
    }

    .home-project .bullet {
        margin: 35px 0 0 25px;
        font-family: Montserrat-SemiBold;
        font-size: 14px;
        color: #3D4042;
        letter-spacing: 0;
        line-height: 28px;
    }

    .home-project .title {
        margin: 60px 0 0 25px;
        width: 60%;
        font-family: Montserrat-SemiBold;
        font-size: 32px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 38px;
    }

    .home-project .link {
        position: absolute;
        bottom: 45px;
        left: 25px;
        font-family: Montserrat-SemiBold;
        font-size: 14px;
        color: #FFFFFF;
        letter-spacing: 1px;
        line-height: 18px;
        text-decoration: none;
    }

        .home-project .link i {
            font-family: MaterialIcons-Regular;
            font-size: 21px;
            color: #FFFFFF;
            vertical-align: bottom;
            text-indent: 5px;
        }

    .home-project.wide.coronavirus {
        margin-bottom: 0;
    }

    .home-project.wide {
        width: 100%;
        float: left;
        height: 340px;
        background-color: #5a696c;
        margin-bottom: 95px;
    }


        .home-project.wide .bullet {
            width: 30%;
            color: #f9ae19;
            margin-top: 30px;
        }

        .home-project.wide .title {
            font-size: 32px;
            width: 27%;
            margin-top: 25px;
            margin-bottom: 30px;
        }

        .home-project.wide .intro {
            margin: 0 0 0 25px;
            width: 27%;
            font-family: FrankRuhlLibre-Regular;
            font-size: 14px;
            color: #FFFFFF;
            letter-spacing: 0;
            line-height: 18px;
        }

        .home-project.wide .link {
            width: 27%
        }

.responsibilty {
}

.bottom-splash {
    background-size: cover;
    background-repeat: no-repeat;
    height: 432px;
    /*width: 100%;*/
    margin-bottom: 0;
}

    .bottom-splash .title {
        font-family: FrankRuhlLibre-Black;
        font-size: 48px;
        color: #FFFFFF;
        letter-spacing: 0;
        text-align: center;
        line-height: 48px;
        padding-top: 333px;
    }

.home-news-section.title-section,
.home-projects-section.title-section,
.home-video-section {
    border-bottom: none;
}

.home-news-section, .home-projects-section, .home-video-section {
    margin-top: 0;
    margin-bottom: 0;
    padding: 60px 0 40px;
}

    .home-news-section .title,
    .home-projects-section .title,
    .home-video-section .title {
        margin-bottom: 45px
    }

    .home-news-section .item-list .content,
    .home-projects-section .item-list .content,
    .home-video-section .item-list .content {
        padding: 0;
    }

.achievements {
    height: 560px;
    background-color: #D8D8D8;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
}

    .achievements .content {
        padding-top: 120px;
        max-height: 440px;
        height: 350px;
    }

    .achievements .title {
        font-family: FrankRuhlLibre-Bold;
        font-size: 40px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 40px;
        text-align: left;
        margin-bottom: 90px;
    }

    .achievements .section {
        float: left;
        width: 32%;
        border-left: 1px solid #FFFFFF;
        color: #FFFFFF;
    }

    .achievements .number,
    .achievements-number {
        font-family: FrankRuhlLibre-Bold;
        font-size: 50px;
        color: #FFFFFF;
        letter-spacing: -0.42px;
        line-height: 48px;
        margin: 0 35px;
        height: 50px;
        overflow: hidden;
    }

    .achievements-section-title,
    .achievements .section-title {
        font-family: Montserrat-SemiBold;
        font-size: 32px;
        color: #F9AE19;
        letter-spacing: 0;
        line-height: 32px;
        margin: 0 35px;
        height: 100px;
        max-height: 100px;
        overflow: hidden;
    }

    .achievements-section-text,
    .achievements .text {
        font-family: FrankRuhlLibre-Regular;
        font-size: 16px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 18px;
        margin: 0 35px;
        max-height: 90px;
        overflow: hidden;
    }

/* Project list & detail: */
.project-splash {
    height: 650px;
    background-color: #3D4042;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
}

    .project-splash .content {
        padding-top: 200px;
        height: 340px;
    }

    .project-splash .pre-header {
        font-family: Montserrat-Light;
        font-size: 20px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 28px;
    }

    .project-splash .header {
        font-family: Montserrat-SemiBold;
        font-size: 54px;
        color: #F9AE19;
        letter-spacing: 0;
        line-height: 54px;
    }

    .project-splash .sub-header {
        font-family: FrankRuhlLibre-Regular;
        font-size: 24px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 28px;
        margin-top: 60px;
    }

    .project-splash .breadcrumb-container {
        width: 1190px;
        margin: 0 auto; /*border-top:1px solid #FFF;*/
        padding-top: 180px;
    }

        .project-splash .breadcrumb-container .breadcrumb {
            padding-top: 0px;
            padding-left: 50px;
        }

            .project-splash .breadcrumb-container .breadcrumb li a,
            .project-splash .breadcrumb-container .breadcrumb li.active {
                color: #FFFFFF;
            }

.generic-intro {
    margin: 100px auto 70px;
    padding-bottom: 55px;
    border-bottom: 1px solid #dddddd;
    font-family: FrankRuhlLibre-Regular;
    font-size: 20px;
    color: #595959;
    letter-spacing: 0.25px;
    line-height: 22px;
}

    .generic-intro .detailpage-left-column {
        text-align: justify;
        border-right: 1px solid #dddddd;
        padding-right: 4%;
    }

.generic-header {
    font-family: Montserrat-SemiBold;
    font-size: 32px;
    color: #F9AE19;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 20px;
    padding: 0 !important;
}

.item-list {
    background: #f1f1f1;
}

    .item-list .content {
        padding-top: 50px;
        padding-bottom: 75px;
    }

    .item-list .list-item-row {
        clear: both;
        display: flex;
    }

    .item-list .list-item {
        background: #FFFFFF;
        width: 32%;
        /*float: left;
        margin: 0 0 8px 8px;*/
        /*flex: 1;*/
    }

    .item-list .grid .list-item {
        background: #FFFFFF;
        width: 32%;
    }

    .item-list .list-item .thumb-image {
        width: 100%;
        max-width: 100%;
    }

    .item-list .list-item .inner {
        position: relative;
        padding: 30px 25px 20px;
        background: #fff;
    }

    .item-list .list-item .label {
        font-family: Montserrat-SemiBold;
        font-size: 18px;
        color: #F9AE19;
        letter-spacing: 0;
        line-height: 28px;
    }

        .item-list .list-item .label.orangebg {
            color: #FFFFFF;
            background: #F9AE19;
            padding: 0 10px;
        }

    .item-list .list-item .title {
        display: block;
        font-family: Montserrat-SemiBold;
        font-size: 24px;
        color: #1D1F24;
        letter-spacing: -0.2px;
        line-height: 30px;
        margin: 0 0 60px 0;
        text-decoration: none;
        word-break: break-word
    }

    .item-list .list-item .date {
        position: absolute;
        left: 25px;
        bottom: 20px;
        font-family: FrankRuhlLibre-Regular;
        color: #1D1F24;
        font-size: 14px;
        letter-spacing: 0;
        line-height: 26px;
        border-top: 1px solid #D8D8D8;
    }

    .item-list .list-item .arrow {
        position: absolute;
        right: 25px;
        bottom: 20px;
        font-family: MaterialIcons-Regular;
        font-size: 21px;
        color: #3D4042;
        text-decoration: none;
    }

.home-video-section .item-list .list-item {
}

.home-news-section .item-list .list-item,
.home-projects-section .item-list .list-item,
.home-video-section .item-list .list-item {
    background: #f1f1f1;
    margin: 5px 0;
}

    .home-news-section .item-list .list-item .inner,
    .home-projects-section .item-list .list-item .inner,
    {
        min-height: 235px;
    }

    .home-news-section .item-list .list-item .label.orangebg,
    .home-projects-section .item-list .list-item .label.orangebg,
    .home-video-section .item-list .list-item .label.orangebg {
        position: absolute;
        top: 30px;
        left: 25px;
    }

    .home-news-section .item-list .list-item .image-clip,
    .home-projects-section .item-list .list-item .image-clip,
    .home-video-section .item-list .list-item .image-clip {
        height: 130px;
        overflow: hidden;
    }

    .home-news-section .item-list .list-item .title,
    .home-projects-section .item-list .list-item .title,
    .home-video-section .item-list .list-item .title, {
        margin-top: 10px;
        margin-bottom: 30px;
        font-family: Montserrat-Bold;
        font-size: 20px;
    }

    .home-projects-section .item-list .list-item .title {
        margin-top: 0px;
    }

.item-properties {
    list-style: none;
    padding: 0;
}

    .item-properties li {
        display: inline-block;
        line-height: 28px;
        font-family: FrankRuhlLibre-Bold;
        font-size: 18px;
        margin-right: 35px;
    }

        .item-properties li span {
            display: inline-block;
            font-family: Montserrat-Bold;
            font-size: 12px;
            text-decoration: none;
            color: #5a696c;
        }

            .item-properties li span.icon-globe {
            }

            .item-properties li span.icon-tag {
            }

            .item-properties li span.icon-category {
            }

.project-detail-form {
    background: url('/images/chairs.jpg') no-repeat right top;
}

.detailpage-left-column {
    float: left;
    width: 66%;
}

    .detailpage-left-column .article {
        margin-top: 0px;
    }

.detailpage-right-column {
    float: right;
    width: 25%;
}

    .detailpage-right-column .grey-item {
        background: #f1f1f1;
        border-bottom: 1px solid #d8d8d8;
        margin-bottom: 15px;
        position: relative;
        padding: 10px 10px 0px;
    }

        .detailpage-right-column .grey-item .label {
            font-family: Montserrat-SemiBold;
            font-size: 12px;
            color: #F9AE19;
            letter-spacing: 0;
            line-height: 28px;
        }

        .detailpage-right-column .grey-item .title {
            display: block;
            font-family: Montserrat-SemiBold;
            font-size: 18px;
            color: #1D1F24;
            letter-spacing: -0.2px;
            line-height: 30px;
            margin: 0 0 60px 0;
            text-decoration: none;
            word-break: break-word
        }

        .detailpage-right-column .grey-item .date {
            position: absolute;
            left: 10px;
            bottom: 20px;
            font-family: FrankRuhlLibre-Regular;
            color: #1D1F24;
            font-size: 14px;
            letter-spacing: 0;
            line-height: 26px;
            border-top: 1px solid #D8D8D8;
            opacity: 0.4;
        }

    .detailpage-left-column .btn-grey,
    .detailpage-right-column .btn-grey {
        float: left;
    }

.read-more, .read-less {
    display: inline-block;
    font-family: FrankRuhlLibre-Regular;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 26px;
    border-bottom: 1px solid #D8D8D8;
    text-decoration: none;
    color: #F9AE19;
    margin-bottom: 20px;
}

.read-more {
    display: none;
}

.traineeshipProjects .label {
    font-family: Montserrat-SemiBold;
    font-size: 18px;
    color: #F9AE19;
    letter-spacing: 0;
    line-height: 28px;
}

.traineeshipProjects .title {
    display: block;
    font-family: Montserrat-SemiBold;
    font-size: 24px;
    color: #1D1F24;
    letter-spacing: -0.2px;
    line-height: 30px;
    margin: 0 0 60px 0;
    text-decoration: none;
    word-break: break-word
}

.traineeshipProjects .projects {
    background: #ffffff;
    margin: 5px;
    padding: 10px;
}

.traineeshipProjects .date {
    position: absolute;
    left: 25px;
    bottom: 20px;
    font-family: FrankRuhlLibre-Regular;
    color: #1D1F24;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 26px;
    border-top: 1px solid #D8D8D8;
}

.traineeshipProjects .arrow {
    position: absolute;
    right: 25px;
    bottom: 20px;
    font-family: MaterialIcons-Regular;
    font-size: 21px;
    color: #3D4042;
    text-decoration: none;
}

/* FILTER styles */
.filters {
    background: #f1f1f1;
    padding-top: 50px;
}

    .filters .selector,
    .filters .input-field {
        position: relative;
        display: inline-block;
        background: #FFFFFF;
        border: 1px solid #DFDFDF;
        font-family: Montserrat-SemiBold;
        font-size: 14px;
        color: #3D4042;
        letter-spacing: 0;
        line-height: 28px;
        width: 160px;
        margin-right: 12px;
    }

        .filters .input-field,
        .filters .selector a.current-item {
            display: block;
            color: #3D4042;
            text-decoration: none;
            padding: 0 10px 0 15px;
            line-height: 45px;
            height: 45px;
            overflow: hidden;
        }

        .filters .selector.date-range {
            overflow: hidden;
        }

    .filters .input-field {
        display: inline-block;
        vertical-align: top;
        margin-right: 0;
        height: 45px;
    }

        .filters .input-field.dates-field {
            width: 100%;
            position: absolute;
            left: 0;
            top: 0;
            opacity: 0;
        }

    .filters .selector i.material-icons {
        position: absolute;
        right: 10px;
        top: 8px;
        color: #F9AE19;
        font-size: 16px;
    }

    .filters .selector .items {
        display: none;
        position: absolute;
        left: 0;
        margin: 0;
        padding: 0;
        list-style: none;
        width: auto;
        max-width: 550px;
        z-index: 999999;
        max-height: 300px;
        overflow-y: auto
    }

        .filters .selector .items li {
        }

            .filters .selector .items li a {
                display: block;
                color: #3D4042;
                text-decoration: none;
                background: #636363;
                font-family: FrankRuhlLibre-Bold;
                font-size: 14px;
                letter-spacing: 0;
                color: #ededed;
                line-height: 32px;
                white-space: nowrap;
                padding: 0 10px;
            }

                .filters .selector .items li a:hover {
                    background: #7D7D7D;
                    color: #F9AE19;
                }

    .filters .selected-criteria-container {
        margin-top: 40px;
    }

        .filters .selected-criteria-container .selected-critera {
            font-family: FrankRuhlLibre-Bold;
            font-size: 14px;
            color: #3D4042;
            line-height: 28px;
            display: inline-block;
            margin-right: 30px;
        }

            .filters .selected-criteria-container .selected-critera a {
                text-decoration: none;
            }

            .filters .selected-criteria-container .selected-critera i {
                font-size: 20px;
                color: #F9AE19;
                vertical-align: bottom;
            }

.cor {
    background: #5a696c;
    margin: 0 0px;
    font-family: Montserrat-SemiBold;
    font-size: 32px;
    color: #FFFFFF;
    letter-spacing: 0;
    line-height: 38px;
}

/* =============================== APPLY NOW PAGE ==================================================================*/
.applyNowPage {
    font-family: FrankRuhlLibre-Regular;
}

.topBanner {
    margin-right: -13px;
    text-align: right;
}

    .topBanner img {
        width: 100%;
    }

.applyNowPage .summary {
    margin-top: 30px;
}

.applyNowPage .listTitle {
    color: #F9AE19;
    font-weight: 700;
    font-size: 20px;
    text-decoration: underline;
}

/* =============================== TEAM PAGE ==================================================================*/
.team {
    background: #f1f1f1;
    border-bottom: 1px solid #d8d8d8;
    margin-bottom: 55px;
    padding: 20px;
}

.teamBox {
    border: 2px outset #f6f6f6;
    text-align: center;
}

.tl_member-divider {
    border-bottom: 1px solid #d8d8d8;
    width: 50%;
    margin: auto;
    padding-top: 10px;
}

.tl_member-image {
    width: 150px;
    height: 150px;
    border-radius: 50%;
}

/* =============================================================================================================*/
/* FORM FIELDS */

.form-fields {
    margin-bottom: 80px;
}

    .form-fields .field {
        float: left;
        width: 31%;
        padding: 0 2% 10px 0;
    }

.umbraco-forms-field {
    float: left;
    width: 48%;
    padding: 0 2% 10px 0;
}

.form-fields .field label,
.umbraco-forms-field {
    display: block;
    font-family: Montserrat-SemiBold;
    font-size: 14px;
    color: #5A696C;
    letter-spacing: 0;
    line-height: 28px;
    text-transform: uppercase
}

    .form-fields .field input[type="text"],
    .form-fields .field select,
    .form-fields .field textarea,
    .umbraco-forms-field input[type="text"],
    .umbraco-forms-field select,
    .umbraco-forms-field textarea {
        border: none;
        border-bottom: 1px solid #979899;
        font-family: FrankRuhlLibre-Bold;
        font-size: 19px;
        color: #F9AE19;
        letter-spacing: 0;
        line-height: 28px;
        width: 100%;
        background-color: transparent;
    }

.form-fields .field input[type="checkbox"] {
    float: left;
}

.form-fields .field .checkbox-label,
.form-fields .field input[type="file"] {
    font-family: FrankRuhlLibre-Bold;
    font-size: 16px;
    color: #3D4042;
    letter-spacing: 0;
    line-height: 28px;
    text-transform: none;
}

.form-fields .field .attachment-label {
    position: absolute;
    background: #3D4042;
    padding: 0 20px 0 12px;
}

    .form-fields .field .attachment-label div,
    .form-fields .field .attachment-label label {
        display: block;
        float: left;
        background: #3D4042;
        border: 1px solid #3D4042;
        font-family: Montserrat-SemiBold;
        font-size: 12px;
        color: #FFFFFF;
        letter-spacing: 0;
        line-height: 50px;
        height: 50px;
    }

    .form-fields .field .attachment-label label {
        width: 115px;
    }

.form-fields .field .attachment-field {
    display: block;
    line-height: 55px;
    height: 50px;
    margin-left: 70px;
}

    .form-fields .field .attachment-field input[type="file"] {
        width: 100%
    }

.form-fields .field .attachment-label .material-icons.attachment {
    font-size: 20px;
    color: #F9AE19;
    transform: rotate(90deg);
    height: 50px;
}

.form-fields button,
.form-fields .submit,
.umbraco-forms-navigation input[type="submit"] {
    display: block;
    background: #F9AE19;
    border: none;
    font-family: Montserrat-SemiBold;
    font-size: 14px;
    color: #FFFFFF;
    letter-spacing: 0;
    text-align: center;
    line-height: 50px;
    padding: 0 25px;
    text-transform: uppercase
}

form h3 {
    color: #5a696c;
    text-decoration: underline;
    font-family: FrankRuhlLibre-Bold;
    font-size: 28px;
    letter-spacing: 0;
    line-height: 28px;
    text-align: left;
}

.school-needed-item {
    float: left;
    margin-left: 50px;
    text-align: center;
    max-width: 155px;
}

    .school-needed-item.first {
        margin-left: 0px;
    }

    .school-needed-item .item-image {
        display: block;
        height: 130px;
        width: 130px;
        border-radius: 50%;
        border: 1px solid #dddddd;
        padding: 4px;
    }

        .school-needed-item .item-image img {
            border-radius: 50%;
            width: 100%;
            height: 100%
        }

    .school-needed-item.active .item-image {
        border-color: #F9AE19
    }

    .school-needed-item .item-name {
        font-family: Montserrat-Bold;
        font-size: 18px;
        color: #F9AE19;
        line-height: 28px;
    }

    .school-needed-item .item-detail {
        font-family: FrankRuhlLibre-Bold;
        font-size: 14px;
        color: #3D4042;
        line-height: 22px;
    }

    .school-needed-item .item-order {
        font-family: Montserrat-Bold;
        font-size: 12px;
        color: #aca0a0;
        line-height: 18px;
    }

        .school-needed-item .item-order .minus,
        .school-needed-item .item-order .plus {
            display: inline-block;
            text-decoration: none;
            color: #f1f1f1;
            font-size: 25px;
            line-height: 22px;
            vertical-align: super;
            height: 23px;
            width: 23px;
            background: #aca0a0;
            border-radius: 50%
        }

        .school-needed-item .item-order .order-count {
            display: inline-block;
            font-size: 30px;
            line-height: 30px;
            width: 40px;
            text-align: center;
        }

    .school-needed-item.active .item-order {
        color: #3D4042;
    }

        .school-needed-item.active .item-order .minus,
        .school-needed-item.active .item-order .plus {
            background: #F9AE19;
        }

        .school-needed-item.active .item-order .order-count {
        }

/* Other styles: */

.grey-txt {
    color: #5a696c
}

.orange-txt {
    color: #f9ae19;
}

.borderTopGrey {
    border-top: 1px solid #d8d8d8;
}

.btn-back {
    border: 1px solid #FFFFFF;
    color: #FFFFFF;
    text-decoration: none;
    padding: 10px 15px;
    line-height: 18px;
    font-size: 30px;
    vertical-align: middle;
}

.btn-fwd {
    color: #FFFFFF;
    border: 1px solid #FFFFFF;
    text-decoration: none;
    padding: 10px 15px;
    line-height: 18px;
    font-size: 30px;
    vertical-align: middle;
}

.mrgnTop0 {
    margin-top: 0px;
}

.mrgnTop20 {
    margin-top: 20px;
}

.mrgnTop45 {
    margin-top: 45px;
}

.mrgnTop90 {
    margin-top: 90px;
}

.mrgnRght8 {
    margin-right: 8px;
}

.mrgnRght10 {
    margin-right: 10px;
}

.mrgnRght18 {
    margin-right: 18px;
}

.mrgnRght22 {
    margin-right: 22px;
}

.mrgnBot15 {
    margin-bottom: 15px;
}

.mrgnBot20 {
    margin-bottom: 20px;
}

.mrgnBot40 {
    margin-bottom: 40px;
}

.mrgnBot60 {
    margin-bottom: 60px;
}

.mrgnBot80 {
    margin-bottom: 80px;
}

.padTop20 {
    padding-top: 20px;
}

.inlineBlock {
    display: inline-block;
}

.floatRight {
    float: right;
}

.displayNone, .hidden {
    display: none !important;
}

.displayBlock {
    display: block !important;
}

.column {
    float: left;
}

.w25perc {
    width: 25%;
}

.w40perc {
    width: 40%;
}

.w50perc {
    width: 50%;
}

.w100perc {
    width: 100% !important;
}

.underlined {
    text-decoration: underline;
}

.about-image {
    width: 100%;
    height: 70%;
}


/** =================== MEDIA QUERIES =============================================================================*/

@media screen and (max-width: 1399px) {
    #header, #footer, .wide-centered, .outer-content, .title-section {
        width: 100%;
    }

    #header {
        margin: 0;
        left: 0;
    }
}

@media screen and (max-width: 1189px) {
    .content, .home-splash .left-area {
        width: 98% !important;
        margin-left: 1%;
        margin-right: 1%
    }

    .home-splash .right-area {
        display: none;
    }

    .contact-map-address img {
        width: 420px !important;
        height: auto !important;
    }

    .umbraco-forms-field, .project-splash .breadcrumb-container {
        width: 100%
    }

    .home-project.wide {
        background-position-x: 390px;
    }

    .tl_director-container {
        height: auto;
        padding-bottom: 20px;
    }

    .tl_container-borderbox {
        height: auto;
        border: 0;
    }

    .tl_ambass {
        width: 100%;
        padding-left: 0;
    }

        .tl_ambass .tl_container-borderbox {
        }

    .tl_ambass-c {
        width: 100% !important;
    }
}

@media screen and (max-width: 1070px) {
    /*.projects-container .project-item {width: 25%;}*/
}

@media screen and (max-width: 999px) {
    .home-project {
        float: none !important;
        width: 100%;
    }

    .responsibilty {
        background-position-x: -165px;
    }

    .contact-map-address, .contact-form {
        float: none;
        width: 98% !important;
        margin-left: 1%;
        margin-right: 1%
    }

        .contact-form .form-fields {
            padding: 0 10px 0 10px;
        }

    .project-detail-form {
        background-image: none;
    }

    .item-list .list-item-row {
        display: block;
    }

    .item-list .grid .list-item {
        flex: auto;
    }

    .form-fields .field {
        width: 47%;
    }

        .form-fields .field textarea {
            width: 96%
        }

    .home-project.wide {
        background-position-x: 350px;
    }

        .home-project.wide .title {
            margin-top: 10px;
            margin-bottom: 10px;
            font-size: 24px;
        }

        .home-project.wide .bullet, .home-project.wide .title, .home-project.wide .intro {
            width: 35%
        }

    .customProjectList {
        padding: 50px 40px;
    }

    .tl_ambass-inner {
        width: 350px;
    }
}

@media screen and (max-width: 791px) {
    .bullet {
        font-size: 1rem !important;
    }

    .content-inner {
        width: 98% !important;
        margin-left: 1%;
        margin-right: 1%
    }
}

@media screen and (max-width: 730px) {
    #subscribe-newsletter {
        text-align: center;
    }

        #btnSubscribeNewsletter, #subscribe-newsletter input[type="text"] {
            display: block;
            margin: 10px auto 10px;
        }

    #btnSubscribeNewsletter {
        max-width: 150px;
    }
}

@media screen and (max-width: 630px) {
    .home-project.wide .title, .home-project.wide .bullet, .home-project.wide .intro {
        width: 50%
    }
}

/* NEW ONES - in my eyes should have 3 modes */
/* this is the middle size */
@media screen and (max-width: 1020px) {
    #header #main-nav {
        display: none
    }

    #header .header-buttons {
        float: left;
    }

    #ResponsiveMenuTrigger {
        display: block;
    }

    .header-buttons {
        float: left;
    }

    #header .logo {
        padding-left: 15px;
    }

    .item-list .grid .list-item {
        width: 98% !important;
        margin-left: 1%;
        margin-right: 1%;
    }

    #header #main-nav {
        float: left;
        margin: 0px;
        width: 100%;
        background: #3d4042;
        padding: 0px 0 10px 0;
        position: absolute;
        top: 110px
    }

        #header #main-nav li {
            position: relative;
            text-align: center;
            padding: 10px 0;
        }

            #header #main-nav li a {
                padding-left: 0px;
            }

        #header #main-nav .sub-nav {
            padding: 15px 40px 20px 20px;
            display: none;
            background: #595d5f;
        }

    .project-splash.wide-centered {
        background-position: -80px;
    }
}

@media screen and (max-width: 500px) {
    .header .navbar { position: relative; }
    #header .navbar-toggler { position: absolute; right: 5px;}
    .project-splash .header {
        font-size: 30px;
    }
    .splash-header {
        font-size: 30px !important;
    }
}

@media screen and (max-width: 690px) {
    #header .header-buttons {
        display: none;
        float: left;
        margin: 0px;
        width: 100%;
        background: #3d4042;
        padding: 24px 0 10px 0;
        border-left: 0;
        position: absolute;
        top: 126px;
    }

    .detailpage-left-column,
    .detailpage-right-column,
    .article.row-mode .title,
    .article.row-mode .descr,
    #footer .footer-content,
    .form-fields .field {
        float: none;
        width: 98%;
        margin-left: 1%;
        margin-right: 1%
    }

    h1 {
        font-size: 28px;
        line-height: 28px;
    }

    .item-list .list-item .title {
        font-size: 18px;
        line-height: 20px;
    }

    .home-project.wide {
        background-position-x: center;
    }

        .home-project.wide .title, .home-project.wide .bullet, .home-project.wide .intro {
            width: auto;
            margin-right: 25px;
        }

    .filters .selector .items {
        max-width: 320px;
    }

    .project-splash.wide-centered {
        background-position: -380px;
    }

    .dp_model-inner {
        width: 90%;
        margin: 3% 1%;
        height: 75%;
        max-width: 100%;
    }

    .dp_model-header {
        height: 40px;
        line-height: 15px;
        color: #FFF;
    }

    .dp_model-headerText {
        font-size: 17px;
        line-height: 0px;
        padding-top: 10px;
    }

    .dp_model-title {
        padding: 1px 20px 0 10px;
    }

        .dp_model-title h2 {
            font-size: 15px;
        }

    .item-properties {
        margin: 0;
    }

        .item-properties li {
            font-size: 12px;
            line-height: 16px;
        }

    .dp_container {
        height: 100% !important;
    }

    .dp-summary {
        font-size: 13px;
    }

    .icon-globe {
        padding-left: 2px;
    }
}

@media screen and (max-width: 485px) {
    /*.outer-content {width: 465px;}*/
    #ResponsiveMenuTrigger {
        right: 70px;
    }
}

@media screen and (max-width: 390px) {
    #header #main-nav div.li a {
        font-size: 15px;
    }
}

/** =================== end MEDIA QUERIES =============================================================================*/

.reveal-modal-bg {
    position: fixed;
    height: 100%;
    width: 100%;
    background: #000;
    background: rgba(0,0,0,0.45);
    z-index: 98;
    display: none;
    top: 0;
    left: 0;
}

.reveal-modal {
    visibility: hidden;
    display: none;
    position: absolute;
    left: 50%;
    z-index: 99;
    height: auto;
    margin-left: -30%;
    width: 60%;
    background-color: #fff;
    padding: 2rem;
    border: solid 1px #666;
    box-shadow: 0 0 10px rgba(0,0,0,0.4);
    top: 10rem;
}

.reveal-modal-inner {
    position: relative;
}

.stats {
    margin-top: 110px;
    display: inline-block;
    margin-bottom: 50px;
    width: 33%;
    text-align: center;
    float: left;
    position: relative;
}

    .stats:not(:first-child):after {
        content: '';
        position: absolute;
        border-left: 1px solid #fff;
        height: 200px;
        left: 0;
        top: 0;
    }

    .stats .number {
        font-size: 50px;
        color: #fff;
        margin-top: 10px;
    }

    .stats .title {
        color: #F9AE19;
        font-size: 30px;
    }

    .stats .summary {
        color: #fff;
        margin-top: 10px;
    }

.statsImageContainer {
    height: 420px;
}

.videoSection {
    background: #fff;
    margin-bottom: 45px;
}

.videos {
    display: inline-block;
    padding: 0 10px;
    box-sizing: border-box;
    border: 1px solid #f1f1f1;
    width: 100%;
}

    .videos .image {
        width: 100%;
        height: 100%;
        margin-top: 5px;
    }

        .videos .image img {
            max-height: 100%;
            max-width: 100%;
        }

    .videos .subtitle {
        padding: 10px 0 0 20px;
    }

    .videos .title {
        padding: 3px 0 0 20px;
    }

    .videos .summary,
    .videos .link {
        padding: 0px 0 0 20px;
    }

    .videos .title {
        height: 50px;
    }

    .videos .summary {
        margin-bottom: 15px;
    }

    .videos .link {
        height: 40px;
        padding-top: 10px;
    }

.home-video-section .grid {
    display: flex;
    padding: 0 7%;
}

.home-video-section .item-list .list-item .inner {
    position: relative;
    padding: 0;
}

.videos .subtitle {
    color: #F9AE19;
}

.videos .subtitle {
    font-size: 18px;
    font-weight: 600;
}

.videos .title {
    font-size: 22px;
    font-weight: 600;
}

.videos .link .videoLink {
    display: block;
    font-family: Montserrat-SemiBold;
    font-size: 14px;
    color: #F9AE19;
    letter-spacing: 1px;
    text-align: center;
    text-decoration: none;
}

.applyNowContainer {
    margin-right: 40px;
}

.applyNow {
    background: rgb(249,174,25);
    background: linear-gradient(180deg, rgba(249,174,25,1) 35%, rgba(210,172,96,1) 100%);
    font-family: FrankRuhlLibre-Bold;
    font-size: 17px;
    color: #FFFFFF;
    letter-spacing: 0;
    line-height: 28px;
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 5px;
    border: 1px solid #5e95c6;
    width: 130px;
}

    .applyNow:hover {
        opacity: 0.7
    }

.projectItem {
    background: #ffffff;
    padding: 20px;
    margin: 30px;
}

.projectItemsHeader {
    background: #f1f1f1;
    padding: 30px;
}

    .projectItemsHeader .header {
        font-family: Montserrat-SemiBold;
        font-size: 32px;
        color: #F9AE19;
        letter-spacing: 0;
        line-height: 32px;
        /* margin-bottom: 20px; */
        padding: 0 !important;
    }

.projectItem .label {
    font-family: Montserrat-SemiBold;
    font-size: 18px;
    color: #F9AE19;
    letter-spacing: 0;
    line-height: 28px;
}

.projectItem .date {
    /*position: fixed;*/
    bottom: 50px;
    display: inline-block;
    width: 100%;
}

    .projectItem .date .datevalue {
        display: inline-block;
        border-top: 1px solid #D8D8D8;
        padding-top: 11px;
    }

    .projectItem .date .arrow {
        display: inline-block;
        margin-left: 20px;
    }

.projectItem .title {
    display: block;
    font-family: Montserrat-SemiBold;
    font-size: 24px;
    color: #1D1F24;
    letter-spacing: -0.2px;
    line-height: 30px;
    margin: 0 0 60px 0;
    text-decoration: none;
    word-break: break-word;
}

.lSPager {
    background: #f1f1f1;
    margin-top: -20px !important;
}

.project-splash__responsive {
    background-color: #F4F6F5;
}

.project-splash__responsive .breadcrumb-container .breadcrumb li.active {
    color: #F9AE19 !important;
}
.project-splash__responsive .breadcrumb-container .breadcrumb li a {
    color: #F9AE19 !important;
}

.project-splash__image {
    position: absolute;
    top: -99px;
}
.project-splash__image img {
    width: 320px;
}


@media (max-width: 1200px) {
    .splash-responsive {
        background-position-x: -190px;
        background-color: #F4F6F5;
    }
}

@media (max-width: 991.98px) {
    .splash-responsive {
        background-position-x: -400px;
        background-position-y: 160px;
        background-color: #F4F6F5;
    }

    .project-splash__image img {
        width: 280px;
    }
    .project-splash__image {
        top: -49px;
    }

    .project-splash .content {
        padding-top: 90px;
    }
}

@media (max-width: 767.98px) {
    .splash-responsive {
        background-position-x: -580px;
        background-position-y: 160px;
        background-color: #F4F6F5;
    }
}

@media (max-width: 550px) {
    .splash-responsive .content {
        padding-top: 50px;
    }
    .splash-responsive {

    }
}

/* young professions in development */
.ypd {
    margin-top: 50px;
}
.ypd__top {

}
.ypd__title { font-size: 32px; font-weight: 700; line-height: 150px; }

.ypd__main-text {
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.21);
    padding: 20px;
    width: 630px;
    top: 190px;
    right: 0;
    position: absolute;
    background: #FFFFFF;
}

.ypd__main {
    position: relative;
    margin: 50px 0;
}

.ypd__main-image {
    width: 50%;
}

.boxItems {
    display: grid;
    grid-template-columns: repeat(3, 33%);
    grid-gap: 1em 1em;
    grid-auto-flow: row dense;
}

.boxItems .boxItem {
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.21);
    padding: 20px;
}

.boxItems .boxItem p.title {
    font-weight: 700;
	height: 50px;
}

.boxItems .boxItem .apply {
    color: #5ABABD;
}

.boxItems .boxItem .apply a {
    color: #5ABABD !important;
    text-decoration: underline;
}

.bottomSection {
    margin: 50px 0;
}

.inCoop {
    color: #E97D49;
    text-align: center;
}

.ibff-logo-container {

    text-align: center;
    width: 380px;
    margin: 20px auto;
}

.middleText { margin-top: 50px}

@media (max-width: 1200px) {
    .ypd__main {
        margin-bottom: 120px;
    }   
}

@media (max-width: 1000px) {
    .ypd__main-text {
        top: 150px;
    }
}

@media (max-width: 768px) {
    .ypd__title {
        font-size: 32px;
        font-weight: 700;
        line-height: 34px;
        margin-bottom: 30px;
    }

    .ypd__main {
        margin: 0;
    }

    .ypd__main-image {
        width: 100%;
    }

    .ypd__main-text {
        position: relative;
        width: 100% !important;
        top: 0 !important;
    }

    .boxItems {
        grid-template-columns: 1fr;
    }
}