@charset "utf-8";

/*-------------------------------------------------------------------------------------------

form_parts.css

-------------------------------------------------------------------------------------------*/

/*---------------------------------------------
reset
---------------------------------------------*/
input, button, textarea, select {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
margin-right:0;
padding: 0;
background-color:#fff;
border: none;
border-radius: 0;
font-size:1em;
letter-spacing: normal;
line-height:1;
outline: none;
position:relative;
max-width:100%;
vertical-align:middle;
}

select::-ms-expand {
display: none;
}

.input-sm {
height: 30px;
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
}

.input-lg {
height: 54px;
padding: 14px 16px;
font-size: 18px;
line-height: 1.3333333;
border-radius: 6px;
}

input[type="text"],
input[type="checkbox"],
textarea,
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="submit"] {
-webkit-appearance: none;
}

input[type="checkbox"] {
border:1px solid #ccc;
border-radius:3px;
background-color:#fff;
width:13px;
height:13px;
}
input[type="checkbox"]:checked:after {
content:"\f00c";
font-size:100%;
font-family: "Font Awesome 5 Free";
position:absolute;
left:1px;
top:-1px;
color:#8BC34A;
font-style:normal;
}

/*---------------------------------------------
label
---------------------------------------------*/
.label {
display: inline;
padding: .2em .6em .3em;
font-size: 100%;
font-weight: bold;
line-height: 1;
color: #ffffff;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25em;
}

