/* import font family */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;600;700;900&display=swap');

/* ---------------------------------
1. PRIMARY STYLES
--------------------------------- */

html{ font-size: 100%; overflow-x: hidden; width: 100%; margin: 0px;  padding: 0px; touch-action: manipulation;}


body{ font-size: 14px; width: 100%; height: 100%; margin: 0; font-weight: 400;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; word-wrap: break-word; 
  overflow-x: hidden; color: rgb(51, 51, 51); }
body, h1, h2, h3, h4, h5, h6, p, a, ul, span, li{font-family: 'Cairo', sans-serif!important;}

h1, h2, h3, h4, h5, h6, p, a, ul, span, li, img, inpot, button{ margin: 0; padding: 0; }

h1,h2,h3,h4,h5,h6{ line-height: 1.5; font-weight: inherit; }

h1,h2,h3{ font-family: 'Encode Sans Expanded', sans-serif; }

p{ line-height: 1.7; font-size: 1.05em; font-weight: 400; color: #555; }

h1{ font-size: 4em; line-height: 1; }
h2{ font-size: 2em; line-height: 1.1; }
h3{ font-size: 1.7em; }
h4{ font-size: 1.3em; }
h5{ font-size: 1.1em; }
h6{ font-size: .85em; }

a, button{ display: inline-block; text-decoration: none; color: inherit; line-height: 1.3; 
  -webkit-transition: all .25s ease-in-out; transition: all .25s ease-in-out; }

a:focus, a:active, a:hover,
button:focus, button:active, button:hover,
a b.light-color:hover{ text-decoration: none; color: var(--nl-primary); }

b{ font-weight: 700; }

img{ width: 100%; }

li{ list-style: none; display: inline-block; line-height: 1.6; font-size: .9em; }

span{ display: inline-block; }

button{ outline: 0; border: 0; background: none; cursor: pointer; }

.icon{ font-size: 1.1em; display: inline-block; line-height: inherit; }
ion-icon{vertical-align: middle;}

[class^="icon-"]:before, [class*=" icon-"]:before{ line-height: inherit; }

b.max-bold{ font-weight: 700; }

input:focus,
textarea:focus{ outline-color: var(--nl-primary); }

::placeholder { color: #ccc; }
:-ms-input-placeholder { color: #ccc; }
::-ms-input-placeholder { color: #ccc; }

/* scrollbar style */
/* width */
::-webkit-scrollbar{width: 5px;}

/* Track */
::-webkit-scrollbar-track{box-shadow: inset 0 0 5px grey; border-radius: 10px;}
 
/* Handle */
::-webkit-scrollbar-thumb {background: #000; border-radius: 10px;}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {opacity: .7;}


/* RESPONSIVE */

@media only screen and (max-width: 767px) {
  
  p{ line-height: 1.4; }

  h1{ font-size: 3.8em; }
  h2{ font-size: 2em; }
  h3{ font-size: 1.6em; }
  h4{ font-size: 1.3em; }
  
}

@media only screen and (max-width: 575px) {

  body{ font-size: 14px; }
  
}

/* ---------------------------------
3. LOADING
--------------------------------- */
.dashboard-loading-full{position: fixed;top: 0;left: 0;width: 100%;height:100%;z-index: 2000;display: none;}
.dashboard-loading-full-opacity{position: fixed;top: 0;left: 0;width: 100%;height:100%;background-color: #000;opacity: .7;z-index: 19;}
.dashboard-loading-full-icon{font-size: 50px;text-align: center;margin-top: 5em;position: relative;z-index: 2001;color: #fff;}

/* ---------------------------------
3. ANIMATION
--------------------------------- */
@keyframes ld-spin{0%{-webkit-transform: rotate(0);transform: rotate(0);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);}50%{-webkit-transform: rotate(180deg);transform: rotate(180deg);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}100%{-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@-webkit-keyframes ld-spin{0%{-webkit-transform: rotate(0);transform: rotate(0);animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);}50%{-webkit-transform: rotate(180deg);transform: rotate(180deg);animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}100%{-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
.ld.ld-spin{-webkit-animation: ld-spin 1s infinite;animation: ld-spin 1s infinite;}

/* ---------------------------------
3. HEADER
--------------------------------- */

header{ position: relative; z-index: 1000; font-weight: 600; }

header i{ font-size: 1.1em; }

/* TOPBAR */
.head-social-links, .footer-social-links{font-size: 18px!important;}
.header-languages-dropdown{width: 100px;z-index: 2000;display: none;}
.header-languages-dropdown div{padding: 6px;border-bottom: 1px solid #ddd;}

/* BOTTOM HEADER */

header:after{ content:''; clear: both; }

header .logo{ height: 65px; margin: 16px 0; }

header .logo img{ height: 100%; width: auto; }

header ul.main-menu > li > a{ height: 100%; line-height: 80px; padding: 0px 15px; }

.display-opt-btn{position: fixed;left: 0;top: 20%;background-color: var(--bs-dark);color: #fff;width: 35px;height: 35px;text-align: center;font-size: 24px;cursor: pointer;z-index: 1001;}

/* SEARCH AREA */

header .right-area{ height: 100%; line-height: 70px; padding: 5px; }

header .src-icn,
header .close-icn{ display: none; }

header .src-icn.active,
header .close-icn.active{ display: block; }

header .src-form{ position: absolute; top: 0px; bottom: 0px; right: 15px; left: 0px; z-index: 1; 
  max-width: 0; overflow: hidden; -webkit-transition: all .2s; transition: all .2s; }

header .src-form.active{ max-width: 3000px;  }


header .src-form form{ height: 100%; }

header .src-form input{ display: block; width: 100%; height: 100%; padding: 0 75px 0 15px; font-size: 1.4em; border: 0px solid #ccc; 
  background: #f7f5f8; outline: 0; -webkit-transition: all .0s; transition: all .0s; }

header .src-form input:focus{ background: #f1f2f1; }

header .src-form button{ position: absolute; top: 0; bottom: 0; right: 0; width: 60px; background: #eee; }

/* MARQUEE */
.header-marquee-title.float-start{color: #fff;padding: 10px;font-size: 20px;font-weight: bold;position: relative;z-index: 2;}
.header-news-animated{position: relative;height: 50px;}
.marquee{line-height: 50px;font-weight: bold;}
.marquee-item{display: none;}
.marquee-btns button{border-color: var(--nl-primary)!important;}
.marquee-btns button:hover{background-color: var(--nl-primary)!important;color: #fff!important;}

/* RESPONSIVE */
@media only screen and (max-width: 767px) {
  .header-marquee-title.float-start {
    font-size: 16px;
    padding: 7px;
  }
}


/* HAMBURGER ICON */

header .menu-nav-icon{ display: inline-block; font-size: 30px; line-height: 60px; display: none; cursor: pointer; }


/* DROPDOWN MENU STYLING */

header .main-menu li.drop-down{ position: relative; text-align: left; }

header .main-menu li.drop-down > ul.drop-down-menu{ display: none; position: absolute; top: 60px; 
  left: 0; min-width: 180px; box-shadow: 0px 3px 10px rgba(0,0,0,.3); background: #fff; }

header .main-menu li.drop-down > ul.drop-down-menu li{ display: block; border-top: 1px solid #ddd; }

header .main-menu li.drop-down > ul.drop-down-menu li > a{ display: block; padding: 17px 20px; }

header .main-menu li i{margin-left: 10px; }


/* DROPDOWN HOVER */

header .main-menu li.drop-down a.mouseover + ul.drop-down-menu{ display: block; 
  animation: full-opacity-anim .2s forwards; }

.nav-subs{position: absolute;right: 0;width: 100%;padding: 10px;color: #fff;z-index: 10;}
.nav-item:hover > .nav-subs{display: block!important;}
.navbar-expand-lg .navbar-nav .nav-link {padding-left: .5rem;padding-right: 2rem;}


@keyframes full-opacity-anim{
  0%{ opacity: 0; }
  100%{ opacity: 1; }
}



/* RESPONSIVE */

@media only screen and (max-width: 992px) {
  header ul.main-menu > li > a{ padding: 0 5px; }
}


@media only screen and (max-width: 767px) {
  .header-topbar .float-end.py-2 {padding-top: 0px!important; padding-bottom: 0px!important;}
  .head-social-links {padding-top: 9px!important;padding-bottom: 6px!important;font-size: 16px!important;}
  header .logo{ height: 45px; margin: 10px 0; float: unset!important; }
  
  header .right-area{ line-height: 50px; }
  .header-ads{margin-bottom: 8px;}
  .footer-logo{text-align: center;}

  /* marquee */
  .header-news-animated{height: 38px!important;}
  .header-marquee-title.float-left{font-size: 12px!important;width: 50px;padding: 10px 0px!important;}
  .marquee{font-size: 12px;width: 79%;line-height: 35px;}
  .marquee-btns.mt-2{width: 3.5rem;margin-top: .25rem!important;}
  
  
  /* MAIN MENU */
  
  header .main-menu{ display: none; position: absolute; top: 60px; left: 0; right: 0; float: none; 
    opacity: 0; z-index: 1; height: auto; text-align: left; background: #fff; }
  
  header .main-menu.visible-menu{ display: block; box-shadow: 0 4px 20px -10px rgba(0,0,0,.4); 
    animation: full-opacity-anim .2s forwards ease; }
  
  @keyframes full-opacity-anim{
    
    100%{ opacity: 1; }
    
  }
  
  header .main-menu > li{ display: block; }
  
  header ul.main-menu > li > a{ display: block; height: auto; line-height: 1; padding: 15px; border-top: 1px solid #eee; }
    
  
  /* HAMBURGER ICON */

  
  header  .menu-nav-icon{ display: block; }
  
  
  /* DROPDOWN  */
  
  header .main-menu li.drop-down > ul.drop-down-menu{ position: static; box-shadow: none; }
  
  header .main-menu li.drop-down > ul.drop-down-menu li{ border-top: 1px solid #eee; }
  header .main-menu li.drop-down > ul.drop-down-inner li:first-child{ border-top: 1px solid #ddd; }
  
  /* DROPDOWN HOVER */
  
  header .main-menu li.drop-down > ul.drop-down-menu li a{ padding-left: 25px; }
  
  header .main-menu li.drop-down > ul.drop-down-inner li a{ padding-left: 35px; }
  
}

@media only screen and (max-width: 575px) {

  header ul.main-menu > li > a{ padding: 15px; }
  
  /* HAMBURGER ICON */
  .menu-nav-icon{ float: right; }
  
}

@media only screen and (max-width: 359px) {

  header .heading-wrapper{  padding: 30px 20px 20px; }

  header .info .icon{ font-size: 25px; }

  header .info .right-area{ margin-left: 35px; }
}

/* HOME PAGE */
.home-slide-main {
  height: 400px;
}
.home-slide-second {
  height: 195px;
}

/* RESPONSIVE */
@media only screen and (max-width: 767px) {
  .home-slide-main, .home-slide-second {
    height: 240px;
  }
  .home-lastest-list h5 {
    font-size: 14px;
    line-height: 18px;
  }
}

/* POST PAGE */
.post-content, .post-content p{font-size: 1.275em;font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"!important;overflow-wrap: anywhere;}

@media only screen and (max-width: 767px) {
  .a2a_kit {
    margin-bottom: 10px;
  }
}

/* ---------------------------------
2. COMMONS FOR PAGE DESIGN
--------------------------------- */

.dplay-tbl{ display: table; height: 100%; width: 100%; } 
.dplay-tbl-cell{ display: table-cell; vertical-align: middle; } 

.oflow-hidden{ overflow: hidden; }
.oflow-visible{ overflow: visible; }

.dplay-none{ display: none; }
.dplay-block{ display: block; }
.dplay-inl-block{ display: inline-block; }

.opacty-1{ opacity: .1; }
.opacty-2{ opacity: .2; }
.opacty-3{ opacity: .3; }
.opacty-4{ opacity: .4; }
.opacty-5{ opacity: .5; }
.opacty-6{ opacity: .6; }
.opacty-7{ opacity: .7; }



/* POSITION */

.pos-relative{ position: relative; z-index: 1; }

.abs-tlr{ position: absolute; top: 0; left: 0; right: 0; z-index: 1; }
.abs-blr{ position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; }
.abs-tl{ position: absolute; top: 0; left: 0; z-index: 1; }
.abs-br{ position: absolute; bottom: 0; right: 0; z-index: 1; }
.abs-tbr{ position: absolute; top: 0; bottom: 0; right: 0; z-index: 1; }
.abs-tblr{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }

.z--1{ z-index: -1; }

/* LINE HEIGHT */

.lh-30{ line-height: 30px; }
.lh-35{ line-height: 35px; }
.lh-40{ line-height: 40px; }


/* FONTS */

.font-7 { font-size: .7em; }
.font-75{ font-size: .75em; }
.font-8 { font-size: .8em; }
.font-85{ font-size: .85em; }
.font-9 { font-size: .9em; }
.font-11{ font-size: 1.1em; }
.font-12{ font-size: 1.2em; }
.font-13{ font-size: 1.3em; }
.font-14{ font-size: 1.4em; }
.font-20{ font-size: 2em; }


/* RESPONSIVE */

@media only screen and (max-width: 767px) {
  .text-sm-center{ text-align: center; }
  .font-sm-13{ font-size: 1.3em; }

  /*post*/
  .post-content, .post-content p{font-size: 1.2em;}
}


/* COLOR */

.color-white{ color: #fff; }
.color-green{ color: #36D98A; }
.color-ash{ color: #aaa; }
.color-ccc{ color: #ccc; }
.color-grey{ color: #ccc; }
.color-primary{ color: var(--nl-primary); }
.color-black{ color: #111; }
.color-lite-black{ color: #888; }



/* BACKGROUND COLOR*/

.bg-191{ background: #191919; }
.bg-primary{ background: var(--nl-primary)!important; }


/* BACKGROUND IMAGE */

.img-bg{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }

.bg-map{ background: url(../images/map.png) no-repeat center; background-size: cover; }

.bg-1{ background-size: cover; background-repeat: no-repeat;background-position: center; }
.bg-2{ background-size: cover; background-repeat: no-repeat;background-position: center; }
.bg-3{ background-size: cover; background-repeat: no-repeat;background-position: center; }
.bg-4{ background-size: cover; background-repeat: no-repeat;background-position: center; }
.bg-5{ background-size: cover; background-repeat: no-repeat;background-position: center; }
.bg-6{ background-size: cover; background-repeat: no-repeat;background-position: center; }


.bg-grad-layer-6:after{ content:''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: -1;
  opacity: .6; background: linear-gradient(to top,  #000 0%,  rgba(0,0,0,.4) 100%); }
  
.bg-layer-4:after{ content:''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: -1;
  opacity: .4; background: #111; }

.bg-layer-7:after{ content:''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: -1;
  opacity: .7; background: #111; }




/* RESPONSIVE */

@media only screen and (max-width: 767px) {
  
  .bg-sm-color-6{ background: rgba(0,0,0,.6); }
  .bg-sm-color-7{ background: rgba(0,0,0,.7); }
  
}


/* BORDER */

.brder-grey{ border: 1px solid #ccc; }
.brder-t-grey{ border-top: 1px solid #ccc; }
.brder-tlr-grey{ border: 1px solid #ccc; border-bottom: 0; }
.brder-blr-grey{ border: 1px solid #ccc; border-top: 0; }

.brdr-ash-1{ height: 1px; background: #aaa; }



/* LINK STYLING  */
  
.link-brdr-btm-primary{ position: relative; padding-bottom: 5px; 
  -webkit-transition: all .2s; transition: all .2s;}

.link-brdr-btm-primary:after{ content:''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; 
  background: var(--nl-primary); -webkit-transition: all .2s; transition: all .2s; 
  -webkit-transform-origin: right; transform-origin: right; }

.link-brdr-btm-primary:hover{ -webkit-transform: translateY(-1px); transform: translateY(-1px); }

.link-brdr-btm-primary:hover:after{ -webkit-transform: scale(0); transform: scale(0); }


/* BUTTON STYLING */

.btn-brdr-primary{ text-align: center; height: 45px; line-height: 43px; border: 1px solid var(--nl-primary); color: var(--nl-primary); 
  border-radius: 2px; }
.btn-brdr-primary:hover{ background: var(--nl-primary); color: #fff; }

.btn-brdr-grey{ text-align: center; height: 45px; line-height: 43px; border: 1px solid #ccc; line-height: 1; 
  border-radius: 2px; }
.btn-brdr-grey:hover{ border: 1px solid var(--nl-primary); background: var(--nl-primary); color: #000; }

.btn-fill-primary{ text-align: center; height: 45px; line-height: 43px; border: 1px solid var(--nl-primary); background: var(--nl-primary); 
  border-radius: 2px; color: #fff; }
.btn-fill-primary:hover{ background: none; }

.btn-fill-grey{ text-align: center; height: 45px; line-height: 43px; border: 1px solid #ccc; background: #ccc; 
  border-radius: 2px; color: #111; }
.btn-fill-grey:hover{ border: 1px solid var(--nl-primary); background: none; color: #000; }


.btn-b-md{ font-size: .9em; height: 35px; line-height: 35px; }
.btn-b-sm{ font-size: .9em; height: 30px; line-height: 28px; }


/* FORM INPUT STYLING */

.nwsltr-primary-1{ position: relative; }
  
.nwsltr-primary-1 input{ height: 45px; display: block; width: 100%; padding: 0 65px 0 20px; 
  border: 1px solid var(--nl-primary); }

.nwsltr-primary-1 button{ position: absolute; top: 1px; bottom: 1px; right: 1px; width: 45px; text-align: center; 
  background: var(--nl-primary); color: #fff; }

.nwsltr-primary-1 button i{ font-size: 1.3em; }

.nwsltr-primary-1 button:hover{ background: #000; color: #fff; }


.form-block input,
.form-block textarea{ display: block; width: 100%; }

.form-bold input,
.form-bold textarea{ font-weight: 700; }

.form-plr-15 input,
.form-plr-15 textarea{ padding: 0 15px; }

.form-h-35 input{ height: 35px; }
.form-h-40 input{ height: 40px; }
.form-h-45 input{ height: 45px; }

.form-mb-20 input,
.form-mb-20 textarea{ margin-bottom: 20px; }

.form-brdr-grey input,
.form-brdr-grey textarea{ border: 1px solid #ccc; }

.form-brdr-lite-white input,
.form-brdr-lite-white textarea{ border: 1px solid #ddd; }

.form-brdr-b-grey input,
.form-brdr-b-grey textarea{ outline: 0; border: 0px; border-bottom: 1px solid #ccc; }

.form-brdr-b-grey input:focus,
.form-brdr-b-grey textarea:focus{ border-bottom: 1px solid var(--nl-primary); }



/* SIDED SECTION */

.sided-70{ position: relative; }
.sided-70 .s-left{ position: absolute; top: 0; left: 0; height: 70px; width: 70px; }
.sided-70 .s-left.rounded img{ border-radius: 70px; overflow: hidden; }
.sided-70 .s-right{ min-height: 70px; }


/* FLOAT LEFT RIGHT  */

.float-left-right{ overflow: hidden; }

.float-left-right ul:first-child{ float: left; }

.float-left-right ul:last-child{ float: right; }


/* RESPONSIVE */

@media only screen and (max-width: 767px) {
  
  .float-left-right{ text-align: center; }

  .float-left-right ul:first-child,
  .float-left-right ul:last-child{ float: none; }

}

/* ACCRODIAN */

.accordian:first-child{ border-top: 1px solid #ccc; }
.accordian .a-title{ padding: 15px 50px 15px 25px; display: block; position: relative; border: 1px solid #ccc; 
  border-top: 0; }

.accordian .a-title i{ position: absolute; top: 50%; right: 0; color: var(--nl-primary); width: 50px; text-align: center; 
  -webkit-transform: translateY(-50%); transform: translateY(-50%); }

.accordian .a-body{ max-height: 0; overflow: hidden; -webkit-transition: all .2s; transition: all .2s;  }
.accordian .a-body.active{ max-height: 1000px; }

.a-body-inner{ padding: 25px 40px 25px 25px; border: 1px solid #ccc; border-top: 0;}



/* INDIVIDUAL STYLING */
.p-title{ position: relative; padding-bottom: 20px; margin-bottom: 40px; }

.p-title:after { content:''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: #ccc; }
.p-title:before{ content:''; position: absolute; bottom: 0; left: 0; width: 80px; height: 5px; 
  background: var(--nl-primary); z-index: 1; }

.quote-primary{ padding: 10px 20px; border-left: 2px solid var(--nl-primary); }



/* WIDTH/HEIGHT */

.w-auto{ width: auto!important; }
.h-auto{ height: auto!important; }

.w-10 { width:  10%!important; }
.w-20 { width:  20%!important; }
.w-30 { width:  30%!important; }
.w-40 { width:  40%!important; }
.w-50 { width:  50%!important; }
.w-60 { width:  60%!important; }
.w-70 { width:  70%!important; }
.w-80 { width:  80%!important; }
.w-90 { width:  90%!important; }
.w-100{ width: 100%!important; }

.w-1-4 { width:  25%!important; }
.w-1-3 { width:  33.33%!important; }
.w-2-3 { width:  66.666%!important; }
.w-3-4 { width:  75%!important; }

.h-10 { height:  10%!important; }
.h-20 { height:  20%!important; }
.h-30 { height:  30%!important; }
.h-40 { height:  40%!important; }
.h-50 { height:  50%!important; }
.h-60 { height:  60%!important; }
.h-70 { height:  70%!important; }
.h-80 { height:  80%!important; }
.h-90 { height:  90%!important; }
.h-100{ height: 100%!important; }

.h-1-4 { height:  25%!important; }
.h-1-3 { height:  33.33%!important; }
.h-2-3 { height:  66.666%!important; }
.h-3-4 { height:  75%!important; }

.h-100vh{ height: 100vh!important; }

.wh-100x{ height: 100px; width: 100px!important; }

.w-100x { width: 100px!important; }
.w-200x { width: 200px!important; }
.w-300x { width: 300px!important; }
.w-400x { width: 400px!important; }
.w-500x { width: 500px!important; }
.w-600x { width: 600px!important; }
.w-700x { width: 700px!important; }
.w-800x { width: 800px!important; }
.w-900x { width: 900px!important; }

.h-100x { height: 100px!important; }
.h-200x { height: 200px!important; }
.h-300x { height: 300px!important; }
.h-400x { height: 400px!important; }
.h-500x { height: 500px!important; }
.h-600x { height: 600px!important; }
.h-700x { height: 700px!important; }
.h-800x { height: 800px!important; }
.h-900x { height: 900px!important; }

.min-h-100x{ min-height: 100px!important; }