*,
        *::before,
        *::after {
            box-sizing: border-box;
            -webkit-box-sizing: border-box;
        }


body { background-color: #ecebff;}
        
.loginform{
	background-color: #ffffff;
	padding: 20px;
	/*      margin: 0 auto; */
	border: 1px solid #cccccc;
	border-radius: 5px;
	max-width: 490px;
	min-width: 330px;
	text-align: center;
        }

.loginform.btn {    text-align: center;   } 

.loginform h2 { text-transform: uppercase; padding-top: 30px; }

.conditions a { text-decoration: underline;  }
.conditions a:hover { text-decoration: none;  }

.heading{
	text-align: center;
	color: #4d4d4d;
	text-transform: uppercase;
        }
     
.googly {     background: linear-gradient(to right, rgb(66, 133, 244) 2.6rem, transparent 2.6rem) rgb(238, 238, 238);}

.googly:hover {     background: rgb(66, 133, 244); color: white;}

.bookly {     background: linear-gradient(to right, rgb(59, 88, 152) 2.6rem, transparent 2.6rem) rgb(238, 238, 238); }

.bookly:hover {  background: rgb(59, 88, 152);  color: white;}

.softy {     background: linear-gradient(to right, #430e60 2.6rem, transparent 2.6rem) rgb(238, 238, 238);}

.softy:hover {     background-color: #430e60; color: white;}

.apply {     background: linear-gradient(to right, rgb(0, 0, 0) 2.6rem, transparent 2.6rem) rgb(238, 238, 238); }

.apply:hover {     background: rgb(0, 0, 0); color: white; }


.srv {
    box-sizing: border-box;
    fill: #fff;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 40px;
    height: 48px;
}


.socbutton {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1.1rem;
    color: rgb(68, 68, 68);
    border: 0px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    line-height: 1.8;
    text-align: center;
    text-decoration: none;
    padding: calc(11px - 0.1ex) 10px calc(11px + 0.1ex) calc(2.6rem + 10px);
    position: relative;
    width: 298px;
    height: 52px;
/*  margin-top: 20px; */
   margin: auto;
}


.socbutton:hover {
    transition: color 0.5s linear; /* vendorless fallback */
    -o-transition: color 0.5s linear; /* opera */
    -ms-transition: color 0.5s linear; /* IE 10 */
    -moz-transition: color 0.5s linear; /* Firefox */
    -webkit-transition: color 0.5s linear; /*safari and chrome */
}

  

p.logger {
    color: rgb(51, 51, 51);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 200;
    line-height: 1.4;
    text-align: center;
    margin: 1.4rem 0px;
}


.emailfield {
    color: rgb(51, 51, 51);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.4;
    background-color: white;
    border: 1px solid rgb(66, 133, 244);
    border-radius: 4px;
    display: block;
    font-weight: 400;
    padding: 16px;
    width: 100%;
    max-width: 19rem;
    appearance: none;
    margin: auto;
    height: 50px;
}



.formfield {
    color: rgb(51, 51, 51);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.4;
    background-color: white;
    border: 1px solid rgb(66, 133, 244);
    border-radius: 4px;
    display: block;
    font-weight: 400;
    padding: 16px;
    max-width: 19rem;
    appearance: none;
    margin: auto;
    height: 50px;
    width: 280px;
}


.grayish:focus {
  background-color: white;
  border: 0px solid white;
}


.grayish {
	width: 280px; 
	border: 1px solid #c0c0c0; 
	color: #c0c0c0;
	}


.base-button {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1rem;
    border: 0px;
    border-radius: 4px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    padding: calc(11px - 0.1ex) 28px calc(11px + 0.1ex);
    width: 50%;
    background: rgb(246, 246, 246);
    color: rgb(153, 153, 153);
    cursor: default;
}


.uber { background-color: white; 	margin-top: 15px; }


.arrow {
  border: solid white;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 4px;
  float: left;
position: absolute;
top: 18px; left: 15px;
}

.left {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}


.separator {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.4;
    background-color: white;
    color: #222;
    font-size: 1.3rem;
    font-weight: 200;
    padding: 0px 1rem;
    position: relative;
    top: -0.2rem;
}


.separator a {
   color: blue;
   text-decoration: underline;
   }





#checkmark {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #47dda1;
    border-radius: 50%;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    float: right;
    margin-top: 10px;
    margin-right: 20px;
}

#checkmark:before {
    content: "";
    position: absolute;
    width: 3px;
    height: 9px;
    background-color: #fff;
    left: 11px;
    top: 6px;
}

#checkmark:after {
    content: "";
    position: absolute;
    width: 3px;
    height: 3px;
    background-color: #fff;
    left: 8px;
    top: 12px;
}





.checkmark {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #47dda1;
    border-radius: 50%;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    float: right;
    margin-top: 10px;
    margin-right: 20px;
}

.checkmark:before {
    content: "";
    position: absolute;
    width: 3px;
    height: 9px;
    background-color: #fff;
    left: 11px;
    top: 6px;
}

.checkmark:after {
    content: "";
    position: absolute;
    width: 3px;
    height: 3px;
    background-color: #fff;
    left: 8px;
    top: 12px;
}



.notconfirmed {
    background: silver!important
}

.confirmed {
        background: #47dda1;
}



#checkpass{
    display: inline-block;
    width: 25px;
    height: 25px;
    float: right;
    margin-top: 12px;
    margin-right: 18px;
}


#checkpass2{
    display: inline-block;
    width: 25px;
    height: 25px;
    float: right;
    margin-top: 12px;
    margin-right: 18px;
}


#placeholder{
    display: inline-block;
    width: 25px;
    height: 25px;
    float: right;
    margin-top: 12px;
    margin-right: 18px;
}


.fieldhelp {
margin-top: 20px;
font-size: 1.6em;
line-height: 1.5em;
color: #666666;
}



.conditions {
margin-top: 20px;
font-size: 1.3em;
line-height: 1.6em;
color: gray;
}