/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 1500px), (max-device-width: 1500px) {
    .slider-item .slider-box .slider-border .slider-text { font-size: 25px; }
    .slider-item .slider-box { left: 20%; margin-right: -50%; transform: translate(-20%, -50%); max-width: 300px; }
    .slider-item .slider-box .slider-button { font-size: 20px; padding: 10px; margin: 10px 0; }
}

@media only screen and (max-width: 1400px), (max-device-width: 1400px) {
 #slider { margin-top: -280px; }
}

@media only screen and (max-width: 1280px), (max-device-width: 1280px) {

.wrap2 { width: 100% !important; }
.wrap2 .content, #foot .content { padding-left: 2%; padding-right: 2%; width: 100%; box-sizing: border-box; }


/* hlavička, obsah */
#head .content, #service .content, #personal .content, #contact .content { padding-left: 5%; padding-right: 5%; width: 90%; }
#slider .content, #map .content { padding: 0; width: 100% }
#head .content { padding: 0; width: 100%; }
#content .content { padding: 50px 5%; }
#wrap-menu { padding-right: 10px; }

/* logo */
#logo { margin-right: 30px; }
#logo img { height: 85px; width: auto; /*margin: 15px 0px 0px 15px;*/ margin-top: -5px; }

/* jazykové mutace */
#lang { right: 15px; }

/* telefon */
.phone { right: 15px; }
.phone { left: 15px; }

/* menu */
#menu { width: calc(100% - 200px); width: auto; }
#menu li { margin-right: 22px; }

/* slider */
#slider { background-size: cover; /*margin-top: 137px;*/ }

/* personál */
/*.personal { margin: 25px 50px; }*/

/* před zásahem, po zásahu */
#before, #after { height: 50vh; }
.before-after .title { font-size: 20px; padding: 15px 30px; }

/* photo box + text */
#photo-box, #photo-box .main img { width: 571px; }

/* kontaktní formulář */
#contact-form { padding: 25px; }

/* mesto mody */
.mesto-mody .hash { top: 20px; }
.mesto-mody .left .text { padding-right: 50px; }
.mesto-mody .right .text { padding-left: 50px; }
.mesto-mody img { max-width: 100%; }

#info-panel td { padding: 0 10px; }

}

@media only screen and (max-width: 1200px), (max-device-width: 1200px) {

    .partnership-fashion-night .partnership .h1 { font-size: 20px; }
    #slider { margin-top: -180px; }

}

/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 1050px), (max-device-width: 1050px) {

/* jazykové mutace */
#lang { display: inline-block; float: none; margin: 0 0 0 30px; position: static; }

/* telefon */
.phone { display: inline-block; margin: 0 0 0 30px; position: static; }


/* ikony */
#icons a { font-size: 0.9em; width: 100px; }
#icons .img { height: 100px; width: 100px; }

/* photo box + text */
#photo-box, #photo-box .main img { width: 376px; }

/* kontakt */
#contact .text { display: inline-block; float: none; vertical-align: top; }
#call-woman { display: none; }
#contact-form { float: none; padding: 0; width: 100%; }

/* partnerství fashion night Brno */
.partnership-fashion-night .partnership { /*width: calc(33% - 72px);*/ }
.partnership-fashion-night .partnership .h1 { font-size: 20px; }

#subpage .content { min-height: auto; }

/* hlavička */
#head { padding: 0; min-height: 85px; }
#head.open { position: fixed; }
/*#head .content { text-align: center; background-color: black; }*/

/* logo */
#logo { float: none; text-align: left; font-size: 1.5em; background: transparent; margin-top: 30px; }

/* menu */
#wrap-menu { float: left; }
#wrap-menu { display: block; width: 100%; padding-left: 10px; padding-bottom: 10px;}
#wrap-menu .line, #wrap-menu .pipe { display: none; }

#menu { display: block; float: none; }
#menu li { display: block; margin: 0; width: calc(100% - 25px); }
#menu li a { background: none; border: 0; display: inline-block; min-width: 0; text-align: left; }
#menu li a.active, #menu li a:hover { background: none; }
#menu li:not(.active) { display: none; }

#menu li.icon { display: inline-block; font-size: 1.25em; padding: 0 0 0 25px; position: absolute; right: 15px; top: 25px; width: auto; }
#menu li.tel-mobile { display: inline-block; font-size: 1.25em; padding: 0 0 0 25px; position: absolute; left: 0px; top: -50px; width: auto; }
#menu li.icon a, #menu li.tel-mobile a { border: none !important; }
#menu.open li { display: block; }
#menu.open li.icon a, #menu.open li.tel-mobile { border: 0; }
#menu.open { margin-top: 85px; }

/* submenu */

#menu .mobile-icon-submenu { display: inline-block;}
#menu li ul { background: none; position: static; visibility: visible; display: none; }

/* menu, submenu - rámeček*/
#menu li a, #menu li ul li a { padding: 6px 0px; line-height: 1.5;}
#menu li ul li a:hover, #menu li ul li a.active { color: var(--gold); }

.table-two-cols-video tr td:first-child, .table-two-cols-video tr td:last-child { display: block; width: 100%; padding-left: 0!important; padding-right: 0!important; }
.table-two-cols-video tr td:first-child {  }
.table-two-cols-video tr td { text-align: center; }

}

