.body-templates{ background: #EAECF0;}
.body-templates .page-header{ background: #0C111D;}
.marktxt{ color: #FFFFFF;
font-size: 24px;
font-weight: 600;
line-height: 38px;
text-align: left; margin-left: 30px;
}
.lftHead{ width: auto; display: flex; align-items: center;}
.cretBtn{background:#F8CB10 url(../images/icons/plus.png) no-repeat right 5px center;box-shadow:0px 1px 2px 0px #1018280D;font-size:14px;font-weight:600;line-height:40px;text-align:center;border:1px solid #F8CB10;border-radius:8px;padding:0 34px 0 16px;display:inline-block;color:#000000;}
.cretBtn:hover{ background: #000 url(../images/icons/plus-n.png) no-repeat right 5px center; color: #fff;}
.billTxt{color:#FFFFFF;font-size:16px;font-weight:400;line-height:28px;text-align:right; margin-right:20px;}

.globleTab{ padding: 20px 0; border-bottom: 1px solid #D0D5DD; width: 100%; display: inline-block; background: #fff;}
.globleTab li{ display: inline-block; border: 1px solid #D0D5DD; float: left;}
.globleTab li a{ display: inline-block; padding: 9px 14px; color: #344054;font-size: 14px;font-weight: 600;line-height: 20px;}
.globleTab li:first-child{ border-radius: 6px 0 0 6px; }
.globleTab li:last-child{ border-radius: 0px 6px 6px 0px; }
.globleTab li.actv a{ background: #D0D5DD;}

.globalTemp{ background: #fff; border: 1px solid #EAECF0; border-radius: 20px; margin: 20px 0;}
.globlHead{ padding: 20px; border-bottom: 1px solid #EAECF0;}
.globlHead h1{font-size:30px;font-weight:600;line-height:38px;text-align:left;padding-bottom: 5px;}
.globlHead p{font-size:14px;font-weight:500; line-height:20px; color:#344054; margin-bottom:0px; }

.globalTempBody{ padding: 10px 90px; width: 100%; }

.globlBox{ border: 1px solid #D0D5DD; padding: 20px; background: #F9FAFB; border-radius: 8px;}
.globlBox h4{color:#344054;font-size:14px;font-weight:700;line-height:20px;text-align:left; padding-bottom: 10px;}
.glblList li{ display: inline-block; margin-right: 10px;}
.glblList li img{ max-width: 100%; width: 20px !important;}
.temPic{ width: 100%; margin-top: 20px;}
.temPic img{ border: 1px solid #D0D5DD; width: 100%; height: 250px; object-fit:cover;}
.temTxt{ width: 100%; padding-top: 10px;}
.temTxt p{color:#344054;font-size:12px;font-weight:500;line-height:20px;text-align:left; margin-bottom:0px;}
.globalTemRow .item{ padding: 10px;}
.globalTemRow .owl-prev, .globalTemRow .owl-next{ color:#EAECF0; border: 1px solid #EAECF0 !important; background: rgba(255, 255, 255, 0.9) !important; width:48px; height:48px; border-radius: 28px; position: absolute; top: 50%;transform: translateY(-50%);}
.globalTemRow .owl-prev span,.globalTemRow .owl-next span{ display: none;}
.globalTemRow .owl-prev:before{ content: "\f060";}
.globalTemRow .owl-next:before{ content: "\f061";}
.globalTemRow .owl-prev:before, .globalTemRow .owl-next:before{ font-family: "Font Awesome 6 Free"; font-weight: 900; color:rgba(102, 112, 133, 1);}
.globalTemRow .owl-prev{ left: -55px;}
.globalTemRow .owl-next{ right: -55px;}
/*.globalTemRow{ padding: 10px 0;}*/
@media screen and (max-width:991px){


.globalTempBody {
  padding: 10px 51px;
  width: 100%;
}
.globalTemRow .owl-prev, .globalTemRow .owl-next{ width: 36px;
  height: 36px;}
.globalTemRow .owl-prev {
  left: -40px;
}
.globalTemRow .owl-next {
  right: -40px;
}
.globlBox{ padding: 12px;}
.marktxt {
  font-size: 17px;
  line-height: 32px;
  margin-left: 12px;
}

.billTxt {
  font-size: 13px;
  line-height: 24px;
  margin-right: 11px;
}
.cretBtn{ font-size: 12px;
  line-height: 32px;}





}
@media screen and (max-width:767px){

.globlHead h1{ font-size: 24px; line-height: 30px;}


.cretBtn {
    font-size: 0;
    line-height: 32px;padding: 0; width: 32px; background-position: center center !important;
  }





}
@media screen and (max-width:640px){
.billTxt{ display: none;}

.globleTab li a{ padding: 6px 9px; font-size: 12px;}




}
@media screen and (max-width:480px){

 .globalTempBody {
    padding: 10px;
    width: 100%;
  }
.globalTemRow .owl-prev, .globalTemRow .owl-next{ position: inherit;
  top: inherit;
  transform: inherit;left: inherit; right: inherit; margin: 4px;}

.globalTemRow .owl-nav{ text-align: center;}

.globleTab li a {
    padding: 6px 6px;
    font-size: 11px;
  }
.marktxt {
    font-size: 12px;
    line-height: 29px;
    margin-left: 12px;
  }

}
@media screen and (max-width:480px){

.globleTab li {
  margin: 2px;
  border-radius: 6px !important;
}

.globleTab ul{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}



}
@media screen and (max-width:400px){
.marktxt{ display: none;}


}





/* skeleton */

.loader {
    opacity: 0.5; /* Optional: gives a faded effect */
}

.loading-title,
.loading-list,
.loading-image,
.loading-text-line {
    background: #e0e0e0; /* Light grey for loading effect */
    border-radius: 4px;
}

.loading-title {
    height: 20px; /* Adjust as needed */
    width: 60%; /* Adjust as needed */
    margin-bottom: 10px;
}

.loading-list {
    display: flex;
    justify-content: space-between;
}

.loading-icon {
    width: 24px; /* Adjust as needed */
    height: 24px; /* Adjust as needed */
    background: #e0e0e0; /* Light grey */
    border-radius: 50%; /* Circle effect */
}

.loading-pic {
    height: 250px; /* Adjust as needed */
    background: #e0e0e0; /* Light grey */
    margin-bottom: 10px;
}

.loading-text-line {
    height: 14px; /* Adjust as needed */
    width: 80%; /* Adjust as needed */
    margin-bottom: 5px;
}


.globalTempBody{ padding:10px!important;}
div#globalTemplateList { margin:0!important;}
div#companyTemplateList { margin:0!important;}
div#personalTemplateList { margin:0!important;}

	









