@charset "UTF-8";

/*!
 * Soka Solutions DMCC
 * Copyshyte 2024
 */

 :root {
        --ska-lGreen:  #19891b;
        --ska-mGreen:  #516d4f;
        --ska-dGreen:  #003300;
        --ska-dBlue:   #012349;
        --ska-Brown:   #42210b;
        --ska-lYellow: #ffd629;
        --ska-mYellow: #e6b800; 
        --ska-dYellow: #9b7d00;
        --ska-dGrey:   #333333;
        --ska-dBKG:    #1d1f20;
        --ska-lGrey:   #cccccc;
 }



h1 {text-align: center;}
input {padding: 10px; width: 100%; font-size: 17px; font-family: Raleway; border: 1px solid #aaaaaa;}
input:checked + .slider {background-color: var(--ska-lGreen);}
input:focus + .slider {box-shadow: 0 0 1px var(--ska-lGreen);}
input:checked + .slider:before {-webkit-transform: translateX(26px);-ms-transform: translateX(26px); transform: translateX(26px);}
input.invalid { background-color: #ffdddd;}
button {background-color: #04AA6D; color: #ffffff; border: none; padding: 10px 20px; font-size: 17px; cursor: pointer;}
button:hover {opacity: 0.8;}
textarea {width: 100%; resize: none;}
#regFor3m { background-color: var(--ska-lGrey); margin: 100px auto; font-family: Raleway; padding: 40px; width: 70%; min-width: 300px; border: #000 1px solid; border-end-end-radius: 20px;}
#prevBtn {background-color: #bbbbbb;}



.center {text-align: center;}
.contact-form { border: none; color: var(--ska-dGrey); line-height: normal; display: inline-block; font-family:sans-serif; font-size: 16px; cursor: pointer;}
.bg-lGrey{background-color: var(--ska-lGrey);}
.r-5 { border-radius: 0.5rem !important;}

.invalid {border: 2px solid red;}
.error {color: red; display: none;}
.step.finish { background-color: #4CAF50; }
.switch { position: relative; display: inline-block; width: 60px; height: 34px;}
.switch input { opacity: 0; width: 0; height: 0;}
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s;}
.slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s;}
.slider.round { border-radius: 34px;}
.slider.round:before { border-radius: 50%;}






/*  --------------------------------------------------*/

@media all and (max-width:455px) {}
@media all and (max-width:991px) {   p {color: var(--ska-dGrey);}  }
@media all and (min-width: 992px) {}