/*--------------------
Default Style
-----------------*/

/*-----------------
font-family: 'Mulish', sans-serif;
font-family: 'Quicksand', sans-serif;
-----------------*/

* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

body {
    color: #000000;
    background-color: #ffffff;
    font-family: 'Mulish', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.3;
}

a,
a:hover {
    text-decoration: none;
}

img {
    max-width: 100%;
    height: auto;
    border: 0px;
}

.container {
    max-width: 1220px;
    width: calc(100% - 40px);
    margin-left: auto;
    margin-right: auto;
    padding: 0 !important;
}

h1,
h2,
p,
li {
    font-size: 16px;
    max-width: inherit;
}

/*----------------
Header Section
-----------------*/

.header__wrapper {
    background: #ffffff;
    box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.25);
    padding: 18px 30px;
    width: 100%;
    border-radius: 0px;
}

.header__wrapper .container {
    width: 100%;
    max-width: 100%;
}

.header__wrapper .group__box {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.navbar__box__wrap .nav__links ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 50px;
}

.nav__links ul li a {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.3;
    text-align: center;
    color: #000000;
    text-transform: capitalize;
    transition: all ease 300ms;
}

.nav__links ul li a:hover {
    color: rgba(241, 86, 78, 1);
}

.header__wrapper .nav__btn__box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.nav__btn__box .nav__btn {
    display: inline-block;
}

.nav__btn__box .nav__btn a {
    display: block;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.3;
    text-align: center;
    text-transform: capitalize;
    padding: 8.5px 30px;
    color: #ffffff;
    border-radius: 100px;
}

.nav__btn__box .nav__btn.purple__btn a {
    background-color: rgba(168, 92, 164, 1);
}

.nav__btn__box .nav__btn.green__btn a {
    background-color: #4ABA78;
}


.nav__btn__box .nav__btn.green__btn a:hover {
    background-color: #A5DDBC;
    color: #4ABA78;
}

.nav__btn__box .nav__btn.blue__btn a {
    background-color: #06B4DF;
}

.nav__btn__box .nav__btn.blue__btn a:hover {
    background-color: #83DAEF;
    color: #06B4DF;
}

.nav__btn__box .nav__btn.purple__btn a:hover {
    background-color: #D3AED2;
    color: #A85CA4
}

.nav__btn__box .nav__btn.yellow__btn a {
    background-color: #FABE49;
}

.nav__btn__box .nav__btn.yellow__btn a:hover {
    background-color: #FDDFA4;
    color: #FABE49
}


/*-----------------
Hero Section
------------------*/

.hero__section__box {
    height: calc(100vh - 85px);
    position: relative;
    overflow: hidden;
}

.hero__section__box .hero__content__box .hero__inner__content__box {
    max-width: 500px;
    margin: auto 0px auto auto;
}

.hero__section__box::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    background: linear-gradient(90deg, #F1574D 0.59%, #F47732 16.75%, #F9BF4A 33.96%, rgba(172, 189, 95, 0.735585) 44.91%, rgba(75, 186, 121, 0.4) 59.51%, rgba(13, 180, 223, 0.3) 72.17%, rgba(168, 92, 164, 0.3) 94.76%);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.hero__section__box::after {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 89.47%);
    height: 190px;
    display: block;
    z-index: 2;
}

.hero__section__box .group__both {
    grid-template-columns: 44% 66%;
    display: grid;
    align-items: center;
}

.hero__section__box .hero__img__box {

    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
    position: relative;
}


.hero__section__box .hero__img__box::after {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
}

.hero__section__box .hero__content__box {
    position: relative;
    z-index: 3;
}

.hero__section__box .hero__content__box h1.title {
    font-style: normal;
    font-weight: 700;
    font-size: 55px;
    line-height: 44px;
    color: #ffffff;
    font-family: 'Quicksand', sans-serif;
    margin-bottom: 30px;
}

.hero__section__box .hero__content__box .hero__text__box {
    font-style: normal;
    font-weight: 600;
    font-size: 25px;
    line-height: 1.15;
    color: rgba(255, 255, 255, 1);
    margin-bottom: 30px;
}

.learn__btn {
    display: inline-block;
}

.learn__btn a {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    text-align: center;
    color: rgba(255, 255, 255, 1);
    background-color: #06b4df;
    border-radius: 100px;
    text-transform: capitalize;
    padding: 15px 30px;
    transition: all ease 300ms;
    display: block;
}

