/*INPUT*/
input {width:100%; border:1px solid #000; padding:13px 10px; color:#000; font-weight:500;font-family: 'Roboto', sans-serif;outline:none; font-size:14px;}
input + label,textarea + label{font-size:12px;}

textarea {border:1px solid #000;color:#000; font-weight:500; font-family: 'Roboto', sans-serif;outline:none; font-size:14px;padding:13px 10px;width:100%;}
input[type="text"]:hover,input[type="password"]:hover,input[type="email"]:hover,input[type="tel"]:hover,textarea:hover{ border:1px solid #999999; outline:none; }
input[type="text"]:focus,input[type="password"]:focus,input[type="email"]:focus,input[type="tel"]:focus,textarea:focus{ border:1px solid #9400D3; background:transparent; outline:none;}

.form-group {margin-bottom: 5px;}
.float-container {position: relative;}
.float-label {left: 8px;position: absolute;top: 0;opacity: 0;transition: all 200ms;}
.float-input:not(:placeholder-shown) + .float-label {background: #FFF;transform: translate(0, -50%);opacity: 1; padding:0 5px;}

/****  floating-Lable style start ****/
.floating-label { position:relative; margin-bottom:20px; }
.floating-input , .floating-select {padding:13px 10px;display:block;width:100%;background-color: transparent;border:none;border-bottom:1px solid #757575;}
.floating-input:focus , .floating-select:focus {outline:none;border-bottom:2px solid #5264AE; }
.floating-label label {color:#999; font-weight:normal;position:absolute;pointer-events:none;left:5px;top:5px;transition:0.2s ease all; -moz-transition:0.2s ease all; -webkit-transition:0.2s ease all;}
.floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label {top:-18px;color:#5264AE;}
.floating-select:focus ~ label , .floating-select:not([value=""]):valid ~ label {top:-18px;color:#5264AE;}
.floating-input:focus ~ .bar:before, .floating-input:focus ~ .bar:after, .floating-select:focus ~ .bar:before, .floating-select:focus ~ .bar:after {width:50%;}
.floating-textarea {min-height: 30px;max-height: 260px; overflow:hidden;overflow-x: hidden; }

.formField{padding-bottom: 0;border: 0 none;position: relative;}
.inputField {webkit-appearance: none;-moz-appearance: none;-webkit-appearance: none;appearance: none;width: 100%;padding:13px 10px;
border: 1px solid #d6d5cb;border-radius: 3px;color: #666459;outline: 0;margin-bottom: 15px;}

.labelField{display: block;position: absolute;color: #aead9e;top: 16px;left: 11px;transition: all .1s ease-out;-moz-transition: all .1s ease-out;-webkit-transition: all .1s ease-out;pointer-events: none;}
.inputField:-webkit-autofill ~ .labelField{top: 7px;}
.labelField .required {visibility: hidden;}
.inputField:focus ~ .labelField,.inputField:not(:placeholder-shown) ~ .labelField{top: 2px;}

/*CHECK BOX*/
.form-group-checkbox {margin-bottom: 15px;margin-right:10px;}
.form-group-checkbox input {padding: 0;height: initial;width: initial;margin-bottom: 0;display: none;cursor: pointer;}
.form-group-checkbox label {position: relative;cursor: pointer;}
.form-group-checkbox label:before {content:'';-webkit-appearance: none;background-color: transparent;border: 2px solid #000;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);padding: 8px;display: inline-block;position: relative;vertical-align: middle;cursor: pointer;margin-right: 5px;}
.form-group-checkbox input:checked + label:after {content: '';display: block;position: absolute;top: 1px;left: 7px;width: 6px;height: 12px;border: solid #0079bf;border-width: 0 2px 2px 0;transform: rotate(45deg);}

.form-group-checkbox.red input:checked + label:after {border: solid var(--red);border-width: 0 2px 2px 0;} 
.form-group-checkbox.darkred input:checked + label:after {border: solid var(--darkred);border-width: 0 2px 2px 0;} 
.form-group-checkbox.crimson input:checked + label:after {border: solid var(--crimson);border-width: 0 2px 2px 0;} 
.form-group-checkbox.firebrick input:checked + label:after {border: solid var(--firebrick);border-width: 0 2px 2px 0;} 
.form-group-checkbox.coral input:checked + label:after {border: solid var(--coral);border-width: 0 2px 2px 0;} 
.form-group-checkbox.tomato input:checked + label:after {border: solid var(--tomato);border-width: 0 2px 2px 0;} 
.form-group-checkbox.orangered input:checked + label:after {border: solid var(--orangered);border-width: 0 2px 2px 0;} 
.form-group-checkbox.orange input:checked + label:after {border: solid var(--orange);border-width: 0 2px 2px 0;} 
.form-group-checkbox.darkorange input:checked + label:after {border: solid var(--darkorange);border-width: 0 2px 2px 0;} 
.form-group-checkbox.gold input:checked + label:after {border: solid var(--gold);border-width: 0 2px 2px 0;} 
.form-group-checkbox.yellow input:checked + label:after {border: solid var(--yellow);border-width: 0 2px 2px 0;} 
.form-group-checkbox.khaki input:checked + label:after {border: solid var(--khaki);border-width: 0 2px 2px 0;} 
.form-group-checkbox.darkkhaki input:checked + label:after {border: solid var(--darkkhaki);border-width: 0 2px 2px 0;} 
.form-group-checkbox.green input:checked + label:after {border: solid var(--green);border-width: 0 2px 2px 0;} 
.form-group-checkbox.limegreen input:checked + label:after {border: solid var(--limegreen);border-width: 0 2px 2px 0;} 
.form-group-checkbox.forestgreen input:checked + label:after {border: solid var(--forestgreen);border-width: 0 2px 2px 0;} 
.form-group-checkbox.yellowgreen input:checked + label:after {border: solid var(--yellowgreen);border-width: 0 2px 2px 0;} 
.form-group-checkbox.greenyellow input:checked + label:after {border: solid var(--greenyellow);border-width: 0 2px 2px 0;} 
.form-group-checkbox.lime input:checked + label:after {border: solid var(--lime);border-width: 0 2px 2px 0;} 
.form-group-checkbox.olivedrab input:checked + label:after {border: solid var(--olivedrab);border-width: 0 2px 2px 0;} 
.form-group-checkbox.olive input:checked + label:after {border: solid var(--olive);border-width: 0 2px 2px 0;} 
.form-group-checkbox.cyan input:checked + label:after {border: solid var(--cyan);border-width: 0 2px 2px 0;} 
.form-group-checkbox.darkturquoise input:checked + label:after {border: solid var(--darkturquoise);border-width: 0 2px 2px 0;} 
.form-group-checkbox.teal input:checked + label:after {border: solid var(--teal);border-width: 0 2px 2px 0;} 
.form-group-checkbox.blue input:checked + label:after {border: solid var(--blue);border-width: 0 2px 2px 0;} 
.form-group-checkbox.deepskyblue input:checked + label:after {border: solid var(--deepskyblue);border-width: 0 2px 2px 0;} 
.form-group-checkbox.dodgerblue input:checked + label:after {border: solid var(--dodgerblue);border-width: 0 2px 2px 0;} 
.form-group-checkbox.royalblue input:checked + label:after {border: solid var(--royalblue);border-width: 0 2px 2px 0;} 
.form-group-checkbox.purple input:checked + label:after {border: solid var(--purple);border-width: 0 2px 2px 0;} 
.form-group-checkbox.indigo input:checked + label:after {border: solid var(--indigo);border-width: 0 2px 2px 0;} 
.form-group-checkbox.darkviolet input:checked + label:after {border: solid var(--darkviolet);border-width: 0 2px 2px 0;} 
.form-group-checkbox.magenta input:checked + label:after {border: solid var(--magenta);border-width: 0 2px 2px 0;} 
.form-group-checkbox.pink input:checked + label:after {border: solid var(--pink);border-width: 0 2px 2px 0;} 
.form-group-checkbox.lightgray input:checked + label:after {border: solid var(--lightgray);border-width: 0 2px 2px 0;} 
.form-group-checkbox.silver input:checked + label:after {border: solid var(--silver);border-width: 0 2px 2px 0;} 
.form-group-checkbox.darkgray input:checked + label:after {border: solid var(--darkgray);border-width: 0 2px 2px 0;} 
.form-group-checkbox.gray input:checked + label:after {border: solid var(--gray);border-width: 0 2px 2px 0;} 
.form-group-checkbox.black input:checked + label:after {border: solid var(--black);border-width: 0 2px 2px 0;} 
.form-group-checkbox.chocolate input:checked + label:after {border: solid var(--chocolate);border-width: 0 2px 2px 0;} 
.form-group-checkbox.maroon input:checked + label:after {border: solid var(--maroon);border-width: 0 2px 2px 0;} 
.form-group-checkbox.brown input:checked + label:after {border: solid var(--brown);border-width: 0 2px 2px 0;} 




.checkbox {margin-bottom: 15px; float:left; margin-right:10px;}
.styled-checkbox:checked,.styled-checkbox:not(:checked) {position: absolute;left: -9999px;}
.styled-checkbox:checked + label,.styled-checkbox:not(:checked) + label{position: relative;padding-left: 28px;cursor: pointer;line-height: 20px;display: inline-block;color: #666;}
.styled-checkbox:checked + label:before,.styled-checkbox:not(:checked) + label:before {content: '';position: absolute;left: 0;top: 0;width: 20px;height: 20px;border: 1px solid #000;background: #fff;}
.styled-checkbox:checked + label:after,.styled-checkbox:not(:checked) + label:after {content: '';width: 10px;height: 10px;background: #00a69c;position: absolute;top: 5px;left: 5px;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
.styled-checkbox:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0);}
.styled-checkbox:checked + label:after {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}

/*RADIO BUTTON*/
.styled-checkbox.radio:checked + label:before,.styled-checkbox.radio:not(:checked) + label:before { content: '';position: absolute;left: 0;top: 0;width: 19px;height: 19px;border: 1px solid #ddd;background: #fff;border-radius: 100%;}
.styled-checkbox.radio:checked + label:after,.styled-checkbox.radio:not(:checked) + label:after {width: 11px;height: 11px;background: #F87DA9;
top: 4px;left: 4px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
.styled-checkbox.red:checked + label:after,.styled-checkbox.red:not(:checked) + label:after {background: var(--red);}
.styled-checkbox.darkred:checked + label:after,.styled-checkbox.darkred:not(:checked) + label:after {background: var(--darkred);}
.styled-checkbox.crimson:checked + label:after,.styled-checkbox.crimson:not(:checked) + label:after {background: var(--crimson);}
.styled-checkbox.firebrick:checked + label:after,.styled-checkbox.firebrick:not(:checked) + label:after {background: var(--firebrick);}
.styled-checkbox.coral:checked + label:after,.styled-checkbox.coral:not(:checked) + label:after {background: var(--coral);}
.styled-checkbox.tomato:checked + label:after,.styled-checkbox.tomato:not(:checked) + label:after {background: var(--tomato);}
.styled-checkbox.orangered:checked + label:after,.styled-checkbox.orangered:not(:checked) + label:after {background: var(--orangered);}
.styled-checkbox.orange:checked + label:after,.styled-checkbox.orange:not(:checked) + label:after {background: var(--orange);}
.styled-checkbox.darkorange:checked + label:after,.styled-checkbox.darkorange:not(:checked) + label:after {background: var(--darkorange);}
.styled-checkbox.gold:checked + label:after,.styled-checkbox.gold:not(:checked) + label:after {background: var(--gold);}
.styled-checkbox.yellow:checked + label:after,.styled-checkbox.yellow:not(:checked) + label:after {background: var(--yellow);}
.styled-checkbox.khaki:checked + label:after,.styled-checkbox.khaki:not(:checked) + label:after {background: var(--khaki);}
.styled-checkbox.darkkhaki:checked + label:after,.styled-checkbox.darkkhaki:not(:checked) + label:after {background: var(--darkkhaki);}
.styled-checkbox.green:checked + label:after,.styled-checkbox.green:not(:checked) + label:after {background: var(--green);}
.styled-checkbox.limegreen:checked + label:after,.styled-checkbox.limegreen:not(:checked) + label:after {background: var(--limegreen);}
.styled-checkbox.forestgreen:checked + label:after,.styled-checkbox.forestgreen:not(:checked) + label:after {background: var(--forestgreen);}
.styled-checkbox.yellowgreen:checked + label:after,.styled-checkbox.yellowgreen:not(:checked) + label:after {background: var(--yellowgreen);}
.styled-checkbox.greenyellow:checked + label:after,.styled-checkbox.greenyellow:not(:checked) + label:after {background: var(--greenyellow);}
.styled-checkbox.lime:checked + label:after,.styled-checkbox.lime:not(:checked) + label:after {background:var(--lime);}
.styled-checkbox.olivedrab:checked + label:after,.styled-checkbox.olivedrab:not(:checked) + label:after {background: var(--olivedrab);}
.styled-checkbox.olive:checked + label:after,.styled-checkbox.olive:not(:checked) + label:after {background: var(--olive);}
.styled-checkbox.cyan:checked + label:after,.styled-checkbox.cyan:not(:checked) + label:after {background: var(--cyan);}
.styled-checkbox.darkturquoise:checked + label:after,.styled-checkbox.darkturquoise:not(:checked) + label:after {background: var(--darkturquoise);}
.styled-checkbox.teal:checked + label:after,.styled-checkbox.teal:not(:checked) + label:after {background: var(--teal);}
.styled-checkbox.blue:checked + label:after,.styled-checkbox.blue:not(:checked) + label:after {background: var(--blue);}
.styled-checkbox.deepskyblue:checked + label:after,.styled-checkbox.deepskyblue:not(:checked) + label:after {background: var(--deepskyblue);}
.styled-checkbox.dodgerblue:checked + label:after,.styled-checkbox.dodgerblue:not(:checked) + label:after {background: var(--dodgerblue);}
.styled-checkbox.royalblue:checked + label:after,.styled-checkbox.royalblue:not(:checked) + label:after {background:var(--royalblue);}
.styled-checkbox.purple:checked + label:after,.styled-checkbox.purple:not(:checked) + label:after {background: var(--purple);}
.styled-checkbox.indigo:checked + label:after,.styled-checkbox.indigo:not(:checked) + label:after {background: var(--indigo);}
.styled-checkbox.darkviolet:checked + label:after,.styled-checkbox.darkviolet:not(:checked) + label:after {background:var(--darkviolet);}
.styled-checkbox.magenta:checked + label:after,.styled-checkbox.magenta:not(:checked) + label:after {background: var(--magenta);}
.styled-checkbox.pink:checked + label:after,.styled-checkbox.pink:not(:checked) + label:after {background: var(--pink);}
.styled-checkbox.lightgray:checked + label:after,.styled-checkbox.lightgray:not(:checked) + label:after {background: var(--lightgray);}
.styled-checkbox.silver:checked + label:after,.styled-checkbox.silver:not(:checked) + label:after {background: var(--silver);}
.styled-checkbox.darkgray:checked + label:after,.styled-checkbox.darkgray:not(:checked) + label:after {background: var(--darkgray);}
.styled-checkbox.gray:checked + label:after,.styled-checkbox.gray:not(:checked) + label:after {background: var(--gray);}
.styled-checkbox.black:checked + label:after,.styled-checkbox.black:not(:checked) + label:after {background: var(--black);}
.styled-checkbox.chocolate:checked + label:after,.styled-checkbox.chocolate:not(:checked) + label:after {background: var(--chocolate);}
.styled-checkbox.maroon:checked + label:after,.styled-checkbox.maroon:not(:checked) + label:after {background:var(--maroon);}
.styled-checkbox.brown:checked + label:after,.styled-checkbox.brown:not(:checked) + label:after {background: var(--brown);}



.radio-button {margin-bottom: 1rem;}
.radio-button .label-wrapper {border-radius: 50%;cursor: pointer;display: block;padding-left: 2.5rem;position: relative;top: 0.25rem;}
.radio-button .label-wrapper:hover .radio-button-input ~ .custom-indicator {border-color: black;}
.radio-button .label-title {margin-bottom: 0.25rem;}
.radio-button .label-subtext {display: block;font-size: 0.85rem;font-style: italic;}
.custom-indicator {background-color: white;border: 1px solid #999;border-radius: 50%;height: 24px;left: 0;position: absolute;top: 0;width: 24px;}
.custom-indicator::after {background-color: mediumseagreen;border-radius: 50%;content: "";display: none;height: 15px;left: 4px;position: absolute;top: 4px;width: 15px;}
.radio-button-input {opacity: 0;position: absolute;z-index: -1;}
.radio-button-input:focus ~ .custom-indicator {border-color: black;}
.radio-button-input:checked ~ .custom-indicator::after {display: block;}
.radio-button-input:disabled ~ .custom-indicator {opacity: 0.6;pointer-events: none;}

.custom-indicator.red::after {background: var(--red:);} .custom-indicator.darkred::after {background: var(--darkred);}
.custom-indicator.crimson::after {background: var(--crimson);} .custom-indicator.firebrick::after {background: var(--firebrick)}
.custom-indicator.coral::after {background: var(--coral);} .custom-indicator.tomato::after {background: var(--tomato);}
.custom-indicator.orangered::after {background: var(--orangered);} .custom-indicator.orange::after {background:var(--orange);}
.custom-indicator.darkorange::after {background: var(--darkorange);} .custom-indicator.gold::after {background: var(--gold);}
.custom-indicator.yellow::after {background: var(--yellow);} .custom-indicator.khaki::after {background: var(--khaki);}
.custom-indicator.darkkhaki::after {background: var(--darkkhaki);} .custom-indicator.green::after {background: var(--green);}
.custom-indicator.limegreen::after {background: var(--limegreen);} .custom-indicator.forestgreen::after {background: var(--forestgreen);}
.custom-indicator.yellowgreen::after {background: var(--yellowgreen);} .custom-indicator.greenyellow::after {background: var(--greenyellow);}
.custom-indicator.lime:checked::after {background: var(--lime);} .custom-indicator.olivedrab::after {background: var(--olivedrab);}
.custom-indicator.olive::after {background: var(--olive);} .custom-indicator.cyan::after {background: var(--cyan);}
.custom-indicator.darkturquoise::after {background: var(--darkturquoise);} .custom-indicator.teal::after {background: var(--teal);}
.custom-indicator.blue::after {background: var(--blue);} .custom-indicator.deepskyblue::after {background: var(--deepskyblue);}
.custom-indicator.dodgerblue::after {background: var(--dodgerblue);} .custom-indicator.royalblue::after {background: var(--royalblue);}
.custom-indicator.purple::after {background: var(--purple);} .custom-indicator.indigo::after {background: var(--indigo);}
.custom-indicator.darkviolet::after {background: var(--darkviolet);} .custom-indicator.magenta::after {background: var(--magenta);}
.custom-indicator.pink::after {background: var(--pink);} .custom-indicator.lightgray::after {background:var(--lightgray);}
.custom-indicator.silver::after {background: var(--silver);} .custom-indicator.darkgray::after {background: var(--darkgray);}
.custom-indicator.gray::after {background: var(--gray);} .custom-indicator.black::after {background: var(--black);}
.custom-indicator.chocolate::after {background: var(--chocolate);} .custom-indicator.maroon::after {background: var(--maroon);}
.custom-indicator.brown::after {background: var(--brown);}

/*SELECT BOX */
select {font-family: 'Roboto', sans-serif;position: relative; display: inline-block; border:1px solid #000;font-weight:500;color: #000; font-size:13px; }
.selectbox {cursor: pointer; padding: 13px 10px; outline: 0; border-radius: 0; appearance: none; -webkit-appearance: none;-moz-appearance: none; background:url(../img/down-arrow.svg) no-repeat center right+10px; background-size: 10px auto; width:100%; }
.selectbox option{ background:#fff;}

/*FILE UPLOAD*/
.fileUpload {font-size:14px; padding: 0.875em;position: relative;text-align: center;cursor: pointer; background:var(--green);color: #fff; }
.fileUpload input.upload{position: absolute;top: 0;right: 0;margin: 0;padding: 0;cursor: pointer;opacity: 0;filter: alpha(opacity=0);height: 46px;cursor: pointer; width:100%;}
.fileLink {position: relative;cursor: pointer; width:180px; }
.fileLink input.upload {position: absolute;top: 0;right: 0;margin: 0;padding: 0;cursor: pointer;opacity: 0;filter: alpha(opacity=0);height: 20px;cursor: pointer; width:100%;}
.fileLink .note {cursor: pointer;_cursor: pointer;width:100%; line-height:20px; margin-bottom:9px;}
.disable-select {
user-select: none; /* supported by Chrome and Opera */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
}

/*INPUT ICON*/
.inputWithIcon {position: relative;}
.inputWithIcon i {position: absolute;top: 8px;padding: 9px 8px;color: #aaa;transition: 0.3s;}
.inputWithIcon i.left {left:3px;}
.inputWithIcon i.right {right:5px;}
.inputWithIcon input[type="text"] {box-sizing: border-box;transition: 0.3s;}