/********** Template CSS **********/
:root {
    --primary:rgba(0, 7, 3, 0.85)  !important;
    --secondary: #fd1c1c;
    --light: #EEF9FF;
    --dark: #091E3E;
}
::selection {
  background-color: #008000; 
  color: #ffffff; 

}


.item {
  color: #150303;
  padding: 5px;
  margin: 25px 0;
  position: relative;
  box-shadow: 0 0 10px #edecec;
  font-family: 'index',timesnewroman;

}

.text{
        font-family: 'salesandmarketing',timesnewroman;
        line-height: 30px;
        font-weight: normal;
        font-size: 16px;

}
/*
svg {
  width: 10px;
  height: 10px;
  fill: #dbec32;
  position: absolute;
  left: 16px;
  top: 6px
}*/
.text-boxes{
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 30px;
  margin-bottom: 10px;
  display: flex;
  text-align: center;
  justify-content: center;
}
.text-boxes .text-box{
  height: 30px;
  max-width: 660px;
  width: 100%;
  margin: 55px 0;
}

.text-boxes .text-box textarea{
  height: 1px;
  width: 1px;
  padding: 0px; /* this code put more number to expand textrea */
  font-size: 15px;
  font-weight: 400;
  outline: none;
  border: 1px solid #265df2;
  border-radius: 8px;
  background: #e7edfe;
  display: flex;
  text-align: center;
  justify-content: center;
}
.text-box textarea::-webkit-scrollbar{
  display: none;
}
.text-box button{
  height: 45px;
  width: 155px;
  color: #000;
  background: #ffffff;
  outline: none;
  border: none;
  border-radius: 8px;
  font-size: 17px;
  font-weight: 400;
  margin: 8px 0;
  cursor: pointer;
  transition: all 0.4s ease;
  border-color: rgb(224 224 224 / 85%);
    border-style: solid;
    border-width: 2px 4px 2px 4px;
    border-radius: 30px;
}
.text-boxes .text-box button:hover{
  background: #ffffff;
}
@media (max-width: 400px) {
  .text-boxes .text-box button{
    width: 100%;
  }
}
#wrapper h1{
    color: #410729;
        font-family: 'angkor',englishfont;
        padding-left: 10px;
        padding-top: 20px;
        display: flex;
        text-align: center;
        justify-content: center;
        padding-bottom: 10px;

}
#wrapper i{
    display: flex;
    text-align: center;
    justify-content: center;
}
#wrapper p{
display: flex;
    text-align: center;
    justify-content: center;
    margin-bottom: 20px;

}
#wrapper h2{
color: #000;
        font-family: 'angkor',englishfont;
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        display: flex;
        text-align: center;
        justify-content: center;
        font-size: 16px;

}
h2,
.font-weight-bold {
    font-weight: 700 !important;
    font-family: 'angkor',englishfont;
    color: black;
  
}
.text-primary {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
    line-height: 30px;
    color: black;
    font-family: 'angkor',englishfont;
    border-radius: 20px;
}
.btndetail{
    font-family: index;
    font-weight: normal;
}
@font-face {
    font-family:englishfont;
    src: url('../englishfont.otf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}

.btndetail .fa {
  
    font-size: 10px;
    font-weight: normal;
}
.jd-slider .slide-inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    border: 1px solid #fff;
    
}

@font-face {
    font-family:Angkor;
    src: url('../Angkor.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
.no-underline {
  text-decoration: none;
}
.textbox {
  text-decoration: none;
}
#no-underline-span {
  text-decoration: none;
}
.textarea {
  height: auto;
  width: 300px;
  margin-top:50px;
  margin-left:auto;
  margin-right:auto;
  color:black;
  text-decoration: none;
}

.textarea p{
  height: auto;
  width: 300px;
  margin-left:auto;
  margin-right:auto;
  position:relative;
  color:black;
  margin-bottom:10px;
  padding-left:10px;
  font-family:salesandmarketing;
  border: 1px solid gray;
  background-color:white;
  font-weight:normal;

}

.text-img{
  width: 300px;
  margin-left:auto;
  margin-right:auto;
  position:relative;
  color:black;
  
  
  
}

.text-img img{
  width: 300px;
  margin-top:3px;
  margin-left:auto;
  margin-right:auto;
  position:relative;
  color:black;
  border-radius:20px;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  margin-bottom:10px;
  margin-top:10px;
}
#divMain-list
{
    width: auto;
    height: 500px;
    overflow-y: scroll;
    border-radius: 0px;
    overflow-x: hidden;
}

  
 

  .playlist::-webkit-scrollbar-track:hover
  {
      position: absolute; background-color:#f7f7f7;
      width: 100%;
      height: calc(100% - 40px);
      overflow-y: scroll;
      border-top: 0px solid #dcdee1;
      padding-bottom: 2px; /* I forget to add this while I was recording this video please add this line if you don't add this property then the last li in the playlist will not show  */
  }
#divMain-list::-webkit-scrollbar  {
    width: 8px;
  
        border: 1px solid #f3f3f3;

    
  
  }
 

 #divMain h3{
    text-align: center;
    justify-content: center;
    display: flex;
    font-family: 'Angkor',englishfont;


 }
 #divMain h3 a{
    text-align: center;
    justify-content: center;
    display: flex;
    font-family: 'Angkor',englishfont;
    cursor: none;
    color:#000000;
    background-color: #ffffff;


 }


#videodiv::-webkit-scrollbar-thumb {
   background-color:#fff;
    border-radius: 0px;
    margin-top: 0px;box-shadow: inset 0 0 1px #d2cdcd;
    border: 1px solid #e2e0e0; display: none;
  }

 #videodiv::-webkit-scrollbar-track {
        background: #fff;
        border-radius:0px;margin-top: 0px; display: none;
        
      }
 #videodiv::-webkit-scrollbar {
        background: #fff;
        border-radius:0px;margin-top: 0px;display: none;
        
      }      
#divMain2
{
    position:absolute;
    right:25px;
    top: 25px;
    width: 400px;
    height: 200px;
    background-color: #CFFDCE;
    overflow:hidden;
}

#divShort
{
    width: 200px;
    height: 200px;
    margin-bottom: 2em;
    background-color: black;
    color: white;
    overflow:hidden;
}


