   
    
    
/* -------------------------------------------------------------------------------- R E S P O -------------------------------------------------------------------------------------------------------- */

@media (max-width: 1650px){



    div.shop-detail-grid {
     display: grid;	
	 grid-template-columns: 100%; grid-template-rows: auto auto auto;
     grid-gap: 1em;
     min-height: 600px;
     }
     
     div.shop-detail-grid-foto {
      grid-row-start: 1;
      grid-row-end: 2;
      grid-column-start: 1;
      grid-column-end: 2;
     }
     
     div.shop-detail-grid-shopping {
      grid-row-start: 2;
      grid-row-end: 3;
      grid-column-start: 1;
      grid-column-end: 2;
      justify-self: end;
     }
     
     div.shop-detail-grid-popis {
      grid-row-start: 3;
      grid-row-end: 4;
      grid-column-start: 1;
      grid-column-end: 2;
      text-align:justify;
     }

   /*  
     div.fotoalbum {margin-top:10px;
			margin-bottom:0px;
			gap:.6em;
			}
     a.img img {height:75px; width:auto}
    */


}




 

@media (max-width: 1600px){
        div.inner-section {width:85%}  
        
                  div.eshop {
              display:grid;
              grid-template-columns: 2fr 4fr;
              grid-template-rows: auto;
              min-height: 500px;
              gap: 2em;
          }  
}

@media (max-width: 1400px){
        div.inner-section {width:90%}
        table.kontaktni-formular input#antispam {font-size: 16px!important;}   
} 

@media (max-width: 1500px){
        div.inner-section {width:100%; padding-left:10px; padding-right:10px }
        
        iframe#mapa {
       width: 95%;
       height: 600px;
       } 
       

     div.menu-odkazy-left {display:none}  
      
      #hamburgermenu{
    z-index:199;
    min-width: 250px;
    min-height: 100px;
    padding: 1em;
    text-align: left;
    background: rgba(165, 139, 50, 1);
    color:#fff;
    font-family: Trajan pro;
    font-weight: normal;
    box-shadow: -5px 5px 10px #444;
}

    .absolute 
        {position:absolute;
      top:20px;
      left:20px;
      }
      
     .fixed 
        {position:fixed;
      top:20px;
      left:20px;
      } 
    
    img#hamburger{      
      display:block;
      z-index:101;
      width: 28px;
      height: 28px;
      }
      
      
      #kosik-info {
      position:fixed;
      top:13px;
      right:20px;
      display:block;
      z-index:220;
     
      }
      
      
      
      div#scroll-bottons {display:block; text-align:center; margin: 0px auto; margin-top:20px; margin-bottom:30px; color: #bea653; }
      table.kosik {width:1300px!important}  
      
      
 
          
}




@media (max-width: 1100px){
    div.flex-kontakt p {width:100%} 
    div.flex-kontakt2 div._50_ {width:100%!important;} 
    table.kontaktni-formular input#antispam {font-size: 14px!important;}
    
    

    
    
} 





