@media all and (max-width: 499px) {
header, .header, .slideshow, .wrapper, footer, .footer, .boxes {
    width: 100%;
}
header {}
.topbg {width:auto;height:400px;left:50%;-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);}
.topbgdiv {overflow-x:hidden;}
.left, .right { margin:0 auto !important;float:none !important;}
.header .logo {float:none;margin:0 auto;display: block;width:80%;padding:15px 0;}
.header .logo img {width:100%;margin:0 auto;}

#nav-trigger {display: block; }
nav#nav-main {display: none; }
nav#nav-mobile {display: block !important; }
.respo {display: block; }
    
.slogan {position:relative;bottom:auto;left:auto;width:90%;margin:-240px auto 0;}
.slogan strong {
    font-size:3em;position:relative;top:auto;left:auto; padding:10px 0;text-align:center;
    -webkit-transform: translate(0, 0);-ms-transform: translate(0, 0);transform: translate(0, 0);
}
.home {position:relative;bottom:auto;right:auto;width:90%;}
.home h1 {font-size: 2em;margin: 0 auto 10px;}
.home:after {top: -2%;left: 2%;width: 34%;height: 30vh;}
    
.gallery-simplebox.gallery-uvod {width:90%;margin: 0 auto;}
.gallery-simplebox.gallery-uvod .gallery-thumb {width: 49%;overflow:hidden;}
.gallery-simplebox.gallery-uvod .gallery-thumb a img {margin:0 auto !important;}
    
.pobockyline h3 {font-size: 2em;}
.pobockyline a {margin: 10px auto;width: 90%;}
.pobockyline a span {font-size: 2.5em;}

.gallery-container, .gallery-cycle, .gallery-slide img {min-height:180px !important}
.slideshow, .gallery-slide, .gallery-image {height:180px !important;min-height:auto;}
.slideshow {margin: 0 auto;}
.gallery-text h2 {display: none;}
.header .contact {display: none;}

