/* -- start setup -- */

* {
font-family: 'Open Sans', serif, Arial, Verdana, Trebuchet MS,Helvetica,sans-serif;
font-size : 18px;
color:#525252;
}

/* -- common -- */
.horniIndex {vertical-align : super; font-size:9px;}
.i {font-style : italic;}
sup {font-size: 0.7em;}

/* -- float -- */
.floatLeft {float : left;}
.floatRight {float : right;}
.clear {clear : both;}
.textLeft {text-align:left !important;}
.pb90 {padding: 0 0 90px 0;}
.ml20 {margin-left:20px !important;}
.mt0 {margin-top:0 !important;}

.plr0 {padding-left:0 !important; padding-right:0 !important;}
.pl0 {padding-left:0 !important;}
.pr0 {padding-right:0 !important;}

.pt15 {padding-top:15px !important;}

.cursorPointer {cursor: pointer;}

/* -- all pages -- */
hr {display : none;}
body {
background-color: Black;
height:100%;
}

html {
background-color: Black;
height:100%;
}

.loginPage {
background-image: url(../pcs/pcs_layout/bg-login.jpg);
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
background-color:Black;
min-height:90%;
padding-top:20%;
padding-bottom:20%;
}

.imgCenter {
display:block;
margin-left:auto;
margin-right:auto;
}

h1 { 
font-size: 25px;  
line-height: 37px; 
margin-top:20px;
margin-bottom:20px;
color: #FFFFFF;
text-transform:uppercase;
}

@media only screen and (min-width : 480px) {
h1 { 
font-size: 29px; 
line-height: 40px; 
}
}

@media only screen and (min-width : 768px) {
h1 { 
font-size: 33px; 
line-height: 43px; 
}
}

@media only screen and (min-width : 992px) {
h1 { 
font-size: 37px; 
line-height: 46px; 
}
}

@media only screen and (min-width : 1200px) {
h1 { 
font-size: 40px; 
line-height: 47px; 
}
}

#header {
background-image: url(../pcs/pcs_layout/bg-top.jpg);
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
min-height:100px;
line-height:100px;
}

@media only screen and (min-width : 480px) {
#header { 
min-height: 111px; 
line-height: 111px; 
}
}

@media only screen and (min-width : 768px) {
#header { 
min-height: 122px; 
line-height: 122px; 
}
}

@media only screen and (min-width : 992px) {
#header { 
min-height: 133px; 
line-height: 133px; 
}
}

@media only screen and (min-width : 1200px) {
#header { 
min-height: 145px; 
line-height: 145px; 
}
}

#header h1 {
text-align:center;
line-height:100px;
margin-top:0;
margin-bottom:0;
}

@media only screen and (min-width : 480px) {
#header h1 { line-height: 111px;}
}

@media only screen and (min-width : 768px) {
#header h1 { line-height: 122px; }
}

@media only screen and (min-width : 992px) {
#header h1 { 
text-align:left;
line-height: 133px; 
margin-left:60px;
}
}

@media only screen and (min-width : 1200px) {
#header h1 { 
line-height: 145px; 
margin-left:125px;
}
}

/* login form */
.loginForm form input {
color: #A0A0A0;
font-size: 16px;
text-align: center;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
border:none;
}

.loginForm form input#submit {
color: #FFFFFF;
font-weight: bold;
background-color: #987037;
box-shadow: 0 0 8px 0 rgba(0,0,0,0.01);
text-transform:uppercase;
}

 @media (min-width: 420px) {
.loginForm form input {
width:365px;	
margin-left:auto;
margin-right:auto;
}  
}  
  
@media (min-width: 740px) {
.loginForm {
width:600px;	
margin-left:auto;
margin-right:auto;
}  
}  
 
.forgotPass {
display:block;
color: #7D7D7D;
font-family: "Trebuchet MS";
font-size: 15px;
line-height: 17px;
text-align: center;
margin-top:20px;
text-decoration:underline;
} 

.forgotPass:HOVER {
color:White;
text-decoration:none;
}
/* login form end */


#topMenu { 
min-height: 50px;   
position:relative;
}

@media only screen and (min-width : 480px) {
#topMenu { min-height: 60px;  }
}

@media only screen and (min-width : 768px) {
#topMenu { min-height: 70px;  }
}

@media only screen and (min-width : 992px) {
#topMenu { min-height: 80px;  }
}

@media only screen and (min-width : 1200px) {
#topMenu { min-height: 88px;  }
}

@media only screen and (max-width : 768px) {
.topInfo {
margin-top:15px;
margin-bottom:15px;
}
}

@media only screen and (min-width : 768px) {
.topInfo li {
margin-left:40px;
list-style-type:none;
}
}

.topInfo li a {
color: White !important;
font-family: "Trebuchet MS";
font-size: 14px;
text-transform:uppercase;
}

.topInfo li a.active {
color: #987037 !important;
text-decoration:underline;
}

@media only screen and (min-width : 768px) {
.topInfo li.userName {
border-left:2px solid #4F4F4F;	
padding-left:20px;
margin-left:15px;
}
}

.topInfo li.userName a {
background-image: url(../pcs/pcs_layout/user-icon.svg);
background-position: left center;
background-repeat: no-repeat;
padding-left:30px !important;
}

@media only screen and (min-width : 768px) {
.topInfo li.logOut {
padding-top:0;	
padding-bottom:0;	
margin-left:15px;
}
}

.topInfo li.logOut a {
display:block;
color:White;
padding:0 !important;	
height: 42px;
line-height: 42px;
width: 90px;
border-radius: 3px;
background-color: #987037;
box-shadow: 0 0 8px 0 rgba(0,0,0,0.01);
text-align:center;
}

