/* CSS Document */

/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 1200px) and (min-width: 100px)
{
#body {} 
IMG {max-width: 100%;}
#center_page {clear:both;position:relative; width:95%;top:0px; margin:0.1em auto 0px auto; padding:0px 0px; overflow: hidden;} 
#head {width: 100%;height:auto;}
  #head_label, #head-box {height:auto;top:10px;margin: 0px 0.2em;}
      #head_label {width: 50%;padding-left:20px;}
      #head-box {width: 25%;}
      #head-user-box {height:auto;top:10px;}
  #head-box IMG {width: 66%;height:auto;}
  #vyhledavac {display:none;}
  
#intro_kontejner_plocha,#intro_kontejner_background {width: 100%;height:400px;overflow:hidden;}   
  DIV.intro_kontejner_item {width: 100%;height:100%;}
  DIV.intro_label_2 {font-size:1.7em; width:45%;position:absolute; top:105px;padding-left:10px;}
    IMG.intro_button {top:5px;height:40px;padding-left:10px;}  
#facebook-link {display:none;}
 
  div.menu_top_item_mezera {display:none;}     
#main_text_od {display:none;}  
#main_text {clear:both;position:relative; top:0px; left:0px;margin: 0px 0px 0px 0px;padding: 10px 0px 0px 0px;width: 100%;background:none;}   
  #zanr_foto {position:relative; top:-10px; width: 100%;margin: 0px 48px 0px 0px;float:left;}  
  DIV.levy_sloup {background:none;position:relative; width:100%;  float:left; overflow:hidden;margin: 10px 0px 10px 0px; padding: 0px 0px 20px 0px;border: 0px solid green;}
    
DIV.kontejner_HP {background:#FFFFFF;overflow:hidden; text-align:justify; margin: 20px auto 20px auto;padding: 30px;width: 400px;height:auto;float:left;border-top: 0px solid #ad4482;border-radius: 10px 10px 10px 10px;}    
  DIV.kontejner_HP_foto {overflow:hidden;width: 100%;max-height:320px;margin:0px 0px 0px 0.0em;padding:0px 0px 0px 0.0em;}

#foot{width:94%;padding: 0px 3% 0px 3%;}
    DIV.foot_kontejner {width:350px}
  

DIV.galerie_rozcestnik_obal {width:100%;}   
DIV.galerie_rozcestnik {width:49.5%;margin: 0px 0px;} 
   DIV.galerie_rozcestnik img {width:100%;height: auto;max-height:none;margin: 0px 10px 0px 10px;}
   DIV.galerie_rozcestnik A.label {margin: 0px 10px 0px 10px;}   
}

/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 1200px) and (min-width: 800px)
 {
 #body {}
 #logo {width:250px; height:50px;background-size: contain;}    

 #zanr_foto {width: 30%;} 
 DIV.kontejner_form {width: 60%;}   
 }


/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 1000px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {clear:both;position:relative;top:0px;left:0px;display:block;float:left;margin: 10px;z-index:100;width:50px;float:right;}
 #head-user-box {display:none;}
 #menu_top_obal {width:100%;display:none;height:auto;top:0px;}   
  #menu_top {position:relative; top:0px; left:0px; width:auto; height: auto;  overflow:hidden; margin:0px 0px 0px 0px;padding: 0px 5px 0px 5px;text-align: left;float:left; display:none;background:#b1aeae;} 
  div.menu_top_item, div.menu_top_item_active,div.menu_top_item_mezera {float:left; top:0px; margin: 0px 0em 0px 0px; padding: 5px 0.5em 5px 0.5em;width:100%;height: auto;}
    A.menu_top_item_a {margin: 10px 0.5em 10px 0.5em;}
    div.menu_top_item, div.menu_top_item_active {border-bottom: 1px solid #ffffff;}
  div.menu_top_item_mezera {display:none;}     
 #intro_kontejner_plocha, #intro_kontejner_background {height: 330px;}
  DIV.intro_label_2 {font-size:1.5em; width:45%;position:absolute; top:55px;padding-left:10px;}
    IMG.intro_button {top:5px;height:40px;padding-left:10px;}  
 
 #grey_strip {overflow:hidden;height: auto;}
 
 DIV.kontejner_HP {padding: 30px;width: 80%;}    
    DIV.kontejner_HP_foto {max-height:420px;}
 
 }