.jd-slider .slide-area > li:first-child {
    border-left: 1px solid #ffffff;
    text-decoration: none;

}


.jd-slider .controller {
    margin: 10px 0 0;
}

.jd-slider.slider3 .slide-area > li,
.jd-slider.slider3-2 .slide-area > li,
.jd-slider.slider3-3 .slide-area > li {
    width: 50%;    text-decoration: none;

}

.jd-slider.slider3 .slide-area > li:nth-child(2),
.jd-slider.slider3-2 .slide-area > li:nth-child(2),
.jd-slider.slider3-3 .slide-area > li:nth-child(2) {
    display: block;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child {
    background-color: #a66;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child + li {
    background-color: #6a6;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child + li + li {
    background-color: #66a;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child + li + li + li {
    background-color: #aaa;
}
.jd-slider,.jd-slider .slide-inner{overflow:hidden;position:relative;width:100%}html{font-size:16px}blockquote,body,button,code,dd,div,dl,dt,fieldset,form,h1,h2,h3,h5,h6,legend,li,ol,p,pre,select,td,textarea,th,ul{margin:0;padding:0; text-decoration: none;}dl,li,menu,ol,ul{list-style:none}blockquote,q{quotes:none}button,select,textarea{vertical-align:middle;border: 0px solid white; text-decoration: none;}button{background-color:transparent;cursor:pointer}button,select,td,textarea,th{line-height:1.5;font-family:'',dotum,sans-serif;color:#333; text-decoration: none;}a{color:#333;text-decoration:none}address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:400}.jd-slider{margin:0 auto;padding:0}.jd-slider .slide-area{width:100%;margin:0;padding:0}.jd-slider .slide-area:after{display:block;content:'';clear:both}.jd-slider .slide-area li{display:none;float:left;width:100%}.jd-slider .slide-area li:first-child{display:block}.jd-slider .slide-area li img{display:block;width:100% ; height: auto;
    letter-spacing: 1px;
    box-shadow: inset 0 0 12px #ffffff;
    box-shadow: inset 0 0 3px #ffffff;
    border-top: 8px solid black;
    padding-bottom: 2px;
    font-weight: bold;
    background-color: white;
    background-image: url(../worldwideweb/background.png);}.jd-slider .next,.jd-slider .prev{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);color:#000}.jd-slider .hidden.next,.jd-slider .hidden.prev{display:none}.jd-slider .prev{left:0}.jd-slider .next{right:0}.jd-slider .controller{width:100%;text-align:center; text-decoration: none;}.jd-slider .controller .auto{display:inline-block;vertical-align:middle}.jd-slider .controller .auto i{display:none;color:#333 ; text-decoration: none;}.jd-slider .controller .auto.pause .fa-pause,.jd-slider .controller .auto.play .fa-play{display:block ; text-decoration: none;}.jd-slider .controller .indicate-area{display:inline-block}.jd-slider .controller .indicate-area a{display:inline-block;position:relative;width:16px;height:16px;margin:0 5px;font-size:0;color:transparent;vertical-align:middle}.jd-slider .controller .indicate-area a:after{content:'';position:absolute;top:0;left:0;width:inherit;height:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;border:2px solid #333;border-radius:50%}.jd-slider .controller .indicate-area a.on:after{background-color:#333}.jd-slider a{font-size:1.5rem}.jd-slider.fade .slide-area li{display:block;position:absolute;top:0;left:0;opacity:0;-webkit-transform:translateZ(0);transform:translateZ(0)}.jd-slider.fade .slide-area li:first-child{position:static;opacity:1}.jd-slider.slider--none .controller,.jd-slider.slider--none .next,.jd-slider.slider--none .prev{display:none}
.content {
    position: absolute; /* Position the background text */
    bottom: 0; /* At the bottom. Use top:0 to append it to the top */
    background: rgb(0, 0, 0); /* Fallback color */
    background: rgba(248, 248, 248, 0.5); /* Black background with 0.5 opacity */
    color: #f1f1f1; /* Grey text */
    width: 100%; /* Full width */
    
  }
  /*.images-landing{
    background-image: url(../worldwideweb/backgroundimage.png)!important;  
    background-repeat: no-repeat;
    /*background-position: center;
    background-attachment: fixed;*/
   /* background-size: 100% 100%;
   /* border-top: 0px solid rgba(0,0,0,0.125);
  }*/

 .bg-dark {
    background-image: url(../worldwideweb/backgroundimage.png) !important;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-top: 0px solid rgba(0, 0, 0, 0.125);
}
/*  .bg-dark{ background-image: url(../indexglobal/backgroundimage.png)!important;  
    background-repeat: no-repeat;
    /*background-position: center;
    background-attachment: fixed;
    background-size: 100% 100%;
    border-top: 0px solid rgba(0,0,0,0.125);}*/
.fa-2x {
    font-size: 2em;
    padding-left: 20px;
    padding-right: 20px;
    color: white;
}
#track {
    /*-webkit-touch-action: none;*/
    /*-webkit-touch-callout:none;*/
    /*cursor: move;*/
    display: inline-block;
    white-space: nowrap;
    font-size: 0;
    /*transition: transform .5s;*/
}

#track img {
        height: 200px;
        /*object-fit: cover;*/
        width: 666px;
        height: auto;
}

@media screen and (max-width: 1024px) {
    #track img {
        display: inline-block;
        height: 200px;
        /*object-fit: cover;*/
        width: 100vw;
    }
    .jd-slider .slide-area > li > a{
        
            display: block;
            line-height: 30px;
            font-size: 3em;
            font-weight: bold;
            outline: 0;
            height: auto;
        
    }
    
    
}

@media screen and (min-width: 1024px) {
    #track img {
        user-select: text;
        display: inline-block;
        height: 400px;
    }
}

#switcher {
    margin: 2px 0;
    text-align: center;
}

#switcher div {
    cursor: pointer;
    display: inline-block;
    color:black;
    border: 1px solid #aaa;
    outline: none;
    border-radius: 5px;
    font-size: 14px;
    width: 100px;
    height: 30px;
    line-height: 30px;
    background-color: white;
    font-weight: bold;
    font-family: salesandmarketing;
}


