#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          : 53px 40px 50px;
    max-width        : 1030px;
    border-radius    : 10px;
    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-top: 0;
    margin-bottom: 10px;
    display   : flex;
    flex-wrap : wrap;
}

#connection .cl {

}

#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 .cl2_3 {
    width : calc(66.6666% - 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 {

}

#connection .privacy2, #connection .offerta, #connection .advancedinfo {
    margin-bottom  : 10px;
    font-size      : 14px;
    line-height    : 1.2;
    /* text-transform : uppercase;*/
    letter-spacing : 0;
    min-height     : 40px;
    text-align     : left;
}

#connection .privacy2 a {
    color           : #545454;
    text-decoration : underline;
}

#connection button {
    width            : 100%;
    background-color : #37d245;
    color            : #fff;
}

#connection button:hover {
    background-color : #53bb2f;
}

#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 : #53bb2f;
}

#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;*/
}
#connection input[type=checkbox] + label,
#connection input[type=radio] + label {
    padding-top:4px;
    padding-left : 30px;
    min-height: 40px;
}
#connection input[type=checkbox] + label:before,
#connection input[type=radio] + label:before {
    top    : 0px;
}
@media screen and (min-width : 571px) {
    #connection input[type=checkbox] + label,
    #connection input[type=radio] + label {
        padding-left : 10px;
    }
    
    #connection input[type=checkbox] + label:before,
    #connection input[type=radio] + label:before {
        top    : 0px;
        width  : 36px;
        height : 36px;
    }
    
    #connection input[type=checkbox]:checked + label:before {
        background-size : 30px 30px;
    }
    
    #connection input[type=radio]:checked + label:before {
        background-size : 26px 26px;
    }
}

@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;
}

.form1 legend {
    position         : absolute;
    top              : 14px;
    left             : 25px;
    padding          : 0 2px;
    background-color : #fff;
    color            : #505050;
    text-transform   : uppercase;
    pointer-events   : none;
    font-weight      : normal;
    border           : none;
    width            : auto;
    margin           : 0;
    font-size        : 1.2em;
    line-height      : 1.2;
}

.form1 legend span {
    color     : #ff4e3b;
    font-size : 1em;
    margin-left: 4px;
}

.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          : 0 10px;
    border-radius    : 5px;
    background-color : #ffffff;
    border           : 2px solid #545454;
}

@-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 : 4px;
    padding-bottom:4px;
    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 : 38px;
    position    : relative;
}

.form1 input[type=checkbox] + label:before,
.form1 input[type=radio] + label:before {
    content       : "";
    width         : 30px;
    height        : 30px;
    position      : absolute;
    top           : -4px;
    left          : -38px;
    border-radius : 5px;
    border        : 2px solid #8C8C8C;
}

.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         : #545454;
}

.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%;
}*/

.page-title{
    color:#333;
}
.breadcrumb {
    display:         flex;
    position:        relative;
    margin:          10px 0 20px 0;
    padding:         0;
    flex-wrap:       wrap;
    color:           #222;
    justify-content: center;
}

.breadcrumb li {
    display:      inline-block;
    list-style:   none;
    margin-right: 10px;
}

.breadcrumb li:after {
    display:     inline-block;
    position:    relative;
    content:     "-";
    margin-left: 10px;
    color:       #222;
}

.breadcrumb li:last-child:after {
    display: none;
}

.breadcrumb li a {
    color:           #222;
    text-decoration: none;
}

.breadcrumb li span {
    color: #222;
}

.page-content-block ol {
    /* убираем стандартную нумерацию */
    list-style: none;
    /* Идентифицируем счетчик и даем ему имя li. Значение счетчика не указано - по умолчанию оно равно 0 */
    counter-reset: li;
}
.page-content-block ol li:before {
    /* Определяем элемент, который будет нумероваться — li. Псевдоэлемент before указывает, что содержимое, вставляемое при помощи свойства content, будет располагаться перед пунктами списка. Здесь же устанавливается значение приращения счетчика (по умолчанию равно 1). */
    counter-increment: li;
    /* С помощью свойства content выводится номер пункта списка. counters() означает, что генерируемый текст представляет собой значения всех счетчиков с таким именем. Точка в кавычках добавляет разделяющую точку между цифрами, а точка с пробелом добавляется перед содержимым каждого пункта списка */
    content: counters(li, ".") ". ";
    display: inline-block;
    float: left;
    margin-right: 10px;
    
}

.page-content-block{
    padding: 40px 0;
}
.page-content-block h1 {font-size:24px;line-height: 1; font-weight: bold;}
.page-content-block h2 {font-size:22px;line-height: 1; font-weight: bold;}
.page-content-block h3 {font-size:20px;line-height: 1; font-weight: bold;}
.page-content-block h4 {font-size:18px;line-height: 1; font-weight: bold;}
.page-content-block h5 {font-size:16px;line-height: 1; font-weight: bold;}
.page-content-block h6 {font-size:14px;line-height: 1; font-weight: bold;}