/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 800px) and (min-width: 100px)
 {
 #body {}
  #head_label IMG {width: auto;height:44px;}
  #head-box {width: 20%;}
  #head-cta {top:0px;}
  DIV.kontejner_reference {width: 100%;float:left;margin: 0px 0px 30px 0px;}
    DIV.kontejner_reference_vice {clear:both;}
  #vyhledavac {display:none;}  
 
 DIV.foot_kontejner {width:100%;}    
 }
 

/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 800px) and (min-width: 500px)
 {
 #body {}
 #intro_kontejner_plocha, #intro_kontejner_background {height: 310px;}
  DIV.intro_label_2 {font-size:1.4em; width:45%;position:absolute; top:45px;padding-left:10px;}
    IMG.intro_button {top:5px;height:35px;padding-left:0px;}      
 }

@media screen and (max-width: 650px) and (min-width: 100px)
 {
 #body {}
 #head-user-box {clear:both;float:left;margin-left:10px;} 
    #login-box, #login-button, #cart-head-button {float:left;}
 }
 
 /* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 650px) and (min-width: 500px)
 {
 #body {}
 #intro_kontejner_plocha, #intro_kontejner_background {height: 260px;} 
  DIV.intro_label_2 {font-size:1.2em; width:45%;position:absolute; top:25px;padding-left:10px;}
    IMG.intro_button {top:1px;height:14px;padding-left:0px;}        
 }
 

/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 500px) and (min-width: 100px)
 {
 #body {}
 #head_label IMG {width: auto;height:35px;} 
 #intro_kontejner_plocha, #intro_kontejner_background {height: 230px;} 
  DIV.intro_label_2 {font-size:1.0em; width:45%;position:absolute; top:10px;padding-left:10px;}
    IMG.intro_button {top:3px;height:30px;padding-left:0px;}  
      
 DIV.kontejner_form {width: 100%;}    
 #menu_top_obal, #menu_top {top:0px;display:none;} 
  #menu_responsive {margin: 5px 5px 25px 5px ;z-index:100;top:0px;}

 #blue_strip {height: 70px;} 
 #logo {width:250px; height:42px;background: url("/img/image/logo.png") no-repeat;background-size: contain;margin-left: 10px;}     
 #main_text_pulena {width:100%;} 
DIV.galerie_rozcestnik_obal {width:98%;}   
DIV.galerie_rozcestnik {width:100%;margin: 0px 0px;} 
   DIV.galerie_rozcestnik img {width:100%;height: auto;max-height:none;margin: 0px 10px 0px 10px;}
   DIV.galerie_rozcestnik A.label {margin: 0px 10px 0px 10px;}   
    
 }
 
/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 400px) and (min-width: 100px)
 {
 #body {}
 #head_label IMG {width: auto;height:40px;}  
  #head-box {width: 20%;}   
  #head_label {width:70%;}
  #head_label_cta {margin: 0px 10px 0px 0px;} 
 #intro_kontejner_plocha, #intro_kontejner_background {height: 210px;} 
  DIV.intro_label_1 {display:none;}
  DIV.intro_label_2 {font-size:0.85em; width:45%;position:absolute; top:0px;padding-left:0px;}
    IMG.intro_button {top:3px;height:18px;padding-left:0px;}  

 }


 /* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 350px) and (min-width: 100px)
 {
 #body {}
 #head_label IMG {width: auto;height:32px;}   
 #menu_responsive {height:18px;padding:1px 2px 2px 2px;} 
 #intro_kontejner_plocha, #intro_kontejner_background {height: 190px;}  
 }

/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 300px) and (min-width: 100px)
 {
 #body {}
    #menu_responsive {background:blue;} 
 }


