#connection {
    padding-top: 54px;
    padding-bottom: 93px;
}

#connection .title {
    margin-bottom: 33px;
}

#connection-title-2 {
    margin-bottom: 25px;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    color: #141414;
}

#connection form {
    margin: 0 auto;
    padding: 20px;
    max-width: 640px;
    border-radius: 0px;
    box-shadow: 0 4px 23px rgba(0, 0, 0, 0.27);
    background-color: #fff;
}

#connection form fieldset {
    margin-bottom: 28px;
    margin-top:0;
}

#connection .form-grid {

    margin: 0 auto 10px;
    display: flex;
    flex-wrap: wrap;
}

#connection .cl2, #connection .cl3, #connection .cl4, #connection .cl1 {
    margin-right: 15px;
    margin-left: 15px;
}

#connection .cl2 {
    width: calc(50% - 30px);
}

#connection .cl3 {
    width: calc(33.3333% - 30px);
}

#connection .cl4 {
    width: calc(25% - 30px);
}

#connection .cl1 {
    width: calc(100% - 30px);
}

#connection .form-title {
    margin-bottom: 32px;
    display: flex;
    align-items: center;
}

#connection .form-title:after {
    content: '';
    flex-grow: 3;
    margin-left: 10px;
    display: block;
    height: 5px;
    background-color: #fbe115;
}

#connection .form-title-mt {

}

#connection .cbx-title {
    margin-bottom: 15px;
    font-weight: 700;
    color: #505050;
    text-transform: uppercase;
}

#connection .cbx1 {
    margin-top: 14px;
}

#connection .cbx1 label {
    text-transform: uppercase;
    font-weight: 700;
    color: #505050;
}

#connection hr {
    margin-top: 15px;
    display: block;
    width: 100%;
    height: 5px;
    background-color: #fbe115;
}

#connection .form-bottom {
    padding-top: 24px;
}

#connection .form-bottom input[type=checkbox] + label:before {
    top: -1px;
}

#connection .privacy2, #connection .offerta, #connection .advancedinfo {
    margin-bottom: 23px;
    font-size: 12px;
    line-height: 1.25;
    text-transform: uppercase;
    min-height: 50px;
    text-align: left;
}

#connection .privacy2 a {
    color: #3599d9;
    text-decoration: underline;
}

#connection button {
    width: 100%;
    background-color: #c89a69;
    color: #fff;
}

#connection button:hover {
    background-color: #000;
}

#connection button.mfp-close{
    right: -15px;
    top: 25px;
    width: auto;
    height: auto;
    line-height: 0.6;
    border-radius: 50%;
    padding: 10px;
}


#connection .form-bottom a:hover {
    color: #c89a69;
}

#connection .form-bottom > div:last-child {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#connection .gp-link {
    display:block;
    position:relative;
    text-align: left;
    font-size: 16px;
    line-height: 1.1;
    white-space: normal;
    /*display: flex;
    align-items: center;
    max-width: 360px;
    height: 50px;
    padding-right: 180px;
    margin-left: auto;
    margin-bottom: 15px;
    font-size: 15px;
    line-height: 1.1;
    white-space: normal;
    background: url(/theme/images/googlestore.png) 100% 100% no-repeat;
    text-align: right;*/
}

@media screen and (min-width: 571px) {
    #connection input[type=checkbox] + label,
    #connection input[type=radio] + label {
        padding-left: 30px;
    }

    #connection input[type=checkbox] + label:before,
    #connection input[type=radio] + label:before {
        top: -15px;
        width: 30px;
        height: 30px;
    }

    #connection input[type=checkbox]:checked + label:before {
        background-size: 36px 36px;
    }

    #connection input[type=radio]:checked + label:before {
        background-size: 30px 30px;
    }
}

@media screen and (max-width: 1270px) {
    #connection form {
        width: 100%;
        padding: 20px;
    }

    #connection .form-grid {
        width: 100%;
    }

}

@media screen and (max-width: 960px) {

    #connection {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    #connection .title {
        font-size: 24px;
        margin-bottom: 15px;
    }

    #connection-title-2 {
        margin-bottom: 40px;
        font-size: 18px;
    }

    #connection .cl2, #connection .cl3, #connection .cl4, #connection .cl1 {
        margin-right: 0;
        margin-left: 0;
        width: 100%;
    }

    #connection .form-bottom > div:last-child {
        display: block;
    }

    #connection .gp-link {
        margin-top: 30px;
        margin-bottom: 0;
    }
}