.list-group img{
    width: 50px;
    height: auto;
    margin-right: 10px;
    border-radius:20px;
    margin-left:10px;
    
    
}
.list-group p{
    font-family: index;
    font-size:16px;
    padding-top:10px;
}
.list-group a{
    font-family: 'index', Courier, monospace;
    font-weight: normal;
}
.list-group a:hover{
    font-family: 'index', Courier, monospace;
    font-weight: normal;
    color: rgb(250, 3, 3);
}
h3{
    font-family: salesandmarketing;
    font-size: 16px;
}


.font-weight-semi-bold {
    font-weight: 600 !important;
    color: #fd1c1c;
    font-family: index;
}
.fab {
    font-family: "Font Awesome 5 Brands";
    color:red;
}
.fab:hover {
    font-family: "Font Awesome 5 Brands";
    color:white;
}
h5,
h6,
.font-weight-medium {
    font-weight: bold !important;
    color:red;
    font-family: index;
    
}
.btn {
    font-family: 'index', sans-serif;
    font-weight: 600;
    transition: .5s;
    background-color: #ffffff;
    color: black;
    margin-left: 0px;
    margin-right: 0px;
    border: 1px solid rgb(231 239 219);
    border-radius: 30px;
    font-size: 13px;
    text-decoration: none;
    width: 150px;
    line-height: 25px;
    
}
@media (max-width: 375px) {
    *::-webkit-scrollbar-thumb{
        margin-top:10px;margin-left:30px;
    }
    *::-webkit-scrollbar-track{
        display: none;
    }
    *::-webkit-scrollbar-thumb {
        background-color:#fff;
        border-radius: 0px;
        margin-top: 0px;
        border: 0px solid #f7f6ff;
        box-shadow: inset 0 0 1px rgb(0 0 0 / 30%);
        display: none;
      }
      *::-webkit-scrollbar-track {
        background: black;
        border-radius:0px;margin-top: 0px;
        
      }
      .dropdown-item {
    display: block;
    padding: .25rem 1rem;
    clear: both;
    font-weight: 400;
    color: white;
    background-color: green;
    border: 0;
    margin-bottom: 7px;
    padding-bottom: 10px;
    padding-top: 4px;
    line-height: 30px;
    font-weight: bold;
    font-family: salesandmarketing; 
    word-wrap: break-word;
    width: 330px;
}

}

*::-webkit-scrollbar  {
    width: 12px;
    height:6px;
    
  
  }
  
  *::-webkit-scrollbar-track {
    background:black;
    border-radius:0px;margin-top: 0px;
    
  }
  
  *::-webkit-scrollbar-thumb {
    background-color:#fff;
    border-radius: 0px;
    margin-top: 0px;box-shadow: inset 0 0 4px #130303;
    border: 3px solid #121116;
    box-shadow: inset 0 0 1px rgb(0 0 0 / 30%);
    display: block;
  }
  *::-webkit-scrollbar-thumb:hover {
    background: inset 0 0 0px rgba(160, 155, 155, 0.3);
      box-shadow: inset 0 0 0px rgba(160, 155, 155, 0.3);
          background-color:#ca0404;

  
  }

.btn-secondary {
    color: black;
    font-family: salesandmarketing;
    width: 200px;
    font-size: 18px;
}
.text-space{color:#0dd806 !important; font-family: salesandmarketing; font-size: 16px;}
.btn-primary:hover {
    background: var(--secondary);
    border-color: red;
}
.text-global{color:black !important; font-family: index; font-size: 16px; line-height: 30px;}

.h1{
    color: #fd1c1c;
}
.btn-secondary:hover {
    background: var(--primary);
    border-color: red;
}

.btn-square {
    width: 36px;
    height: 36px;
    padding-top: 6px;
}

.btn-sm-square {
    width: 28px;
    height: 28px;
    
}

.btn-lg-square {
    width: 46px;
    height: 46px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    border-radius:20px;
}

#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
    
}
.no-underline-link {
  text-decoration: none;
}
.back-to-top {
    position: fixed;
    display: none;
    right: 55px;
    bottom: 185px;
    z-index: 99;
    border-radius: 30px;
    background-color: red;
    border: 4px solid green;
    color: white;
    width: 50px;
    height: 50px;
}
.back-to-top :any-link {
    position: fixed;
    display: none;
    right: 55px;
    bottom: 185px;
    color: white;
    z-index: 99;
    border-radius: 30px;
    border: 3px solid red;
}
.back-to-top a::after {
    position: fixed;
    display: none;
    right: 45px;
    bottom: 185px;
    color: white;
    z-index: 99;
    border-radius: 30px;
    border: 3px solid red;
}
.back-to-top:hover {
    position: fixed;
    display: none;
    right: 55px;
    bottom: 185px;
    z-index: 99;
    border-radius: 30px;
    background-color: red;
    border: 4px solid green;
    color: white;
    width: 50px;
    height: 50px;
}

.top-shape::before {
    position: absolute;
    content: "";
    width: 35px;
    height: 100%;
    top: 0;
    left: -17px;
    background-image: repeating-linear-gradient(220deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(189deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(148deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), linear-gradient(90deg, rgb(30, 169, 65), rgb(158, 25, 173));
    transform: skew(40deg);
}

.navbar-light .navbar-nav .nav-link {
    font-family: 'angkor', englishfont;
    padding: 20px 15px;
    font-size: 16px;
    color:black;
    outline: none;
    transition: .5s;
}
.text-whiteslide{
    color: red !important;
    font-family: salesandmarketing;
    font-size: 16px;
}
.sticky-top.navbar-light .navbar-nav .nav-link {
    padding: 20px 15px;
    text-decoration: none;
        font-family: 'angkor', englishfont;

}
.navbar .dropdown-toggle[aria-expanded=true]::after {
    transform: rotate(-180deg);
}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
    color: black;
    font-family: 'angkor', englishfont;
    text-decoration: none;
}

@media (max-width: 991.98px) {
    .navbar-light .navbar-nav .nav-link,
    .sticky-top.navbar-light .navbar-nav .nav-link {
        padding: 10px 0;
        text-decoration: none;
            font-family: 'angkor', englishfont;

    }
}
#container-search {
    width: 100%;
    padding-right: var(--bs-gutter-x, 0.1rem);
    padding-left: var(--bs-gutter-x, 0.1rem);
    margin-right: auto;
    margin-left: auto;
}
/*** overlay ***/
.carousel-caption {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(3 104 120 / 63%);
    z-index: 1;
}