a.label:hover,
a.label:focus { color: #ffffff; text-decoration: none; cursor: pointer; }

.label:empty { display: none; }
.label-default { background-color: #999999; }
.label-default[href]:hover,
.label-default[href]:focus { background-color: #808080; }
.label-primary { background-color: #2fa4e7; }
.label-primary[href]:hover,
.label-primary[href]:focus { background-color: #178acc; }
.label-success { background-color: #73a839; }
.label-success[href]:hover,
.label-success[href]:focus { background-color: #59822c; }
.label-info { background-color: #033c73; }
.label-info[href]:hover,
.label-info[href]:focus { background-color: #022241; }
.label-warning { background-color: #dd5600; }
.label-warning[href]:hover,
.label-warning[href]:focus { background-color: #aa4200; }
.label-danger { background-color: #c71c22; }
.label-danger[href]:hover,
.label-danger[href]:focus { background-color: #9a161a; }

.form-horizontal .control-label {
display: inline-block;
font-size: 100%;
text-align: left;
margin-bottom: 5px;
max-width: 100%;
}

.control-label {
display: inline-block;
max-width: 100%;
margin-bottom: 5px;
font-weight: bold;
}

/*---------------------------------------------
legend
---------------------------------------------*/
legend {
display: block;
width: 100%;
padding: 0;
margin-bottom: 20px;
font-size:161.5%;
line-height: inherit;
color: #555555;
border: 0;
border-bottom: 1px solid #e5e5e5;
text-align:left;
}

/*---------------------------------------------
fieldset
---------------------------------------------*/
fieldset { padding: 0; margin: 0; border: 0; min-width: 0; }

/*---------------------------------------------
form-control
---------------------------------------------*/
.form-control {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
width: 100%;
padding: 8px 12px;
font-size:1em;
line-height: 1.42857143;
color:#555555;
background-color: #ffffff;
border: 1px solid #cccccc;
border-radius: 2px;
position:relative;
box-shadow: none;
-webkit-box-shadow: none;
/*-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);*/
/*box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);*/
-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow:none;
box-shadow:none;
/*-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075),0 0 8px rgba(102, 175, 233, 0.6);*/
/*box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);*/
}

textarea.form-control { height: auto; }
.form-control::-moz-placeholder { color: #999999; opacity: 1; }
.form-control:-ms-input-placeholder { color: #999999; }
.form-control::-webkit-input-placeholder { color: #999999; }
.form-control::-ms-expand { border: 0; background-color: transparent; }
.form-control[disabled],
fieldset[disabled] .form-control { background-color: #eeeeee; opacity: 1; }
.form-control[disabled],
fieldset[disabled] .form-control { cursor: not-allowed; }
textarea.form-control { height: auto; }

.form-control.sm { padding:4px 12px; }

/*---------------------------------------------
form-group
---------------------------------------------*/
.form-group {
margin-bottom: 15px;
text-align:left;
position: relative;
min-height: 1px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

.form-horizontal .form-group:after { content:" "; clear: both; display:block; }
.form-group-sm .form-control { height: 30px; padding: 5px 10px; font-size: 93%; line-height: 1.5; border-radius: 3px; }
.form-group-sm select.form-control { height: 30px; line-height: 30px; }
.form-group-sm textarea.form-control,
.form-group-sm select[multiple].form-control { height: auto; }
.form-group-sm .form-control-static { height: 30px; min-height: 32px; padding: 6px 10px; font-size: 93%; line-height: 1.5; }

.form-group-lg .form-control { height: 54px; padding: 14px 16px; font-size: 138.5%; line-height: 1.3333333; border-radius: 6px; }
.form-group-lg select.form-control { height: 54px; line-height: 54px; }
.form-group-lg textarea.form-control,
.form-group-lg select[multiple].form-control { height: auto; }
.form-group-lg .form-control-static { height: 54px; min-height: 38px; padding: 15px 16px; font-size:138.5%; line-height: 1.3333333; }

.form-group .checkbox label { display:inline-block; margin-right:10px; margin-bottom:5px; }

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline,
.has-warning.radio label,
.has-warning.checkbox label,
.has-warning.radio-inline label,
.has-warning.checkbox-inline label { color: #e6742b; }
.has-warning .form-control { border-color: #e6742b; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
.has-warning .form-control:focus { border-color: #e6742b; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ebb696; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ebb696; }

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label { color: #b94a48; }
.has-error .form-control { border-color: #b94a48; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
.has-error .form-control:focus { border-color: #b94a48; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #eb9896; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #eb9896; }

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label { color: #468847; }
.has-success .form-control { border-color: #468847; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
.has-success .form-control:focus { border-color: #356635; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b; }

/*---------------------------------------------
input-group
---------------------------------------------*/
.input-group { text-align:left; overflow:hidden; letter-spacing:-.40em; }
.input-group div { display:inline-block; letter-spacing:normal; vertical-align:top;  }
.input-group input { border-radius:4px 0 0 4px; }
.input-group span { border-radius:0 4px 4px 0; display:inline-block; letter-spacing:normal; vertical-align:top; width:50px; }
.input-group span button { border-radius:0 4px 4px 0; padding:11px 12px 10px; line-height:1; text-align:center; width:100%; }
.input-group span i { text-align:center; margin:0 auto; display:inline-block; line-height:1; }

/*---------------------------------------------
button
---------------------------------------------*/
button:hover { cursor:pointer; }
button.ar-blk { padding-right:15px; }
button.ar-blk:after {
content:" ";
position:absolute;
background-image:url(../../images/i_ar_blk.png);
background-position:center center;
background-repeat:no-repeat;
background-size:9px 6px;
margin-top:-3px;
width:9px;
height:6px;
right:3px;
top:50%;
}

/*---------------------------------------------
select
---------------------------------------------*/
select {
position:relative;
max-width:100%;
outline:none;
text-overflow: '';
background: none transparent;
vertical-align: middle;
font-size: inherit;
color: inherit;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin:0 !important;
padding:0;
}

select:hover { cursor:pointer; background-color:#fff !important; }

.select { position:relative; }
.select:after {
position: absolute;
top: 50%;
right: 10px;
margin-top: -7px;
content: '\f107';
color: #999;
font-size:85%;
font-family: "Font Awesome 5 Free";
}

.select_group {
display:block;
position:relative;
z-index:1;
width:100%;
}

.select_group:before {
background-color:#444;
border-radius:0 6px 6px 0;
content:" ";
height:100%;
font-weight:600;
right:0;
top:0;
position:absolute;
z-index:2;
width:45px;
}

.select_group:after {
content:"\f078";
color:#ccc;
font-family: "Font Awesome 5 Free";
font-weight:600;
right:16px;
top:50%;
margin-top:-6px;
position:absolute;
font-size:85%;
z-index:3;
}

.select_box {
font-size: 100%;
padding: 3px 25px 3px 5px;
border: 1px solid #B3B3B3;
border-radius: 4px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
text-overflow:ellipsis;
background-color: #FFF;
margin: 0;
overflow-x: hidden;
position:relative;
}

select.ar-blk {
background-image:url(../../images/i_ar_blk.png);
background-position:95% center;
background-repeat:no-repeat;
background-size:9px 6px;
}

/*---------------------------------------------
checkbox
---------------------------------------------*/
.checkbox01-input {
display: none;
}
.checkbox01-parts {
padding-left: 18px;
position:relative;
font-size:93%;
display:inline-block;
text-align:left;
}
.checkbox01-parts::before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
margin-top:-6px;
width: 10px;
height: 10px;
border: 1px solid #999;
border-radius: 1px;
}
.checkbox01-parts.left::before { left: 0; }

.checkbox01-input:checked + .checkbox01-parts { color:#333; }
.checkbox01-input:checked + .checkbox01-parts::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
margin-top:-9px;
margin-left:3px;
width: 6px;
height: 10px;
transform: rotate(40deg);
-webkit-transform: rotate(40deg);
-moz-transform: rotate(40deg);
border-bottom: 3px solid #3498db;
border-right: 3px solid #3498db;
}

.checkbox01-input:checked + .checkbox01-parts.left::after { left: 0; }

/*---------------------------------------------
textarea
---------------------------------------------*/
textarea { background-color:#fff; border:1px solid #ccc; padding:5px; max-width:100%; }
textarea:disabled { background-color:#f0f0f0; border:1px solid #999; }

/*---------------------------------------------
focus
---------------------------------------------*/
/*--- focus ---*/

/*
input[type="text"],
textarea {
outline: none;
-webkit-transition: all .3s;
transition: all .3s;
}
input[type="text"]:focus,
textarea:focus {
box-shadow: 0 0 7px #1babe7;
border: 1px solid #1babe7;
}
*/

/*---------------------------------------------
switch
---------------------------------------------*/
/*--- switch_parts ---*/
input.switch { display: none; }
input.switch+label,
input.switch+label::before,
input.switch+label::after { -webkit-transition: all .3s; transition: all .3s; }
input.switch+label { display: inline-block; position: relative; height: 26px; border-radius: 12px; cursor: pointer; }
input.switch+label::before { display: block; content: attr(data-off-label); /*position: absolute; top: 6px; right: 7px; color: #fff;*/ height:26px; line-height:26px; }
input.switch+label::after { content: ''; position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; background-color: #fff; border-radius: 50%; }
input.switch:checked+label::before { content: attr(data-on-label);	left: 7px;	right: auto;	}
input.switch:checked+label::after { background-color: #f7f7f7; left:calc(100% - 24px); }

/*--- on_off ---*/
.on_off+label { background-color: #ddd; }
.on_off+label::before { color: #333; }
.on_off:checked+label { background-color: #3498db; }
.on_off:checked+label::before { color: #fff; }

/*--- off_on ---*/
.off_on+label { background-color: #3498db; }
.off_on+label::before { color: #fff; }
.off_on:checked+label { background-color: #ddd; }
.off_on:checked+label::before { color: #333; }

/*--- blue_red ---*/
.blue_red+label { background-color: #ec6f72; }
.blue_red+label::before { color: #fff; }
.blue_red:checked+label { background-color: #3498db; }
.blue_red:checked+label::before { color: #fff; }

/*--- select ---*/
.select+label { background-color: #ec6f72; }
.select+label::before { color: #fff; }
.select:checked+label { background-color: #3498db; }
.select:checked+label::before { color: #fff; }

.select+label ~ ul { display:none; }
.select+label ~ ul + ul { display:inline-block; }

.select:checked ~ ul  { display:inline-block; }
.select:checked ~ ul + ul { display:none; }

/*---------------------------------------------
text
---------------------------------------------*/
input[type="text"][disabled] { background-color:#f0f0f0; border:1px solid #999; }

/*---------------------------------------------
radio
---------------------------------------------*/
.radio-input { display: none; }
.radio-parts { padding-left: 24px; position:relative; margin-right:0; vertical-align:middle; line-height:1.6; display:inline-block; }
.radio-parts::before{ background-color:#fff; content: " "; display: block; position: absolute; top: 50%; left: 12px; width:18px; height:18px; border: 1px solid #ccc; border-radius: 50%; margin-top:-9px; }
.radio-input:checked + .radio-parts { background-color:rgba(0,71,156,0.1); color:#333; font-weight:600; }
.radio-input:checked + .radio-parts::after { content: " "; display: block; position: absolute; top: 50%; left: 15px; width: 14px; height: 14px; background: #4fac80; border-radius: 50%; margin-top:-6px; }

/*---------------------------------------------
tooltip
---------------------------------------------*/
.help-block {
display: block;
margin-top: 5px;
margin-bottom: 10px;
color: #959595;
}

/*---------------------------------------------
tooltip
---------------------------------------------*/
.tooltip {
position: relative;
height: auto;
text-decoration: none;
transition: .2s;
overflow: visible;
}
.tooltip:hover { cursor:pointer; }
.tooltip:before {
font-style: normal;
font-weight: normal;
display: inline-block;
width: 30px;
height: 30px;
padding: 0;
margin: 0;
color: #fff;
font-size: 30px;
text-align: center;
line-height: 20px;
}
.tooltip span {
position: absolute;
opacity: 0;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
width: auto;
padding: 10px;
border-radius: 2px;
background: #ddd;
color: #000;
transition: .5s;
background: #fff;
line-height: 20px;
min-width: 300px;
}
.tooltip span:before {
position: absolute;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
height: 0;
width: 0;
border: 5px solid transparent;
content: " ";
}
.tooltip span:after {
position: absolute;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
height: 0;
width: 0;
border: 6px solid transparent;
content: " ";
}
.tooltip:hover span {
opacity: 1;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
top:40px;
}

/*--- tooltip.bottom ---*/
.tooltip.bottom span {
-webkit-box-shadow: 0 30px 90px -20px rgba(0,0,0,0.3),0px 0px 1px rgba(0,0,0,0.5);
box-shadow: 0 30px 90px -20px rgba(0,0,0,0.3),0px 0px 1px rgba(0,0,0,0.5);
top: 30px;
right: 0;
}
.tooltip.bottom span:before { right:13px; top: -10px; border-bottom: 5px solid #fff; }
.tooltip.bottom span:after { right:12px; top: -12px; border-bottom: 6px solid #999; }

/*--- tooltip.top ---*/
.tooltip.top {}
.tooltip.top span {
-webkit-box-shadow: 0 30px 30px -10px rgba(0,0,0,0.3),0px 0px 1px rgba(0,0,0,0.5);
box-shadow: 0 30px 30px -10px rgba(0,0,0,0.3),0px 0px 1px rgba(0,0,0,0.5);
/*top: -200px;*/
top:0px;
left :0px;
background: #fff;
}
.tooltip.top span:before { bottom: -10px; left:13px; border-top: 5px solid #fff;  }
.tooltip.top span:after { bottom: -12px; left:12px; border-top: 6px solid #999; }

/*---------------------------------------------
colmn
---------------------------------------------*/
.col2 > li { width:50%; }
.col3 > li { width:33.3%; }
.col4 > li { width:25%; }
.col5 > li { width:20%; }
.col6 > li { width:16.6%; }

/*---------------------------------------------
loader
---------------------------------------------*/
/*--- circle loader ---*/
#loader {
	position: relative;
	width: 20px;
	height: 20px; 
	border-radius: 20px;
	border: 4px solid #1babe7;
	border-right-color: transparent;
	-webkit-animation: spin 1s infinite linear;
	-moz-animation: spin 1s infinite linear;
 margin:0 auto;
}
@-webkit-keyframes spin
{
	0% { -webkit-transform: rotate(0deg); opacity: 0.4; }
	50%  { -webkit-transform: rotate(180deg); opacity: 1; }
	100%   { -webkit-transform: rotate(360deg); opacity: 0.4; }
}
@-moz-keyframes spin
{
	0% { -moz-transform: rotate(0deg); opacity: 0.4; }
	50%  { -moz-transform: rotate(180deg); opacity: 1; }
	100%   { -moz-transform: rotate(360deg); opacity: 0.4; }
}

/*--- line ---*/
.line { 
max-width:100%;
height:5px; 
margin:10px auto; 
background:#ddd;
position:relative;
}

.fullwidth .expand { 
max-width:100%; 
height:5px; 
margin:0; 
background:#1babe7; 
position:absolute;
-moz-animation:fullexpand 5s ease-out;
-webkit-animation:fullexpand 5s ease-out;
left:0;
}

@-moz-keyframes fullexpand {
	0%  { width:0px;}
	100%{ width:100%;}	
}
@-webkit-keyframes fullexpand {
	0%  { width:0px;}
	100%{ width:100%;}	
}

.loader2 {
margin: 0 auto;
text-align: center;
padding: 0;
}

/* close + popup_modal */

#modal-content,
.modal-content {
margin: 5px 0 0;
padding: 10px ;
border: 2px solid #aaa ;
background: #fff ;
position:absolute;
text-align:left;
display: none;
width:160px;
z-index:4;
}

#modal-content p,
.modal-content p { margin:0; }

.modal-overlay,
#modal-overlay {
display:none;
background-color:transparent;
opacity:0.7;
width:100%;
height:120%;
position:fixed;
top:0;
left:0;
overflow: hidden;
z-index:3;
}

.modal-top .modal-content { left:0; bottom:50px; }
.modal-right .modal-content { bottom:0; right:-190px; }
.modal-bottom .modal-content { right:50px; top:55px; }
.modal-left .modal-content { bottom:0; left:-190px; }

.button-link:hover { cursor:pointer; }

/*---------------------------------------------
tablet
---------------------------------------------*/
@media screen and (max-width: 1024px){
.form-control {
/*padding: 6px;*/
/*line-height: 1.4;*/
}
}


