.logistics-title{
    color: #c53045;
    font-size: 36px;
    font-weight: 750;
    margin-bottom: 30px;
}


h2.ci-headers{
    font-size: 24px;
    color: #c53045;
    text-align: center;
    padding: 30px;
}


/**Общее**/
.ci-list{
    margin-left: 0;
    line-height: 25px;
}


/**Баннер**/
#top-banner{
    background: url('/upload/pics/osist/logistics/top-banner.png') center top no-repeat white;
    margin-top: -20px;
    height: 747px;
}

.banner-text{
    padding-top: 80px;
}

.banner-text p{
    padding-top: 10px;
    font-size: 19px;
    line-height: 1.8;
}

.top-banner-header{
    font-size: 34px;
    color: #797979;
    line-height: 1.2;
    padding-bottom: 30px;
}

#main-page-content .ci-filled-button{
    padding-left: 50px;
    padding-right: 50px;
    background-color: #346da6;
    border: 1px solid #0c4074;
}

#main-page-content .ci-filled-button:hover{
    background-color: #3b84d0;
    border: 1px solid #083f77;
}

.ci-filled-button-item{
    padding-top: 50px;
}

.ci-filled-button-item-center{
    margin-top: 50px;
    text-align: center;
}


/**Первый блок список**/

.logistics-list-first{
    margin: 15px 0 15px 0;
}

.logistics-list{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
    flex-wrap: nowrap;
    margin-bottom: 30px;
}

.logistics-list-first :last-child{
    margin-bottom: 0px;
}

.ci-checked-circle-blue{
    flex-shrink: 0;
    height: 33px;
    width: 33px;
    background: url('/upload/pics/osist/logistics/circle-blue.png') top no-repeat;
}

.logistics-list-text{
    line-height: 22px;
}

/**Первое облако большое**/

.first-cloud-conteiner{
    background: url('/upload/pics/osist/logistics/cloud-1.png') center top no-repeat;
    background-size: contain;
    padding-top: 80px;
    padding-bottom: 80px;
    margin-top: 50px;
    margin-bottom: 70px;
}

.first-cloud-conteiner-item{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 50px;
    flex-shrink: 0;
}


.first-cloud-conteiner-text{
    font-size: 36px;
    font-weight: bold;
    color: #346da6;
    line-height: 50px;
    text-align: center;
}

.first-cloud-conteiner-pic{
    background: url('/upload/pics/osist/logistics/logistics-pic-01.png') top no-repeat;
    height: 273px;
    width: 297px;
}

.logistics-big-text{
    font-size: 18px;
    line-height: 30px;
}

/**Блок под первым облаком**/

.logistics-list-second-container{
    margin: 40px auto 20px;
    width: 90%;
}

.logistics-list-second{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
    flex-wrap: nowrap;
    margin-bottom: 40px;
}

.logistics-list-second-pics{
    flex-shrink: 0;
    height: 46px;
    width: 46px;
}

.logistics-list-second-container :last-child{
    margin-bottom: 0px;
}


#logistics-list-second-pics-pic1{
    background: url('/upload/pics/osist/logistics/logistics-pic-02.png') top no-repeat;
}
#logistics-list-second-pics-pic2{
    background: url('/upload/pics/osist/logistics/logistics-pic-03.png') top no-repeat;
}


/**Кнопка под облаком большая**/

.middle-container{
    display: flex;
    justify-content: center;
    margin: 60px 25px 50px 25px;
}

.middle-container-item{
    display: flex;
    justify-content: center;
    box-shadow: 0 5px 10px 5px #d6e2ed;
    border-radius: 35px;
    padding: 20px;
    width: 85%;

    text-align: center;
    cursor: pointer;
    min-height: 70px;
}

.middle-container-item-big{
    width: 100%;
}

.middle-container-item:hover{
    background-color: #356da6;
}

.middle-container-item:hover .middle-container-item-header__text{
    background-color: #356da6;
    color: #ffffff;
}

.middle-container-item-card-header{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 30px;
}

.middle-container-item-header__text{
    font-size: 28px;
    color: #346da6;
}

.middle-logistics-container-item__image{
    height: 99px;
    width: 99px;
    flex-shrink: 0;
}

.middle-logistics-container-item-arrow__image{
    height: 28px;
    width: 29px;
    flex-shrink: 0;
}

#logistics-buttom{
    background: url('/upload/pics/osist/logistics/logistics-pic-04.png') no-repeat;
}

.middle-container-item:hover #logistics-buttom{
    background: url("/upload/pics/osist/logistics/logistics-pic-04.png") no-repeat -103px;
}

.arrow1{
    background: url("/upload/pics/osist/logistics/arrows.png") no-repeat;
}

.middle-container-item:hover .arrow1{
    background: url("/upload/pics/osist/logistics/arrows.png") no-repeat -32px;
}


/**Блок с облаками**/


.second-cloud-conteiner{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    gap: 70px;
    margin: 50px;
}

.second-cloud-conteiner-headtext{
    font-size: 24px;
    color: #c53045;
    text-align: left;
    padding: 30px 0 15px 0px;
}

.second-cloud-conteiner-item{
    width: 40%;
}
.second-cloud-conteiner-ul{
    line-height: 25px;
    padding-bottom: 40px;
}

#main-page-content .ci-list-element, #main-page-content .ci-list li {
    padding-bottom: 15px;
}

.second-cloud-conteiner-item-cloud{
    background: url('/upload/pics/osist/logistics/cloud-2.png') top no-repeat;
    width: 45%;
    background-size: contain;
    padding: 20px 10px 0px 50px;
}

