

a:link,
a:visited,
a:hover,
a:active {
	text-decoration: none;
}

a,
a:hover,
a:focus,
a:active,
a.active {
	outline: none
}
* {
    font-family: 'Alinma TheSans' ; 
}
/*body {*/
/*    background-color: #fff;*/
/*} */
         
/*================================================
 Header
 =================================================*/
.es-bg-headline {
    background-color: var(--es-bg-headline);
}
.header-main {
	background: var(--es-header-bg);
	color: var(--es-header-text-color);
	padding: var(--es-header-padding);
	position: var(--es-header-position);
	z-index: 9999;
	width: 100%;
	top: 0;
}

.header-main a>i {
	color: var(--es-header-text-color);
}

header {
	transition: background .5s;
	transition: all .3s;
}

header.scrolled {
	background: var(--es-header-bg-scrolled);
	color: var(--es-header-text-scrolled);
	padding: var(--es-header-padding-scrolled);
	box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}

header.scrolled a>i {
	color: var(--es-header-text-scrolled);
}

.es-navbar-brand {
	max-height: var(--es-navbar-brand);
	width: auto;
	filter: var(--es-navbar-brand-filter);
}

.header-text-color,
.header-text-color a {
	color: var(--es-header-text-color);
}

.topbar {
	border-bottom: 1px solid #8c898933 !important;
}

/*================================================
 Input with icon
 =================================================*/
 
.input-with-icon {
   position: relative;
}

.input-with-icon input {
    text-indent: 25px;
    /*border: 2px solid #d6d4d4;*/
}