@media (max-width: 576px) {
    .carousel-caption h5 {
        font-size: 14px;
        font-weight: 500 !important;
    }

    .carousel-caption h1 {
        font-size: 20px;
        font-weight: 600 !important;
    }
}
/********** arrow **********/
.carousel-control-prev,
.carousel-control-next {
    width: 25%;
    margin-bottom: 100px;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 3rem;
    height: 5.4rem;
}

@media (min-width: 991.98px) {
    .banner {
        position: relative;
        margin-top: -90px;
        z-index: 1;
    }
    
}


@media (min-width: 990px) {
    .nav-facebook{
        margin-top:10px;margin-left:30px;margin-bottom:10px;display: none;
    }
    
}

@media (min-width: 768px) {
    .nav-facebook{
    margin-left:20px;margin-bottom:10px;color:red;
        margin-top: 30px;
    }
.nav-facebook span{
    font-family: salesandmarketing; 
}
}

@media (max-width: 375px) {
    .nav-facebook .btn-link{
    margin-left:1px;margin-bottom:10px;color:red;
        margin-top: 30px;
    }
.nav-facebook span{
margin-left: 20px; color:white;
font-family: salesandmarketing; margin-top: 30px;
}

.fadeInUpsocial{
background-image: repeating-linear-gradient(220deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(189deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(148deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), linear-gradient(90deg, rgb(30, 169, 65), rgb(158, 25, 173));    border-radius:30px;
border: 3px solid white;
border-color: rgba(255, 255, 255, .1) !important;
box-shadow: inset 0 0 4px #3f1919;
}
.images-landing{
    background-image: url(../worldwideweb/backgroundimage.png)!important;  
     /*background-position: center;
    background-attachment: fixed;*/
    background-size: 100% 100%;
    border-top: 0px solid rgba(0,0,0,0.125);
  }
  
}
.singertitle {
    width: 100%;
}
.singertitle p{
    font-family: 'angkor',englishfont;
    margin-bottom: 20px;
}
.songtitle{
    width: 100%;
}
.songtitle p {
    width: 100%;
    font-family: 'salesandmarketing',timesnewroman;
    padding-top: 10px;
    padding-bottom: 0px;

}
.section-title h5::before {
    position: absolute;
    content: "";
    width: 45px;
    height: 3px;
    right: -55px;
    bottom: 11px;
    background: var(--primary);
}

.section-title h5::after {
    position: absolute;
    content: "";
    width: 15px;
    height: 3px;
    right: -75px;
    bottom: 11px;
    background: var(--secondary);
}

.twentytwenty-wrapper {
    height: 100%;
}

.hero-header {/********** arrow **********/

    background: linear-gradient(rgba(9, 30, 62, .85), rgba(9, 30, 62, .85)), url(../img/globalshopping.jpg) center center no-repeat;
    background-size: cover;
}


  
.bg-appointment {
    background: linear-gradient(rgb(45 75 28 / 85%), rgb(44 120 35 / 85%)), url(../img/pexels-aaditya-arora-592753.jpg) center center no-repeat;
    background-size: cover;
}
@font-face {
    font-family:salesandmarketing;
    src: url('../salesandmarketing.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
.appointment-form {
    background-color: rgb(24 24 24 / 85%) !important;
    border: 0px solid white;
    box-shadow: -25px -25px 50px 0 rgb(0 0 0 / 85%) inset, -25px -25px 50px 0 rgb(0 0 0 / 85%) !important;
    border: 0px solid white;
    border-color: rgba(255, 255, 255, .1) !important;
    border-radius: 42px;
    border: 3px solid;
}

.service-item img,
.service-item .bg-light,
.service-item .bg-light h5,
.team-item .team-text {
    transition: .5s;
}

.service-item:hover img {
    transform: scale(1.15);
}

.team-item .team-text::after,
.service-item .bg-light::after {
    position: absolute;
    content: "";
    top: 50%;
    bottom: 0;
    left: 15px;
    right: 15px;
    border-radius:100px / 15px;
    box-shadow: 0 0 15px rgba(0, 0, 0, .7);
    opacity: 0;
    transition: .5s;
    z-index: -1;
}

.team-item:hover .team-text::after,
.service-item:hover .bg-light::after {
    opacity: 1;
}

.bg-offer {
    background:url(../img/coding.jpg) center center no-repeat;
    background-size: cover;
}

.offer-text {
    background-color: rgb(93 213 144 / 85%) !important;
    box-shadow: -25px -25px 50px 0 rgb(0 0 0 / 85%) inset, -25px -25px 50px 0 rgb(0 0 0 / 85%) !important;
    border: 3px solid white;
    border-color: rgba(255, 255, 255, .1) !important;
    border-radius: 30px;
    font-family: index;


}

.price-carousel .owl-nav {
    position: absolute;
    width: calc(100% + 5px);
    height: 45px;
    top: calc(50% - 22.5px);
    left: -2.5px;
    display: flex;
    justify-content: space-between;
    opacity: 0;
    transition: .5s;
    border-radius: 30px;
}
@font-face {
    font-family:index;
    src: url('../index.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
.price-carousel:hover .owl-nav {
    opacity: 1;
}

.price-carousel .owl-nav .owl-prev,
.price-carousel .owl-nav .owl-next {
    position: relative;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    border-radius: 2px;
    font-size: 22px;
    transition: .5s;
    border-radius: 30px;
}

.price-carousel .owl-nav .owl-prev:hover,
.price-carousel .owl-nav .owl-next:hover {
    background: var(--secondary);
}

.bg-testimonial {
    background: url(../img/globalshopping.jpg) center center no-repeat;
    background-size: cover;
}

.testimonial-carousel {
    background-color: rgb(229 229 229 / 85%) !important;
    box-shadow: -25px -25px 50px 0 rgb(0 0 0 / 85%) inset, -25px -25px 50px 0 rgb(0 0 0 / 85%) !important;
    border: 3px solid white;
    border-color: rgba(255, 255, 255, .1) !important;
    border-radius: 30px;
}

.testimonial-carousel .owl-nav {
    position: absolute;
    width: calc(100% + 0px);
    height: 46px;
    top: calc(50% - 23px);
    left: -0px;
    display: flex;
    justify-content: space-between;
    z-index: 1;
}

.testimonial-carousel .owl-nav .owl-prev,
.testimonial-carousel .owl-nav .owl-next {
    position: relative;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    border-radius: 2px;
    font-size: 22px;
    transition: .5s;
    border-radius: 30px;
}

.testimonial-carousel .owl-nav .owl-prev:hover,
.testimonial-carousel .owl-nav .owl-next:hover {
    background: var(--secondary);
}

.testimonial-carousel .owl-item img {
    width: 120px;
    height: 120px;
}
    font-family: index;
    font-weight: normal;
}
.btndetail .fa {
  
    font-size: 10px;
    font-weight: normal;
}


@font-face {
    font-family:Angkor;
    src: url('../Angkor.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
#divMain-list
{
    width: auto;
    height: 500px;
    overflow-y: scroll;
    border-radius: 0px;
    overflow-x: hidden;
}

  #divMain-list::-webkit-scrollbar  {
    width: 8px;
  
    
  
  }
 
.offer-text h1{
   
    font-family: 'angkor',englishfont;
    margin-bottom: 10px;
    margin-top: 20px;
    color: #ffecb2;
}
.offer-text h3{
   
    font-family: 'angkor',englishfont;
    margin-bottom: 10px;
    margin-top: 20px;
    color: #091e3e;
}
.offer-text li{
   
    color: #ffecb2;

}
  .playlist::-webkit-scrollbar-track:hover
  {
      position: absolute; background-color:#f7f7f7;
      width: 100%;
      height: calc(100% - 40px);
      overflow-y: scroll;
      border-top: 0px solid #dcdee1;
      padding-bottom: 2px; /* I forget to add this while I was recording this video please add this line if you don't add this property then the last li in the playlist will not show  */
  }
    #divMain-list::-webkit-scrollbar-track {
    background: #fff;
    border-radius:0px;
    margin-top: 0px;
    
    
  }
 
  #divMain-list::-webkit-scrollbar-thumb {
   background-color:#fff;
    border-radius: 0px;
    margin-top: 0px;
    box-shadow: inset 0 0 2px #d3d0d0;
    border: 1px solid #f7f3f3;
  }
  *::-webkit-scrollbar-thumb:hover {
    background: inset 0 0 0px rgba(39, 32, 32, 0.3);
      box-shadow: inset 0 0 0px rgba(160, 155, 155, 0.3);
  border: 0px solid #5d3b3b;
  }
 

   
        #player-container {
            padding: 20px;
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }
        
        #player-container​ h2 {
            padding: 20px;
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
            font-family: angkor;
        }

#divMain2
{
    position:absolute;
    right:25px;
    top: 25px;
    width: 400px;
    height: 200px;
    background-color: #CFFDCE;
    overflow:hidden;
}
.list-group-item--{
    margin-top: 10px;
    margin-bottom: 20px;
}
#divShort
{
    width: 200px;
    height: 200px;
    margin-bottom: 2em;
    background-color: black;
    color: white;
    overflow:hidden;
}


.dropdown-item {
    display: block;
    padding: .25rem 1rem;
    clear: both;
    font-weight: 400;
    color: white;
    background-color: #28a745;
    box-shadow: 0px 0px 1px 1px rgb(133, 163, 133) inset;
    margin-bottom: 7px;
    padding-bottom: 10px;
    padding-top: 15px;
    line-height: 30px;
    font-weight: bold;
    font-family: salesandmarketing;
    word-wrap: break-word;
    width: 250px;
    border-radius: 10px;
    margin-left: 6px;
}


.dropdown-item-30{
    display: block;
    clear: both;
    font-weight: 400;
    color: rgb(0, 0, 0);
    background-color:#fff;
    border: 0;
    line-height: 30px;
    font-weight: bold;
    font-family: 'angkor',englishfont;
    word-wrap: break-word;
    width: 330px;
    margin-top: 4px;
}
.dropdown-item-30 h3{
        font-family: 'angkor',englishfont; margin-bottom: 0px; margin-top: 0px;
        color: #000;

}
.jd-slider .slide-area > li:first-child {
    border-left: 1px solid #fff;
    text-decoration: none;

}


.jd-slider .controller {
    margin: 10px 0 0;
}

.jd-slider.slider3 .slide-area > li,
.jd-slider.slider3-2 .slide-area > li,
.jd-slider.slider3-3 .slide-area > li {
    width: 50%;    text-decoration: none;

}

.jd-slider.slider3 .slide-area > li:nth-child(2),
.jd-slider.slider3-2 .slide-area > li:nth-child(2),
.jd-slider.slider3-3 .slide-area > li:nth-child(2) {
    display: block;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child {
    background-color: #a66;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child + li {
    background-color: #6a6;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child + li + li {
    background-color: #66a;    text-decoration: none;

}

.jd-slider.slider4 .slide-area > li:first-child + li + li + li {
    background-color: #aaa;
}
.jd-slider,.jd-slider .slide-inner{overflow:hidden;position:relative;width:100%}html{font-size:16px}blockquote,body,button,code,dd,div,dl,dt,fieldset,form,h1,h2,h3,h5,h6,legend,li,ol,p,pre,select,td,textarea,th,ul{margin:0;padding:0 ; text-decoration: none;}dl,li,menu,ol,ul{list-style:none}blockquote,q{quotes:none}button,select,textarea{vertical-align:middle;border: 0px solid white; text-decoration: none;font-family: 'salesandmarketing',timesnewroman; text-decoration: none;
}button{background-color:transparent;cursor:pointer}button,select,td,textarea,th{line-height:1.5;font-family:'',dotum,sans-serif;color:#333 ;text-decoration: none;}a{color:#333;text-decoration:none}address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:400}.jd-slider{margin:0 auto;padding:0}.jd-slider .slide-area{width:100%;margin:0;padding:0}.jd-slider .slide-area:after{display:block;content:'';clear:both}.jd-slider .slide-area li{display:none;float:left;width:100%}.jd-slider .slide-area li:first-child{display:block}.jd-slider .slide-area li img{display:block;width:100% ; height: auto;
    letter-spacing: 1px;
    box-shadow: inset 0 0 12px #ffffff;
    box-shadow: inset 0 0 3px #ffffff;
    border-top: 8px solid black;
    padding-bottom: 2px;
    font-weight: bold;
    background-color: white;
    background-image: url(../worldwideweb/background.png);}.jd-slider .next,.jd-slider .prev{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);color:#000}.jd-slider .hidden.next,.jd-slider .hidden.prev{display:none}.jd-slider .prev{left:0}.jd-slider .next{right:0}.jd-slider .controller{width:100%;text-align:center; text-decoration: none;}.jd-slider .controller .auto{display:inline-block;vertical-align:middle}.jd-slider .controller .auto i{display:none;color:#333 ; text-decoration: none;}.jd-slider .controller .auto.pause .fa-pause,.jd-slider .controller .auto.play .fa-play{display:block ; text-decoration: none;}.jd-slider .controller .indicate-area{display:inline-block}.jd-slider .controller .indicate-area a{display:inline-block;position:relative;width:16px;height:16px;margin:0 5px;font-size:0;color:transparent;vertical-align:middle}.jd-slider .controller .indicate-area a:after{content:'';position:absolute;top:0;left:0;width:inherit;height:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;border:2px solid #333;border-radius:50%}.jd-slider .controller .indicate-area a.on:after{background-color:#333}.jd-slider a{font-size:1.5rem}.jd-slider.fade .slide-area li{display:block;position:absolute;top:0;left:0;opacity:0;-webkit-transform:translateZ(0);transform:translateZ(0)}.jd-slider.fade .slide-area li:first-child{position:static;opacity:1}.jd-slider.slider--none .controller,.jd-slider.slider--none .next,.jd-slider.slider--none .prev{display:none}
.content {
    position: absolute; /* Position the background text */
    bottom: 0; /* At the bottom. Use top:0 to append it to the top */
    background: rgb(0, 0, 0); /* Fallback color */
    background: rgba(248, 248, 248, 0.5); /* Black background with 0.5 opacity */
    color: #f1f1f1; /* Grey text */
    width: 100%; /* Full width */
    
  }
  .images-landing{
    background-image: url(../worldwideweb/backgroundimage.png)!important;  
    background-repeat: no-repeat;
      /*background-position: center;
    background-attachment: fixed;*/
    background-size: 100% 100%;
    border-top: 0px solid rgba(0,0,0,0.125);
  }
  

.fa-2x {
    font-size: 2em;
    padding-left: 20px;
    padding-right: 20px;
    color: white;
}
#track {
    /*-webkit-touch-action: none;*/
    /*-webkit-touch-callout:none;*/
    /*cursor: move;*/
    display: inline-block;
    white-space: nowrap;
    font-size: 0;
    /*transition: transform .5s;*/
}

#track img {
        height: 200px;
        /*object-fit: cover;*/
        width: 666px;
        height: auto;
}

@media screen and (max-width: 1024px) {
    #track img {
        display: inline-block;
        height: 200px;
        /*object-fit: cover;*/
        width: 100vw;
    }
    .jd-slider .slide-area > li > a{
        
            display: block;
            line-height: 30px;
            font-size: 3em;
            font-weight: bold;
            outline: 0;
            height: auto;
        
    }
    
    
}
#divMain1{
    overflow-y: scroll;
    overflow-x: hidden;
    background-color: #fff;
    border: 10px solid rgb(235 235 235 / 85%);
    border-radius: 18px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0px 0px 2px 2px #dcdcdc; 
    max-width: 365px;  
    max-height: 550px; 

}
#divMain1 img{
    min-width: 100%;
}
#divMain1::-webkit-scrollbar-thumb:hover {
   background-color:#f40404;
    border-radius: 0px;
    margin-top: 0px;box-shadow: inset 0 0 1px #d2cdcd;
    border: 1px solid #e2e0e0; 
  }
