* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-align: center;
}

body {
    font-family: "Kaushan Script", cursive;
}

a {
    text-decoration: none;
}

h1 {
    padding: 2%;
    font-size: 55px;
}

h2 {
    font-size: 45px;
    padding: 20px;
}

h3 {
    font-family: "Merienda", cursive;
    font-size: 25px;
}

.line {
    border: none;
    height: 3px;
    width: 10%;
    background-color: #00f7ff;
    margin: 10px 45%;
}

/* ========== button ========== */

button {
    font-family: "Kalam", cursive;
    transition: 0.3s ease;
    text-transform: uppercase;
}

button :hover {
    background-color: #646464;
}

.button-blue {
    font-size: medium;
    color: #ffffff;
    background-color: #00f7ff;
    padding: 10px 20px;
    border: #00f7ff;
    border-radius: 40px;
}

.button {
    background: none;
    padding: 10px 20px;
    font-size: medium;
    color: #ffffff;
    border: 3px solid #ffffff;
    border-radius: 40px;
}

/* ========== header ========== */

header {
    font-family: "Merienda", cursive;
    position: fixed;
    width: 100%;
}

.header-top,
footer div {
    background-color: #32353e;
}

.header-top {
    padding: 10px 40px;
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 4%;
}

#search {
    background-color: #494d54;
    height: 50px;
    width: 230px;
    padding: 10px;
    border: none;
    list-style: none;
    color: white;
    font-family: inherit;
}

#search::placeholder {
    color: white;
    font-size: 20px;
    text-align: left;
}

.social-media {
    width: 190px;
}

.social-media a {
    padding: 1px 3%;
    background-color: #15bfc6;
    border-radius: 50px;
    color: #ffffff;
}

.navbar {
    background-color: white;
    padding: 9px 190px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 1px 100px #7e7e7e79;
}

.navbar ul {
    text-transform: uppercase;
    list-style: none;
    display: flex;
    justify-content: center;
    gap: 10%;
    font-size: 13px;
}

.navbar a {
    color: #454545;
}

.contact {
    display: grid;
    font-size: 15px;
}

.contact a {
    color: #31c8ce;
}

/* ========== section 1 ========== */

.sec1 {
    padding: 270px 0px;
    background-image: url(assets/1.jpg);
    background-size: cover;
    background-position: center;
    color: white;
}

.sec1 p {
    line-height: 1.8;
    padding-bottom: 70px;
    font-size: larger;
    display: flex;
    justify-content: center;
    text-align: center;
}

/* ========== section 2 ========== */

.sec2 {
    padding: 120px;
    color: #32353e;
}

.sec2 h3 {
    padding-bottom: 10px;
}

.div-services {
    display: flex;
}

.card-services {
    width: 25%;
    padding: 50px;
    padding-bottom: 0;
}

.card-services i {
    color: #15c0c7;
    font-size: 500%;
    padding-bottom: 10%;
}

.card-services h5 {
    font-size: large;
    padding-bottom: 10%;
}

.card-services p {
    color: #c5c5c5;
    padding: 10%;
    text-align: center;
}

/* ========== section 3 ========== */

.sec3 {
    color: white;
    padding: 120px 280px;
    background-image: url(assets/2.jpg);
    background-size: cover;
    background-position: center;
}

.sec3 p {
    text-align: center;
    padding-bottom: 50px;
}

/* ========== section 4 ========== */

.sec4 {
    color: #32353e;
    padding: 80px 190px;
}

.div-business h5 {
    font-size: 27px;
}

.div-business {
    display: flex;
}

.card-business {
    margin: 20px;
    padding: 0;
    display: grid;
    box-shadow: 0 1px 30px #c4c4c4;
}

.card-business h5,
p {
    padding: 1vh;
    text-align: left;
}

.card-business p {
    color: #8d8d8d;
    font-family: "Merienda", cursive;
}

.card-business a {
    color: #646464;
}

.card-business span {
    font-family: "Merienda", cursive;
    text-align: left;
    color: #00b193;
    padding: 1vh;
}

.card-business img {
    width: 50vh;
    transition: 0.3s ease;
}

.card-business img:hover {
    transform: scale(1.1);
}

/* ========== section 5 ========== */

.sec5 {
    background-image: url(assets/pexel.jpg);
    background-position: center;
    background-size: cover;
    padding: 80px 190px;
    color: aliceblue;
}

.sec5 .div-business-tips {
    font-family: "Merienda", cursive;
    display: flex;
    justify-content: center;
    text-align: center;
}

.sec5 .num {
    border: 3px solid #fff;
    border-radius: 50%;
    padding: 70px;
    font-size: xx-large;
}

.sec5 .num-card {
    margin: 15vh 5vh 0;
}

.sec5 .num-card p {
    margin: 100px 0 0 0;
    padding: 0;
    font-size: x-large;
}

/* ========== section 6 ========== */

.sec6 {
    color: #32353e;
    padding: 80px 190px;
}

.sec6 .div-client {
    font-family: "Merienda", cursive;
    display: flex;
}

.sec6 .client-card {
    margin: 1vh 2vh;
    display: flex;
}

.sec6 .img-client {
    margin: 2vh;
}

.sec6 img {
    width: 15vh;
    border-radius: 50%;
}

.sec6 p {
    text-align: left;
    padding: 0;
    margin: 0;
}

.client-card span {
    font-size: 25px;
}

/* ========== section 7 ========== */

.sec7 {
    color: white;
    height: 60vh;
    padding: 80px 190px;
    background-image: url(assets/Revenue.jpg);
    background-size: cover;
}

.sec7 h3 {
    font-size: 30px;
}

.sec7 button {
    margin: 100px;
}

/* ========== footer ========== */

.footer {
    color: #32353e;
    padding: 80px 190px;
}

.footer form {
    padding: 30px;
    display: grid;
    gap: 20px;
}

.footer input {
    padding: 20px;
    margin-left: 25%;
    background-color: #e4e4e494;
    border: none;
    width: 50%;
}

form input::placeholder{
    color: #8d8d8d;
    text-align: start;
    font-size: large;
    font-family: "Merienda", cursive;
}

.div-footer {
    padding: 20px;
    color: #ffffff;
    font-family: "Merienda", cursive;
}