@font-face { font-family: 'ProximaNovaRegular'; src: url('../fonts/ProximaNova-Regular.eot'); src: url('../fonts/ProximaNova-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Regular.woff') format('woff'), url('../fonts/ProximaNova-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'ProximaNovaBold'; src: url('../fonts/ProximaNova-Bold.eot'); src: url('../fonts/ProximaNova-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Bold.woff') format('woff'), url('../fonts/ProximaNova-Bold.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'ProximaNovaBlack'; src: url('../fonts/ProximaNova-Black.eot'); src: url('../fonts/ProximaNova-Black.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Black.woff') format('woff'), url('../fonts/ProximaNova-Black.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'ProximaNovaExtraBold'; src: url('../fonts/ProximaNova-Extrabld.eot'); src: url('../fonts/ProximaNova-Extrabld.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Extrabld.woff') format('woff'), url('../fonts/ProximaNova-Extrabld.ttf') format('truetype'); font-weight: normal; font-style: normal; } h1, h2, h3, h4, h5, h6, p { margin: 0; padding: 0; } body { font-family: 'ProximaNovaRegular'; margin: 0; } button { outline: none; } .container { max-width: 1170px; } /* Section Header */ header { padding-top: 25px; padding-bottom: 25px; background-color: #191919; color: #fff; } .header-wrap { display: flex; justify-content: space-between; align-items: center; } .header-wrap__logo, .header-wrap__opening, .header-wrap__info { width: 370px; } .header-wrap__opening { width: 150px; } .header-wrap__opening p { font-size: 13px; line-height: 23px; font-family: 'ProximaNovaBold'; text-align: center; } .header-wrap__opening p span { font-family: 'ProximaNovaRegular'; font-size: 12px; } .header-wrap__info { text-align: right; } .header-wrap__info button { width: 170px; cursor: pointer; border: none; background-color: #1669b3; color: #fff; font-family: 'ProximaNovaBold'; text-transform: uppercase; text-align: center; transition: all .1s; vertical-align: top; height: 50px; } .header-wrap__info button:hover { background: none; border: 2px solid #1669b3; } .header-wrap__info p { display: inline-block; text-align: right; font-family: 'ProximaNovaBlack'; padding-top: 6px; position: relative; right: 28px; } /* Section Maon-info */ #info { min-height: 860px; background: url(../img/main-info/main-info__background.jpg) no-repeat center center; background-size: cover; } .info-wrap__card { background-color: #f7b516; color: #000000; height: 860px; padding-top: 100px; padding-left: 100px; } .info-card__title h1 { text-transform: uppercase; font-family: 'ProximaNovaBlack'; font-size: 38px; } .info-card__description p { font-family: 'ProximaNovaExtraBold'; margin-top: 47px; font-size: 24px; } .info-card__advantages { margin-top: 100px; font-family: 'ProximaNovaRegular'; } .info-advantages__item { margin-top: 45px; } .info-advantages__item p { padding-left: 15px; display: inline-block; font-size: 18px; } .info-advantages__item:nth-child(1)::before { content: ''; display: inline-block; width: 30px; height: 30px; position: relative; bottom: 4px; background: url(../img/main-info/icon-1.png) no-repeat center center; } .info-advantages__item:nth-child(2)::before { content: ''; display: inline-block; width: 30px; height: 30px; position: relative; bottom: 4px; background: url(../img/main-info/icon-2.png) no-repeat center center; } .info-advantages__item:nth-child(3)::before { content: ''; display: inline-block; width: 30px; height: 30px; position: relative; bottom: 4px; background: url(../img/main-info/icon-3.png) no-repeat center center; } .info-advantages__item:nth-child(4)::before { content: ''; display: inline-block; width: 30px; height: 30px; position: relative; bottom: 4px; background: url(../img/main-info/icon-4.png) no-repeat center center; } /* Section Main-price */ #price { min-height: 500px; background: url(../img/main-price/main-price__background.png) no-repeat center center; background-size: cover; padding-top: 100px; padding-bottom: 100px; }