*{
margin:0;
padding:0;
font-family:'Poppins', sans-serif;
text-decoration:none;
list-style:none;
box-sizing:border-box;
outline:none;
border:none;
transition:all .2s ease;
}

*::selection{
background:#581845;
color:#fff;
text-shadow:none;
}

section{
padding:2rem 9%;
}

html::-webkit-scrollbar{
width:1rem;
background:#f5f0f0;
padding:.0 .2rem;
}

html::-webkit-scrollbar-thumb{
background:#0F52BA;
}

html::-webkit-scrollbar-thumb:hover{
background:#CE2029;
}

html{
font-size:62.5%;
scroll-behavior:smooth;
scroll-padding-top:6rem;
overflow-x:hidden;
background:#fff;
}

header{
position:fixed;
top:0;
left:0;
right:0;
background:#fff;
padding:2rem 9%;
display:flex;
align-items:center;
justify-content:space-between;
z-index:1000;
box-shadow:0 .1rem .2rem #010101;
}


header .logo{
font-size:3.5rem;
color:#880808;
font-weight:1000;
font-family:Ar Essence;
}



header .navbar a{
font-size:2rem;
padding:0 1.6rem;
color:#0F52BA;
font-weight:500;
}


header .navbar a:hover{
color:#CE2029;
}


header .icons a{
margin-left:1.6rem;

}

header .icons img{
border-radius:4px;
}

header .icons img:hover{
transform:translateY(-6px);
}


header #Menu{
display:none;
}


header .fa-bars{
font-size:3rem;
color:#0F52BA;
cursor:pointer;
border-radius:.6rem;
padding:.6rem 1.6rem;
border:.3rem solid #0F52BA;
display:none;
}

.home{
display:flex;
align-items:center;
min-height:100vh;
background:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0)) ,url(home.jpg) no-repeat;
background-size:cover;
background-position:center;
}

.home .content{
max-width:50rem;
}

.home .content h3{
font-size:5rem;
color:#fff;
padding:1rem 0;
}

.home .content p{
font-size:1.5rem;
color:#f5f0f0;
padding:1rem 0;
}

.btn{
display:inline-block;
border-radius:.6rem;
background:#0F52BA;
color:#fff;
padding:.9rem 3.5rem;
font-size:1.7rem;
margin-top:1rem;
}

.btn:hover{
background:#CE2029;
color:#fff;
}

.heading{
text-align:center;
font-size:4rem;
color:#010101;
padding:1rem;
margin:2rem 0;
font-family:Ar Essence;
}

.about .row{
display:flex;
align-items:center;
gap:3rem;
flex-wrap:wrap;
padding:2rem 0;
padding-bottom:2rem;
}

.about .row .content{
flex:1 1 40rem;
}

.about .row .content h3{
font-size:3rem;
}

.about .row .content p{
font-size:1.7rem;
color:#777;
padding:.5rem 0;
padding-top:1rem;
}

.about .row .vidoe-container{
flex:1 1 40rem;
position:relative;
}

.about .row .vidoe-container h3{
position:absolute;
top:50%;
transform:translateY(-50%);
font-size:3rem;
background:#f5f0f0;
width:100%;
padding:1rem 2rem;
text-align:center;
mix-blend-mode:screen;
font-weight:1000;
}

.about .row .vidoe-container video{
width:100%;
border-radius:15px;
height:100%;
object-fit:cover;
}

.team .box-team{
display:flex;
flex-wrap:wrap;
gap:1.5rem;
}


.team .box-team .box{
flex:1 1 30rem;
padding:3rem 2rem;
position:relative;
border-radius:15px;
margin-right:1.4rem;
background:#fff;
}

.team .box-team .box:hover{
box-shadow:0 .2rem .3rem #010101;
}

.team .box-team .box p{
color:#777;
font-size:2rem;
padding-top:2rem;
}

.team .box-team .box .user{
display:flex;
align-items:center;
padding-top:2rem;
}

.team .box-team .box .user img{
height:6rem;
width:6rem;
object-fit:cover;
margin-right:1rem;
}

.team .box-team .box .user h3{
font-size:2rem;
}



.footer .box-container{
display:flex;
flex-wrap:wrap;
gap:1.5rem;
}


.footer .box-container .box{
flex:1 1 25rem;
}

.footer .box-container .box h3{
color:#777;
font-size:2.5rem;
padding:1rem 0;
}

.footer .box-container .box p{
display:flex;
color:#141414;
font-size:1.7rem;
padding:1rem 0;
}



@media (max-width:991px){
html{
font-size:55%;
}

header{
padding:2.7rem;
}

section{
padding:2.7rem;
}

.home{
background-position:left;
}
}



@media (max-width:768px){
header .fa-bars{
display:block;
}

header .navbar{
position:absolute;
top:100%;
left:0;
right:0;
background:#fff;
border-top:.2rem solid #CE2029;
clip-path:polygon(0 0, 100% 0, 100% 0, 0 0);
}

header #Menu:checked ~ .navbar{
clip-path:polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}

header .navbar a{
margin:1.6rem;
padding:1.6rem;
display:block;
border-radius:.6rem;
}

header .navbar a:hover{
background:#CE2029;
color:#fff;
}

.home .content h3{
font-size:4rem;
}
}



@media (max-width:450px){
html{
font-size:50%;
}
}