.second-cloud-conteiner-item-cloud-2{
    background: url('/upload/pics/osist/logistics/cloud-3.png') top no-repeat;
    width: 45%;
    background-size: contain;
    padding: 20px 10px 0px 50px;
}

.second-cloud-conteiner-pics{
    height: 288px;
    width: 100%;
}

#second-cloud-conteiner-pic3{
    background: url('/upload/pics/osist/logistics/logistics-pic-05.png') top no-repeat;
}

#second-cloud-conteiner-pic4{
    background: url('/upload/pics/osist/logistics/logistics-pic-06.png') top no-repeat;
}

#second-cloud-conteiner-pic5{
    background: url('/upload/pics/osist/logistics/logistics-pic-07.png') top no-repeat;
}

/**Блок с серым фоном**/

.form-header-gray{
    padding-top: 10px;
    padding-bottom: 20px;
    background-color: #f9f9f9;
    margin-top: 30px;
    background-size: cover;
}

.opportunities-container{
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 30px;
    margin-bottom:30px ;
    flex-wrap: wrap;
}

.opportunities-container__item{
    flex-basis: 40%;
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
    gap: 20px;
    background: #fff;
    box-shadow: 0 0 19px #e6ecf1;
    padding: 20px;
}

.opportunities-container-header__text{
    display: inline-block;
    margin-top: 20px;
    font-size: 18px;
    line-height: 19px;
    font-weight: 700;
    color: #346da6;

}

.opportunities-container-description{
    font-size: 16px;
    line-height: 25px;
}

.opportunities-container-button {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    padding: 15px;
    gap: 10px;

}

.opportunities-button-block{
    font-size: 16px;
    color: #346da6;
    text-decoration: none !important;
}

.opportunities-button-block:hover{
    color:#3b84d0;
    text-decoration: none;
    cursor: pointer;
}

.opportunities-container__image{
    align-self: center;
    width: 189px;
    height: 135px;
}

.opportunities-container-pic-arrow{
    background: url('/upload/pics/osist/logistics/arrow2.png') top no-repeat;
    width: 23px;
    height: 19px;
}

#opportunities-container-pic1{
    background: url('/upload/pics/osist/logistics/logistics-pic-08.png') top no-repeat;
}

#opportunities-container-pic2{
    background: url('/upload/pics/osist/logistics/logistics-pic-09.png') top no-repeat;
}

#opportunities-container-pic3{
    background: url('/upload/pics/osist/logistics/logistics-pic-10.png') top no-repeat;
}

#opportunities-container-pic4{
    background: url('/upload/pics/osist/logistics/logistics-pic-11.png') top no-repeat;
}

#opportunities-container-pic5{
    background: url('/upload/pics/osist/logistics/logistics-pic-12.png') top no-repeat;
}

#opportunities-container-pic6{
    background: url('/upload/pics/osist/logistics/logistics-pic-13.png') top no-repeat;
}


/**Блок с галочкой**/

.logistics-list-3{
    margin-top: 20px;
    margin-bottom: 20px;
}

.logistics-list-3-item{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
    margin-bottom: 15px;
    flex-wrap: nowrap;
}

.point{
    background: url('/upload/pics/osist/logistics/point.png') top no-repeat;
    width: 19px;
    height: 15px;
    flex-shrink: 0;
}

.logistics-correction{
    margin-top: -15px;
    font-style: italic;
}


/**Блок тарифы**/


.cost-container-features{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 45px 25px;
    margin-top: 30px;
}

.cost-container-feature-items{
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 15%;
    justify-content: space-between;
    border-radius: 15px;
    border: 2px solid #dfdfdf;
    padding: 30px 30px;
    text-align: center;
    line-height: 25px;
}


.tariff-element-price{
    font-size: 28px;
    margin: 30px 0 10px 0;
}

.tariff-element-text-big{
    font-size: 30px;
    font-weight: 700;
    color: #444444;
    line-height: 40px;
    margin-bottom: 45px;
}

.tariff-element-text{
    font-size: 24px;
    color: #444444;
    font-weight: 500;
}


/**Блок с фоновой картинкой**/

.middle-banner-conteiner{
    display: flex;
    flex-direction: row;
    justify-content: right;
    padding: 130px 0 0 430px ;
    margin-top: 30px;
    flex-wrap: wrap;
    gap: 70px 40px;
}


.middle-banner-conteiner-item{
    width: 45%;
    padding-bottom: 15px;
    font-size: 20px;
    font-weight: bold;
    color: #444444;
    border-bottom: 2px solid #444444;
    line-height: 25px;

}

/**Нижний блок Master UTM 1С**/


.buttom-container{
    margin-top: 25px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.buttom-container_item_big{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
    width: 75%;
}

#main-page-content .buttom-container_item_big .ci-list{
    margin-bottom: 0;
}

.buttom-container_item{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    width: 25%;
    gap: 20px;
}

.buttom-container-headtext{
    font-size: 22px;
    font-weight: 700;
    color: #c53045;
    text-align: left;
    margin-bottom: 30px;
}

.buttom-container_price{
    display: inline-block;
    font-size: 22px;
    font-weight: 700;
    color: #346da6;
    margin: 0 0 0 50px;
}

.buttom-pic{
    width: 208px;
    height: 208px;
}

#exchange{
    background: url('/upload/pics/osist/logistics/exchange.png') top no-repeat;
}

#page-bottom-dialog{
    margin-top: 0 !important;
}