#divMain1::-webkit-scrollbar-thumb {
   background-color:#fff;
    border-radius: 0px;
    margin-top: 0px;box-shadow: inset 0 0 1px #d2cdcd;
    border: 1px solid #e2e0e0; 
  }

 #divMain1::-webkit-scrollbar-track {
        background: #fff;
        border-radius:0px;margin-top: 0px; 
        
      }
 #divMain1::-webkit-scrollbar {
        background: #fff;
        border-radius:0px;margin-top: 0px;
        
      }
  
 


 #divMain1 p{
    background-color: #ffffff;
    font-family: 'salesandmarketing',timesnewroman;
    padding-right: 10px;
    padding-left: 14px;
    margin-top: 10px;
    line-height: 30px;
    display: flex;
    justify-content: center;
    padding-bottom: 10px;
    padding-top: 10px;

 }

#divMain1 h4{
        font-family: 'salesandmarketing',timesnewroman;
        font-size: 16px;
        background-color:#ffffff;
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        font-weight: normal;

}
#divMain1 i{
    margin-top: 20px;
}
#switcher {
    margin: 2px 0;
    text-align: center;
}

#switcher div {
    cursor: pointer;
    display: inline-block;
    color:black;
    border: 1px solid #aaa;
    outline: none;
    border-radius: 5px;
    font-size: 14px;
    width: 100px;
    height: 30px;
    line-height: 30px;
    background-color: white;
    font-weight: bold;
    font-family: salesandmarketing;
}


