html[data-theme='thirdcolor']{
    --red:    #FF5532;
   --denim:   #085487;
   --white:   #ffffff;
   --aegean:  #2B77AA;
   --Daegean: #002548;
   --black:   #000000;
   --Dblack:  #0A0F33;
   --gray:    #767676;
   --Dgray1:  #212B36;
   --backdrop:#1B1B1B33;
   --blush:   #E83B691A;
   --salmon:  #FFF9E6;
   --sky:     #EBFAFA;
   --olive:   #F7FAEA;
   --Lgray:   #F2F2F2;
   --Lgray2:  #D8DFE7;
   --Lgray3:  #E9EBEF;
   --Lgray4:  #FAFBFC;
   --Lgray5:  #F4F6F8;
   --Lgray6:  #F1F3F4;
   --shadow:  #0032601A;
   --lemon:   #FECC051A;
   --Lpink:   #E83B691A;
   --filpink: #FEF5F7;
   --Dgray:   #707070;
   --Dlemon:  #FFC907;
   --Dsky:    #36CCCC;
   --Dolive:  #B2D235;
   --blue:    #0000FF;
   --Dblue:   #4267B2;
   --Lblue:   #1DA1F2;
   --yellow:  #FFFF00;
   --border:  #FFFFFF80;
   --brown:   #C2B59B;
   --Dgray2:  #637381;
   --white_back: #ffffff;
   --lbtn:     #F9F9F9;
   --awhite:   #ffffff;
   --ablack:   #000000;
   --D2black:  #1B1B1B;
   --search-shadow: #00326017;
   --wpink:    #E83B69;
   --wshadow: #ffffff;
   --bshadow: #ffffff;
   --lineLgray:#F1F3F6;
   --appDgray2:  #637381;
   --borderLgray3:  #E9EBEF;
   --baegean:  #003260;
   --Lbgray3:  #E9EBEF;
   --ablack-content:   #000000;  
   --insta1: #405DE6;
   --insta2: #833AB4;
   --insta3: #E1306C;
   --insta4: #FD1D1D;
   --insta5: #FCAF45;
}


html[data-font='medium']
{
   --font16: 16px;
   --font18: 18px;
   --font19: 19px;
   --font50: 50px;
   --font30: 30px;
   --font33: 33px;
   --font35: 35px;
   --font22: 22px;
   --font26: 26px;
   --font20: 20px;
   --font24: 24px;
   --font15: 15px;
   --font10: 10px;
   --font12: 12px;
   --font13: 13px;
   --font14: 14px;
   --font17: 17px;
   
}
:root
{
    --swiper-navigation-size: 102px;
    --swiper-theme-color: #FF5532;
    --swiper-navigation-sides-offset:76px;
}
@font-face
{
    font-family: 'Changa-Bold';
    src: url("../../fonts/changa/Changa-Bold.ttf");
}

@font-face
{
    font-family: 'Changa-Medium';
    src: url("../../fonts/changa/Changa-Medium.ttf");
}

@font-face
{
    font-family: 'Changa-Regular';
    src: url("../../fonts/changa/Changa-Regular.ttf");
}


@font-face
{
    font-family: 'Helvetica';
    src: url("../../fonts/other/Helvetica.ttf");
}

@font-face
{
    font-family: 'FuturaPTBold';
    src: url("../../fonts/other/FuturaPTBold.otf");
}
@font-face
{
    font-family: 'FuturaPTBook';
    src: url("../../fonts/other/FuturaPTBook.otf");
}
@font-face
{
    font-family: 'HelveticaNeueLTPro-ThEx';
    src: url("../../fonts/other/HelveticaNeueLTPro-ThEx.otf");
}

@font-face
{
    font-family: 'Myriad_Pro_Bold';
    src: url("../../fonts/other/Myriad Pro Bold.ttf");
}
@font-face
{
    font-family: 'MyriadPro-Regular_0';
    src: url("../../fonts/other/MyriadPro-Regular_0.otf");
}
@font-face
{
    font-family: 'NeutralFace-Bold';
    src: url("../../fonts/other/NeutralFace-Bold.otf");
}
@font-face
{
    font-family: 'NeutralFace';
    src: url("../../fonts/other/NeutralFace.otf");
}

