/* CSS Document */

/* bxslider - full sceen */ 

body, html{
    height: 100%; 
} 


.bxslider, .bxslider li{
    height: 100% !important;
    z-index: 3;
}

/* */  

div {
  text-align: left;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  line-height: 24px;
  color: #333333;
}

td {
    line-height: 24px;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    color: #333333;
   }
   
ul {
     margin: 0px 20px 0px 0px;
   }
   
.stred {margin: 0px auto;}

a {color: #02ace8; text-decoration: none;}
a:hover {color: #a5875a; text-decoration: underline;}

/*
.tlacitko-modre {color: #ddf4fc; font-size: 14px; line-height: 14px; background: #02ace8; border: 1px solid #02ace8; padding: 8px 40px 7px 40px; text-decoration: none; margin-bottom: 10px; text-transform: uppercase;}
.tlacitko-modre:hover {color: #ddf4fc; font-size: 14px; line-height: 14px;  background: #038ab9; border: 1px solid #038ab9; padding: 8px 40px 7px 40px; text-decoration: none; margin-bottom: 10px; text-transform: uppercase;}
*/



.tlacitko-hnede-navig {color: #ffffff; font-size: 14px; line-height: 14px; background: #a4865a; border: 1px solid #a4865a; padding: 9px 9px 8px 9px; text-decoration: none; margin: 0px 2px 0px 2px;}
.tlacitko-hnede-navig:hover {color: #ffffff; font-size: 14px; line-height: 14px;  background: #1c3637; border: 1px solid #1c3637; padding: 9px 9px 8px 9px; text-decoration: none; margin: 0px 2px 0px 2px;}
.tlacitko-hnede-navig-prazdne {float: left; color: #a5b9bb; font-size: 20px; font-weight: normal; text-decoration: none; text-decoration: none; background-color: #dee7e8; border: 0px; padding: 6px 11px 3px 11px; margin: 0px 2px 0px 2px;}

.tlacitko-zlate-plne {float: left; color: #ffffff; font-size: 14px; line-height: 14px; background: #a88a5b; border: 1px solid #a88a5b; padding: 9px 42px 8px 42px; text-decoration: none; margin-bottom: 10px;}
.tlacitko-zlate-plne:hover {float: left; color: #ffffff; font-size: 14px; line-height: 14px;  background: #2f6769; border: 1px solid #2f6769; padding: 9px 42px 8px 42px; text-decoration: none; margin-bottom: 10px;}

.text-paticka {color: #bbc3c3;}
.text-paticka-maly {color: #658284;}
.text-paticka-zlaty {color: #ba9a5e;}
.misto-odkazy-paticka {padding: 45px; border-top: 2px solid #334a4b; border-bottom: 2px solid #334a4b;}
.odkaz-paticka {color: #ba9a5e; text-transform: uppercase;font-size: 18px; line-height: 18px; padding-right: 40px;}
.odkaz-paticka:hover {color: #ba9a5e; text-transform: uppercase;font-size: 18px; line-height: 18px; padding-right: 40px;}

.text-bily {color: #ffffff;}

/* desktop 1 */
@media screen and (min-width:1570px) {
   .obsah {width: 80%; max-width: 1512px;}
  .hlavni {max-width: 80%; width: 100%;}
  .hlavni-2 {max-width: 90%; width: 100%;}  
} 

/* desktop 2 */                 
@media screen and (min-width:1361px) and (max-width:1569px) {
  .obsah {width: 85%; max-width: 1511px;}
  .hlavni {max-width: 85%; width: 100%;}
  .hlavni-2 {max-width: 85%; width: 100%;}  
}
                       
/* tablet */                 
@media screen and (min-width:808px) and (max-width:1360px) {
  .obsah {width: 95%; max-width: 1511px;}
  .hlavni {max-width: 95%; width: 100%;}
  .hlavni-2 {max-width: 95%; width: 100%;}  
}
/* mobile */
@media screen and (min-width:0px) and (max-width:807px) {
  .obsah {width: 100%;} 
  .hlavni {max-width: 100%; width: 100%;}
  .hlavni-2 {max-width: 100%; width: 100%;}
}

.stin-1{
  -webkit-box-shadow: 0 9px 0px 0px white, 0 -9px 0px 0px white, 12px 0 15px -4px #e0e1e0, -12px 0 15px -4px #e0e1e0;
  -moz-box-shadow: 0 9px 0px 0px white, 0 -9px 0px 0px white, 12px 0 15px -4px #e0e1e0, -12px 0 15px -4px #e0e1e0;
  box-shadow: 0 9px 0px 0px white, 12px 0 15px -4px #e0e1e0, -12px 0 15px -4px #e0e1e0;
}

.stin{
  /*
  -webkit-box-shadow: 0 9px 0px 0px white, 0 -9px 0px 0px white, 12px 0 15px -4px #e0e1e0, -12px 0 15px -4px #e0e1e0;
  -moz-box-shadow: 0 9px 0px 0px white, 0 -9px 0px 0px white, 12px 0 15px -4px #e0e1e0, -12px 0 15px -4px #e0e1e0;
  box-shadow: 0 9px 0px 0px white, 0 -9px 0px 0px white, 12px 0 15px -4px #e0e1e0, -12px 0 15px -4px #e0e1e0;
  */
  -webkit-box-shadow: 2px 9px  #e0e1e0,  -2px 0 9px #e0e1e0;
  -moz-box-shadow: 2px 0 9px #e0e1e0,  -2px 0 9px #e0e1e0;
  box-shadow: 2px 0 9px #e0e1e0,  -2px 0 9px #e0e1e0;
}

.oddelujici-cara {float: left; width: 100%; margin: 30px 0px 0px 0px; padding: 0px 0px 0px 0px; border-bottom: 1px solid #a4865a;}

.eu-cookies {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 90%;
    padding: 10px 5% 10px 5%;
    color: white;
    background-color: rgba(0,0,0,0.7);
    z-index: 1000;
    font-size: 13px;
    text-align: center;
}

.eu-cookies button {
    background: #a5875a;
    color: white;
    border: 1px #a5875a solid;
    font-size: 13px;
    line-height: 13px;
    cursor:pointer;
    margin: 10px 0px 10px 20px;
    padding: 8px 20px 8px 20px;
}

/* desktop */
@media screen and (min-width:1370px) {
  .table-1-sloupec {width: 90%; margin: 0px 5% 0px 5%;}
  .table-2-sloupce {width: 42%; margin: 0px 4% 0px 4%;}
  .table-3-sloupce {width: 31%; margin: 0% 1% 0% 1%;} 
  .table-2-sloupce-prava {width: 46%; margin: 0px 0% 0px 4%; border-spacing: 0; border-collapse: collapse;}   
  .table-2-sloupce-leva {width: 46%; margin: 0px 4% 0px 0%; border-spacing: 0; border-collapse: collapse;}
  .table-2-sloupce-plne {width: 45%; margin: 0px 0px 0px 0px;}                                                  
  .nadpis {float: left; width: 100%; font-size: 24px; line-height: 30px; font-weight: 600; padding-bottom: 20px; color: #254647;}
  .nadpis-maly {float: left; width: 100%; font-size: 20px; line-height: 26px; font-weight: 600; padding-bottom: 14px; color: #254647;}
  .nadpis-bily {float: left; width: 100%; font-size: 24px; line-height: 30px; padding-bottom: 10px; color: #ffffff;}
  .anotace {float: left; width: 100%; font-size: 15px; line-height: 22px; padding-bottom: 0px; color: #254647;}
  .anotace-bila {float: left; width: 100%; font-size: 20px; line-height: 30px; padding-bottom: 0px; color: #ffffff;}
  .motivacni-ikony-text {font-size: 20px; line-height: 18px; padding-bottom: 0px; color: #92a2a3;}
  .input-control {float: left; width: 280px; height: 34px; border: 1px solid #dbd7d7; }
  .input-control input {height: 34px; width: 280px; padding: 8px 6px 6px 20px; border: none; font-size: 14px; }
  .control-textarea {height: 100px; width: 585px; padding: 8px 6px 6px 20px; border: 1px solid #dbd7d7; font-size: 14px; }
  .select-control {float: left; width: 280px; height: 34px; border: 1px solid #dbd7d7; }
  .select-control select {height: 34px; width: 280px; padding: 8px 6px 6px 20px; border: none; font-size: 14px; }
  .reference-lidi-slider-hlavni {width: 40%;}
  .reference-lidi-slider-text {float: left; width: 100%; font-size: 22px; line-height: 28px; font-weight: 600; padding: 80px 0px 20px 0px; color: #254647; text-align: center;}
  .reference-lidi-slider-autor {float: left; width: 100%; font-size: 22px; line-height: 28px; font-weight: 400; padding: 20px 0px 40px 0px; color: #254647; text-align: center;}
  /* .gal-img-margin {float: left; position: relative; width: 200px; margin: 0px 20px 5px 20px;} */
  .gal-img-margin {vertical-align: top; display: inline-block; margin: 0px auto; text-align: center; width: 200px; margin: 0px 20px 5px 20px;}
  /* .gal-img-margin-list {float: left; position: relative; width: 250px; margin: 0px 20px 30px 20px;} */
  .gal-img-margin-list {vertical-align: top; display: inline-block; margin: 0px auto; text-align: center; width: 250px; margin: 0px 20px 30px 20px;}
  
  .odkaz-carka-zlata {float: left; background-image: url('../../../Image/user_img/hotelfenix_cz/obecne/carka_odkaz_zlata.png'); background-repeat: no-repeat; background-position: left 0px center;  color: #ba9a5e; font-size: 16px; line-height: 18px; padding: 0px 0px 0px 70px; text-decoration: none; margin-bottom: 10px; cursor: pointer; text-transform: uppercase;}
  .odkaz-carka-zlata:hover {float: left; background-image: url('../../../Image/user_img/hotelfenix_cz/obecne/carka_odkaz_zlata.png'); background-repeat: no-repeat; background-position: left 0px center; color: #ba9a5e; font-size: 16px; line-height: 18px; padding: 0px 0px 0px 70px; text-decoration: underline; margin-bottom: 10px; cursor: pointer; text-transform: uppercase;}
  .pokoje {height: 520px;}
}                        
/* tablet */                 
@media screen and (min-width:808px) and (max-width:1369px) {
  .table-1-sloupec {width: 90%; margin: 0px 5% 0px 5%;}
  .table-2-sloupce {width: 42%; margin: 0px 4% 0px 4%;}
  .table-3-sloupce {width: 31%; margin: 0% 1% 0% 1%;} 
  .table-2-sloupce-prava {width: 46%; margin: 40px 0% 0px 4%; border-spacing: 0; border-collapse: collapse;}   
  .table-2-sloupce-leva {width: 46%; margin: 40px 4% 0px 0%; border-spacing: 0; border-collapse: collapse;}
  .table-2-sloupce-plne {width: 45%; margin: 0px 0px 0px 0px;}                                  
  .nadpis {float: left; width: 100%; font-size: 22px; line-height: 28px; font-weight: 600; padding-bottom: 20px; color: #254647;}
  .nadpis-maly {float: left; width: 100%; font-size: 18px; line-height: 24px; font-weight: 600; padding-bottom: 14px; color: #254647;}
  .nadpis-bily {float: left; width: 100%; font-size: 24px; line-height: 30px; padding-bottom: 10px; color: #ffffff;}
  .anotace {float: left; width: 100%; font-size: 15px; line-height: 22px; padding-bottom: 0px; color: #254647;}
  .anotace-bila {float: left; width: 100%; font-size: 20px; line-height: 30px; padding-bottom: 0px; color: #ffffff;}
  .motivacni-ikony-text {font-size: 20px; line-height: 18px; padding-bottom: 0px; color: #92a2a3;}
  .input-control {float: left; width: 280px; height: 34px; border: 1px solid #dbd7d7; }
  .input-control input {height: 34px; width: 280px; padding: 8px 6px 6px 20px; border: none; font-size: 14px; }
  .control-textarea {height: 100px; width: 585px; padding: 8px 6px 6px 20px; border: 1px solid #dbd7d7; font-size: 14px; }
  .select-control {float: left; width: 280px; height: 34px; border: 1px solid #dbd7d7; }
  .select-control select {height: 34px; width: 280px; padding: 8px 6px 6px 20px; border: none; font-size: 14px; }
  .reference-lidi-slider-hlavni {width: 40%;}
  .reference-lidi-slider-text {float: left; width: 100%; font-size: 20px; line-height: 26px; font-weight: 600; padding: 100px 0px 20px 0px; color: #254647; text-align: center;}
  .reference-lidi-slider-autor {float: left; width: 100%; font-size: 20px; line-height: 26px; font-weight: 400; padding: 20px 0px 40px 0px; color: #254647; text-align: center;}
  /* .gal-img-margin {float: left; position: relative; width: 200px; margin: 0px 20px 5px 20px;} */
  .gal-img-margin {vertical-align: top; display: inline-block; margin: 0px auto; text-align: center; width: 200px; margin: 0px 20px 5px 20px;}
  /* .gal-img-margin-list {float: left; position: relative; width: 250px; margin: 0px 20px 30px 20px;} */
  .gal-img-margin-list {vertical-align: top; display: inline-block; margin: 0px auto; text-align: center; width: 250px; margin: 0px 20px 30px 20px;}
  .odkaz-carka-zlata {float: left; background-image: url('../../../Image/user_img/hotelfenix_cz/obecne/carka_odkaz_zlata.png'); background-repeat: no-repeat; background-position: left 0px center;  color: #ba9a5e; font-size: 16px; line-height: 18px; padding: 0px 0px 0px 70px; text-decoration: none; margin-bottom: 10px; cursor: pointer; text-transform: uppercase;}
  .odkaz-carka-zlata:hover {float: left; background-image: url('../../../Image/user_img/hotelfenix_cz/obecne/carka_odkaz_zlata.png'); background-repeat: no-repeat; background-position: left 0px center; color: #ba9a5e; font-size: 16px; line-height: 18px; padding: 0px 0px 0px 70px; text-decoration: underline; margin-bottom: 10px; cursor: pointer; text-transform: uppercase;}
  .pokoje {height: 480px;}
}
/* mobile */
@media screen and (min-width:0px) and (max-width:807px) {
  .table-1-sloupec {width: 90%; margin: 0px 5% 0px 5%;} 
  .table-2-sloupce {width: 90%; margin: 0px 5% 0px 5%; clear: both;}
  .table-3-sloupce {width: 90%; margin: 0px 5% 0px 5%; clear: both;}
  .table-2-sloupce-prava {width: 90%; margin: 0px 5% 0px 5%; clear: both;}    
  .table-2-sloupce-leva {width: 90%; margin: 0px 5% 0px 5%; clear: both;}
  .table-2-sloupce-plne {width: 90%; margin: 0px 5% 0px 5%; clear: both;}
  .nadpis {float: left; width: 100%; font-size: 24px; line-height: 30px; font-weight: 600; padding-bottom: 20px; color: #254647;}
  .nadpis-maly {float: left; width: 100%; font-size: 20px; line-height: 26px; font-weight: 600; padding-bottom: 14px; color: #254647;}
  .nadpis-bily {float: left; width: 100%; font-size: 24px; line-height: 30px; padding-bottom: 10px; color: #ffffff;}
  .anotace {float: left; width: 100%; font-size: 15px; line-height: 22px; padding-bottom: 0px; color: #254647;}
  .anotace-bila {float: left; width: 100%; font-size: 20px; line-height: 30px; padding-bottom: 0px; color: #ffffff;}
  .motivacni-ikony-text {font-size: 20px; line-height: 18px; padding-bottom: 0px; color: #92a2a3;}
  .input-control {float: left; width: 280px; height: 34px; border: 1px solid #dbd7d7; }
  .input-control input {height: 34px; width: 280px; padding: 8px 6px 6px 20px; border: none; font-size: 14px; }
  .control-textarea {height: 100px; width: 280px; padding: 8px 6px 6px 20px; border: 1px solid #dbd7d7; font-size: 14px; }
  .select-control {float: left; width: 280px; height: 34px; border: 1px solid #dbd7d7; }
  .select-control select {height: 34px; width: 280px; padding: 8px 6px 6px 20px; border: none; font-size: 14px; }
  .reference-lidi-slider-hlavni {width: 70%;}
  .reference-lidi-slider-text {float: left; width: 100%; font-size: 15px; line-height: 22px; font-weight: 600; padding: 100px 0px 20px 0px; color: #254647; text-align: center;}
  .reference-lidi-slider-autor {float: left; width: 100%; font-size: 15px; line-height: 22px; font-weight: 400; padding: 20px 0px 40px 0px; color: #254647; text-align: center;}
  .gal-img-margin {float: left; position: relative; width: 40%; margin: 0px 5% 5px 5%;}
  .gal-img-margin-list {float: left; position: relative; width: 40%; margin: 0px 5% 30px 5%;}
  .odkaz-carka-zlata {float: left; background-image: url('../../../Image/user_img/hotelfenix_cz/obecne/carka_odkaz_zlata.png'); background-repeat: no-repeat; background-position: left 0px center;  color: #ba9a5e; font-size: 14px; line-height: 18px; padding: 0px 0px 0px 70px; text-decoration: none; margin-bottom: 10px; cursor: pointer; text-transform: uppercase;}
  .odkaz-carka-zlata:hover {float: left; background-image: url('../../../Image/user_img/hotelfenix_cz/obecne/carka_odkaz_zlata.png'); background-repeat: no-repeat; background-position: left 0px center; color: #ba9a5e; font-size: 14px; line-height: 18px; padding: 0px 0px 0px 70px; text-decoration: underline; margin-bottom: 10px; cursor: pointer; text-transform: uppercase;}
  .pokoje {}
}








/* MENU*/
/* desktop */
@media screen and (min-width:1320px) {                                                                                                                /* #ffffff */
  .menu-hlavni {float: left; position: fixed; z-index: 3000; left: 0px; top: 0px; transition: top 3.3s; width: 100%; height: 120px; }
  .menu {float: right;  margin-top: 0px;}  
  .menu-mobile {display: none;}
  .menu-top-margin {margin-top: 20px;}
  .navigation {float: left; width: 100%; margin-top: 65px;}
  .logo {float: left; z-index: 660; position: absolute; left: 0px; top: 17px;}
  .logo a:before {content: url('../../../Image/user_img/hotelfenix_cz/obecne/logo_mini.png'); }
  .logo-hlavni {float: left; z-index: 1; position: absolute; left: 50%; transform: translate(-50%,0); top: 155px;}
  .logo-hlavni a:before {content: url('../../../Image/user_img/hotelfenix_cz/obecne/logo.png'); }
  .slider-hlavni {float: left; position: relative; width: 100%; height: 559px;}
  .slide-1 {float: left; position: relative; width: 39%; text-align: left; margin-top: 0px;}
  .slide-2 {float: right; position: relative; width: 61%; text-align: left; margin-top: 0px;}
}                                                                
/* tablet */                 
@media screen and (min-width:1188px) and (max-width:1319px) {  /* min-width:808px */
  .menu-hlavni {position: fixed; z-index: 99999; top: 0px; transition: top 3.3s; width: 100%; max-width: 1512px; height: 120px; background: #ffffff; border-bottom: 1px solid #e2e4e7;}
  .menu {float: right;  margin-top: 0px;}  
  .menu-mobile {display: none;}
  .menu-top-margin {margin-top: 20px;}
  .navigation {float: left; width: 100%; margin-top: 65px;}
  .logo {float: left; z-index: 660; position: absolute; left: 0px; top: 17px;}
  .logo a:before {content: url('../../../Image/user_img/hotelfenix_cz/obecne/logo_mini.png'); }
  .logo-hlavni {float: left; z-index: 1; position: absolute; left: 50%; transform: translate(-50%,0); top: 175px;}
  .logo-hlavni a:before {content: url('../../../Image/user_img/hotelfenix_cz/obecne/logo_tablet.png'); }
  .slider-hlavni {float: left; position: relative; width: 100%; height: 559px;}
  .slide-1 {float: left; position: relative; width: 39%; text-align: left; margin-top: 0px;}
  .slide-2 {float: right; position: relative; width: 61%; text-align: left; margin-top: 0px;}
}
/* mobile */
@media screen and (min-width:0px) and (max-width:1187px) { /* max-width:808px */
  .menu-hlavni {display: none;}
  .menu {display: none;}
  .menu-mobile {float: left; width: 100%; display: block; margin: -6px 20px 0px 0px;   } /* border-bottom: 10px solid #e2e4e7; height: 130px; background: #f0ebe4; */
  .menu-top-margin {}
  .navigation {float: left; width: 100%; margin-top: 10px;}
  .logo {float: left; z-index: 660; position: absolute; left: 50%; transform: translate(-50%,0); top: 17px;}
  .logo a:before {content: url('../../../Image/user_img/hotelfenix_cz/obecne/logo_mini.png'); }
  .logo-hlavni {display: none;}
  .logo-hlavni a:before {display: none;}
  .slider-hlavni {float: left; position: relative; width: 100%; height: 350px;}
  .slide-1 {display: none;}
  .slide-2 {float: left; position: relative; width: 100%; text-align: left; margin-top: 0px;}
}












 

.responsive {
    padding: 0px 0px 0px 0px;
    float: left;
    width: 24.99999%;
    margin-bottom: 10px;
    box-sizing: border-box;
}

.responsive-1 {width: 24.25%; margin: 0% 1% 0% 0%;}
.responsive-2 {width: 24.25%; margin: 0% 1% 0% 0%;}
.responsive-3 {width: 24.25%; margin: 0% 1% 0% 0%;}
.responsive-4 {width: 24.25%; margin: 0% 0% 0% 0%;}

@media only screen and (max-width: 700px){
    .responsive {width: 49.99999%; margin: 6px 0;}
    .responsive-1 {width: 49.00%; margin: 0% 2% 0% 0%;}
    .responsive-2 {width: 49.00%; margin: 0% 0% 0% 0%;}
    .responsive-3 {width: 49.00%; margin: 0% 2% 0% 0%;}
    .responsive-4 {width: 49.00%; margin: 0% 0% 0% 0%;}
}

@media only screen and (max-width: 500px){
    .responsive {width: 49.99999%; margin: 6px 0;}
    .responsive-1 {width: 49.00%; margin: 0% 2% 0% 0%;}
    .responsive-2 {width: 49.00%; margin: 0% 0% 0% 0%;}
    .responsive-3 {width: 49.00%; margin: 0% 2% 0% 0%;}
    .responsive-4 {width: 49.00%; margin: 0% 0% 0% 0%;}
}                                       