@font-face {
  font-family: "SanFranc";
  src: url("sf.ttf");
}

@font-face {
  font-family: "Helvi";
  src: url("hn.ttf");
}

@font-face {
  font-family: "thic";
  src: url("thic.ttf");
}

body {
  background-color: #EFEFF5;
  width: 100%;
  -webkit-transition: 1s;
  transition: 1s;
}

.nMobile {
  display: none;
}


hr {
  padding: 0px;
  margin: -3px;
  border: solid 1px #E0E0E0;
  background-color: #E0E0E0;
  width: 100%;
  position: relative;
  top: 1px;
}

a {
    font-family: 'SanFranc';
    font-weight: bold;
}

h1 {
  font-size: 115%;
  font-family: 'SanFranc';
}

h2 {
  font-size: 200%;
  font-family: 'Helvi';
  color: #616161;
}

h3 {
  font-size: 140%;
  font-family: 'Helvi';
}

h4 {
  font-size: 100%;
  font-family: 'Helvi';
  transition: 1s;
}

select {
  padding: 5px;
  background-color: white;
  border: 1px solid #BDBDBD;
  border-radius: 4px;
}

.process {
  width: 100%;
  text-align: center;
  position: absolute;
  -webkit-transition: 0.7s;
  transition: 0.7s;
}

.header {
  font-family: 'SanFranc';
  width: 100%;
  text-align: center;
  background-color: white;
  position: relative;
  top: -9px;
  border-bottom: 1px solid #C0C0C4;
  padding-top: 8px;
}

.allP {
  -webkit-transition: 0.2s, opacity 0.8s;
  transition: 0.2s, opacity 0.8s;
}

.everyth {
  -webkit-transition: 1s;
  transition: 1s;
}

.csText {
  -webkit-transition: 2s;
  transition: 2s;
}

.surveys {
  -webkit-transition: 0.7s;
  transition: 0.7s;
  position: absolute;
  top: -800px;
  width: 100%;
}

.surv {
  font-size: 110%;
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #CCCCCC;
  border-radius: 13px;
  background-color: white;
}

.appear {
  -webkit-transition: 0.4s;
  transition: 0.4s;
  position: absolute;
  top: 200px;
  visibility: hidden;
  background-color: #EFEFF5;
}

.tContainer {
  width: 100%;
  padding-top: 5px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

.nextTo {
  white-space: nowrap;
}

.mL {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  width: 90px;
  position: relative;
  padding-top: 200px;
  opacity: 0;
}

.lBar {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  width: 190px;
  height: 10px;
  border-radius: 30px;
  border: 1px solid white;
  text-align: center;
}

.lPo {
  -webkit-transition: 20s;
  transition: 20s;
  width: 10px;
  height: 9px;
  background-color: white;
  position: relative;
  border-radius: 30px;
  right: 2px;
}

.panel {
  width: 100%;
  border-bottom: 1px solid #C0C0C4;
  border-top: 1px solid #C0C0C4;
  background-color: white;
  padding-left: 20px;
  padding-right: 16px;
}

.panelSec {
  width: 100%;
  border-bottom: 1px solid #C0C0C4;
  border-top: 1px solid white;
  background-color: white;
  padding-left: 20px;
  padding-right: 16px;
}

.mainBtn {
  -webkit-transition: 0.3s;
  transition: 0.3s;
  font-size: 100%;
  padding: 1px;
  margin: 0 auto;
  background-color: #007AFF;
  border-radius:8px;
  width: 50%;
  min-width: 250px;
  max-width: 320px;
  text-align: center;
}

.mainBtn:hover {
  opacity: 0.8;
}

.ico {
  width: 24px;
  position: absolute;
  right: 15px;
  top: 19px;
}

.ico:hover {
  opacity: 0.6;
}

.onoffswitch {
    position: relative; width: 61px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    height: 30px; padding: 0; line-height: 30px;
    border: 2px solid #999999; border-radius: 30px;
    background-color: #EEEEEE;
    transition: background-color 0.3s ease-in;
}
.onoffswitch-label:before {
    content: "";
    display: block; width: 30px; margin: 0px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 29px;
    border: 2px solid #999999; border-radius: 30px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
    background-color: #37D66C;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
   border-color: #37D66C;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
    right: 0px;
}