.NeutralFace
{
    font-family: 'NeutralFace',sans-serif!important; 
}
.NeutralFace-Bold
{
    font-family: 'NeutralFace-Bold',sans-serif!important;  
}
.MyriadPro-Regular
{
    font-family: 'MyriadPro-Regular_0',sans-serif!important;    
}
.Myriad_Pro_Bold
{
    font-family: 'Myriad_Pro_Bold',sans-serif!important;    
}
.HelveticaNeueLTPro
{
    font-family: 'HelveticaNeueLTPro-ThEx',sans-serif!important;    
}
.Helvetica
{
    font-family: 'Helvetica',sans-serif!important;    
}
.FuturaPTBook
{
    font-family: 'FuturaPTBook',sans-serif!important;    
}
.FuturaPTBold
{
    font-family: 'FuturaPTBold',sans-serif!important;    
}
 body
 {
    background-color: black;
    overflow-x: hidden;
 }
 .mt50{margin-top: 90px;}
 .description
 {
    font-size: 15px;
    font-family: 'MyriadPro-Regular_0',sans-serif; 
    color:var(--awhite)!important;
 }
 .full-hight
 {
    height: 100vh;
 }
 .description.max
 {
    font-size: 14px;
    font-family: 'Changa-Regular',sans-serif; 
    color:var(--awhite)!important;
 }
 a{text-decoration: none;}
 .main-title
 {
    font-size: 44px;
    font-family: 'NeutralFace-Bold',sans-serif; 
    color:var(--awhite);
    max-width: 199px;
    text-align:start;
 }
 .main-title.first
 {
    max-width:555px!important;
 }
 .sub-title
 {
    font-size: var(--font20);
    font-family: 'NeutralFace-bold',sans-serif; 
    color:var(--awhite);
    text-align:start;  
 }
 .sub-title.w135{width: 135px;}
 .sub-title.w180{width: 92%;}
 .main-btn
 {
    border-radius: 45px;
    background-color:var(--red);
    color: var(--awhite);
    font-size: var(--font24);
    font-family: 'HelveticaNeueLTPro-ThEx',sans-serif; 
    transition: 400ms;
    display: flex;
    justify-content: center;
    align-items: center;
 }

 .main-btn:hover
 {
    color: var(--awhite); 
    transition-duration:0.3s;
    padding-right: 51px!important;
 }
 .main-btn i
 {
    position: absolute;
    margin-left: 188px;
    transform: translateX(-6%);
    opacity: 0;
    display: flex;
    transition: 400ms;
 }
 .main-btn.more i
 {
    margin-left: 113px;
 }
 .main-btn:hover i
 {
    opacity: 1;
    transform: rotateX(0);
    transition-duration:0.5s;
 }
 .autotyped{height:auto;}
 .autotyped p , .element
 {
    font-size: 104px;
    font-family: 'NeutralFace-bold',sans-serif; 
    color:var(--awhite);
    text-align: center;
    line-height:99px
 }
 .element
 {
   color: var(--red)!important;
 }
 .blog-style 
{
    border-radius: 8px;
    background-color: transparent;
    height: 315px;
    cursor: pointer;
    border: unset;
    display: flex;
    justify-content: center;
    align-items: center;
}
.blog-img-top{
    /* border-radius: 31px;     */
    width: auto;
    max-width: 100%;
    height: auto;
}
.row_gap{
    row-gap: 0 !important;
}
.NoRadius
{
    border-radius: 0px!important;
}
.arrowMobile
{
    position: absolute;
    bottom: 167px;
    left: 0px;
}
.blog-title {
    font-size: var(--font20);
    color: var(--white);
    font-family: 'Changa-Bold',sans-serif; 
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space:break-spaces;
}
.blog-description
{
    font-size: var(--font12);
    color: var(--white);
    font-family:'Changa-Regular',sans-serif; 
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space:break-spaces;
}
.client-name
{
    font-size: 67px;
    color: var(--red);
    font-family:'Changa-Bold',sans-serif;  
    margin-bottom: 50px;
    line-height: 52px;
}
.contact
{
    font-size: var(--font24);
    color: var(--white);
    font-family:'Changa-Medium',sans-serif;    
}
.main_image-div
{
    width:450px;
    height: 480px;
    background-color: var(--red);
    border-radius: 48%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden!important;
}
.main_image
{
    transition-duration: 0ms;
    transform: translate3d(0px, 45px, -99.9259px) rotateX(0deg) rotateY(0deg) rotateZ(13deg)  scale(1);
}
/* .rotate {
    animation: rotation 8s infinite linear;
  }
  
  @keyframes rotation {
    from {
      transform:translate3d(0px, 60px, -99.9259px) rotateY(0deg) rotateZ(13deg) rotateX(0deg);
    }
    to {
      transform:translate3d(0px, 60px, -99.9259px) rotateY(360deg) rotateZ(13deg) rotateX(0deg);
    }
  } */



