@import url('https://fonts.googleapis.com/css2?family=Alatsi&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Livvic:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,900&display=swap');

.main-container {
    float: left;
    width: 100%;
    overflow: hidden;
}

img {
    max-width: 100%;
}

body {
    font-family: "Livvic", sans-serif;
    font-weight: 500;
    background: url(../images/bg.jpg);
    background-attachment: fixed;
    background-size: cover;
}

.hdd {
    font-family: "Alatsi", serif;
    font-weight: 400;
}

ul {
    padding: 0;
    margin: 0;
}

li {
    list-style: none;
}

.top-head-section {
    padding: 0;
    background: linear-gradient(45deg, #723d51, #330f69);
    text-align: center;
    float: left;
    width: 100%;
}
.header
{
    float: left;
    width: 100%;
    padding: 10px 0px;
    background: #fff;
}
.top-head-left {
    position: relative;
    padding: 10px 10px 0px;
}

.top-head-left-1 {
    color: #ffffff;
    font-size: 20px;
    padding: 0 0 5px;
    text-transform: capitalize;
    text-align: center;
    font-weight: 500;
    display: inline-block;
}

.top-head-right {
    padding: 0;
    margin: 0 auto;
}

.top-head-right-1 a {
    font-size: 26px;
    color: #ffffff;
    text-align: center;
    background: #ffae00;
    padding: 4px 7px 5px;
    text-transform: uppercase;
    display: block;
}

.head-line-free {
    display: flex;
    background: #ffae00;
    float: left;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.head-line-free strong {
    display: inline-block;
    padding: 10px 10px;
    font-size: 25px;
    color: #000;
    animation: boun 0.4s infinite;
}

@keyframes boun {
    0% {
        transform: translateY(3px);
    }

    100% {
        transform: translateY(0);
    }
}

.top-line-section {
    float: left;
    width: 100%;
    padding: 10px 0px;
    text-align: center;
}

.top-line p {
    color: #000;
    line-height: 32px;
    text-align: center;
    font-size: 25px;
    text-transform: capitalize;
    font-weight: 700;
}

.top-line a {
    color: #ff0030;
}

.text-design {
    float: left;
    width: 100%;
    padding: 50px 0px;
}

.text-design1 {
    border: 1px solid #ffae00;
    padding: 0 15px;
    border-radius: 15px;
    box-shadow: 0 0 8px #ffae0080;
}

.right-img {
    padding: 20px;
}

.right-img img {
    width: 100%;
}

.whatsapp_icn {
    /* margin-top: -45px; */
    text-align: center;
    margin-top: 20px;
}

.whatsapp_icn a {
    display: block;
    font-size: 26px;
    font-weight: 600;
    text-transform: capitalize;
    color: #000000;
    padding: 4px 15px 4px;
    background: green;
    animation: blk 0.4s infinite ease-in-out;
    border-radius: 50px;
}

@keyframes blk {
    0% {
        color: #ffffff;
    }

    100% {
        color: #0f0;
    }
}

.about-love {
    text-align: left;
    padding: 12px 20px 25px;
    border-left: 1px solid #ffae00;
}

.about-love b {
    font-weight: 900;
    color: #000;
    padding: 0 0 4px;
    font-size: 32px;
    text-transform: capitalize;
    display: block;
    background: linear-gradient(0deg, #723d51, #330f69);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.about-love p {
    line-height: 30px;
    color: #434343;
    font-size: 17px;
    font-weight: 400;
    padding: 6px 0;
    text-align: justify;
}

.about-love p strong {
    font-weight: 500;
    color: #ff0030;
}

.line-free strong {
    color: #ffffff;
    font-size: 25px;
    font-weight: 600;
    line-height: 40px;
    display: inline-block;
    text-align: center;
    text-transform: capitalize;
    background: #330f69;
    padding: 4px 30px 4px;
    border-radius: 50px;
}

.list-design.text-start {
    float: left;
    width: 100%;
}

.heading-list strong {
    font-weight: 800;
    padding: 7px 15px 6px;
    text-align: center;
    font-size: 35px;
    text-transform: uppercase;
    display: block;
    color: #fff;
    background: #330f69;
}

.left-list1 {
    position: relative;
}

.left-list1 ul {
    padding: 10px 0;
    position: relative;
}

.left-list1 ul:before {
    background: #ff0030;
    content: "";
    position: absolute;
    margin: 4px 8px 0 0px;
    width: 2px;
    height: 100%;
    left: 37px;
    top: -3px;
}

.left-list1 ul li {
    font-weight: 500;
    position: relative;
    text-transform: capitalize;
    border-radius: 50px;
    border: 1px solid #ffffff2b;
    display: flex;
    align-items: center;
}

.left-list1 ul li i {
    color: #fff;
    font-size: 19px;
    margin: 0 15px 0;
    font-weight: 500;
    background: #ff0030;
    border-radius: 50px;
    display: inline-block;
    text-align: center;
    width: 50px;
    height: 43px;
    line-height: 44px;
}

.left-list1 ul li span {
    color: #000;
    font-size: 17px;
    margin: 14px 0;
    padding: 9px 15px;
    font-weight: 600;
    position: relative;
    background: #ffffff;
    text-transform: capitalize;
    border: 1px solid #ffae00;
    display: block;
    width: 100%;
}

.best-services {
    float: left;
    width: 100%;
    padding: 50px 0px;
}

.about-title {
    padding: 0 0 15px;
    text-align: center;
}

.about-title span {
    text-transform: capitalize;
    font-size: 17px;
    font-weight: 500;
    display: inline-block;
    color: #ffffff;
    padding: 4px 15px 4px;
    border-radius: 50px;
    background: #ffae00;
}

.about-title strong {
    font-weight: 900;
    color: #000;
    font-size: 55px;
    text-transform: capitalize;
    display: block;
    background: linear-gradient(0deg, #723d51, #330f69);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: -7px 0 0;
    position: relative;
}

.best-services1 {
    padding: 10px 15px;
    text-align: center;
}

.best-services2 {
    padding: 0 0 20px;
    border: 1px solid #ffae00;
}

.best-services3 {
    padding: 0 15px;
}

.best-services3 img {
    width: 100%;
    border-radius: 0 0 500px 500px;
    border: 5px solid #ffae00;
    border-top: 0;
}

.best-services4 strong {
    font-size: 20px;
    font-weight: 700;
    text-transform: capitalize;
    display: block;
    color: #330f69;
    padding: 18px 15px 0;
    line-height: 26px;
}

.best-services4 p {
    padding: 10px 15px 10px;
    line-height: 30px;
    color: #434343;
    font-size: 17px;
    font-weight: 400;
}

.best-services5 a {
  color: #131313;
  font-weight: 700;
  font-size: 20px;
  display: block;
  text-transform: capitalize;
  background-color: orange;
  padding: 10px;
}

.footer {
    background: #330f69;
    float: left;
    width: 100%;
    padding-bottom: 50px;
}

.banner-add p {
    background: #ffae00;
    font-size: 25px;
    color: #ffffff;
    padding: 15px 15px 0;
    text-align: center;
    line-height: 38px;
    text-transform: uppercase;
}

.copy-right p {
    color: #ffffffde;
    font-size: 15px;
    line-height: 25px;
    display: block;
    font-weight: 100;
    padding: 30px 0 10px;
    border-top: 1px solid #ffffff12;
}

.copy-right span {
    font-size: 20px;
    font-weight: 600;
    color: #ffae00;
}

.footer-contact1 {
    padding: 15px;
}

.footer-about-head {
    display: block;
    color: #ffffff;
    padding: 5px 0 5px;
    font-size: 32px;
    text-transform: uppercase;
    font-weight: 800;
    border-bottom: 1px solid #ffffff12;
}

.footer-contact1 p {
    color: #ffffff;
    padding: 10px 0 25px;
    font-size: 17px;
    font-weight: 100;
    line-height: 30px;
}

.footer-line {
    display: block;
    color: #ffffff;
    padding: 0;
    font-size: 20px;
    font-weight: 500;
    position: relative;
    z-index: 0;
    line-height: 33px;
}

.footer-line:before {
    background: #ffae00;
    content: "";
    position: absolute;
    width: 30%;
    height: 100%;
    left: -237px;
    top: 0;
    z-index: -1;
    /* clip-path: polygon(0 0, 100% 0%, 94% 100%, 0% 100%); */
}

.footer-contact3 {
    padding: 15px 15px 15px 35px;
}

.footer-list ul li {
    font-weight: 100;
    position: relative;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    margin: 0 0 15px;
    padding: 7px 15px;
    color: #fff;
    border: 1px solid #ffffff12;
    border-radius: 50px;
    font-size: 16px;
}

.footer-list ul li i {
    color: #ffae00;
    font-size: 22px;
    display: inline-block;
    padding: 0 11px 0 0;
}

.footer-contact1 {
    padding: 15px;
}

.footer-contact2 {
    padding: 23px 0 0;
    text-align: center;
}

.footer-contact2 span {
    height: 100px;
    width: 100px;
    color: #ff0030;
    line-height: 100px;
    border-radius: 60%;
    background: #ffffff;
    text-align: center;
    display: block;
    margin: 0 auto;
    animation: pulse2 2s linear infinite;
    box-shadow: 0 0 0 8px #ffae00;
    font-size: 49px !important;
    padding: 0 !important;
}

.footer-contact2 span i {
    font-weight: 500;
}

.footer-contact2 a {
    display: block;
    padding: 22px 0 0;
    font-size: 24px;
    font-weight: 600;
    color: #ffffff;
}

.services-section {
    float: left;
    width: 100%;
    padding: 50px 0px;
}

.services-section1 {
    padding: 0px;
}

.topservices-head {
    padding: 0;
    text-align: center;
}

.topservices-head strong {
    margin: 0;
    font-size: 51px;
    text-transform: capitalize;
    padding: 0;
    font-family: 'Kanit', sans-serif;
    font-weight: 700;
    color: #ff0030;
}

.topservices-head p {
    color: #4b4b4b;
    font-size: 20px;
    text-transform: capitalize;
    font-weight: 600;
    margin: -7px 0 0 0;
}

.services {
    padding: 30px 0 0;
}

.services1 {
    padding: 10px;
}

.services2 {
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.services3 {
    padding: 0px;
    clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
    border: 1px solid;
}

.services4 {
    padding: 0px 0px 0px 20px;
    text-align: left;
    text-align: center;
}

.services4 strong {
    text-align: center;
    padding: 10px 0px 0;
    font-size: 29px;
    font-family: 'Kanit';
    color: #ff0030;
}

.services4 p {
    padding: 0px 0 10px 0;
    font-size: 15px;
    margin: 0;
    color: #222;
    line-height: 30px;
}

.services4 a {
    background: #ffae00;
    border-radius: 23px;
    padding: 5px 18px;
    text-decoration: none;
    color: #000000;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
}

.testimonials-section {
    float: left;
    width: 100%;
    padding: 50px 0px;
}

.testimonials-section1 {
    padding: 0px;
}

.topservices-head {
    padding: 0;
    text-align: center;
}

.topservices-head strong {
    margin: 0;
    font-size: 51px;
    text-transform: capitalize;
    padding: 0;
    color: #ff0030;
    font-weight: 700;
}

.topservices-head p {
    color: #4b4b4b;
    font-size: 20px;
    text-transform: capitalize;
    font-weight: 600;
    margin: -7px 0 0 0;
}

.testimonials {
    padding: 0px 0 0 0;
}

.testimonials-1 {
    padding: 10px;
}

.testimonials-2 {
    padding: 0;
    padding: 37px 43px 26px;
    background: #fff;
    margin-top: 20px;
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 10%);
    text-align: left;
}

.testimonials-3 {
    padding: 0 0 11px;
    text-align: left;
    border-bottom: 1px solid #ffe49c;
}

.testimonials-3 p {
    color: #000;
    font-size: 15px;
    line-height: 30px;
    font-weight: 400;
    margin: 0;
    padding: 14px 0 0 0;
}

.testimonials-4 {
    padding: 14px 0 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.testi-img {
    width: 25%;
}

.testi-img img {
    border-radius: 50%;
    height: 70px;
}

.testi-text {
    width: 75%;
    padding: 0 0px 0 9px;
}

.testi-text p {
    font-size: 22px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
    color: #330f69;
}

.testi-text p span {
    color: #828282;
    font-size: 18px;
    margin: 0;
    display: block;
    font-weight: 500;
    text-transform: capitalize;
    padding: 0;
}


.counter {
    float: left;
    width: 100%;
}

.counter-box {
    padding: 15px 20px 0;
    border-radius: 12px;
    margin: 25px 0 0;
     background: linear-gradient(45deg, #723d51, #330f69);
}

.counter-1 {
    padding: 0 5px;
}

.counter-2 {
    padding: 0;
    text-align: center;
}

.counter-count {
    color: #ffffff;
    font-size: 53px;
    font-weight: 600;
    text-transform: capitalize;
    padding: 15px 0px 15px;
}

.count-up span {
    color: #ff0030;
    font-size: 20px;
    font-weight: 700;
    text-transform: capitalize;
    background: white;
    border-radius: 20px 20px 0 0;
    padding: 5px 14px 4px;
    display: inline-block;
    position: relative;
    margin: 31px 0 0;
}

.count-up span:before {
    content: "";
    font-size: 17px;
    text-align: center;
    padding: 5px 10px 0 0px;
    position: absolute;
    background: white;
    width: 100%;
    height: 5px;
    left: 0;
    margin: 0 auto;
    right: 0;
    top: -44px;
    z-index: 0;
}

.count-up span:after {
    content: "";
    font-size: 17px;
    text-align: center;
    position: absolute;
    background: white;
    width: 6px;
    height: 42px;
    left: 0;
    margin: 0 auto;
    right: 0;
    top: -39px;
    z-index: 0;
}

@media(min-width:992px) and (max-width:1200px){
}
@media(min-width:768px) and (max-width:991px){
    .header .col-sm-4{width: 100%;text-align: center;}
    .top-head-section .col-sm-3{width: 50%;}
    .top-head-section .col-sm-9{width: 100%;}
    .best-services .col-sm-4{width: 50%;}
    .counter .col-sm-3{width: 50%;}
    .services-section .col-sm-6{width: 100%;}
    .testimonials-section .col-sm-4{width: 50%;}
}
@media(min-width:640px) and (max-width:767px){
}
@media(min-width:480px) and (max-width:639px)
{
}
@media(min-width:320px) and (max-width:479px)
{.services2 {
    display: block;
  }
  .services3 {
    margin-top: 20px;
  }
}