*{
font-family: sans-serif;}
header{max-width: 1200px;
margin: auto;
margin-top: 20px ;
display: flex;
align-items: center;
justify-content: space-around;}
header ul{
    list-style: none;
    display: flex;
    gap: 15px;
}
.logo{width: 300px;}
header button{
    background-color: green;
    color: white;
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 20px;
    border: none;
}
.platform{
    height: 80vh;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    background-position: center;
        justify-content: center;
align-content: center;
   background-image: url(./image/background.png)
}
main{max-width: 1200px;
margin: auto;}
.platform button{background-color: #FFBB8A;
    color: white;
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 20px;
    margin-top: 20px;
    border: none;
}
.platform aside{
    font-size: 20px;
    width: 440px;
}
.platform article{color: gray;
}
.platform span{color: green;}
.but article{font-size: 15px;
width: 240px;
margin-top: 20px;}
.but{display: flex;
align-items: center;
gap: 20px;}
.rekl{display: flex;
    width: 140px;
    gap: 25px;
    position: absolute;
    bottom: -20px;
}
.rekl img{width: 130px;}
.easy{margin-top: 80px;}
.box{display: flex;
justify-content: space-between;
align-items: center;}
.easy article{width: 550px;}
.podryd nav{display: flex;
align-items: center;
margin-top: 30px;
justify-content: space-between;}
.podryd img{width: 200px;
display: flex;
}
.podryd h1, .cen{text-align: center;
}
article{color: gray;}
.podryd button{
    height: 30px;
    text-align: center;
    border: none;
    background-color: white;
   
    border-radius: 50%;}
.ch{background-color: #FFBB8A;
border-radius: 50%;
width: 20px;
margin-bottom: 30px;
height: 20px;
text-align: center;}
.visa nav{display: flex;
    gap: 10px;
}
.visa span{width: 550px;}
.visa h1{font-size: 35px;
width: 450px;}
.visa p{width: 600px;}
.card{
    border-radius: 15px;
width: 550px;
    padding: 20px;
    box-shadow: 1px 1px 1px 1px gray;}
.btn{background-color: #5EB083;
color: white;
margin-top: 10px;
border: none;
border-radius: 30px;
padding: 13px 25px;}
.gray{
    margin: 30px 0;
    border: none;
    background-color: #E7EEFA;
    border-radius: 30px;
    padding: 5px;
}
.ure{margin-top: 40px;}
.or{
    background-color: #FFBB8A;
    color: white;
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 20px;
    margin-top: 20px;
    border: none;
}
.test{display: flex;
flex-direction: column ;
align-items: center;}
.obs{background-color: #FFF6EF;
display: flex;
width: 1200px;
padding: 10px;
border-radius: 20px;}
.adri div{background-color: white;
padding: 10px;
text-align: center;
width: 200px;
border-radius: 20px;}
.boo{display: flex;
align-items: center;}
.adri h1{margin-left: 30px;}
.adri aside{padding: 40px;
    font-size: 20px;
width: 700px;}
.fle{display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;}
.faq button{border: none;
    background-color: transparent;
border-radius: 50%;
height: 20px;} 
.faq nav{display: flex;
    width: 1000px;
align-items: center;
justify-content: space-between;
}
.green{color: #5EB083;
}
.faq div{box-shadow: 1px 1px 1px 1px gray;
padding: 0 10px;
border-radius: 10px;
}
.faq{display: flex;
flex-direction: column;
gap: 10px;}
.fle1{display: flex;
flex-wrap: wrap;
}
.soc{background-color: #272A2D;
width: 30px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
padding: 5px;}
.soc img{width: 20px;
height: 20px;}
.med{display: flex;}
footer{display: flex;
align-items: center;
max-width: 1200px;
margin: auto;
justify-content: space-around;
background-color: #2A3034;
color: white;
margin-top: 20px;
border-radius: 10px;}
button :hover{
    background-color: green;
  color: white;
  padding: 8px;
  margin: auto;
  border-radius: 50%;};
  button:hover{background-color: green;
padding: 8px;}
@media(max-width:500px){
   header ul{display: none;}
    .logo{width: 200px;}
    .platform aside{width: 400px;position: absolute;
    bottom: -120px;}
    .platform article{width: 300px;}
.platform {background-size: 400px;
    position: relative;top: -140px;
}
.rekl{margin-bottom:-200px;}
    .unvis{display: none;}
    main{
        margin-left: -7px;
        padding-left: 6px;
        width: 400px;
            background-color: #FFBB8A;}
.easy article{width: 300px;}
.easy img{width: 300px;}
.box{flex-direction: column;}
.visa h1{width: 380px;}
.visa p{width: 380px;}
.card{background-color: white;
width: 320px;
}
.visa{display: flex;
flex-direction: column;
align-items: center;}
.visa nav{display: flex;
    flex-direction: column;}
    .visa span{width: 300px;}
    .ure img{width: 340px;}
.ure{text-align: center;}
.adri{width: 400px;
}
.obs{display: flex;
    width: 300px;
flex-direction: column;}
.obs aside{width: 250px;}
.fle {width: 350px;}
.faq{width: 400px;}
.faq div{
    background-color: white;
}
    .faq aside{display: flex;
    flex-direction: column;
align-items: center;
gap: 10px;
}
.logo1{width: 300px;}
footer{display: flex;
    justify-content: start;
flex-wrap: wrap;
}
footer ul{list-style: none;}
footer div{width: 150px;}
footer nav{padding: 0 20px;text-align: center;}
}