.logoHeaderContinue {
position:absolute;
left:10px;
top:50%;
margin-top:-13px;	
width:150px;
height:26px;
}

@media only screen and (min-width : 480px) {
.logoHeaderContinue {
width:150px;
height:26px;
}
}

@media only screen and (min-width : 768px) {
.logoHeaderContinue {
width:165px;
height:29px;
margin-top:-15px;	
left:20px;
}
}

@media only screen and (min-width : 992px) {
.logoHeaderContinue {
width:180px;
height:32px;
margin-top:-16px;	
}
}

@media only screen and (min-width : 1200px) {
.logoHeaderContinue {
width:204px;
height:36px;
margin-top:-18px;	
left:30px;
}
}


#main {
background-color: #F5F5F5;
padding-top:20px;
padding-bottom:60px;
}

.box {background-color:White;}
.boxPadding {padding:30px;}

@media only screen and (min-width : 992px) {
.box {
width:900px;
margin-left:auto;
margin-right:auto;
}
}

/* form */
.sectionTitle {
height: 50px;
line-height: 50px;
background-color: #987037;
box-shadow: 0 1px 0 0 rgba(0,0,0,0.1);
color: #FFFFFF;
font-size: 16px;
text-transform:uppercase;
padding-left:18px;
margin-bottom:0;
margin-top:30px;
}

label {
color: #000000;
font-size: 15px;
line-height: 17px;
margin-top:15px;
font-weight: bold;
}

label span {color:#e70028;}

.coffeTitle {
color: #000000;
font-size: 15px;
line-height: 17px;
margin-top:15px;
} 

.coffeCount {
height: 40px;
width: 100%;
border: 1px solid #DDDDDD;
background-color: #F1F1F2;
box-shadow: 0 0 8px 0 rgba(0,0,0,0.01);
text-align:center;
font-size:25px;
cursor:pointer;
}

.coffeCountInput {
height: 40px;
width: 100%;
border-top: 1px solid #DDDDDD;	
border-bottom: 1px solid #DDDDDD;	
border-left:none;
border-right:none;
text-align:center;
font-weight:bold;
}

input, select, textarea, option {
background-color:White;
border:1px solid #d6e7f2;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;	
font-size:14px !important;
}

textarea {min-height:100px;}

.oddCoffee {
border:1px solid #DDDDDD;
margin-top:5px;
margin-bottom:5px;
}

.formNote {
display:block;
margin-top:5px;
color:White;
font-family: 'Roboto';
font-size:16px;
}

label.souhlasLabel {margin-top:0;}

.souhlasForm {
color:#4b667f;
margin-bottom:0;
font-family: 'helveticaneueltpro-lt';
}

.souhlasForm a {
color:#4b667f;
font-family: 'helveticaneueltpro-lt';
text-decoration:underline;
}

.souhlasForm, .souhlasForm a {
font-family: 'Roboto';
font-size:16px;	
text-align:center !important;
}

.submitButtonCenter {
margin:20px auto !important; 	
width:250px;
}

.submitButtonCenter input {
cursor:pointer;
display:block;
background-color: Black;
color:White;
width:250px;
font-size: 14px;
font-weight: bold;
height:50px;
line-height:50px;
text-align:center;
transition: background-color 0.5s;
text-transform:uppercase;
}

.submitButtonCenter input:HOVER {
background-color:#987037;
color:White !important;
text-decoration:none!important;
}

.odd {
border:1px solid #DDDDDD;
margin-top:20px;
margin-bottom:30px;
}

.oddFull {
margin-left:-30px;
margin-right:-30px;
}

#formOk {
margin-top:10px;
margin-bottom:30px;
font-size: 28px;   
color:#987037;
margin-bottom:10px;
text-align:center;
text-transform:uppercase;
}

@media only screen and (min-width : 768px) {
#formOk { font-size: 30px;  }
}

.doporuceni2, .doporuceni3 {display:none;	}

.dalsiDoporuceniButton {
margin:20px auto;
display:block;
text-align:center;	
font-weight:bold;
text-decoration:underline;
color:#987037;
cursor:pointer;
font-size:15px;
}

.dalsiDoporuceniButton:HOVER {
text-decoration:none;
}

.sorting {	
background-color:Black;
padding-left:30px;
padding-right:30px;
padding-top:15px;
padding-bottom:15px;
min-height:60px;
}

.sortingTitle {	
color: #FFFFFF;
font-family: "Trebuchet MS";
font-size: 16px;
line-height: 30px;
text-transform:uppercase;
float:left;
}

.sortingLinks {
float:right;
}

.sortingLinks li {
float:left;
list-style-type:none;
color: #FFFFFF;
font-size: 15px;
line-height: 30px;
}

.sortingLinks li a {
padding-left:10px;
padding-right:10px;
display:block;
background-color: #545454;
color: #FFFFFF;
font-size: 14px;
line-height: 30px;
margin-left:10px;
}

.sortingLinks li a:HOVER {
text-decoration:none;
}

.sortingLinks li a.active {background-color: #987037;}


.reportTable {
margin:30px;
padding-bottom:30px;
}

.reportList {
border-collapse:collapse;
width:100%;
}

.reportList th, .reportList td {border-bottom:1px solid #dcdcdc;	}

.reportList th {
color: #353535;
font-family: "Trebuchet MS";
font-size: 16px;
line-height: 19px;
text-transform:uppercase;
padding:10px 20px 10px 0;
}

.reportList td {
color: #000000;
font-family: "Trebuchet MS";
font-size: 15px;
padding:7px 20px 7px 0;
}

.footer {
padding-top:20px;
padding-bottom:20px;
}
 
.custom-toggler.navbar-toggler {
border-color: rgb(152,112,55);
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
}
.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(152,112,55, 0.85)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}