/**/
.coccoc-alo-ph-circle {
    width: 195%;
    height: 399px;
    top: 4px;
    left: -87px;
    position: absolute;
    background-color: transparent;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid white;
    opacity: .1;
    -webkit-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;
    -moz-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;
    -ms-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;
    -o-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;
    animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.coccoc-alo-phone {
    background-color: transparent;
    width: 200px;
    height: 200px;
    cursor: pointer;
    z-index: 200000 !important;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    -webkit-transition: visibility .5s;
    -moz-transition: visibility .5s;
    -o-transition: visibility .5s;
    transition: visibility .5s;
    right: 150px;
    top: 30px;
}

.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle-fill {
    background-color: #fa846c;
    opacity: .75 !important;
}

.coccoc-alo-ph-circle-fill {
    width: 186%;
    height: 399px;
    top: 4px;
    left: -87px;
    position: absolute;
    background-color: #000;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: .1;
    -webkit-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -moz-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -ms-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -o-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out;
    animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.coccoc-alo-ph-img-circle {
    width: 200px;
    height: 138px;
    top: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* left: 70px; */
    position: absolute;
    /* background: rgba(30, 30, 30, 0.1) url(https://drive.google.com/uc?id=1V3N2b79QjDWetC_ss9wI3c-xpWDymn9R) no-repeat center center; */
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: 1;
    -webkit-animation: coccoc-alo-circle-img-anim 8s infinite ease-in-out;
    -moz-animation: coccoc-alo-circle-img-anim 8s infinite ease-in-out;
    -ms-animation: coccoc-alo-circle-img-anim 8s infinite ease-in-out;
    -o-animation: coccoc-alo-circle-img-anim 8s infinite ease-in-out;
    animation: coccoc-alo-circle-img-anim 8s infinite ease-in-out;
}

/* .coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-img-circle {
    background-color: #fa846c;
} */

.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle {
    border-color: #fa846c;
    opacity: .5;
}

.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle,
.coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle {
    border-color: #fa846c;
    opacity: .5;
}

/* .coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle-fill,
.coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle-fill {
    background-color: rgba(211, 125, 27, 0.5);
    opacity: .75 !important;
}

.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-img-circle,
.coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-img-circle {
    background-color: rgba(211, 125, 27, 0.5);
} */

@-moz-keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@-webkit-keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@-o-keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@-moz-keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-webkit-keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-o-keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-moz-keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
}

@-webkit-keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
}

@-o-keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
}

@keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotateY(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotateY(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotateY(0) scale(1) skew(1deg)
    }
}
.footer-link.menu,.footer-link.menu:hover
{
    display: flex;
    justify-content: center;
    align-items: center;
    color: white; 
    font-size: var(--font16); 
    font-family:'Changa-Regular',sans-serif; 

}
.mobile-scroll {
    overflow-x: scroll;
    white-space: nowrap;
    flex-wrap: nowrap;
    scroll-behavior: smooth;
}
.mobile-scroll::-webkit-scrollbar
{
    display: none;
}
.client_div
{
    background-color: transparent;
    /* box-shadow: 0px 2px 12px var(--wshadow); */
    border-radius: 15px;
    /* border: 1px solid var(--white); */
    height: 94%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* flex-direction: column; */
}
.arrows i
{
    font-size: 43px;
    color: #FF5532; 
}
.arrows
{
    justify-content: space-between;
    display: flex;
}
/* .map-div
{
min-height: 400px;
} */
.contact-div
{
    height: 400px;  
}
/* .contactCarousel .carousel-item
{
    width: 81px;
} */
.carousel-control-prev-icon,.carousel-control-next-icon
{
    filter: invert(45%) sepia(58%) saturate(3398%) hue-rotate(340deg) brightness(112%) contrast(103%);
}
.carousel-control-next-icon, .carousel-control-prev-icon
{
    height: 4rem;
    width: 4rem;
}
.client_img
{
    background-color: white;
    width:250px;
    height: 250px;
    border-radius: 145px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.more-big
{
    font-size: 19px;
    font-family: 'Changa-Bold',sans-serif;
    color:#FF5532;
}
.description.italic
{
    font-style: italic!important;
}
.square-check
{
    color:#ff8c2e;
    opacity: 0.7;  
}
@media (max-width:992px)
{
    .contact-div
    {
        height: 280px;
    }
    .sub-title
    {
        font-size: 15px;
    }
    .description.max,.description{font-size: 14px;}
    .main-title{font-size: 32px;}
    .main_image-div
    {
       height: 408px; 
    }
    .coccoc-alo-phone
    {
        height: 245px;
    }
    .main_image-div
    {
        width: 100%;
    }
    .contact
    {
        font-size: 20px;
    }

    .sub-title.w135{width: 100%;}
    .sub-title.w180{width: 100%;}
    .autotyped p, .element {
        font-size: 32px;
        font-family: 'NeutralFace-bold',sans-serif;
        color: var(--awhite);
        text-align: center;
        line-height: 37px;
    }
    .autotyped {
        height: 120px;
    }
    .client-name 
    {
        font-size: 42px;
        margin-bottom: 28px;
        line-height: 45px;
    }
    .coccoc-alo-ph-circle-fill,.coccoc-alo-ph-circle 
    {
        top: -60px;
    }
    .coccoc-alo-ph-img-circle 
    {
        top: 50px;
        height: 121px;
    }
    .reverse
    {
     flex-direction: column-reverse;
    }
    .full-hight
    {
        height: unset;
    }
}