.wrapper { width:100%;padding: 20px;}
.main {margin: -20vh auto 0;}
.main.home {margin:-20vh auto 0;}
.main > h1 {font-size: 3em;}
.main section {font-size: 1em;}
.wrapper h1, .home .wrapper h1 { text-align:center; font-size:1.8em; padding:0 0 5px;border-bottom: 1px dotted #182f44;}
section img {display:block !important;margin:10px auto !important;height:auto !important; width:100% !important; float:none !important;}
.main.home h1 {font-size:10vw;margin:15vh auto;}
    
#popup.positioned {width: 100%;}
#popup .zoznam {-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;font-size: 0.75em;}

.gallery-simplebox .gallery-thumb {margin-right:1%; margin-bottom:0;width:48%;}
.gallery-simplebox a {width:100% !important;}
.gallery-simplebox .gallery-thumb:nth-child(2n) { margin-right:0;}
.gallery-simplebox .gallery-thumb a img {margin:0 auto !important;}
  
#tabscontainer {display: block;}
#tabscontainer > [id^="tab-label"] {display: block;width:100%;}
#tabscontainer > [id^="tab-content"] {padding:0;border:8px solid #ecd6b4;}
#tabscontainer .tabgroup>h3 {font-size: 1.5em;}
#tabscontainer .tabitem .nazov {width: 100%;text-align:center;}
#tabscontainer .tabitem .gramaz, #tabscontainer .tabitem .cena {width: 50%;text-align:center;}
#tabscontainer .tabgroup > h3 {padding:6px;background:#f4f4f4;}
#tabscontainer .tabgroup:last-of-type > h3 {margin-top:20px;padding:6px;}
    
.contact-form {width: 100%;}

.footer {height:auto;position:relative;padding:0;background:#442e21;border-top:12px solid #ecd6b4;}
.footer .wrap {padding: 0;}
.footer .wrapper {width: 90%;height:auto;padding: 20px 0;}
.footer .contacts {margin:15px auto 0;padding: 15px;}
.footer .contacts > span {display:block;}
.footer .contacts .telefony {font-size: 4.4vw;padding:10px 0;}
.footer .contacts .adresa {font-size:3.5vw;padding-right: 0;}
.footer .contacts .email {font-size: 4.4vw;display: block;}
.copy {padding: 15px;font-size:0.85em;}
#googleMap {float: none;height:300px;margin: 10px auto 20px;width: 100%;}
    
.contact-form input {
    width: 100%;
    margin: 8px auto;
}
.contact-form .suhlas {
    display: block;
    float: none;
    text-align: center;
    padding: 10px 0;
}

h1, h2, h3, h4, h5, h6 {text-align: center;}
    
#back-top {display: none !important;opacity:0 !important;}
}


@media all and (min-width: 500px) and (max-width: 899px) {
header, .header, .slideshow, .wrapper, footer, .footer, .boxes {
    width: 100%;
}
header {}
.topbg {width:auto;height:400px;left:50%;-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);}
.topbgdiv {overflow-x:hidden;}
.left, .right { margin:0 auto !important;float:none !important;}
.header .logo {float:none;margin:0 auto;display: block;width:50%;}
.header .logo img {width:100%;margin:0 auto;}

#nav-trigger {display: block; }
nav#nav-main {display: none; }
nav#nav-mobile {display: block; }
.respo {display: block; }
    
.slogan {position:relative;bottom:auto;left:auto;width:90%;margin:-240px auto 0;}
.slogan strong {
    font-size:3em;position:relative;top:auto;left:auto; padding:10px 0;text-align:center;
    -webkit-transform: translate(0, 0);-ms-transform: translate(0, 0);transform: translate(0, 0);
}
.home {position:relative;bottom:auto;right:auto;width:90%;}
.main.home h1 {font-size:10vw;margin:5vh auto;}
.home:after {top: -2%;left: 2%;width: 34%;height: 30vh;}
    
.pobockyline h3 {font-size: 2em;}
.pobockyline a {margin: 10px auto;width: 90%;}
.pobockyline a span {font-size: 2.5em;}

.gallery-container, .gallery-cycle, .gallery-slide img {min-height:180px !important}
.slideshow, .gallery-slide, .gallery-image {height:180px !important;min-height:auto;}
.slideshow {margin: 0 auto;}
.gallery-text h2 {display: none;}
.header .contact {display: none;}

.wrapper { width:100%;padding: 20px;}
.main {margin: -20vh auto 0;}
.main > h1 {font-size: 3em;}
.main section {font-size: 1em;}
.wrapper h1, .home .wrapper h1 { text-align:center; font-size:1.8em; padding:0 0 5px;border-bottom: 1px dotted #182f44;}
section img {display:block !important;margin:10px auto !important;height:auto !important; width:100% !important; float:none !important;}
    
#popup.positioned {width: 100%;}
#popup .zoznam {-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;font-size: 0.75em;}
#tabscontainer > [id^="tab-label"] strong {font-size: 1.1em;}

.gallery-simplebox .gallery-thumb {margin-right:1.6%; margin-bottom:1.6%;width:20%;}
.gallery-simplebox a {width:49% !important;}
.gallery-simplebox a img {margin: 0 0 10px 0 !important;}
.gallery-simplebox .gallery-thumb:nth-child(8n) { margin-right:1.6%;}
.gallery-simplebox .gallery-thumb:nth-child(4n) {margin-right:0;}
.gallery-simplebox .gallery-thumb:last-child {margin-right:0;}
    
.gallery-simplebox.gallery-uvod {width:90%;margin: 0 auto;}
.gallery-simplebox.gallery-uvod .gallery-thumb {width: 24%;}
.gallery-simplebox.gallery-uvod a img {}
.gallery-simplebox.gallery-uvod .gallery-thumb:nth-child(4n) {margin-right:0;}
    
.kytice .gallery-simplebox .gallery-thumb {margin-right:3%; margin-bottom:1%;width:30%;}
.kytice .gallery-simplebox .gallery-thumb:nth-child(3n) { margin-right:0;}
.kytice .gallery-simplebox .gallery-thumb h4 {bottom: 20px;}

.contact-form {width: 100%;}

.footer {height:auto;position:relative;padding:0;}
.footer .wrapper {width: 90%;height:auto;padding: 20px 0;}
.footer .contacts {margin:15px auto 0;}
.footer .contacts > span {display:block;}
.footer .contacts .telefony {font-size: 2em;}
.footer .contacts .adresa {font-size: 1.3em;padding-right: 0;}
.footer .contacts .email {margin: 10px auto 0; display: block;}
.copy {padding: 15px;font-size:0.85em;}
#googleMap {float: none;height:300px;margin: 10px auto 20px;width: 100%;}
    
.contact-form input {
    width: 100%;
    margin: 8px auto;
}
.contact-form .suhlas {
    display: block;
    float: none;
    text-align: center;
    padding: 10px 0;
}

h1, h2, h3, h4, h5, h6 {text-align: center;}
    
#back-top {display: none !important;opacity:0 !important;}
}

@media all and (max-width: 734px) {

}

@media all and (min-width: 900px) and (max-width: 1049px) {
header, .header, .slideshow, .wrapper, footer, .footer, .boxes {
    width: 100%;
}
#nav-main {font-size:70%;}
.wrapper, .header, .footer .wrapper {width:96%}
.header .logo {}
.header .logo img {}
header, #nav-main {}
.footer {font-size:90%}
.footer .left {max-width: 430px;}
.wrap {max-width: 1000px;}
.ekonsprava {max-height:1000px;}
.enersprava {max-height:500px;}
.techsprava {max-height:650px;}
}

@media all and (min-width: 1180px) and (max-width: 1400px) {
#nav-main {font-size:80%;}
.header .logo img {}
.wrapper, .header, .footer .wrapper {width:96%}
}

@media all and (min-width: 1050px) and (max-width: 1179px) {
#nav-main {font-size:70%}
.wrapper, .header, .footer .wrapper {width:96%}
header, #nav-main {}
.header .logo {}
.header .logo img {}
.footer {font-size:90%}
}

@media all and (min-width: 1050px) and (max-width: 1099px) {
.ekonsprava {max-height:850px;}
.enersprava {max-height:400px;}
.techsprava {max-height:500px;}
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* STYLES GO HERE */
}
 
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* STYLES GO HERE */
}
 
/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* STYLES GO HERE */
}
 
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* STYLES GO HERE */
}
 
/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* STYLES GO HERE */
}
 
/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* STYLES GO HERE */
}
 
/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* STYLES GO HERE */
}
 
/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* STYLES GO HERE */
}
 
/* iPhone 5 (portrait &amp; landscape)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px) {
/* STYLES GO HERE */
}
 
/* iPhone 5 (landscape)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape) {
/* STYLES GO HERE */
}
 
/* iPhone 5 (portrait)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : portrait) {
/* STYLES GO HERE */
}