.input-with-icon i {
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.input-with-icon button {
    position: absolute;
    left: 5px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 80% !important;
}


/*================================================
 Slider
 =================================================*/


/* es-slider-ratio */

.es-slider-ratio {
	width: 100%;
	position: relative;
	background: url() 50% 50% no-repeat;
	background-size: cover;
	background-clip: content-box;
}

.es-slider-ratio:before {
	display: block;
	content: "";
	padding-top: var(--es-slider-ratio-calculator);
}


/* es-slider-ratio */

.es-bg-slider-size {
	background-position: center center, center center;
	background-repeat: no-repeat;
	background-size: var(--es-bg-slider-size) !important;
}

.es-slider-title-color {
	color: var(--es-slider-title-color);
}

.es-slider-details-color {
	color: var(--es-slider-details-color);
}

.es-slider-but-text {
	color: var(--es-slider-but-text);
}

.es-slider-but-bg {
	background-color: var(--es-slider-but-bg);
}


/*================================================
 Images Ratio
 =================================================*/


/* es-ratio */

.es-ratio {
	width: 100%;
	position: relative;
	background: url() 50% 50% no-repeat;
	background-size: cover;
	background-clip: content-box;
}

.es-ratio:before {
	display: block;
	content: "";
	padding-top: var(--es-ratio-calculator);
}


/* es-ratio */

.es-bg-item-size {
	background-position: center center, center center;
	background-repeat: no-repeat;
	background-size: var(--es-bg-item-size);
}



/*================================================
 Hover Background Zoom
 =================================================*/
.hover-bg-zoom {
  transition: transform 1s; /* Animation */
}
.hover-bg-zoom:hover,
.hover-bg-zoom:focus {
transform: scale(1.5); /* (150% zoom)*/
}

/*================================================
 Page Title Area CSS
 =================================================*/

.page-title-area {
	/*background-image: var(--es-page-title-bg-img);*/
	background-color: var(--es-page-title-bg-color);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: var(--es-page-title-padding);
}

.page-title-area-solid {
	background-color: var(--es-page-title-bg-color);
	padding: var(--es-page-title-padding-sm);
}

.page-title-content {
	text-align: var(--es-page-title-content);
	color: var(--es-page-title-text-color);
}

.page-title-area_filter-blur {
     background-image: var(--es-page-title-bg-img);
     background-color: #0003;
     height: 100%;
     top: 0;
     z-index: 0;
     -webkit-filter: blur(5px);
     filter: blur(6px);
     z-index: 2;
     -webkit-transform: scale3d(1.2,1.2,1);
     transform: scale3d(1.2,1.2,1)
}

/*================================================
 Pages Details Area CSS
 =================================================*/

.pages-details-img img {
	width: calc(80% - 30%) !important;
	/*width: calc(var(--es-pages-details-img, 80%) - 30%) !important;*/
	/*width: var(--es-pages-details-img);*/
}

.pages-details-description {
	text-align: justify;
}

.section-title {
	text-align: var(--es-section-title);
	position: relative;
}

.section-title::before {
	left: 0;
	right: 0;
	bottom: 0;
	width: 60px;
	height: 3px;
	content: '';
	position: absolute;
	background-color: red;
	margin-left: auto;
	margin-right: auto;
}

.es-tag-status {
	color: #fff;
	background-color: #dc3545;
	border-color: #dc3545;
	/*#0edc8d*/
	font-size: 10px;
	font-weight: 600;
	position: absolute;
	right: 0px; /*0px;*/
	top: 10px;/*10px;*/
	padding: 0;
	height: 20px;
	line-height: 20px;
	padding-right: 14px;
	padding-left: 0px;
}

.es-tag-status::before {
	position: absolute;
	content: "";
	left: -20px;
	top: 0;
	border: 10px solid;
	border-color: inherit;
	/*#0edc8d*/
	border-left-color: transparent;
	height: 5px;
	width: 5px !important;
	border-left-color: transparent
}

.es-tag-status-page {
	color: #fff;
	background-color: #dc3545;
	border-color: #dc3545;
	/*#0edc8d*/
	font-size: 10px;
	font-weight: 600;
	position: absolute;
	right: 8px; /*0px;*/
	top: 26px;/*10px;*/
	padding: 0;
	height: 20px;
	line-height: 20px;
	padding-right: 14px;
	padding-left: 0px;
}

.es-tag-status-page::before {
	position: absolute;
	content: "";
	left: -20px;
	top: 0;
	border: 10px solid;
	border-color: inherit;
	/*#0edc8d*/
	border-left-color: transparent;
	height: 5px;
	width: 5px !important;
	border-left-color: transparent
}


/*================================================
 Categories Slider Area CSS
 =================================================*/


/* es-categories-ratio */

.es-categories-ratio {
	width: 100%;
	position: relative;
	background: url() 50% 50% no-repeat;
	background-size: cover;
	background-clip: content-box;
}

.es-categories-ratio:before {
	display: block;
	content: "";
	padding-top: var(--es-categories-ratio-calculator);
}


/*================================================
 Item Slider Area CSS
 =================================================*/


/* es-categories-ratio */

.es-item-slider-ratio {
	width: 100%;
	position: relative;
	background: url() 50% 50% no-repeat;
	background-size: cover;
	background-clip: content-box;
}

.es-item-slider-ratio:before {
	display: block;
	content: "";
	padding-top: var(--es-item-slider-ratio-calculator);
}

.es-bg-item-slider-size {
	background-position: center center, center center;
	background-repeat: no-repeat;
	background-size: var(--es-bg-item-slider-size);
}



.es-bg-categories-size {
	background-position: center center, center center;
	background-repeat: no-repeat;
	background-size: var(--es-bg-categories-size);
}

.Categories-title-box {
	/*position: absolute;*/
	/*bottom: 6%;*/
	/*z-index: 999 !important;*/
	/*margin: auto;*/
	/*text-align: center;*/
	/*width: 100%;*/
	/*transition: all .3s;*/
    position: absolute;
    bottom: 6%;
    z-index: 1 !important;
    margin: 0 auto;
    text-align: center;
    width: 100%;
    transition: all .3s;
    padding: 0 10px;
}

.Categories-title-box-text {
	/*background-color: #0003;*/
	/*padding: 2px 10px;*/
	/*color: #fff;*/
	/*border-radius: 5px;*/
	/*font-size: 10px;*/
	/*font-weight: bold;*/
	/*letter-spacing: normal;*/
	/*transition: all .3s;*/
    border-radius: 100px;
    transition-property: opacity,transform;
    transition-duration: 250ms;
    transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: auto;
    min-height: 30px;
    max-height: 40px;
    padding: 0 10px;
    width: 100%;
    background-color: #fff;
    color: #000;
    font-size: 12px !important;
    font-weight: 700 !important;
    transition: transform 1s;
}

.Categories-title-box:hover {
	transform: translateY(-5px);
}

.Categories-title-box:focus {
	transform: translateY(-5px);
}

.Categories-title-box-text:hover {
	background-color: #0008;
	color: #fff;
	transform: translateY(-5px);
}

.Categories-title-box-text:focus {
	background-color: #0008;
	color: #ffcb00;
	transform: translateY(-5px);
}

.item-pos-title-box-text {
    background-color: #0003;
    padding: 2px 10px;
    color: #fff;
    border-radius: 5px;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: normal;
    transition: all .3s;
}

.item-pos-title-box {
    position: absolute;
    bottom: 6%;
    z-index: 999 !important;
    margin: auto;
    text-align: center;
    width: 100%;
    transition: all .3s;
}

/*.item-pos-title-box-text {*/
/*    background-color: #0003;*/
/*    padding: 2px 10px;*/
/*    color: #fff;*/
/*    border-radius: 5px;*/
/*    font-size: 10px;*/
/*    font-weight: bold;*/
/*    letter-spacing: normal;*/
/*    transition: all .3s;*/
/*}*/
        /*================================================
        Page Title Area CSS
        =================================================*/
        .page-title-area {
          background-image: var(--es-page-title-bg-img); 
          background-color: var(--es-page-title-bg-color); 
          background-position: center center;
          background-repeat: no-repeat;
          background-size: cover;
          padding: var(--es-page-title-padding);
        }
        
        .page-title-content {
            text-align: var(--es-page-title-content);
            color: var(--es-page-title-text-color);
        }

        /*================================================
        Pages Details Area CSS
        =================================================*/  
       .pages-details-img img {
           width: calc(80% - 30%) !important;
           /*width: calc(var(--es-pages-details-img, 80%) - 30%) !important;*/
            /*width: var(--es-pages-details-img);*/
        } 
        
       .pages-details-description {
           text-align: justify;
        } 
            
        .section-title {
            text-align: var(--es-section-title);
            position: relative;
        }
        
        .section-title::before {
        left: 0;
        right: 0;
        bottom: 0;
        width: 60px;
        height: 3px;
        content: '';
        position: absolute;
        background-color: var(--main-headline-color-dark);
        margin-left: auto;
        margin-right: auto;
        } 

               
        /*================================================
        Quantity CSS
        =================================================*/   
               
               
               
        
        .quantity {
          position: relative;
        }
        
        input[type=number]::-webkit-inner-spin-button,
        input[type=number]::-webkit-outer-spin-button {
          -webkit-appearance: none;
          margin: 0;
        }
        
        input[type=number] {
          -moz-appearance: textfield;
        }
        
        .quantity input {
          width: 60px;
          height: 40px;
          line-height: 1.65;
          float: left;
          display: block;
          padding: 0;
          margin: 0;
          padding-right: 30px;
          border: none;
          box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
          font-size: 1rem;
          border-radius: 4px;
          direction: inherit;
        }
        
        .quantity input:focus {
          outline: 0;
        }
        
        .quantity-nav {
          float: left;
          position: relative;
            height: 36px;
            right: 23px;
            margin: 2px auto;
        }
        
        .quantity-button {
          position: relative;
          cursor: pointer;
          border: none;
          border-left: : 1px solid rgba(0, 0, 0, 0.08);
          width: 21px;
          text-align: center;
          color: #333;
          font-size: 13px;
          font-family: "FontAwesome" !important;
          line-height: 1.5;
          padding: 0;
          background: #FAFAFA;
          -webkit-transform: translateX(100%);
          transform: translateX(100%);
          -webkit-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          -o-user-select: none;
          user-select: none;
        }
        
        .quantity-button:active {
          background: #EAEAEA;
        }
        
        .quantity-button.quantity-up {
          position: absolute;
          height: 50%;
          top: 0;
          border-bottom: 1px solid rgba(0, 0, 0, 0.08);
          font-family: "FontAwesome";
          border-radius: 4px 0 0 0;
          line-height: 1.6
        }
        
        .quantity-button.quantity-down {
          position: absolute;
          bottom: 0;
          height: 50%;
          font-family: "FontAwesome";
          border-radius: 0 0 0 4px;
        }



.filterDiv {
  display: none; /* Hidden by default */
    -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

/* The "show" class is added to the filtered elements */
.show_filterDiv {
  display: block;
  transition: all 5s ease-in-out;
    -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  transition-duration: 0.8s;
}


/*---------------*/

.list-menu {
    list-style: none;
    margin: 0;
    padding-left: 0;
}
.list-menu a {
    color: #343a40;
}

.card-product-grid .info-wrap {
    overflow: hidden;
    padding: 18px 20px;
}

[class*='card-product'] a.title {
    color: #212529;
    display: block;
}

.card-product-grid:hover .btn-overlay {
    opacity: 1;
}
.card-product-grid .btn-overlay {
    -webkit-transition: .5s;
    transition: .5s;
    opacity: 0;
    left: 0;
    bottom: 0;
    color: #fff;
    width: 100%;
    padding: 5px 0;
    text-align: center;
    position: absolute;
    background: rgba(0, 0, 0, 0.5);
}
.img-wrap {
    overflow: hidden;
    position: relative;
}

/*---------------*/

/* Add a light grey background on mouse-over */
/*.btn:hover {*/
/*  background-color: #ddd;*/
/*}*/

/* Add a dark background to the active button */
/*.btn.active {*/
/*  background-color: #666;*/
/*  color: white;*/
/*}*/


.icons-gateways-circle {
    width: 60px !important;
    height: 60px !important;
    background-color: #fff;
    display: inline-block;
    text-align: -moz-center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icons-gateways-circle img {
    /*width: 100% !important;*/
    height: auto !important;
    max-height: 25px;
}


.bg-icon-box-01 {
    opacity: 0.05;
    z-index: 0;
    transform: rotate(-45deg);
}


/*--*/


.section-block-grey {
    padding: 90px 0px 90px 0px;
    /*background-color: #f9f9f9;*/
}

.serv-section-2 {
    position: relative;
    border: 1px solid #eee;
    background: #fff;
    border-radius: 5px;
    overflow: hidden;
    padding: 30px;
}

.serv-section-2:before {
    position: absolute;
    top: 0;
    left: 0px;
    z-index: 0;
    content: " ";
    width: 120px;
    height: 120px;
    background: #f5f5f5;
    border-bottom-right-radius: 136px;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
}

.serv-section-2-icon {
    position: absolute;
    top: 18px;
    left: 22px;
    max-width: 100px;
    z-index: 1;
    text-align: center;
}

.serv-section-2-icon i {
    color: var(--main-bg-color-dark);
    font-size: 45px;
    line-height: 65px;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
}

.serv-section-desc {
    position: relative;
}


.section-heading-line-left {
    content: '';
    display: block;
    width: 100px;
    height: 3px;
    background: var(--main-bg-color-light);
    margin-top: 15px;
    margin-bottom: 5px;
}

.serv-section-2 p {
    margin-top: 25px;
    padding-right: 50px;
}

.serv-section-2:hover .serv-section-2-icon i {
    color: #fff;
}

.serv-section-2:hover:before {
    background: var(--main-hover-bg-color-dark);
}


.serv-section-2:focus .serv-section-2-icon i {
    color: #fff;
}

.serv-section-2:focus:before {
    background: var(--main-hover-bg-color-dark);
}


/*--*/






@media only screen and (max-width: 575px) {
	.page-title-area {
		pad.bg-icon-box-01 {
    opacity: 0.05;
    z-index: 0;
    transform: rotate(-45deg);
}ding: var(--es-page-title-padding-sm);
	}
	.pages-details-img img {
		width: calc(80% - 30%) !important;
		/*width: calc(var(--es-pages-details-img-sm, 80%) - 30%) !important;*/
		/*width: var(--es-pages-details-img-sm);*/
	}
	.es-slider-ratio:before {
		display: block;
		content: "";
		padding-top: var(--es-slider-ratio-calculator-sm);
	}
	.header-main {
		padding: var(--es-header-padding-sm);
	}
	header.scrolled {
		padding: var(--es-header-padding-scrolled-sm);
	}
	.es-navbar-brand {
		max-height: var(--es-navbar-brand-sm);
	}
            .page-title-area {
              padding: var(--es-page-title-padding-sm);
            }
           .pages-details-img img {
                width: calc(80% - 30%) !important;
                /*width: calc(var(--es-pages-details-img-sm, 80%) - 30%) !important;*/
                /*width: var(--es-pages-details-img-sm);*/
            } 
}





.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link {
    color: #495057;
    border: 0px;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #0d6efd !important;
    background-color: #fff0;
    border-color: #dee2e6 #dee2e6 #fff;
    border: 0px;
	border-bottom: 2px solid #0d6efd !important;
}

.nav-tabs .nav-link {
    margin-bottom: -0px !important;
    background: 0 0;
    border: 0px solid transparent !important;

}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border: 0px;
}

.nav-link {

    transition: color .0s ease-in-out,background-color .0s ease-in-out,border-color .0s ease-in-out;
}


.modal {
    z-index: 99999 !important;
}

 :root {
 --es-main-color: #23629f;
 --es-main-color: #23629f;
 --main-headline-color-light: #fff;
 --main-headline-color-dark: #000000;
 --main-sub-headline-color-light: #fff;
 --main-sub-headline-color-dark: #00598f;
 --main-text-color-light: #fff;
 --main-text-color-dark: #343a40;
 --main-sub-text-color-light: #fff;
 --main-sub-text-color-dark: #867070;
 --main-icon-color-light: #aaecaa;
 --main-icon-color-dark: #37D749;
 --main-bg-color-light: #77d577;
 --main-bg-color-dark: #5B9BD5;
 --main-hover-text-color-light: #fff;
 --main-hover-text-color-dark: #FFC000;
 --main-hover-bg-color-light: #77d577;
 --main-hover-bg-color-dark: #FFC000;
 /*--es-main-color: #23629f;*/
 /*--main-text-color-light: #fff;*/
 /*--main-text-color-dark: #5cb85c;*/
 /*--main-icon-color-light: #aaecaa;*/
 /*--main-icon-color-dark: #77d577;*/
 /*--main-bg-color-light: #77d577;*/
 /*--main-bg-color-dark: #5cb85c;*/
 /*Header Main area*/
 /*--main-text-color-light: #fff;*/
 /*--main-text-color-dark: #0e3671;*/
 /*--main-icon-color-light: #fff;*/
 /*--main-icon-color-dark: #52c9ef;*/
 /*--main-bg-color-light: #0d6efd;*/
 /*--main-bg-color-dark: #0e3671;*/
 --es-header-bg: transition;
 --es-header-bg-scrolled: #fff; /*ffc107*/
 --es-header-text-scrolled: #000;
 --es-header-text-color: #fff;
 --es-header-padding: 5px 0px 10px 0px;
 --es-header-padding-sm: 10px 0px 5px 0px;
 --es-header-padding-scrolled: 5px 0px 10px 0px;
 --es-header-padding-scrolled-sm: 10px 0px 5px 0px;
 --es-header-position: fixed; /*fixed, sticky*/
 --es-navbar-brand: 25px;
 --es-navbar-brand-sm:30px;
 --es-navbar-brand-filte: brightness(0) invert(1);
 /*Slider Area CSS*/
 --es-slider-ratio-calculator: 35%;
 --es-slider-ratio-calculator-sm: 55vh;
 --es-bg-slider-size:cover; /* cover, contain*/
 --es-slider-title-color: #ffc107;
 --es-slider-details-color: #fff;
 --es-slider-but-text: #fff;
 --es-slider-but-bg: #20c997;
 /*Item Box Area CSS*/
 --es-ratio-calculator: 75%; /*Square: 100% Horizontal: 75% Vertical: 133.333% */
 --es-bg-item-size:cover; /* cover, contain*/
 /*Items slider Box Area CSS*/
 --es-item-slider-ratio-calculator: 133.33%; /*Square: 100% Horizontal: 75% Vertical: 133.333% */
 --es-bg-item-slider-size:cover; /* cover, contain*/
 /*Categories Box Area CSS*/
 --es-categories-ratio-calculator: 75%; /*Square: 100% Horizontal: 75% Vertical: 133.333% */
 --es-bg-categories-size:cover; /* cover, contain*/
 /*Page Title Area CSS*/
 --es-page-title-content: center;
 --es-page-title-text-color: #fff;
 --es-page-title-bg-color: #07307d ;
 --es-page-title-bg-img:  linear-gradient(to bottom, rgba(0, 0, 0, .75), rgba(0, 0, 0, .75)),url(../../images/bg-general.jpg);
 --es-page-title-padding: 100px 0;
 --es-page-title-padding-sm: 20px 0;
 /*Pages-details-area*/
 --es-pages-details-img: clamp(300px, 100%, 800px);;
 --es-pages-details-img-sm: 100%;
 --es-section-title: center;
  /*Portrait-box*/
 --es-ratio-Portrait: 120%;
 }
 .main-headline-color-light {color: var(--main-headline-color-light)}
 .main-headline-color-dark {color: var(--main-headline-color-dark)}
 .main-sub-headline-color-light {color: var(--main-sub-headline-color-light)}
 .main-sub-headline-color-dark {color: var(--main-sub-headline-color-dark)}
 .main-text-color-light {color: var(--main-text-color-light)}
 .main-text-color-dark {color: var(--main-text-color-dark)}
 .main-sub-text-color-light {color: var(--main-sub-text-color-light)}
 .main-sub-text-color-dark {color: var(--main-sub-text-color-dark)}
 .main-bg-color-light {background: var(--main-bg-color-light)}
 .main-bg-color-dark {background:var(--main-bg-color-dark)}
 .main-icon-color-light {color: var(--main-icon-color-light)}
 .main-icon-color-dark {color:var(--main-icon-color-dark)}
 .main-hover-text-color-light {color: var(--main-hover-text-color-light)}
 .main-hover-text-color-dark {color: var(--main-hover-text-color-dark)}
 .main-hover-bg-color-light {background: var(--main-hover-bg-color-light)}
 .main-hover-bg-color-dark {background:var(--main-hover-bg-color-dark)}        
 .content-centered-y {
 position: absolute;
 top: 50%;
 transform: translate(0,-50%);
 }
 /** {border: 0px solid red;}*/
 .dropdown-toggle::after {
 display: inline-block;
 margin-right: 0px;
 vertical-align:  0px;
 content: "";
 border-top:  0px solid;
 border-left:  0px solid transparent;
 border-bottom: 0px;
 border-right:  0px solid transparent;
 }
 .es-topbar {
 background-color: #081828;
 padding: 5px 0;
 }
 .es-header-main {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: space-between;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 /*padding: 25px 0;*/
 /*border-bottom: 1px solid #eee;*/
 }
 .es-header-main-icon {
 width: 36px;
 height: 36px;
 font-size: 16px;
 padding: 5px;
 /*border: 1px solid #CCC;*/
 border-radius: 100%;
 text-align: center;
 line-height: 13px;
 color:#6c757d !important;
 }
 .es-header-main-icon a,i {
 color:#6c757d !important;
 }
 .es-header-main-icon a {
 color:#6c757d !important;
 }
 /*.es-header-main-icon:hover {*/
 /*    color: #fff !important;*/
 /*    background-color: #0167F3;*/
 /*    border-color: transparent;*/
 /*}*/
 /*.es-header-main-icon a,i:hover {*/
 /*    color: #fff !important;*/
 /*}*/
 .es-header-menu {
 }

.sw-but-search {
border: 1px solid #ccc !important;
border-right: 0px !important;
background-color: #fff;
}

.sw-but-search:hover {
/*border: 1px solid #ccc !important; */
background-color: #f9f9f9;
}

.sw-but-search:focus {
/*border: 1px solid #ccc !important; */
background-color: #f9f9f9;
}

.id-section-setting_home_qpay_list_card_1{
    margin: 50px auto;
}




.es-border-gray {
    border: 2px solid #d6d4d4 !important;
}

.dropdown-menu-blury {
    backdrop-filter: blur(50px);
    background-color: #ffffffcc;
    border-color: #0000000d !important;
}

.bg-blur-10 {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.bg-blur-15 {
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
}

.color-unset {
    color: unset !important;
}




.cart-offcanvas {
    width: 280px !important;
    z-index: 999999999999 !important;
}


.box-price-area {
    height:40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.box-label-1 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 90%);
    color: #ffffff;
}


.es-tag-offer {
    color: #fff;
	background-color: #ff0000;
	font-size: 10px;
	font-weight: 600;
	position: absolute;
	left: 10px;
	top: 10px;
	padding: 0;
	height: 20px;
	line-height: 20px;
	padding-right: 10px;
	padding-left: 10px;
}


.es-tag-offer-page {
    color: #fff;
	background-color: #ff0000;
	font-size: 10px;
	font-weight: 600;
	position: absolute;
	left: 24px;
	top: 24px;
	padding: 0;
	height: 20px;
	line-height: 20px;
	padding-right: 10px;
	padding-left: 10px;
}


/* ----------- Whatsapp ---------------------*/

.whatsapp-popup {
	font-size: 14px;
	border: 0px solid #fff;
	width: 250px;
	background-color:#fff;
}

.whatsapp-popup-title {
	background-color: #22c15e;
}

.whatsapp-popup form {
	height: 35px;
	position: relative;
}

.whatsapp-popup input {
	padding: 5px 10px;
	font-weight: 300;
	font-size: 13px;
	background-color: #efefef;
	border: 1px solid #d4d4d4;
}


.trwpwhatsappall {
	position: fixed;
	z-index: 9999999999999999999;
	bottom: 0;
	right: 10px;
	font-weight: 300;
	font-size: 15px;
}

.trwpwhatsappsendbutton {
    color: #22c15e;
    cursor: pointer;
    border: none;
    background-color: transparent;
}


.trwpwhatsappsendbutton i {
	float: left;
	position: absolute;
	z-index: 999999999999;
	left: 10px;
	/*top: 11;*/
	bottom: 8px;
	font-size: 18px !important;
}

.whatsapp-close {
	position: absolute;
	left: 15px;
	top: 12px;
	font-size: 13px;
	color: white;
	cursor: pointer;
}


.whatsapp-popup-btn {
	background-color: #22c15e;
	border-radius: 50%;
	padding: 10px 15px;
	cursor: pointer;
	color: #fff;
	width: 50px;
	height: 50px;
	margin-top: 10px;
	margin-right: 15px;
	margin-bottom: 20px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	position: relative;
}

.whatsapp-popup-btn i {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff !important;
    font-size: 25px;
}

@media only screen and (max-width: 575px) {
    .trwpwhatsappall {
        margin-bottom: 70px;
    }
}


.dropdown-submenu {
  position: relative;
}

.dropdown-submenu > .dropdown-menu {
  right: 100%;
  /* -6px gives dropdown-menu's padding+border */
  top: -6px;
}

.dropdown-submenu:hover > .dropdown-menu, .dropdown-submenu > a:focus + .dropdown-menu {
  /* :focus support is incomplete - pressing Tab sets focus to submenu, but that immediately hides submenu */
  display: block;
}


.es-arrow-icon-ltr {
    transform: rotate(180deg);
}

/* AS 11-5-2023 */

a {
    color: #212529 !important;
}

.color-text-theme {
    color: #c81d33 !important;
}


.es-slider-but-bg {
  background-color: #0008;
}

.es-slider-but-bg:hover {
  background-color:  #0005;
}

.es-slider-but-text {
    color: #fff !important;
}


.es-bottom-bar a {
    color: #fff !important;
}

.pagination li a {
  padding: 8px;
  border-radius: 500px !important;
  height: 40px;
  width: 40px;
  margin: 0 5px;
  border: 0 !important;
  background: #ccc5 !important;
}

.pagination  .page-item {
    margin: 0 5px;
    border: 0 !important;
}

.pagination .page-item .active {

margin: 0 0.5px;
background: #ccc2 !important;
border: 0 !important;

}


.page-item .active > a {

margin: 0 0.5px;
background: #ccc2 !important;
border: 0 !important;

}


.active > .page-link, .page-link.active {
  border: 0 solid #63cde1;
  background: #7cd5e6 !important;
  color: #fff !important;
}


.btn-success {
  --bs-btn-color: #fff !important;
  --bs-btn-bg: #24d265 !important;
  --bs-btn-border-color: #24d265 !important;
  --bs-btn-hover-color: #fff !important;
  --bs-btn-hover-bg: #22c15e !important;
  --bs-btn-hover-border-color: #22c15e !important;
  --bs-btn-focus-shadow-rgb: 60,153,110 !important;
  --bs-btn-active-color: #fff !important;
  --bs-btn-active-bg: #22c15e !important;
  --bs-btn-active-border-color: #22c15e !important;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #22c15e;
  --bs-btn-disabled-border-color: #22c15e;
    color: #FFF !important;
}

.btn-success a i {
    color: #FFF !important;
}

.btn-outline-success {
  --bs-btn-color: #24d265 !important;
  --bs-btn-border-color: #24d265 !important;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #24d265 !important;
  --bs-btn-hover-border-color: #24d265 !important;
  --bs-btn-focus-shadow-rgb: 25,135,84;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #24d265 !important;
  --bs-btn-active-border-color: #24d265 !important;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #24d265;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #24d265;
  --bs-gradient: none;
}



.es-price {
    font-size: 16px !important;
    color: #24d265 !important;
}



.es-action {
    /*width: 150px !important;*/
    border-radius: 80px !important;
    margin: 0px auto 10px auto  !important;
}

.box-actions .btn-outline-secondary {
    /*width: 150px !important;*/
    border-radius: 50px !important;
    margin: 0px auto 10px auto !important;
    background-color: #fff;/*#e6e6e6;*/
    border: 1;
    color: #1c1c1c9;
    font-weight: normal !important;
}

.es-row-item .card-body {
  padding-top: 10px !important;
}

.es-row-item .card-body > h5 a {
    /*font-size: 16px !important;*/
    font-weight: lighter !important;
    color: #5b5b5b !important;
}


.page-title-area i {color: #FFF !important;}




/* 20230524  { */

.body-theme {
    font-family: "Poppins", sans-serif !important;
    position: relative !important;
}

.es-lang {
    font-family: "Noto Kufi Arabic", sans-serif !important;
}

.xx-small {
    font-size: xx-small;
}

.x-small {
    font-size: x-small;
}

.small {
    font-size: small;
}

.medium {
    font-size: medium;
}

.large {
    font-size: large;
}

.x-large {
    font-size: x-large;
}

.xx-large {
    font-size: xx-large;
}

.hero {
    height: 100vh;
    width: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.site-navbar {
    margin-bottom: 0px;
    z-index: 999; /*1999*/
    position: absolute;
    top: 10px;
    width: 100%;
}

.overlay {
    background-color: #0008;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: -1;
}

.overlay-1223 {
    background-color: #002d99ba;
}

.carousel-prev_next {
    width: 10% !important;
}

.header-brand-img {
    height: 35px;
    width: auto;
}

.header-brand-img-50 {
    height: 50px; 
    width: auto;
}

.es-input-icon-addon {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    color: #626976;
    pointer-events: none;
    font-size: 1.2em;
}

@media only screen and (max-width: 575px) {
    .header-brand-img {
        height: 25px;
        width: auto;
    }
}

.header-brand-filter {
    filter: brightness(0) invert(1);
}

.overlay-blur {
    background-color: #0008;
    filter:blur(2px);
    -o-filter:blur(2px);
    -ms-filter:blur(2px);
    -moz-filter:blur(2px);
    -webkit-filter:blur(2px);
    backdrop-filter: blur(2px);
}

/* 20230524  } */



.active-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0;
    z-index: 10000;
    -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
    transition: all 0.2s ease-in-out;
    height: auto;
    background-color: #fff !important;
    color: #000 !important;
} 

.active-header a,i,p {
    color: #000 !important;
} 

.top-header {
    background-color:transparent; 

}


.page-title-area-bg {
  height: 300px;
  width: 100%;
  background-size: cover;
  background-position: center center; 
  background-repeat: no-repeat;
}

.overlay-page-title {
  background-color: #0008;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

/*.page-title-area {*/
/*    z-index: 2;*/
/*margin-top: 80px;*/
/*}  */


@media only screen and (max-width: 575px) {

     .page-title-area-bg {
      height: 200px;
      width: 100%;
      background-size: cover;
      background-position: center center; 
      background-repeat: no-repeat;
    }
    
    /*.page-title-area {*/
    /*    margin-top: 60px;*/
    /*    text-align: center;*/
    /*}*/
    
    .page-title-area h1 {
        font-size: 24px;
    }
    
}


@media only screen and (max-width: 575px) {
    
     .hero {
          height: 98vh;
          width: 100%;
          background-size: cover;
          background-position: center center; 
          background-repeat: no-repeat;
        }
    
}



.organic-radius {
  border-radius: 63% 37% 30% 70%/50% 45% 55% 50%;
}


.es-footer h5 i {
  color: #fff !important;
}


.es-business-logo {
    top: -30px;
    left: 10px;
    width: 45px;
    background-size:contain;
    background-position: center;
    background-repeat: no-repeat;
}

.es-business-logo-top {
    top: 15px;
    left: 15px;
    width: 35px;
    background-size:contain;
    background-position: center;
    background-repeat: no-repeat;
}

.es-animate-hover {
    -moz-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.es-animate-hov-1 {
    -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.es-but-animate-hover{
  font-size:  20px;
  padding:  12px;
  display:  flex;
  justify-content:  center;
  align-items: center;
  width: 100%;
  /*! max-width: 120px; */
  overflow:hidden;
  height:25px;
  text-align:start !important;;

}
  
  
.es-but-container {
  display:flex;
  justify-content:start;
  align-items:start;
  flex-direction:column;
  margin-top:65px;

  width: 100% !important;
}
.es-but-container span{
  margin-bottom:20px;
}
.es-but-animate-hover:hover{
  cursor:pointer;
}
.es-but-animate-hover:hover .es-but-container {
  transform: translate(0px,-48px)!important;
}
.es-but-animate-hover:hover .es-first{
  opacity:0;
}
.es-but-animate-hover .es-last{
  opacity:0;
}
.es-but-animate-hover:hover .es-last{
  opacity:1;
}
/**********/
.es-bg-banner {
  height: 400px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}


.es-px-0-w1 {
  padding-right: 0px !important;
  padding-left: 0px !important;
}



    .es-hide {
      /*display: none;*/
      opacity: 0;
      max-height: 0px;
      overflow: hidden;
      transition: max-height 1s, opacity 400ms;
    } 

    .es-show {

       transition: transform 250ms, opacity 400ms;
    }  
    
    .es-show:hover .es-hide {
        /*display: block !important;*/
        opacity: 0.8;
        max-height: 200px;
    }  
    
/**** NEW Style ******/
     
.item {
 border: 1px solid #ccc;
 margin: 10px;
 height: 100px;
 text-align: -webkit-center;
 }  
 /*-------------------*/
 * {
 /*font-family: "Tajawal", sans-serif;*/
 /*font-family: "Noto Kufi Arabic", sans-serif;*/
 }
 /* Container for image and es-overlay */
 .es-image-container {
 position: relative;
 overflow: hidden;
 }
 /* Style for the background image with transition for zoom */
 .es-image-container img {
 width: 100%;
 height: auto;
 transition: transform 0.5s ease; /* Smooth transition for zoom effect */
 /*background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));*/
 }
 /* Zoom effect on hover & focus */
 .es-image-container:hover img {
 transform: scale(1.1); /* Zoom effect */
 }
 .es-image-container:focus img {
 transform: scale(1.1); /* Zoom effect */
 }
 .es-image-container:active img {
 transform: scale(1.1); /* Zoom effect */
 }
 /* Zoom effect on hover & focus */
 .es-image-container:hover .img-blur  {
 transform: scale(1.1); /* Zoom effect */
 filter: blur(4px);
 -webkit-filter: blur(4px);
 }
 .es-image-container:focus .img-blur  {
 transform: scale(1.1); /* Zoom effect */
 filter: blur(4px);
 -webkit-filter: blur(4px);
 }
.es-image-container:active .img-blur  {
 transform: scale(1.1); /* Zoom effect */
 filter: blur(4px);
 -webkit-filter: blur(4px);
 }
 /* Style for the es-overlay content */
 .es-overlay {
 position: absolute;
 color: white;
 background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
 padding-bottom: 30px;
 }
 /* Style for the text */
 .es-overlay h5 {
 font-size: 2rem;
 margin-bottom: 0;
 margin-top: auto;
 }
 /* Style for the overlay content */
 .es-overlay-center {
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: rgba(0, 0, 0, 0.5);
 color: white;
 display: flex;
 justify-content: center;
 align-items: center;
 opacity: 0;
 transition: opacity 0.5s ease;
 z-index: 1;
 }
 /* Show overlay on hover & focus */ 
 .es-image-container:hover .es-overlay-center {
 opacity: 1;
 }
 .es-image-container:focus .es-overlay-center {
 opacity: 1;
 }
 /*---------------------------------------*/
 .es-item-card {
 position: relative;
 border: 0px solid #ddd;
 padding: 0px;
 text-align: center;
 }
 .es-item-card img {
 width: 100%;
 }
 .es-item-card .discount, .es-item-card .hot {
 position: absolute;
 top: 10px;
 padding: 2px 8px;
 color: #fff;
 font-size: 0.8rem;
 }
 .es-item-card .discount {
 background-color: #a2e050;
 left: 10px;
 z-index: 1;
 }
 .es-item-card .hot {
 background-color: #ff6f61;
 right: 10px;
 z-index: 1;
 }
 .wrap_swap_price {
 position: relative;
 overflow: hidden;
 width: 100%;
 display: inline-block;
 }
 .wrap_swap_price .price, .wrap_swap_price .pr_atc {
 transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955);
 }
 .wrap_swap_price .price {
 transform: translateY(0);
 }
 .wrap_swap_price .pr_atc {
 position: absolute;
 top: 100%;
 left: 0;
 width: 100%;
 text-align: center;
 font-size: 1rem;
 /*font-weight: bold;*/
 color: #333;
 transform: translateY(0);
 }
 .es-item-card:hover .wrap_swap_price .price {
 transform: translateY(-100%);
 }
 .es-item-card:hover .wrap_swap_price .pr_atc {
 transform: translateY(-100%);
 }
 .es-item-card:focus .wrap_swap_price .price {
 transform: translateY(-100%);
 }
 .es-item-card:focus .wrap_swap_price .pr_atc {
 transform: translateY(-100%);
 }
 /* إخفاء العناصر الفارغة أو التي تحتوي على قيمة معينة */
 .es-empty:empty {
 display: none !important;
 }
 .es-empty-hidden {
 display: none;
 }
 /**/
 .dragging {
 box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
 border: 2px dashed #007bff;
 opacity: 0.8; /* لجعل العنصر أكثر شفافية أثناء السحب */
 }
     