.list-group img{
    width: 50px;
    height: auto;
    margin-right: 10px;
    border-radius:20px;
    margin-left:10px;
    
    
}
.list-group p{
    font-family: index;
    font-size:16px;
    padding-top:10px;
}
.list-group a{
    font-family: 'index', Courier, monospace;
    font-weight: normal;
}
.list-group a:hover{
    font-family: 'index', Courier, monospace;
    font-weight: normal;
    color: rgb(250, 3, 3);
}
h3{
    font-family: salesandmarketing;
    font-size: 16px;
}


.font-weight-semi-bold {
    font-weight: 600 !important;
    color: #fd1c1c;
    font-family: index;
}
.fab {
    font-family: "Font Awesome 5 Brands";
    color:red;
}
.fab:hover {
    font-family: "Font Awesome 5 Brands";
    color:white;
}
h5,
h6,
.font-weight-medium {
    font-weight: bold !important;
    color:red;
    font-family: index;
    
}
.btn {
    font-family: 'index', sans-serif;
    font-weight: 600;
    transition: .5s;
    background-color: #ffffff;
    color: black;
    margin-left: 0px;
    margin-right: 0px;
    border: 1px solid rgb(231 239 219);
    border-radius: 30px;
    font-size: 13px;
    text-decoration: none;
    width: 150px;
    line-height: 25px;
    
}