@media screen and (max-width: 570px) {
    #connection-title-2 {
        font-size: 16px;
    }

    #connection .form-title:after {
        display: none;
    }

    #connection .form-title-mt {
        margin-top: 10px;
    }

    #connection form {
        padding: 10px;
        box-shadow: none;
    }

    #connection .cbx-title {
        margin-bottom: 20px;
        font-size: 14px;
    }

    #connection .cbx1 label {
        font-size: 14px;
    }

    #connection .cbx1 {
        margin-top: 0;
    }

    #connection .gp-link {
        font-size: 12px;
        padding-right: 170px;
    }

}
.btn1 {
    width: 330px;
    height: 65px;
    border-radius: 5px;
    background-color: #fbe115;
    font-size: 18px;
    color: #d20213;
    font-weight: 700;
    border: none;
}
.btn1:hover {
    background-color: #e9d012;
}
.datepicker{
    z-index: 1050;
}
.form1 .form-title {
    margin-bottom: 25px;
    text-align: center;
    font-size: 1.2em;
    font-weight: 700;
}
@media (max-width:768px){
    .form1 .form-title {
        font-size: 1em;
    }
}
.form1 fieldset {
    margin-bottom: 25px;
    position: relative;
    padding: 0;
}

.form1 legend {
    position: absolute;
    top: 14px;
    left: 17px;
    padding: 0 2px;
    background-color: #fff;
    color: #505050;
    text-transform: uppercase;
    pointer-events: none;
    border:none;
    width:auto;
    margin:0;
    font-size: 1.2em;
    line-height: 1.2;
}

.form1 legend span {
    color: #ff4e3b;
    font-size: 1em;
}

.form1 :focus + legend,
.form1 .filled legend,
.form1 select + legend {
    top: -10px;
    font-size: 14px;
}
@media(max-width:768px){
    .form1 legend {
        font-size: 0.7em;
        line-height: 1.8;
    }
    .form1 legend span {
        font-size: 0.6em;
    }
    .form1 :focus + legend,
    .form1 .filled legend,
    .form1 select + legend {
        font-size: 0.7em;
    }
    .form1 :focus + legend span ,
    .form1 .filled legend span ,
    .form1 select + legend span  {
        font-size: 0.6em;
    }
}


.form1 input::-webkit-input-placeholder {
    color: #fff;
    opacity: 0.5;
}

.form1 input:-moz-placeholder {
    color: #fff;
    opacity: 0.5;
}

.form1 input::-moz-placeholder {
    color: #fff;
    opacity: 0.5;
}

.form1 input:-ms-input-placeholder {
    color: #fff;
    opacity: 0.5;
}

.form1 input:focus::-webkit-input-placeholder {
    color: #9b9b9b;
    opacity: 0.5;
}

.form1 input:focus:-moz-placeholder {
    color: #9b9b9b;
    opacity: 0.5;
}

.form1 input:focus::-moz-placeholder {
    color: #9b9b9b;
    opacity: 0.5;
}

.form1 input:focus:-ms-input-placeholder {
    color: #9b9b9b;
    opacity: 0.5;
}





.form1 :focus {
    border-color: #fbe115;
}

.form1 input, .form1 textarea, .form1 select {
    width: 100%;
    /*height: 50px;*/
    padding: 10px 18px;
    border-radius: 5px;
    background-color: #ffffff;
    border: 2px solid #e5e5e5;
}
@-webkit-keyframes autofill {
    to {
        color: inherit;
        background: inherit;
    }
}

.form1  input:-webkit-autofill {
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
}

.form1 input.error, .form1 textarea.error, .form1 select.error {
    border-color:#F00;
}
.form1 textarea {
    padding-top: 12px;
    height: 101px;
    resize: vertical;
}

.form1 select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' width='12' height='8'%3E%3Cpath fill='%23cacaca' d='M11.01,1h-10.02l5.01,7z' /%3E%3C/svg%3E") right 15px top 50% no-repeat;
    background-size: 12px 8px;
}


