Почему не выставляется нормальный отступ
При вёрстке дз в блоке не выставляется отступ сверху 79рх как в макете. Приходится выставлять 3127рх с самого первого блока. Иначе картинка размещается на главном экране. https://pastenow.ru/4dd2df6d28a812c68f5889765e09036f
Скрин HTML https://pastenow.ru/92606677a71ec98774cd4c6786b0b2ff
* {
box-sizing:border-box;
margin: 0;
padding: 0;
}
.container {
width: 1140px;
margin: 0 auto;
}
.promo {
height: 680px;
background: url('../img/main_bg.png') center center/cover no-repeat;
padding: 39px 0 53px 0;
}
.logo .logo_img {
display: block;
margin: 0 auto;
}
.logo_text {
color: #ffffff;
font-family: Roboto;
font-size: 15px;
font-weight: 500;
line-height: 24px;
text-align: center;
text-transform: uppercase;
margin-top: 14px;
}
.titel {
color: #F9BF3B;
font-family: "Roboto-Black";
font-size: 31px;
font-weight: 400;
line-height: 24px;
text-transform: uppercase;
text-align: center;
}
h1 {
margin-top: 53px;
}
h2.titel {
margin-top: 30px;
}
.simple .titel_big {
color: #FFFFFF;
font-family: "Roboto-Black";
font-weight: 400;
text-transform: uppercase;
text-align: center;
font-size: 60px;
margin-top: 21px;
}
.promo .promo_text {
padding: 0 13px;
margin-top: 23px;
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
font-size: 17px;
line-height: 28px;
align-items: center;
text-align: center;
color: #FFFFFF;
}
.promo .promo_text span {
color: #F9BF3B;
font-weight: 700;
font-family: "Roboto-Bold";
}
.promo .promo_btn, .gift_btn {
display:block;
margin: 0 auto;
margin-top: 33px;
width: 313px;
height: 72px;
color: #FFFFFF;
font-size: 19px;
font-weight: 400px;
line-height: 24px;
padding-top: 22px;
text-align: center;
background: linear-gradient(0deg, #2798B9 0%, #3AB6DA 100%);
font-family: "Roboto-Condensed";
cursor: pointer;
outline: none;
text-transform: uppercase;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
border: 4px solid rgba(0, 0, 0, 0.18)
}
.more {
margin-top: 73px;
}
.more .more_text {
color: #FFFFFF;
font-family: "Roboto - Thin";
font-size: 15px;
font-weight: 400;
text-align: center;
text-transform: uppercase;
margin-top: 33px;
}
.more .more_img {
display: block;
margin: 0 auto;
margin-top: 13px;
}
.whaiting {
min-height: 604px;
background: #EFEFEF;
padding: 85px 0 75px 0;
}
.whaiting .waiting_header, .finish .finish_header {
color: #252525;
font-family: 'Roboto';
font-size: 30px;
font-weight: 400;
text-transform: uppercase;
text-align: center;
}
.finish .finish_header {
color: #ffff
}
.whaiting .waiting_divider, .finish .finish_divider {
width: 220px;
height: 7px;
background: #F9BF3B;
margin: 0 auto;
margin-top: 18px;
}
.whaiting .waiting_subheader {
color: #4A4A4A;
font-family: 'Roboto';
font-weight: 400;
font-size: 23px;
text-align: center;
margin-top: 18px;
}
.whaiting .waiting_wrapper {
display: flex;
justify-content: space-between;
margin-top: 46px;
}
.whaiting .waiting_wrapper .waiting_item {
width: 339px;
text-align: center;
}
.whaiting .waiting_wrapper .waiting_item .waiting_img {
width: 100%;
}
.whaiting .waiting_wrapper .waiting_item .waiting_descr {
margin-top: 26px;
color: #4A4A4A;
font-family: 'Roboto';
font-weight: 300;
font-size: 15px;
line-height: 21px;
}
.optimization {
min-height: 547px;
padding: 108px 0 74px 0;
}
.optimization .optimization_header {
margin-left: 366px;
font-family: 'Roboto';
font-size: 29px;
font-weight: 900;
text-transform: uppercase;
color: #299CBD;
}
.optimization .optimization_text {
margin-top: 25px;
margin-left: 366px;
color: #4A4A4A;
font-family: 'Roboto';
font-weight: 300;
font-size: 17px;
line-height: 27px;
}
.optimization .optimization_text span {
font-family: 'Roboto';
font-weight: 700;
}
.optimization .optimization_img {
position: absolute;
top: 1428px;
left:-242px;
z-index: -1;
}
.finish {
min-height: 450px;
padding: 86px 0 68px 0;
background: url('../img/second_bg.png') center center/cover no-repeat;
}
.finish .finish_wrapper {
margin-top: 39px;
display: flex;
justify-content: space-between;
}
.finish .finish_wrapper .finish_item {
width: 234px;
}
.finish .finish_wrapper .finish_item .finish_round {
display: flex;
margin: 0 auto;
justify-content: center;
align-items: center;
height: 118px;
width: 118px;
background: #B4E2FF;
border-radius: 100%;
}
.finish .finish_wrapper .finish_item .finish_descr {
margin-top: 25px;
text-align: center;
font-family: 'Roboto';
font-weight: 300;
font-size: 17px;
line-height: 20px;
color: #EFEFEF;
}
.present {
min-height: 628px;
background: #EFEFEF;
padding: 88px 0 88px 0;
}
.present .present_img {
position: absolute;
left: 540px;
top: 2487px;
}
.present .present_header {
margin-top: 262px;
font-family: 'Roboto';
font-weight: 400;
font-size: 30px;
line-height: 43px;
align-items: center;
text-align: center;
color: #252525;
}
.vebinar {
min-height: 512px;
padding: 81px 0 53px 0;
}
.vebinar .vebinar_img {
position: absolute;
right: 400px;
background-position: center;
top: 3127px
}
.vebinar .vebinar_header {
margin-top: 326px;
font-family: 'Roboto';
font-weight: 400;
font-size: 30px;
align-items: center;
color: #252525;
text-align: center;
text-transform: uppercase;
}
.vebinar .vebinar_big {
margin-top: 30px;
font-family: 'Roboto';
font-weight: 900;
font-size: 36px;
align-items: center;
text-align: center;
text-transform: uppercase;
color: #299CBD;
}
.vebinar .vebinar_subheader {
margin-top: 24px;
font-family: 'Roboto';
font-weight: 400;
font-size: 23px;
align-items: center;
text-align: center;
color: #4A4A4A;
}
.footer {
min-height: 169px;
background: rgb(20, 20, 20);
padding: 57px 0 69px 0;
align-items: center;
text-align: center;
}
.footer a, p {
font-family: 'Roboto';
font-weight: 300;
font-size: 15px;
line-height: 21px;
color: #888888;
text-decoration-line: underline;
}
.footer p {
text-decoration-line: none
}