.learn__btn a:hover {
    background-image: linear-gradient(90deg, #06B4DF 22.04%, #A85CA4 80%);
    transition: all ease 300ms;
    color: #ffffff;
}

/*-----------------
Collaboration Section
------------------*/

.collaboration__section__box {
    text-align: center;
    padding: 32px 20px 55px;
}

.collaboration__section__box h2.title {
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 155.5%;
    color: rgba(184, 184, 184, 1);
    margin-bottom: 42px;
}

.collaboration__section__box .logo__group__box {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.collaboration__section__box .logo__box {
    line-height: 0px;
}

/*-----------------
Activity Section
------------------*/

.activity__section__box .feature__box__wrapper::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.activity__section__box .feature__box__wrapper.feature__box1::before {
    background: linear-gradient(90deg, rgba(241, 86, 78, 0) 0.59%, #F1564E 64.04%, #F47730 100.71%);
}

.activity__section__box .feature__box__wrapper.feature__box2::before {
    background: linear-gradient(270deg, #FABE49 0%, #4ABA78 34.27%, rgba(74, 186, 120, 0) 100%);
    transform: matrix(-1, 0, 0, 1, 0, 0);
}

.activity__section__box .feature__box__wrapper.feature__box3::before {
    background: linear-gradient(90deg, rgba(6, 180, 223, 0) 0.59%, #06B4DF 64.04%, #A85CA4 100.71%);
}

.activity__section__box .feature__box__wrapper {
    position: relative;
}

.feature__box__wrapper .group__both {
    grid-template-columns: 50% 50%;
    display: grid;
    align-items: center;
}

.feature__box__wrapper .feature__img__box {
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 600px;
    position: relative;
}

.feature__box__wrapper .feature__img__box::before {
    content: "";
    background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 21.19%);
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0px;
    top: 0px;
    z-index: 1;
}

.feature__box__wrapper .feature__content__box .feature__inner__content__box {
    max-width: 435px;
    z-index: 3;
    position: relative;
}

.feature__box__wrapper .feature__content__box {
    padding-left: 83px;
}

.feature__box__wrapper .feature__content__box h3.title {
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 1;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 1);
    font-family: 'Quicksand', sans-serif;
}

.feature__content__box .feature__text__box {
    font-style: normal;
    font-weight: 400;
    font-size: 25px;
    line-height: 1.3;
    color: rgba(0, 0, 0, 1);
}

/*---------------
Feature BOX (odd - even) Style
-------------*/

.activity__section__box .feature__box__wrapper:nth-child(odd) .feature__img__box {
    order: 0;
}

.activity__section__box .feature__box__wrapper:nth-child(even) .feature__img__box {
    order: 1;
}

.activity__section__box .feature__box__wrapper:nth-child(even) .feature__img__box::before {
    background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 19.63%);
    transform: matrix(-1, 0, 0, 1, 0, 0);
}

.activity__section__box .feature__box__wrapper:nth-child(odd) .feature__img__box::before {
    background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 21.19%);
}

.activity__section__box .feature__box__wrapper:nth-child(even) .feature__content__box .feature__inner__content__box {
    margin: auto 0px auto auto;
}


/*------------------------
 highlighted Section
--------------------*/

.highlighted__section__box {
    text-align: center;
    padding: 198px 20px;
}

h4.long__title {
    font-style: normal;
    font-weight: 700;
    font-size: 100px;
    line-height: 1.04;
    font-family: 'Quicksand', sans-serif;
    text-align: center;
}


.red__text {
    color: rgba(241, 86, 78, 1);
}

.orange__text {
    color: rgba(244, 119, 48, 1);
}

.black__text {
    color: rgb(0, 0, 0);
}

.yellow__text {
    color: rgba(250, 190, 73, 1);
}

.green__text {
    color: rgba(74, 186, 120, 1);
}

.sky__text {
    color: rgba(6, 180, 223, 1);
}

.purple__text {
    color: rgba(168, 92, 164, 1);
}


/*---------------
Panel Slides
----------------*/

/*--------
Verticle Slides
----------*/

.panel {
    position: absolute;
}

#container {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.panel.description {
    position: relative;
}

/*--------
Verticle Slides
----------*/

.panel {
    padding: 128px 20px;
    text-align: left;
}

.panel__content__box h3.title {
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 1);
    margin-bottom: 30px;
}

.panel__content__box .panel__description {
    font-style: normal;
    font-weight: 400;
    font-size: 25px;
    margin-bottom: 30px;
    line-height: 1.3;
}

.panel .panel__cover__box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    max-width: 1220px;
    margin: 0px auto;
}

#section-slides {
    height: 100%;
    width: 100%;
    background-image: none;
}

.orange__section {
    background-color: rgba(253, 223, 164, 1);
}

.purple__section {
    background-color: rgba(211, 174, 210, 1);
}

.green__section {
    background-color: rgba(165, 221, 188, 1);
}

.panel .panel__content__box {
    width: 600px;
    padding-right: 60px;
}

.panel__img__box {
    width: 585px;
    height: 585px;
}

.explore__btn {
    display: inline-block;
}

