@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@500&family=Noto+Sans+JP:wght@300&family=Roboto+Mono:wght@200&family=RocknRoll+One&display=swap');

* {
    box-sizing: border-box;
}

header,
section {
    overflow-x: hidden;
}

.primary-btn {
    border-radius: 30px;
}

:root {
    --lexend: 'Lexend', sans-serif;
    --noto-sans: 'Noto Sans JP', sans-serif;
    --roboto-mono: 'Roboto Mono', monospace;
    --rocknroll: 'RocknRoll One', sans-serif;
    --bggradient: linear-gradient(to bottom, #dd2476, #ff512f);
    --light-black: rgb(41, 41, 41);
    --light-gray: rgb(163, 157, 157);
}

/* header start */
header a {
    /* font-family: var(--lexend); */
    font-family: var(--roboto-mono);
    font-size: 20px;
    color: #ffffff;
    font-weight: bold;
}

header .navbar {
    background: #c2076ead;
}

header .container-fluid .row {
    background: var(--bggradient);
}

.dropdown-content {
    display: none;
    position: absolute;
    background: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 0px 15px 3px rgba(61, 61, 61, 0.2);
    z-index: 1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown-content a {
    color: black;
    padding: 10px 10px;
    text-decoration: none;
    display: block;
    transition: all linear 0.2s;
}

.dropdown-content a:hover {
    background: rgb(199, 199, 199);
    /* color: blue; */
}

header .nav-item {
    padding: 10px;
}

header .nav-item:last-child {
    padding-right: 100px;
}

header .nav-link:hover {
    color: rgb(0, 0, 0);
    /* border-bottom: 2px solid black; */
    background: whitesmoke;
}

header .row .col-md-7 {
    padding: 22vmin 1vmin;
    padding-bottom: 35vmin;
    color: white;
}

header .row .col-md-7 h6 {
    padding: 1vmin;
    letter-spacing: 4px;
}

header .row .col-md-7 h1 {
    font-size: 6.5vmin;
    font-weight: bold;
    padding: 0.1em 0em;
}

header .row .col-md-7 p {
    padding: 1vmin 5vmin;
}



header .row .col-md-5 {
    padding: 9.2vmin 1vmin;
}

header .row .col-md-5 img {
    width: 80%;
}

/* header end */

/* section 1 start */
.section-1 {
    padding: 20vmin 0vmin;
    overflow-y: visible;
}

.section-1 .row .col-md-6 .pray img {
    width: 80%;
    border-radius: 5px;
    opacity: 0.8;
}

.section-1 .row .col-md-6:last-child {
    position: relative;
}


.section-1 .row .col-md-6 .panel {
    position: absolute;
    top: 71px;
    left: -78px;
    background: white;
    box-shadow: -1px 2px 13px 0px #878787;
    padding: 43px 15px 52px 81px;
    font-family: var(--noto-sans);
    z-index: 1;
    text-align: left;
}

.section-1 .row .col-md-6 .panel h1 {
    font-weight: bold;
    padding: 21px 0;
    font-size: 52px;
    font-family: var(--roboto-mono);
}

.section-1 .row .col-md-6 .panel p {
    font-size: 21px;
    color: rgb(100, 100, 100);
}

/* section 1 end */

/* section 2 start*/

.cover {
    width: 100%;
    background-image: url(../assets/pexels-photo-636243.jpeg);
    /* padding: 99px 10px; */
    /* color: #ff0000; */
    background-size: 150%;
    background-position: -24rem -19rem;
    position: relative;
}

.cover .content {
    width: 100%;
    height: 100%;
    background: rgba(99, 99, 99, 0.24);
    /* padding-top: 250px; */
    padding: 100px 0;
}

.cover .content h1 {
    font-family: var(--rocknroll);
    font-size: 50px;
    color: #0054b4;
    font-weight: bold;
}

.cover .content p {
    font-family: var(--Rubik);
    font-size: 2vmin;
    color: #1900ff;
}

.numbers .rect {
    position: relative;
    z-index: 1;
    width: 15rem;
    height: 10rem;
    padding-top: 3.5vmin;
    margin: 1rem;
    border-radius: 0.5em;
    box-shadow: -1px 0px 20px 8px rgb(75 116 118);
    background: white;
}

.numbers {
    margin-top: -100px;
}

.numbers .rect h1 {
    color: tomato;
    font-size: 5rem;
}

.numbers .rect p {
    font-family: var(--lexend);
}

.purchase h1 {
    /* padding: 20px 0; */
    padding-top: 90px;
    /* padding-bottom: 20px; */
    font-family: var(--roboto-mono);
    color: rgb(255, 0, 0);
    font-weight: bold;
}

.purchase p {
    padding-bottom: 90px;
    color: var(--light-black);
    font-size: 20px;
}

.purchase .cards .card {
    width: 367px;
    margin: 0 40px;
}

.cards div {
    padding: 0;
    margin: 0;
}

.cards .title {
    background: rgb(0 255 207 / 7%);
    padding: 10px;
}

.card .card-text {
    padding: 37px 11px;
}

.card-body .pricing {
    background: rgb(0 255 207 / 7%);
    border-top-left-radius: 140px;
    border-top-right-radius: 140px;
}

.card-body .pricing h1 {
    padding: 53px 5px;
    font-size: 68px;
    font-family: var(--lexend);
    font-weight: bold;
    color: black;
}

/* section 2 end*/

/* section 3 start */
.section-3 {
    height: 394px;
    background: var(--bggradient);
    margin-top: 81px;
    /* overflow-x: hidden; */
}

.section-3 .col-md-12 h1 {
    padding: 73px 0 16px 0;
    color: whitesmoke;
    font-size: 50px;
}

.section-3 .col-md-12 p {
    padding: 0 4em 1em 4em;
    color: #dde1d8;
    font-size: 20px;
}

.section-3 .desktop {
    background: whitesmoke;
    display: inline-block;
    border-radius: 59px;
    padding: 3px 27px;
    margin: 1px;
    transition: all ease 0.3s;
    cursor: pointer;
}

.section-3 .desktop:hover {
    background: black;
    color: white;
}

.section-3 .desktop h1 {
    font-size: 20px;
}

.section-3 .desktop p {
    font-size: 17px;
    font-weight: bold;
}

/* section 3 end */

/* section 4 start */
.section-4 .container h1 {
    font-size: 50px;
    padding-top: 90px;
}

.section-4 .team {
    padding: 88px 33px;
}

.section-4 .card {
    width: 409px;
}

.section-4 .carousel-item {
    padding-left: 10px;
}

/* .card_tr {
    padding-top: 62px;
} */

/* .card_td {
    padding: 20px;
} */
.border-radius {
    width: 71%;
}

/* section 4 end */

/* footer start */

footer {
    background: rgb(0 0 0 / 82%);
    overflow-x: hidden;
    padding: 14vmin 18vmin;
}

footer p a {
    color: red;
}

footer input::placeholder {
    color: rgb(0, 81, 255) !important;
}

footer .input-group-text {
    background: var(--bggradient);
}

footer .column i {
    color: rgb(236, 9, 77);
}

footer .column i+i {
    padding: 0 0.3em;
}




/* footer end */