@font-face {
    font-family:"Poppins";
    src: local('Poppins');
}
html,body {
    margin: 0;
    padding: 0;
}
* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
li {
    list-style-type: none;
}
a {
    text-decoration: none;
    color: #3a3838;
}
.wrapper {
    margin: 0 auto;
    max-width: 1600px;
    height: 100%;
    /* background-color: #fffcf4;   */
    font-family: 'Poppins', sans-serif;
}

/* HEADER */

.header {
    height: 139px;
}
.header_top {
    max-width: 1398px;
    height: 0px;
    border-top: 24px solid #282e40;
    border-right: 10px solid transparent;
}
.header_conteiner {
    display: flex;
}
.header_logo {
    margin-top: 25px;
    margin-left: 216px;
    margin-right: 430px;
    transition: 1s ease;
}
.header_logo:hover {
    transform: rotate3d(2, -1, -1, -0.2turn);
}
[href^="##"] {
    color: #639ebe;
}
.header_menu {
    display: flex;
    justify-content: space-between;
    margin-top: 46px;
    color: #3a3838;
    padding: 0%;
    max-width: 750px;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
}


/* MAIN */
/* section_one */

.section_one {
    max-width: 1532px;
    height: 0px;
    border-bottom: 550px solid #282e40;
    border-right: 635px solid transparent;
}

.style_apple {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    margin-left: 8em;
    padding-top: 150px; 
}
.main_best {
    line-height: 1;
    font-weight: 400;
    color: #5293b7;
    font-size: 50px;
}
.main_h1 {
    line-height: 100px;
    color: #fffcf4;
    font-size: 79px;
    font-weight: 500;
}
.main_text {
    font-weight: 300;
    margin-top: 30px;
    font-size: 17px;
    white-space: pre-line;
    color: #fffcf4;
}
.main_apple_img {
    margin-top: -300px;
    margin-left: 100%;
    transition: 2s ease;
}
.main_apple_img:hover {
    transform: translate(30px, 20px) rotate(20deg);
}
.main_apple_img img {
    position: relative;
}

/* SECTION_TWO */

.section_two {
    margin-top: 22px;
    display: flex;
    justify-content: space-between;
}
.two_img {
    margin-left: 216px;
    position: relative;
}
.two_img img {
    transition: 2s ease;
}
.two_img img:hover{
    transform: rotateY(-180deg);
}
.two_button_buy {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 220px;
    height: 64px;
    background-color: #282e40;
    margin-bottom: 90px;
    transition: 1s ease;
}
.two_button_buy:hover {
    transform: translateZ(100px);
    background-color: #03923e;
}
.text_button_buy {
    font-size: 20px;
    color: #fffcf4;
}
.two_text {
    margin: 115px 0 0 230px;
    font-size: 17px;
    white-space: pre-line;
    color: #282e40;
}
.two_h2 {
    font-weight: 500;
    font-size: 50px;
    margin-bottom: 0;
}

/* SECTION THREE */
 
.section_three {
    background-color: #282e40;
    max-width: 1481px;
    height: 600px;
    color: #fffcf4;;
}
.section_three h2 {
    padding-top: 80px;
    font-size: 40px;
    margin-left: 780px;
    font-weight: 500;
}
.three_figur :nth-child(2){
    margin:0px 20px;
}
.three_figur {
    display: flex;
    justify-content: flex-end;
}
.section_three figure img {
    max-width: 393px;
    max-height: 276px;
}
.three_figur figure{
    transition: 1s ease;
}
.three_figur figure:hover{
    z-index: 1;
    transform: scale(1.2);
}
.three_figur  p  a {
    color: #12c6f4;
    font-size: 17px;
}
figure {
    margin: 0%;
}
figcaption {
    margin-top: 40px;
    font-size: 25px;
    text-align: center;
}
.three_figur p {
    text-align: center;
}

/* SECTION FORE */

.section_fore {
    margin-left: 216px;
    margin-top: 200px;
    display: flex;
    justify-content: space-between;
}
 .fore_h2 {
    margin:0;
    font-size: 70px;
    color: #639ebe;
}
.fore_conteiner {
    white-space: pre-line;
}

 /* SECTION FIVE */