.explore__btn a {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 25px;
    color: rgba(255, 255, 255, 1);
    text-align: center;
    display: block;
    padding: 12px 30px;
    background-color: #06b4df;
    border-radius: 100px;
    transition: all ease 300ms;
}

.explore__btn a:hover {
    background-image: linear-gradient(90deg, #06B4DF 22.04%, #A85CA4 80%);
    transition: all ease 300ms;
    color: #ffffff;
}

/*---------------------
Model Slider Section
-------------------*/

.models__slider__section {
    padding: 100px 0px;
    text-align: center;
    background-color: rgba(74, 186, 120, 1);
}

.title__box__wrapper h3.title {
    font-family: 'Quicksand';
    font-style: normal;
    font-weight: 700;
    font-size: 55px;
    line-height: 65px;
    color: rgba(255, 255, 255, 1);
    margin-bottom: 30px;
}

.title__box__wrapper .view__all__btn {
    display: inline-block;
}

.title__box__wrapper .view__all__btn a {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 25px;
    color: rgba(255, 255, 255, 1);
    text-align: center;
    display: block;
    padding: 12px 30px;
    background-color: #06b4df;
    border-radius: 100px;
    transition: all ease 300ms;
}

.title__box__wrapper .view__all__btn a:hover {
    background-image: linear-gradient(90deg, #06B4DF 22.04%, #A85CA4 80%);
    transition: all ease 300ms;
    color: #ffffff;
}

.title__box__wrapper h3.title span {
    color: rgba(165, 221, 188, 1);
}

.models__slider__section .title__box__wrapper {
    margin-bottom: 30px;
}

.model__slider__box .item__box,
.model__slider__box .item__box img {
    max-width: 280px;
    line-height: 0px;
    border-radius: 10px;
}

.model__slider__box .item__box {
    margin: 0px 10px;
}

.models__slider__section .model__slider__box .item__box:nth-child(odd) {
    margin-top: 75px;
}


/*---------------------
FAQ Section
-------------------*/

.faq__section__wrapper .border__line {
    line-height: 0px;
    margin-bottom: 30px;
}

.faq__section__wrapper {
    padding: 100px 20px;
    text-align: center;
}

.faq__section__wrapper h4.title {
    font-style: normal;
    font-weight: 500;
    font-size: 45px;
    line-height: 56px;
    color: rgba(0, 0, 0, 1);
    text-transform: capitalize;
    font-family: 'Quicksand', sans-serif;
    margin-bottom: 40px;
}

.faq__section__wrapper .accordion-item+.accordion-item {
    margin-top: 20px;
}

.accordion .accordion-item {
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
    border-radius: 100px;
    padding: 24px 50px;
}

.accordion .accordion-item :active{
    border-radius: 10px
}


.accordion button {
    position: relative;
    display: block;
    text-align: left;
    width: 100%;
    border: none;
    background: none;
    outline: none;
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 30px;
    font-family: 'Mulish', sans-serif;
    transition: all ease 300ms;
}

.accordion button:hover,
.accordion button:focus {
    cursor: pointer;
    
}

.accordion button:hover::after,
.accordion button:focus::after {
    cursor: pointer;

}



.accordion button .icon {
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 0px;
    width: 18px;
    height: 18px;
    transform: translate(0px, -50%);
}

.accordion button .icon::before {
    display: block;
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    width: 100%;
    height: 3px;
    background: rgba(6, 180, 223, 1);
    border-radius: 20px;
    transform: translate(-50%, -50%);
}

.accordion button .icon::after {
    display: block;
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    width: 3px;
    height: 100%;
    background: rgba(6, 180, 223, 1);
    border-radius: 20px;
    transform: translate(-50%, -50%);
}

.accordion button[aria-expanded='true'] {
    margin-bottom: 15px;
}

.accordion button[aria-expanded='true'] .icon::after {
    width: 0;
}

.accordion button[aria-expanded='true']+.accordion-content {
    opacity: 1;
    max-height: 25em;
    transition: all 200ms linear;
    will-change: opacity, max-height;
    
}

.accordion .accordion-content {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 200ms linear, max-height 200ms linear;
    will-change: opacity, max-height;
    text-align: left;

}

.accordion .accordion-content p {
    max-height:200;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.3;
    font-family: 'Mulish', sans-serif;
}




/*------------------
Stay Connected Section
-----------------*/


.stay__connected__wrapper {
    background-color: rgba(6, 180, 223, 1);
    padding: 128px 20px 122px;
}

.stay__connected__wrapper .group__box {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.stay__connected__wrapper .stay__connected__img__box {
    width: 510px;
    line-height: 0px;
}

.stay__connected__wrapper .stay__connected__box {
    width: 615px;
}

.stay__connected__wrapper .stay__connected__box h6.title {
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 50px;
    color: rgba(255, 255, 255, 1);
    margin-bottom: 30px;
}

.stay__connected__wrapper .stay__connected__box .short__note {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 23px;
    color: rgba(255, 255, 255, 1);
}

.stay__connected__wrapper .stay__connected__box .subscription__submit__box {
    margin-top: 30px;
}

.stay__connected__wrapper .stay__connected__box button.submit__btn {
    background-color: rgba(250, 190, 73, 1);
    min-width: 127px;
    text-align: center;
}

.stay__connected__wrapper .stay__connected__box button.submit__btn:hover {
    background-image: linear-gradient(90deg, #FABE49 22.04%, #4ABA78 80%);
    transition: all ease 300ms;
    color: #ffffff;
}

.rainbow__border {
    line-height: 0px;
}

.rainbow__border img {
    width: 100%;
}

/*------------------
Footer Section
-----------------*/

.footer__section__box {
    background-color: rgba(245, 245, 245, 1);
    padding: 50px 20px 0px 20px;
}

.footer__section__box .footer__up__box {
    padding-bottom: 50px;
    border-bottom: 1px solid rgba(184, 184, 184, 1);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer__up__box .footer__logo__box {
    max-width: 300px;
    line-height: 0px;
}

.subscription__box .short__note {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.4;
    color: #000000;
    margin-bottom: 20px;
}

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

.subscription__submit__box .email__field__box input {
    border: 1px solid rgba(184, 184, 184, 1);
    border-radius: 100px;
    padding: 13px 30px;
    display: block;
    width: 100%;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    color: #000000;
    height: 50px;
}

.subscription__submit__box .email__field__box input::placeholder {
    font-family: 'Mulish', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 23px;
    color: rgba(184, 184, 184, 1);
}

button.submit__btn {
    font-family: 'Mulish', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 1.3;
    text-align: center;
    color: rgba(255, 255, 255, 1);
    background: rgba(6, 180, 223, 1);
    border-radius: 100px;
    padding: 12px 20px;
    text-transform: capitalize;
    border: 0px;
    outline: none;
    cursor: pointer;
    transition: all ease 300ms;
}

button.submit__btn:hover {
    background-image: linear-gradient(90deg, #06B4DF 22.04%, #A85CA4 80%);
    transition: all ease 300ms;
    color: #ffffff;
}

.subscription__box {
    max-width: 610px;
}

.subscription__submit__box {
    width: 100%;
}

.subscription__submit__box .email__field__box {
    width: calc(100% - 127px);
}

label.footer__title {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    color: rgba(0, 0, 0, 1);
    display: block;
    text-transform: capitalize;
    margin-bottom: 28px;
    font-family: 'Quicksand', sans-serif;
}

.footer__links ul li a {
    font-style: normal;
    font-family: 'Mulish', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1;
    color: rgba(0, 0, 0, 1);
    text-transform: capitalize;
    transition: all ease 300ms;
    display: block;
}

.footer__links ul li a:hover {
    color: #f1564e;
}

.footer__links ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer__section__box .container {
    max-width: 1720px;
}

.footer__section__box .footer__up__box .footer__link__box {
    width: 131px;
}

.footer__nsf__wrap .nsf__logo__wrap {
    line-height: 0px;
    width: 100px;
    height: 100px;
}

.footer__nsf__wrap .group__box__wrap {
    display: flex;
    align-items: center;
    gap: 29px;
    justify-content: center;
    width: 1200px;
    margin: 0px auto;
}

.footer__section__box .footer__nsf__wrap {
    padding: 30px;
}

.footer__nsf__wrap .nsf__footer__description h6.title {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.3;
    color: rgba(0, 0, 0, 1);
    margin-bottom: 10px;
}

.footer__nsf__wrap .nsf__footer__description .nsf__shortnote {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 23px;
    color: rgba(0, 0, 0, 1);
}

.footer__section__box .copyright__box__wrap {
    display: grid;
    align-items: center;
    grid-template-columns: 50% 50%;
    padding: 0px 30px;
    margin: 0px 30px;
    border-top: 1px solid #B8B8B8;
}

.footer__section__box .copyright__box__wrap .copyright__text {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 45px;
    color: rgba(0, 0, 0, 1);
    display: block;
}

.footer__copyright__link ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
    display: flex;
    align-items: center;
    gap: 30px;
}

.footer__copyright__link ul li a {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 133.5%;
    color: rgba(0, 0, 0, 1);
    text-transform: capitalize;
    transition: all ease 300ms;
}

.footer__copyright__link ul li a:hover {
    color: #f1564e;
}

.rlms__logo__box {
    display: flex;
    align-items: center;
    gap: 10px;
}

.rlms__logo__box a img {
    width: 60px;
}