@media only screen and (max-width: 900px), (max-device-width: 900px) {

    .partners-logos-box { gap: 25px; margin: 25px 0; }
    .partners-logos-box:first-of-type { grid-template-columns: repeat(2, 1fr); }
    .partners-logos-box:nth-of-type(2) { grid-template-columns: repeat(3, 1fr); }
    .partners-logos-box:nth-of-type(3) { grid-template-columns: repeat(4, 1fr); }
    .partners-logos-box:nth-last-of-type(2) { grid-template-columns: repeat(4, 1fr); }
    .partners-logos-box:last-of-type { grid-template-columns: repeat(5, 1fr); }

}

/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 860px), (max-device-width: 860px) {
    /* pomocné nastavení, že se jedná o resposivním designu */
    .responsive-design { font-size: 1px; }

    .social-network-fixed { top: 100px; }

    /* slider */
    #slider { height: auto; margin-top: 85px; }

    .slider-item .slider-box .slider-border .slider-text { font-size: 25px; }
    /*.slider-item .slider-box { left: 20%; margin-right: -50%; transform: translate(-20%, -50%); max-width: 300px; }*/
    .slider-item .slider-box { left: 20%; margin-right: -50%; transform: translate(-20%, -80%); max-width: 300px; }
    .slider-item .slider-box .slider-button { font-size: 20px; padding: 10px; margin: 10px 0; }

    /* mesto mody */
    .mesto-mody .fashion-city { margin: 30px 0 30px 0; }
    .mesto-mody .left, .mesto-mody .right { width: 100%; display: block; }
    .mesto-mody .left .text { padding-right: 0px; }
    .mesto-mody .right .text { padding-left: 0px; }
    .mesto-mody .right { margin-top: 40px; }

    .partnership-fashion-night #partnership { grid-template-columns: repeat(2, 1fr); }

}

/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 830px), (max-device-width: 830px) {

#kontakty .left, #kontakty .right { width: 100%; box-sizing: border-box;}
#kontakty .right { padding-left: 0; margin-top: 60px; }
#kontakty .fast-contact { margin-bottom: 40px; }

#kontakty .contact-under { display: block; margin-top: 0; }
#kontakty .contact-under .third { margin-bottom: 30px; }
#kontakty .contact-under .third:last-child { margin-bottom: 0; }

#foot { margin-top: 40px; }

}

/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 800px), (max-device-width: 800px) {

/* nadpisy */
h1, .h1, #personal .title, #foot .title { font-size: 24px; margin: 0 0 0.5em 0; }
.partnership-fashion-night h2 { font-size: 20px; margin: 30px 0; }

/* photo box + text */
#photo-box, #photo-box .main img { width: 100%; }
#photo-box { float: none; margin: 0; }

/* kontakty */
#contact-form table tr td { padding: 0 1em 0.75em 0; }

/* kontaktní formulář */
#contact .content { text-align: center; }
#contact-form { margin: 2em 0 0 0; width: 100%; }

/* patička */
#foot .fa { margin: 15px; }
#foot .fa:hover { margin: 0px 5px; }

.table-two-cols tr td:first-child { padding-right: 25px; }
.table-two-cols tr td:last-child { padding-left: 25px; }
#subpage .wrap1 { margin-top: 100px; }

}

