*{
    margin:0;
    padding:0
}
html{
    height:100%;
    background:#e9e9e9
}
body{
    font-family:montserrat,arial,verdana;
    width:100%;
    overflow-x:hidden
}
.cc-selector input{
    margin:0;
    padding:0;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none
}
.hideradio{
    visibility:hidden;
    position:absolute;
    top:5%;
    left:0
}
.cc-selector-2 input{
    position:absolute;
    z-index:999
}
.spacer{
    clear:both;
    height:20px
}
.erkek{
    background-image:url(../../imgs/m1.png)
}
.kadin{
    background-image:url(../../imgs/w1.png)
}
.t1{
    background-image:url(../../imgs/m1.png)
}
.t2{
    background-image:url(../../imgs/m2.png)
}
.t3{
    background-image:url(../../imgs/m3.png)
}
.t4{
    background-image:url(../../imgs/m4.png)
}
.t5{
    background-image:url(../../imgs/m5.png)
}
.t6{
    background-image:url(../../imgs/m6.png)
}
.female .t1{
    background-image:url(../../imgs/w1.png)
}
.female .t2{
    background-image:url(../../imgs/w2.png)
}
.female .t3{
    background-image:url(../../imgs/w3.png)
}
.female .t4{
    background-image:url(../../imgs/w4.png)
}
.female .t5{
    background-image:url(../../imgs/w5.png)
}
.female .t6{
    background-image:url(../../imgs/w6.png)
}
.cc-selector-2 input:active+.drinkcard-cc,.cc-selector input:active+.drinkcard-cc,.cc-selector-2 input:active+.error1+.drinkcard-cc,.cc-selector input:active+.error1+.drinkcard-cc{
    opacity:.9
}
.cc-selector-2 input:checked+.drinkcard-cc,.cc-selector input:checked+.drinkcard-cc,.cc-selector-2 input:checked+.error1+.drinkcard-cc,.cc-selector input:checked+.error1+.drinkcard-cc{
    -webkit-filter:none;
    -moz-filter:none;
    filter:none
}
.drinkcard-cc{
    cursor:pointer;
    background-size:cover;
    background-position:center!important;
    display:inline-block;
    width:100px;
    height:100px;
    -webkit-transition:all 100ms ease-in;
    -moz-transition:all 100ms ease-in;
    transition:all 100ms ease-in;
    -webkit-filter:brightness(1.2) grayscale(1) opacity(.7);
    -moz-filter:brightness(1.8) grayscale(1) opacity(.7);
    filter:brightness(1.2) grayscale(1) opacity(.7)
}
.drinkcard-cc:hover{
    -webkit-filter:brightness(1.2) grayscale(.5) opacity(.9);
    -moz-filter:brightness(1.2) grayscale(.5) opacity(.9);
    filter:brightness(1.2) grayscale(.5) opacity(.9)
}
.drinkcard-cc.text{
    background: #1cbdd0;
    text-align:center;
    color:#fff;
    font-weight:700;
    display:block;
    height:auto;
    padding:20px;
    margin:20px auto;
    width:100px
}
.steps{
    width:100%;
    /* margin:10px auto;
     */
    position:relative
}
.steps fieldset{
    background: #0c64b9;
    border: none;
    border-radius:3px;
    padding:10px 20px;
    box-sizing:border-box;
    width:100%;
    position:absolute;
    top: 75px;
    border-radius: 15px;
}
.steps fieldset:not(:first-of-type){
    display:none
}
.steps label{
    color:#333;
    text-align:left;
    font-size:15px;
    font-weight:200;
    padding-bottom:7px;
    padding-top:12px;
    display:block;
    margin:auto;
    margin-top:7px;
    border:1px solid #b0b0b0;
    max-width:100%;
    border-radius: 15px;
}
.steps input,.steps textarea,.steps select{
    outline:none;
    display:block;
    width:100%;
    margin:0 0 10px;
    padding:10px 15px;
    border:1px solid #d9d9d9;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    color:#837e7e;
    font-family:roboto;
    -webkti-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font-size:14px;
    font-wieght:400;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    -webkit-transition:all .3s linear 0s;
    -moz-transition:all .3s linear 0s;
    -ms-transition:all .3s linear 0s;
    -o-transition:all .3s linear 0s;
    transition:all .3s linear 0s
}
.steps input:focus,.steps textarea:focus{
}
.error1{
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    -moz-box-shadow:0 0 0 transparent;
    -webkit-box-shadow:0 0 0 transparent;
    box-shadow:0 0 0 transparent;
    position:absolute;
    left:246px;
    top:-28px;
    padding:0 10px;
    height:39px;
    display:block;
    color:#fff;
    background:#e63c2f;
    z-index:5;
    border:0;
    font:14px Corbel,lucida grande,lucida sans unicode,lucida sans,dejavu sans,bitstream vera sans,liberation sans,Verdana,verdana ref,sans-serif;
    line-height: 26px;
    white-space:nowrap
}
.form-row .error1{
    top: -50px;
}
.error1:before{
    width:0;
    height:0;
    left: 50%;
    transform: translateX(-50%);
    bottom: -13px;
    content:'';
    position:absolute;
    border-top: 8px solid #e63c2f;
    border-right: 8px solid transparent;
    border-bottom:6px solid transparent;
    border-left: 8px solid transparent;
}
.error-log{
    margin:5px 5px 5px 0;
    font-size:19px;
    position:relative;
    bottom:-2px
}
.question-log{
    margin:5px 1px 5px 0;
    font-size:15px;
    position:relative;
    bottom:-2px
}
.steps .action-button,.action-button{
    width: 100px!important;
    background: #000000;
    font-weight:700;
    color:#fff;
    border:0;
    border-radius:1px;
    cursor:pointer;
    padding:10px 5px;
    margin:0 auto 10px;
    -webkit-transition:all .3s linear 0s;
    -moz-transition:all .3s linear 0s;
    -ms-transition:all .3s linear 0s;
    -o-transition:all .3s linear 0s;
    transition:all .3s linear 0s;
    display:block;
    border-radius: 25px;
}
.steps .post-button{
    width: 60%!important;
    background:#3d8af1
}
.steps .next,.steps .submit{
    float:right
}
.steps .previous{
    float:left;
    background: red !important;
}
.steps .action-button:hover,.steps .action-button:focus,.action-button:hover,.action-button:focus{
    background: #0091ec;
}
.steps .explanation{
    display:block;
    clear:both;
    width:540px;
    background:#f2f2f2;
    position:relative;
    margin-left:-30px;
    padding:22px 0;
    margin-bottom:-10px;
    border-bottom-left-radius:3px;
    border-bottom-right-radius:3px;
    top:10px;
    text-align:center;
    color:#333;
    font-size:12px;
    font-weight:200;
    cursor:pointer
}
.fs-title{
    margin: 0 0 15px;
    line-height:1;
    color: #ffffff;
    font-size:15px;
    font-weight:600;
    text-align:left
}
.fs-subtitle{
    font-weight:400;
    font-size:13px;
    color:#837e7e;
    margin-bottom:20px;
    text-align:center
}
#progressbar{
    margin-bottom: 15px;
    overflow:hidden;
    counter-reset:step;
    width:100%;
    text-align:center;
    padding: 0;
}
#progressbar li{
    list-style-type:none;
    color: #fff;
    text-transform:uppercase;
    font-size:12px;
    width:25%;
    float:left;
    position:relative
}
#progressbar li:before{
    content:counter(step);
    counter-increment:step;
    width:20px;
    line-height:20px;
    display:block;
    font-size:10px;
    color:#333;
    background:#dbdbdb;
    border-radius:3px;
    margin:0 auto 5px
}
#progressbar li:after{
    content:'';
    width:100%;
    height:2px;
    background:#dbdbdb;
    position:absolute;
    left:-50%;
    top:9px;
    z-index:-1
}
#progressbar li:first-child:after{
    content:none
}
#progressbar li.active:before,#progressbar li.active:after{
    background: #7dcea6;
    color:#fff
}
@media(max-width:1000px){
    .steps input,.steps textarea{
        outline:none;
        display:block;
        width:100%!important
    }
    .error1{
        left: 50%;
        transform: translateX(-50%);
        margin-top:0
    }
}
@media(max-width:5px){
    .steps{
        width:100%;
        margin:50px auto;
        position:relative
    }
    #progressbar{
        display:none
    }
    .error1{
        position:relative;
        left:0!important;
        margin-top:24px;
        top:-11px
    }
    .error1:before{
        width:0;
        height:0;
        left:14px;
        top:-14px;
        content:'';
        position:absolute;
        border-left:6px solid transparent;
        border-bottom:8px solid #e62163;
        border-right:6px solid transparent
    }
    .steps fieldset:not(:first-of-type){
        display:block
    }
    .steps fieldset{
        position:relative;
        width:100%;
        margin:0 auto;
        margin-top:45px
    }
    .steps .next,.steps .previous{
        display:none
    }
    .steps .explanation{
        display:none
    }
    .steps .submit{
        float:right;
        margin:28px auto 10px;
        width:100%!important
    }
}
.info{
    width:300px;
    margin:35px auto;
    text-align:center;
    font-family:roboto,sans-serif
}
.info h1{
    margin:0;
    padding:0;
    font-size:28px;
    font-weight:400;
    color:#333;
    padding-bottom:5px
}
.info span{
    color:#666;
    font-size:13px;
    margin-top:20px
}
.info span a{
    color:#666;
    text-decoration:none
}
.info span .fa{
    color:#e2a810;
    font-size:19px;
    position:relative;
    left:-2px
}
.info span .spoilers{
    color:#999;
    margin-top:5px;
    font-size:10px
}
 .counter-form {
    font-family: 'Lexend', sans-serif;
    transform: translateY(-130%);
}
 .counter-form .topform {
     padding: 0 0 1px 0;
     border-radius: 15px;
     background-color: #0186e0;
     width: 100%;
}
 .counter-form .topform .form-heading {
     padding: 15px;
     font-size: 18px;
     margin: 0;
     font-weight: bold;
     color: #FFF;
}
 .steps fieldset ul {
    padding:0
}
 .steps input[name="country"] {
     pointer-events: none;
}
 .form-row {
     position: relative;
     display: flex;
}
