form, .field, .long, .flab, .send, .togtext, .policy, .dropmenu {
  width: 90%;
  display: block;
  margin: auto;
  border: 3px solid #254441;
  font-family: helvetica, arial;
  outline:none;
}

form, .field, .long, .dropmenu { 
  padding: 20px;
  background: #bbb;
  resize: none;
  z-index:-1;
  font-size:1em;
}

.dropmenu {color:#777;}
form {text-align: center;background-image:linear-gradient(#efe, #152431);}
.field, .long {text-align: left;}
.long {height:3em;overflow: auto;}
.flab {height: calc(.8em + 6px); line-height: calc(1em + 6px);font-size: .8em; background:#254441; color: #bbb;text-align:center;margin-bottom:1em;padding-bottom:calc(.8em + 6px);}
input:required + .flab, .dropmenu:required + .flab {font-weight:600;color: #ddd;}
.send {color: #254441; height:2em; width: 50%; margin: 50px auto;font-size:2em;background:#ddd;line-height:2em;}
.field, .dropmenu {border-top-left-radius: 25px;border-top-right-radius:25px;background:#ccc;}
.field:hover, .long:hover, .field:focus, .long:focus, .dropmenu:hover, .dropmenu:focus {background: #eee;border-right: solid 20px #254441;border-left: solid 20px #254441;}
.send {box-shadow:0px 17px 15px -6px rgba(0,0,0,0.56);}
.send:active {box-shadow: none;background:#dcec98;border: solid 3px black;}
.send:hover, .send:focus {background: #bccc88;}
.field:focus {background: #eee;}
.field:not(:placeholder-shown):invalid,.long:not(:placeholder-shown):invalid {border-left: 1.5rem solid #aa5500;background: #ffbb66}
.field:not(:placeholder-shown):valid,.long:not(:placeholder-shown):valid, .dropmenu {background: #efe;}
li {text-align: left;}

.switch {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 24px;
}

input:checked + .slider:before {
  -webkit-transform: translateX(23px);
  -ms-transform: translateX(23px);
  transform: translateX(23px);
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: #bbb;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ddd;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider.round {border-radius: 34px;}

.switch input {opacity: 0;width: 0;height: 0;}
input:checked + .slider {background-color: #254441;}
input:focus + .slider, input:hover + .slider {box-shadow: 0 0 5px #fff;}
.slider.round:before {border-radius: 50%;}
.policy {background: #854300;border: 3px solid #772200;color:#ddbb00;}
.policy a {color:#ffee00;}
.togtext {background: #304040;color: #ddd;}
.togtext a {color: #eee;}
.policy, .togtext {font-size:.8em;line-height:calc(.4em + 26px);}
.policy,.togtext {border-radius:25px;padding:20px;width:50%;}
input:required:valid + .slider:before {background-color: #ffee00;}
input:required:valid + .slider {background-color: #854300;}
input:required:invalid + .slider:before {background-color: #cc8833;}
input:required:invalid + .slider {background-color: #ddbb00;}

@media all and (max-width: 1080px) {
form, .field, .flab, .long, .dropmenu {width: 100%;}
.policy,.togtext {width:80%;}
}