.btn-secondary {
    color: black;
    font-family: salesandmarketing;
    width: 200px;
    font-size: 18px;
}
.text-space{color:#0dd806 !important; font-family: salesandmarketing; font-size: 16px;}
.btn-primary:hover {
    background: var(--secondary);
    border-color: red;
}
.text-global{color:black !important; font-family: index; font-size: 16px; line-height: 30px;}

.h1{
    color: #fd1c1c;
}
.btn-secondary:hover {
    background: var(--primary);
    border-color: red;
}

.btn-square {
    width: 36px;
    height: 36px;
    padding-top: 6px;
}

.btn-sm-square {
    width: 28px;
    height: 28px;
    
}

.btn-lg-square {
    width: 46px;
    height: 46px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    border-radius:20px;
}

#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
    
}
.text-whiteglobal{

    font-family: index;
    font-size: 16px;
    color: black;
    line-height: 30px;
}
.back-to-top {
    position: fixed;
    display: none;
    right: 55px;
    bottom: 185px;
    z-index: 99;
    border-radius: 30px;
    background-color: red;
    border: 4px solid green;
    color: white;
    width: 50px;
    height: 50px;
}
.back-to-top :any-link {
    position: fixed;
    display: none;
    right: 45px;
    bottom: 185px;
    color: white;
    z-index: 99;
    border-radius: 30px;
    border: 3px solid red;
}
.back-to-top a::after {
    position: fixed;
    display: none;
    right: 45px;
    bottom: 185px;
    color: white;
    z-index: 99;
    border-radius: 30px;
    border: 3px solid red;
}
.back-to-top:hover {
    position: fixed;
    display: none;
    right: 55px;
    bottom: 185px;
    z-index: 99;
    border-radius: 30px;
    background-color: red;
    border: 4px solid green;
    color: white;
    width: 50px;
    height: 50px;
}

