@charset "utf-8";
:root{
	
	
	/************** typography ***************/
    	--theme-html-font-size: 14px !important;
		--theme-body-font-size: 100% !important;
		/**/
	--font-family:'Roboto' !important;	
	--font-weight-light:300 !important;
    --font-weight-black:900 !important;
    --font-weight-thin:100 !important;
    --font-weight-regular:normal !important;
    --font-weight-medium:500 !important;
	--font-weight-semibold:600 !important;
    --font-weight-bold:bold !important;
	/* theme colors */
	--primary-color:#1A73E8;
	--bodybg:#F2F2F2;
	--body-text-color:#555555;
	/*font size */
	
	--font8: 0.571rem;
	--font9: 0.643rem;
	--font10: 0.714rem;
	--font11: 0.786rem;
	--font12: 0.857rem;
	--font13: 0.929rem;
	--font14: 1rem;
	--font15: 1.071rem;
	--font16: 1.143rem;
	--font18: 1.286rem;
	--font20: 1.429rem;
	--font22: 1.571rem;
	--font24: 1.714rem;
	--font26: 1.857rem;
	--font28: 2rem;
	--font30:2.143rem;
	--font32: 2.286rem;
	--font34: 2.429rem;
	--font36: 2.571rem;
	--font40: 2.857rem;
	--font48: 3.429rem; 
	
	
	/* button*/
	--btn-height: 44px;
	--btn-radius: 5px;
}

/* CSS Document */
body{
	font-size: var(--theme-body-font-size);
	background:var(--bodybg);
	color:var(--body-text-color);
}
html{
    font-family: var(--theme-font-family);
    font-size: var(--theme-html-font-size);
}

body,input, button, select, textarea{
	font-family:var(--font-family);
	
}
a{
	color:var(--primary-color);
	cursor:pointer;
}
a:hover{
	color:#000;
}
input:-internal-autofill-selected {
    appearance: menulist-button;
    background-image: none !important;
    background-color: none !important;
    color: fieldtext !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus {
  /*-webkit-text-fill-color: #31b0dd;
  -webkit-box-shadow: 0 0 0px 40rem #fff inset;*/
}


input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly]{
	background-color:transparent;
	color:#cccccc;
}
textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input,
select{
	border:none;
	border-radius:0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.30);
	box-shadow:none;
	height:39px;
	padding:0;
	margin:0;
}

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus, select:focus{
	box-shadow:none;
	border-color:#1A73E8;
}
select:focus-visible{
outline:none !important
}



label{
	margin-bottom:0;
}

.btn{
	height:var(--btn-height);
	border-radius:var(--btn-radius);
	padding:5px 10px;
	color:#ffffff;	
	text-shadow: none;
    border: none;
	font-size:var(--font14);
	min-width:100px;
}
.btn.btn-primary{
	background:var(--primary-color);
}
.btn.btn-primary:hover{
	background:#3294EE;
}

.btn.btn-secondary{
	background:#FAD207;
	color:#000000;
}
.btn.btn-secondary:hover{
	background:#FFF200;
}




.btn:focus{
	outline:none;
}

label{
	font-size:var(--font14);
}

strong,b{
	font-weight:var(--font-weight-semibold);
}

/* radio button */
.regular-radio {
    display: none !important;
}
.regular-radio + label {
    background: none;
    color: #B5C1CA;
    vertical-align: middle;
    margin-right: 2px;
    margin-left: 0px;
    padding-left: 0px;
    line-height: 14px;
    font-size: 16px;
	position:relative;	
	width:18px;
	display: flex;
    align-items: center;
    justify-content: center;
}
.regular-radio + label:before {
    background: none !important;
    border: 1px solid #d4d6d7 !important;
    content: "";    
	width: 18px !important;
    height: 18px !important;
    display: block !important;
    cursor: pointer;
    border-radius: 100%;
    line-height: 18px !important;
    float: left;
    text-align: center;
	min-width:18px;
}
.regular-radio:checked + label:before {
    background: var(--primary-color) !important;
    border: 1px solid var(--primary-color) !important;
    font-style: normal;
    font-weight: normal;
    speak: none;
    -webkit-font-smoothing: antialiased;
}
.regular-radio:checked + label:after{
	content:"";
	display:block;
	width:10px;
	height:10px;
	border-radius:100%;
	background:#fff;
	position:absolute;
	left:2px;
}	


/* utility classes*/
.d-flex{
	display:flex!important
}
.w-100{
	width:100% !important;
}
.align-center{
	align-items:center
}
.justify-center{
	justify-content:center;
}

/* progress bar */
.progress-bar-wrap{
	margin:2px 0;
}

progress {
  display: block; /* default: inline-block */
  width: 100%;
  margin: 1px auto;
  padding: 1px;
  border: 0 none;
  background: #ddd;
  border-radius: 14px;
  box-shadow: inset 0px 1px 1px rgba(0,0,0,0.8), 0px 1px 0px rgba(255,255,255,0.2);
}
progress::-moz-progress-bar {
  border-radius: 12px;
  background: green;
 /* box-shadow: inset 0 -2px 4px rgba(0,0,0,0.4), 0 2px 5px 0px rgba(0,0,0,0.3);*/  
}
/* webkit */
@media screen and (-webkit-min-device-pixel-ratio:0) {
  progress {
    height: 10px;
  }
}
progress::-webkit-progress-bar {
    background: transparent;
}  
progress::-webkit-progress-value {  
  border-radius: 12px;
  background: green;
  /*box-shadow: inset 0 -2px 4px rgba(0,0,0,0.4), 0 2px 5px 0px rgba(0,0,0,0.3); */
} 



@media screen and (min-width:1460px) {
	:root {
		--theme-html-font-size: 14px !important;
		--theme-body-font-size: 100% !important;
	}
}

@media screen and (min-width:1860px) {
	:root {
		--theme-html-font-size: 15px !important;
		--theme-body-font-size: 100% !important;

	}
}

@media screen and (max-width:1366px) {
	:root {
		--theme-html-font-size: 13px !important;
		--theme-body-font-size: 100% !important;
	}
}
