.nunito-sans-<uniquifier> {
    font-family: "Nunito Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: <weight>;
    font-style: normal;
    font-variation-settings:
      "wdth" 100,
      "YTLC" 500;
  }

body{
    background-color: #0B0F10;
    /* font-family: Nunito Sans; */
    color: #fff;
}
ul{
    padding: 0 !important;
}
li{
    list-style-type: none;
}
a{
    text-decoration: none;
}
h1{
    font-size: 48px;
    color: #fdb23e;
    font-weight: 700;
}
.banner{
    padding: 40px 0 190px 0;
    position: relative;
}
.banner::before{
    content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 1;
        background: url(images/banner-img.jpeg) no-repeat center right;
        z-index: -1;     
}
.banner p{
    color: #fff;
    font-size: 19px;
}
h2{
    font-size: 30px;
    font-weight: 700;
}
.row-2{
    margin-top: -125px;
}
.row-2 .col_1 img, .row-4 .col_1 img{
    margin-right: 12px;
}
.row-inner{
    padding: 16px 0;
    border: 1px solid #1b1b1b;
    border-radius: 12px;
    backdrop-filter: blur(4px);
}
.ratings{
    margin-left: 16px;
}
.star-rating {
    margin: 0;
    padding: 0;
    position: relative;
    font-size: 18px;
    display: inline-block;
    margin-bottom: 8px;
}
.star-rating .empty-rating {
    --tw-text-opacity: 1;
    color: rgb(80 84 109 / var(--tw-text-opacity));
    display: block;
    padding: 0;
    z-index: 0;
}
.star-rating .fill-rating {
    display: block;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 1;
}

.star-rating .fill-rating span {
    --tw-text-opacity: 1;
    color: rgb(253 178 62 / var(--tw-text-opacity));
    display: inline-block;
}
.ratings .text-base{
    font-size: 16px;
}
.ratings h3{
    font-size: 18px;
    font-weight: 700;
}
.bdr-right{
    border-right: 1px solid #1b1b1b;
}
.row-inner li:not(:nth-child(3)){
    margin-bottom: 16px;
}
.row-inner li, .row4-inner li{
    font-size: 14px;
}
.row-inner ul{
    padding-left: 15px;
}
.row-inner ul li img, .row4-inner ul li img{
    margin-right: 8px;
    margin-bottom:1px ;
}
.row-inner .cus-btn, .row4-inner .cus-btn{
    font-size: 16px;
    font-weight: 800;
    text-align: center;
    border-radius: 6px;
    padding: 16px;
    /* width: 100%; */
    color: #000;
    background-color: #fdb23e;
    box-shadow: 0 10px 15px -3px #fdb23e4d, 0 4px 6px -4px #fdb23e80;
    transition: all linear 0.1s;
    display: inline-block;
}
.row-inner .cus-btn:hover, .row4-inner .cus-btn:hover{
    color: #fff;
}
.payment-col{
    padding: 0 24px;
}
.payments{
    margin-top: 16px;
}
.row-inner .link, .row4-inner .link{
    display: inline-block;
    color: #fff;
}
.row-3{
    margin-top: 96px;
}
.row-3 h2{
    font-size: 24px;
}
.row-4{
    padding: 128px 0;
    margin: 64px 0;
}
.row4-inner{
    padding: 32px;
    background: #000;
    border-radius: 12px;
}
.row4-inner h3{
    font-size: 30px;
}
.row4-inner .text-base{
    font-size: 20px;
}
.row4-inner li:not(:nth-child(3)){
    margin-bottom: 24px;
}
 .bottom-row{
    margin: 128px 0;
 }
 .bottom-row h2{
    font-size: 36px;
 }
 .bottom-row .text-col{
    padding: 0 100px;
 }
 .bottom-row .text-col .para{
    margin-right: 100px;
 }
 .bottom-row .text-col p{
    font-size: 16px;
 }
 .footer p{
    font-size: 12px;
    padding: 24px 0;
 }
/* -----------------responsive--------------------------- */
@media screen and (max-width:768px) {
    .banner::before{
        opacity: 0.1;
    }
    h1{
        font-size: 30px;
    }
    h2{
        font-size: 18px;
    }
    .banner p{
        font-size: 17px;
    }
    .row-inner ul, .row4-inner ul{
        margin: 20px 0;
    }
    .bottom-row h2{
        font-size: 30px;
    }
    .bottom-row .text-col{
        padding: 0;
    }
    .bottom-row .text-col .para{
        margin-right: 30px;
    }
    .row-4 {
        padding: 48px 0;
    }
}
@media screen and (max-width:575px) {
    .row4-inner{
        padding: 14px;
    }
    .row4-inner .cus-btn{
        width: 100%;
    }
    .row4-inner .payments{
        margin-top: 16px !important;
    }
    .row4-inner h3{
        font-size: 18px;
    }
    .row4-inner .text-base{
        font-size: 12px;
    }
    .star-rating{
        font-size: 12px;
    }
    .row4-inner a>div{
        width: 50% !important;
        height: 120px !important;
    }
    .row4-inner li:not(:nth-child(3)){
        margin-bottom: 14px;
    }
    .bottom-row{
        padding: 0 24px;
        margin: 48px 0;
    }
    .res{
        flex-direction: column-reverse;
    }
}