.section_five { 
    padding-top:  50px;
    max-width: 1300px;
    width: 100%;
    height: 700px;
    background-color: #282e40;
    margin-left: calc(100% - 1300px);
    color: #fffcf4;
}
.five_flex {
    margin-left: -100px;
    max-width: 1250px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-evenly;
}
.section_five h3 {
    margin-left: 430px;
    font-size: 50px;
    font-weight: 500;
}
.section_five figure {
    max-width: 380px;
    width: 100%;
    height: 480px;
    transition: 1s ease;
}
.figure_blog1 {
    background: url(images/blog1.png) 0 0/100% no-repeat;
 }
.figure_blog1:hover {
     z-index: 1;
     transform: scale(1.2);
 }
.figure_blog2 {
    background: url(images/blog2.png) 0 0/100%  no-repeat;
}
.figure_blog2:hover {
    z-index: 1;
    transform: scale(1.2);
}
.figure_blog3 {
    background: url(images/blog3.png) 0 0/100%  no-repeat;
}
.figure_blog3:hover {
    z-index: 1;
    transform: scale(1.2);
}
.five_figure_fon {
    background-image: url(images/blu_img.png);
    margin-top: calc(480px - 178px);
    height: 178px;
}
.five_figure_fon p {
    padding-top: 20px;
    white-space: pre-line; 
    text-align: center;
    line-height: 25px;
}
.five_figure_fon p span {
    color: #060503;
}

/* SECTION_FORM */

.form { 
    margin-top: 30px;
    display: flex;
    justify-content: start;
    white-space: pre-line;
    font-size: 50px;
}
.form_form {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    max-width: 800px;
    width: 100%;
    height: 800px; ;
    margin-top: 50px;
    margin-left: -80px;
    margin-bottom: 100px;
}
.form img {
    max-width: 1020px;
    height: 750px;
}
form h4{
    margin-bottom:  50px;
    font-weight: 500;
}
form h4 span {
    color: #12c6f4;
    font-size: 50px;
    font-weight: 650;
}
.form_style {
    padding: 20px 20px;
    color: #fffcf4;
    font-size: 18px;
    max-width: 568px;
    height: 90px;
    background-color: #282e40;
    margin-bottom: 20px;
 }
.form_style_t {
    font-family: 'Poppins' ;
    padding: 20px 20px;
    max-width: 568px;
    height: 138px;
    background-color: #282e40;
    margin-bottom: 35px;
    color: #fffcf4;
    font-size: 18px;
 }
input, button {
     border: none;
}
.form_button {
    max-width: 220px;
    height: 68px;
    background-color: #12c6f4;
    color: #010100;
    font-size: 24px;
    cursor: pointer;
 }

/* FOOTER */

.footer_email button {
    margin-top: 30px;
    max-width: 95px;
    height: 48px;
    background-color: #12c6f4;
    color: #010100;
    font-size: 16px;
}
.footer_conteiner {
    max-width: 1600px;
    height: 432px;
    background-color: #282e40;
    color: #fffcf4;
    display: flex;
    justify-content: space-around;
    font-size: 18px;
    font-weight: 300;
    padding-top: 50px;
}
.footer_conteiner p {
    white-space: pre-line;
}
.footer_conteiner h4 {
    font-size: 40px;
    font-weight: 500;
    margin: 0%;
}
.footer_conteiner a {
    color: #fffcf4;
}
.footer_contact p {
    margin-top: 50px;
}
.foot_menu {
    display: flex;
    flex-direction: column;
    justify-content: start;
}
.footer_menu {
    margin-top: 50px;
    padding: 0;
}
.footer_menu li {
    line-height: 30px;
}
.post {
    margin-left: 15%;
}
.footer_post {
    padding: 0;
    margin-top: 50px;
}
.footer_post li {
    display: flex;
    white-space: pre-line;
    margin-top: 30px;
}
.footer_post a {
    padding-left: 20px;
}
.footer_post li:first-child:before{
    content: url(images/f_b1.png);
    position: relative;
}
.footer_post li:last-child:before{
    content: url(images/f_b3.png);
    position: relative;
}
.footer_post li:nth-child(even)::before {
    content: url(images/f_b2.png);
    position: relative;
}
::before {
    margin-top: 3px;
}
.footer_email { 
    display: flex;
    flex-direction: column;
}
.footer_email input {
    padding-left: 20px;
    margin-top: 50px;
    max-width:280px;
    height: 50px;
}
.footer_end {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1600px;
    height: 68px;
    background-color: #046882;
    font-size: 20px;
    font-weight: 400;
    color: #f3f3f3;
}
 button:hover {
    background-color: #a38021;
}