/* ======================================================================
   Kontakty SŠMG v3
   Samostatný stránkový styl. Neovlivňuje ostatní stránky webu.
   Barevnost vychází z aktuální identity školy: tmavě modrá, modrá,
   azurová a žlutý akcent.
   ====================================================================== */

body.contact-page-layout {
    background: #f4f8fb;
}

body.contact-page-layout #header {
    height: auto !important;
    min-height: 0 !important;
}

body.contact-page-layout #header .contact-header-compact {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    border-bottom: 4px solid #f2e51b;
    background: #173553 !important;
    background-image: linear-gradient(110deg, #173553 0%, #0b83c4 72%, #37b9e5 100%) !important;
    background-size: auto !important;
    box-shadow: 0 6px 20px rgba(23, 53, 83, .15);
}

body.contact-page-layout #header .contact-header-compact::before {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    content: none !important;
}

body.contact-page-layout #header .contact-header-compact .edu-navbar {
    position: relative !important;
    margin: 0 !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    background: transparent !important;
}

/* Bílé jsou pouze hlavní položky menu. Původní široký selektor
   obarvil bíle také odkazy v bílém rozbalovacím menu. */
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav > li > a {
    color: #fff;
}

/* Rozbalovací menu musí zůstat čitelné na bílém pozadí. */
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li:first-child,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_2,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_3 {
    background: #fff;
}

body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li > a,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_2 li > a,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_3 li > a {
    color: #173553 !important;
    background: #fff;
    opacity: 1;
    visibility: visible;
}

body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li > a:hover,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li > a:focus,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_2 li > a:hover,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_2 li > a:focus,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_3 li > a:hover,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li .dropdown-list_3 li > a:focus {
    color: #fff !important;
    background: #fec722;
}

body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li > a .menu-icon {
    color: #173553;
}

body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li > a:hover .menu-icon,
body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav li ul.dropdown li > a:focus .menu-icon {
    color: #fff;
}

body.contact-page-layout #header .contact-header-compact .edu-navbar .edu-nav .nav > li > a::before {
    background: #f2e51b;
}

body.contact-page-layout main.contact-page-v2 {
    margin: 0 !important;
    padding: 0 !important;
    background: #f4f8fb;
    color: #173553;
}

.contact-page-v2 .contact-overview {
    padding-top: 52px;
}

.contact-page-v2 .contact-eyebrow,
.contact-page-v2 .contact-person-role {
    color: #087ebc;
}

.contact-page-v2 .contact-section-heading h2,
.contact-page-v2 .contact-panel-heading h2,
.contact-page-v2 .contact-map-heading h2,
.contact-page-v2 .contact-person-heading h3,
.contact-page-v2 .contact-address strong,
.contact-page-v2 .contact-identifiers dd,
.contact-page-v2 .contact-account-card h3,
.contact-page-v2 .contact-account-number,
.contact-page-v2 .contact-detail-link {
    color: #173553;
}

.contact-page-v2 .contact-person-card:hover {
    border-color: #8ed4ef;
    box-shadow: 0 14px 36px rgba(23, 53, 83, .13);
}

.contact-page-v2 .contact-person-card-primary {
    border-top-color: #0b83c4;
}

.contact-page-v2 .contact-person-icon,
.contact-page-v2 .contact-panel-icon {
    background: #e4f5fc;
    color: #087ebc;
}

.contact-page-v2 .contact-detail-link:hover,
.contact-page-v2 .contact-detail-link:focus {
    border-color: #0b83c4;
    background: #eaf7fc;
    color: #173553;
}

.contact-page-v2 .contact-detail-icon {
    color: #087ebc;
}

.contact-page-v2 .contact-map-link {
    border-color: #9ddcf2;
    background: #e8f7fc;
    color: #075f91;
}

.contact-page-v2 .contact-map-link:hover,
.contact-page-v2 .contact-map-link:focus {
    border-color: #0b83c4;
    background: #0b83c4;
    color: #fff;
}

.contact-page-v2 .contact-account-school {
    background: #eaf7fc;
}

.contact-page-v2 .contact-account-school::before {
    background: #0b83c4;
}

.contact-page-v2 .contact-account-friends {
    background: #fffdea;
}

.contact-page-v2 .contact-account-friends::before {
    background: #f2e51b;
}

.contact-page-v2 .contact-payment-note i {
    color: #087ebc;
}

.contact-page-v2 .contact-map-frame {
    border-color: #cde8f3;
    box-shadow: 0 12px 32px rgba(23, 53, 83, .10);
}

@media only screen and (max-width: 991px) {
    body.contact-page-layout #header .contact-header-compact .edu-navbar {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .contact-page-v2 .contact-overview {
        padding-top: 42px;
    }
}

@media only screen and (max-width: 767px) {
    body.contact-page-layout #header .contact-header-compact {
        border-bottom-width: 3px;
    }

    .contact-page-v2 .contact-overview {
        padding-top: 30px;
    }
}