

body{

	margin:0px;
	padding: 0px;
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	font-size: 0.9rem;
	color: #333;
	background-color: #f0efeb;

}


a:link{    color:#f58025; text-decoration:none; }
a:visited{ color:#f58025; text-decoration:none; }
a:hover{   color:#f58025; text-decoration:underline; }


.b{
	font-weight: 500;
}



.orange{
	color: #f47721;
}

.blue{	
	color: #0099a8;
}

.green{	
	color: #00a651;
}

.red{	
	color: #f42121;
}





.input{
    -webkit-appearance:none;
    appearance:none;
	font-family:  'Roboto', Arial, Helvetica, sans-serif;
	font-size: 1rem;
	color:#333;
	background-color: #fff;
	padding: 0.7rem 1rem;
	border:#aaa 1px solid;
	box-sizing: border-box;
	display: inline-block;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	outline: none;
}


.input:focus{
	border: #f58025 1px solid;
	box-shadow: 0px 0px 8px rgba(245,128,37, 0.6);

}




.select select{

    -webkit-appearance:none;
    appearance:none;
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	font-size: 1rem;
	color: #333;
	background-color: #fff;
	padding: 0.7rem 1rem;
	border:#aaa 1px solid;
	padding-right: 30px;
	box-sizing: border-box;
	outline: none;
	vertical-align: top;
	width: 100%;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

}


.select select:focus
{


	border: #f58025 1px solid;
	box-shadow: 0px 0px 8px rgba(245,128,37, 0.6);

}


textarea{

}



.select{
	position: relative;
	z-index: 0;
	display: inline-block;
	vertical-align: top;

}


.select::after{
	content: "\f107";
	font-family: 'FontAwesome';
	font-size: 1rem;
	color: #333;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;

}







.radio{
  display: block;
  vertical-align: top;
  position: relative;
  padding-left: 25px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  min-height: 18px;
  box-sizing: border-box;
  padding-top: 0px; /* text top zai*/
  outline: none;

}

.radio input{
  position: absolute;
  opacity: 0;
  cursor: pointer;
  outline: none;
}

.radio .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 16px;
  width: 16px;
  background-color: #fff;
  border-radius: 50%;
  border: #aaa 2px solid;
  box-sizing: border-box;
}

.radio input:checked ~ .checkmark {
  background-color: #fff;
  border: #0099a8 2px solid;
}

.radio .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.radio input:checked ~ .checkmark:after {
  display: block;
}

.radio .checkmark:after {
 	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #0099a8;
}


.radio-inline{
	display: inline-block;
	vertical-align: top;
	margin-right: 30px;

}

.radio-single{
	margin-bottom: 0px;
	padding-left: 0px;
}





.checkbox {
	display: block;
	vertical-align: top;
	position: relative;
	padding-left: 32px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	min-height: 20px;
	margin-bottom: 15px;
	box-sizing: border-box;
	padding-top: 0px;
}

/* Hide the browser's default checkbox */
.checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkbox .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: #fff;
  border: #999 2px solid;
  box-sizing: border-box;
}


.checkbox input:checked ~ .checkmark {
  background-color: #fff;
  border: #0099a8 2px solid;
}


.checkbox .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkbox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkbox .checkmark:after {
	top: -1px;
	left: 4px;
	width: 3px;
	height: 10px;
	border: solid #0099a8;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}




.checkbox-inline{
	display: inline-block;
	vertical-align: top;
	margin-right: 20px;
}

.checkbox-single{
	margin-bottom: 0px;
	padding-left: 0px;
}


.checkbox-inline-textarea{
	display: inline-block;
	vertical-align: top;
	width: calc(100% - 91px) !important;

}




.i100{
	width: 100%;
}
	



.button{
    -webkit-appearance:none;
    appearance:none;
	font-family: 'Roboto', arial;
	font-size: 0.9rem;
	cursor: pointer;
	font-weight: 500;
	color: #666 !important;
	text-transform: uppercase;
	text-decoration: none !important;
	display: inline-block;
	background-color: #ccc;
	border: none;
	margin: 0px;
	padding: 0.8rem 1.5rem;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	box-sizing: border-box;
	outline: none;
}



.button-i{
	padding-left: 0.8rem;
	padding-right: 0.7rem;
}



.button-orange{
	background-color: #f47721;
	color: #fff !important;

}
.button-orange:hover{
	background-color: #e7701f;
}


.button-blue{	
	background-color: #0099a8;
	color: #fff !important;

}

.button-blue:hover{
	background-color: #008895;
	color: #fff !important;
}


.button-green{	
	background-color: #00a651;
	color: #fff !important;

}

.button-green:hover{
	background-color: #009b4b;
	color: #fff !important;
}


.button-red{	
	background-color: #f42121;
	color: #fff !important;

}

.button-red:hover{
	background-color: #de1d1d;
	color: #fff !important;
}


.button i{
	display: inline-block;
	margin-right: 5px;
}



.button-mini{
	padding: 0.4rem 0.9rem;
	font-size: 0.7rem;
}


.button-i-mini{
	padding-left: 0.4rem;
	padding-right: 0.3rem;
	
}




.button100{
	width: 100%;
	text-align: center;
}








.inline-buttons{
	display: block;
}




.error,
.ok,
.tips
{
	display: block;
	padding: 0.9rem 1.5rem;
	font-weight: 500;
	margin-bottom: 20px;
    border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px; 
	border-radius: 4px;
}


.error{

	background-color: #ffebee;
	color: #f44336;
	border: #ffcdd2 1px solid;

}

.ok{

	background-color: #e8f5e9;
	color: #4caf50;
	border: #c8e6c9 1px solid;
}

.tips{

	background-color: #fff8e1;
	color: #ffc107;
	border: #ffe082 1px solid;

}




h1,
h2,
h3
{
	font-weight: 500;
	line-height: 110%;
	margin: 0px;
	padding: 0px;
	margin-bottom: 20px;
}


h1{

	font-size: 1.6rem;

}


h2{

	font-size: 1.3rem;

}




.b{
	font-weight: 700px;
}



.paging{
	display: block;
	padding-top: 20px;

}



.paging a
{
	display:inline-block;
	margin-left:3px;
	margin-bottom:3px;
	background-color:#0099a8;
	padding: 3px 10px;
	text-decoration:none;
	color: #fff;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px; 
	border-radius: 4px;
}



.paging a:hover{
	background-color:#f47721;
	text-decoration:none;
	color:#ffffff;
}



.paging span{
	display:inline-block;
	margin-left:3px;
	margin-bottom:3px;
	background-color:#f47721;
	padding: 3px 10px;
	text-decoration:none;
	color:#fff;
	cursor: pointer;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px; 
	border-radius: 4px;

}

.paging div{
	display: block;
	padding-bottom: 8px;

}



.f-l{
	display: block;
	padding-bottom: 5px;
}

.f-i{
	display: block;

}

.f-h{
	display: block;
	font-size: 0.7rem;
	color: #999;
	font-style: italic;
	margin-top: 10px;
}

.f-iconed{
	position: relative;
}

.f-iconed .input{
	padding-left: 2.5rem !important;
}

.f-icon{
	position: absolute;
	left: 12px;
	top: 50%;
	z-index: 1;
	transform: translateY(-50%);
	color: #666;
}


.spacer{
	display: block;
	height: 20px;
}






.label{

	background-color: #666;
	color: #fff;
	display: inline-block;
	padding: 5px 8px;
	font-size: 0.7rem;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}



.label-green{
	background-color: #00a651;
	color: #fff;

}

.label-red{
	background-color: #f42121;
	color: #fff;

}

.label-orange{
	background-color: #f47721;
	color: #fff;

}

.label-grey{
	background-color: #999;
	color: #fff;

}



.box{
	display: block;
	background-color: #fff;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
	border-radius: 4px;
	padding: 30px;
	box-sizing: border-box;
}

.goyotable{
	border-spacing: 0px;
	border-collapse: collapse;

}

.goyotable td{
	border-bottom: #ccc 1px solid;
	padding: 10px 3px;
	
}


.goyotable .tr td{
	font-weight: 500;

	
}



.a-l{
	text-align: left;
}

.a-c{
	text-align: center;
}

.a-r{
	text-align: right;
}


.page_number{
	display: block;
	text-align: right;
	padding-bottom: 20px;
	color: #999;
	font-size: 0.8rem;
}


.asuult-item{
	display: block;
	padding-top: 30px;

}

.asuult-asuult{
	display: block;
	font-size: 1rem;
	font-weight: 500;
	padding-bottom: 10px;
	line-height: 140%;
}


.asuult-zaavar{
	display: block;
	padding-bottom: 20px;
	font-size: 0.8rem;
	color: #999;
	line-height: 140%;
}


.asuult-hariut-bg{
	display: block;
	padding-bottom: 40px;
}

.asuult-hariult-bg{
	display: block;
	padding-bottom: 40px;
}

.asuult-hariult-songolt{
	display: block;
	padding-bottom: 10px;
}




.asuult-buttons{

}


.asuult-button-col1{
	display: inline-block;
	vertical-align: top;
	width: 50%;
}

.asuult-button-col2{
	display: inline-block;
	vertical-align: top;
	width: 50%;
	text-align: right;
}