.top-shape::before {
    position: absolute;
    content: "";
    width: 35px;
    height: 100%;
    top: 0;
    left: -17px;
    background-image: repeating-linear-gradient(220deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(189deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(148deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), linear-gradient(90deg, rgb(30, 169, 65), rgb(158, 25, 173));
    transform: skew(40deg);
}

.text-whiteslide{
    color: red !important;
    font-family: salesandmarketing;
    font-size: 16px;
}
.sticky-top.navbar-light .navbar-nav .nav-link {
    padding: 20px 15px;
    text-decoration: none;
}
.navbar .dropdown-toggle[aria-expanded=true]::after {
    transform: rotate(-180deg);
}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
    color: black;
    font-family: salesandmarketing;
    text-decoration: none;
}

@media (max-width: 991.98px) {
    .navbar-light .navbar-nav .nav-link,
    .sticky-top.navbar-light .navbar-nav .nav-link {
        padding: 10px 0;
        text-decoration: none;
    }
}

/*** overlay ***/
.carousel-caption {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(3 104 120 / 63%);
    z-index: 1;
}

@media (max-width: 576px) {
    .carousel-caption h5 {
        font-size: 14px;
        font-weight: 500 !important;
    }

    .carousel-caption h1 {
        font-size: 20px;
        font-weight: 600 !important;
    }
}
/********** arrow **********/
.carousel-control-prev,
.carousel-control-next {
    width: 25%;
    margin-bottom: 100px;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 3rem;
    height: 5.4rem;
}

@media (min-width: 991.98px) {
    .banner {
        position: relative;
        margin-top: -90px;
        z-index: 1;
    }
    
}


@media (min-width: 990px) {
    .nav-facebook{
        margin-top:10px;margin-left:30px;margin-bottom:10px;display: none;
    }
    
}

@media (min-width: 768px) {
    .nav-facebook{
    margin-left:20px;margin-bottom:10px;color:red;
        margin-top: 30px;
    }
.nav-facebook span{
    font-family: salesandmarketing; 
}
}

@media (max-width: 375px) {
    .nav-facebook .btn-link{
    margin-left:1px;margin-bottom:10px;color:red;
        margin-top: 30px;
    }
.nav-facebook span{
margin-left: 20px; color:white;
font-family: salesandmarketing; margin-top: 30px;
}

.fadeInUpsocial{
background-image: repeating-linear-gradient(220deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(189deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), repeating-linear-gradient(148deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px), linear-gradient(90deg, rgb(30, 169, 65), rgb(158, 25, 173));    border-radius:30px;
border: 3px solid white;
border-color: rgba(255, 255, 255, .1) !important;
box-shadow: inset 0 0 4px #3f1919;
}

}
.section-title h5::before {
    position: absolute;
    content: "";
    width: 45px;
    height: 3px;
    right: -55px;
    bottom: 11px;
    background: var(--primary);
}

.section-title h5::after {
    position: absolute;
    content: "";
    width: 15px;
    height: 3px;
    right: -75px;
    bottom: 11px;
    background: var(--secondary);
}

.twentytwenty-wrapper {
    height: 100%;
}

.hero-header {/********** arrow **********/

    background: linear-gradient(rgba(9, 30, 62, .85), rgba(9, 30, 62, .85)), url(../img/globalshopping.jpg) center center no-repeat;
    background-size: cover;
}

  
.bg-appointment {
    background: linear-gradient(rgb(45 75 28 / 85%), rgb(44 120 35 / 85%)), url(../img/pexels-aaditya-arora-592753.jpg) center center no-repeat;
    background-size: cover;
}
@font-face {
    font-family:salesandmarketing;
    src: url('../salesandmarketing.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
.appointment-form {
    background-color: rgb(24 24 24 / 85%) !important;
    border: 0px solid white;
    box-shadow: -25px -25px 50px 0 rgb(0 0 0 / 85%) inset, -25px -25px 50px 0 rgb(0 0 0 / 85%) !important;
    border: 0px solid white;
    border-color: rgba(255, 255, 255, .1) !important;
    border-radius: 42px;
    border: 3px solid;
}


.service-item img,
.service-item .bg-light,
.service-item .bg-light h5,
.team-item .team-text {
    transition: .5s;
}

.service-item:hover img {
    transform: scale(1.15);
}

.team-item .team-text::after,
.service-item .bg-light::after {
    position: absolute;
    content: "";
    top: 50%;
    bottom: 0;
    left: 15px;
    right: 15px;
    border-radius:100px / 15px;
    box-shadow: 0 0 15px rgba(0, 0, 0, .7);
    opacity: 0;
    transition: .5s;
    z-index: -1;
}

.team-item:hover .team-text::after,
.service-item:hover .bg-light::after {
    opacity: 1;
}

.bg-offer {
    background:url(../img/coding.jpg) center center no-repeat;
    background-size: cover;
}
.max{
min-width: 100%;
}
#max img{
min-width: 300px;
display: flex;
text-align: center;
justify-content: center;
border-radius: 30px;

}
.max p{
display: flex;
text-align: center;
justify-content: center;
font-family: 'angkor',englishfont;
padding-bottom: 10px;

}
.offer-text {
    background-color: rgb(93 213 144 / 85%) !important;
    box-shadow: -25px -25px 50px 0 rgb(0 0 0 / 85%) inset, -25px -25px 50px 0 rgb(0 0 0 / 85%) !important;
    border: 3px solid white;
    border-color: rgba(255, 255, 255, .1) !important;
    border-radius: 30px;
    font-family: index;


}
 #more{  position: fixed; top: 0; bottom: 0/*background-color: rgba(0, 0, 0, 0.8)*/; left: 0;right: 0; z-index: 99999; display:none ; margin-left: 12px; margin-right: 12px; border-radius: 0px; } #max{ background: #fff; padding: 4px; max-width: 800px; margin: 1% auto;position: relative; color: #0e0e0e; border-radius:34px;border-style: solid; 
      border-color: rgb(237 237 237 / 85%);
    border-style: solid;
    border-width: 2px 4px 2px 4px; } 
  
  
  .close{ position: absolute; top: 14px; right: 18px; font-size: 20px;cursor: pointer;z-index: 5; color:white}
   
.price-carousel .owl-nav {
    position: absolute;
    width: calc(100% + 5px);
    height: 45px;
    top: calc(50% - 22.5px);
    left: -2.5px;
    display: flex;
    justify-content: space-between;
    opacity: 0;
    transition: .5s;
    border-radius: 30px;
}
@font-face {
    font-family:index;
    src: url('../index.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
.price-carousel:hover .owl-nav {
    opacity: 1;
}

.price-carousel .owl-nav .owl-prev,
.price-carousel .owl-nav .owl-next {
    position: relative;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    border-radius: 2px;
    font-size: 22px;
    transition: .5s;
    border-radius: 30px;
}

.price-carousel .owl-nav .owl-prev:hover,
.price-carousel .owl-nav .owl-next:hover {
    background: var(--secondary);
}

.bg-testimonial {
    background: url(../img/globalshopping.jpg) center center no-repeat;
    background-size: cover;
}

.testimonial-carousel {
    background-color: rgb(229 229 229 / 85%) !important;
    box-shadow: -25px -25px 50px 0 rgb(0 0 0 / 85%) inset, -25px -25px 50px 0 rgb(0 0 0 / 85%) !important;
    border: 3px solid white;
    border-color: rgba(255, 255, 255, .1) !important;
    border-radius: 30px;
}

.testimonial-carousel .owl-nav {
    position: absolute;
    width: calc(100% + 0px);
    height: 46px;
    top: calc(50% - 23px);
    left: -0px;
    display: flex;
    justify-content: space-between;
    z-index: 1;
}

.testimonial-carousel .owl-nav .owl-prev,
.testimonial-carousel .owl-nav .owl-next {
    position: relative;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    border-radius: 2px;
    font-size: 22px;
    transition: .5s;
    border-radius: 30px;
}

.testimonial-carousel .owl-nav .owl-prev:hover,
.testimonial-carousel .owl-nav .owl-next:hover {
    background: var(--secondary);
}

.testimonial-carousel .owl-item img {
    width: 120px;
    height: 120px;
}

.box figure img{
  width:100%;
  height: 100%;
  object-fit: cover;
  transition: .6s ease-in;
}
.box figure{
  position: relative;
  overflow: hidden;
}
.box figure:hover img{
  transform: scale(1.1);
}

.box figure .title{
position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 10;
    color: #fff;
    padding: 10px 20px;
    font-size: 16px;
    font-family: 'salesandmarketing',timesnewroman;
    font-weight: normal;
}
@font-face {
    font-family:salesandmarketing;
    src: url('../salesandmarketing.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
.box figure::after{
  content:'';
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
/* background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, #000 100%);*/
/* background-image: linear-gradient(rgba(0, 0, 0, .0), rgba(0, 0, 0, .3), rgb(70 112 8 / 90%));green*/
  background-image: linear-gradient(#161515, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.9));}
.profile-image{
  border:2px solid #888;
}
.social-links li{
  margin-right:10px;
}
.social-links li a{
  color:#fff;
  display: block;
  padding:5px 10px;
}
li.facebook{
  background: #39599f;
}
li.instagram{
  background: #e1306c;
}
li.twitter{
  background: #55acee;
}
li.linkedin{
  background: #0a66c2;
}
.footer{
  background:transparent;
  text-align: center;
}
@font-face {
    font-family:Angkor;
    src: url('../Angkor.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-size:16px;
}
.card h4{
font-family: 'Angkor',englishfont;
font-size: 16px;
font-weight: normal;
color: #dc3545;

}
.title{
  line-height: 30px;
  font-size: 16px;
  font-weight: normal;
}
.sticky{
  position: sticky;
  top:2rem;
}
.story{
  font-size: 20px;
  color:#333;
}
.frame{
  width: 44%;
  height: 280px;
  display: inline-block;
  float: left;
  margin-right: 20px;
  overflow: hidden;
}
.frame img{
  width:100%;
  height: 100%;
  object-fit: cover;
}