.form1 .datepicker-here {
    background: #fff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAXVBMVEUAAADT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PkDJZHAAAAH3RSTlMAoqCjwCep8Kom1Ovs0/+BgJ5AMBAgYJDpzs/nT+hNcqtWhgAAAIVJREFUeJytkNsOwiAQBY/1aL11uy6FXrT+/2eWJn2wigka52GATLIQgJlNMXv75AXy1cBuT7IsufbhiNM5FS4VpE6NqgWicS2uWFuX8MbvgSIWD3FvIswJzqyBN/NozFxO+P6Oj88Nqh6mavCqIWdUSzoEMsCR7d8/ses1wXDDvZME42MCQrUPQnM+cr4AAAAASUVORK5CYII=') top 11px right 12px no-repeat;
}

.form1 input[type=checkbox],
.form1 input[type=radio] {
    display: none;
}

.form1 input[type=checkbox] + label,
.form1 input[type=radio] + label {
    display: block;
    margin-left: 48px;
    position: relative;
}

.form1 input[type=checkbox] + label:before,
.form1 input[type=radio] + label:before {
    content: '';
    width: 30px;
    height: 30px;
    position: absolute;
    top: -4px;
    left: -48px;
    border-radius: 5px;
    border: 2px solid #e5e5e5;
}

.form1 input[type=radio] + label:before {
    border-radius: 50%;
}

.form1 input[type=checkbox]:checked + label:before {
    background: url("data:image/svg+xml,%3Csvg fill='%23ff4f3b' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1671 566q0 40-28 68l-724 724-136 136q-28 28-68 28t-68-28l-136-136-362-362q-28-28-28-68t28-68l136-136q28-28 68-28t68 28l294 295 656-657q28-28 68-28t68 28l136 136q28 28 28 68z'/%3E%3C/svg%3E") 50% no-repeat;
    background-size: 19px 19px;
}

.form1 input[type=radio]:checked + label:before {
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1664 896q0 209-103 385.5T1281.5 1561 896 1664t-385.5-103T231 1281.5 128 896t103-385.5T510.5 231 896 128t385.5 103T1561 510.5 1664 896z' fill='%23ff4f3b'/%3E%3C/svg%3E") 50% no-repeat;
    background-size: 18px 18px;
}


.form1 button:not(.enabled) {
    opacity: .5;
    filter: grayscale(100%);
    pointer-events: none;
}


.form1 .privacy {
    margin: 30px 0 20px;
    font-size: 11px;
    line-height: 18px;
    color: #505050;
}

.form1 .privacy a {
    border-bottom: 1px solid currentColor;
    color: #ff4f3b;
}

.form1 .privacy a:hover {
    color: #c01300;
}


.form1 .fi_success {
    text-align: center;
    font-size: 18px;
}

.form1 .fi_success ~ * {
    display: none !important;
}

.form1.sended :invalid {
    border-color: #ff4f3b;
}

.header-phone{
	display:block;
	position:absolute;
	right:0;
	top:10px;
	color:#fff;
	text-align:right;
	width:100%;
}
.header-phone a{
	    font-size: 32px;
}
/*.mfp-container{
    height:auto;
    min-height:100%;
}*/

.top-connection-form{

}
.top-connection-form#connection form{
    background:rgba(0,0,0,0.6);
}
.top-connection-form#connection form input[type=checkbox] + label,
.top-connection-form#connection form input[type=radio] + label{
    color:#fff;
}
.top-connection-form#connection form button:not(.enabled){
    opacity: 0.6;
}
.top-connection-form#connection  .ppf-success{
    color: #8baf11;
    font-size: 28px;
    font-weight: bold;
    background: rgba(0, 0, 0, 0.4);
    text-align: center;
    padding: 30px;
    border-radius: 20px;
}
.top-connection-form#connection .ppf-error {
    color: #f00;
}


.fixed-phone {
    display    : block;
    position   : fixed;
    left      : 30px;
    bottom     : 30px;
    box-sizing : border-box;
    opacity    : 1;
    transition : all 0.3s ease;
    z-index    : 1060;
}

.fixed-phone a {
    display  : block;
    position : relative;
}

.fixed-phone a:after {
    display          : block;
    position         : absolute;
    left             : 0;
    top              : 0;
    width            : 100%;
    height           : 100%;
    border           : 2px solid #c89a69;
    
    border-radius: 50%;
    transform-origin : center center;
    content          : '';
    z-index          : 11;
    transition       : transform 0.5s linear 0s;
    content          : '';
    transform        : scale(1);
    transform-origin : center center;
    opacity          : 1;
    transition       : transform 0s linear 0s, opacity 0s linear 0s;
    pointer-events   : none;
    z-index          : 10;
}

