/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx 
   NYKOPINGSGYMNASIUM.SE | NYKOPING 3.0 | STYLES
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx|xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */


/* HEADER LOGO =============== */
.header-logo {
    width: 224px;
    margin: 14px 0 0 0;
}


/* MAIN NAV ================== */
.main-nav {
    padding: 0 18px 0 0;
}


/* GRID | INTRO BOXES ======== */

/*
.intro-boxes {
    display: flex;
    display: -ms-flexbox;
    flex-flow: row wrap;
}

    .intro-boxes .col-1 {
        order: 2;
    }

    .intro-boxes .col-2 {
        order: 1;
    }

    .intro-boxes .col-3 {
        order: 3;
    }
*/

/* LB | EDUCATIONS ----------- */
.link-box.educations .head {
    background: #c5361d;
}



.link-box.educations .body a:hover {
    color: #c5361d !important;
}

/* LB | STUDENTS ------------------ */
.link-box.students {
    margin: 0 0 34px;
}

    .link-box.students .head {
        /*background: #f37c05;*/
    }


    .link-box.students .body a:hover {
        /*color: #f37c05 !important;*/
    }

/* LB | E-SERVICE ------------ */
.link-box.eservice {
    margin: 0 0 34px;
}

/* INDEX PUSH BOX ============ */
.index-push-box {
    max-width: 100%;
}

/* BUTTONS =================== */
.intro-boxes .btn-text {
    display: block;
}

    .intro-boxes .btn-text:not(:first-child) {
        margin-top: 0px;
    }

    .intro-boxes .btn-text.job:hover {
        background: #318dd4 !important;
    }


/* ========================================================================== 
   RESPONSIVE 
================================|========================================= */

@media screen and (max-width: 1320px) {

    .header-logo {
        margin: 14px 0 0 19px;
    }
}

@media screen and (max-width: 1200px) {

    .main-nav {
        padding: 0;
    }
}

@media screen and (max-width: 1024px) {

    #header {
        height: 100px;
    }

    .header-logo {
        width: 200px;
        margin: 13px 0 0 20px;
    }

    .header-top-menu,
    .header-search-btn,
    #lb-search .box {
        top: 25px;
    }
}

@media screen and (max-width: 960px) {

    .contact-box .row.colspace {
        margin: 0 -20px;
    }

        .contact-box .row.colspace > .col,
        .contact-box .row.colspace > [class*="-col"],
        .contact-box .row.colspace > [class*="col-"] {
            padding-left: 20px;
            padding-right: 20px;
        }

    .contact-box .content .col {
        width: 50%;
    }
}

@media screen and (max-width: 880px) {

    .intro-boxes .col-3 {
        margin-top: 20px;
    }
}

@media screen and (max-width: 800px) {


    #header {
        height: 90px;
    }

    .header-logo {
        width: 180px;
    }

    .header-top-menu,
    .header-search-btn,
    #lb-search .box {
        top: 20px;
    }
}

@media screen and (max-width: 640px) {

    .sub-main td {
        display: block;
        width: 100% !important;
        padding: 0 10px 10px;
    }

        .sub-main td:first-child {
            padding: 10px 10px 0 !important;
        }
}

@media screen and (max-width: 560px) {


    #header {
        height: 80px;
    }

    .header-logo {
        width: 160px;
        margin: 11px 0 0 20px;
    }

    .header-top-menu,
    .header-search-btn {
        top: 15px;
    }

    #lb-search .box {
        top: 10px;
        width: 100%;
        height: 60px;
        padding: 10px 0 10px 50px;
    }

    .intro-boxes .col-1 {
        order: 1;
        padding-bottom: 20px;
    }

    .intro-boxes .col-2 {
        order: 2;
        padding-bottom: 20px;
    }

    .intro-boxes .col-3 {
        order: 3;
    }
}

@media screen and (max-width: 480px) {

    .header-logo {
        margin: 11px 0 0 18px;
    }
}

@media screen and (max-width: 440px) {

    .contact-box .content .col {
        width: 100%;
    }
}

@media screen and (max-width: 360px) {

    #header {
        height: 70px;
    }

    .header-logo {
        width: 140px;
        margin: 10px 0 0 15px;
    }

    .header-top-menu,
    .header-search-btn {
        top: 10px;
    }

    #lb-search .box {
        top: 5px;
    }
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx 
   NYKOPINGSGYMNASIUM.SE | NYKOPING 4.0 | STYLES OVERIDES 2021
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx|xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */


#menuwrap {
    border-color: #000;
}

    #menuwrap:hover {
        background-color: #64aeca !important;
    }

#mega-menu a:hover, #mega-menu h2:hover {
    color: #005f85 !important;
}

@media (min-width: 768px) {
    .spl-top, .spl-top:hover {
        background-color: #64aeca !important;
        color: #000 !important;
    }

        .spl-top:hover, .spl-top a:hover {
            /*
				background-color: #005f85 !important;
			*/
        }

        .spl-top:hover, .spl-top h2:hover {
            /*
				color: #fff !important;
			*/
        }

        .spl-wrap:hover, .spl-wrap h2:hover, .spl-wrap h2, .spl-top a:hover, #importantnews:hover {
            color: #000 !important;
        }
}


.intro-boxes {
    display: flex;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    flex-flow: row wrap;
}

    .intro-boxes .col-1 {
        -ms-flex-order: 2;
        -webkit-order: 2;
        order: 2;
        flex: 1;
    }

    .intro-boxes .col-2 {
        -ms-flex-order: 1;
        -webkit-order: 1;
        order: 1;
        flex: 1;
    }

    .intro-boxes .col-3 {
        -ms-flex-order: 3;
        -webkit-order: 3;
        order: 3;
        flex: 1;
    }



.box.link-box .head, .link-box.eservice .head {
    background: #64aeca;
    color: #000 !important;
}

.link-box.eservice .body a:hover {
    color: #00003a !important;
}

.link-box.eservice .head h3 {
    color: #000 !important;
}

.intro-boxes .red, .intro-boxes .red:hover {
    background: #64aeca !important;
    color: #000 !important;
}

.intro-boxes .btn-text.job, .intro-boxes .btn-text.job:hover {
    background: #00003a !important;
}

.accicon {
    font-size: 22px;
}

.acchead {
    cursor: pointer;
}