@media (max-width: 1050px){

    div#kontakt div{
    display: inline;
    padding: 0px 30px 0px 30px;
	width:1000%;
    margin: 0px auto;
    text-align: center;
	}
 
    table.kontaktni-formular input#antispam {font-size: 18px!important;}
 
 
}  



 
 
 
 
 
 @media (max-width: 1000px) and (orientation: portrait){
 
 
        div#logo-big-hair-salon {
        position: absolute; 
        top: 100px; left: calc(50% - 75px); 
        bottom: 0; right: 0;
        opacity:0;
        }
        
        div#logo-big-hair-salon2 {
        position: absolute; 
        top: 100px; left: calc(50% - 75px); 
        bottom: 0; right: 0;
        opacity:1;
        }
        
      
      img#img-hair-salon, img#img-hair-salon:hover {
          width: 150px; height: 177px; cursor:pointer; position:absolute; margin-left: 0px; margin-top: 0px; transition: width .25s, height .25s, margin-left .25s, margin-top .25s;
      }
      
      
      div#logo-big-solarium {
        position: absolute; 
        top: 380px; left: calc(50% - 75px); 
        bottom: 0; right: 0;
        opacity:0;
        }
        
        div#logo-big-solarium2 {
        position: absolute; 
        top: 380px; left: calc(50% - 75px); 
        bottom: 0; right: 0;
        opacity:1;
        }
        
      
      img#img-solarium, img#img-solarium:hover {
          width: 150px; height: 177px; cursor:pointer; position:absolute; margin-left: 0px; margin-top: 0px; transition: width .25s, height .25s, margin-left .25s, margin-top .25s;
      }
 
      a#objednat{
            display:inline-block;
            position:relative;  
            margin-top:150px;
            margin-left:19px;
        }
        
        a#rezervovat{
            display:inline-block;
            position:relative;  
            margin-top:150px;
            margin-left:8px;
        }
        
        a.button{
          font-size: 18px;
          }
 
 
            #down {display:none 
              
               }
 
 }
 
 
 
 
 @media (max-width: 1000px) and (orientation: landscape){
 
 
        div#logo-big-hair-salon {
        position: absolute; 
        top: calc(50% - 88px); left: calc(30% - 75px);
        bottom: 0; right: 0;
        opacity:0;
        }
        
        div#logo-big-hair-salon2 {
        position: absolute; 
        top: calc(50% - 88px); left: calc(30% - 75px);
        bottom: 0; right: 0;
        opacity:1;
        }
        
      
      img#img-hair-salon, img#img-hair-salon:hover {
          width: 150px; height: 177px; cursor:pointer; position:absolute; margin-left: 0px; margin-top: 0px; transition: width .25s, height .25s, margin-left .25s, margin-top .25s;
      }
      
      
      div#logo-big-solarium {
        position: absolute; 
        top: calc(50% - 88px); left: calc(70% - 75px);
        bottom: 0; right: 0;
        opacity:0;
        } 
        
        div#logo-big-solarium2 {
        position: absolute; 
        top: calc(50% - 88px); left: calc(70% - 75px);
        bottom: 0; right: 0;
        opacity:1;
        }
        
      
      img#img-solarium, img#img-solarium:hover {
          width: 150px; height: 177px; cursor:pointer; position:absolute; margin-left: 0px; margin-top: 0px; transition: width .25s, height .25s, margin-left .25s, margin-top .25s;
      }
 
      a#objednat{
            display:inline-block;
            position:relative;  
            margin-top:150px;
            margin-left:19px;
        }
        
        a#rezervovat{
            display:inline-block;
            position:relative;  
            margin-top:150px;
            margin-left:8px;
        }
        
        a.button{
          font-size: 18px;
          }
 
 
            #down {display:none 
              
               }
 
 } 
 

@media (max-width: 900px){

   div.flexbox{
    gap: 50px 50px;
	}

    div#kontakt div._100_{
    padding: 0px 0px 0px 0px;
	width:100%;
	}
 
 
      
      .objednat2 {
    display:block;
    background: url('../img/objednat.png');
    position: absolute;
    height: 48px; width: 179px;
    top: 0; left: 0; 
        bottom: 50%; right: 0;
        margin: auto;
        cursor: pointer; 
 
        }
        
        div.eshop {
              display:grid;
              grid-template-columns: 1fr;
              grid-template-rows: auto;
              min-height: 500px;
              gap: 2em;
          }
          
          p.back-link {margin-bottom:20px} 
          
          div.shop-steps1, div.shop-steps2 {
        min-height: 2em;
        //margin: 3em 0 3em 0;
    	display:flex;
    	flex-flow: row wrap;
    	justify-content: center;
        background:none!important
        }  
                                  
 }
 
@media (max-width: 820px){ 
        div._50_ {width:100%;max-width:100%; margin-left: 10px}
} 
 
