/* 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:0px;margin: 0px 0.2em;}
      #head_label {width: 50%;padding-left:20px;}
      #head-box {width: 35%;}
  #head_label IMG {width: auto;height:70px;}
  #head-box IMG {width: 66%;height:auto;}
  #head-login-box {margin: 0px 10px 0px 0px;}  

        
#intro_kontejner_plocha,#intro_kontejner_background {height:400px;overflow:hidden;}   
  DIV.intro_kontejner_item {width: 100%;height:100%;}
  DIV.intro_label_1 {position:relative; height:250px;}
  DIV.intro_label_2 {font-size:1.9em; position:relative; top:0px;}
    IMG.intro_button {top:5px;height:20px;padding-right:25px;}  
#facebook-link {display:none;}
 
  div.menu_top_item_mezera {display:none;}     
  div.menu_top_item A, div.menu_top_item_active A  {font-size: 1.2em;}
  
#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 {position:relative;top:0px;left:0px;display:block;float:left;margin: 0px 10px 10px 10px;z-index:10;width:105px;height:70px;float:right;}
 #vyhledavac {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: 350px;}
  DIV.intro_label_1 {position:relative; height:220px;}
  DIV.intro_label_2 {font-size:1.6em; position:relative; top:0px;}
  IMG.intro_button {top: 10px;height: 30px;}
 #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:70px;}
  #head-box {width: 20%;}    
  #menu_responsive {width:105px;height:70px;}
  
   #intro_kontejner_plocha, #intro_kontejner_background {height:300px;overflow:hidden;}    
    DIV.intro_label_1 {position:relative; height:185px;}
    DIV.intro_label_2 {font-size:1.4em;}
      DIV.intro_label_2_inner {padding: 5px 10px 0px 10px;}
      IMG.intro_button {top: 5px;}
 
  DIV.kontejner_reference {width: 100%;float:left;margin: 0px 0px 30px 0px;}
    DIV.kontejner_reference_vice {clear:both;}
  DIV.intro_label_2 {padding: 0.1em 0.1em 0.1em 0.1em;text-align:center;}  
 
 DIV.foot_kontejner {width:100%;}    
 }
 

/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 700px) and (min-width: 100px)
 {
 #body {}
  #head_label IMG {width: auto;height:60px;}  
  #menu_responsive {width:90px;height:60px;}
 
   #intro_kontejner_plocha, #intro_kontejner_background {height:260px;overflow:hidden;}    
    DIV.intro_label_1 {position:relative; height:155px;}
    DIV.intro_label_2 {font-size:1.1em;padding:0px;}
      DIV.intro_label_2_inner {padding: 7px 10px 0px 10px;}
      IMG.intro_button {height: 25px;top: 4px;padding-right: 0px;}
 
 }


/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 600px) and (min-width: 100px)
 {
 #body {}
   #head_label IMG {height: 50px;} 
   #menu_responsive {width:75px;height: 50px;}
   #intro_kontejner_plocha, #intro_kontejner_background {height:230px;overflow:hidden;}    
    DIV.intro_label_1 {position:relative; height:135px;}
    DIV.intro_label_2 {font-size:1.1em;padding:3px 5px;margin:0px 10px;}
      DIV.intro_label_2_inner {padding: 0px;margin:0px}
      DIV.intro_label_2_inner P {padding: 0px;margin:0px}
      IMG.intro_button {height: 25px;top: 4px;padding-right: 0px;}
 
 }



/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 500px) and (min-width: 100px)
 {
 #body {}
   #head_label IMG {height: 40px;} 
   #menu_responsive {height: 40px;width:60px;}
 
   #intro_kontejner_plocha, #intro_kontejner_background {height:185px;overflow:hidden;}    
    DIV.intro_label_1 {position:relative; height:105px;}
    DIV.intro_label_2 {font-size:0.75em;padding:3px 5px;margin:0px 10px;}
      DIV.intro_label_2_inner {padding: 0px;margin:0px}
      DIV.intro_label_2_inner P {padding: 0px;margin:0px}
      IMG.intro_button {height: 16px;top: 2px;padding-right: 0px;}
    
 #menu_top_obal, #menu_top {top:0px;display:none;} 

 
 #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;}   
 #dalsi_clanky_headline {float:none;max-width:100%;margin:0px;}  
 IMG.dalsi_clanky_perex {width:100%;}
 }
 
/* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 400px) and (min-width: 100px)
 {
 #body {}
 
  
  #head-box {width: 20%;}   
  #head_label {width:70%;}
  #head_label_cta {margin: 0px 10px 0px 0px;}
   #head_label IMG {height: 35px;} 
   #menu_responsive {height: 35px;width:52px;}
 
   #intro_kontejner_plocha, #intro_kontejner_background {height:165px;overflow:hidden;}    
    DIV.intro_label_1 {position:relative; height:85px;}
    DIV.intro_label_2 {font-size:0.65em;padding:3px 5px;margin:0px 10px;}
      DIV.intro_label_2_inner {padding: 0px;margin:0px}
      DIV.intro_label_2_inner P {padding: 0px;margin:0px}
      IMG.intro_button {height: 16px;top: 2px;padding-right: 0px;}
 DIV.form_button {width:90%;min-width:none;}
 }


 /* změna designu v závislosti na šířce monitoru*/
@media screen and (max-width: 350px) and (min-width: 100px)
 {
 #body {}
   #head_label IMG {height: 30px;} 
   #menu_responsive {height: 30px;width:45px;}
      #login-box, #login-button {width:80%;margin-left:auto;margin-right:auto;}
   #intro_kontejner_plocha, #intro_kontejner_background {height:145px;overflow:hidden;}    
    DIV.intro_label_1 {position:relative; height:65px;}
    DIV.intro_label_2 {font-size:0.60em;padding:3px 5px;margin:0px 10px;}
      DIV.intro_label_2_inner {padding: 0px;margin:0px}
      DIV.intro_label_2_inner P {padding: 0px;margin:0px}
      IMG.intro_button {height: 15px;top: 1px;padding-right: 0px;}
 }


/* Ladění responsibility a šířky monitoru*/
@media screen and (max-width: 1200px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_1200.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;} 
 }
 
@media screen and (max-width: 1000px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_1000.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }
 
@media screen and (max-width: 900px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_900.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;} 
 }
 
@media screen and (max-width: 800px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_800.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }
 
@media screen and (max-width: 700px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_700.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }
 
@media screen and (max-width: 600px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_600.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }
 
@media screen and (max-width: 500px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_500.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }
 
@media screen and (max-width: 400px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_400.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }
 
@media screen and (max-width: 350px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_350.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }
 
@media screen and (max-width: 300px) and (min-width: 100px)
 {
 #body {}
 #menu_responsive {background: url("/img/bg_menu_resp_300.png") no-repeat #DDDDDD;background-size: contain;background-position: center center;}  
 }