.fixed-phone:hover a:after {
    transform  : scale(2);
    opacity    : 0;
    transition : transform 0.3s linear 0s, opacity 0.3s linear 0s;
}

.fixed-phone a span {
    display                   : block;
    position                  : relative;
    padding                   : 10px;
    background                : #51b4e5;
    box-shadow: 0 0 2px #444;
    border-radius: 50%;
    text-align                : center;
    width                     : 60px;
    height                    : 60px;
    box-sizing                : border-box;
    transform                 : scale(1);
    transform-origin          : center center;
    z-index                   : 20;
    animation-duration        : 12s;
    animation-iteration-count : infinite;
    animation-name            : fixed_phone_blink;
    animation-timing-function : linear;
}

.fixed-phone a span:before {
    display          : block;
    position         : absolute;
    left             : 0;
    top              : 0;
    width            : 100%;
    height           : 100%;
    border           : 2px solid #c89a69;
    box-shadow: 0 0 2px #444;
    border-radius: 50%;
    transform-origin : center center;
    content          : '';
    z-index          : 10;
    transition       : transform 0.5s linear 0s;
    /*animation-duration        : 2s;
    animation-iteration-count : infinite;
    animation-name            : fixed_phone_pulse;
    animation-timing-function : linear;*/
}

.fixed-phone:hover a span:before {
    animation-name     : fixed_phone_bubble;
    animation-duration : 1s;
}

.fixed-phone a span:after {
    display                   : block;
    position                  : absolute;
    left                      : 0;
    top                       : 0;
    width                     : 100%;
    height                    : 100%;
    border                    : 2px solid #c89a69;
    box-shadow: 0 0 2px #444;
    border-radius: 50%;
    transform-origin          : center center;
    content                   : '';
    z-index                   : 11;
    transition                : transform 0.5s linear 0s;
    content                   : '';
    transform                 : scale(1);
    transform-origin          : center center;
    opacity                   : 1;
    transition                : transform 0s linear 0s, opacity 0s linear 0s;
    pointer-events            : none;
    z-index                   : 10;
    animation-duration        : 3s;
    animation-iteration-count : infinite;
    animation-name            : fixed_phone_pulse;
    animation-timing-function : linear;
}

.fixed-phone:hover a span:after {
    /*animation-name     : fixed_phone_bubble;*/
    animation-duration : 1s;
}

.fixed-phone a span i {
    display     : block;
    position    : absolute;
    left        : 50%;
    top         : 50%;
    transform   : translate(-50%, -50%);
    font-size   : 30px;
    line-height : 1.2;
    color       : #fff;
    z-index     : 10;
}


@keyframes fixed_phone_blink {
    0% {
        transform : scale(1);
    }
    1% {
        transform : scale(1.3);
    }
    2% {
        transform : scale(1);
    }
    3% {
        transform : scale(1.2);
    }
    4% {
        transform : scale(1);
    }
    5% {
        transform : scale(1.1);
    }
    5% {
        transform : scale(1);
    }
    100% {
        transform : scale(1);
    }
}

@keyframes fixed_phone_pulse {
    0% {
        transform : scale(1);
        opacity   : 0.9;
    }
    25% {
        transform : scale(1.2);
        opacity   : 0.5;
    }
    50% {
        transform : scale(1);
        opacity   : 0.8;
    }
    75% {
        transform : scale(1.3);
        opacity   : 0.3;
    }
    100% {
        transform : scale(1);
        opacity   : 0.9;
    }
}

@keyframes fixed_phone_trace {
    0% {
        transform : translate(4px, 4px);
    }
    25% {
        transform : translate(-4px, 4px);
    }
    50% {
        transform : translate(-4px, -4px);
    }
    75% {
        transform : translate(4px, -4px);
    }
    100% {
        transform : translate(4px, 4px);
    }
}

@keyframes fixed_phone_bubble {
    0% {
        transform : scale(1.1);
    }
    50% {
        transform : scale(0.9);
    }
    100% {
        transform : scale(1.1);
    }
}

.sa {
    display:none;
}
.sall {
    color:#ccc;
    cursor:pointer;
}
.sall {
    pointer-events: all;
    z-index:100;
    position:relative;
    right:15px;
    text-align:right;
}