@media (max-width: 600px){
   /*
    div.effect {width:100%!important; height:auto}
 
  
    img#img-inzerat {
            width:90%;
            height:auto;
            }
  */          
            

    h1 {font-size: 1.4em; text-align:center;font-weight:normal; margin-top:0px}

    h2 {font-size: 1.4em; text-align:center;font-weight:normal; margin-top:0px}
    h2.eshop {font-family: Amiri-Bold; font-weight: normal; color: #555; font-size: 1.4em; line-height:30px; text-align:center; margin-top:0px}
    h3 {font-size: 1.2em; }
    h3.eshop {margin-left: 0px; font-size: 1.2em;line-height:20px;}
    h3.studio {font-family: Amiri-Bold; font-weight: normal; color: #444; font-size: 1.2em; text-align:center; margin-top:30px; margin-bottom:0px;line-height: 20px}
    h3.kontakt {font-family: Trajan pro Bold; color: rgba(165, 139, 50, 1); font-size: 1em; text-align:left; margin-top:40px; margin-bottom:0px}
    
    div.shop-items-h3 h3{
	font-size: 1.2em;
	}
    
    p {color: rgba(25, 25, 25, 1); font-size: 1em; text-align:center;}
    
    li {color: #555; font-size: 22px; text-align:left; line-height: 1em}
  
    ul{display:inline-block;margin:auto;text-align:left;text-indent:0;}
    ol{display:inline-block;margin:auto;text-align:left;text-indent:0;}
  
    ol.seznam {margin-left:0px}
    ol.seznam li {line-height: 1.5em}
    
    ul li {list-style-type: square; color: #555; font-size: 1em; text-align:left; line-height: 1.2em;}
      
    ul ul li {list-style-type: '- ';}
    ol ul li {list-style-type: '- '; }
    
    ol li {list-style-type: decimal; color: #555; font-size: 1em; text-align:left; line-height: 1.2em; padding-left:10px; text-indent:0;} 
    
    ul li.vop {color: #555; font-size: 1em; text-align:left; line-height: 1.2em; padding-left:10px;  text-indent:0;} 
    
    div#footer {font-size:1em; }
    
    div.effectwindow h2 {font-family: Amiri-Regular; margin:0px 0px 1em 0px; font-family: Amiri-Bold; font-size: 1.2em}
    div.effectwindow h3 {font-family: Amiri-Regular; margin:0px 0px 1em 0px; font-family: Amiri-Bold; font-size: 1em}
    
    div.eshop-left a.item, div.eshop-left a.item-active {
    font-size: 14px;
    }
    
    .cena-index2, .pred-slevou2, .po-sleve2, .uplsleva2, .no-sklad2, .skryta-polozka2, .vlozeno-v-kosiku2 {font-size: 1em}
    .do-kosiku3 {position:relative; top: 4px;font-size:24px!important}
    
    table.kosik th, table.kosik td, table.form th, table.form td, table.detail_objednavky td {font-size:1em }
    
    .star {color: #bea653; font-size: 22px; position:relative; top:2px; font-weight:normal}
    //input.input-mobil {width: 80%}
    
    div.circle, div.korunka{            
      font-size: 1em;
      }
      
      input.submit{
    font-size: 16px;
    }
    
    table.kontaktni-formular td {font-size: 1em; line-height:36px}
    table.kontaktni-formular input[type=text], input[type=password], table.kontaktni-formular textarea, table.kontaktni-formular select {font-size: 14px;}
    

    
    table.kontaktni-formular input#antispam {font-size: 10px!important;}
    
    div.clean-50 {height:0px}
    
    div#logo-big {position: absolute; 
  top: 0; left: 0; 
  bottom: 0; right: 0; 
  margin: auto;
  height: 150px; width: 168px; cursor:pointer;
  background: url('../img/logo-white.png');
  background-position: center center;
  background-size: 100%;
  background-repeat: no-repeat;
  transition: background .25s;
  opacity:0;
  }
  
  
  ul.studio {display:inline-block; text-indent:0; max-width:100% }

    
    
                                  
 } 
 
 
 
 
 @media screen and (max-width: 850px) and (orientation: landscape) {
 
         .objednat2 {
        //display:none;
        }
        
        div#logo-big {position: absolute; 
          height: 134px; 
          width: 150px;
          } 
          
          
        .objednat2 {
        position: absolute;
        height: 48px; width: 179px;
        top:10px;
        left:35px;
        margin: 0px 0px 0px 0px;
        }    
 
 
}
 
 
 
 
 @media (max-width: 360px){
 
  table.kontaktni-formular input#antispam {font-size: 8px!important;}

 }