@media only screen and (max-width: 700px), (max-device-width: 700px) {

    .partners-logos-box:first-of-type { grid-template-columns: repeat(2, 1fr); }
    .partners-logos-box:nth-of-type(2) { grid-template-columns: repeat(3, 1fr); }
    .partners-logos-box:nth-of-type(3) { grid-template-columns: repeat(3, 1fr); }
    .partners-logos-box:nth-last-of-type(2) { grid-template-columns: repeat(3, 1fr); }
    .partners-logos-box:last-of-type { grid-template-columns: repeat(4, 1fr); }

}

/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 670px), (max-device-width: 670px) {

.partnership-fashion-night .partnership { width: 100%; box-sizing: border-box; margin-bottom: 20px; }
.partnership-fashion-night .partnership .h1 { font-size: 25px; }
.partnership-fashion-night #partnership { margin-bottom: 0; }
.partnership-fashion-night .partnership:nth-last-of-type(1) { margin-bottom: 0; }

#program li:first-child.active .text, #program li:first-child:hover .text { justify-content: left; }
#program li:last-child.active .text, #program li:last-child:hover .text { justify-content: right; }

#foot .flex { display: block; }
#foot .flex .flex-child { margin-bottom: 20px;}
#foot .flex .flex-child:last-child { margin-bottom: 0; }

.partneri .owl-carousel img { max-height: 50px; }

}

/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 550px), (max-device-width: 550px) {

/* obsah */
#content .content { padding: 25px 5%; }

/* tabulka formulář */
.table-form, .table-form tr, .table-form tr td { display: block; width: 100%; }
.table-form table { width: 100%; }
.table-form td input[type="text"], .table-form td input[type="password"], .table-form td textarea { margin: 1px 0; width: 95% !important; }

/* ikony */
#icons a { font-size: 0.7em; margin: 5px 0; width: 80px; }
#icons a .img { height: 80px; margin-bottom: 0.5em; width: 80px; }

/* kontakt */
#contact .text { width: auto; }

/* patička */
#foot .content .block-foot { height: auto; margin-bottom: 5%; width: 100%; }

.table-kangaroo { margin: 0; }
.table-kangaroo, .table-kangaroo thead, .table-kangaroo tbody, .table-kangaroo tr, .table-kangaroo tr td { display: block; height: auto !important; padding: 1em 0; text-align: center !important; width: auto !important; }

/* slider */
.slider-item .slider-box .slider-border .slider-text { font-size: 20px; padding: 0 0 0 15px; }
.slider-item .slider-box .slider-border { padding: 25px 20px; }
/*.slider-item .slider-box { left: 15%; transform: translate(-15%, -50%);  }*/
.slider-item .slider-box { left: 15%; transform: translate(-15%, -80%); }

/* partneri */
.partneri .content { margin-top: 20px; }

/* harmonogram */
#program li { width: 1em; height: 1em; margin: 5px 1px; }


.table-two-cols tr td:first-child, .table-two-cols tr td:last-child { display: block; width: 100%; padding-left: 0; padding-right: 0; }
.table-two-cols tr td:first-child { margin: 20px 0; }
#program .table-two-cols tr:nth-child(2n) { display: none; }

.table-two-cols-video tr td:first-child { margin: 0; display: inline-block; padding-right: 10px!important; vertical-align: top; text-align: justify; vertical-align: top; width: calc(50% - 20px); /* width: calc(50% - 100px); */ }
.table-two-cols-video tr td:last-child { margin: 0; display: inline-block; padding-left: 10px!important; vertical-align: top; text-align: justify; vertical-align: top; width: calc(50% - 20px); /* width: calc(50% - 100px); */ }

}

/*******************************************************************************
 * smaller than XXXpx - start
 *******************************************************************************/

@media only screen and (max-width: 500px), (max-device-width: 500px) {

.partnership-fashion-night #partnership { grid-template-columns: repeat(1, 1fr); }

.partners-logos-box { gap: 10px; margin: 10px 0; }
.partners-logos-box:first-of-type { grid-template-columns: repeat(2, 1fr); }
.partners-logos-box:nth-of-type(2) { grid-template-columns: repeat(3, 1fr); }
.partners-logos-box:nth-of-type(3) { grid-template-columns: repeat(3, 1fr); }
.partners-logos-box:last-of-type { grid-template-columns: repeat(3, 1fr); }

}
