/* 
    1. CSS Imports
    2. General Styles
    3. header
    4. Sign in form
    5. Media Queries
    6. for checkbox style
--------------------------------------- */

/* 1. CSS Imports
--------------------------------------- */
@import url(bootstrap.min.css);
@font-face {
    font-family: Lato;
    src: url('font/Lato-Regular.ttf');
}
@font-face {
	font-family: Lato-Light;
	src: url('font/Lato-Light.ttf');
}    

/* 2. General Styles
--------------------------------------- */
* { font-family: "Lato"}
html,body{ 
  font-family: "Lato";
  line-height: 1.5;
  font-size: 16px;
  font-weight: normal;
  background-color: white;
  color: #333;  
  margin:0;   
}	
.bodyscollbar{
	overflow-x:hidden;
	overflow-y:auto;
}
.loginPage{
  vertical-align: middle;		
  text-align:center	;
  width: 383px;
  height: 447px;
}

.col-center-block {  
    float: none;  
    display: block;  
    margin-left: auto;  
    margin-right: auto;  
}  
h1 { font-size: 28px; }
h2 { font-size: 24px; }
.display3 { 
	font-family: "Lato-Light";
	font-weight: 300;
	font-size: 50px; 
	color: #595959;
    padding-top: 40px;
}
.title { 
	font-family: "Lato";
	font-weight: 400;
	font-size: 20px; 
	color: #595959;
}
.btn a {
    color: white;
    text-decoration: none;
}
.row{
    overflow: hidden; 
}
.row a{
	padding-right: 0;
}
.col-md-1{
	width: 16%;
}	
.col-md-3{
	width: 28.57143%;
}
.col-md-2{
	width: 14.2857%;
}
.rowForButton {
    margin-bottom: 40px;
}
.rowForLink {
	font-family: "Lato";
	font-weight: 400;
	font-size: 16px;
	color: #7f7f7f !important;
	text-decoration: none;
}
.rowForLink:hover {
	text-decoration: underline;
}
.rowForPictur-a{
	display: flex;
	text-decoration: none;
}
.rowForPictur-a .rowForPictur{
	flex: 1;
}
.rowForPictur {
    margin-bottom: 8px !important;
	font-size: 16px;
	color: #7f7f7f;
	font-weight: normal;    
}
.rowForPictur > img {
	clear: both; 
	display: block; 
	margin: 20px auto 10px; 
}
.rowForPictur > div {
	font-size: 16px;
	margin: auto auto 5px;
	text-align:center;
	color: #ffffff;
	font-weight: normal !important;
}
.word_wrap {
	white-space:nowrap; 
	overflow:hidden; 
	text-overflow:ellipsis;
}	
.footer {
	height:25px; 
	background-color:#f3f3f3;
	margin-top: -25px;
	clear:both;
	margin-left: 0px;

	/* add from bootstrap v4 */
	bottom: 0;
    margin-bottom: 0;
    border-width: 1px 0 0;
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
} 
.panel-deepblue {
    background-color: RGB(39,86,176);
    border-radius: 2px;
}
.panel-deepblue-over{
    background-color: RGB(33,66,149);
    border-radius: 2px;
}
.panel-deepblue-click {
    background-color: RGB(28,57,128);
    border-radius: 2px;
}
.panel-blue {
    background-color: RGB(81,175,236);
    border-radius: 2px;
}
.panel-blue-over{
    background-color: RGB(75,158,217);
    border-radius: 2px;
}
.panel-blue-click {
    background-color: RGB(67,135,193);
    border-radius: 2px;
}
.panel-green {
    background-color: RGB(110,185,67);
    border-radius: 2px;
}
.panel-green-over{
    background-color: RGB(97,164,59);
    border-radius: 2px;
}
.panel-green-click {
    background-color: RGB(87,147,53);
    border-radius: 2px;
}
.panel-oringe {
    background-color: RGB(248,115,69);
    border-radius: 2px;
}
.panel-oringe-over{
    background-color: RGB(224,104,62);
    border-radius: 2px;
}
.panel-oringe-click {
    background-color: RGB(230,94,56);
    border-radius: 2px;
}
.panel-heading {
    border-color: #f0f0f0;
    color: white;
    background-color: #5cb85c;
}
.margin-left-30 { margin-left: 30px; }

.margin-left-10 {
	margin-left: 10px; 
}
/* 3. header
------------------------------------------------------*/
#top {
    padding: 0px;
    width: 100%;
    height: 120px;
	margin-right: -25px;
    margin-left: -25px;    
}
.top-right {
    padding-right: 0px;
    padding-left: 0px;
}
.navbar{
	padding-top: 0;
	margin-bottom: 20px;
}
.navbar-right {
	font-family: "Lato";
	font-weight: 400;
	padding-top: 40px;
	margin-right: 0px;
	padding-right: 0px;
	text-align:right;
	font-size: 14px;
	color: #7f7f7f;

	display: flex;
    justify-content: flex-end;
}
.footer-right {
	float:right;
	font-family: "Lato";
	font-weight: 400;
	margin-top: 5px;
	margin-right: 0px;
	padding-right: 10px;
	font-size: 13px;
	color: #7f7f7f;

	display: flex;
    justify-content: flex-end;
}
.font13size {
	font-size: 13px !important;
	color: #595959 !important;
	font-weight: normal;
}
/* 4. Media Queries
------------------------------------------------------*/

@media (min-width: 1200px){
	.container {
		width: 1170px;
	}
	.col-md-3, .col-md-2, .lastdiv div, .display3{
		padding-left: calc(var(--bs-gutter-x) * 0.75);
		padding-right: calc(var(--bs-gutter-x) * 0.75);
	}
}

@media screen and (max-width: 991px) {
    .col-md-3{
		width: 48%;
	}
	.col-md-1{
		width: 20%;
	}	
	.col-md-2{
		width: 48%;
	}	
	.col-md-4{
		width: 14.2857%;
	}		
	.col-md-5{
		width: 45%;
	}		
	.col-md-9{
		width: 45%;
	}	
	.col-md-6{
		width: 50%;
	}		
}

@media screen and (min-width:767px) and (max-width: 991px){
	.col-md-4{
		width: 50%;
	}
}

@media screen and (max-width: 767px) {
    .col-md-3{
		width: 90%;
		padding: 0 calc(var(--bs-gutter-x)* 0.5);
	}
	.col-md-1{
		width: 50%;
	}	
	.col-md-2{
		width: 48%;
	}	
	.col-md-4{
		width: 100%;
	}		
	.col-md-5{
		width: 45%;
	}		
	.col-md-9{
		width: 80%;
	}	
	.col-md-6{
		width: 50%;
	}		
	.col-lg-12{
		width: 93%;
	}
}

/* 6. ckeckbox style
------------------------------------------------------*/
.chkstyle + label::before {
    content: "\a0";  
    display: inline-block;width: 
    16px;height: 16px;
    border: 1px solid #cccccc;
	vertical-align: middle;
	text-align: center;    
}     
.chkstyle:checked + label::before {
	background: url('../images/icon-checkmark.png');
}
.chkstyle {
    position: absolute;
    clip: rect(0, 0, 0, 0);
}