body{
    font-family: sans-serif;
}
.navbar{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding-top: 10px;
}

.navlinks{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 600px;
    height: 40px;
    border-radius: 30px;
    background-color: #f4f4f4;
    text-align: center;
}

.navlinks a{
    padding-left: 20px;
    display: flex;
    align-items: center;
    width: 150px;
    height: 40px;
    border-radius: 30px;
    color: black;
    text-decoration: none;
    margin: auto;
    
}

a.active{
    background-color: #1a0851;
    color: white;
}

.navlinks a:hover{
    background-color: #1a0851;
    color: white;
    
}

.book{
    display: flex;
    align-items: center;
    width: 150px;
    height: 40px;
    background-color: #1a0851;
    border-radius: 30px;
    color: white;
    
}

.book a{
    color: white;
    text-decoration: none;
    padding-left: 40px;
    box-sizing: border-box;
}

.hero-container{
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.hero-left{
    width: 60%;
    background-color: #d1f383;
    border-radius: 9px;
    
}

.solve{
    width: 300px;
}

.solve h1{
    padding-left: 90px;
    width: 500px;
    font-size: 50px;
}

.solve p{
    font-weight: bold;
    padding-left: 90px;
    width: 520px;
}

.talks{
    display: flex;
    align-items: center;
    width: 130px;
    margin-left: 90px;
    height: 40px;
    background-color: #1a0851;
    border-radius: 30px;
    color: white;
    
}

.talks a{
    color: white;
    text-decoration: none;
    padding-left: 30px;
    box-sizing: border-box;
}

.hero-right img{
    border-radius: 9px;
    width: 500px;
    height: 500px;
}

.media{
    display: flex;
    align-items: center;
    gap: 20px;
}

.media img{
    height: 50px;
}

.brands{
    font-weight: bold;
    padding-left: 90px;
    padding-top: 70px;
}

.teams{
    margin-top: 20px;
    background-color: #ebe6fd;
    height: 250px;
    border-radius: 10px;
    text-align: center;
    font-size: 42px;
}

.teams p{
    margin: auto;
    width: 70%;
    padding-top: 40px;
}

.teams img{
    border-radius: 4px;
}

.explore{
    display: flex;
    justify-content: space-around;
    align-items:  baseline;
    padding-top: 50px;
}

.see-more{
    display: flex;
    align-items: center;
    width: 160px;
    margin-left: 40px;
    height: 40px;
    border: 1px solid gray;
    border-radius: 30px;
    color: white;
    
}

.see-more a{
    color: black;
    text-decoration: none;
    padding-left: 22px;
    box-sizing: border-box;
}

.work-images{
    display: flex;
    justify-content: space-around;
    padding-top: 40px;
}

.works{
    background-color: #e0e0e0;
    height: 320px;
    border-radius: 10px;
}
.work-images img{
    padding: 10px;
    width: 400px;
    height: 300px;
}

#works2{
    margin-top: 30px;
}

.creative{
    margin-top: 60px;
    text-align: center;
}

footer{
    background-color: black;
    border-radius: 10px;
    color: #818181;
    height: 300px;
}

.footer-container{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.footer-container div{
    padding-top: 30px;
    padding-bottom: 30px;
}

.footer-container div a{
    display: block;
    color: #818181;
    text-decoration: none;
    line-height: 30px;
}

.footer-puzzlify{
    width: 350px;
}
footer hr{
    color: #818181;
    width: 84%;
    margin: auto;
}

.last{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 86%;
    padding-left: 15px;
    margin: auto;
}

.last div{
    margin-left: 50px;
}

.last a{
    color: #818181;
    text-decoration: none;
    padding: 10px 20px;
}

.solution{
    display: flex;
    justify-content: center;
    padding: 10px;
}

.solution img{
    width: 900px;
    height: 400px;
    border-radius: 10px;
}

.solution div{
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    width: 300px;
    border-radius: 10px;
}

.sub-solution1{
    margin-left: 10px;
    background-color: #d1f383;
}
.sub-solution2{
    margin-right: 10px;
    background-color: #bedcfe;
}
.sub-solution3{
    margin-left: 10px;
    background-color: #ebe6fd;
}

.solution h1{
    padding-left: 20px;
}

.wrapper{
    display: flex;
    justify-content: center;
    gap: 10px;
    /* justify-content: space-be; */
    padding-bottom: 30px;
}

.wrapper img{
    border-radius: 10px;
    height: 400px;
}

.sub-wrapper{
    line-height: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 550px;
    text-align: center;
    background-color: #d1f383;
    border-radius: 10px;
}


.talks3{
    display: flex;
    align-items: center;
    width: 130px;
    height: 40px;
    background-color: #1a0851;
    border-radius: 30px;
    color: white;
    
}

.talks3 a{
    color: white;
    text-decoration: none;
    padding-left: 30px;
    box-sizing: border-box;
}

.faq-container{
    display: flex;
    width: 100%;
    margin: auto;
    justify-content: space-around;
    padding-bottom: 30px;
}

.faq-container img{
    margin-left: 20px;
    border-radius: 10px;
    width: 600px;
    height: 650px;
}

.faqs{
    margin-left: 40px;
}

.faqs p{
    padding-left: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}


.faq1{
    width: 80%;
    height: 60px;
    border-radius: 10px;
    background-color: #ffedcd;
    margin-bottom: -12px;    
}

.faq2{
    width: 80%;
    height: 80px;
    line-height: 23px;
    border-radius: 10px;
    background-color: #ffedcd;
}

.para p{
    width: 80%;
    height: 60px;
    border-radius: 10px;
    border: 1px solid #c7c9c9;
}

@media screen and (max-width: 690px) {
   
}