/* ==========================================================================
  1. CSS RESET
  
  
  
============================================================================= */
.colorind1 {
	background-color: #001a30 !important;
color: #fff;
}
.heightI {
	height:150px !important;
}
.zoomable {
    transition: transform 0.3s; /* Smooth transition for zoom effect */
}

.zoomable:hover {
    transform: scale(1.6); /* Zoom effect on hover */
}
.zoomable2 {
    transition: transform 0.3s; /* Smooth transition for zoom effect */
}

.zoomable2:hover {
    transform: scale(1.4); /* Zoom effect on hover */
}

 .panel_1I .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#001a30;
}
.panel_1I .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#001a30;
	color:#fff;
}
.colorind2 {
	background-color: #30c0ce !important;
color: #fff;
}

 .panel_2I .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#30c0ce;
}
.panel_2I .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#30c0ce;
	color:#fff;
}
.colorind3 {
	background-color: #3d9cd6!important;
color: #fff;
}

 .panel_3I .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#3d9cd6;
}
.panel_3I .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#3d9cd6;
	color:#fff;
}




.colorind4 {
	background-color: #5d489d !important;
color: #fff;
}

 .panel_4I .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#5d489d;
}
.panel_4I .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#5d489d;
	color:#fff;
}
.colorind5 {
	background-color: #dfe0df !important;
color: #000 !important;
}

 .panel_5I .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#7b7c7b;
}
.panel_5I .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#dfe0df;
	color:#000;
}

.colorind6 {
	background-color: #dfe4f2 !important;
color: #000 !important;
}

 .panel_6I .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#8391b9;
}
.panel_6I .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#dfe4f2;
	color:#000;
}



.profile-card {
  background-color: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  border-radius: 24px;
  padding: 1rem;
  width: 17.5rem;
  height: 36rem;
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.profile-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 10rem;
  width: 100%;
  border-radius: 24px 24px 0 0;
  background-color: #dad7d7;

}
.profile-card .image {
  border-radius: 50%;
  background: linear-gradient(90deg, rgba(0,231,197,1) 0%, rgba(41,133,182,1) 50%, rgba(111,44,173,1) 100%);
  height: 12rem;
  margin-bottom: 2rem;
  padding: 0.3rem;
  width: 12rem;
  position: relative;
  z-index: 3;
}
.image img {
  border: 3px solid #fff;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 0.1rem;
  height: 100%;
  width: 100%;
}
.profile-card .text-data {
  text-align: center;
}
.text-data h2 {
  font-size: 1.7rem;
  font-weight: 500;
}
.text-data p {
  font-size: 1.2rem;
  font-weight: 400;
}
.media-icons{
  margin-top: 1.5rem;
}
.media-icons a {
  border-radius: 50%;
  color: white;
  display: inline-block;
  font-size: 2rem;
  height: 3.5rem;
  width: 3.5rem;
  padding-inline: 1rem;
  position: relative;
  margin-inline: 0.8rem;
}
.media-icons i {
 position: absolute;
 left: 50%;
 top: 50%;
 transform: translate(-50%, -50%);
}
.buttons{
  margin-top: 2.5rem;
}
.buttons button {
  background-color: #4070f4;
  border-radius: 2.4rem;
  border: none;
  cursor: pointer;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 400;
  padding: 0.8rem 2.4rem;
  margin-inline: 1.2rem;
}
.buttons button:hover {
  background-color: #152551;
}
.profile-card .analytics {
  margin-top: 2.5rem;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}
.analytics .data {
  color: #333;
  padding: 0.2rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.data i {
  font-size: 1.8rem;
  margin-right: 0.3rem;
}
.data p {
  font-size: 2rem;
}
/* media queries  */
@media (width <= 390px) {
  html {
    font-size: 56.25%;
  }
}
@media (width <= 370px) {
  html {
    font-size: 50%;
  }
}

.loading-icon3 {
    border: 4px solid #f3f3f3; /* Light grey */
    border-top: 4px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 25px;
    height: 25px;
    animation: spin 1s linear infinite;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px; /* Space between text and spinner */
}
.loading-icon2 {
    border: 4px solid #f3f3f3; /* Light grey */
    border-top: 4px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 25px;
    height: 25px;
    animation: spin 1s linear infinite;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px; /* Space between text and spinner */
}
.loading-icon {
    border: 4px solid #f3f3f3; /* Light grey */
    border-top: 4px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 25px;
    height: 25px;
    animation: spin 1s linear infinite;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px; /* Space between text and spinner */
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* Ensure checkboxes look like normal checkboxes */
.input-group input[type="checkbox"] {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	top: 2px;
}
.error-message {
	color: red;
	font-size: 12px;
}

	
	
.bottomPadding25
{
	padding-bottom : 25px;
}



.tw-green {
	color:#3d9b00;
}
.tw-red {
	color:#f70000;
}
.text-alert {
	color: #000;
	font-size:14px;
	font-weight:normal;
}
.div-padding {
	margin-top:-65px !important;
}
.sm-div-padding {
	padding-top: 20px;
padding-bottom: 20px;
}
body {
    
	font-family:"Lato",sans-serif !important;
/*	line-height:1.5;*/
	-webkit-font-smoothing: antialiased;
}

:active,
:focus { outline: none !important; }
a:focus,
a:hover {text-decoration:none;}
iframe {
	border:none !important;
}
h1, h2, h3, h4 {
	margin: 0 0 20px;
	line-height:1.5;
	font-weight: 400;
	font-family: 'Oswald', sans-serif;
}
h5, h6{
	margin: 0 0 30px;
	line-height: 1.5;
	font-weight: 400;
	font-family: "Lato",sans-serif !important;
}
.custom-font,.odometer{
	font-family: 'Oswald', sans-serif !important;
}
p{
	margin:0 0 15px;
}
img {
	max-width:100%;
}

header ul,footer ul,.top-bar ul,.lft-tools ul,.post-info ul,.recent-posts-widget ul,.center-v-menu ul,.pricing-tbl ul,.sidebar ul,ul.details,ul.comment-list,ul.list,.w-recent-posts ul{
	list-style:none;
	margin:0;
	padding:0
}
.border-radius-5px{
	border-radius: 5px !important;
}
.header-1 .top-nav > ul > li > a > span:before,.skew-nav > ul > li > a > span:before,.icon-box-1 .box-number span:after,.post-item .post-image:after,.post-item .lft-tools:before,.p-style2 figure:after,.p-style3 figure:after,.team-box.box-1 .team-img span,.rect-angles:before,
.rect-angles:after,.rect-angles span:before,.rect-angles span:after,.team-box.box-1 .team-socials:after,.header-2 .top-nav > ul > li > a:before,.icon-bg:after,.icon-border:after,.steps-2 .step-title:after,.steps-4 .step-line:before{
	position:absolute;
	content:"";
	width:100%;
	height:100%;
	top:0;
	left:0;
	display:inline-block
}
.header-1.skew .top-nav > ul > li > a:after,.skew-nav > ul > li > a:after, .header-1.skew .top-search:before, .header-1.skew .top-cart > a:before,.header-1.skew .top-nav > ul > li > a:before,.header-1.skew .logo:before, .header-1.skew .top-search > a:before,
.header-1.skew .top-cart:before,.header-2.boxed .logo:after,.icon-boxes-1:before,.icon-boxes-1:after,.icon-box-2 .icon-desc:after,.icon-box-3:after,.header-2.boxed .logo:before,.icon-box-3 .icon-desc:before,.footer-top .skew-btn:after,.skew-nav > ul > li > a:before{
	width: 0;
	height: 0;
	border-style: solid;
	
	position:absolute;
	display:inline-block
}
.f-left{
	float:left;
}
.f-right{
	float:right;
}
.f-none{
	float: none !important;
}
.fx{
	opacity: 0
}
.animated{
	opacity: 1
}
.page-loader{
	background-color: #fff;
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 99999
}

/* =========================================================================
	3.HEADER STYLE.
============================================================================ */
/*
-------------- 3.1. Top bar. ------------- */
.top-bar {
	min-height: 40px;
	position:relative;
	z-index: 9;
}
.top-bar ul li,.absolute-top-bar ul li,.top-bar .social-list a i {
	float: left;
	line-height: 25px;
	position:relative;
	padding: 0 10px;
	font-size:11px;
	border-left: 1px rgba(0,0,0,0.06) solid !important;
}
.top-bar ul li:hover,.absolute-top-bar ul li:hover{
	background-color: rgba(0,0,0,0.03)
}
.top-bar ul li:last-child,.absolute-top-bar ul li:last-child,.top-bar .social-list a:last-child i {
	border-right: 1px rgba(0,0,0,0.06) solid !important
}
.top-bar.black-bg ul li,.top-bar.dark-bg ul li,.top-bar.dark ul li,.absolute-top-bar.black-bg ul li,.absolute-top-bar.dark-bg ul li,.absolute-top-bar.dark ul li,.top-bar.dark-bg .social-list a i,.top-bar.dark .social-list a i,
.top-bar.black-bg .social-list a i{
	border-left: 1px rgba(255,255,255,0.2) solid !important
}
.top-bar.black-bg ul li:last-child,.top-bar.dark-bg ul li:last-child,.top-bar.dark ul li:last-child,.absolute-top-bar.black-bg ul li:last-child,.absolute-top-bar.dark-bg ul li:last-child,.absolute-top-bar.dark ul li:last-child,
.top-bar.black-bg .social-list a:last-child i,.top-bar.dark-bg .social-list a:last-child i,.top-bar.dark .social-list a:last-child i{
	border-right: 1px rgba(255,255,255,0.2) solid !important
}
.top-bar.black-bg ul li:hover,.top-bar.dark-bg ul li:hover,.top-bar.dark ul li:hover,.absolute-top-bar.black-bg ul li:hover{
	background-color: rgba(255,255,255,0.1)
}
.top-bar ul li,.top-bar .lbl-txt {
	line-height: 40px;
	padding-right: 10px;
	font-size: 12px
}
.top-bar ul ul li,.absolute-top-bar ul ul li{
	float:none;
	line-height:normal;
}
.dropdown-menu {
	min-width: 160px;
	padding: 0;
	margin: 0;
	border: 1px solid rgba(0,0,0,.09) !important;
}
.top-bar ul ul li:first-child a{
	border-top:0
}
.top-bar i,.absolute-top-bar i,.list li i {
	margin-right: 8px;
}
.top-bar ul > li > a,.absolute-top-bar > ul > li > a {
	display:inline-block;
}
.top-bar-search input[type=text]{
	border:0;
	line-height: 26px;
	font-size:12px;
	padding:0 10px;
	background-color: transparent;
}
.top-bar-search button {
	border:0;
	width:30px;
	height:20px;
	line-height:20px;
	text-align:center;
	background-color:transparent;
	font-size:12px
}
.top-bar .social-list a i{
	width: 40px;
	height: 40px;
	line-height: 40px;
	margin: 0;
	font-size: 15px
}
.top-bar .social-list2 a i{
	width: 15px;
	height: 15px;
	line-height: 15px;
	margin: 0;
	font-size: 10px
}
.lbl-txt{
	display: inline-block;
	float: left;
}
.language-selector .dropdown-menu{
	min-width: 100px;
	border-radius: 5px;
	border: 0 !important;
}
.language-selector .dropdown-menu li{
	margin: 0 !important;
	padding: 0;
	border: 0 !important;
	float: none;
}
.language-selector .dropdown-menu li a{
	display: block !important;
	padding: 5px 15px !important
}
.top-bar.main-bg .language-selector .dropdown-menu li:not(.active) a{
	color:#333;
}
/*
-------------- 3.2. Top Head. ------------- */
.top-head{
	position: relative;
	-webkit-transition: height .4s ease, opacity .3s ease;
	-o-transition: height .4s ease, opacity .3s ease;
	transition: height .4s ease, opacity .3s ease;
}
.top-head:after{
	clear:both;
	display:table;
	content:" ";
}
.top-head.fixed-head{
	position: fixed;
	z-index: 9;
	width: 100%;
	left: 0;
}
.top-head.absolute-head{
	position: absolute;
	z-index: 9;
	width: 100%;
	left: 0;
}

.top-head .container {
	position:relative;
}
.top-head .responsive-nav{
	float:left
}
.top-head .logo {
	position:relative;
	float:left;
}
.top-head .logo a{
	display:block
}
.top-head .logo img{
	height:49px;
}
/*
----------------- top nav ------------------ */

.top-nav {
	float:left;
	min-height:1px;
       
}


.top-nav li {
	position:relative;
   
}
.top-nav li i {
	margin-right:8px;
	font-size:12px
        
}
.top-nav > ul > li {
	float:left;
	padding: 0;
     
}
.top-nav > ul > li > a {
	font-weight:500;
	position: relative;
	display:block;
	margin: 0;
     z-index: 1000 !important; 
}
.top-head.simple{
	margin-top: 20px
}
.top-head.simple.dark .top-nav > ul > li > a{
	color:#fff;
}
.top-head.header-1 .top-nav > ul > li > a {
	margin: 0 7px 0 0;
}
.top-nav > ul > li > a > span, .top-nav > ul > li > span > a > span {
	line-height:60px;
	display:block;
	position:relative;
	padding:0 5px
}
.top-nav ul li ul li,.top-head .top-cart .cart-box{
	-webkit-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.2);
}
.top-nav ul li ul {
	position:absolute;
	top:100%;
	left:0;
	min-width:220px;
	z-index: 9;
	max-height: 0;
	-webkit-transition: max-height 1ms linear 1s;
	-moz-transition: max-height 1ms linear 1s;
}
.header-1.skew .top-nav ul li ul{
	left: 15px
}
.top-nav ul li:hover > ul{
	z-index: 10;
	/*max-height: 2000px;*/
	-webkit-transition: none;
	-moz-transition: none;
}
.top-nav ul li ul:after{
	clear:both;
	display:table;
	content:" "
}
.top-nav ul ul ul,.header-1.skew .top-nav ul ul ul {
	top:-2px;
	left:100%;
}
.top-nav ul ul li{
   
	opacity: 0;
	-webkit-transition: opacity .4s, -webkit-transform .6s, max-height .6s;
	transition: opacity .4s, transform .6s, max-height .6s;
	border-top:1px rgba(255,255,255,.2) solid;
	border-bottom:1px rgba(0,0,0,.1) solid;
}

.top-nav ul li:hover > ul > li, .top-nav ul li:focus > ul > li {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
.top-nav ul li ul li {
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transform: scale(1,0);
	transform: scale(1,0);
}
.top-nav > ul > li.hasChildren > a > span:after {
	display:inline-block;
	position:relative;
	font:normal normal normal 8px/1 FontAwesome;
	content:"\f078";
	margin-left:5px;
	top:-1px;
}
.top-nav > ul > li.hasChildren:hover > a > span:after,.rot-lft {
	-webkit-transform:rotate(-180deg);
	transform:rotate(-180deg);
}
.top-nav ul li li.hasChildren > a:before {
	content:"\f105";
	float:right;
	display:inline-block;
	position:relative;
	font:normal normal normal 12px/1 FontAwesome;
	top:3px
}
.top-nav li li a {
	display:block;
	padding:13px 15px;
	position:relative;
	overflow:hidden
}
.top-nav li li.selected > a{
	
	background-color:rgba(0,0,0,.1)
}
.top-nav li li a:after{
	background-color: rgba(0,0,0,.2);
	content: "";
	height: 100%;
	left: -140%;
	opacity: .2;
	position: absolute;
	top: 0;
	transform: skew(-38deg, 0deg) ;
	-webkit-transform: skew(-38deg, 0deg) ;
	-webkit-transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1);
	transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1);
	width: 120%;
	border-right:15px #fff solid
}
.top-nav li li:not(.selected):hover > a:after{
	left: -8%;
	-webkit-transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1);
	transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1);
}
.top-nav li li:hover > a{
	padding-left:20px
}
.top-nav > ul > .mega-menu {
	position:static;
}
.top-nav .mega-menu > ul {
	left:15px;
	right: 15px
}
header.full .top-nav .mega-menu > ul {
	left:30px;
	right: 30px
}
.top-nav .mega-menu ul ul li{
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity: 1;
	-webkit-box-shadow: none;
	box-shadow: none;
	background-color: transparent !important;
}
.top-nav .mega-menu li[class*="col-"]{
	border-top: 0 !important;
}
.top-nav ul li ul li:first-child{
	border-top-width: 2px;
	
}
.top-nav .mega-menu ul ul ul li a{
	padding: 11px 15px
}
.top-nav .mega-menu .mega-content{
	padding:30px;
	border-top: 2px #ddd solid
}
.top-nav .mega-menu > ul > li,.top-nav .mega-menu .mega-content > div > ul > li{
	border-bottom:0 !important
}
.top-nav .mega-menu .mega-content ul li:first-child{
	border-top:0 !important
}
.top-nav .mega-menu .mega-content ul li:last-child{
	border-bottom:0 !important
}
.top-nav .mega-menu hr{
	border-top-color:rgba(255,255,255,0.3);
}
.top-nav .mega-menu .custom-content a{
	display:inline;
	padding:0;
	border:0
}
.top-nav .mega-menu .custom-content a:after{
	display:none
}
.mega-content .nav-tabs li,.mega-content .nav-tabs li a{
	border:0 !important;
	margin: 0 !important
}
.mega-content .nav-tabs a:after{
	display:none
}
.mega-content .tab-content{
	padding:0 15px;
	background-color: rgba(0,0,0,.1);
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border-top-left-radius: 5px;
}
.mega-content .nav-tabs>li.active>a, .mega-content .nav-tabs>li.active>a:focus, .mega-content .nav-tabs>li.active>a:hover{
	border:0;
	background-color: rgba(0,0,0,.1);
	color: #fff;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
.dark-sub .mega-content .tab-content,.dark-sub .mega-content .nav-tabs>li.active>a, .dark-sub .mega-content .nav-tabs>li.active>a:focus, .dark-sub .mega-content .nav-tabs>li.active>a:hover{
	background-color: rgba(255,255,255,.06);
}
.dark-sub.top-nav .mega-menu > ul > li h4{
	color:#fff;
}
.top-nav .mega-menu ul ul {
	position:static;
	display:block;
	box-shadow:none;
	width:auto;
	border-bottom:0;
	max-height:1000px;
	background-color: transparent;
}
.top-nav .mega-menu > ul > li h4 {
	font-size: 15px;
	padding: 20px 10px 10px;
	border-bottom: 1px rgba(0,0,0,.1) solid;
	margin: 0;
}
.top-nav .mega-menu > ul > li,.top-nav .mega-menu > ul > li > ul > li:last-child{
	border-bottom:0
}
.top-nav > ul > li > ul.rit-menu {
	right:0;
	left:auto !important;
}
.top-nav ul.rit-menu li.hasChildren > a:before{
    content: "\f104";
}
.top-nav ul li ul li > ul.rit-menu {
	right:100%;
	left:auto !important;
}
.top-nav ul ul ul ul.rit-menu li:first-child{
	border-top:3px rgba(255,255,255,.8) solid;
}
.top-nav ul ul ul ul.rit-menu li:not(.selected) > a{
	background-color: rgba(255,255,255,0.1);
}
.top-nav.tbl > ul{
	display: table;
	margin: auto;
}
.top-nav.tbl .top-cart .cart-num{
	top: 14%;
	right: -2px;
}
.top-nav ul li ul.mini-cart-list{
	position: static !important;
	max-height: 10000px !important
}
.top-nav ul li ul.mini-cart-list li{
	opacity: 1 !important;
	transform: scale(1);
	box-shadow: none;
	background: transparent;
	color: inherit;
}
.top-nav ul li ul.mini-cart-list li a{
	color:inherit;
	padding: 0
}
.top-cart .cart-num.main-bg{
	color: #fff
}
/*
-------------- top search & cart ------------------ */
.top-head .top-search,.top-bar-search {
	margin: 0 0 0 3px;
	float:left;
	position:relative;
}
.top-head .top-search > a {
	font-weight:bold;
	display: inline-block;
	position: relative;
	z-index: 1;
	float: right;
	padding: 0 15px;
	font-size: 12px;
	line-height:65px
}
.top-search .search-box {
	padding: 0;
	line-height:1;
	z-index:999;
	display:none;
	position: absolute;
	top: 100%;
	right: 0;
	width: 300px;
}
.top-head.header-1 .search-box{
	top: 0;
	margin-right: 40px;
	width:0px;
	position: relative;
}
.header-2.right-logo .top-search .search-box{
	right: auto;
	left: 0
}
.top-search.short,.top-cart.short{
	padding: 20px 0 15px
}
.top-search.short > a,.top-cart.short > a{
	line-height: 40px !important;
	border-radius: 3px;
}
.top-cart.short .cart-box {
	padding: 20px;
    position: absolute;
    margin-right: 0;
    top: 100%;
    right: 0;
    margin-top: 20px;
}
.top-search input[type=text]{
	width:30%;
	border:0;
	line-height: 40px;
	font-size:12px
}
.top-search .search-box input[type=text]{
	width: 100%;
	font-size: 14px;
	padding: 0 15px;
	line-height: 55px;
	background-color: transparent;
	color:#fff;
	text-transform: uppercase;
}
.top-head.header-1 .search-box input[type=text]{
	line-height: 45px;
	width: 96%
}
.header-2 .top-nav > ul > li > a > span, .header-2 .top-nav > ul > li > span > a > span,.header-2 .top-cart > a,.header-2 .top-search > a{
	line-height:55px !important
}
.top-search .search-box button {
	border:0;
	width:25px;
	height:25px;
	line-height:25px;
	text-align:center;
	background-color:transparent
}
.header-1 .top-search{
	margin-bottom:18px !important
}
.actsrch > a > span,.ac-search > a > span{
	font-size:14px;
	line-height:45px;
	
}
.top-head .top-cart {
	float:right;
	margin: 0 0 0 7px;
}
.top-head .top-cart > a {
	font-weight:bold;
	position:relative;
	padding: 0 15px;
	z-index: 1;
	display: block;
	line-height:65px
}
.top-cart .cart-num {
	display:inline-block;
	font-style:normal;
	line-height: 13px;
	position:absolute;
	border-radius:50%;
	top: 30%;
	right: 4px;
	font-size: 9px;
	font-weight:normal;
	width: 15px;
	text-align: center;
	height: 15px;
}
.header-2.boxed .top-cart .cart-num{
	top:15px
}
.top-cart {
	position:relative;
}
.top-cart .cart-box {
	position:absolute;
	top:100%;
	right:0;
	min-width:275px;
	padding:20px;
	min-height:200px;
	z-index:99;
	display:none;
	border-width:0 3px 3px 3px;
	border-style:solid
}
.header-1:not(.sticky-nav) .top-cart .cart-box{
	margin-top: 18px;
	right: -15px;
}
.cart-box .empty {
	line-height:160px;
	text-align:center;
	color:#f00;
}
.mini-cart-list li {
	position:relative;
	overflow:hidden;
	padding: 15px;
	padding-left: 0;
	font-size:11px;
	border-top: 1px rgba(0,0,0,.15) dashed;
}
.mini-cart-list li:first-child{
	border-top:0;
}
.mini-cart .cart-body {
	padding-right:10px;
	line-height:1.7;
}
.cart-mini-lft {
	float:left;
	margin-right:8px;
}
.cart-mini-lft img {
	width:40px;
	padding:1px;
}
.mini-cart-list a.remove {
	position:absolute;
	left: 0px;
	top: 9px;
	background-color: #f00;
	color: #fff;
	line-height: 1;
	padding: 1px 3px 2px;
	border-radius: 3px;
	font-size: 10px;
}
.mini-cart-total {
	padding: 10px 0 10px;
	font-weight:400;
	overflow:hidden;
	font-size:11px;
	border-top: 1px rgba(0,0,0,.15) solid;
	border-bottom: 1px rgba(0,0,0,.15)solid;
}
.mini-cart-total .clearfix {
	padding:5px 0;
	overflow:hidden;
}
.mini-cart-total .total {
	margin-top:10px;
	padding-top:15px;
	border-top: 1px rgba(0,0,0,.15) dashed;
}
.mini-cart .checkout {
	text-align:center;
	padding-top:15px;
}
.mini-cart .checkout a {
	margin:0 3px;
	height:35px;
	display:inline-block;
	line-height:33px;
	padding:0 15px;
}
.logo-sm{
	padding: 20px;
	margin: auto;
	display: table;
}
.last{
	margin-right: 0 !important
}
/*
-------------------------- Skew Header ------------------- */
.header-1{
	padding: 27px 0 0;
	position: relative;
	z-index: 8;
}
.header-1.dark .top-nav > ul > li > a{
	color:#ccc
}
.header-1:not(.sticky-nav):before, .skew-nav:before{
	height:45px;
	position:absolute;
	left:0;
	top:28px;
	width:100%;
	content:"";
}
.header-1:not(.sticky-nav) .top-nav > ul > li{
	padding-bottom:26px
}
.header-1 .top-nav > ul > li > a > span{
	line-height: 44px;
}
.header-1 .top-nav > ul > li > a > span:before,.skew-nav > ul > li > a > span:before{
	bottom: -6px;
	top:auto;
	height: 51px;
	z-index:-1;
}
.header-1.skew .top-nav > ul > li > a:after, .header-1.skew .top-search:before, .header-1.skew .top-cart > a:before,.skew-nav > ul > li > a:after{
	border-width: 0 2px 4px 4px;
	top: -2px;
	left: -16px;
}
.header-1.skew .top-nav > ul > li > a:before, .skew .logo:before,.header-1.skew .top-search > a:before,.header-1.skew .top-cart:before,.skew-nav > ul > li > a:before{
	border-width: 4px 4px 0 2px;
	bottom: -6px;
	right: -16px;
}
.header-1:not(.sticky-nav) .logo{
	position:relative;
	margin-top: -27px;
	padding: 0 10px;
	min-width: 200px;
	min-height: 77px;
	text-align: center;
}

.header-1:not(.sticky-nav) .logo a{
	display: table-cell !important;
	width: 100%;
	height: 77px;
	vertical-align: middle;
}
.header-1.skew:not(.sticky-nav) .logo{
	padding: 0 15px 0 25px;
}
.head-border{
	height: 2px;
	 
}
.header-1.skew .logo:before{
	bottom: 0px;
	right: -6px;
	border-width: 4px 6px 0 0px;
}
.header-1 .top-search:after,.header-1 .top-cart:after{
	position:absolute;
	content:""
}
.header-1:not(.sticky-nav) .top-nav > ul > li:hover > a > span:before,.header-1:not(.sticky-nav) .top-nav > ul > li.selected > a > span:before{
	height: 77px;
	-webkit-box-shadow: 0px 3px 3px -1px rgba(0,0,0,0.26);
	box-shadow: 0px 3px 3px -1px rgba(0,0,0,0.26);
}
.header-1.skew .top-nav > ul > li:hover > a > span:before,.header-1.skew .top-nav > ul > li.selected > a > span:before{
	left: -6px;
}
.header-1 .top-search > a,.header-1 .top-cart > a{
	height: 52px;
	line-height: 45px;
	padding:0 15px
}
.header-1:not(.sticky-nav) .top-search:after,.header-1:not(.sticky-nav) .top-cart:after{
	width:100%;
	position:absolute;
	left:0;
	top: -2px;
	/* height: 100%; */
	z-index: 0;
}
.header-1:not(.sticky-nav) .top-nav > ul > li > a > span:before,.header-1:not(.sticky-nav) .logo,.skew-nav > ul > li > a > span:before,.header-1:not(.sticky-nav) .top-search:after,.header-1:not(.sticky-nav) .top-cart:after{
	-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.26);
	box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.26);
}
.header-1.skew .top-search > a:before,.header-1.skew .top-cart:before{
	bottom:2px;
	border-width: 4px 4px 0 2px;
	right: -15px;
}
.header-1.skew .top-nav > ul > li:hover > a:after,.header-1.skew .top-nav > ul > li.selected > a:after{
	display:none
}
.header-1 .logo img{
	position:relative;
	z-index:2;
	max-height:65px
}
.skew:not(.sticky-nav) .logo,.header-1.skew .top-nav > ul > li > a > span:before,.skew-nav > ul > li > a > span:before,.header-1.skew .top-search:after,.header-1.skew .top-cart:after,.skew-btn{
	transform: skew(25deg, 0deg);
	-webkit-transform: skew(25deg, 0deg);
}
.skew-btn span,.skew:not(.sticky-nav) .logo a{
	transform: skew(-25deg, 0deg);
	-webkit-transform: skew(-25deg, 0deg);
	display:block
}
.skew .top-cart .cart-num {
	line-height: 13px;
	top: 3px;
	right: 10px;
}
.top-nav li i.shown{
	margin:0;
	font-size:16px
}
.top-nav > ul > li.selected > a > span > i,.top-nav > ul > li:hover > a > span > i{
	color:#fff
}
/*
-------------------------- Header 2 ------------------- */
.header-2 {
	border-bottom:0 !important;
}
.header-2.boxed.dark > .container,.header-2.boxed.dark .logo{
	background-color:#222
}
.header-2.boxed.dark:not(.sticky-nav) > .container:not(.top-bar-cont), .header-2.dark.boxed:not(.sticky-nav) .logo {
    border: 1px #444 solid;
}
.header-2.dark .top-nav > ul > li, .header-2 .top-cart, .header-2.dark .top-search, .header-2.dark .top-nav > ul > li,.header-2.dark .top-nav > ul > li, .header-2.dark .top-cart, .header-2.dark .top-search, .header-2.dark .top-nav > ul > li{
	border-left: 1px #444 solid;
}
.header-2.dark.center-logo .responsive-nav{
	border-color:#444
}
.header-2.boxed:not(.sticky-nav) > .container:not(.top-bar-cont){
	margin-top:37px;
	padding-right:0;
}
.header-2:not(.sticky-nav) > .container:not(.top-bar-cont):before,.top-head.box-head.light-head > .container:not(.top-bar-cont):before,.top-head.box-head.dark-head > .container:not(.top-bar-cont):before{
	height:4px;
	position:absolute;
	left:8px;
	width:98.5%;
	content:"";
	bottom:-4px
}
.header-2 .top-nav > ul > li{
	padding:0
}
.header-2.dark .top-nav > ul > li > a,.header-2.dark .top-search > a,.header-2.dark .top-cart > a{
	color:#ccc
}

.header-2 .top-nav .mega-menu > ul{
	left:0
}
.header-2 .top-cart,.header-2 .top-search{
	margin-left:0
}
.header-2 .logo{
	padding:15px 0
}
.header-2.boxed .logo{
	margin-top:-35px;
	margin-left:-16px;
	padding:15px;
	border-bottom:0 !important
}
.header-2.boxed .logo:after{
	border-width: 80px 0 0 8px;
	right:-8px;
	bottom: -9px;
}
.header-2.boxed .logo:before{
	border-width: 70px 0 0 15px;
	right:-15px;
	bottom: -9px;
}
.header-2.right-logo .logo:after{
	border-width: 80px 0 0 8px;
	left:-8px;
	-webkit-transform:rotateX(-360deg) !important;
	transform:rotateX(-360deg) !important;
}
.header-2.right-logo .logo:before{
	border-width: 70px 0 0 15px;
	left:-15px;
	-webkit-transform:rotateX(-360deg) !important;
	transform:rotateX(-360deg) !important;
}
.absolute-top-bar.right-pos{
	position:absolute;
	right: 0;
	top: 5px;
}
.header-2 .top-nav > ul > li > a:before{
	top:auto;
	bottom:0;
	height:0
}
.header-2 .top-nav > ul > li:hover > a:before{
	height:100%
}
.top-head.center-logo .logo{
	display:table;
	float:none;
	margin:0 auto 20px
}
.header-2.center-logo .responsive-nav{
	display:table;
	float:none;
	margin:0 auto;
	border-style:solid;
	border-width:1px 1px 0 0
}
.top-head.center-logo .responsive-nav{
	display:table;
	float:none;
	margin:0 auto;
}
.header-1.center-logo .top-nav > ul > li:hover > a > span:before, .header-1.center-logo .top-nav > ul > li.selected > a > span:before{
	height:51px;
	left:0
}
.top-head.center-logo.header-1:before{
	top:auto;
	bottom:23px
}
.center-logo.header-1.skew .logo:before{
	display:none
}
.top-bar-search{
	margin: 0 3px 0 0;
}
.top-head.right-logo .top-search{
	margin: 0 9px 0 0;
}
.header-2.center-logo.boxed > .container:not(.top-bar-cont){
	border: 0 !important;
	margin-top: 20px;
}
.header-2.center-logo.boxed .logo{
	margin-bottom:0
}
.header-2.center-logo.boxed .logo:before,.header-2.center-logo.boxed .logo:after{
	bottom:0
}
.top-head.right-logo .logo,.top-head.right-logo .top-nav,.top-head.right-logo .top-cart,.top-head.right-logo .top-search{
	float:right;
}
.top-head.right-logo .responsive-nav,.top-head.right-logo .responsive-nav .f-right{
	float:left;
}
.top-head.right-logo .top-cart .cart-box{
	right:auto;
	left:0
}
.top-head.right-logo .top-cart{
	margin:0 7px 0 0
}
.header-2.right-logo.boxed > .container:not(.top-bar-cont){
	padding-left:0
}
.header-2.right-logo > .container:not(.top-bar-cont){
	border-left:0
}
.header-2.right-logo.boxed .logo{
	margin-left:0;
	margin-right:-1px
}
.header-2.boxed .logo:after,.header-2.boxed .logo:before{
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
}
.pageWrapper:not(.boxed) .top-head.full > .container{
	width:100%;
	padding-right:20px;
	padding-left:20px
}
.top-head.header-2.full > .container{
	padding-left:29px
}
.
/*
--------------- transparent header ------------- */
.top-head.transparent .logo{
	padding:10px 20px 10px 0;
}
.top-head.transparent:not(.sticky-nav) .top-nav > ul > li > a{
	font-weight: 900;
	text-transform: uppercase;
	margin: 0;
	font-size: 13px;
}
.top-head:not(.sticky-nav).semi.transparent.light,.top-bar.semi.transparent.light{
	background-color:rgba(255,255,255,.4);
}
.lit-trans-bg{
	background-color:rgba(255,255,255,.1);
}
.top-bar.transparent.dark a,.top-head.dark .absolute-top-bar,.top-head.dark .absolute-top-bar a {
	color:#fff;
}
.top-head:not(.sticky-nav).semi.transparent.dark,.top-bar.semi.transparent.dark{
	background-color:rgba(0,0,0,.4);
}
.top-head:not(.sticky-nav).minimal .logo{
	padding:15px 0
}
.top-head.minimal .top-nav > ul > li > a{
	margin:0
}
.top-nav.with-icons > ul > li > a,.top-nav.boxes > ul > li > a{
	margin: 8px 1px !important;
	border-radius: 3px;
}
.top-nav.with-icons > ul > li > a > span{
	line-height: 43px !important;
	padding-top: 20px;
}
.top-nav.with-icons > ul > li > a > span i{
	display: block;
	position: absolute;
	left: 50%;
	top: 12px;
	margin-bottom: 10px;
	width: 30px;
	font-size: 15px;
	margin-left: -15px;
	text-align: center;
}
.top-nav.with-icons .top-search.short .search-box{
	margin-top: 19px !important
}
.top-nav.boxes > ul > li > a{
	margin: 20px 0 20px 2px !important;
}
.top-nav.boxes > ul > li > a > span{
	line-height: 40px !important;
}
.top-nav.with-borders > ul > li > a{
	border: 1px #eee solid;
	margin: 20px 0 20px 5px !important;
}
.top-nav.with-borders > ul > li > a > span{
	line-height: 38px !important;
}
.sm-head .top-nav > ul > li > a > span,.top-head.sm-head .top-search > a,.top-head.sm-head .top-cart > a{
	line-height: 55px !important;
}
.responsive-nav.full-nav{
	float: none !important;
	width: 100%
}
/*
--------------------- header left -------------------- */
.side-wrap{
	margin:0 !important;
	width:auto !important;
	position:relative
}
.left-s.side-wrap{
	margin-left: 280px !important;
}
.right-s.side-wrap{
	margin-right: 280px !important;
}
.header-left,.header-right{
	position:fixed;
	left:0;
	top:0 !important;
	width:280px;
	height:100%;
	z-index:999;
	border-bottom:0 !important;
	padding:40px 0 20px;
}
.side-wrap .rev_slider_wrapper{
	width: 100% !important;
	left: 0 !important;
}
.header-left .container,.header-right .container{
	width:auto;
	padding: 0;
	position: static;
}
.header-left .responsive-nav,.header-right .responsive-nav{
	display:block;
	float:none
}
.header-right{
	left:auto;
	right:0;
}
.header-left .logo,.header-right .logo{
	display:table;
	margin:auto;
	float:none;
	padding:10px 0
}
.side-nav{
	padding: 40px 30px;
}
.side-nav ul li {
	position: relative;
	margin: 0;
}
.side-nav ul li a {
	display: block;
	text-transform: uppercase;
	overflow: hidden;
	font-weight: bold;
	padding:13px 0;
	border-bottom:1px rgba(0, 0, 0, 0.15) solid
}
.black-bg .side-nav ul li a {
	border-bottom:1px rgba(255,255,255,.1) solid
}
.header-left .top-search,.header-right .top-search {
  border: 1px rgba(0, 0, 0, 0.1) solid ;
}
.black-bg.header-left .top-search,.black-bg.header-right .top-search,.dark-bg.header-left .top-search,.dark-bg.header-right .top-search {
  border: 1px rgba(255, 255, 255, 0.1) solid;
}
.side-nav ul li a i{
	font-size:14px;
	margin-right:10px
}
.side-nav li.hasChildren:after {
	position: absolute;
	top: 15px;
	right: 0;
	display: inline-block;
	content: "\f105";
	font-family: FontAwesome;
	-webkit-transition: transform 0.3s linear;
	transition: transform 0.3s linear;
}
.side-nav li.hasChildren:hover:after {
	-webkit-transform: rotate(-180deg);
	transform: rotate(-180deg);
}
.side-nav li li.hasChildren:after {
	top: 12px;
	right: 10px;
}
.header-left .top-search,.header-right .top-search{
	display:table;
	width: 100%;
	margin: 0 auto 15px;
	padding: 0 0 0 10px;
	clear: both;
}
.header-left .top-search a,.header-right .top-search a{
	line-height:1
}
.header-left .search-box,.header-right .search-box{
	position:static
}
.header-left .top-search input[type=text], .header-right .top-search input[type=text]{
	border:0;
	height: 36px;
	background:transparent;
	width: 82%;
	padding:0
}
.header-left .top-search .no-bg-btn, .header-right .top-search .no-bg-btn{
	border:0;
	background:transparent;
	width: 18%;
	line-height: 39px;
	font-size: 12px;
	padding: 0;
	height: 39px;
}
.header-right .side-nav ul li a{
	text-align:right
}
.header-right .side-nav > ul ul {
	right:100%;
	left:auto
}
.header-right .side-nav li.hasChildren:after {
	left: 0;
	content: "\f104";
	right:auto
}
.header-right .side-nav li i{
	float:right;
	margin: 4px 0 0 10px;
}
.header-right .side-nav li li.hasChildren:after {
	left: 15px;
}
.side-header-bottom{
	text-align:center;
	font-size:12px;
	padding: 30px;
}
.side-header-bottom .social-list{
	display:table;
	margin:20px auto;
	clear: both;
}
.side-nav li.dl-subviewopen:after,.side-nav li.dl-subview:after{
	display:none
}
.side-nav li.dl-back a{
	font-size:12px;
	padding: 8px 0;
}
.side-nav li.dl-back a:before{
	font: normal normal normal 14px/1 FontAwesome;
	content: "\f177";
	display: block;
	margin: 2px 10px 0 0;
	float: left;
}
.header-right .side-nav li.dl-back a:before{
	margin: 2px 0 0 10px;
	float: right;
	content: "\f178";
}
.side-head-menu{
	margin: 0 auto 20px !important;
	overflow: hidden;
}
.side-head-menu li{
	float: left;
	margin: 1px 1px 0 0
}
.side-head-menu li a{
	display: inline-block;
	padding: 4px 7px;
	border:1px #eee solid;
}
.header-left.dark,.header-right.dark{
	background-color: #333;
	color:#ccc;
}
.header-left.dark a,.header-right.dark a{
	color:#ccc;
}
.header-left.dark .side-head-menu li a,.header-right.dark .side-head-menu li a,.header-right.dark .side-head-menu,.header-left.dark .side-head-menu{
	border-color: #555
}
.header-left.dark .side-nav ul li a,.header-right.dark .side-nav ul li a,.header-left.dark .top-search, .header-right.dark .top-search{
	border-color: rgba(255, 255, 255, 0.1);
}
/****/
.top-shop-links{
	margin: 25px 0 0
}
.top-shop-links i{
	display: inline-block;
	width: 35px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	border-radius: 50%;
	border: 1px #eee solid;
	margin: 0 10px 0 30px;
	font-size: 12px;
}
.top-head.box-head{
	margin-top: 10px;
}
.top-head.box-head.light-head > .container{
	background-color: #fff
}
.top-head.box-head.dark-head > .container{
	background-color: #222
}
.top-head.box-head .logo{
	padding-top: 15px;
	padding-left: 10px
}
.top-head.box-head .top-nav > ul > li{
	padding: 30px 0
}
.top-head.box-head .top-nav > ul > li > a > span{
	line-height: 22px
}
.top-head.box-head.dark-head .top-nav > ul > li > a,.top-head.box-head.dark-head .top-search > a,.top-head.box-head.dark-head .top-cart > a{
	color:#ccc;
}
.top-head.box-head .top-nav > ul > li >a:before,.top-head.box-head .top-nav > ul > li.selected >a:before{
	position: absolute;
	left: 0;
	top: -50px;
	width: 100%;
	height: 4px;
	content: "";
	display: inline-block;
	opacity: 0
}
.top-head.box-head .top-nav > ul > li:hover > a:before,.top-head.box-head .top-nav > ul > li.selected >a:before{
	opacity: 1;
	top: -34px
}
.top-head.box-head .top-search > a,.top-head.box-head .top-cart > a{
	margin-top: 7px;
	padding-bottom: 10px
}
/*
--------------- Sticky Header --------------- */
.top-head.sticky-nav {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	z-index:99;
	border-bottom:0 !important;
	background-image: none;
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.1);
	box-shadow:0 1px 4px rgba(0, 0, 0, 0.1);
	margin-top: 0 !important;
	padding-bottom:8px !important;
}
.top-head.sticky-nav.dark,.top-head.sticky-nav.dark-head{
	background-color: #222
}
.sticky-nav:after,.sticky-nav.skew:before,.sticky-nav.header-1.skew .top-nav > ul > li > a:before, .sticky-nav.skew .logo:before, .sticky-nav.header-1.skew .top-search:before, .sticky-nav.header-1.skew .top-cart:before,.header-2.sticky-nav .logo:before,
.sticky-nav.header-1.skew .top-nav > ul > li > a:after,.sticky-nav.header-1.skew .top-search > a:before,.sticky-nav.header-1.skew  .top-cart > a:before, .sticky-nav.skew .logo:after,.header-2.sticky-nav .logo:after,.header-2.sticky-nav .top-bar-cont,
.sticky-nav.header-1.skew .top-search:after, .sticky-nav.header-1.skew .top-cart:after,.sticky-nav > .container:before,.sticky-nav .absolute-top-bar,.sticky-nav .top-bar,.sticky-nav .top-nav > ul > li > a > span i,
.sticky-nav .top-head-links{
	display:none
}
.sticky-nav .logo img {
    top: 4px;
    max-height: 40px
}
.top-head:not(.header-1).sticky-nav .logo{
	padding:5px 0 0 !important;
	border-right:0 !important
}
.header-2.sticky-nav .logo{
	border:0;
	margin-top: 0
}
.sticky-nav.header-1,.sticky-nav.header-1.skew .top-nav > ul > li,.sticky-nav.header-2 .logo,.sticky-nav .top-search.short,.sticky-nav .top-cart.short {
    padding: 0;
}
.header-2.sticky-nav > .container.head-cont{
	margin-top:0;
	border:0;
	padding-right: 15px;
}
.sticky-nav .top-nav > ul > li{
	padding: 0 !important
}
.sticky-nav .top-nav > ul > li > a,.sticky-nav .top-search{
	margin: 0 !important;
	border-radius: 0;
}
.header-2.sticky-nav > .container:not(.top-bar-cont),.box-head.sticky-nav > .container{
	margin-top: 0 !important
}
.sticky-nav.dark .top-nav > ul > li > a,.sticky-nav.dark .top-search > a,.sticky-nav.dark .top-cart > a{
	color: #fff
}
.header-1.skew.sticky-nav .top-nav > ul > li > ul {
    left: 0;
}
.sticky-nav .top-nav > ul > li > a > span,.sticky-nav .top-search > a,.sticky-nav .top-cart > a {
    line-height: 52px !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
}
.sticky-nav.header-1 .top-search > a, .sticky-nav.header-1 .top-cart > a {
    line-height: 52px;
    padding: 0 5px;
}
.top-head.sticky-nav.center-logo .logo{
	float:left;
	margin:0;
}
.top-head.sticky-nav .top-cart .cart-num{
	top:10px;
	right:0
}
.header-1.sticky-nav .actsrch{
	margin-bottom:0 !important
}
.sticky-nav .actsrch .search-box input[type=text]{
	line-height:55px;
	color:#777 !important
}
.sticky-nav .top-search.short > a,.sticky-nav .top-cart.short > a{
	margin-top: 0;
	border-radius: 0
}
.sticky-nav .top-nav.with-borders > ul > li > a,.sticky-nav .bottom-head{
	border: 0 !important
}
.sticky-nav .top-search.short .search-box{
	margin-top: 0
}
.sticky-nav .top-search > a[class*="-bg"]:not(.gry-bg),.sticky-nav .top-cart > a[class*="-bg"]:not(.gry-bg){
	color:#fff;
}
.sm-head.sticky-nav .top-nav > ul > li > a > span, .top-head.sm-head.sticky-nav .top-search > a, .top-head.sm-head.sticky-nav .top-cart > a{
	line-height: 52px !important
}
.no-bot-border .bottom-head{
	border-bottom: 0
}
/*
--------------- Responsive Menu ------------- */
.newNav{
    position: fixed;
    top: 15px;
    left: 10px;
    width: 40px;
    height: 40px;
    display: none;
    cursor: pointer;
    transition: opacity 0.2s linear;
    -webkit-transition: all 0.2s linear;
    z-index: 9999;
    border-radius: 3px;
}
.newNav:after{
	position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    content:"";
    display:block
}
.clo{
	position: absolute;
	width: 100%;
	height: 100%;
	display: none;
	z-index: 99999;
	background-color: transparent;
}
.newNav > span{
	display: block;
	float: left;
	clear: both;
	height: 3px;
	width: 22px;
	background-color: #fff;
	position: absolute;
	left: 9px;
	top: 11px;
	overflow: hidden;
	transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
}
.newNav > span:nth-child(1){
	z-index: 9;
}
.newNav > span:nth-child(2){
	margin-top: 7px;
}
.newNav > span:nth-child(3){
	margin-top: 14px;
}
.responsive-menu > ul{
	transition: all 0.8s cubic-bezier(0.68, 0.55, 0.265, 1.55);
	-wekit-transition: all 0.8s cubic-bezier(0.68, 0.55, 0.265, 1.55);
	height: 0;
	width: 0;
	left: 15px;
	top: 15px;
	position: absolute;
	z-index: 18;
	overflow: hidden;
}
.responsive-menu > ul li{
	display: block;
	margin-left: -160px;
	transition: all 0.8s cubic-bezier(0.68, 0.55, 0.265, 1.55);
	-wekit-transition: all 0.8s cubic-bezier(0.68, 0.55, 0.265, 1.55);
}
.responsive-menu > ul li li{
	margin:0 !important;
	padding:0
}
.responsive-menu > ul li a,.responsive-menu > ul li h4{
	display:block;
	line-height: 50px;
	color:#fff;
	font-size: 15px;
	border-bottom: 1px rgba(255,255,255,.2) solid;
	padding: 0 10px;
	margin:0
}
.responsive-menu > ul li i{
	margin-right:8px;
}
.top-nav ul li li i{
	color: #fff
}
.child-arrow {
	float:right;
	display: block;
	position:relative;
	font-size: 18px;
	top: 10px;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 3px;
}
.responsive-menu ul ul .child-arrow {
    font-size: 14px;
    top: 10px;
    width: 22px;
    height: 22px;
    line-height: 22px;
}
.responsive-menu ul ul{
	display:none;
	padding: 0;
	margin:0;
	background-color: rgba(255, 255, 255, 0.14);
}
.responsive-menu ul ul li a{
	font-size:14px
}
.newNav.oppenned .responsive-menu > ul{
    opacity: 1;
     height: auto;
    width: 400px;
    padding: 10px 15px 0;
}
.mCSB_inside>.mCSB_container{
	margin-right:0
}
.mCSB_container{
	padding-right:0
}
.newNav .mCSB_scrollTools {
	right: auto;
	left: 121px;
}
.newNav.oppenned span:nth-child(2){
    overflow: visible;
}
.newNav.oppenned span:nth-child(1), .newNav.oppenned span:nth-child(3){
    z-index: 100;
    transform: rotate(45deg);
}
.newNav.oppenned span:nth-child(1){
    transform: rotate(45deg) translateY(12px) translateX(12px);
    margin-top: -11px;
}
.newNav.oppenned span:nth-child(2){
    height: 400px;
    width: 400px;
    left: -160px;
    top: 28px;
    background-color: #444;
}
.newNav.oppenned span:nth-child(3){
    transform: rotate(-45deg) translateY(-10px) translateX(10px);
    margin-top: 20px;
}
.newNav.oppenned li{
    margin-left: 140px;
}
.newNav.oppenned li.active > a,.newNav.oppenned li.selected > a{
	background-color:rgba(0,0,0,.2)
}
.newNav li li li.selected > a{
	background-color:rgba(0,0,0,.1) !important;
}
.menu-hint{
	font-size:10px;
	position: relative;
	top: -5px;
	right: 0;
	margin-left:3px;
	padding: 1px 4px 2px;
	background:#777;
	line-height: 1;
	text-align: center;
	white-space: nowrap;
	border-radius: 3px;
	color:#fff;
	font-weight:normal
}
.top-nav > ul > li:hover > a .menu-hint,.top-nav > ul > li:hover > span > a .menu-hint{
	top:-24px
}
.menu-hint.success {
	background-color: #5cb85c;
}
.menu-hint.success:hover {
	background-color: #449d44;
}
.menu-hint.info {
	background-color: #5bc0de;
}
.menu-hint.info:hover {
	background-color: #31b0d5;
}
.menu-hint.warning {
	background-color: #f0ad4e;
}
.menu-hint.warning:hover {
	background-color: #ec971f;
}
.menu-hint.hot {
	background-color: #d9534f;
}
.menu-hint.hot:hover{
	background-color: #c9302c;
}
.menu-hint.light {
	background-color: #fff;
	color:#000;
}
.menu-hint.light:hover{
	background-color: #ddd;
}
/*
---------- light sub menu ---------------- */
.light-sub.top-nav ul li ul li{
	background-color:#fff;
}
.dark-sub.top-nav ul li ul li{
	background-color:#222;
}
.light-sub.top-nav ul li ul li a,.light-sub.top-nav ul li ul li a i{
	color:#444
}
.dark-sub.top-nav ul li ul li a,.dark-sub.top-nav ul li ul li a i{
	color:#999
}
.light-sub.top-nav ul li.mega-menu ul ul,.dark-sub.top-nav ul li.mega-menu ul ul{
	-webkit-box-shadow: none;
    box-shadow: none;
    border:0;
}
.dark-sub.top-nav ul ul li {
    border-top: 1px rgba(255,255,255,.1) solid;
    border-bottom: 1px rgba(0,0,0,1) solid;
}
.dark-sub.top-nav li li a:after {
	background-color: rgba(255,255,255,.1);
}
.dark-sub.top-nav li li.selected > a{
	background-color: rgba(0,0,0,.2);
}

/* ==========================================================================
  4. PAGE TITLES.
============================================================================= */
.page-title{
	padding:50px 0;
}
.page-title > .container{
	position:relative;
}
.parallax.page-title,.page-title-video{
	min-height:250px;
	padding:100px 0
}
.page-title.trans-head{
	padding:150px 0 90px
}
.page-title h1 {
	margin: 0;
	font-size: 34px;
}
.page-title h3 {
	font-size: 20px;
	font-weight: 200;
	margin:0;
}
.page-title.tbg{
	background-image:url('../images/bgs/hadatha-banner.png');
	background-position:0 0;
	background-size: cover;
}
.page-title.title-minimal{
	padding:25px 0 20px
}
.page-title.title-minimal h1{
	text-transform:uppercase
}
/*
------------------ title video ----------- */
.page-title-video,.section-video {
	background: none;
	position: relative;
	overflow: hidden;
	clear:both
}
.page-title-video .container,.section-video .container {
	z-index: 3;
}
.video-wrap{
	width: 100%;
	height:100%;
	overflow: hidden;
}
.video-wrap video{
	width: 100%;
}
.page-title-video .video-wrap,.section-video .video-wrap {
	position: absolute;
	top: 0;
	left: 0;
	z-index:0
}
.page-title-video .video-wrap video,.section-video .video-wrap video {
	width: 100%;
	margin-top:-200px;
	display:block;
	height:auto
}
.video-overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 5;
	background: rgba(0,0,0,.6);
	-webkit-backface-visibility: hidden;
}
.video-overlay.light{
	background: rgba(255,255,255,.6);
}
.page-title .title-icon{
	margin: 54px 15px 0 0;
	width:58px;
	height:58px;
	line-height:58px;
	text-align:center;
	font-size:30px;
	-webkit-text-shadow: none;
	text-shadow: none;
}
.hi-index{
	z-index: 3 !important;
	position: relative;
}
.low-index{
	z-index: 2 !important;
	position: absolute;
}
.breadcrumbs {
	font-size: 12px;
	padding:10px 15px;
	text-align:right
}
.breadcrumbs.white-bg{
	bottom:0;
	padding: 10px;
}
.breadcrumbs i {
	display: inline-block;
	margin: 0 10px;
}
.breadcrumbs.style2{
	margin-bottom:40px;
	border-bottom:0;
	display:inline-block;
	padding:0;
	float:right;
	border-radius:5px;
	border-top:0 !important;
	border-top-right-radius:0;
	border-top-left-radius:0
}
.breadcrumbs.style2 a,.breadcrumbs.style2 span{
	display:inline-block;
	padding:0 20px;
	position:relative;
	height:35px;
	line-height:35px
}
.breadcrumbs.style2 a:before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: -1px;
	width: 0;
	height: 0;
	border-color: transparent transparent transparent #ccc;
	border-style: solid;
	border-width: 17.5px 0 17.5px 10px;
}
.breadcrumbs.style2 a:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 0;
	border-color: transparent transparent transparent #EEEEEE;
	border-style: solid;
	border-width: 17.5px 0 17.5px 10px;
}
.breadcrumbs.style2 a.main-bg:after{
	display:none
}
.breadcrumbs.style2 a.main-bg{
	margin-right:5px;
	border-bottom-left-radius:5px
}
.breadcrumbs.style2 a.main-bg:before{
	right: -10px;
}
.breadcrumbs.style3{
	margin-bottom:-40px;
	margin-top:40px;
	border-bottom:0;
	display:inline-block;
	padding:11px 20px;
	float:right;
	border:0 !important
}
.breadcrumbs.style2.f-left,.breadcrumbs.style3.f-left{
	float:left
}
.breadcrumbs.style2.f-none,.breadcrumbs.style3.f-none{
	float:none;
	display:table;
	margin-right:auto;
	margin-left:auto
}
.breadcrumbs.minimal{
	border:0;
	margin-top:25px
}

.fa-hover > span {
	display: block;
	line-height: 40px;
	height: 40px;
	padding-left: 35px;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	cursor: pointer;
	position:relative
}
.fa-hover:hover > span{
	padding-left:45px
}
.fa-hover > span i{
	margin-right:9px;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.1s ease-in-out;
	position:absolute;
	left:12px;
	top:13px
}
.fa-hover:hover > span i{
	font-size: 28px;
	top:5px;
	left:8px;
	transform:scale(1);
	-webkit-transform:scale(1);
}
.no-border{
	border:0 !important
}
.no-bot-border{
	border-bottom: 0 !important
}
.pos-static{
	position:static !important
}
.modal-content{
	overflow:hidden
}
.alert.with-icon {
    padding-left: 50px;
    position:relative
}
.alert.with-icon i,.alert.with-icon .ico {
	color: #111;
	position:absolute;
	left: 20px;
	top:50%;
	margin-top:-7px;
	font-size:16px
}
.alert i{
	margin-right: 8px
}
.alert h4 {
	margin-bottom: 0px;
	font-size: 18px;
}
.alert p {
	margin: 5px 0 0;
	padding-bottom: 0;
}
.alert.square{
	border-radius:0
}
.alert.outlined{
	background-color:transparent;
	border-width:2px
}


#to-top {
	position:fixed;
	right: 10px;
	bottom: 10px;
	z-index:99;
	cursor:pointer;
	font-size:22px;
	background-color:rgba(0,0,0,.8);
	border-radius: 3px;
	display: none;
	animation: none;
}
#to-top span {
	width: 40px;
	height: 40px;
	text-align:center;
	line-height: 38px;
	display:block;
	color:#fff;
}
.btn,.form-control{
	border-radius:5px;
}
.btn-md{
	line-height: 43px
}
.form-control,.c-select{
border-width: thin;
border-style: solid;
padding: 10px 12px;
height: 50px;
border-color: #c8c5c5;
border-top-left-radius: 5px !important;
border-bottom-left-radius: 5px !important;
}
.nowrp{
	white-space: nowrap;
}
.floated.form-control{
	display: inline-block !important;
	width: auto;
}
.form-control,.form-control:focus{
	box-shadow: none
}
.captcha-div .form-control{
	width: 77%;
	margin: 0 0 0 5px;
	display: inline-block;
	height: 75px;
	font-size: 26px;
	padding: 0 15px;
	line-height: 75px;
	vertical-align: bottom;
}
.captcha-div .form-control.sm{
	width: 40%;
}
.form-control.error{
	border-color:#f00 
}
textarea{
	resize: none;
}
#contact-form,.captcha-div{
	position: relative;
}
.contact-msg{
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
	width: 100%;
	height: 100%;
	z-index: 3;
	background-color:rgba(255, 255, 255, 0.79); 
	display: none;
}
.contact-msg .alert{
	position: absolute;
	top: 30%;
	width: 60%;
	left: 20%;
	background-color: #7CC35F;
	color:#fff;
	font-size: 15px;
	padding: 50px
}
.success-msg{
	display: none;
}
.contact-loader{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -16px;
	margin-left: -16px;
}
.contact-msg .ico-block{
	clear: both;
	display: table;
	margin: 10px auto;
	font-size:40px;
	position: static; 
}
.errCap{
	margin-left: 5px;
	display: none;
	vertical-align: text-top;
}
.errCap .alert{
	line-height: 75px;
	height: 75px;
	margin-bottom: 0;
	padding: 0 15px;
	display: inline-block;
	font-style: normal;
}
.full-contact-bg{
	margin-top: 50px !important
}
.form-group{
	overflow: hidden;
}
.control-label{
	white-space: nowrap;
}

/*
--------------- portfolio -------------- */
.brows-all{
	line-height:40px;
	text-transform:uppercase;
}
.brows-all i{
	margin-left:10px
}
.filter-by{
	margin: 0 0 40px;
	clear:both;
	position:relative
}
.filter-by:after{
	clear:both;
	display:table;
	content:"";
}
.filter-by ul{
	display:table;
	margin:auto;
	padding: 0;
	list-style: none;
}
.filter-by ul li{
	float: left;
	position:relative;
	margin: 0 5px;
	padding-bottom: 0;
}
.filter-by ul li a{
	display:block;
	position:relative;
	z-index:3;
}
.filter-by ul li a span{
	display:block;
	padding: 0 15px;
}
.filter-by.style2,.filter-by.style3 ul {
	border-bottom: 4px #ddd solid;
}
.filter-by.style2 ul li a span{
	padding: 10px 15px
}

.filter-by.style3{
	margin-bottom: 30px
}
.filter-by.style3 ul li{
	margin: 0;
	border-left-width: 1px;
	border-left-style: solid;
}
.filter-by.style3 ul li a span,.filter-by.style4 ul li a span,.filter-by.style5 ul li a span{
	padding: 10px 20px
}
.filter-by.style4 ul{
	border-radius: 4px;
	border: 1px #eee solid;
	overflow: hidden;
	padding: 0;
	margin: 0
}
.filter-by.style4 ul li{
	margin: 0;
}
.filter-by.style4 ul li a{
	border-left: 1px #eee solid;
}
.filter-by.style4 ul li:first-child a{
	border-left: 0;
}
.filter-by.style5{
	border-left:0 !important;
	border-right:0 !important;
}
.filter-by.style5 ul li span{
	padding: 10px 5px !important;
	display: block;
}
/* columns */
.p-1-col .portfolio-item{
	width:100%;
	margin:0 0 25px 0;
	padding-bottom:25px;
	border-bottom: 1px #ddd dashed;
	overflow: hidden;
}
.p-1-col .img-holder{
	float:left;
	margin-right:40px;
}
.p-1-col .name-holder{
	padding:0
}
.p-1-col .name-holder h4{
	font-size:18px;
	margin-bottom:10px
}
.p-1-col .name-holder .list li{
	line-height:30px
}

.p-2-cols .portfolio-item{
	width:49%;
	margin:0 0.5% 1%;
}
.p-2-cols .img-holder img{
	width:100%;
}
.masonry.p-2-cols .img-holder img{
	height:auto;
	max-width: none;
}
.p-2-cols.no-margin .portfolio-item{
	width:50%;
	margin-right:0
}
.p-3-cols .portfolio-item{
	width:32.33333333%;
	margin: 0 0.5% 1%;
}
.p-3-cols .img-holder{
	width: 100%;
}
.p-3-cols .img-holder img{
	width:100%;
}
.p-3-cols.no-margin .portfolio-item{
	width:33.33333333%;
	margin:0 !important
}
.p-3-cols.no-margin .img-holder{
	width: 100%;
}
.p-3-cols.no-margin .img-holder img{
	width:100%;
}
.p-3-cols.full.no-margin .portfolio-item{
	width:33.333333%;
	margin:0 0 15px;
}
.p-4-cols .portfolio-item{
	width:24%;
	margin:0 0.5% 1%;
}
.p-4-cols.no-margin .portfolio-item{
	width:25%;
	margin:0 !important
}
.p-4-cols .img-holder img{
	width:100%;
}
.p-5-cols .portfolio-item{
	width:19%;
	margin:0 0.5% 1%;
}
.p-5-cols.no-margin .portfolio-item{
	width:20%;
	margin:0;
}
.p-6-cols .portfolio-item{
	width:15.6666%;
	margin:0 0.5% 1%;
}
.p-6-cols.no-margin .portfolio-item{
	width:16.6666%;
	margin:0;
}
.portfolio.no-margin .img-holder{
	width: 100%;
}
.portfolio.no-margin .img-holder img{
	width:100%;
	height:auto
}
.portfolio-item .port-img:before{
	position: absolute;
	background-color: rgba(0,0,0,.5);
	width: 100%;
	height: 100%;
	content: "";
	display: block;
	opacity: 0;
}
.portfolio-item .icon-links{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.portfolio-item .icon-links a{
	display: inline-block;
	opacity: 0;
	position: absolute;
}
.portfolio figure,.portfolio-item .port-img{
	overflow: hidden;
	position: relative;
}
.no-margin.portfolio figure,.no-margin.portfolio .portfolio-item{
	margin: 0
}

/* style 1 */
.portfolio.p-style1 .portfolio-item,.portfolio.p-style4 .portfolio-item{
	margin-bottom: 30px
}
.portfolio.p-style1 .portfolio-item h4,.portfolio.p-style4 .portfolio-item h4{
	margin: 15px 0 0;
	font-size: 16px;
}
.portfolio.p-style1 .portfolio-item p.description,.portfolio.p-style4 .portfolio-item p.description{
	font-size: 13px
}
.portfolio.p-style1 .portfolio-item .icon-links ,.portfolio.p-style4 .portfolio-item .icon-links{
	height: 40px;
}
.portfolio.p-style1 .portfolio-item .icon-links a,.portfolio.p-style4 .portfolio-item .icon-links a{
	width: 50%;
	text-align: center;
	padding: 10px 0;
	margin: 0 !important
}
.portfolio.p-style1 .portfolio-item .icon-links a.zoom{
	right: -300px
}
.portfolio.p-style1 .portfolio-item .icon-links a.link{
	left: -300px
}
.portfolio.p-style1 .portfolio-item:hover .icon-links a.zoom{
	right: 0
}
.portfolio.p-style1 .portfolio-item:hover .icon-links a.link{
	left: 0
}
/* style 2 */
.p-style2 figure img,.p-style3 figure img{
	position: relative;
	width:100%;
	z-index:1;
	-webkit-transform: scale(1);
	transform: scale(1);
}
.p-style2 figure:hover img,.p-style3 figure:hover img{
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
}
.p-style2 figure figcaption,.p-style3 figure figcaption {
	position:absolute;
	top:0;
	width:100%;
	height:100%;
	z-index:2;
	opacity:0
}
.portfolio-item figure:after{
	background-color:rgba(0,0,0,.75);
	opacity:0;
	z-index:1;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}
.p-style2 figure .icon-links a {
	position:absolute;
	left:-60px;
	top:50%;
	margin-top:-20px;
	padding:15px 20px;
}
.p-style2 figure:hover .icon-links a{
	left:0
}
.p-style2 figure .icon-links a.zoom{
	left:auto;
	right:-60px
}
.p-style2 figure:hover .icon-links a.zoom{
	right:0;
}
.p-style2 figure .port-captions{
	position:absolute;
	width:100%;
	bottom:0;
	left:0;
	z-index: 9
}
.p-style2 figure h4 {
	margin:0 0 5px;
	font-size: 17px;
	color:#fff;
	padding:0;
	text-align:center;
	-webkit-transition-delay: 0.2s !important;
	transition-delay: 0.2s !important;
	-webkit-transform: translate3d(0,120px,0);
	transform: translate3d(0,120px,0);
}
.p-style2 figure h4 a{
	color:#fff
}
.p-style2 figure .description {
	font-size: 11px;
	text-align:center;
	display:block;
	color:#ccc;
	-webkit-transition-delay: 0.3s !important;
	transition-delay: 0.3s !important;
	-webkit-transform: translate3d(0,120px,0);
	transform: translate3d(0,120px,0);
}
.p-style2 figure .description a{
	color:#fff
}
.p-style2 figure:hover h4,.p-style2 figure:hover .description {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.p-style3 figcaption {
	z-index: 5 !important;
}
.p-style3 figure .icon-links a{
	position: absolute;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	z-index: 5;
	color: #fff
}
.p-style3 figure .icon-links a:after{
	position: absolute;
	width: 0;
	height: 0;
	top: 0;
	left: 0;
	display: inline-block;
	content: "";
	border-style: solid;
	border-width: 60px 60px 0 0;
	z-index: -1
}
.p-style3 figure .icon-links a.zoom:after{
	border-width: 0 0 60px 60px;
	top: auto;
	left: auto;
	bottom: 0;
	right: 0
}
.p-style3 figure a.link{
	top: -60px;
	left: -60px;
}
.p-style3 figure a.zoom{
	bottom: -60px;
	right: -60px;
}
.p-style3 figure:hover a.link{
	top: 0;
	left: 0;
}
.p-style3 figure:hover a.zoom{
	bottom: 0;
	right: 0;
}
.p-style3 .port-captions{
	text-align: center;
	padding-top: 40%;
	-webkit-transition: all 0.35s ease;
	transition: all 0.35s ease;
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
	opacity: 0;
	-webkit-transform: translate3d(0,40px,0);
	transform: translate3d(0,40px,0);
	position: relative;
	z-index: 2
}
.p-style3 figure:hover .port-captions{
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	opacity: 1
}
.p-style3 .port-captions h4{
	margin-bottom: 0
}
.p-style3 .port-captions h4 a{
	color:#fff;
	font-size: 18px;
}
.p-style3 .port-captions p a,.p-style3 .port-captions p {
	color:#ccc;
}

.p-style4 .portfolio-item .port-captions{
	background-color: rgba(0,0,0,.05);
	padding: 1rem 2rem
}
.p-style4 .portfolio-item .icon-links a{
	width: 50px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	padding: 0 !important
}
.p-style5 .portfolio-item .icon-links a{
	width: 70px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	padding: 0 !important
}
.p-style4 .portfolio-item .icon-links a.zoom,.p-style5 .portfolio-item .icon-links a.zoom{
	bottom: 100px;
	right: 0
}
.p-style4 .portfolio-item .icon-links a.link,.p-style5 .portfolio-item .icon-links a.link{
	bottom: -100px
}
.p-style4 .portfolio-item:hover .icon-links a,.p-style5 .portfolio-item:hover .icon-links a{
	bottom: 0;
}

.p-style5 .portfolio-item{
	position: relative;
	overflow: hidden;
}
.p-style5 .port-captions{
	text-align: center;
	padding: 2rem;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	opacity: 0;
	position: absolute;
	width: 100%;
	z-index: 99;
	bottom: -100px;
	left: 0;
	background-color: #fff
}
.p-style5 .portfolio-item .icon-links{
	position: absolute;
	width: 140px;
	height: 50px;
	left: 50%;
	margin-left: -72px;
	top: 50%;
	margin-top: -25px
}
.p-style5 .portfolio-item .icon-links a.zoom{
	left: 74px
}
.p-style5 figure:hover .port-captions{
	bottom: 0;
	opacity: 1
}
.p-style5 .port-captions h4{
	margin-bottom: 0
}
.p-style5 .portfolio-item .port-img{
	position: relative;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
	top: 0
}
.p-style5 .portfolio-item:hover .port-img{
	top: -20px
}
.p-style5 .port-captions h4 a{
	font-size: 18px;
}
.p-style5 .portfolio-item .icon-links a{
	line-height: 50px
}
.portfolio-item:hover figcaption,.portfolio-item:hover .port-img:before,.portfolio-item:hover figure:after,.portfolio-item:hover .icon-links a{
	opacity:1;
}

/*
------------- Blog --------------- */
.post-item{
	overflow: hidden;
}
.news .post-item{
	overflow: hidden;
	height: 390px;
	
}


.post-item .post-image{
	margin-bottom:20px;
	position:relative;
	z-index:5;
	overflow:hidden;
}
.post-item .post-image:before{
	position:absolute;
	left:5%;
	bottom:0;
	width:90%;
	height:90%;
	z-index:3;
	content:"";
	display:block;
	border:4px rgba(255,255,255,.5) solid;
	opacity:0;
}
.post-item .post-image:after{
	background-color:rgba(0,0,0,.5);
	z-index:2;
	opacity:0
}
.post-item:hover .post-image:before,.post-item:hover .post-image:after{
	opacity:1
}
.post-item:hover .post-image:before{
	bottom:5%;
}
.post-item:hover .post-image img{
	transform: scale(1.2) rotate(-10deg);
}
.post-item .post-content h4{
	font-size:16px;
	margin-bottom: 15px;
	line-height: 1.5;
}
.post-info ul{
	overflow:hidden;
	margin-bottom: 15px;
}
.post-info ul li{
	float:left;
	margin-right:10px;
	font-size:11px
}
.post-info ul li i{
	margin-right:8px;
}
.post-item .post-content{
	position:relative;
	z-index:6;
	display: table;
}
.post-item .lft-tools{
	float:left;
	position:relative;
	margin:-75px 0 15px 15px;
	width:40px;
	padding:0;
	text-align:center;
	font-size:11px;
}
.post-item .lft-tools:before{
	-webkit-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.05);
	box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.05);
	z-index:-1
}
.post-item-rit{
	margin: 0 0 0 90px;
    padding: 0 15px 15px;
}
.post-item .lft-tools li{
	padding:12px 10px 11px
}
.post-item .lft-tools li:last-child,.post-item .lft-tools li:first-child{
	border-bottom:0;
}
.post-item .lft-tools li:first-child{
	padding: 14px 10px 13px;
}
.post-item .lft-tools li:first-child i{
	color:#fff !important;
}
.post-item .lft-tools li i{
	display:block;
	clear:both;
	margin-bottom:3px;
	font-size:20px;
}
.blog-home .post-item{
	background-color: transparent;
}
.rit-cell{
	float: right;
}
.blog-posts .post-item{
	clear: both;
	margin-bottom: 0;
	position: relative;
	background-color: transparent;
}
.blog-posts:not(.timeline) .post-item{
	overflow: hidden;
}
.blog-posts .post-item .post-image{
	margin-bottom: 0
}
.blog-posts .post-item .post-content h4{
	margin-top: 20px;
	font-size: 23px;
}
.post-item video,.post-item iframe,.post-item audio {
    width: 100%;
    display: block;
}
.post-item .slick-dots{
	position: absolute;
	right: 10px;
	bottom: 0
}
.more-btn{
	display: inline-block;
	line-height: 18px;
	padding: 0 5px;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: .5px;
	position: absolute;
	bottom: 0;
	right: 0;
}
.post-item.bot-1-border:hover,.post-item:hover .post-image.bot-3-border{
	border-color: #222
}
.post-item:hover .more-btn,.post-item:hover .lft-tools .main-bg{
	background-color: #222
}
.blog-posts.lg-image .post-item .post-content,.blog-posts.lft-tl .post-item .post-content{
	margin-left: 90px;
	padding: 0;
}
.blog-posts .post-item .lft-tools{
	top: 0;
	position: absolute;
	left: 0;
	margin: 0;
	height: 100%;
	border: 1px rgba(0,0,0,.1) solid;
	background-color: rgba(0,0,0,0.01);
}
.blog-posts .post-item .post-item-rit{
	margin-left: 0
}
.rit-cell .blog-posts.lg-image .post-item .post-content {
    margin-right: 90px;
    margin-left: 0;
}
.rit-cell .blog-posts .post-item .lft-tools{
	left: auto;
	right: 0
}
.just-gallery a.zoom:hover img{
	transform: scale(1.5);
	-webkit-transform: scale(1.5);
}
.gallery-size-thumbnail{
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}
.gallery-columns-5 .gallery-item {
	width: 19.855%;
}
.gallery-item {
	float: left;
	margin: 0 1px 1px 0;
	position: relative;
	overflow:hidden
}
.gallery-caption {
	background-color: rgba(0,0,0,.7);
	color: #fff;
	font-size: 12px;
	line-height: 1.5;
	margin: 0;
	max-height: 50%;
	opacity: 0;
	padding: 6px 8px;
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: left;
	width: 100%;
}
.gallery-item:hover .gallery-caption{
	opacity:1
}

/* widgets */
.sidebar-widgets .widget{
	position: relative;
	clear: both;
}
.lft-cell .sidebar-widgets{
	padding: 0 20px 0 0
}
.sidebar-widgets:after{
	position: absolute;
	width: 500%;
	height: 100%;
	right: auto;
	top: 0;
	content: "";
	display: inline-block;
	z-index: 0;
	margin-left: -20px;
	box-shadow: inset 15px 0px 15px -10px rgba(0,0,0,.1);
	-webkit-box-shadow: inset 15px 0px 15px -10px rgba(0,0,0,.1);
}
.widget .nav-tabs>li:first-child{
	margin: 0
}
.widget .nav-tabs{
	margin: auto;
}
.col-md-3 .widget .nav-tabs>li a{
	padding: 5px 7px;
    font-size: 12px;
    font-weight: normal;
}
.col-md-3 .widget .nav-tabs>li a i{
	margin-right: 5px
}
.lft-cell .sidebar-widgets:after{
	position: absolute;
	width: 500%;
	height: 100%;
	right: 0;
	top: 0;
	content: "";
	display: inline-block;
	z-index: 0;
	margin-right: 15px;
	margin-left: 0;
	box-shadow: inset -15px 0px 15px -10px rgba(0,0,0,.1);
	-webkit-box-shadow: inset -15px 0px 15px -10px rgba(0,0,0,.1);
}
.rit-cell{
	padding-right: 0;
	padding-left: 40px
}
.widget h4.widget-title{
	margin-left: -20px;
	padding: 12px 20px;
	border-left-width: 0 !important;
	box-shadow: 0px 5px 5px -4px rgba(0, 0, 0, 0.11);
	-webkit-box-shadow: 0px 5px 5px -4px rgba(0, 0, 0, 0.11);
	font-size: 17px;
	text-transform: uppercase;
}
.lft-cell .widget h4.widget-title{
	margin-right: -20px;
	margin-left: 0px;
	border-right: 0 !important;
	border-left-width: 1px !important;
}
.widget_menu ul li a{
	padding: 10px 15px 10px 30px;
	display: block;
	position: relative;
}
.widget_menu ul li a:before{
	position: absolute;
	left: 10px;
	top: 50%;
	margin-top: -5px;
	font: normal normal normal 12px/1 FontAwesome;
	content: "\f101";
	opacity: 0.4
}
.widget_menu ul li:nth-child(even) a:before{
	content: "\f105"
}
.sidebar-widgets .widget-content{
	overflow:hidden;
}
.lft-cell .sidebar-widgets .widget-content{
	padding-right: 0px;
	padding-left: 10px;
}
.sidebar-widgets li.widget{
	position: relative;
	z-index: 1;
	margin-bottom: 40px;
}
.sidebar-widgets h5{
	font-size:13px;
	margin-bottom:10px;
	font-family: inherit;
}
.sidebar-widgets .meta{
	font-size:11px;
	margin-bottom: 5px;
}
.sidebar-widgets .tab-content .tab-pane{
	padding:15px 0
}
/* search */
.search-widget form{
	position:relative
}
.search-widget .txt-box{
	height:40px;
	padding:0 35px 0 10px;
	width:100%;
	border:0;
	font-size: 13px;
}
.search-widget .widget-content{
	position:relative;
}
.search-widget button{
	background:transparent;
	border:0;
	position:absolute;
	right: 0;
	top: 0;
	height: 40px;
	font-size: 11px;
	padding: 0 13px;
	background: rgba(0, 0, 0, 0.1);
}

.sidebar-widgets ul.flickr-widgetx li img, .sidebar-widgets ul.flickr-widgetx .img-overlay {
	width: 56px;
	height: 56px;
}
.sidebar-widgets ul.flickr-widgetx .img-overlay:before {
	line-height: 56px;
	height: 56px
}
.sidebar-widgets ul.flickr-widgetx .flickr{
	height:56px;
}
.sidebar-widgets .flickr-widgetx li img, .sidebar-widgets .flickr-widgetx .img-overlay {
    width: 63px;
    height: 63px;
}
.flickr-widgetx > ul{
	display: table;
	margin:auto;
}
/* recent posts */
.w-recent-comments ul li {
	padding: 8px 0;
}
.widget-categories ul li {
	padding: 10px 0;
}
.w-recent-posts > ul > li:first-child, .widget-categories ul li:first-child, .w-recent-comments ul li:first-child {
	border-top: 0px;
}
.w-recent-posts .post-img {
	float: left;
	margin-right: 10px;
	max-height: 55px;
	overflow:hidden
}
.w-recent-posts .post-img img {
	padding: 1px;
	width: 55px;
}
.w-recent-posts .meta span {
	display: inline-block;
	margin-right: 10px;
}
.w-recent-posts .meta i {
	margin: 0 5px 0 0;
}
.w-recent-posts li{
	padding: 15px 0;
}
.w-recent-posts li:last-child{
	border-bottom:0px
}
.sale-widget .meta span{
	margin-right:2px !important
}
.widget-content .accordion{
	margin:10px auto
}
.widget-categories li span{
	float:right
}
/* recent comments widget */
.w-recent-comments i {
	margin-right: 10px;
	font-size: 40px;
	opacity: 0.2
}
.w-recent-comments i.fa.fa-clock-o {
	font-size: 16px;
	vertical-align:middle
}
.w-recent-comments h5 {
	margin: 10px 0 5px;
	font-size:12px;
	width:70%;
	overflow:hidden;
	white-space:nowrap;
	text-overflow: ellipsis;
}

/* Tag cloud */
.tags-widget {
	overflow: hidden;
}
.tags-widget .tags a {
	display: block;
	float: left;
	margin: 0 2px 4px;
	padding: 0 10px;
	font-size: 12px;
	line-height:30px;
	text-transform:uppercase

}
.main-bg .tags-widget .tags a {
	background-color:rgba(0,0,0,.1);
	color:#fff
}
.widget-content .tags {
	overflow: hidden;
}
.sidebar_widgets .widget_it_widget_tweets .slick-prev,.sidebar_widgets .widget_it_widget_tweets .slick-next{
	background-color: #ddd;
	color:#333;
	border-radius: 3px !important;
	top: -75px !important;
    right: 10px;
}
.sidebar_widgets .widget_it_widget_tweets .slick-prev{
	right: 43px
}
.sidebar_widgets .widget_it_widget_tweets .timeline-Widget{
	padding: 15px 0 0 10px
}
/* small-image */
.blog-posts.small-image .post-image,.blog-posts.small-image .post-gallery,.blog-posts.small-image .post-media{
	float:left;
	margin-right: 20px;
	max-width:35%;
}
.blog-posts.small-image .post-content{
	margin-left: 0
}
.blog-posts.small-image .post-item .post-content h4{
	margin-top: 0
}
.blog-posts:not(.lg-image) .post-item .post-meta{
	margin: 15px 0;
	padding: 0;
	background-color: rgba(0,0,0,.03);
	border: 1px rgba(0,0,0,.08) solid;
	display: table;
}
.blog-posts:not(.lg-image) .post-item .post-info ul li{
	margin: 0;
	padding: 8px 11px;
	border-left: 1px rgba(0,0,0,.08) solid
}
.blog-posts:not(.lg-image) .post-item .post-info ul li:first-child{
	border-left: 0
}
.blog-posts:not(.lg-image) .post-item .post-info ul li.main-bg i{
	margin:0 
}
.blog-posts.small-image .gallery-columns-5 .gallery-item {
	width: 32.855%;
}
.blog-posts .post-content p{
	overflow: hidden;
	margin-bottom: 0
}
.blog-posts.small-image .gallery-caption {
	max-height:none;
	font-size:10px
}
.blog-posts.small-image .post-item .lft-tools{
	min-height: 240px
}
.blog-posts.small-image.full .post-image,.blog-posts.small-image.full .post-gallery,.blog-posts.small-image.full .post-media{
	width: 35%
}

/* timeline */
.timeline{
	position:relative
}
.timeline:before{
	position:absolute;
	width: 1px;
	height:100%;
	content:"";
	display:inline-block;
}
.lft-tl:before{
	left: 10px;
	border-left: 1px rgba(0, 0, 0, 0.15) dashed;
}
.rit-tl:before{
	right: 10px;
	border-left: 1px rgba(0, 0, 0, 0.15) dashed;
}
.timeline .post-item{
	position:relative;
	overflow: visible;
}
.timeline .post-item iframe{
	position:relative;
	overflow:hidden
}
.rit-tl .post-item{
	margin-right: 0;
}
.timeline .post-item .timeline_date{
	position:absolute;
	top:0;
	width: 55px;
}
.lft-tl .post-item .timeline_date{
	left: 23px;
}
.rit-tl .post-item .timeline_date{
	right: 23px;
}
.timeline .post-item .timeline_date span{
	display:block;
	text-align:center;
}
.timeline .post-item .timeline_date span.year{
	font-size:80%
}
.timeline .post-item .timeline_date:before,.timeline .post-item .timeline_date:after{
	position:absolute;
	height: 0px;
	width:20px;
	content:"";
	display:inline-block;
	top: 28px;
}
.timeline.full .post-item .timeline_date:after{
	left: auto;
}
.timeline .post-item .timeline_date:after,.timeline .post-item .timeline_date:before{
	right:auto;
	left: -12px;
	border-bottom: 2px rgba(0, 0, 0, 0.15) solid;
}
.lft-tl .post-item .timeline_date:before{
	right: -15px;
	border-bottom: 2px rgba(0, 0, 0, 0.15) solid;
	left: auto !important;
}
.rit-tl .post-item .timeline_date:before{
	left:auto;
	right:0
}
.rit-tl .post-item .timeline_date:before{
	right: -12px;
	left: auto;
}
.timeline .post-item .timeline_date .inner_date{
	text-align: center;
	margin-bottom: 7px;
	padding: 5px 0;
	position: relative;
	z-index: 3;
	border-radius: 10%
}
.timeline .post-item .timeline_date .inner_date span{
	position:relative;
	z-index:1;
}
.blog-posts.rit-tl .post-item .post-content{
	margin-right: 90px;
	margin-left:0
}
.timeline .post-item .timeline_date .day{
	font-size: 20px;
	font-weight:900;
}
.timeline .post-item .timeline_date .month{
	margin-top:-5px;
}
.timeline.full{
	overflow:hidden;
	height:100%
}
.timeline.full .post-item{
	width:44%;
	float:left;
	clear: none;
	margin-bottom: 50px 
}
.timeline.full .post-item:nth-child(even){
	float:right;
}
.timeline.full .post-item:nth-child(2n+1){
    clear:left
}
.timeline.full .post-item .gallery-columns-5 .gallery-item {
	width: 19.8%;
}
.timeline.full:before{
	left:50%;
	margin-left:-0.5px;
	border-left: 1px rgba(0, 0, 0, 0.15) dashed;
}
.timeline.full .post-item .timeline_date{
	right: -73px;
}

.timeline.full .post-item .timeline_date:before{
	left:-20px
}
.timeline.full .post-item:nth-child(even) .timeline_date:before{
	right:-20px;
	left:auto
}
.timeline.full .post-item .timeline_date span{
	text-align:inherit
}
.timeline.full .post-item .timeline_date .inner_date span{
	text-align:center;
}
.timeline.full .post-item .timeline_date .year{
	text-align:center;
}
.timeline.full .post-item:nth-child(even) .timeline_date{
	left: -71px;
	top:120px;
}
.rit-tl hr.dev-style3:before{
	left:auto;
	right: 0;
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}
/* masonry */
.masonry .post-item,.grid .post-item{
	width:48%;
	margin:0 15px 15px 0;
	padding: 10px;
	border: 1px #ddd solid;
	border-radius: 5px
}
.right-cell .masonry .post-item{
	margin:0 0 15px 15px;
}
.masonry .post-item .gallery-columns-5 .gallery-item {
	width: 19.744444%;
}
.masonry.full .post-item{
	width:32%;
}
.masonry.full .post-item .gallery-columns-5 .gallery-item {
	width: 24.6777%;
}

/* grid */
.right-cell .grid .post-item{
	margin:0 0 15px 15px;
}
.grid .post-item iframe,.grid .post-item video{
	width:100%;
	height:210px;
	background:#000
}
.grid .post-item .post-gallery{
	height:210px;
}
.grid .post-item .gallery-columns-5 .gallery-item {
	width: 19.744444%;
}
.grid.full .post-item{
	width:32%;
}
.grid.full .post-item .gallery-columns-5 .gallery-item {
	width: 24.6777%;
}
.grid.full .post-item iframe,.grid.full .post-item video{
	height:182px;
}
.grid.full .post-item .post-gallery{
	height:187px;
}

/* single */
.blog-single .post-item,.blog-single .post-item .post-content{
	background:transparent;
}
.details-img{
	margin-bottom:20px;
	
}
.blog-single .post-item .post-info-container, .blog-single .post-item .post-content p{
	padding:0
}
.blog-single .post-item .post-info-container{
	margin-bottom:20px;
	overflow:hidden
}
.post-tags .tags{
	margin-top:10px;
	padding: 0
}
.post-tags{
	overflow:hidden
}
.post-tags i{
	margin-right:8px
}
.post-tags > span{
	display:inline-block;
	margin-right:5px;
}
.post-tools{
	margin: 60px 0;
}
.share-post{
	overflow:hidden;
}
.share-post > div > div{
	float:left;
}
.share-post button{
	margin:0 3px 0 0;
	border:0;
	float:left;
	background-color: transparent;
	padding: 0
}
.share-post button span{
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size:18px;
	display: block;
	background-color: #ddd;
	position: relative;
}
.share-post .facebook span{
	background:#1b57a1;
	color:#fff
}
.share-post .twitter span{
	background:#0cbce2;
	color:#fff
}
.share-post .googleplus span{
	background:#dd4b39;
	color:#fff
}
.share-post .linkedin span{
	background:#1583ba;
	color:#fff
}
.share-post .pinterest span{
	background:#bd2126;
	color:#fff
}
.share-post .xing span{
	background:#006464;
	color:#fff
}
.share-post button span.share_num{
	display: block;
	font-size: 10px;
	background-color: #ddd;
	padding: 3px;
	margin-top: 3px;
	width: auto;
	height: auto;
	line-height: 1;
	color: #333
}
.total-shrs{
	background-color: transparent;
	font-size: 14px;
	display: table-cell;
	vertical-align: middle;
}
.author-info {
    padding: 20px;
    overflow: hidden;
}
.author-avatar {
    float: left;
}
.author-avatar .avatar {
    margin: 0 20px 5px 0;
    max-width: 100px;
    border-radius: 5px
}
.author-name {
    font-size: 18px;
    line-height: 1;
    margin: 0 0 8px;
}
.author-description {
    font-size: 16px;
}
.post-tools > div,.post-tools > nav{
	padding:25px 0;
	border-bottom:1px #ddd solid;
}
.nav-block{
	display:block;
	font-weight:bold;
}
.nav-next{
	text-align:right
}
.comments{
	
}
.comment-list li{
	position:relative
}
.comment-list > li{
	overflow:hidden;
	margin-bottom:25px;
	border:1px #ddd solid;
	border-radius: 5px
}
.comment-list .comment-avatar{
	position:absolute;
	left:0;
	height:100%;
	width:60px;
	padding: 10px
}
.comment-list > li .comment-content{
	padding:15px 20px;
	margin-left:80px
}
.comment-list .comment-content h6{
	margin:0 0 5px;
	display:inline-block;
	font-size: 16px;
}
.comment-list .comment-content .meta{
	font-size:10px;
	margin-bottom:10px;
	color: #bbb;
}
.comment-list .comment-content .meta span{
	display:inline-block;
	margin-right:10px
}
ul.child-comment{
	margin-left:100px;
	position:relative;
	padding: 0;
	list-style: none;
	border-top: 3px #ddd solid;
}
ul.child-comment:before{
	content:"";
	height:1px;
	width:95%;
	left:0;
	display:inline-block
}
ul.child-comment li{
	border-top:1px #ddd solid;
	padding-top: 20px
}
ul.child-comment li:first-child{
	border: 0
}
ul.child-comment li .comment-content{
	padding: 0 20px 20px
}
.comment-list ul.child-comment .comment-avatar{
	background:transparent;
	padding: 0
}
.blog-single .heading{
	padding-bottom: 0
}
.blog-single .heading h3,.blog-single .heading h4{
	font-size: 25px
}
.leave-comment{
	margin-top: 60px
}


.lg-not-found{
	font-size: 200px;
	opacity: 0.1
}
.fullscreen-box{
	position: relative;
}
.fullscreen-content{
	position: absolute;
	top: 50%;
	left: 50%;
}
.fullscreen-box .lg-not-found{
	opacity: 1;
	font-size: 240px;
	position: relative;
	line-height: 1;
	font-weight: 200;
	margin-top: 50px;
	opacity: 0.4;
}
.fullscreen-box .lg-not-found span{
	font-size: 26px;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 14px;
	display: block;
}
.not-found-form{
	background-color: rgba(0,0,0,.2);
}
.not-found-form .form-control{
	float: left;
	width: 80%;
}
.fullscreen-box .not-found-form .form-control{
	width: 79%;
	background: transparent;
	border: 1px rgba(255, 255, 255, 0.41) solid;
	padding: 12px 20px;
}
.not-found-form .btn{
	padding: 13px 15px;
}
.btn.main-gradient:hover{
	color:#fff;
}
.lg-desc{
	font-size: 17px;
	line-height: 1.9
}
.pageWrapper,.relative{
	position:relative;
}
.over-hidden,.pageContent{
	overflow:hidden
}
.main-content{
	padding-right:40px
}
.transparent{background-color:transparent}
.uppercase{text-transform:uppercase}
.bold{font-weight:bold}
.bolder{font-weight:bolder}
.heavy{font-weight:900 !important}
.light-font{font-weight:300}
.font-15{font-size:15px !important}
.font-20{font-size:20px !important}
.font-25{font-size:25px !important}
.font-30{font-size:30px !important}
.font-35{font-size:35px !important}
.font-40{font-size:40px !important}
.font-45{font-size:45px !important}
.font-50{font-size:50px !important}
.font-55{font-size:55px !important}
.font-60{font-size:60px !important}
.font-70{font-size:70px !important}
.font-80{font-size: 80px;}
.font-90{font-size: 90px;}
.font-100{font-size: 100px;}
.font-110{font-size: 110px;}
.font-120{font-size: 120px;}
.t-left{text-align:left}
.t-center{text-align:center}
.tp-caption.t-center{text-align: center !important}
.t-right{text-align:right}
.t-justify{text-align:justify}
.no-padding{padding:0}
.xs-padding{padding-top:20px;padding-bottom:20px}
.sm-padding{padding-top:50px;padding-bottom:50px}
.md-padding,.section{padding-top:80px;padding-bottom:80px}
.lg-padding{padding-top:110px;padding-bottom:110px}
.xl-padding{padding-top:150px;padding-bottom:150px}
.inner-lg-container{padding:80px}
.row-30-lft{margin-left:-30px}
.wit-bg{background-color:rgba(255,255,255,.7)}
.blk-bg{background-color:rgba(0,0,0,.7)}
.border3px,.icon-bg.border3px:after,.icon-border.border3px:after{border-radius:3px;}
.border5px,.icon-bg.border5px:after,.icon-border.border5px:after{border-radius:5px;}
.rounded{border-radius:5px;}
.circle,.icon-bg.circle:after,.icon-border.circle:after{border-radius:50%;}
.round{border-radius:50em;}
.black-bg hr{border-color:#333}
.darker-bg hr{border-color:#444}
.dark-bg hr{border-color:#555}
.main-bg hr{border-color:rgba(255,255,255,.2)}
.main-bg .heading:after{background-color:rgba(0,0,0,.2)}
.black-tr-bg{background-color:rgba(0,0,0,.7);}
.white-tr-bg{background-color:rgb(248, 248, 248);}
.with-pad{padding:4rem;margin:0 -15px}
.md-pad{padding: 3rem}
.lg-pad{padding: 5rem}
.xl-pad{padding: 8rem}
.dark-border{border-color:#333 !important}
.lft-border-7{border-left: 5px #ddd solid}
.border-bottom-1{border-bottom: 1px #ddd solid}
.bot-1-border{border-bottom: 1px #ddd solid}
.bot-2-border{border-bottom: 2px #ddd solid}
.bot-3-border{border-bottom: 3px #ddd solid}
.bot-4-border{border-bottom: 4px #ddd solid}
.bot-5-border{border-bottom: 5px #ddd solid}
.wid-4{width:4%}/* widths */
.wid-5{width:5%}
.wid-10{width:10%}
.wid-20{width:20%}
.wid-30{width:30%}
.wid-40{width:40%}
.wid-50{width:50%}
.wid-60{width:60%}
.wid-70{width:70%}
.wid-80{width:80%}
.wid-90{width:90%}
.wid-100{width:100%}
.anim-imgs img{
	transform: scale(0);
	-webkit-transform: scale(0);
	opacity: 0
}
.anim-imgs > a:before{
	position: absolute;
	background-color: rgba(0,0,0,.6);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	content: "";
	display: inline-block;
	z-index: 9;
	opacity: 0;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.anim-imgs > a:after{
	position: absolute;
	background-color: rgba(255,255,255,.7);
	width: 40px;
	height: 40px;
	top: 40%;
	left: 50%;
	margin-top: -20px;
	margin-left: -20px;
	border-radius: 50%;
	text-align: center;
	font: normal normal normal 14px/1 FontAwesome;
	content: "\f047";
	display: inline-block;
	line-height: 40px;
	z-index: 10;
	opacity: 0;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	color:#111;
	transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
}
.anim-imgs > a:hover:before{
	opacity: 1;
}
.anim-imgs > a:hover:after{
	opacity: 1;
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	top: 50%;
}

.activ-form{
	background-color: #F5EEE3 !important;
	border:1px #D8D2C8 solid;
}
.main-bg .slick-dots li button{
	border-color: #fff
}
.main-bg .slick-dots li.slick-active button{
	background-color: #fff
}
.clear-icon{
	display: table !important;
	margin: 0 auto 5px;
}
.play-btn{
	border-radius: 50%;
    border: 3px #fff solid;
    width: 50px;
    height: 50px;
    line-height: 44px;
    text-align: center;
    display: table;
    margin: auto;
    font-size: 20px;
    padding-left: 3px;
}
.tbl{
	display:table;
	margin:auto
}
.panel-body{
	padding:30px 20px
}
.center-v-line{
	position:relative;
}
.center-v-line:before{
	position:absolute;
	left:50%;
	top:0;
	width:1px;
	height:100%;
	content:"";
	display:inline-block;
	background:#ddd;
	margin-left:-8px
}
.box-icon{
	position: relative;
}
.box-icon i{
	position: absolute;
	bottom: 0;
	right: 0;
	opacity: 0.1;
	font-size: 150px;
	transform: rotate(-40deg);
}
.main-bg .center-v-line:before{background-color:rgba(255,255,255,.2)}
[class*="-padding"]:after{
	clear:both;
	display:table;
	content:" "
}
.txt-block{
	padding:40px;
}
.txt-block h4{
	font-size: 35px;
	font-weight: 900;
	margin-bottom:5px
}
.txt-block h5{
	color:#ccc;
	font-size:20px;
	background-color:#000;
	padding:8px 15px;
	display:inline-block
}

.txt-block p{
	font-size: 17px;
}
.lg-txt{font-size:17px}
.gry-border-vertical:after{
	position:absolute;
	width:1px;
	height:100%;
	left:50%;
	top:0;
	content:"";
	display:inline-block
}
.pattern-1{
	background-image: url('../images/patterns/pattern-1.jpg');
	background-repeat: repeat;
}
.pattern-2{
	background-image: url('../images/patterns/pattern-2.jpg');
	background-repeat: repeat;
}
.pattern-3{
	background-image: url('../images/patterns/pattern-3.jpg');
	background-repeat: repeat;
}
.pattern-4{
	background-image: url('../images/patterns/pattern-4.png');
	background-repeat: repeat;
}
.pattern-5{
	background-image: url('../images/patterns/pattern-5.png');
	background-repeat: repeat;
}
.pattern-6{
	background-image: url('../images/patterns/pattern-6.png');
	background-repeat: repeat;
}
.pattern-7{
	background-image: url('../images/patterns/pattern-7.png');
	background-repeat: repeat;
}
.m-h-25{
	margin-left: -25px;
	margin-right: -25px
}
.contact-bg{
	background-image: url('../images/bgs/sec-bg-01.jpg');
	background-repeat: no-repeat;
	background-size: cover;
}
.contact-bg .pageContent{
	background-color: transparent;
}
.vertical-sep{
	background-image: url('../images/patterns/vertical-sep.png');
	background-repeat: repeat-y;
	width: 5px;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -2.5px;
}
.pattern-line-1{
	background-image: url('../images/patterns/line-1.png');
}
[class*="pattern-"]{
	background-size:inherit !important;
	background-repeat:repeat !important
}
.section-bg-1{
	background:url('../images/bgs/sec-bg-01.jpg') no-repeat 0 0
}
.section-bg-2{
	background:url('../images/bgs/sec-bg-02.jpg') no-repeat 0 0
}
.section-bg-3{
	background:url('../images/bgs/sec-bg-03.jpg') no-repeat 0 0
}
.section-bg-4{
	background:url('../images/bgs/sec-bg-04.jpg') no-repeat 0 0
}
.top-img{
	position:relative;
	margin-top:-100px
}
.wall-bg{
	background:url('../images/bgs/wall-ground.jpg') no-repeat 0 100%;
	background-size: 100% 100%
}
.shad-ins-bot{
	-webkit-box-shadow: inset 0px 19px 25px -16px rgba(0,0,0,0.75);
	box-shadow: inset 0px -19px 25px -16px rgba(0,0,0,0.75);
}
.tbl{
	display:table;
	margin:auto;
	position:relative;
	z-index:2
}
.tbl-70{width:70%}
.tbl-80{width:80%}
.tbl-90{width:90%}
.video-section{
	position: relative;
	overflow: hidden;
}
.video-section .video-wrap{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top:0;
	z-index: 1
}
.video-section .video-wrap video{
	width: 100%;
}
.video-section .row{
	z-index: 2;
	position: relative;
}
.video-box video{
	width:100%;
	height:100%
}
.show-arrows{
	overflow:visible
}
.show-arrows .slick-prev,.show-arrows .slick-next{
	opacity:1 !important;
	transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
}
.marginelements .slick-prev,.marginelements .slick-next{
	right: 15px;
}
.show-arrows .slick-prev:before, .show-arrows .slick-next:before {
	font-size: 13px;
	line-height: 30px;
}
.show-arrows .slick-prev{
	right: 32px;
}
.marginelements .slick-prev{
	right: 47px;
}
.over-title-sm .slick-prev,.over-title-sm .slick-next{
	top: -57px
}
.over-title .slick-prev,.over-title .slick-next{
	top: -77px
}
/*
------------- Parallax --------------- */
.parallax{
	position:relative;
	background-attachment: fixed;
	background-position: 50% 0;
	background-repeat: no-repeat;
	overflow: hidden;
}
html.safari .parallax{
	background-attachment: scroll;
	background-position: 0 0 !important
}
.parallax-overlay{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index:0
}
.fixed-bg{
	background-attachment: fixed !important;
	background-size: cover;
}
.parallax > .container,.fixed-bg > .container,.section > .container{
	z-index:2;
	position:relative
}
.portfolio.parallax p{
	width:70%;
	margin:20px auto;
	display:table;
}

.ads{
	padding: 22% 30px;
	position: absolute;
	height: 100%;
	left: 15px;
	width: 93%;
	display: table-cell;
	vertical-align: middle;
}
.ads p{
	margin-bottom:5px;
	line-height:1
}
.recent-posts-widget li {
	padding: 17px 0;
	border-top: 1px rgba(0,0,0,0.15) dashed;
	overflow: hidden;
}
.recent-posts-widget li:first-child{
	border-top:0;
	padding-top:0
}
.recent-posts-widget li:first-child{
	border-top:0
}
.recent-posts-widget li .post-img {
	float: left;
	margin-right: 10px;
	max-width: 60px;
	overflow: hidden;
}
.recent-posts-widget li .post-img  img {
	padding: 1px;
	max-width: 95px;
}
.recent-posts-widget li h4 {
	margin-bottom: 3px;
	font-size: 14px;
}
.recent-posts-widget li .meta {
	display: inline-block;
	margin-right: 10px;
	font-size:11px;
	color:#999
}
.recent-posts-widget li .meta i{
	margin: 0 5px 0 0;
}


a, .top-head .logo, .icon-box-1:before, .icon-box-1:after, .portfolio figure img, .port-captions *, .top-nav li li a:after, .logo img, .icon-box-1,.post-item .post-image img,.team-box.box-1 .team-socials:after,.post-item .post-image:before,
.post-item .post-image:after,.team-box.box-1 .team-img,.team-box.box-1 .team-socials,.team-box.box-1 .team-img:before,.rect-angles:before,.rect-angles:after,.rect-angles span:before,.rect-angles span:after,.zoom .img-overlay,
.icon-box-2 i,.team-box.box-1 .team-img img,.icon-box.lg-icon i:after,.icon-box.lg-icon i,.pricing-tbl,.btn,.btn i,.btn span,.header-2 .top-nav > ul > li > a:before,.social-list a i,.social-list a i:before,.social-list a i:after,.accordion h5.acc-head a:after,
.slick-prev, .slick-next,.icon-bg:after,.icon-box i,.slick-center img,.tabs.bottom-border .nav-tabs>li>a:after,.team-box.box-2 .team-socials,.team-box.box-2 .team-img img,.portfolio .port-img:before,.just-gallery img,.lft-tools li,
.top-head.box-head .top-nav > ul > li >a:before{
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.top-nav > ul > li.hasChildren > a > span:after,.child-arrow{
	-webkit-transition:transform 0.3s ease;
	transition:transform 0.3s ease;
}
.header-1 .top-nav > ul > li > a > span:before{
	-webkit-transition:all 0.25s ease-in;
	transition:all 0.25s ease-in;
}
.social-list a{
	float:left;
	display:block;
	line-height:1
}
.social-list a i{
	margin: 0 5px 5px 0;
	width: 40px;
	height: 40px;
	text-align:center;
	font-size: 20px;
	display:inline-block;
	line-height: 39px;
	border: 1px solid #ccc;
	overflow: hidden;
	position:relative
}

.social-list a i.dark-bg{
	border-color:transparent
}
.social-list a i.gry-bg{
	border-color:#ddd
}
.social-list a i.ic-colored{border-color:transparent}
.social-list a i:before{
	-webkit-transform: scale(1);
	transform: scale(1);
	display:block;
	-webkit-transition-duration: 0.5s !important;
	transition-duration: 0.5s !important;
}
.social-list a i:after{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	z-index: 9999;
	top: 0;
	display: block;
	-webkit-transform: scale(0);
	transform: scale(0);
	opacity:0;
	color:#fff;
	-webkit-transition-delay: 0.2s !important;
	transition-delay: 0.2s !important;
}
.social-list a:hover i{
	background-color:#444;
	border-color: transparent;
}
.social-list a:hover i:before{
	-webkit-transform: scale(2);
	transform: scale(2);
	opacity:0
}
.social-list a:hover i:after{
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity:1
}
.social-list.half-icons a{
	margin: 0 7px 5px 0;
	width: 47%
}
.footer-middle .social-list.half-icons a{
	background: #0B0B0B;
}
.social-list.half-icons i{
	margin: 0;
	float: left;
	border-color: #3C3C3C;
}
.social-list.half-icons span{
	display: inline-block;
	margin: 0;
	line-height: 30px;
	padding: 0 13px;
	font-size: 10px;
	text-transform: uppercase;
}
.skew-nav:before{
	top: 2px;
	height:43px
}
.skew-nav ul li a span{
	position:relative;
	line-height: 43px;
	display:block;
}
.main-bg:not(.top-bar) .social-list a i{
	border-color: #fff !important;
	color: #fff
}
/* ==========================================================================
  8. FOOTER.
============================================================================= */
/*
------------- 8.1. Footer 1 -------------- */
.footer-top {
	padding: 10px 0;
	background-color: #0B0B0B;
	color:#999
}
.footer-top p.lg-txt {
	font-size: 22px;
	line-height: 35px;
	margin:0;
	font-family: 'Oswald', sans-serif;
	font-weight: 200
}
.footer-top .btn{
	display:inline-block;
	margin:-10px 0;
	padding:24px 30px;
	font-size:16px;
	border:0
}
.footer-top .skew-btn{
	margin-top:-17px;
	padding: 22px 30px;
}
.footer-top .skew-btn:after{
	left: -9px;
	top: 0px;
	border-width: 0 0px 7px 9px;
}
.footer-top .twitter-text p{
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height:30px !important
}
.footer-top .twitter-text p{
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height:30px !important
}
.footer-top .social-list a{
	border:0px !important
}
.footer-top .twitter-pic{
	display:none
}
.bottom-md-footer h4{
	margin:0;
	line-height:30px
}
.bottom-md-footer .social-list a i{
	margin-bottom:0
}
.widget_it_widget_tweets .tweet .loading-container{
	text-align: center;
	padding: 20px 0
}
.footer-middle .widget_it_widget_tweets .timeline-Widget{
	padding: 20px 20px 0;
	background-color: #0B0B0B
}
.twitter-pic{
	text-align:center;
	margin:0 0 15px
}
.twitter-pic img{
	border-radius:50%;
	display:table;
	margin:auto
}
.footer-middle .twitter-pic img{
	border-radius:0px;
}
.twitter-text p{
	margin-bottom:0
}
#loading-container{
	display:table;
	margin:auto
}
.footer-middle {
	padding-top: 50px ;
	height: 100% ;
	position: relative;
	overflow: hidden;
	color: #888;
/*    background-size: cover !important;*/
/*	background:#111 url('../images/buildings.png') repeat-x left bottom*/
}


.no-bg{
	background-image:none
}
.footer-bg{
	background: url('../images/bgs/foot-bg.jpg') no-repeat 0 100%;
	background-size: 100% 100%;
    
}
.footer-bg.dark,.footer-bg.dark a,.footer-bg.dark .footer-middle,.footer-bg.dark .bottom-md-footer h4{
	color:#fff
}
.footer-bg .footer-middle{
	background-color:transparent
}
.footer-bg .bottom-md-footer,.footer-bg .footer-bottom,.footer-bg .footer-top{
	background-color:rgba(0,0,0,.3);
}
.footer-bottom.semi.dark{
	background-color:rgba(0,0,0,.4);
	color:#fff;
	font-size: 14px
}
.footer-bottom.semi.dark a{
	color:#fff !important;
	font-weight: bold;
}
.footer-bottom.semi.light{
	background-color:rgba(255,255,255,.4);
	color:#222;
	font-size: 14px
}
.footer-bottom.semi.light a{
	color:#000 !important;
	font-weight: bold;
}
.footer-bg.dark .form-control,.footer-bg.dark .input-group-addon{
	background-color:transparent;
	border-radius:0;
	resize:none;
	color:#fff
}
.footer-middle a {
	color: #888;
}
.foot-text-widget p {
	margin-bottom: 0;
}
.footer-middle .container {
	position: relative;
	z-index: 1;
}
.bottom-md-footer{
	padding:20px 5px;
	color: #888;
}
.bottom-md-footer .form-control{
	display:inline-block;
	float:left;
	width:75%;
	background-color:#000;
	border-color:#333;
}
.bottom-md-footer .btn{
	padding:10px 12px;
}
.bottom-md-footer label{
	margin-bottom:10px;
	display:block
}
.boo-nl{
	position:relative;
	margin-top:30px
}
.bottom-md-footer .boo-nl{
	margin-top:0
}
.nl-note{
	position:absolute;
	right:0;
	bottom:2px;
	z-index:9;
	padding:8px 15px;
	margin: 0;
	width: 100%;
	border-radius: 2px
}
.lg-newsletters .form-control{
	width: 75%;
	float: left;
	border-bottom-left-radius: 5em;
    border-top-left-radius: 5em;
    padding: 12px 17px
}
.lg-newsletters .btn{
	width: 25%;
	float: left;
	padding: 13px 10px;
	font-size: 16px;
	text-align: center;
	border-bottom-right-radius: 5em;
    border-top-right-radius: 5em;
}
.abs-icons {
	position: relative;
	overflow: hidden;
	display: inherit;
}
.abs-icons .icon{
	position: absolute;
    top: 3px;
    right: 3px;
    font-size: 12px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: #eee;
    text-align: center;
}
footer .boo-nl .form-control{
	background-color: #0B0B0B;
	border:0;
	border-radius:0;
	width: 100%;
	font-size:12px;
	display: inline-block;
	padding: 0 15% 0 12px;
	height: auto;
	line-height: 35px;
}
footer .boo-nl .btn{
	border:0;
	min-width: 20%;
	font-size: 11px;
	line-height: 33px;
	padding: 0 5px;
	white-space: nowrap;
	position: absolute;
	bottom: 1px;
	right: 1px;
}
footer .boo-nl .nl-note{
	bottom: 38px
}
footer hr{
	border-top: 1px solid #333;
}
.revtp-form .nl-note{
	bottom:auto;
	top:-125%;
	padding:20px
}
.footer-middle h3 {
	font-size: 22px;
	position:relative;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: 10px;
	font-weight: 100;
	letter-spacing: 1px
}
.footer-middle h3:after {
	content: "";
	width: 9%;
	height: 2px;
	display: block;
	margin: 15px 0;
}
.footer-middle .menu-widget li {
	padding: 12px 0;
	border-top: 1px rgba(255,255,255,0.05) solid;
	margin-right: 10px;
}
.footer-middle .menu-widget li:first-child {
	border-top: 0;
	padding-top:0
}
.footer-middle .menu-widget li a {
	position: relative;
}
.footer-middle .menu-widget li a:before {
	content: "\f105";
	display: inline-block;
	margin-right: 8px;
	font: normal normal normal 12px/1 FontAwesome;
}
.contact-widget {
	background: transparent url('../images/world.png') no-repeat 50% 65%;
}
.contact-widget p {
	margin-bottom: 10px;
}
.details li {
	margin: 13px 0;
	line-height: 1.5;
}
.details li i{
	display:table-cell;
	position: relative;
	vertical-align: middle;
}
.details li i:before {
	margin-right: 10px;
	font-size:12px;
	display:inline-block;
}
.details li span{
	display:table-cell;
	vertical-align:middle
}
/* footer tags widget */
.tags li {
	float: left;
	margin: 0 2px 7px;
	
	display: inline-block;
}
.tags li a {
	display: block;
	text-align: center;
	font-size: 11px;
	text-transform: uppercase;
	padding: 0 10px;
	z-index:1;
	height: 30px;
	overflow: hidden;
	line-height: 30px;
	border: 1px #ddd solid;
}
footer .tags li a{
	border: 1px #4c4c4c solid;
	color: #6b6b6b;
}
footer .tags li a {
	color: #bbb;
}
/******* Footer Flickr **********/
.flickr-widgetx li{
	float:left;
	margin: 0 2px 2px 0;
	position:relative;
	overflow:hidden;
}
.flickr-widgetx li img, .flickr-widgetx .img-overlay {
	width: 60px;
	height: 60px;
}
.flickr-widgetx .img-overlay:before {
	font-size: 22px;
	line-height: 59px;
	height: 59px;
	font-weight: 100;
}
.flickr-widgetx .flickr{
	height:59px;
	display:block;
	overflow:hidden
}
.flickr-widgetx .img-overlay,.zoom .img-overlay {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	background:rgba(0,0,0,.8);
	left:0;
	transform:scale(2);
	-webkit-transform:scale(2);
}
.flickr-widgetx .img-overlay:before,.zoom .img-overlay:before {
	display: block;
	content: "\f00e";
	text-align: center;
	font-size: 15px;
	font-family: FontAwesome;
	line-height: 60px;
}
.flickr-widgetx li:hover .img-overlay,.zoom:hover .img-overlay {
	opacity: 1;
	transform:scale(1);
	-webkit-transform:scale(1);
}
.zoom{
	position:relative;
	display:inline-block;
}

/***** tweets widget *****/
.widget_it_widget_tweets iframe,.timeline-Tweet-media{
	display:none !important
}
.timeline-TweetList{
	margin: 0;
	padding: 0;
	list-style: none;
}
#footWrapper .footer-top .stream,#footWrapper .footer-top .top .widget_it_widget_tweets{
	max-height:100px !important;
	overflow:hidden;
}
.widget_it_widget_tweets .widget-content .stream{
	padding:10px 15px
}
.widget_it_widget_tweets li.h-entry{
	height: 130px !important;
	overflow: hidden;
	border:0px !important
}
.timeline-header,.new-tweets-bar,.timeline-footer,.u-url.permalink.customisable-highlight,.retweet-credit,.inline-media,.footer.customisable-border,.no-more-pane,.widget_it_widget_tweets .load-more{
	display:none
}
.widget_it_widget_tweets .avatar{
	float:left;
	width:50px;
	height:50px;
	margin-right:15px
}
.widget_it_widget_tweets .e-entry-content{
	margin-left:65px
}
.widget_it_widget_tweets .widget-content,.widget_it_widget_tweets .slick-slider{
	overflow:visible
}
.widget_it_widget_tweets .timeline:before{
	display:none
}
.widget_it_widget_tweets .slick-prev,.widget_it_widget_tweets .slick-next{
	top: -50px !important;
	border-radius: 0 !important;
}
.timeline-TweetList li{
	height: 98px !important;
	overflow: hidden;
	margin-bottom: 20px;
	line-height: 1.6
}
.timeline-Tweet-text{
	margin-left: 50px;
	padding-top: 6px;
	font-size: 12px
}
.TweetAuthor {
	line-height: 1;
	font-weight: bold;
}
.TweetAuthor-avatar img{
	width: 30px;
	margin-right: 20px !important;
	float: left;
}
.tweets-widget .slick-prev{
	right:10px
}
.footer-middle .widget_it_widget_tweets .slick-prev:before,.footer-middle .widget_it_widget_tweets .slick-next:before{
	width: 30px;
	height: 30px;
	line-height: 30px
}
.footer-middle .widget_it_widget_tweets .slick-prev,.footer-middle .widget_it_widget_tweets .slick-next{
	top:-50px;
	right: -20px;
	background-color: #0B0B0B;
	padding: 0
}
.footer-middle .widget_it_widget_tweets .slick-prev{
	right: 11px
}
.widget_it_widget_tweets .slick-prev{
	right: 31px;
}
.widget_it_widget_tweets .slick-next:before {
	content: "\f106";
	font-size: 14px;
}
.widget_it_widget_tweets .slick-prev:before {
	content: "\f107";
	font-size: 14px;
}

.footer-bottom {
	padding: 20px 0;
	overflow: hidden;
	font-size: 12px;
	color: #999;
	background-color: #0b0b0b;
}
.footer-bottom .copyrights{
	padding-top:5px
}
.footer-menu li {
	float: left;
	padding: 0 0 0 5px;
}
.footer-menu li a{
	display:block;
	padding:4px 8px;
	border:1px transparent solid
}
.footer-menu li a:hover{
	border-color: #232323;
	color: #fff;
}
.footer-menu li:first-child{
	padding:0
}
.footer-menu li a {
	color: #999;
}
.footer-bottom .social-list a i{
	margin-bottom:0;
}
.foot-about-par{
	border-bottom: 1px rgba(255,255,255,0.05) solid;
	padding-bottom:20px;
	margin-bottom: 25px
}
/* footer recent posts widget */
.recent-posts-footer li {
	padding: 17px 0;
	border-top: 1px rgba(255,255,255,0.05) solid;
	overflow: hidden;
}
.recent-posts-footer li:first-child{
	border-top:0;
	padding-top:0
}
.recent-posts-footer li:first-child{
	border-top:0
}
.recent-posts-footer li .post-img {
	float: left;
	margin-right: 10px;
	max-width: 60px;
	overflow: hidden;
	max-height: 60px;
	border-radius: 5px;
}
.recent-posts-footer li .post-img  img {
	padding: 1px;
	max-width: 95px;
}
.recent-posts-footer li h4 {
	margin-bottom: 3px;
	font-size: 13px;
	font-family: inherit;
	font-weight: 600
}
.recent-posts-footer li .meta {
	display: inline-block;
	margin-right: 10px;
	font-size:12px;
	color:#777;
	font-style: italic;
}
.recent-posts-footer li .meta i{
	margin: 0 5px 0 0;
}
#footWrapper.light .black-bg,#footWrapper.light .footer-top:not([class*="-bg"]){
	background-color:#f0f0f0;
	color:#666
}
#footWrapper.light .footer-middle .social-list.half-icons a{
	background-color: #ddd;
	color: #333
}
#footWrapper.light .footer-bottom,#footWrapper.light .footer-middle ul.half-items li span{
	background-color:#eee;
	color:#666
}
#footWrapper.light hr {
    border-top: 1px solid #ccc;
}
#footWrapper.light .footer-middle .menu-widget li {
    border-top: 1px rgba(0,0,0,0.05) solid;
}
#footWrapper.light .footer-middle .menu-widget li:first-child{
	border:0
}
#footWrapper.light .footer-middle h3{
	color:#333
}
#footWrapper.light .tags li a {
    border: 1px #ccc solid;
    color: #555;
}
#footWrapper.light .nl .form-control {
	background-color: #ddd;
}
#footWrapper.light .footer-middle{
	/*background: #072239 url('../images/Footer_Final.png') repeat-x left bottom;*/
   /* background: #E0E0E0 ;*/
   
	color:#666;      
}
.footer-img{
  
	bottom: 0;
	padding: 0 !important;
	width:100%;
	
}
#footWrapper.light .no-bg{
	background-image:none
}
#footWrapper.light .footer-menu li a:hover {
    border-color: #ccc;
    color: #555;
}
.fixed-footer{
    
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	z-index:-1
}
/*
----------- 8.6. Footer Minimal --------------- */
.footer-minimal .footer-middle:after {
	display: none;
}
.footer-minimal .footer-bottom {
	padding: 0;
}
.footer-minimal .footer-bottom .copyrights {
	padding: 15px 0 13px;
}
.footer-logo-txt{
	margin: 5px 20px 0;
	width: 40%;
	line-height: 1.7;
}
.minimal-info{
	line-height:25px;
	margin:10px 0 0 0
}
.minimal-info i{
	margin-right:10px
}
.centered{
	margin:auto
}
.footer-minimal .social-list a{
	font-size:15px;
	color:#999;
	margin:8px 4px 0;
}
.footer-minimal .social-list a:hover{
	color:#fff
}
.footer-minimal .sm-padding{
	padding:50px 0 !important
}
.footer-minimal .footer-menu li{
	text-transform:uppercase;
	font-size: 12px;
}
.footer-minimal .footer-menu li a{
	border:1px #444 solid;
}
.footer-minimal .footer-menu li a:hover{
	border:1px #888 solid;
}

.footer-menu li:first-child{
	padding:0
}


.my-info{
	position: absolute;
	right: 15px;
	top: 30%;
	padding: 20px;
	background-color: rgba(255,255,255,.2);
}
.my-info li{
	color:#bbb;
	font-size:14px;
	border-top: 1px rgba(255, 255, 255, 0.18) solid;
	padding:5px
}
.my-info li a{
	color:#bbb
}
.my-info li:first-child{
	border-top:0
}
.work-exp,.flickr-widgetx{
	margin: 0;
	padding: 0;
	list-style: none;
}
.work-exp li{
	margin-bottom: 25px
}
.my-exp h5{
	font-size:13px;
	margin-bottom:5px
}
.my-exp h5 i{
	margin-right:10px
}
.my-exp p{
	margin:0 0 15px 25px
}



.red{
	color: red
}
ul.half-items li{
	width: 47%;
	margin: 0 3% 5px 0;
}
ul.half-items li span{
	display:inline-block;
	padding: 0 10px;
	position: relative;
	top: -1px;
	font-size: 9px;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 30px;
	width: 74%;
}
.footer-middle ul.half-items li span{
	background-color:#343434
}
.input-wrap{
	padding-bottom:8px
}
footer .normal-testimonials{
	border-radius:5px;
}
footer .testimonials-img{
	border-radius:50%;
	display:table;
	margin:15px auto;
	overflow:hidden
}
footer .testimonials-bg p,.testimonials-name{
	font-size:12px;
	padding:0 15px
}
.horizontal-slider{
	/*overflow:hidden;*/
}
.slick-dots, .slider_controls {
	display: table;
	margin: 10px auto;
	padding:0;
	list-style:none
}
.slick-dots li{
	float:left;
	margin:0 5px 0 0
}
.slick-dots li button {
    border: 1px #999 solid;
}
.slick-dots li button {
    height: 12px;
    width: 12px;
    outline: 0;
    line-height: 10px;
    border-radius: 50%;
    cursor: pointer;
    background: 0 0;
    display: block;
    padding: 0;
}
.slick-slide img{
	margin:auto
}
.ajax-cont{
	max-width:600px;
	margin:20px auto;
	position:relative
}
.marginelements .slick-slide{
	margin:0 15px;
}
.custom-list{
	list-style:none;
	margin:0;
	padding:0
}
.custom-list li{
	line-height:45px
}
.custom-list li i{
	margin-right:10px;
	font-size:90%
}
.custom-list.style2 li{
	border-bottom:1px #ddd dashed
}
.custom-list.style2 li:last-child{
	border-bottom: 0
}
.custom-list.style3 li i{
	width: 22px;
	height: 22px;
	text-align: center;
	line-height: 23px;
	font-size: 10px;
}

.p-a-0{padding: 0 !important}
.p-a-1{padding: 1rem !important}
.p-a-2{padding: 2rem !important}
.p-a-3{padding: 3rem !important}

.p-b-0{padding-bottom: 0 !important}
.p-b-1{padding-bottom: 1rem !important}
.p-b-2{padding-bottom: 2rem !important}
.p-b-3{padding-bottom: 3rem !important}

.p-t-0{padding-top: 0 !important}
.p-t-1{padding-top: 1rem !important}
.p-t-2{padding-top: 2rem !important}
.p-t-3{padding-top: 3rem !important}

.p-r-0{padding-right: 0 !important}
.p-r-1{padding-right: 1rem !important}
.p-r-2{padding-right: 2rem !important}
.p-r-3{padding-right: 3rem !important}

.p-l-0{padding-left: 0 !important}
.p-l-1{padding-left: 1rem !important}
.p-l-2{padding-left: 2rem !important}
.p-l-3{padding-left: 3rem !important}

.m-a-0{margin: 0 !important}
.m-a-1{margin: 1rem !important}
.m-a-2{margin: 2rem !important}
.m-a-3{margin: 3rem !important}

.m-b-0{margin-bottom: 0 !important}
.m-b-1{margin-bottom: 1rem !important}
.m-b-2{margin-bottom: 2rem !important}
.m-b-3{margin-bottom: 3rem !important}

.m-t-0{margin-top: 0 !important}
.m-t-1{margin-top: 1rem !important}
.m-t-2{margin-top: 2rem !important}
.m-t-3{margin-top: 3rem !important}

.m-r-0{margin-right: 0 !important}
.m-r-1{margin-right: 1rem !important}
.m-r-2{margin-right: 2rem !important}
.m-r-3{margin-right: 3rem !important}

.m-l-0{margin-left: 0 !important}
.m-l-1{margin-left: 1rem !important}
.m-l-2{margin-left: 2rem !important}
.m-l-3{margin-left: 3rem !important}

.m-t-8px{margin-top: 8px}
.mtop-10{margin-top: -10px}
.m-auto{margin: auto;}
.lg-v-pad li {
	padding: 0 0 8px;
	margin-bottom: 8px;
	overflow: hidden;
	border-bottom: 1px #ddd dashed
}
.lg-v-pad li:last-child{
	border-bottom: 0
}

.login-inner{
	margin-top: 150px
}
.login-head{
	font-size:25px;
	font-weight:bold;
	text-transform:uppercase;
	margin-bottom: 5px
}
.login-box-lg .login-inner:after{
	position:absolute;
	right: 0;
	bottom:-5px;
	width: 98%;
	height:3px;
	content:"";
	display:inline-block;
}
.login-creative .pageWrapper,.login-creative .pageContent{
	background-color: transparent;
}
.login-creative{
	background:#fff url('../images/bgs/sec-bg-04.jpg') 
}
.login-box{
	border:4px #ddd solid;
	box-shadow: 0px 0px 20px 10px rgba(0, 0, 0, 0.19);
	-webkit-box-shadow: 0px 0px 20px 10px rgba(0, 0, 0, 0.19);
}
.mfp-media{
	padding: 0 30px;
	width: 100%;
	max-width: 500px;
	margin: auto;
	position: relative;
}
/*
-------------- coming soon --------------- */
.soon-page{
	background:#14191e url('../images/bgs/soon.jpg') no-repeat 0 0;
	background-size:cover;
}
.soon-page .pageWrapper {
	padding-top:80px
}
.soon-logo{
	display:table;
	padding: 0 30px;
	margin: 60px auto 0;
}
.soon-logo a{
	color:#fff
}
.soon-lg-head{
	font-size:100px;
	padding:0;
	padding-top: 15px;
	margin:0;
	font-weight: 300;
}
.soon-heading h2{
	font-size:40px;
	margin:0;
	padding:0;
	font-weight: 100
}
.maintenance .pageWrapper{
	padding-top: 150px
}
.maintenance .lg-head{
	font-size:40px;
	padding:0;
	padding-top:40px;
	margin:0;
	font-weight: 300;
}
.maintenance .sec-head{
	font-size:56px;
	margin:0;
	padding:0;
	font-weight: 900;
	line-height: 1
}
.soon-heading h3{
	font-size:24px;
	font-weight:300;
	padding:0;
}
.inl-txt{
	width: 77%;
	display: inline-block;
	padding: 12px;
	vertical-align: middle;
}
.maintenance{
	background: url('../images/bgs/sec-bg-03.jpg') no-repeat 0 0;
}
/*
----------- sitemap ---------------- */
.sitemap ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
.sitemap > ul > li > a{
	padding:15px 25px;
	text-transform:uppercase;
	display:block;
	clear:both;
	overflow:hidden;
	font-weight:bold
}
.sitemap > ul > li > a i{
	margin-right:10px
}
.sitemap > ul > li > ul{
	padding:10px 0 30px;
	overflow:hidden;
	font-size: 12px
}
.sitemap > ul > li > ul > li{
	float:left;
	margin:20px 16px 0 0;
	width:23%
}
.sitemap > ul > li > ul > li:nth-child(4n+1){
	clear:left
}
.sitemap > ul > li > ul > li > a,.sitemap > ul > li > ul > li > h4{
	font-weight:bold;
	text-transform:uppercase;
	margin-bottom:8px;
	display:block;
	font-size:13px
}
.sitemap > ul > li > ul > li li{
	padding:5px 10px 5px 17px;
	position:relative
}
.sitemap > ul > li > ul > li li:before{
	position:absolute;
	left:0;
	top:10px;
	font: normal normal normal 9px/1 FontAwesome;
	content:"\f068";
	display:inline-block;
}
.sitemap .mega-menu ul{
	width: auto !important
}

.pageWrapper.boxed{
	position: relative;
	background: #fff;
	box-shadow: 0 3px 10px rgba(0,0,0,0.2);
	width: 1170px;
	margin: 20px auto;
	overflow: hidden;
}
.pageWrapper.boxed .rev_slider_wrapper{
	width: 100% !important;
	left: 0 !important
}
.pageWrapper.boxed .fullwidthbanner-container,.pageWrapper.boxed .forcefullwidth_wrapper_tp_banner,.pageWrapper.boxed .fullscreen-container{
	width:100% !important;
	left:0 !important
}
.pageWrapper.boxed .top-head.transparent,.pageWrapper.boxed .top-head.sticky-nav{
	width:auto;
	left:auto;
	top:20px
}
.pageWrapper.boxed .top-head.sticky-nav{
	top:0
}
.pageWrapper.boxed .fixed-footer{
	width:auto;
	left:auto;
}
.bg1 {background: #fff url('../images/patterns/body/bg1.jpg');}
.bg2 {background: #fff url('../images/patterns/body/bg2.jpg');}
.bg3 {background: #fff url('../images/patterns/body/bg3.jpg');}
.bg4 {background: #fff url('../images/patterns/body/bg4.jpg');}
.bg5 {background: #fff url('../images/patterns/body/bg5.jpg');}
.bg6 {background: #fff url('../images/patterns/body/bg6.jpg');}
.bg7 {background: #fff url('../images/patterns/body/bg7.jpg');}
.bg8 {background: #fff url('../images/patterns/body/bg8.jpg');}
.bg9 {background: #fff url('../images/patterns/body/bg9.jpg');}
.bg10 {background: #fff url('../images/patterns/body/bg10.jpg');}
.bg11 {background: #fff url('../images/patterns/body/bg11.jpg');}
.bg12 {background: #fff url('../images/patterns/body/bg12.jpg');}
.bg13 {background: #fff url('../images/patterns/body/bg13.jpg');}
.bg11, .bg12, .bg13 {
	background-attachment: fixed !important;
	background-position: center bottom !important;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	-webkit-background-size: cover !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
}
.abs-img{
	position: absolute;
}
.center-or{
	display: inline-block;
	font-weight: bold;
	padding: 0 10px
}
.boxed .hidden-md{
	width: 2%
}
.boxed .mn-cell{
	width: 85%
}
@media only screen and (min-width: 992px) and (max-width: 1200px){
	.top-nav > ul > li > a > span, .top-nav > ul > li > span > a > span {
	    padding: 0 9px;
	}
	.team-box.box-3 .back{
		padding: 0 15px !important
	}
}
@media (max-width: 1400px) {
	.side-wrap .container {
	   width: 100% !important;
	}
}
@media only screen and (min-width: 1200px) and (max-width: 1400px){
	.hidden-md{
		width: 2%
	}
	.mn-cell{
		width: 85%
	}
}
@media (max-width: 1200px){
	.top-head:not(.header-2).top-nav > ul > li > a {
	    margin: 0 2px 0 0 !important;
	}
	.social-list.half-icons a{
		width: 45%
	}
	.social-list.half-icons span{
		padding: 0 4px;
	}
	.mn-cell{
		width: 100%;
	}
	.md-pd-40{
		padding-left: 40px;
		padding-right: 80px
	}
	.pageWrapper.boxed {
		width: auto;
		margin:auto
	}
	.pageWrapper.boxed .top-head.transparent,.pageWrapper.boxed .top-head.sticky-nav,.pageWrapper.boxed .fixed-footer{
		width:100%;
		left:0
	}
	.fullscreen-box .not-found-form .form-control{
		width: 83.5%
	}
}
@media (max-width: 992px) {
	.with-pad{
		margin-left: 0;
		margin-right: 0
	}
	.top-head:not(.header-1).top-nav > ul > li {
	    padding: 0 3px;
	}
	.top-nav > ul > li > a > span, .top-nav > ul > li > span > a > span {
	    padding: 0 10px;
	}
	.header-1.skew .top-nav > ul > li:hover > a > span:before, .header-1.skew .top-nav > ul > li.selected > a > span:before {
	    top: -1px;
	    height: 51px;
	    left: 0;
	}
	.row-eq-height{
    	display: block;
    }
	.row-30-lft{margin-left:0}
	.top-head .logo,.top-bar .f-right,.top-bar .f-left{
		display: table;
		margin: 0 auto;
		float: none;
		text-align: center;
		border-right: 0 !important;
		padding: 10px 0 !important;
	}
	.sticky-nav.header-1 .logo,.top-head:not(.header-1).sticky-nav .logo{
		padding:10px 0 !important;
	}
	.sticky-nav .logo img{
		max-height: 150px !important;
		top: 0 !important
	}
	.video-section .video-wrap{
		top:0 !important;
	}
	.top-head.skew:before {
    	top: auto;
    	bottom: 23px;
    }
    .fullscreen-box .not-found-form .form-control{
		width: 78.5%
	}
    .steps-1-container [class*="col-sm-"],.steps-1-container [class*="col-md-"],.steps-1-container [class*="col-lg-"]{
    	display: table;
    	margin: 0 auto 20px;
    	width: 80%;
    	float: none;
    }
    .skew .logo:before,.top-bar.right-pos.gry-bar:before,.icon-boxes-1:before, .icon-boxes-1:after,.icon-boxes-1 [class*="col-md-"]:before, .icon-boxes-1 [class*="col-md-"]:after,.steps-1-container:before,
    .steps-1 i:after, .steps-1 h4:before,.steps-1 h4:after,.timeline:before,.dl-back{
		display:none !important
	}
	.steps-1{
		overflow: hidden;
		padding-bottom: 20px;
		margin-bottom: 20px;
		border-bottom: 1px rgba(0,0,0,.1) dashed
	}
	.steps-1 h4,.steps-1 i{
		float: left;
	}
	.steps-1 p{
		margin: 15px 0 0 0;
		float: right;
		display: table;
		width: 44%;
	}
	.steps-1.alter i,.steps-1.alter h4{
		float: right;
	}
	.steps-1 i{
		margin: 0 20px 0 0 !important
	}
	.steps-1 h4{
		padding: 15px 20px 10px 0 !important
	}
	.steps-1.alter h4{
		padding: 15px 0 10px 20px !important
	}
	.steps-1.alter i{
		margin: 0 0 0 20px !important
	}
	.steps-1.alter p{
		padding: 0;
		float: left;
	}
	.testimonials-1{
		margin: 0 !important
	}
	.inner-tiles{
		padding: 0;
		margin: 0 -15px
	}
	.absolute-top-bar.right-pos,.top-bar.right-pos,.abs-img,.med-top-cell{
		position:static !important;
		display: table;
		margin: auto;
		float:none
	}
	.skew .logo:after {
	    transform: skew(0deg, 0deg);
	    -webkit-transform: skew(0deg, 0deg);
	}
	.header-2 .responsive-nav{
		display:table;
		margin:10px auto 0;
		float:none;
	}
	.header-2.top-head .logo{
		display:block
	}
	.top-bar.right-pos{
	    border-radius: 50em;
	    padding-right:5px;
	    margin-top:5px
	}
	.icon-box-2 .icon-desc{
		margin: 0 0px -63px 7px !important;
	}
	.team-box.box-3,.feature-img{
		height: auto !important;
		width: 50%;
		display: table;
		margin: 0 auto 30px;
	}
	.team-box.box-3 .top,.team-box.box-3 .bottom{
		background-image: none !important;
	}
	.team-box.box-3 .tm-img{
		display: block;
	}
	.cta_btn{
		text-align: center;
	}
	.cta_btn .f-left,.cta-right,.cta-left{
		float: none;
	}
	.cta-right,.cta-left{
		display: table !important;
		margin: 0 auto 10px;
	}
	.cta_btn a.btn,.bottom-head{
		margin: 15px auto 0;
		float: none;
		display: table;
	}
	h4.cta_heading{
		margin-top: 15px
	}
	.icon-box-1,.post-item,.pricing-tbl{
		margin-bottom: 20px
	}
	#footWrapper [class*="col-md-"]{
		margin-bottom: 20px;
		clear: both;
		overflow: hidden;
	}
	.footer-menu.f-right,.copyrights{
		float: none;
		margin: auto;
		display: table;
		text-align: center;
	}
	.footer-top .skew-btn{
		display: table;
		margin:auto;
		float: none; 
	}
	.footer-top p.lg-txt{
		line-height: normal;
		text-align: center;
		margin-bottom: 20px
	}
	.parallax{
		background-repeat: repeat-y;
	}
	.social-list.half-icons a{
		width: 47%
	}
	.social-list.half-icons span{
		padding: 0 11px;
	}
	[class*="col-md-"].f-right{
		clear: both;
		float: none;
	}
	[class*="col-md-"]{
		clear: both;
	}
	.timeline .post-item{
		width: 100% !important;
		float: none !important;
	}
	.timeline .post-item .timeline_date{
		position: static !important;
	}
	.timeline .post-item .timeline_date .inner_date{
		border-radius: 0 !important
	}
	.timeline .post-item .timeline_date,.near-cell{
		margin-bottom: 15px !important
	}
	.img-div{
    	position: static !important;
    	min-height: 250px
    }
    .icon-box.simple,.icon-box-2,.icon-box{
    	margin-bottom: 40px !important
    }
    [class*="-cols"] .portfolio-item{
    	width: 32.3333% !important
    }
    .ads,.center-v-menu{
    	position: static !important;
    	margin: 0 auto 30px;
    	display: table;
    	width: 100%
    }
    .wid-50,.wid-40,.wid-30,.wid-20,.wid-10{
    	width: 90% !important
    }
    .responsive-nav,.top-head.skew:before,.header-left,.header-right{
		display:none !important;
	}
	.left-s.side-wrap,.right-s.side-wrap,.near-cell{
		margin-left: 0 !important;
		margin-right: 0 !important
	}
	.newNav{
		display:block
	}
	.responsive-menu ul ul{
		width: auto !important;
	}
	.camera_wrap{
		margin-bottom: 100px !important;
	}
}

@media (max-width: 768px) {
	[class*="col-md-"]{
		clear: both;
	}
	.icon-box-2 .icon-desc:after{
		border-width: 0 !important;
	}
	.icon-box-2 .box-number{
		padding:20px 0
	}
	.icon-box-2 .icon-desc i{
		bottom:15px
	}
	.icon-box-2 .icon-desc{
		padding:30px 10px 90px
	}
	.team-box.box-3,.feature-img{
		width: 60% !important;
	}
	.filter-by.style2 ul li a span{
		padding-top: 10px !important;
		padding-bottom: 10px !important
	}
	.not-found-form .form-control{
		width: 100%;
		margin-bottom: 5px
	}
	.not-found-form .btn{
		width: 100%;
		display: block;
	}
	[class*="-cols"] .portfolio-item {
	    width: 49% !important;
	}
}
@media (max-width: 640px) {
	[class*="-cols"] .portfolio-item {
	    width: 100% !important;
	    margin: 0 0 1%
	}
}
@media (max-width: 480px) {
    
	.md-pd-40 {
	    padding-left: 15px;
	    padding-right: 15px;
	}
	.steps-1-container [class*="col-sm-"],.steps-1-container [class*="col-md-"],.steps-1-container [class*="col-lg-"]{
    	display: table;
    	margin: 0 auto 20px;
    	width: 100%
    }
    .team-box.box-3,.feature-img{
		width: 100% !important;
	}
	.filter-by ul li a span{
		padding: 0 10px !important
	}
	.filter-by ul li{
		margin-bottom: 15px
	}
}

@media (max-width: 320px) {
    .post-item .lft-tools{
    	float: none;
    	margin: -20px 0 10px;
    	width: auto;
    	overflow: hidden;
    }
    .post-item .lft-tools ul{
    	display: table;
    	width: 100%
    }
    .post-item .lft-tools li{
    	display: table-cell;
    	text-align: center;
    	border-top-width: 0px !important;
    	font-size: 0px
    }
    .post-item-rit{
    	margin: 0 0 0 0;
    }
    .steps-1.alter p{
    	width: 30%
    }
}

/* version 1.2.0 */
.tooltip.bottom .tooltip-arrow {
    border-width: 0 5px 5px !important;
    border-bottom-color: #000 !important;
    border-style: solid !important;
}
.slbar{
	position: fixed;
	width: 100%;
	background-color: #222;
	color: #fff;
	z-index: 99;
	cursor: default;
}
.slbar.bottom_left,.slbar.bottom_right{
	top: auto;
	bottom: 0
}
.slbar.middle_left,.slbar.middle_right{
	top: 0;
	height: 100%;
	width: auto;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	z-index: 99999;
}
.slbar.middle_right{
	top: 0;
	height: 100%;
	right: 0;
	left: auto;
}
.sl_bar_content{
	overflow: hidden;
	padding-left: 30px;
	padding-right: 30px;
	display: none;
}
.slbar.middle_left{
	width: 300px;
	transform: translate3d(-300px,0,0);
}
.slbar.middle_right{
	width: 300px;
	transform: translate3d(300px,0,0);
}
a.slbar_btn.inbar{
	min-width: 40px;
	min-height: 40px;
	position: absolute;
	text-align: center;
	line-height: 40px;
}
.slbar.top_right a.slbar_btn{
	bottom: -40px;
	right: 0;
}
.slbar.top_left a.slbar_btn{
	bottom: -40px;
	left: 0;
}
.slbar.middle_right a.slbar_btn{
	top:50%;
	margin-top: -40px;
	left: -40px;
}
.slbar.middle_left a.slbar_btn{
	top:50%;
	margin-top: -40px;
	right: -40px;
}
.slbar.bottom_right a.slbar_btn{
	top: -40px;
	right: 0;
}
.slbar.bottom_left a.slbar_btn{
	top: -40px;
	left: 0;
}
a.slbar_btn i{
	position: relative;
	z-index: 2
}
a.slbar_btn.triangle{
	background-color: transparent !important
}
a.slbar_btn.triangle:after{
	width: 0;
	height: 0;
	border-style: solid;
	position: absolute;
	z-index: 0;
	top: 0;
	content: "";
    display: inline-block;
}
.slbar.top_right a.slbar_btn.triangle:after,.slbar.middle_right a.slbar_btn.triangle:after{
	border-width: 0 40px 40px 0;
	left: 0;
}
.slbar.top_left a.slbar_btn.triangle:after,.slbar.middle_left a.slbar_btn.triangle:after{
	border-width: 40px 40px 0 0;
	left: 0;
}
.slbar.bottom_right a.slbar_btn.triangle:after{
	border-width: 0 0 40px 40px;
	left: 0;
}
.slbar.bottom_left a.slbar_btn.triangle:after{
	border-width: 40px 0 0 40px;
	left: 0;
}
.slbar.top_right a.slbar_btn.triangle i,.slbar.middle_right a.slbar_btn.triangle i{
	top: -8px;
    right: -7px;
}
.slbar.top_left a.slbar_btn.triangle i,.slbar.middle_left a.slbar_btn.triangle i{
	top: -8px;
    left: -7px;
}
.slbar.bottom_right a.slbar_btn.triangle i{
	bottom: -7px;
    right: -7px;
}
.slbar.bottom_left a.slbar_btn.triangle i{
	bottom: -6px;
    left: -9px;
}
.slbar.bottom_right a.slbar_btn,.slbar.bottom_left a.slbar_btn{
	top: -40px;
}
.slbar.sl_tp_border:not(.middle_left):not(.middle_right){
	border-top-width: 3px;
	border-top-style: solid;
	margin-top: -3px
}
.slbar.sl_tp_border.bottom_left,.slbar.sl_tp_border.bottom_left{
	bottom: -3px !important
}
.slbar.sl_tp_border.active{
	margin-top: 0 !important
}
.slbar.middle_right.sl_tp_border{
	border-right-width: 3px;
	border-right-style: solid;
}
.slbar.middle_left.sl_tp_border{
	border-left-width: 3px;
	border-left-style: solid;
}
.sl_bar_content{
    padding-top: 20px;
    padding-bottom: 20px;
}
a.slbar_btn {
    font-size: 13px;
    color: #fff !important
}
.slbar.top_right a.slbar_btn.triangle:after,.slbar.middle_right a.slbar_btn.triangle:after{
    border-color: transparent #222 transparent transparent;
}
.slbar.top_left a.slbar_btn.triangle:after,.slbar.middle_left a.slbar_btn.triangle:after{
    border-color: #222 transparent transparent transparent;
}
.slbar.bottom_right a.slbar_btn.triangle:after{
    border-color: transparent transparent #222 transparent;
}
.slbar.bottom_left a.slbar_btn.triangle:after{
    border-color: transparent transparent transparent #222;
}
.slbar {
    background-color: #222;
}
.slbar,.slbar a:not(.slbar_btn) {
    font-size: 14px;
    color: #ccc !important;
}
.slbar .widget-head {
    background-color:transparent !important;
    line-height: 1;
    margin: 0 0 10px;
}
.slbar .widget-head,.slbar .widget-head span{
    font-size: 22px;
    color: #fff !important;
}
.pageWrapper {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
body.slbar-push-body {
    overflow-x: hidden;
    cursor: url('../images/close.png') 15 15,default;
}
.notinbar{
	position: static !important;
}
.body-overlay{
	opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.6);
    z-index: -1;
    pointer-events: none;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease;
}
body.opened-slid .body-overlay{
	opacity: 1;
	z-index: 298;
    pointer-events: auto;
}

.Table-list .CountToics:before{content:"\f0f6";font:normal 12px/25px FontAwesome;padding:0 0 0 10px;color:#AFAFAF;float:right}
.Table-list .CatView:after{content:"\f06e";font:normal 12px/25px FontAwesome;padding:0 0 0 10px;color:#AFAFAF;}
.Table-list .CatIcon:before{content:"\f115";font:normal 18px/1 FontAwesome;float:right;}
.Table-list .PageIcon:before{content:"\f0f6";font:normal 12px FontAwesome;;float:right}
.Table-list .PageView:after{content:"\f06e";font:normal 12px/25px FontAwesome;padding:0 0 0 10px;color:#AFAFAF;}
.Table-list .PageView{font-size:12px!important;line-height:25px;text-align:left}
.Table-list .CatName{font-size:18px;font-weight:normal !important}
.Table-list .PageHeader{font-size:17px;font-weight:normal !important}
.Table-list{height:40px;position:relative;padding:12px 0 0 0;margin:0 0 10px 0;display:table;width:100%;}
.Table-list:after{width:100%;height:1px;background:#E4E4E4;content:"";position:absolute;clear:both;right:0;bottom:0;}
[class*="Table-list-td-"]{display:table-cell;padding:5px 5px}
.Table-list-td-2{}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* Dont Show in mobile*/ 
@media (max-width:480px){
	
.no-mobile{display:none !important}
.only-mobile{display:unset !important}
[class*="col-md-"]:not(.slick-slide){padding:0  15px !important}
.post-item{margin:0 !important}

.tabs .nav-tabs > li a {
	width:300px;
  margin: 8px;
 
}
 
/* *************************** hadatha style ****************/
 .vertical-tab .nav-tabs .nav-tabs11 a:hover,
.vertical-tab .nav-tabs .nav-tabs11.active a{
    color: #FFF;
	 background: rgb(0,231,197);
background: linear-gradient(90deg, rgba(0,231,197,1) 0%, rgba(41,133,182,1) 50%, rgba(111,44,173,1) 100%); 
      border: 1px solid #ddd;
}

 a:hover,
a:focus{
    text-decoration: none;
    outline: none;
}
.vertical-tab{
    margin-top: 50px !important;
    display: table;
}
.vertical-tab .nav-tabs{
    width: 27%;
    min-width: 27%;
    padding-left: 15px;
    border: none;
    vertical-align: middle;
    display: table-cell;
	height:400px;
	text-align:center;
}
.vertical-tab .nav-tabs li{ float: none; }
.vertical-tab .nav-tabs li a{
   width: 180px !important;
	   color: #8d8d8e;
   background:  #fcfcfc;
   border: 1px solid #ddd;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
    padding: 10px 10px;
    margin: 0 0 10px 0;
 
    position: relative;
    z-index: 1;
    transition: all 0.3s ease 0s;
	
   box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .22);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
	text-align:center;
}
.vertical-tab .nav-tabs .nav-tabs1 a:hover,
.vertical-tab .nav-tabs .nav-tabs1.active a{
    color: #36bbed;background: linear-gradient(135deg, rgba(239, 243, 252, 1) 0%, rgba(223, 228, 242, 1) 100%);
    background: linear-gradient(#dfe4f2,#f4f7ff);
    border: none;
	
}

.vertical-tab .nav-tabs .nav-tabs2 a:hover,
.vertical-tab .nav-tabs  .nav-tabs2.active a{
    color: #f5a609;
   background: linear-gradient(135deg, rgba(239, 243, 252, 1) 0%, rgba(223, 228, 242, 1) 100%);
    border: none;
}

.vertical-tab .nav-tabs .nav-tabs3 a:hover,
.vertical-tab .nav-tabs  .nav-tabs3.active a{
    color: #b9168b;
   background: linear-gradient(135deg, rgba(239, 243, 252, 1) 0%, rgba(223, 228, 242, 1) 100%);
    border: none;
}
.vertical-tab .nav-tabs .nav-tabs4 a:hover,
.vertical-tab .nav-tabs  .nav-tabs4.active a{
    color: #f16620;
    background: linear-gradient(135deg, rgba(239, 243, 252, 1) 0%, rgba(223, 228, 242, 1) 100%);
    border: none;
}
.vertical-tab .nav-tabs .nav-tabs5 a:hover,
.vertical-tab .nav-tabs  .nav-tabs5.active a{
    color: #0081c7;
    background: linear-gradient(135deg, rgba(239, 243, 252, 1) 0%, rgba(223, 228, 242, 1) 100%);
    border: none;
}
.vertical-tab .nav-tabs .nav-tabs1.active a:hover,
.vertical-tab .nav-tabs .nav-tabs1.active a{ color: #36bbed; }

.vertical-tab .nav-tabs .nav-tabs2.active a:hover,
.vertical-tab .nav-tabs .nav-tabs2.active a{ color: #f5a609; }

.vertical-tab .nav-tabs .nav-tabs3.active a:hover,
.vertical-tab .nav-tabs .nav-tabs3.active a{ color: #b9168b; }

.vertical-tab .nav-tabs .nav-tabs4.active a:hover,
.vertical-tab .nav-tabs .nav-tabs4.active a{ color: #f16620; }

.vertical-tab .nav-tabs .nav-tabs5.active a:hover,
.vertical-tab .nav-tabs .nav-tabs5.active a{ color: #0081c7; }

.vertical-tab .nav-tabs li a:before,
.vertical-tab .nav-tabs li a:after{
    content: "";
    
    height: 10px;
    width: 10px;
    border-radius: 50%;
    transform: scale(0);
    position: absolute;
    bottom: -2px;
    left: 0;
    z-index: -1;
    transition: all 0.3s ease 0s;
	
}
.vertical-tab .nav-tabs .nav-tabs1 a:before,
.vertical-tab .nav-tabs .nav-tabs1 a:after{
	
	background: #36bbed;
}
.vertical-tab .nav-tabs .nav-tabs2 a:before,
.vertical-tab .nav-tabs .nav-tabs2 a:after{
	background: #f5a609;
}
.vertical-tab .nav-tabs .nav-tabs3 a:before,
.vertical-tab .nav-tabs .nav-tabs3 a:after{
	background: #b9168b;
}
.vertical-tab .nav-tabs .nav-tabs4 a:before,
.vertical-tab .nav-tabs .nav-tabs4 a:after{
	background: #f16620;
}
.vertical-tab .nav-tabs .nav-tabs5 a:before,
.vertical-tab .nav-tabs .nav-tabs5 a:after{
	background: #0081c7;
}
.clr1{
	color: #36bbed;
}
.clr2{
	color: #f5a609;
}
.clr3{
	color: #b9168b;
}
.clr4{
	color: #f16620;
}
.clr5{
	color: #0081c7;
}

.vertical-tab .nav-tabs li a:after{
    width: calc(100% - 5px);
    height: 3px;
    border-radius: 0;
    transform-origin: left center;
    bottom: 1px;
    left: 5px;
}
.vertical-tab .nav-tabs li.active a:before,
.vertical-tab .nav-tabs li a:hover:before,
.vertical-tab .nav-tabs li.active a:after,
.vertical-tab .nav-tabs li a:hover:after{
    transform: scale(1);
}

.hide-img{
	display :none;
	
	}
.vertical-tab .tab-content{
    color: #606061;
background-color: #dfe4f2;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 23px;
    padding: 20px;
    display: table-cell;
	 border-radius: 1rem;
	
  box-shadow: rgba(100, 100, 111, 0.2) 0px 50px 30px -20px;
}

.vertical-tab .tab-content2{
   color: #606061;
  background-color: #faf9f9;
  font-size: 14px;
  padding: 20px;
  border: 1px solid #ddd;
  box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .22);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  margin-top:-90px !important;
}
.cap-mobile{
	margin-top:10px !important;
	
}
.knobs div {
  width: 13em;
  height: 2.3em;
  background: #bbb;
  margin-bottom: 2em;
  color: #fff;
  border-radius: 1em;
}
.arrow-down {
  position: relative;
  background: #19adf7 !important;
  font-size: 1.2em;
  padding: 5px;
  text-align: center;
  box-shadow: rgba(27, 31, 35, 0.04) 0px 1px 0px, rgba(255, 255, 255, 0.25) 0px 1px 0px inset;
}
.kirin-wrapper-mobile {
	
display: grid !important;
grid-template-columns: 5px 1fr !important;
grid-gap: 1px !important;
	
  }
.kirin-post2{
	width:86%;
font-size: 12px;
padding: 15px;

}
.vertical-tab .tab-content3{
   color: #606061;
  background-color: #faf9f9;
  font-size: 14px;
  padding: 20px;
  border: 1px solid #ddd;
  box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .22);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  margin-top:-220px !important;
}
.vertical-tab .tab-content h3{
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 7px;
}
.vertical-tab .tab-content2 h3{
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 7px;
}
.vertical-tab .tab-content3 h3{
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 7px;
}
@media only screen and (max-width: 479px){
    .vertical-tab .nav-tabs{
        width: 100%;
        display: block;
    }
    .vertical-tab .nav-tabs li a{ padding: 15px 10px 14px; }   
    .vertical-tab .tab-content{
        font-size: 14px;
        display: block; 
    }
}


 .parent {
	 width: 100%;
	 height: auto;
	
}
 /*.parent:hover .card {
	 transform: rotate3d(1, 1, 0, 30deg);
	 box-shadow: rgba(5, 71, 17, 0.3) 30px 50px 25px -40px, rgba(5, 71, 17, 0.1) 0px 25px 30px 0px;
}

 .parent:hover .card .logo .circle2 {
	 transform: translate3d(0, 0, 60px);
}
 .parent:hover .card .logo .circle3 {
	 transform: translate3d(0, 0, 80px);
}
 .parent:hover .card .logo .circle4 {
	 transform: translate3d(0, 0, 100px);
}
 .parent:hover .card .logo .circle5 {
	 transform: translate3d(0, 0, 120px);
}
*/
 .card {
	 height: 100%;
	 border-radius: 20px;
	 background: linear-gradient(135deg, rgba(239, 243, 252, 1) 0%, rgba(223, 228, 242, 1) 100%);
	 transition: all 0.5s ease-in-out;
	 transform-style: preserve-3d;
	 box-shadow: rgba(5, 71, 17, 0) 40px 50px 25px -40px, rgba(5, 71, 17, 0.2) 0px 25px 25px -5px;
}
 .pattern {
	 position: absolute;
	 inset: 0;
	 border-radius: inherit;
	 transition: all 0.5s ease-in-out;
}
 .glass {
	 transform-style: preserve-3d;
	 position: absolute;
	 inset: 8px;
	 border-radius: 25px;
	 border-top-right-radius: 100%;
	 background: linear-gradient(0deg, rgba(255, 255, 255, 0.349) 0%, rgba(255, 255, 255, 0.815) 100%);
	 backdrop-filter: blur(5px);
	 transform: translate3d(0px, 0px, 25px);
	 border-left: 1px solid white;
	 border-bottom: 1px solid white;
	 transition: all 0.5s ease-in-out;
}

 .content {
	 padding: 20px 60px 20px 30px;
	 transform: translate3d(0, 0, 26px);
}
 .content .title {
	 display: block;
	 color: #00894d;
	 font-weight: 900;
	 font-size: 20px;
}


 .logo {
	 position: absolute;
	 right: 0;
	 top: 0;
	 transform-style: preserve-3d;
}
 .logo .circle {
	 display: block;
	 position: absolute;
	 aspect-ratio: 1;
	 border-radius: 50%;
	 top: 0;
	 right: 0;
	 box-shadow: rgba(100, 100, 111, 0.2) -10px 10px 20px 0px;
	 backdrop-filter: blur(5px);
	 background: rgba(223, 228, 242, 0.2);
	 transition: all 0.5s ease-in-out;
}
 .logo .circle1 {
	 width: 170px;
	 transform: translate3d(0, 0, 20px);
	 top: 8px;
	 right: 8px;
}
 .logo .circle2 {
	 width: 140px;
	 transform: translate3d(0, 0, 40px);
	 top: 10px;
	 right: 10px;
	 backdrop-filter: blur(1px);
	 transition-delay: 0.4s;
}
 .logo .circle3 {
	 width: 110px;
	 transform: translate3d(0, 0, 60px);
	 top: 17px;
	 right: 17px;
	 transition-delay: 0.8s;
}
 .logo .circle4 {
	 width: 80px;
	 transform: translate3d(0, 0, 80px);
	 top: 23px;
	 right: 23px;
	 transition-delay: 1.2s;
}
 .logo .circle5 {
	 width: 50px;
	 transform: translate3d(0, 0, 100px);
	 top: 30px;
	 right: 30px;
	 display: grid;
	 place-content: center;
	 transition-delay: 1.6s;
}
 .logo .circle5 .svg {
	 width: 20px;
	 fill: white;
}
 
 



.timeline.full .post-item {
    width: unset;
    float: unset;
    margin: 0 0 25px 0!important;
}
.home-logo{
	width: 400px;
    height: 160px;
	margin-top:-80px !important;
	margin-bottom:50px !important;
}
.row {
	
	width: auto ;
	-webkit-box-sizing: border-box;
	 display: flex;
  flex-wrap: wrap;
}

.read-box {

	width:130px;
	border : 1px solid #19adf7;
	border-radius : 20px;
	background-color:#19adf7;
	color:white;
	padding:7px;
	text-align:center;
	  right: 70% !important;
	  margin-left:100px;
	  margin-right:100px;
	  margin-top:30px;
	
}
.read-box2 {

	width:130px;
	border : 1px solid #19adf7;
	border-radius : 20px;
	background-color:#19adf7;
	color:white;
	padding:7px;
	text-align:center;
	  right: 70% !important;
	  margin-left:100px;
	  margin-right:100px;
	  margin-top:30px;
	
}

.height-hd {
	height:365px !important;
}
.mobile-view {
	margin-left:160px;
	  margin-right:160px;
}
.read-box a {
	color:white;	
}
.col-md-2{
	width:100% !important;
}

.xl{
	width:20% !important;
}
.top-head .logo img {
	min-width:100% !important;
}
.rounded-circle{
	border-radius:50%;
	width:70px;
	height:70px;
	background-color:white;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}

.top-head .logo a img
{
	float : left !important;
}

/*Hadatha Boxes in Mobile*/
.hadathaBoxes
{
	height : 855px !important;
}

/*PKI Services in Mobile*/
.icon-boxes-2
{
	display : block !important;
	margin-bottom : 2px !important;
	
}

/* **************************** Hadatha Awards  ********************************** */ 

.custom-table {
  width: 100%;
  border-collapse: collapse;
}

.custom-table thead {
  background-color: #2985b6;
  color: white;
}

.custom-table th,
.custom-table td {
  padding: 10px;
  border: 1px solid #ddd;
}

.kirin-wrapper-H {
	
	background: #fcfcfc;
	padding: 4px;
	border-radius: 8px;
	display: grid;
	grid-template-columns: 14px 1fr;
	grid-gap: 4px;
  }
  
 .kirin-sidebar-H {
	position: relative;
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	border: 1px solid #ddd;
	padding: 3px;
	border-radius: 5px;
  }

 .kirin-post-H {
	
	font-size: 14px;
	padding: 20px;
	border: 1px solid #ddd;
	border-radius: 8px;
  }
  

 
.tabs__buttons--container {
  display: flex;
  margin-bottom: 1rem;
}

.tabs__tab-btn {
  background: none;
  border: none;
  padding: 1rem 2rem;
  cursor: pointer;
  border-bottom: solid 3px #0081c7;
}

.tabs__tab-btn--not-selected {
  border-bottom-color: #eeeeee;
}

.tabs__tab-btn:hover {
  background-color: #eeeeee;
  transition: 0.3s;
}

.tabs__tab--hide {
  display: none;
}

.tabs__tab--show {
  display: block;
}

.tabs__tab {
  animation: tabApear 0.6s;
}

@keyframes tabApear {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
.vertical-tab .nav-tabs{
   
	height:600px;
}


 .Awa-form{
	 width: 230px;
}
#tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}

.tab {
  cursor: pointer;
  padding: 10px 20px;
  background-color: transparent;
  color: #19adf7;
  margin: 4px;
  border: 1px solid #19adf7;
  border-radius: 5px;
  transition: opacity 0.3s ease;
}

.tab:hover,
.tab.active {
  opacity: 0.8;
  background-color: #19adf7;
  color: white;
}

.vertical-tab .tab-content{
  width: 100%;
 
 
  padding: 10px;

}
.vertical-tab .tab-content3{
  width: 100%;
 

}

.vertical-tab .nav-tabs .nav-tabs6 a:before,
.vertical-tab .nav-tabs .nav-tabs6 a:after{
	background: #f5a609;
}
.vertical-tab .nav-tabs .nav-tabs7 a:before,
.vertical-tab .nav-tabs .nav-tabs7 a:after{
	background: #b9168b;
}
.vertical-tab .nav-tabs .nav-tabs8 a:before,
.vertical-tab .nav-tabs .nav-tabs8 a:after{
	background: #f16620;
}
.vertical-tab .nav-tabs .nav-tabs9 a:before,
.vertical-tab .nav-tabs .nav-tabs9 a:after{
	background: #0081c7;
}

.vertical-tab .tab-content3{
   color: #606061;
  background-color: #faf9f9;
  font-size: 14px;
  padding: 5px;
  
  margin-top:-80px !important;
}


/* **************************** Hadatha Awards  ********************************** */ 

#pkiTitle
{
	padding-bottom : 0px !important;
	margin-bottom : 0px !important;
}
.icon-desc
{
	height : 110px !important;
}

.nav-tabs > li:first-child {
  margin-left: 70px !important;
}

.search-tabs .active
{
	float: inline-end !important;
}

.onsale-section {
  position: absolute;
  top: -6px;
  right: 15px;
}

.onsale-section:after {
  position: absolute;
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  border-top: 6px solid transparent;
}

.onsale {
  position: relative;
  display: inline-block;
  text-align: center;
  color: #fff;
  background: transparent;
  font-size: 11px;
  line-height: 1;
  padding: 12px 8px 6px;
  border-top-right-radius: 8px;
  width: 64px;
  text-transform: uppercase;
  border-bottom: 4px solid #96a0a2;
}

.onsale:before,
.onsale:after {
  position: absolute;
  content: '';
  display: block;
}

.onsale:before {
  background: #19adf7;
  height: 7px;
  width: 6px;
  left: -6px;
  top: 0;
}

.onsale:after {
  background: #96a0a2;
  height: 7px;
  width: 8px;
  border-radius: 8px 8px 0 0;
  left: -8px;
  top: 0;
}
.container{
	text-align:center !important;
}
.form-control  {
	width:300px !important;
}

.adlist .social-links {
    text-align: center;
    margin: 50px 0px;
}
.adlist  .social-btn {
    display: inline-block;
    width: 50px;
    height: 50px;
    background:#19adf7;
    margin: 10px;
    box-shadow: 0px 5px 10px 0px #dad9d9;
    color: #f6f6f6;
    overflow: hidden;
    position: relative;
    border: 1px dotted #fff;
}
.adlist  .social-btn i {
    line-height: 50px;
    font-size: 22px;
    transition: 0.2s linear;
}
.adlist  .social-btn:hover i {
    transform: scale(1.3);
    color: #19adf7;
}
.adlist  .social-btn::before {
    content: "";
    position: absolute;
    width: 120%;
    height: 120%;
    background: #ffffff;
    transform: rotate(45deg);
    left: -110%;
    top: 90%;
}
.adlist  .social-btn:hover::before {
    animation: effect 0.6s 1;
    top: -10%;
    left: -10%;
}
.adlist  p a {
    color: #C8102E;
}
	
.twitter-containor .bookmark {
		position: absolute;
		z-index: 1000;
		top: 0;
		right: 10%;
		height: 0.9em;
		width: 3em;
		background-color: #19adf7;
		background-image:
		  linear-gradient(
			hsla(0, 0%, 100%, 0),
			hsla(0, 0%, 100%, 0.5) 5px,
			hsla(0, 0%, 100%, 0) 25px);
		-webkit-filter: drop-shadow(0 2px 6px hsla(0, 0%, 0%, 0.75));
		box-sizing: border-box;
		padding-top: 50px;
		color: white;
		font-size: 1em;
		text-align: center;
		text-shadow: 0 -1px 0 hsla(0, 0%, 0%, 0.5);
	  }
	 
	  .twitter-containor .bookmark:before,
	  .twitter-containor .bookmark:after{
		content: '';
		display: block;
		position: absolute;
	  }
	  .twitter-containor .bookmark:before {
		bottom: -50%;
		height: 100%;
		width: 100%;
		background-image:
		  linear-gradient(
			-45deg,
			transparent 50%,
			#19adf7 50%),
		  linear-gradient(
			45deg,
			transparent 50%,
			#19adf7 50%);
		z-index: -1;
	  }
	  .twitter-containor .bookmark:after {
		height: 136.5%;
		width: 88%;
		left: 6%;
		top: 0;
		
		pointer-events: none;
	  }

/*-- Hover Animation Effect --*/
@keyframes effect {
    0% {
        left: -120%;
        top: 100%;
    }
    50% {
        left: 10%;
        top: -30%;
    }
    100% {
        top: -10%;
        left: -10%;
    }
}

	
	.bookmark {
		position: absolute;
		z-index: 1000;
		top: 0;
		right: 10%;
		height: 6em;
		width: 5em;
		background-color: #19adf7;
		background-image:
		  linear-gradient(
			hsla(0, 0%, 100%, 0),
			hsla(0, 0%, 100%, 0.5) 5px,
			hsla(0, 0%, 100%, 0) 25px);
		-webkit-filter: drop-shadow(0 2px 6px hsla(0, 0%, 0%, 0.75));
		box-sizing: border-box;
		padding-top: 50px;
		color: white;
		font-size: 1em;
		text-align: center;
		text-shadow: 0 -1px 0 hsla(0, 0%, 0%, 0.5);
	  }
	 
	  .bookmark:before,
	  .bookmark:after{
		content: '';
		display: block;
		position: absolute;
	  }
	  .bookmark:before {
		bottom: -50%;
		height: 100%;
		width: 100%;
		background-image:
		  linear-gradient(
			-45deg,
			transparent 50%,
			#19adf7 50%),
		  linear-gradient(
			45deg,
			transparent 50%,
			#19adf7 50%);
		z-index: -1;
	  }
	  .bookmark:after {
		height: 136.5%;
		width: 88%;
		left: 6%;
		top: 0;
		border-style: dashed;
		border-color: white;
		border-width: 0 1px;
		pointer-events: none;
	  }
	  
	  
	  .bar {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	  }
	  
	  .bar .event-bar {
		width: 14rem;
		height: 4rem;
		background-color: #F0EFEF;
		padding: 5px;
		
		/* border: 1px solid #19adf7; */
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		justify-content: center;
		
	  }
	  .bar .event-bar i {
		  color: #19adf7;
	  }
	  
	  .bar .event-bar span {
		  color: #757575;
		  font-size: 10px;
	  }
	  .social {
  height: 40px;
 
  text-align: center;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  background-color:#f5f5f5;
  border-top:1px solid #ebe8e8;
  border-bottom:3px solid #19adf7;

}
.col-md-4, .col-md-2 {
margin-bottom:10px;	
}

.carousel-container,
.carousel-container_2 {
  border-radius: 1px;
  overflow: hidden;
  width:100% !important;
  position: relative;
  box-shadow: 0 0 30px -20px #223344;
  margin: auto;
  z-index: 0;
  background-color:transparent;
  height:244px;
  border:1px solid #dcdcdc;
}
.col-md-4  {
	 width:100% !important;
}
/* Hide the images by default */
.mySlides
{
  display: none;
  width: 100%;
   height:200px;
}
.mySlides img {
 
  width: 100%;
  height:200px;
}


.mySlides_2 {
  display: none;
  width: 100%;
   height:200px;
}

.mySlides_2 img  {
 
  width: 100%;
  height:200px;
}


.imgLoaded 
{
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  height : 160px !important;
}

.camera_wrap
{
	height : 160px !important;
}

/* image gradient overlay [optional] */
/*  .mySlides::after {
  content: "";
  position: absolute;
  inset: 0;
    background-image: linear-gradient(-45deg, rgba(110, 0, 255, .1), rgba(70, 0, 255, .2));
} */

/* Next & previous buttons */
.prev{
  cursor: pointer;
  position: absolute;
  top: 14%;
  transform: translate(0, -50%);
  width: auto;
  padding: 35px;
  color:  #11b7ed;
  font-weight: bold;
  font-size: 20px;
  user-select: none;
 border-radius: .5em;
  background-color: transparent !important;
  left :1% !important;
}

.next {
  cursor: pointer;
  position: absolute;
  top: 14%;
  transform: translate(0, -50%);
  width: auto;
  padding: 5px;
  color:  #11b7ed;
  font-weight: bold;
  font-size: 20px;
  user-select: none;
 background-color: transparent !important;
  right:4% !important;
  border-radius: .5em;
}

.prev:hover,
.next:hover {
  background-color: rgba(173, 216, 230, 0.3);
}

/* Caption text */
.text {
  color: #11b7ed;
  background-color: rgba(243, 243, 243, 0.2);
  /*backdrop-filter: blur(6px);*/
  z-index:1 !important;
  font-size: 11px;
  padding: 8px 12px;
  position: absolute;
  top: 84%;
  left: 50%;
  transform: translate(-50%);
  text-align: center;
  width:100%;
}

/* Number text (1/3 etc) */
.number {
  color: #f2f2f2;
  font-size: 16px;
  background-color: rgba(173, 216, 230, 0.15);
  backdrop-filter: blur(6px);
  border-radius: 10px;
  padding: 8px 12px;
  position: absolute;
  top: 10px;
  left: 10px;
}
.dots-container {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translate(-50%);
}
.columncheck {
  float: left;
  width: 50%;
}

/* Clear floats after the columns */
.rowcheck:after {
  content: "";
  display: table;
  clear: both;
}
.icon-box-2   {
	height: 90% !important;
}
 input.labelauty+label ::selection{background-color:rgba(255,255,255,0)}
 input.labelauty+label ::-moz-selection{background-color:rgba(255,255,255,0)}
 input.labelauty{display:none!important}
 input.labelauty+label{
	 display:table;
	 min-width:100px !important;
	 font-size:10px;
	 line-height: 1;
	 padding:5px;
	 background-color:#efefef;
	 cursor:pointer;
	 border-radius:3px;
	 -moz-border-radius:3px;
	 -webkit-border-radius:3px;
	 transition:background-color .25s;
	 -moz-transition:background-color .25s;
	 -webkit-transition:background-color .25s;-o-transition:background-color .25s;
	 -moz-user-select:none;-khtml-user-select:none;
	 -webkit-user-select:none;-o-user-select:none}
	 input.labelauty+label>span.labelauty-checked,input.labelauty+label>span.labelauty-unchecked{
		 display:inline-block;
		 line-height:14px;
		
		 vertical-align:bottom}
	input.labelauty+label>span.labelauty-checked-image,input.labelauty+label>span.labelauty-unchecked-image{
			 display:inline-block;
			 width:14px;
			 height:14px;
			 vertical-align:bottom;
			 background-repeat:no-repeat;
			 background-position:left center;
			 transition:background-image .5s linear;
			 -moz-transition:background-image .5s linear;
			 -webkit-transition:background-image .5s linear;-o-transition:background-image .5s linear}
	input.labelauty:checked+label>span.labelauty-unchecked,input.labelauty:checked+label>span.labelauty-unchecked-image,input.labelauty:not(:checked)+label>span.labelauty-checked,input.labelauty:not(:checked)+label>span.labelauty-checked-image{display:none}input.labelauty+label>span.labelauty-checked-image+span.labelauty-checked,input.labelauty+label>span.labelauty-unchecked-image+span.labelauty-unchecked{margin-left:7px}
	input.labelauty:not(:checked):not([disabled])+label:hover{background-color:#eaeaea;}
	input.labelauty:checked+label{background-color:#3498db;color:#fff; }
	input.labelauty:checked:not([disabled])+label:hover{background-color:#72c5fd}
	input.labelauty:checked+label>span.labelauty-checked{display:inline-block}
	input.labelauty.no-label:checked+label>span.labelauty-checked{display:block}
	input.labelauty[disabled]+label{opacity:.5}
	/*input.labelauty+label>span.labelauty-unchecked-image{background-image:url(../images/input-unchecked.png)} */
	input.labelauty+label>span.labelauty-checked-image{background-image:url(../images/input-checked.png)}

/* transition animation */
.animate {
  -webkit-animation-name: sliding-vertically;
  -webkit-animation-duration: 1s;
  animation-name: animate;
  animation-duration: 2s;
  
}

@keyframes animate {
  from {
    transform: scale(1.1) rotateY(10deg);
  }
  to {
    transform: scale(1) rotateY(0deg);
  }
}
	
kirin-temp {
	padding-top:120px !important;
	display: block;
	margin: 0 auto;
	width: 100% !important;
	padding: 8px;
	border-radius: 8px;
	color: #333;
	font-family: Poppins, sans-serif;
	font-size: 13px;
	line-height: 20px;
	background: rgba(255,255,255,.2);
  }
  .post-item {
	   width: 100% !important;
	   margin-bottom:20px !important;
  }
  .div-padding {
	   width: 100% !important;
	   padding:0 !important;
  }
  .main-content {
	 width: 100% !important; 
  }
  .kirin-header {
	 width: 100% !important;
	padding: 8px;
	border: 1px solid #ddd;
	border-radius: 8px;
	margin-bottom: 10px;
	text-align: center;
	text-align-last: center;
	text-transform: lowercase;
	color: #fff;
	line-height: 30px;
  }
  
  .kirin-header h1 {
	margin: 0;
	font-weight:200;
	font-size: 28px;
	background: #19adf7;
	color:white;
	border-radius: 8px;
	padding: 10px 5px;
  }
  
  .kirin-wrapper {
	border: 1px solid #ddd;
	background: #fcfcfc;
	padding: 8px;
	border-radius: 8px;
	display: grid;
	grid-template-columns: 16px 1fr;
	grid-gap: 4px;
  }
  
   .kirin-wrapperrr {
	border: 1px solid #ddd;
	background: #fcfcfc;
	padding: 8px;
	border-radius: 8px;
	grid-template-columns: 16px 1fr;
	grid-gap: 4px;
  }
  
  
  .kirin-sidebar {
	position: relative;
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	border: 1px solid #ddd;
	padding: 3px;
	border-radius: 5px;
  }
  
  .kirin-color {
	display: block;
	width: 100%;
	height: auto;
	background: #19adf7;
  }
  
  
   .kirin-color-2 {
	display: block;
	width: 100%;
	height: auto;
	background: #5d489d;
  }
  .kirin-color-3 {
	display: block;
	width: 100%;
	height: auto;
	background: #40c4cc;
  }
  
  .kirin-color.k-one , .kirin-color-2.k-one  {
	border-radius: 3px 3px 0 0;
  }
  
  .kirin-color.k-two , .kirin-color-2.k-two {
	opacity: .8;
  }
  
  .kirin-color.k-three , .kirin-color-2.k-three{
	opacity: .6;
  }
  
  .kirin-color.k-four , .kirin-color-2.k-four {
	opacity: .4;
  }
  
  .kirin-color.k-five , .kirin-color-2.k-five {
	opacity: .2;
	border-radius: 0 0 4px 4px;
  }
  
  .kirin-color.k-one , .kirin-color-3.k-one  {
	border-radius: 3px 3px 0 0;
  }
  
  .kirin-color.k-two , .kirin-color-3.k-two {
	opacity: .8;
  }
  
  .kirin-color.k-three , .kirin-color-3.k-three{
	opacity: .6;
  }
  
  .kirin-color.k-four , .kirin-color-3.k-four {
	opacity: .4;
  }
  
  .kirin-color.k-five , .kirin-color-3.k-five {
	opacity: .2;
	border-radius: 0 0 4px 4px;
  }
  
  .kirin-post {
	text-align: justify;
	font-size: 14px;
	padding: 20px;
	border: 1px solid #ddd;
	border-radius: 8px;
  }
  
 
  
  .kirin-post b {
	font-size: 15px;
	color: #19adf7;
  }
  
  .eventcontainer {
	width: 100%;
	margin-top: -30px;
	margin: auto;
	padding: 30px;
	text-align: center;
  }
  
  .prodNav {
	width: 60%;
	font-size: 15px;
	
	border-radius: 2px;
	overflow: hidden;
	display: inline-block;
	vertical-align: middle;
	
	line-height: 1.1;
  }
  .prodNav .ptItem {
	background: #f5f5f5;
	padding: 15px 35px;
	line-height: 20px;
	border-radius: 2px;
	border: 1px solid transparent;
	font-weight: 500;
	cursor: pointer;
	display: inline-block;
	vertical-align: middle;
	transition: all 0.3s ease-in-out;
	margin-bottom:10px !important;
  }
  
  .prodNav .ptItem.active,
  .prodNav .ptItem:hover {
	background: #19adf7;
	border-color: #19adf7;
	color: #ffffff;
  }
  .First-color {
background-color:#001a30 !important;
color:#fff;
}
.Second-color {
background-color:#30c0ce !important;
color:#fff;
}
.Third-color {
background-color:#dfe4f2 !important;
color:#fff;
}
.Fourth-color {
background-color:#5d489d !important;
color:#fff;
}
.Fifth-color {
background-color:#dfe0df !important; 
color:#000;
}
.Sixth-color {
background-color:#3d9cd6 !important;
color:#fff;
}
.margin-box{
	margin-top:40px;
	margin-right:220px;
	margin-left:220px;
}
.m-margin{
	padding-top:280px !important;
	padding-bottom:280px !important;
}
.mds-padding{
  padding-top: 20px;
  padding-bottom: 20px;
}
 .white {
	color: #fff !important;
}
.black-color {
	color: #686868 !important;
}
 .panel_1 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#001a30;
}
.panel_1 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#001a30;
	color:#fff;
}
.panel_2 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#30c0ce;
}

.panel_rank  .rank-color {
	background-color:#19adf7;
	color:#fff;
	height:100px !important;
}

.panel_rank  .accordion h5.acc-head a  {
 background-color:transparent !important;
 border:none !important;
 border-bottom:1px solid #f3f1f1 !important;
}
.panel_rank  .accordion h5.acc-head a::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: inline-block;
  font: normal normal normal 13px/1 FontAwesome;
    font-size: 13px;
  content: "\f00d";
  top: 0px;
  font-size: 12px;
  padding: 23px 3;
  font-size: 13px;
  width: 15px;
  text-align: center;
}
.panel_rank .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#19adf7;
}
.panel_rank .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#19adf7;
	color:#fff;
}


.panel_2 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#30c0ce;
	color:#fff;
}
 .panel_3 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#a4a4a4;
}
.panel_3 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#a4a4a4;
	color:#fff;
}
.panel_4 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#5d489d;
}
.panel_4 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#5d489d;
	color:#fff;
}

.panel_5 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#919bb4;
}
.panel_5 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#dfe4f2;
	color:#838383;
}
.panel_5  h4 , .panel_5  p{

	color:#838383;
}
.panel_6 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#3d9cd6;
}
.panel_6 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#3d9cd6;
	color:#fff;
} 	  
.height {
	height:300px !important;
}
.div-padding {
	padding-top:80px !important;
}

.advertisers-service-sec .service-card {
  width: 100%;
  height: 100%;
  padding: 2em 1.5em;
 
box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  cursor: pointer;
  transition: 0.5s;
  position: relative;
  z-index: 2;
  overflow: hidden;
  background: #f0f0f0;;
}
.box-container2 .col-md-4 {
margin-bottom:20px;

}
.advertisers-service-sec .service-card::after {
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(#02c8dc, rgb(25, 173, 247));
  position: absolute;
  left: 0%;
  top: -98%;
  z-index: -2;
  transition: all 0.4s cubic-bezier(0.77, -0.04, 0, 0.99);
}

.advertisers-service-sec h5 {
  font-size: 16px;
  text-transform: capitalize;
  font-weight: 600;
  color: #1f194c;
  margin: 1em 0;
  z-index: 3;
  text-align:center;
}

.advertisers-service-sec p {
  color: #575a7b;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.03em;
  z-index: 3;
  text-align:center;
  
}

.advertisers-service-sec .icon-wrapper {
  background-color: #2c7bfe;
  position: relative;
  margin: auto;
  font-size: 30px;
  height: 2em;
  width: 2em;
  color: #ffffff;
  border-radius: 50%;
  display: grid;
  place-items: center;
  transition: 0.5s;
  z-index: 3;
}

.advertisers-service-sec .service-card:hover:after {
  top: 0%;
}

.service-card .icon-wrapper {
  background-color: #ffffff;
  color: rgb(2, 200, 220);
}

.advertisers-service-sec .service-card:hover .icon-wrapper {
  color: #0dcaf0;
}

.advertisers-service-sec .service-card:hover h3 {
  color: #ffffff;
}

.advertisers-service-sec .service-card:hover p {
  color: #fff;
}
.advertisers-service-sec .service-card:hover a {
  color: #fff;
}

/* glossary */
:root{
  --color-text: #616161;
  --color-text-btn: #ffffff;
  --card1-gradient-color1: #f12711;
  --card1-gradient-color2: #f5af19;
  --card2-gradient-color1: #7F00FF;
  --card2-gradient-color2: #E100FF;
  --card3-gradient-color1: #3f2b96;
  --card3-gradient-color2: #a8c0ff;
  --card4-gradient-color1: #11998e;
  --card4-gradient-color2: #38ef7d;
}

.card-wrap{
  width: 100%;
  min-height: 29rem;
  
 
  overflow: hidden;
 
  cursor: pointer;
  transition: all .2s ease-in-out;
  

	text-align: center;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;

}
.card-wrap:hover{
  transform: scale(1.1);
}
.card-header{
  height: 20px;
  width: 100%;
  background-color: #19adf7;
 
  display: grid;
  place-items: center;

}

.card-content{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
   padding:15px;
  margin: 0 auto;
}
.card-title{
  text-align: center;
  text-transform: uppercase;
  font-size: 18px;
  font-weight:bold;
  margin-top: 40px;
  color:#19adf7;
 
  
}
.card-text{
  text-align: center;
  font-size: 12px;
  margin-bottom: 20px;
}

.card-header.one{
  background: linear-gradient(to bottom left, #19adf7, #7ecdf3);
}

ul.ul-cards-glossary {
    width: 100% !important;
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    list-style: none;
    justify-content: center;
}
ul.ul-cards-glossary>li{
    --bg-color: #F2F2F2;
    --text-color: #333;
    --padding: 0.1rem;
    --circle-size: 7rem;
    --circle-expand: 1rem;
    --flap-height: 1.25rem;
    --flap-offset: 0.5rem;
    max-width: 40rem;
	max-height: 29rem;
    margin-top: calc(var(--circle-size) / 2 + var(--circle-expand));
    margin-bottom: var(--flap-offset);
   
    border-radius: 10px;
    padding: var(--padding);

    --bs-rim: inset -0.1rem 0.1rem 0.1rem rgb(255 255 255 / .5);
    --bs-card-spread: 0.25rem;
    --bs-card-color:  rgb(0 0 0 / 0.02);
    --bs-card: 
        -0.1rem 0.1rem var(--bs-card-spread) var(--bs-card-color),
        -0.2rem 0.2rem var(--bs-card-spread) var(--bs-card-color),
        -0.3rem 0.3rem var(--bs-card-spread) var(--bs-card-color),
        -0.4rem 0.4rem var(--bs-card-spread) var(--bs-card-color),
        -0.5rem 0.5rem var(--bs-card-spread) var(--bs-card-color),
        -0.6rem 0.6rem var(--bs-card-spread) var(--bs-card-color),
        -0.7rem 0.7rem var(--bs-card-spread) var(--bs-card-color),
        -0.8rem 0.8rem var(--bs-card-spread) var(--bs-card-color),
        -0.9rem 0.9rem var(--bs-card-spread) var(--bs-card-color),
        -1.0rem 1.0rem var(--bs-card-spread) var(--bs-card-color),
        -1.1rem 1.1rem var(--bs-card-spread) var(--bs-card-color),
        -1.2rem 1.2rem var(--bs-card-spread) var(--bs-card-color),
        -1.3rem 1.3rem var(--bs-card-spread) var(--bs-card-color),
        -1.4rem 1.4rem var(--bs-card-spread) var(--bs-card-color),
        -1.5rem 1.5rem var(--bs-card-spread) var(--bs-card-color),
        -1.6rem 1.6rem var(--bs-card-spread) var(--bs-card-color),
        -1.7rem 1.7rem var(--bs-card-spread) var(--bs-card-color),
        -1.8rem 1.8rem var(--bs-card-spread) var(--bs-card-color),
        -1.9rem 1.9rem var(--bs-card-spread) var(--bs-card-color);
    
    display: grid;
  grid-template-rows: max-content max-content auto ;
    justify-items: center;
    text-align: center;
    gap: 0.75rem;
    position: relative;
}
.box-container2{
  margin: auto;
  width: 100%;
  border-radius: 1rem;
  border-radius: 10px;
}

.box-main2{
  padding: 2rem;
   background: #fff;
  border-radius: 10px;
  border: 5px solid #fff;
  overflow: hidden;
  color: var(--color-text);
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px,
              rgba(0, 0, 0, 0.23) 0px 6px 6px;
  align-items: left;
}

.box-container2{
	width:430px !important;
	
}
.top-head .logo  a{
	width:150px !important;
}


/* Ribbon 2*/
.arrow-ribbon {
  background: #19adf7;
  color: #FFF;
  padding: 2px 10px;
  position: absolute;
  bottom: 10px;
  right: -1px;
}
.arrow-ribbon:before {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    content: "";
    left: -12px;
    width: 0;
}
.seventh-color {
background-color:#3d9cd6 !important; 
color:#fff;
}

}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------*/
.xl{
	width:16% !important;
}



/* Show only in mobile*/ 
@media (min-width:481px){
.only-mobile{display:none !important
}
/* ----------------------------------*/ 
#style-1::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
.scrollbar
{

height: 355px;
width: 100%;
background: #F5F5F5;
overflow-y: scroll;

}
.force-overflow
{
min-height: 450px;
}
			

@media (max-width:480px){
#FictionXOmanTV3{height:250px !important}



}


/*Slider in Mobile phone to make image smaller*/



/*fix */
.camera_target {
    border-radius: 5px;
}

.camera_pag_ul li img {
    border: 2px solid #e6e6e6;
    border-radius: 5px;
}

.FictionXi li i::before{
margin:0 !important;
font-size: 16px !important;
}

.FictionXi li span {
font-size: 15px !important;
color: #aaa;
padding: 0 5px;
}

.gry-bgx {
background-color: #505050 !important;
}
.icon-bgx::after {
transform: scale(1.3);
    -webkit-transform: scale(1.3);
    background-color: #333;
    opacity: 0;
    z-index: 0;
    -webkit-transition-duration: 0.5s !important;
    transition-duration: 0.5s !important;
    background-image: url('../images/over2.svg');
    background-position: center center;
    background-size: 100% 100%;

}

.clients img:hover {
    opacity: 1;
}

.clients img {
 /*  border: 1px solid #ddd; */
  border-radius: 4px;
  padding: 3px;
  opacity: 0.6;
  height: 54px;
}

.home-icons{
margin: 0 0 0 10px !important;
background-color: #e9e9e9;
border-radius: 5px;
width: 30%;
text-align: center;
}

.home-icons img {
width: auto !important;
}

.padding-bottom-15 {
padding: 0 0 15px 0;
}

.fix-Home_news-image {
max-height: 65px;
overflow: hidden;
}

.fix-Home_news-image-img {
width: auto !important;
}

.fix-Home-news-supject {
    line-height: 1.5em; /* Sets line height to 1.5 times text size */
    height: 3em; /* Sets the div height to 2x line-height (3 times text size) */
    white-space: normal; /* Wrap lines of text */
    overflow: hidden; /* Hide text that goes beyond the boundaries of the div */
    text-overflow: ellipsis; /* Ellipses (cross-browser) */
    -o-text-overflow: ellipsis; /* Ellipses (cross-browser) */
}

.fix-Home-news-supject::befor{

   content: '...';
   float: left;
   margin-top: 1.5em;

}


.containerX {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}

.containery {
max-width:90%;
padding-right: 25px;
padding-left: 25px;
margin-right: auto;
margin-left: auto;
}

.box-number-top {
    top: 30px !important;
}

.box-nav-top {
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
    padding: 5px 70px;
	background-color: #f1f1f1;
	box-shadow:  -1px 1px 3px -1px rgba(0,0,0,0.2);
}

.post-content-border {
background-color: #f5f5f5;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}

.right-border-radius-20{
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;	
}

.left-border-radius-20{
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;	
}

.right-border-radius-10{
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;	
}

.left-border-radius-10{
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;	
}


.top-font-sizing{
color: #e8e8e8;
font-size: 15px;
font-weight: bold;
}

.infocenter-header{
color: #666;
font-size: 18px;
font-weight: bold;
}

/* fictionx feed back */

.Fiction-FeedBack {
position: fixed;
top: 150px;

z-index: 100;
}

.Fiction-feed-text{
display: inline-block;
bottom: 0;
margin: 0 0 20px 10px;
padding: 0;
width: 20px;
height: 20px;
/*transform: rotate(-90deg);*/
transform-origin: left;
font-size: 2rem;
font-size: 20px;
text-align: left;
white-space: nowrap;

}
.Fiction-FeedBack-fab {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 5px;
  background-color: #fff;
  vertical-align: middle;
  text-decoration: none;
  text-align: center;
  transition: 0.2s ease-out;
  cursor: pointer;
  color: #FFF;
}

.Fiction-FeedBack-fab:hover {
  color: #FFFFFFC9;
  opacity: 0.9;
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
}

.Fiction-FeedBack-btn-large {
width: 85px;
height: 85px;
border-radius: 50%;
}

.Fiction-FeedBack-menu {
position: absolute;
left: 24px;
right: auto;
bottom: 60px;
transform: translateY(-50%);
height: 100%;
width: 90px;
list-style: none;
text-align: left;
}

.Fiction-FeedBack-menu li {
  display: inline-block;
  margin-left: 10px;
  padding-bottom: 2px;
}

.Fiction-FeedBack-card {
  position: absolute;
  left: 150px;
  bottom: 70px;
  transition: box-shadow 0.25s;
  padding: 24px;
  border-radius: 2px;
  background-color: #009688;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  color: #FFF;
}

.Fiction-FeedBack-card ul {
  -webkit-padding-start: 0;
  list-style: none;
  text-align: right;
}


.Fiction-FeedBack-btn-person { background-color: #F44336; }


.Fiction-FeedBack-btn-doc { background-color: #ffeb3b; }


.Fiction-FeedBack-btn-tangram { background-color: #FF0303; }


.Fiction-FeedBack-btn-report { background-color: #ffd418; }


.Fiction-FeedBack-btn-feedback { background-color: #9c27b0; }




.scale-transition { transition: transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important; }

.scale-transition.scale-out {
  transform: scale(0);
  transition: transform 0.2s !important;
}

.scale-transition.scale-in { transform: scale(1); }

/* update */
.update-info-bg{
color: #31708f;
background-color: #d9edf7;
margin-top: 15px;
border-radius: 5px;
border: 1px solid #bce8f1 !important;
}

.update-info-icon{
background: #018ac0;
color: #fff;
font-size: 18px;
border: 1px solid #fff !important;
border-radius: 5px;
padding: 3px 50px;
}

.update-warning-bg{
color: #8a6d3b;
background-color: #fcf8e3;
margin-top: 15px;
border-radius: 5px;
border: 1px solid #ffee91 !important;
}

.update-warning-icon{
background: #f2d642;
color: #fff;
font-size: 18px;
border: 1px solid #fff !important;
border-radius: 5px;
padding: 3px 50px;
}

.update-success-bg{
color: #3c763d;
background-color: #dff0d8;
margin-top: 15px;
border-radius: 5px;
border: 1px solid #bfdda5  !important;
}

.update-success-icon{
background: #7cc041 ;
color: #fff;
font-size: 18px;
border: 1px solid #fff !important;
border-radius: 5px;
padding: 3px 50px;
}

.update-alert-bg{
color: #a94442;
background-color: #ffd1cf;
margin-top: 15px;
border-radius: 5px;
border: 1px solid #ffafaf !important;
}

.update-alert-icon{
background: #c23a3a;
color: #fff;
font-size: 18px;
border: 1px solid #fff !important;
border-radius: 5px;
padding: 3px 50px;
}

/*menu */
.menu-header{
font-size: 18px;
color: #b9e5ed ;
text-align: center;
padding: 5px 10px;
font-weight: 400;
}

/* Vote */
.input-submit{background-color: #30A09A; border: 0; padding: 5px 35px; color: #FFF;     position:relative} 
.input-submit:before{    -webkit-transition: all 0.35s ease;
    -moz-transition: all 0.35s ease;
    -o-transition: all 0.35s ease;
    transition: all 0.35s cubic-bezier(1, -0.22, 0.01, -0.65);

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #d9be73;
    z-index: -1;} 

.VotePopup{
position: fixed;
bottom: 9px;
left: 7%;
z-index: 20;
border-radius: 5px;
border: 1px solid #ededed;
box-shadow: rgb(0, 0, 0) 1px 2px 17px -15px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
background: rgb(251, 251, 251) none repeat scroll 0% 0%;
	} 
.VotePopup figure{  
margin: 0;
position: absolute;
top: -1px;
left: -42px;
cursor: pointer;
width: 40px;
height: 40px;
text-align: center;
line-height: 38px;
display: block;
color: #fff;
bottom: 10px;
z-index: 99;
font-size: 15px;
background-color: rgb(236, 198, 0);
border-radius: 3px;
	} 
.VotePopup p{ 
text-align: center;
background-color: #ecc600;
color: #fff;
margin: 0;
padding: 10px;
height: 39px;
border-radius: 3px;
font-weight: 600;
} 

.Vote-msg{ 
text-align: center;
background-color: #e44217;
color: #fff;
margin: 0;
padding: 10px;
height: 39px;
border-radius: 3px;
} 
.Vot-btn {
cursor: pointer;	
}
.VoteDetails{padding:15px;    text-align: center;    margin: 0; display:none}
.VoteDetails h4{ color: #000}
.VoteDetails ul {    margin: 0;text-align: right;}
.VoteDetails li {    list-style: none;}
.VoteDetails li span{color: #333;    padding-right: 7px;vertical-align: middle;    }
.VoteDetails .input-submit{ 
margin-top: 20px;
display: inline-block;
cursor: pointer;
text-align: center;
line-height: 23px;
color: #fff;
font-size: 15px;
background-color: rgb(236, 198, 0);
border-radius: 3px;
}
.Vote-Img-c {
    float: right;
    height: 3px;
    position: relative; 
    background-color: #009BB7;
top: 10px;
height: 10px;
border-radius: 10px;
right: 0px;
}
.Vote-block-persnt {
float: left;
height: 24px;
position: relative;
right: 0;
color: #494949;
top: 2px;
background: #FFC408;
border-radius: 3px;
padding: 2px;
}

.Vote-block-a {
    color: #494949;
    
    text-decoration: none;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-right: 5px;
    white-space: nowrap;
}

.Vote-block-q{
	background: none !important;
    color: #333 !important;
	}
	
	
	/* home apps */
.home-apps-continer{
margin-right: 10px !important;
padding: 0 10px;
	}
	
.home-apps-img{
background-color: #e9e9e9;
border-radius: 5px;
width: 90px;
max-width: 90px !important;
border: 1px solid #e3ebed;
	}
	

/* stat */

.dashboard-stat2.bordered {
    border: 1px solid #e7ecf1;
}
.dashboard-stat2 {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    background: #fff;
    padding: 15px 15px 30px 15px;
    margin-bottom: 20px;
    box-shadow: 0px 2px 3px 2px rgba(0, 0, 0, 0.03);
}

.dashboard-stat2 .display {
    margin-bottom: 20px;
}


.dashboard-stat2 .display::before, .dashboard-stat2 .display::after {

    content: " ";
    display: table;

}

.dashboard-stat2 .display .number {
    float: right;
    display: inline-block;
}

.dashboard-stat2 .display .number h3 {
    margin: 0 0 2px 0;
    padding: 0;
    font-size: 30px;
    font-weight: 400;
}

.font-red-haze {
    color: #f36a5a !important;
}

.dashboard-stat2 .display .number h3 > small {
    font-size: 16px;
}

.dashboard-stat2 .display .number small {
font-size: 18px;
color: #119bb7;
text-transform: uppercase;
}

.dashboard-stat2 .display .icon {
    display: inline-block;
    float: left;
    padding: 7px 0 0 0;
}
.dashboard-stat2 .display::after {
    clear: both;
}
.dashboard-stat2 .display::before, .dashboard-stat2 .display::after {
    content: " ";
    display: table;
}

.dashboard-stat2 .progressFX-info {
    clear: both;
}

.dashboard-stat2 .progressFX-info .progressFX {
    margin: 0;
    height: 4px;
    clear: both;
    display: block;
}
.page-md .progressFX {
    text-indent: -99999px;
}
.progressFX {
    height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f9f9f9;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}
.progressFX {
    height: 8px;
    border-radius: 0 !important;
}
.progressFX {
    border: 0;
    background-image: none;
    filter: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.progressFX {
    height: 20px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}

.progressFX-bar.red-haze {
    background: #f36a5a !important;
    color: #ffffff !important;
}
.progressFX-bar-success {
    background-color: #36c6d3;
}
.progressFX-bar {
    float: right;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}

.page-md .progressFX {
    text-indent: -99999px;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

.dashboard-stat2 .progressFX-info .status {
    margin-top: 5px;
    font-size: 11px;
    color: #AAB5BC;
    font-weight: 600;
    text-transform: uppercase;
}

.dashboard-stat2 .progressFX-info .status .status-title {
    float: right;
    display: inline-block;
}

.dashboard-stat2 .progressFX-info .status {
    font-size: 11px;
    color: #AAB5BC;
    font-weight: 600;
    text-transform: uppercase;
}

.dashboard-stat2 .progressFX-info .status .status-number {
    float: left;
    display: inline-block;
}


.portlet.light.bordered {
    border: 1px solid #e7ecf1 !important;
}
.portlet.light {
    padding: 12px 20px 15px 20px;
    background-color: #fff;
}
.portlet {
    box-shadow: 0px 2px 3px 2px rgba(0, 0, 0, 0.03);
    margin-top: 0px;
    margin-bottom: 25px;
    padding: 0px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
}

.note.note-warning {
    background-color: #faeaa9;
    border-color: #f3cc31;
    color: black;
}
.note {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    border: 0;
        border-top-color: currentcolor;
        border-right-color: currentcolor;
        border-bottom-color: currentcolor;
        border-left-color: currentcolor;
}
.note {
    margin: 0 0 20px 0;
    padding: 15px 15px 15px 30px;
    border-right: 5px solid #eee;
    -webkit-border-radius: 2px 0 0 2px;
    -moz-border-radius: 2px 0 0 2px;
    -ms-border-radius: 2px 0 0 2px;
    -o-border-radius: 2px 0 0 2px;
    border-radius: 2px 0 0 2px;
}

.table-bordered, .table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
    border: 1px solid #e7ecf1;
	
}

table {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}

/*search */
.serch-box {
background-color: #f3f6f8;
padding: 25px;
border-radius: 5px;
border: 1px solid #d7ecff;
}

.serch-box-div {
display: block;
margin: 20px auto;
font-size: 15px;
text-align: center;
}
/*public service */
.service-container {
  border: 1px solid #3F74A8;
  background-color: #FCFCFC;
  padding: 1rem 1rem;
  border-radius: 10px;
  margin: 1rem;
  width: 100%;
  height: 200px;
  max-width: 320px;
  position: relative;
}
.service-container::before,
.service-container::after {
  content: '';
  position: absolute;
  border-radius: 15px;
  z-index: -1;
}
.service-container::before {
  width: 90%;
  height: 100%;
  background-color: #3F74A8;
  top: -4%;
  left: 12%;
}
.service-container::after {
/*  background: linear-gradient(90deg, #59439A 0%, #8EA3D4 99%);*/
background:  #3F74A8;
  width: 8rem;
  height: 8rem;
  left: -2%;
  bottom: -4%;
  z-index: -2;
}
.simple{
  background-color: #FCFCFC;      
}
.icon-simple-desc h4 {
  font-weight: bold;
    color: white;
/*    color: #19446E;*/
}
.icon-simple-desc p {
   font-size:  12px;   
    color: black;
}

    :root {

  --card3-gradient-color1: #3F74A8;
  --card3-gradient-color2: #F1EDC6;
}
    .yelow-bg {
        background-color: #F7F3D2;
    }
.service-card-wrap {
  width: 280px;
  height: 370px;
  border-radius: 10px;
  position: relative;
}

.service-card-wrap.three {
  background: linear-gradient(
    to bottom,
    var(--card3-gradient-color1),
    var(--card3-gradient-color2)
  );
  transform: scale(0.9);
}
.service-card-wrap.three::after {
  background: var(--card3-gradient-color1);
}

.service-card-header {
  width: 160px;
  height: 80px;
  background: #DDD472;
  position: absolute;
  top: -5%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(0 0, 100% 0%, 100% 75%, 50% 100%, 0 75%);
}
.service-card-header i   {
 font-size: 30px; 
 color: white;
}

.service-card-header i:hover  {
 font-size: 30px; 
 color: #3F74A8;
}

    
.service-card-header h1 {
  text-transform: uppercase;
  font-weight: 900;
  font-size: 21px;
  color: var(--color-text1);
  margin-top: -10px;
}
.service-card-content {
  width: 190px;
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

.service-card-footer {
  width: 160px;
  position: absolute;
  bottom: -1%;
  left: 50%;
  transform: translateX(-50%);
  background: #DDD472;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 7px;
}

/***********************************************/
.card-container-box {
  display: flex;
  flex-direction: column;
  width: 180px;
  height: 260px;
  border: 1px solid #E2E3E5;
  border-bottom: 3px solid #337ab7;
  border-radius: 30px;
  font-family: "Helvetica Neue", sans-serif;
  font-size: 15px;
  position: relative;
    
}

.hero {
  height: 90%;
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
  background-size: cover;
}
.hero  img{
  width: 100%;
  height: 90%;
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
  background-size: cover;
}

.avatar {
  border: 2px solid #fff;
  width: 30px;
  height: 30px;
  background: navy;
  border-radius: 50%;
  position: absolute;
  top: 145px;
  left: 30px;
  background-color: #337ab7;
  background-size: cover;
}


.name-container {
  display: flex;
  flex-direction: column;
    text-align: center !important;
}

.name-container h1 , .name-container a   {
  font-weight: 500;
  font-size: 15px;
  color: #337ab7;
}
.social-list i {
    border: none !important ;
    
    font-size: 15px !important ;
    text-align: center !important ;
    color: white;
    left: 50px;
}
.social-list {
    text-align: center !important ;
    background-color: #337ab7;
    width: 100%;
    color: white; 
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
} 



/****/


.box-container{
  margin: auto;
  width: 100%;
  border-radius: 1rem;
}

.box-profile-picture{
  border-top-left-radius: 0.9rem;
  border-top-right-radius: 0.9rem;
  height: 20px;
  background: #19adf7;
  display: flex;
  
}

.box-profile-picture p{
    margin: auto;
	color: white;
  text-align: center;
}

.box-main{
  padding: 2rem;
  background: #F6F6F6;
  
  align-items: left;
}

.box-name{
  color: white;
  font-wheight: bold;
  margin: 0 0 0.5rem 0;
}

.box-profession{
  color: #F3BF99;
  margin: 0;
}

.box-website{
  color: #F5F5F5;
  margin: 0.25rem 0 1rem 0;
}

.box-buttons{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.box-btn{
  width: 120px;
  height: 40px;
  border: none;
  margin: 0 0.5rem;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.box-btn img{
  width: 25px;
  margin: 0 0.5rem;
}

.linkedin{
  background: #5093E2;
  color: white;
}

.box-footer{
  padding: 1rem;
  background: #F6F6F6;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom-left-radius: 0.9rem;
  border-bottom-right-radius: 0.9rem;
}

.box-section-title{
  color: #F5F5F5;
}

.box-section p{
  color: #DCDCDC;
}

.box-footer img:hover{
  cursor: pointer;
}

.rankcontainer {
    width: 95%;
    display: flex;
    padding: 0 20px;
}
.slide {
    height: 30vh;
    border-radius: 20px;
    margin: 10px;
    cursor: pointer;
    color: #fff;
    flex: 1;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    transition: all 500ms ease-in-out;
}

.slide h3 {
    position: absolute;
    font-size: 24px;
    bottom: 20px;
    left: 20px;
    margin: 0;
    opacity: 0;
}
.slide.active {
    flex: 10;
}

.slide.active h3 {
    opacity: 1;
    transition: opacity  0.3s ease-in 0.4s;
}
/** event **/
.eventcontainer {
	width: 100%;
	margin-top: -30px;
	margin: auto;
	padding: 30px;
	text-align: center;
  }
  
  .prodNav {
	width: 60%;
	font-size: 15px;
	
	border-radius: 2px;
	overflow: hidden;
	display: inline-block;
	vertical-align: middle;
	
	line-height: 1.1;
  }
  .prodNav .ptItem {
	background: #f5f5f5;
	padding: 15px 45px;
	line-height: 20px;
	border-radius: 2px;
	border: 1px solid transparent;
	font-weight: 500;
	cursor: pointer;
	display: inline-block;
	vertical-align: middle;
	transition: all 0.3s ease-in-out;
  }
  
  .prodNav .ptItem.active,
  .prodNav .ptItem:hover {
	background: #19adf7;
	border-color: #19adf7;
	color: #ffffff;
  }
  
  
  
	
	.bookmark {
		position: absolute;
		z-index: 1000;
		top: 0;
		right: 10%;
		height: 6em;
		width: 5em;
		background-color: #19adf7;
		background-image:
		  linear-gradient(
			hsla(0, 0%, 100%, 0),
			hsla(0, 0%, 100%, 0.5) 5px,
			hsla(0, 0%, 100%, 0) 25px);
		-webkit-filter: drop-shadow(0 2px 6px hsla(0, 0%, 0%, 0.75));
		box-sizing: border-box;
		padding-top: 50px;
		color: white;
		font-size: 1em;
		text-align: center;
		text-shadow: 0 -1px 0 hsla(0, 0%, 0%, 0.5);
	  }
	 
	  .bookmark:before,
	  .bookmark:after{
		content: '';
		display: block;
		position: absolute;
	  }
	  .bookmark:before {
		bottom: -50%;
		height: 100%;
		width: 100%;
		background-image:
		  linear-gradient(
			-45deg,
			transparent 50%,
			#19adf7 50%),
		  linear-gradient(
			45deg,
			transparent 50%,
			#19adf7 50%);
		z-index: -1;
	  }
	  .bookmark:after {
		height: 136.5%;
		width: 88%;
		left: 6%;
		top: 0;
		border-style: dashed;
		border-color: white;
		border-width: 0 1px;
		pointer-events: none;
	  }
	  
	  
	  .bar {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	  }
	  
	  .bar .event-bar {
		width: 14rem;
		height: 4rem;
		background-color: #F0EFEF;
		padding: 5px;
		
		/* border: 1px solid #19adf7; */
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		justify-content: center;
		
	  }
	  .bar .event-bar i {
		  color: #19adf7;
	  }
	  
	  .bar .event-bar span {
		  color: #757575;
		  font-size: 10px;
	  }
	
	  
	 
	  
	  @media screen and (max-width: 425px) {
		
		.bar .event-bar {
		  width: 3.7rem;
		  font-size: 10px;
		}
	 
	  }
	   
	  /*  @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ contact page style  @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/

	
	


  
  .con-container {
	
	display: flex;
	justify-content: center;
  }
  
  .con-contact {
	
	min-height: 752px;
	position: relative;
	min-width: 860px;
	margin: auto;
	box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
	border-radius: 20px;
	overflow: hidden;
	border: 1px solid #19adf7;
  }
  
  .con-overlay {
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 100%;
	border-radius: 20px;
	z-index: 2;
  }
  
  
  .contact_container {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 10;
	display: flex;
  }
  
  .con-left {
	width: 30%;
	height: 100%;
	background-color: #19adf7;
	padding: 10px;
	color:#fff;
	
  }
  
  .con-right {
	background-color: #fff;
	height: 100%;
	width: 70%;
	padding-right: 20px;
	padding-top: 30px;
	position: relative;
	padding: 10px;
  }
  
/*  @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ topic page style  @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/

kirin-temp {
	display: block;
	margin: 0 auto;
	width: 100%;
	padding: 8px;
	border-radius: 8px;
	color: #333;
	font-family: Poppins, sans-serif;
	font-size: 13px;
	line-height: 20px;
	background: rgba(255,255,255,.2);
  }
  
  .kirin-header {
	padding: 8px;
	border: 1px solid #ddd;
	border-radius: 8px;
	margin-bottom: 10px;
	text-align: center;
	text-align-last: center;
	text-transform: lowercase;
	color: #fff;
	line-height: 30px;
  }
  
  .kirin-header h1 {
	margin: 0;
	font-weight:200;
	font-size: 28px;
	background: #19adf7;
	color:white;
	border-radius: 8px;
	padding: 10px 5px;
  }
  
  .kirin-wrapper {
	border: 1px solid #ddd;
	background: #fcfcfc;
	padding: 8px;
	border-radius: 8px;
	display: grid;
	grid-template-columns: 16px 1fr;
	grid-gap: 4px;
  }
  
  .kirin-sidebar {
	position: relative;
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	border: 1px solid #ddd;
	padding: 3px;
	border-radius: 5px;
  }
  
  .kirin-color {
	display: block;
	width: 100%;
	height: auto;
	background: #19adf7;
  }
  
  .kirin-color.k-one {
	border-radius: 3px 3px 0 0;
  }
  
  .kirin-color.k-two {
	opacity: .8;
  }
  
  .kirin-color.k-three {
	opacity: .6;
  }
  
  .kirin-color.k-four {
	opacity: .4;
  }
  
  .kirin-color.k-five {
	opacity: .2;
	border-radius: 0 0 4px 4px;
  }
  
  .kirin-post {
	/*text-align: justify;*/
	font-size: 14px;
	padding: 20px;
	border: 1px solid #ddd;
	border-radius: 8px;
  }
  
 
  
  .kirin-post b {
	font-size: 15px;
	color: #19adf7;
  }
  
  /************************************
				VARIABLES
  ************************************/
  
  .ENERGY {
	--CherryGradient: linear-gradient(45deg, #f39673, rgba(243,150,115, .5)); 
	);
	--Accent: #f39673;
	--AccentRGBA: rgba(243,150,115, 0.4);
  }
  
  /* ARCANE */
  
  .ARCANE {
	--CherryGradient: linear-gradient(45deg, #9970ed, rgba(153,112,237, .5)); 
	--Accent: #9970ed;
	--AccentRGBA: rgba(153,112,237, 0.5);
  }
  
  /*DARKNESS*/
  .DARKNESS {
	--CherryGradient: linear-gradient(45deg, #9970ed, rgba(121,94,175,.5)); 
	--Accent: #795eaf;
	--AccentRGBA: rgba(121,94,175, .3);
  }
  
  /*EARTH*/
  
  .EARTH {
	--CherryGradient: linear-gradient(45deg, #59c1b8, rgba(89,193,184,.5)); 
	--Accent: #59c1b8;
	--AccentRGBA: rgba(89,193,184, .4);
  }
  
  /*WATER*/
  
  .WATER {
	--CherryGradient: linear-gradient(45deg, #5b76cd, rgba(91,118,205,.5)); 
	--Accent: #5b76cd;
	--AccentRGBA: rgba(91,118,205, .4);
  }
  
  /*AIR*/
  .AIR {
	--CherryGradient: linear-gradient(45deg, #7fb0e0, rgba(127,176,224,.5)); 
	--Accent: #7fb0e0;
	--AccentRGBA: rgba(127,176,224,.6);
  }
  
  /*FIRE*/
  .FIRE {
	--CherryGradient: linear-gradient(45deg, #d95858, rgba(217,88,88,.5)); 
	--Accent: #d95858;
	--AccentRGBA: rgba(217,88,88,.6);
  }
  
  /*CRYSTAL*/
  .CRYSTAL {
	--CherryGradient: linear-gradient(45deg, #de81b8, rgba(222,129,184,.5)); 
	--Accent: #de81b8;
	--AccentRGBA: rgba(222,129,184,.6);
  }
  
  /*LIGHT*/
  .LIGHT {
	--CherryGradient: linear-gradient(45deg, #f3d073, rgba(243,208,115,.5)); 
	--Accent: #f3d073;
	--AccentRGBA: rgba(243,208,115,.3);
  }
  
  
  /*NATURE*/
  .NATURE {
	--CherryGradient: linear-gradient(45deg, #67c078, rgba(103,192,120,.5)); 
	--Accent: #67c078;
	--AccentRGBA: rgba(103,192,120,.6);
  }
  
  /*ADMIN*/
  .ADMIN {
	--CherryGradient: linear-gradient(45deg, #67c078, rgba(103,192,120,.5)); 
	--Accent: #67c078;
	--AccentRGBA: rgba(103,192,120,.6);
  }
  
  /*OOC*/
  
  .OOC {
	--Accent: #8aa6ac;
	--AccentTwo: #c17388;
	--AccentRGBA: rgba(103,192,120,.6);
	--AccentMid: #d0d4e5;
	--AccentLight: #e4f3f5;
  }
.gray-color {
	background-color: #F0EFEF;
}

.block-bold{
	font-size: 16px !important; 
	color: #19adf7;
	text-align: center !important; 
}
.txt-color{
	color:#8f8d8d;
	/*color:#009bb7;*/
}
   
ul.ul-cards {
    width: 100% !important;
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    list-style: none;
    justify-content: center;
}
ul.ul-cards>li{
    --bg-color: #F2F2F2;
    --text-color: #333;
    --padding: 0.1rem;
    --circle-size: 7rem;
    --circle-expand: 1rem;
    --flap-height: 1.25rem;
    --flap-offset: 0.5rem;
    max-width: 26rem;
	max-height: 26rem;
    margin-top: calc(var(--circle-size) / 2 + var(--circle-expand));
    margin-bottom: var(--flap-offset);
    background-color: var(--bg-color);
    background-image: linear-gradient(to bottom left, transparent 50%, rgba(0 0 0  / .125));
    border-radius: 10px;
    padding: var(--padding);

    --bs-rim: inset -0.1rem 0.1rem 0.1rem rgb(255 255 255 / .5);
    --bs-card-spread: 0.25rem;
    --bs-card-color:  rgb(0 0 0 / 0.02);
    --bs-card: 
        -0.1rem 0.1rem var(--bs-card-spread) var(--bs-card-color),
        -0.2rem 0.2rem var(--bs-card-spread) var(--bs-card-color),
        -0.3rem 0.3rem var(--bs-card-spread) var(--bs-card-color),
        -0.4rem 0.4rem var(--bs-card-spread) var(--bs-card-color),
        -0.5rem 0.5rem var(--bs-card-spread) var(--bs-card-color),
        -0.6rem 0.6rem var(--bs-card-spread) var(--bs-card-color),
        -0.7rem 0.7rem var(--bs-card-spread) var(--bs-card-color),
        -0.8rem 0.8rem var(--bs-card-spread) var(--bs-card-color),
        -0.9rem 0.9rem var(--bs-card-spread) var(--bs-card-color),
        -1.0rem 1.0rem var(--bs-card-spread) var(--bs-card-color),
        -1.1rem 1.1rem var(--bs-card-spread) var(--bs-card-color),
        -1.2rem 1.2rem var(--bs-card-spread) var(--bs-card-color),
        -1.3rem 1.3rem var(--bs-card-spread) var(--bs-card-color),
        -1.4rem 1.4rem var(--bs-card-spread) var(--bs-card-color),
        -1.5rem 1.5rem var(--bs-card-spread) var(--bs-card-color),
        -1.6rem 1.6rem var(--bs-card-spread) var(--bs-card-color),
        -1.7rem 1.7rem var(--bs-card-spread) var(--bs-card-color),
        -1.8rem 1.8rem var(--bs-card-spread) var(--bs-card-color),
        -1.9rem 1.9rem var(--bs-card-spread) var(--bs-card-color);
    box-shadow: var(--bs-rim), var(--bs-card);
    display: grid;
  grid-template-rows: max-content max-content auto ;
    justify-items: center;
    text-align: center;
    gap: 0.75rem;
    position: relative;
}
ul.ul-cards>li>.icon{
    width: var(--circle-size);
    margin-top: calc(var(--circle-size) / -2 - var(--padding));
    aspect-ratio: 1;
    background-color: #fff;
    justify-self: center;
    border-radius: 50%;
    display: grid;
    place-items: center;
    box-shadow:var(--bs-rim), -0.1rem 0.1rem 0.25rem rgb(0 0 0 / .25);
}
ul.ul-cards>li>.icon>i{
    font-size: calc(var(--circle-size) / 3);
    color: var(--accent-color);
}
ul.ul-cards>li>.title{
    margin-top: 0.2rem;
    color: var(--accent-color);
    font-weight: 500;
	padding: 5px;
}
ul.ul-cards>li>.title h4{
   font-size: 14px !important;
} 
ul.ul-cards>li>.content{
    font-size: 0.8rem;
    
    color: var(--text-color)
}
ul.ul-cards>li::before, ul>li::after{
    content: "";
    position: absolute;
}
ul.ul-cards>li::before{
    top: calc(var(--circle-size) / -2 - var(--circle-expand));
    width: calc(var(--circle-size) * 1 + var(--circle-expand) * 2);
    height: calc(100% + var(--circle-size) / 2 + var(--padding) + var(--flap-offset)) ;
    background-color: var(--accent-color);
    background-image: linear-gradient( transparent 50%, rgb(0 0 0 / .25) 0);
    border-top-left-radius: calc(var(--circle-size) / 2 + var(--circle-expand));
    border-top-right-radius: calc(var(--circle-size) / 2 + var(--circle-expand));
    clip-path: polygon(
      0 0, 
      100% 0, 
      100% calc(100% - var(--flap-offset)), 
      calc(100% - var(--flap-offset)) 100%, 
      var(--flap-offset) 100%,  
      0 calc(100% - var(--flap-offset))
    );
    z-index: -1;
}
ul.ul-cards>li::after{
    width: calc(var(--circle-size) * 1 + var(--circle-expand) * 2 - var(--flap-offset) * 2);
    height: var(--flap-height);
    bottom: calc(var(--flap-offset) * -1);
    border-top-left-radius: var(--flap-height);
    border-top-right-radius: var(--flap-height);
    background-color: var(--accent-color);
}


.contactus .wrapper {
  height: 620px;
  width: 460px;
  background-color: white;
  border-radius: 24px;
  overflow: hidden;
}

.contactus .header {
  width: 100%;
  height: 35%;
  background: linear-gradient(to left bottom,  #15a6ee, #19adf7);
  background-size: cover;
  background-position: center;
  color: white;
  text-align: center;
}

.contactus h1 {
  margin: 0;
  padding: 34px 24px 12px;
  font-weight: 300;
  font-size: 60px;
}

.contactus p {
  margin: 0;
  padding: 0 24px;
  font-size: 16px;
  width: 360px;
  opacity: 0.8;
  margin: 0 auto;
}

.contactus form {
  display: flex;
  flex-direction: column;
  margin: 8px auto;
  width: 76%;
}

.contactus h4 {
  color: #666;
  margin: 16px 0 6px;
  font-size: 16px;
  letter-spacing: 1px;
  
}

.contactus input,
.contactus textarea {
  border: solid 1px #cbcbcb; 
  border-radius: 6px;
  width: 92%;
  padding: 6px 12px;
  outline: none;
  margin: 4px auto;
}

.contactus input {
  height: 28px;
}

.contactus textarea {
  height: 62px;
}

.contactus button {
  height: 42px;
  width: 60%;
  margin: 24px auto;
  border-radius: 6px;
  border: none;
  color: white;
  background: linear-gradient(to left bottom,  #15a6ee, #19adf7);
  cursor: pointer;
}

/* form */

.ConForm .wrapper{

display: grid;

place-content: center;

height: 100vh;

}

.ConForm .card {

height: 500px;

width: 650px;

position: relative;

transition: all 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);

border-radius: 1em;

overflow: hidden;

}


/*Image*/

.ConForm .card-image {

height: 55%;

width: 100%;

position: absolute;

top: 0;

transition: all 1s cubic-bezier(0.645, 0.045, 0.355, 1);

object-fit: cover;

background-color: #19adf7;

}


/*Description */

.ConForm .card-description {

width: 100%;

display: flex;

gap: 1em;

flex-direction: column;

background-color: #f5f5f5;

height: 50%;

position: absolute;

bottom: 0;

border-radius: 1em 1em 0 0;

transition: all 1s cubic-bezier(0.645, 0.045, 0.355, 1);

padding: 1rem;

}


/*Text*/

.ConForm .text-title {

font-size: 1.4em;

font-weight: 700;

}


.ConForm .text-body {

font-size: 1em;

line-height: 150%;

}



/* Hover states */


.ConForm .card:hover .card-description {

transform: translateY(100%);

}


.ConForm .card:hover  .card-image {

 height: 100%;

}

.square {
  width: 25px;
  height:18px;
  background-color:#efefef;
  border-radius:4px;
  color:#19adf7;
  text-align: center;
  font-size:10px;
}

.square:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

/* glossary */
:root{
  --color-text: #616161;
  --color-text-btn: #ffffff;
  --card1-gradient-color1: #f12711;
  --card1-gradient-color2: #f5af19;
  --card2-gradient-color1: #7F00FF;
  --card2-gradient-color2: #E100FF;
  --card3-gradient-color1: #3f2b96;
  --card3-gradient-color2: #a8c0ff;
  --card4-gradient-color1: #11998e;
  --card4-gradient-color2: #38ef7d;
}

.card-wrap{
  width: 100%;
  min-height: 29rem;
  
 
  overflow: hidden;
 
  cursor: pointer;
  transition: all .2s ease-in-out;
  

	text-align: center;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;

}
.card-wrap:hover{
  transform: scale(1.1);
}
.card-header{
  height: 20px;
  width: 100%;
  background-color: #19adf7;
 
  display: grid;
  place-items: center;

}

.card-content{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
   padding:15px;
  margin: 0 auto;
}
.card-title{
  text-align: center;
  text-transform: uppercase;
  font-size: 18px;
  font-weight:bold;
  margin-top: 40px;
  color:#19adf7;
 
  
}
.card-text{
  text-align: center;
  font-size: 12px;
  margin-bottom: 20px;
}

.card-header.one{
  background: linear-gradient(to bottom left, #19adf7, #7ecdf3);
}

ul.ul-cards-glossary {
    width: 100% !important;
    margin-inline: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    list-style: none;
    justify-content: center;
}
ul.ul-cards-glossary>li{
    --bg-color: #F2F2F2;
    --text-color: #333;
    --padding: 0.1rem;
    --circle-size: 7rem;
    --circle-expand: 1rem;
    --flap-height: 1.25rem;
    --flap-offset: 0.5rem;
    max-width: 40rem;
	max-height: 29rem;
    margin-top: calc(var(--circle-size) / 2 + var(--circle-expand));
    margin-bottom: var(--flap-offset);
   
    border-radius: 10px;
    padding: var(--padding);

    --bs-rim: inset -0.1rem 0.1rem 0.1rem rgb(255 255 255 / .5);
    --bs-card-spread: 0.25rem;
    --bs-card-color:  rgb(0 0 0 / 0.02);
    --bs-card: 
        -0.1rem 0.1rem var(--bs-card-spread) var(--bs-card-color),
        -0.2rem 0.2rem var(--bs-card-spread) var(--bs-card-color),
        -0.3rem 0.3rem var(--bs-card-spread) var(--bs-card-color),
        -0.4rem 0.4rem var(--bs-card-spread) var(--bs-card-color),
        -0.5rem 0.5rem var(--bs-card-spread) var(--bs-card-color),
        -0.6rem 0.6rem var(--bs-card-spread) var(--bs-card-color),
        -0.7rem 0.7rem var(--bs-card-spread) var(--bs-card-color),
        -0.8rem 0.8rem var(--bs-card-spread) var(--bs-card-color),
        -0.9rem 0.9rem var(--bs-card-spread) var(--bs-card-color),
        -1.0rem 1.0rem var(--bs-card-spread) var(--bs-card-color),
        -1.1rem 1.1rem var(--bs-card-spread) var(--bs-card-color),
        -1.2rem 1.2rem var(--bs-card-spread) var(--bs-card-color),
        -1.3rem 1.3rem var(--bs-card-spread) var(--bs-card-color),
        -1.4rem 1.4rem var(--bs-card-spread) var(--bs-card-color),
        -1.5rem 1.5rem var(--bs-card-spread) var(--bs-card-color),
        -1.6rem 1.6rem var(--bs-card-spread) var(--bs-card-color),
        -1.7rem 1.7rem var(--bs-card-spread) var(--bs-card-color),
        -1.8rem 1.8rem var(--bs-card-spread) var(--bs-card-color),
        -1.9rem 1.9rem var(--bs-card-spread) var(--bs-card-color);
    
    display: grid;
  grid-template-rows: max-content max-content auto ;
    justify-items: center;
    text-align: center;
    gap: 0.75rem;
    position: relative;
}
.box-container2{
  margin: auto;
  width: 100%;
  border-radius: 1rem;
  border-radius: 10px;
}

.box-main2{
  padding: 2rem;
   background: #fff;
  border-radius: 10px;
  border: 5px solid #fff;
  overflow: hidden;
  color: var(--color-text);
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px,
              rgba(0, 0, 0, 0.23) 0px 6px 6px;
  align-items: left;
}

/* drill slider */



/********************************************/

.carousel-container{
  position:relative;
  margin:1em auto .5em auto;
  max-width:600px;
}

.carousel-container  .carousel-imgs img{
border-radius:.5em;
width:100%;
height: 340px;
}
.sliedhidden{
  display:none;
}
.slidevisible{
  display:block;
}
.arrow{
  display:inline;
}

.prev, .arrow{
 cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin: -1.5em .3em 0 .3em;
  padding: 1em;
  color: white;
  font-weight: bold;
  font-size: 1.2em;
  transition: 0.3s ease;
  border-radius: .5em;
  user-select: none;
  background-color:rgba(204,204,204, 0.3);
}
.next {
  right:0 !important;
}
.prev {
  left:0 !important;
}
.prev:hover, .next:hover{
  box-shadow: 0 0 5px #fff;
  border:1px solid #fff;
}

.heading-2 {
		
		font-size: 1.5em;
		letter-spacing: 0.08em;
		font-weight: 300;
		color: #19adf7;
		text-shadow: 0 1px 1px #FFFFFF;
		
}




.divider-2 {
		border-bottom: 1px solid #FFF;
		/*background-color: #DADADA;*/
		height: 1px;
		margin: 0.5em 0px 1.5em;
}

.divider-2 span {
		display: block;
		width: 50px;
		height: 1px;
		background-color: #19adf7;
}

/*--------------------------------------------------------------
#2023 update
--------------------------------------------------------------*/


.home-logo{
	width: 400px;
    height: 160px;
	margin:-35px 320px 40px 320px;
}
.hadatha-logo{
	width: 400px;
    height: 160px;
	margin:-25px 230px 40px 230px;
}



.public-box   .icon-boxes-1,.icon-boxes-2{
	position:relative;
	z-index: 1;
}
.public-box   .icon-box p{
	margin-bottom: 0
}
.public-box   .icon-box-1{
	padding: 5px;
	text-align:center;
	position:relative;
	box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.12);
	border: 1px #fff solid;
}

.public-box   .icon-box-1 .icon-desc{
	position:relative;
	z-index:3;
	margin-bottom:80px;
}
.public-box   .icon-box-1 .icon-desc p{margin-bottom: 25px;}
.public-box   .icon-box-1 .box-number{
	font-size:30px;
}
.public-box   .icon-box-1 .box-number{
	color:#fff;
	bottom: 30px;
	height: 55px;
	position:absolute;
	left:8%;
	width:82%;
	bottom:30px;
}
.public-box  .icon-box-1 .box-number:after{
	z-index:1
}
.public-box  .icon-box-1 .box-number:after,.icon-box-1 .box-number:before{
	position:absolute;
	width: 6px;
	height: 107%;
	left: -2px;
	top: -4%;
	content:"";
	display:block;
	border-radius: 2em;
	display:inline-block;
	z-index:1;
}
.public-box  .icon-box-1 .box-number:before{
	left: auto;
	right: -2px;
}
.public-box  .icon-box-1 .box-number span.count-title{
	position:relative;
	z-index:5;
	padding: 0;
	display: block;
	height: 100%;
	line-height: 46px;
	overflow:hidden;
	font-family: 'Oswald', sans-serif;
	font-weight: 500
}
.public-box  .icon-box-1 .box-number span.count-title span{
	font-family:inherit
}
.public-box   .icon-box-1 .box-number span.count-title i{
	color:#fff;
	line-height:55px;
	font-size:35px
}
.public-box   .icon-box-1 .box-number span.count-title:after{
	z-index:-1;
}
.public-box   .icon-boxes-1 [class*="col-md-"]:before,.icon-boxes-1 [class*="col-md-"]:after{
	height: 55px;
	width:15px;
	position:absolute;
	left:0;
	bottom:30px;
	content:"";
	display:inline-block;
}
.public-box  .icon-boxes-1 [class*="col-md-"]:after{
	left:auto;
	right:0
}
.public-box  .icon-boxes-1:before,.icon-boxes-1:after{
	border-width: 10px 15px 0 0;
	left:0;
	bottom: 85px;
}
.public-box  .icon-boxes-1:after{
	left:auto;
	right:0;
	border-width: 10px 0 0 15px;
}
.youtube-item  {
	padding:6px;
	box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.12);
	border: 1px #fff solid;
}
.list-categories-content .col-md-4 {
	padding-left:8px;
	padding-right:10px;
}
.post-info h5 {
	padding-top:24px;
	padding-right:1px;
	
}
.youtube-link  h5 {
	padding:20px !important;
	
	text-align: center !important;
	
}
.menu-container {
  background: #19adf7;
  position: fixed;
  left: -30px;
  z-index: 99;
  width: 26px;
  border-radius: 0 6px 6px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 2px;
  transform: translateX(30px);
  
}



.menu-container .menu-item:hover {
  cursor: pointer;
  font-size:20px;
}

.menu-container .menu-item {
  color: #fff;
  opacity: 1;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: row-reverse;
  position: relative;
  padding: 10px 5px;
}
.menu-container .menu-item a {
  color: #fff;

}

.col-md-6 .icon-box-1 {
  padding: 20px;
  text-align: center;
  position: relative;
  box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.12);
  border: 1px #fff solid;
  background-color: none;
  height:270px !important;
}
.First-color {
background-color:#001a30 !important;
color:#fff;
}
.Second-color {
background-color:#30c0ce !important;
color:#fff;
}
.Third-color {
background-color:#dfe4f2 !important;
color:#fff;
}
.Fourth-color {
background-color:#5d489d !important;
color:#fff;
}
.Fifth-color {
background-color:#dfe0df !important; 
color:#000;
}
.Sixth-color {
background-color:#3d9cd6 !important;
color:#fff;
}
.seventh-color {
background-color:#3d9cd6 !important; 
color:#fff;
}
.margin-box{
	margin-top:40px;
	margin-right:220px;
	margin-left:220px;
}
.m-margin{
	padding-top:280px !important;
	padding-bottom:280px !important;
}
.mds-padding{
  padding-top: 20px;
  padding-bottom: 20px;
}
.height {
	height:230px !important;
}
.height-hd {
	height:390px !important;
}
.margin-box-top{
	margin-top:240px;

}
.b-pading {
	padding-top:120px !important;
	padding-bottom:120px !important;
}
.margin-box-to-top{
	margin-top:-360px;

}

.white {
	color: #fff !important;
}
.black-color {
	color: #686868 !important;
}
 .panel_1 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#001a30;
}
.panel_1 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#001a30;
	color:#fff;
}
.panel_2 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#30c0ce;
}

.panel_rank  .rank-color {
	background-color:#19adf7;
	color:#fff;
	height:100px !important;
}

.panel_rank  .accordion h5.acc-head a  {
 background-color:transparent !important;
 border:none !important;
 border-bottom:1px solid #f3f1f1 !important;
}
.panel_rank  .accordion h5.acc-head a::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: inline-block;
  font: normal normal normal 13px/1 FontAwesome;
    font-size: 13px;
  content: "\f00d";
  top: 0px;
  font-size: 12px;
  padding: 23px 3;
  font-size: 13px;
  width: 15px;
  text-align: center;
}
.panel_rank .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#19adf7;
}
.panel_rank .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#19adf7;
	color:#fff;
}


.panel_2 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#30c0ce;
	color:#fff;
}
 .panel_3 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#a4a4a4;
}
.panel_3 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#a4a4a4;
	color:#fff;
}
.panel_4 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#5d489d;
}
.panel_4 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#5d489d;
	color:#fff;
}

.panel_5 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#919bb4;
}
.panel_5 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#dfe4f2;
	color:#838383;
}
.panel_5  h4 , .panel_5  p{

	color:#838383;
}
.panel_6 .accordion h5.acc-head a {
	background-color: none;
	font-size:11px;
	color:#3d9cd6;
}
.panel_6 .accordion.shadowed h5.acc-head a:not(.collapsed) {
	background-color:#3d9cd6;
	color:#fff;
}
.containerx{
	margin: 0px  20px 0px 20px; 
}

.carousel-container,
.carousel-container_2 {
  border-radius: 1px;
  overflow: hidden;
  
  position: relative;
  box-shadow: 0 0 30px -20px #223344;
  margin: auto;
  z-index: 0;
  background-color:transparent;
  height:244px;
  border:1px solid #dcdcdc;
}

/* Hide the images by default */
.mySlides
{
  display: none;
  width: 100%;
   height:200px;
}
.mySlides img {
 
  width: 100%;
  height:200px;
}


.mySlides_2 {
  display: none;
  width: 100%;
   height:200px;
}

.mySlides_2 img  {
 
  width: 100%;
  height:200px;
}


/* image gradient overlay [optional] */
/*  .mySlides::after {
  content: "";
  position: absolute;
  inset: 0;
    background-image: linear-gradient(-45deg, rgba(110, 0, 255, .1), rgba(70, 0, 255, .2));
} */

/* Next & previous buttons */
.prev{
  cursor: pointer;
  position: absolute;
  top: 26%;
  transform: translate(0, -50%);
  width: auto;
  padding: 5px;
  color:  #11b7ed;
  font-weight: bold;
  font-size: 20px;
  user-select: none;
 border-radius: .5em;
  background-color: transparent !important;
}

.next {
  cursor: pointer;
  position: absolute;
  top: 14%;
  transform: translate(0, -50%);
  width: auto;
  padding: 5px;
  color:  #11b7ed;
  font-weight: bold;
  font-size: 20px;
  user-select: none;
 background-color: transparent !important;
  right:2% !important;
  border-radius: .5em;
}

.prev:hover,
.next:hover {
  background-color: rgba(173, 216, 230, 0.3);
}

/* Caption text */
.text {
  color: #11b7ed;
  background-color: rgba(243, 243, 243, 0.2);
  /*backdrop-filter: blur(6px);*/
  z-index:1 !important;
  font-size: 11px;
  padding: 8px 12px;
  position: absolute;
  top: 84%;
  left: 50%;
  transform: translate(-50%);
  text-align: center;
  width:100%;
}

/* Number text (1/3 etc) */
.number {
  color: #f2f2f2;
  font-size: 16px;
  background-color: rgba(173, 216, 230, 0.15);
  backdrop-filter: blur(6px);
  border-radius: 10px;
  padding: 8px 12px;
  position: absolute;
  top: 10px;
  left: 10px;
}
.dots-container {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translate(-50%);
}



/* transition animation */
.animate {
  -webkit-animation-name: sliding-vertically;
  -webkit-animation-duration: 1s;
  animation-name: animate;
  animation-duration: 2s;
  
}

@keyframes animate {
  from {
    transform: scale(1.1) rotateY(10deg);
  }
  to {
    transform: scale(1) rotateY(0deg);
  }
}


.read-box {
	position: absolute;
	margin-top:15px;
	width:100px;
	border : 1px solid #19adf7;
	border-radius : 20px;
	background-color:#19adf7;
	color:white;
	padding:7px;
	text-align:center;
	
}
.read-box a {
	color:white;
	
	
}
.advisory-sec .icon-box-1{
	border-right: 2px solid #19adf7;
	height:180px;
	width:280px;
	text-align: center;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
	
}
.advisory-section .icon-box-1{
	border-right: 2px solid #19adf7;
	height:200px !important;
	width:180px !important;
	text-align: center;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
	
}

.advisory-section .icon-box-1:hover{
	background: linear-gradient(#02c8dc, rgb(25, 173, 247));
	color:white !important;
}
.advisory-section .icon-box-1 a:hover {
	color:white !important;
}
.advisory-section .icon-box-1 a {
	color:#19adf7 !important;
	font-weight:600;
}
.advisory-sec .icon-box-1 i { 
margin: 0; 
}
.advisory-sec .col-md-4{
	
	padding-bottom:20px;
}
.advisory-section  .col-md-4{
	padding-right:20px !important;
	padding-left:20px !important;
}

.rounded-circle{
	border-radius:50%;
	width:70px;
	height:70px;
	background-color:white;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
	
	
}
.advisory-section .rounded-circle{
	border-radius:50%;
	width:65px;
	height:65px;
	background-color:white;
	
	margin-top:11px;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
	
}

.onsale-section {
  position: absolute;
  top: -6px;
  right: 15px;
}

.onsale-section:after {
  position: absolute;
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  border-top: 6px solid transparent;
}

.onsale {
  position: relative;
  display: inline-block;
  text-align: center;
  color: #fff;
  background: transparent;
  font-size: 11px;
  line-height: 1;
  padding: 12px 8px 6px;
  border-top-right-radius: 8px;
  width: 64px;
  text-transform: uppercase;
  border-bottom: 4px solid #96a0a2;
}

.onsale:before,
.onsale:after {
  position: absolute;
  content: '';
  display: block;
}

.onsale:before {
  background: #19adf7;
  height: 7px;
  width: 6px;
  left: -6px;
  top: 0;
}

.onsale:after {
  background: #96a0a2;
  height: 7px;
  width: 8px;
  border-radius: 8px 8px 0 0;
  left: -8px;
  top: 0;
}

.product img {
  display: block;
}

.h-event-container .search-tabs{
	height:90px !important;

}


.h-event-container .search-tabs li a {
	width:340px;
	text-align:center;
	height:90px !important;
	padding:30px;
	font-size:16px;
	box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
	
}
.h-event-container .nav-tabs {
  border-bottom: none;
}
.h-event-container  .nav-tabs > li {
  margin-left: 8px;
  margin-right: 8px;

}


 .div-margin {
	margin-right:90px !important;
	margin-left:90px !important;
	width:74% !important;
}


.social {
  height: 40px;
  padding-top:6px;
  text-align: center;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  background-color:#f5f5f5;
  border-top:1px solid #ebe8e8;
  border-bottom:3px solid #19adf7;

}


	
.twitter-containor .bookmark {
		position: absolute;
		z-index: 1000;
		top: 0;
		right: 10%;
		height: 0.9em;
		width: 3em;
		background-color: #19adf7;
		background-image:
		  linear-gradient(
			hsla(0, 0%, 100%, 0),
			hsla(0, 0%, 100%, 0.5) 5px,
			hsla(0, 0%, 100%, 0) 25px);
		-webkit-filter: drop-shadow(0 2px 6px hsla(0, 0%, 0%, 0.75));
		box-sizing: border-box;
		padding-top: 50px;
		color: white;
		font-size: 1em;
		text-align: center;
		text-shadow: 0 -1px 0 hsla(0, 0%, 0%, 0.5);
	  }
	 
	  .twitter-containor .bookmark:before,
	  .twitter-containor .bookmark:after{
		content: '';
		display: block;
		position: absolute;
	  }
	  .twitter-containor .bookmark:before {
		bottom: -50%;
		height: 100%;
		width: 100%;
		background-image:
		  linear-gradient(
			-45deg,
			transparent 50%,
			#19adf7 50%),
		  linear-gradient(
			45deg,
			transparent 50%,
			#19adf7 50%);
		z-index: -1;
	  }
	  .twitter-containor .bookmark:after {
		height: 136.5%;
		width: 88%;
		left: 6%;
		top: 0;
		
		pointer-events: none;
	  }
	  
	  
	  /* ************************************************ */


 .arrow-down {
	 position: relative;
	 background: #19adf7 !important;
	 font-size: 1.2em;
	 padding:5px;
	 text-align:center;
box-shadow: rgba(27, 31, 35, 0.04) 0px 1px 0px, rgba(255, 255, 255, 0.25) 0px 1px 0px inset;
}
 .arrow-down:before {
	 content: "";
	 position: absolute;
	 border: 1.25em solid transparent;
	 z-index: -1;
	 top: 100%;
	 left: 50%;
	 border-top-color: #19adf7;
	 transform: translate3d(-50%, 0, 0);
	 
}


 .knobs div {
	 width: 13em;
	 height: 2.3em;
	 background: #bbb;
	 margin-bottom: 2em;
	 color: #fff;
	 border-radius: 1em;
	
}


.sec-icon {
  position: relative;
  display: inline-block;
  padding: 0;
  margin: 0 auto;
}

.sec-icon::before {
  content: "";
  position: absolute;
  height: 1px;
  left: -70px;
  margin-top: -5.5px;
  top: 60%;
  background: #333333;
  width: 50px;
}

.sec-icon::after {
  content: "";
  position: absolute;
  height: 1px;
  right: -70px;
  margin-top: -5.5px;
  top: 60%;
  background: #333;
  width: 50px;
}


.advertisers-service-sec .service-card {
  width: 100%;
  height: 100%;
  padding: 2em 1.5em;
 
box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  cursor: pointer;
  transition: 0.5s;
  position: relative;
  z-index: 2;
  overflow: hidden;
  background: #f0f0f0;;
}
.box-container2 .col-md-4 {
margin-bottom:20px;
}
.advertisers-service-sec .service-card::after {
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(#02c8dc, rgb(25, 173, 247));
  position: absolute;
  left: 0%;
  top: -98%;
  z-index: -2;
  transition: all 0.4s cubic-bezier(0.77, -0.04, 0, 0.99);
}

.advertisers-service-sec h5 {
  font-size: 16px;
  text-transform: capitalize;
  font-weight: 600;
  color: #1f194c;
  margin: 1em 0;
  z-index: 3;
  text-align:center;
}

.advertisers-service-sec p {
  color: #575a7b;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.03em;
  z-index: 3;
  text-align:center;
  
}

.advertisers-service-sec .icon-wrapper {
  background-color: #2c7bfe;
  position: relative;
  margin: auto;
  font-size: 30px;
  height: 2em;
  width: 2em;
  color: #ffffff;
  border-radius: 50%;
  display: grid;
  place-items: center;
  transition: 0.5s;
  z-index: 3;
}

.advertisers-service-sec .service-card:hover:after {
  top: 0%;
}

.service-card .icon-wrapper {
  background-color: #ffffff;
  color: rgb(2, 200, 220);
}

.advertisers-service-sec .service-card:hover .icon-wrapper {
  color: #0dcaf0;
}

.advertisers-service-sec .service-card:hover h3 {
  color: #ffffff;
}

.advertisers-service-sec .service-card:hover p {
  color: #fff;
}
.advertisers-service-sec .service-card:hover a {
  color: #fff;
}
/*  slider */

.containerslid{
	  background: #231A42;
  background: -webkit-linear-gradient(to left, #231A42, #644CAC);
  background: linear-gradient(to left, #231A42, #644CAC);
  padding: 50px 0;
}
#slider {
  border: 3px solid #F9F9F9;
  
}

.slide-item {
  color: #fff;
  text-align: center;
  font-size: 20em;
}

.carousel-indicators {
  display: table;
  left: 0;
  text-align: center;
  position: absolute;
  width: 100%;
  bottom: 10px;
  margin-left: 0;
  padding-right: 30px;
}

.carousel-indicators li {
  position: relative;
  width: 150px !important;
  height: auto !important;
  margin: 0;
  cursor: auto;
  background-color: initial !important;
  border: none;
  border-radius: initial;
  text-indent: initial;
  display: inline-block;
}

.dots,
.carousel-indicators> li:last-child:after {
  width: 30px;
  height: 30px;
  background: #231A42;
  border-radius: 50px;
  display: block;
  padding: 2px;
}

.dots>span {
  display: block;
  height: 100%;
  background: #fff;
  cursor: pointer;
  border-radius: 50%;
  opacity: 0;
}

.line-wrapper {
  position: absolute;
  width: 120px;
  background: #231A42;
  height: 8px;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 0;
}

.line {
  width: 0;
  background: #fff;
  position: absolute;
  top: 0;
  left: 0;
  height: 4px;
  bottom: 0;
  margin: auto 0;
}

.carousel-indicators> li {
  position: relative;
}

.carousel-indicators> li:last-child:after {
  content: '';
  position: absolute;
  right: -30px;
  top: 0;
}
.pki-div ul {
	font-size:12px !important;
	letter-spacing: 0 !important;
}
.pki-div li {
	font-size:12px !important;
	text-align:center;
	
}

.pki-div .tabs.gr-bg .nav > li:not(.active) > a {
	color:#19adf7;
	font-weight:100;
}

.gray-bg {
	background-color:#cacaca;
	color:white;
	text-align:center;
	width:220px;
	
}

.gray-box {
	background-color:#eeecec;
	color:#19adf7 !important;
	text-align:center;
	
	
}

.gray-box h5 {
	
	color:#19adf7 !important;
	text-align:center;
	
	
}

.b-box {
	background-color:#19adf7;
	color:#19adf7 !important;
	text-align:center;
	
	
}

.b-box h5 {
	
	color:white !important;
	text-align:center;
	
	
}
.headh5 {
	font-size:14px !important;
}



.adlist .social-links {
    text-align: center;
    margin: 50px 0px;
}
.adlist  .social-btn {
    display: inline-block;
    width: 50px;
    height: 50px;
    background:#19adf7;
    margin: 10px;
    box-shadow: 0px 5px 10px 0px #dad9d9;
    color: #f6f6f6;
    overflow: hidden;
    position: relative;
    border: 1px dotted #fff;
}
.adlist  .social-btn i {
    line-height: 50px;
    font-size: 22px;
    transition: 0.2s linear;
}
.adlist  .social-btn:hover i {
    transform: scale(1.3);
    color: #19adf7;
}
.adlist  .social-btn::before {
    content: "";
    position: absolute;
    width: 120%;
    height: 120%;
    background: #ffffff;
    transform: rotate(45deg);
    left: -110%;
    top: 90%;
}
.adlist  .social-btn:hover::before {
    animation: effect 0.6s 1;
    top: -10%;
    left: -10%;
}
.adlist  p a {
    color: #C8102E;
}

/*-- Hover Animation Effect --*/
@keyframes effect {
    0% {
        left: -120%;
        top: 100%;
    }
    50% {
        left: 10%;
        top: -30%;
    }
    100% {
        top: -10%;
        left: -10%;
    }
}


/*-- Footer Responsive CSS --*/
@media (max-width: 576px){
.adlist  .social-btn {
    width: 40px;
    height: 40px;
    margin: 5px;
}
.adlist  .social-btn i {
    line-height: 40px;
    font-size: 18px;
}
}
/*-- Footer CSS --*/
.columncheck {
  float: left;
  width: 50%;
}

/* Clear floats after the columns */
.rowcheck:after {
  content: "";
  display: table;
  clear: both;
}

 input.labelauty+label ::selection{background-color:rgba(255,255,255,0)}
 input.labelauty+label ::-moz-selection{background-color:rgba(255,255,255,0)}
 input.labelauty{display:none!important}
 input.labelauty+label{
	 display:table;
	 min-width:110px !important;
	 font-size:9px;
	 line-height: 1;
	 padding:8px;
	 background-color:#efefef;
	 cursor:pointer;
	 border-radius:3px;
	 -moz-border-radius:3px;
	 -webkit-border-radius:3px;
	 transition:background-color .25s;
	 -moz-transition:background-color .25s;
	 -webkit-transition:background-color .25s;-o-transition:background-color .25s;
	 -moz-user-select:none;-khtml-user-select:none;
	 -webkit-user-select:none;-o-user-select:none}
	 input.labelauty+label>span.labelauty-checked,input.labelauty+label>span.labelauty-unchecked{
		 display:inline-block;
		 line-height:14px;
		
		 vertical-align:bottom}
	input.labelauty+label>span.labelauty-checked-image,input.labelauty+label>span.labelauty-unchecked-image{
			 display:inline-block;
			 width:14px;
			 height:14px;
			 vertical-align:bottom;
			 background-repeat:no-repeat;
			 background-position:left center;
			 transition:background-image .5s linear;
			 -moz-transition:background-image .5s linear;
			 -webkit-transition:background-image .5s linear;-o-transition:background-image .5s linear}
	input.labelauty:checked+label>span.labelauty-unchecked,input.labelauty:checked+label>span.labelauty-unchecked-image,input.labelauty:not(:checked)+label>span.labelauty-checked,input.labelauty:not(:checked)+label>span.labelauty-checked-image{display:none}input.labelauty+label>span.labelauty-checked-image+span.labelauty-checked,input.labelauty+label>span.labelauty-unchecked-image+span.labelauty-unchecked{margin-left:7px}
	input.labelauty:not(:checked):not([disabled])+label:hover{background-color:#eaeaea;}
	input.labelauty:checked+label{background-color:#3498db;color:#fff; }
	input.labelauty:checked:not([disabled])+label:hover{background-color:#72c5fd}
	input.labelauty:checked+label>span.labelauty-checked{display:inline-block}
	input.labelauty.no-label:checked+label>span.labelauty-checked{display:block}
	input.labelauty[disabled]+label{opacity:.5}
	/*input.labelauty+label>span.labelauty-unchecked-image{background-image:url(../images/input-unchecked.png)} */
	input.labelauty+label>span.labelauty-checked-image{background-image:url(../images/input-checked.png)}
	

/* Ribbon 2*/
.arrow-ribbon {
  background: #19adf7;
  color: #FFF;
  padding: 2px 10px;
  position: absolute;
  bottom: 10px;
  right: -1px;
}
.arrow-ribbon:before {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    content: "";
    left: -12px;
    width: 0;
}
.kirin-color-2 {
	display: block;
	width: 100%;
	height: auto;
	background: #5d489d;
  }
.kirin-color-2.k-one  {
	border-radius: 3px 3px 0 0;
  }
  
  .kirin-color-2.k-two {
	opacity: .8;
  }
  
  .kirin-color-2.k-three{
	opacity: .6;
  }
  
  .kirin-color-2.k-four {
	opacity: .4;
  }
  
   .kirin-color-2.k-five {
	opacity: .2;
	border-radius: 0 0 4px 4px;
  }
  
  .kirin-color-3 {
	display: block;
	width: 100%;
	height: auto;
	background: #40c4cc;
  }
.kirin-color-3.k-one  {
	border-radius: 3px 3px 0 0;
  }
  
  .kirin-color-3.k-two {
	opacity: .8;
  }
  
  .kirin-color-3.k-three{
	opacity: .6;
  }
  
  .kirin-color-3.k-four {
	opacity: .4;
  }
  
   .kirin-color-3.k-five {
	opacity: .2;
	border-radius: 0 0 4px 4px;
  }
  
/* *************************** hadatha style ****************/
 a:hover,
a:focus{
    text-decoration: none;
    outline: none;
}
.vertical-tab{
    
    display: table;
}
.vertical-tab .nav-tabs{
    width: 25%;
    min-width: 25%;
   
    border: none;
    vertical-align: top;
    display: table-cell;
	height:400px;
}
.vertical-tab .nav-tabs li{ float: none; }
.vertical-tab .nav-tabs li a{
    color: #8d8d8e;
   background:  #fcfcfc;
   border: 1px solid #ddd;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
    padding: 10px 10px;
    margin: 0 0 10px 0;
 
    position: relative;
    z-index: 1;
    transition: all 0.3s ease 0s;
	
   box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .22);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
	text-align:center;
	 vertical-align:middle !important;
}
.vertical-tab .nav-tabs .nav-tabs1 a:hover,
.vertical-tab .nav-tabs .nav-tabs1.active a{
    color: #36bbed;
	background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}
.vertical-tab .nav-tabs .nav-tabs11 a:hover,
.vertical-tab .nav-tabs .nav-tabs11.active a{
    color: #FFF;
	 background: rgb(0,231,197);
background: linear-gradient(90deg, rgba(0,231,197,1) 0%, rgba(41,133,182,1) 50%, rgba(111,44,173,1) 100%); 
      border: 1px solid #ddd;
}
.vertical-tab .nav-tabs .nav-tabs2 a:hover,
.vertical-tab .nav-tabs  .nav-tabs2.active a{
    color: #f5a609;
  background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}

.vertical-tab .nav-tabs .nav-tabs3 a:hover,
.vertical-tab .nav-tabs  .nav-tabs3.active a{
    color: #b9168b;
  background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}
.vertical-tab .nav-tabs .nav-tabs4 a:hover,
.vertical-tab .nav-tabs  .nav-tabs4.active a{
    color: #f16620;
    background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}
.vertical-tab .nav-tabs .nav-tabs5 a:hover,
.vertical-tab .nav-tabs  .nav-tabs5.active a{
    color: #0081c7;
   background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}
.vertical-tab .nav-tabs .nav-tabs6 a:hover,
.vertical-tab .nav-tabs  .nav-tabs6.active a{
    color: #f5a609;
   background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}

.vertical-tab .nav-tabs .nav-tabs7 a:hover,
.vertical-tab .nav-tabs  .nav-tabs7.active a{
    color: #b9168b;
   background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}
.vertical-tab .nav-tabs .nav-tabs8 a:hover,
.vertical-tab .nav-tabs  .nav-tabs8.active a{
    color: #f16620;
   background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}
.vertical-tab .nav-tabs .nav-tabs9 a:hover,
.vertical-tab .nav-tabs  .nav-tabs9.active a{
    color: #0081c7;
    background: linear-gradient(135deg, rgba(240, 240, 245, 1) 0%, rgba(226, 227, 228, 1) 100%);
      border: 1px solid #ddd;
}

.vertical-tab .nav-tabs .nav-tabs1.active a:hover,
.vertical-tab .nav-tabs .nav-tabs1.active a{ color: #36bbed; }

.vertical-tab .nav-tabs .nav-tabs2.active a:hover,
.vertical-tab .nav-tabs .nav-tabs2.active a{ color: #f5a609; }

.vertical-tab .nav-tabs .nav-tabs3.active a:hover,
.vertical-tab .nav-tabs .nav-tabs3.active a{ color: #b9168b; }

.vertical-tab .nav-tabs .nav-tabs4.active a:hover,
.vertical-tab .nav-tabs .nav-tabs4.active a{ color: #f16620; }

.vertical-tab .nav-tabs .nav-tabs5.active a:hover,
.vertical-tab .nav-tabs .nav-tabs5.active a{ color: #0081c7; }

.vertical-tab .nav-tabs .nav-tabs6.active a:hover,
.vertical-tab .nav-tabs .nav-tabs6.active a{ color: #f5a609; }

.vertical-tab .nav-tabs .nav-tabs7.active a:hover,
.vertical-tab .nav-tabs .nav-tabs7.active a{ color: #b9168b; }

.vertical-tab .nav-tabs .nav-tabs8.active a:hover,
.vertical-tab .nav-tabs .nav-tabs8.active a{ color: #f16620; }

.vertical-tab .nav-tabs .nav-tabs9.active a:hover,
.vertical-tab .nav-tabs .nav-tabs9.active a{ color: #0081c7; }

.vertical-tab .nav-tabs li a:before,
.vertical-tab .nav-tabs li a:after{
    content: "";
    
    height: 10px;
    width: 10px;
    border-radius: 50%;
    transform: scale(0);
    position: absolute;
    bottom: -2px;
    left: 0;
    z-index: -1;
    transition: all 0.3s ease 0s;
	
}
.vertical-tab .nav-tabs .nav-tabs1 a:before,
.vertical-tab .nav-tabs .nav-tabs1 a:after{
	background: #36bbed;
}
.vertical-tab .nav-tabs .nav-tabs2 a:before,
.vertical-tab .nav-tabs .nav-tabs2 a:after{
	background: #f5a609;
}
.vertical-tab .nav-tabs .nav-tabs3 a:before,
.vertical-tab .nav-tabs .nav-tabs3 a:after{
	background: #b9168b;
}
.vertical-tab .nav-tabs .nav-tabs4 a:before,
.vertical-tab .nav-tabs .nav-tabs4 a:after{
	background: #f16620;
}
.vertical-tab .nav-tabs .nav-tabs5 a:before,
.vertical-tab .nav-tabs .nav-tabs5 a:after{
	background: #0081c7;
}
.vertical-tab .nav-tabs .nav-tabs6 a:before,
.vertical-tab .nav-tabs .nav-tabs6 a:after{
	background: #f5a609;
}
.vertical-tab .nav-tabs .nav-tabs7 a:before,
.vertical-tab .nav-tabs .nav-tabs7 a:after{
	background: #b9168b;
}
.vertical-tab .nav-tabs .nav-tabs8 a:before,
.vertical-tab .nav-tabs .nav-tabs8 a:after{
	background: #f16620;
}
.vertical-tab .nav-tabs .nav-tabs9 a:before,
.vertical-tab .nav-tabs .nav-tabs9 a:after{
	background: #0081c7;
}

.clr1{
	color: #36bbed;
}
.clr2{
	color: #f5a609;
}
.clr3{
	color: #b9168b;
}
.clr4{
	color: #f16620;
}
.clr5{
	color: #0081c7;
}

.vertical-tab .nav-tabs li a:after{
    width: calc(100% - 5px);
    height: 3px;
    border-radius: 0;
    transform-origin: left center;
    bottom: 1px;
    left: 5px;
}
.vertical-tab .nav-tabs li.active a:before,
.vertical-tab .nav-tabs li a:hover:before,
.vertical-tab .nav-tabs li.active a:after,
.vertical-tab .nav-tabs li a:hover:after{
    transform: scale(1);
}

.vertical-tab .tab-content{
    color: #606061;
 background-color: #faf9f9;
    font-size: 14px;
    padding: 20px;
border: 1px solid #ddd;
    box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .22);
    transition: box-shadow 0.2s ease, transform 0.2s ease;

}
/*.vertical-tab .tab-content{
    color: #606061;
background-color: #fcfcfc;
    font-size: 14px;
    padding: 20px;
border: 1px solid #ddd;
border-radius: 8px;

}*/



.vertical-tab .tab-content h3{
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 7px;
}
@media only screen and (max-width: 479px){
    .vertical-tab .nav-tabs{
        width: 100%;
        display: block;
    }
    .vertical-tab .nav-tabs li a{ padding: 15px 10px 14px; }   
    .vertical-tab .tab-content{
        font-size: 10px;
        display: block; 
    }
}


 .parent {
	 width: 100%;
	 height: auto;
	
}
 /*.parent:hover .card {
	 transform: rotate3d(1, 1, 0, 30deg);
	 box-shadow: rgba(5, 71, 17, 0.3) 30px 50px 25px -40px, rgba(5, 71, 17, 0.1) 0px 25px 30px 0px;
}

 .parent:hover .card .logo .circle2 {
	 transform: translate3d(0, 0, 60px);
}
 .parent:hover .card .logo .circle3 {
	 transform: translate3d(0, 0, 80px);
}
 .parent:hover .card .logo .circle4 {
	 transform: translate3d(0, 0, 100px);
}
 .parent:hover .card .logo .circle5 {
	 transform: translate3d(0, 0, 120px);
}
*/
 .card {
	 height: 100%;
	 border-radius: 20px;
	 background: #f7f5f5;
	 transition: all 0.5s ease-in-out;
	 transform-style: preserve-3d;
	 
}
 .pattern {
	 position: absolute;
	 inset: 0;
	 border-radius: inherit;
	 transition: all 0.5s ease-in-out;
}
 .glass {
	 transform-style: preserve-3d;
	 position: absolute;
	 inset: 8px;
	 border-radius: 25px;
	 border-top-right-radius: 100%;
	 background: linear-gradient(0deg, rgba(255, 255, 255, 0.349) 0%, rgba(255, 255, 255, 0.815) 100%);
	 backdrop-filter: blur(5px);
	 transform: translate3d(0px, 0px, 25px);
	 border-left: 1px solid white;
	 border-bottom: 1px solid white;
	 transition: all 0.5s ease-in-out;
}

 .content {
	 padding: 20px 60px 20px 30px;
	 transform: translate3d(0, 0, 26px);
}
 .content .title {
	 display: block;
	 color: #00894d;
	 font-weight: 900;
	 font-size: 20px;
}


 .logo {
	 position: absolute;
	 right: 0;
	 top: 0;
	 transform-style: preserve-3d;
}
 .logo .circle {
	 display: block;
	 position: absolute;
	 aspect-ratio: 1;
	 border-radius: 50%;
	 top: 0;
	 right: 0;
	 box-shadow: rgba(100, 100, 111, 0.2) -10px 10px 20px 0px;
	 backdrop-filter: blur(5px);
	 background: rgba(223, 228, 242, 0.2);
	 transition: all 0.5s ease-in-out;
}
 .logo .circle1 {
	 width: 170px;
	 transform: translate3d(0, 0, 20px);
	 top: 8px;
	 right: 8px;
}
 .logo .circle2 {
	 width: 140px;
	 transform: translate3d(0, 0, 40px);
	 top: 10px;
	 right: 10px;
	 backdrop-filter: blur(1px);
	 transition-delay: 0.4s;
}
 .logo .circle3 {
	 width: 110px;
	 transform: translate3d(0, 0, 60px);
	 top: 17px;
	 right: 17px;
	 transition-delay: 0.8s;
}
 .logo .circle4 {
	 width: 80px;
	 transform: translate3d(0, 0, 80px);
	 top: 23px;
	 right: 23px;
	 transition-delay: 1.2s;
}
 .logo .circle5 {
	 width: 50px;
	 transform: translate3d(0, 0, 100px);
	 top: 30px;
	 right: 30px;
	 display: grid;
	 place-content: center;
	 transition-delay: 1.6s;
}
 .logo .circle5 .svg {
	 width: 20px;
	 fill: white;
}
 
 
.tabs__buttons--container {
  display: flex;
  margin-bottom: 1rem;
}

.tabs__tab-btn {
  background: none;
  border: none;
  padding: 1rem 2rem;
  cursor: pointer;
  border-bottom: solid 3px #0081c7;
}

.tabs__tab-btn--not-selected {
  border-bottom-color: #eeeeee;
}

.tabs__tab-btn:hover {
  background-color: #eeeeee;
  transition: 0.3s;
}

.tabs__tab--hide {
  display: none;
}

.tabs__tab--show {
  display: block;
}

.tabs__tab {
  animation: tabApear 0.6s;
}

@keyframes tabApear {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.custom-table {
  width: 100%;
  border-collapse: collapse;
}

.custom-table thead {
  background-color: #2985b6;
  color: white;
}

.custom-table th,
.custom-table td {
  padding: 10px;
  border: 1px solid #ddd;
}

.kirin-wrapper-H {
	
	background: #fcfcfc;
	padding: 4px;
	border-radius: 8px;
	display: grid;
	grid-template-columns: 14px 1fr;
	grid-gap: 4px;
  }
  
 .kirin-sidebar-H {
	position: relative;
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	border: 1px solid #ddd;
	padding: 3px;
	border-radius: 5px;
  }

 .kirin-post-H {
	
	font-size: 14px;
	padding: 20px;
	border: 1px solid #ddd;
	border-radius: 8px;
  }
  
  
  
#tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}

.tab {
  cursor: pointer;
  padding: 10px 20px;
  background-color: transparent;
  color: #2985b6;
  margin: 4px;
  border: 1px solid #2985b6;
  border-radius: 5px;
  transition: opacity 0.3s ease;
  text-align :center;
}

.tab:hover,
.tab.active {
  opacity: 0.8;
  background-color: #2985b6;
  color: white;
}



.tabContent {
  width: 100%;
  max-width: 600px;

  padding: 20px;

  
}






.projcard-container {
    margin: 40px 0;
}


.projcard-container,
.projcard-container * {
    box-sizing: border-box;
}

.projcard-container {
    margin-left: auto;
    margin-right: auto;
    
}

.projcard {
    position: relative;
    width: 100%;
    height: 300px;
    margin-bottom: 40px;
    border-radius: 10px;
    background-color: #fff;
    font-size: 18px;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .66);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.projcard:hover {
    box-shadow: 0 34px 32px -33px rgba(0, 0, 0, .18);
    transform: translate(0px, -3px);
}

.projcard::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(-70deg, #424242, transparent 50%);
    opacity: 0.07;
}

.projcard:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #424242, transparent 50%);
}

.projcard-innerbox {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.projcard-img {
    position: absolute;
    height: 300px;
    width: 400px;
    top: 0;
    left: 0;
    transition: transform 0.2s ease;
}

.projcard:nth-child(2n) .projcard-img {
    left: initial;
    right: 0;
}

.projcard:hover .projcard-img {
    transform: scale(1.05) rotate(1deg);
}

.projcard:hover .projcard-bar {
    width: 70px;
}

.projcard-textbox {
    position: absolute;
    top: 7%;
    bottom: 7%;
    left: 430px;
    width: calc(100% - 470px);
    font-size: 17px;
}

.projcard:nth-child(2n) .projcard-textbox {
    left: initial;
    right: 430px;
}

.projcard-textbox::before,
.projcard-textbox::after {
    content: "";
    position: absolute;
    display: block;
    background: #ff0000bb;
    background: #fff;
    top: -20%;
    left: -55px;
    height: 140%;
    width: 60px;
    transform: rotate(8deg);
}

.projcard:nth-child(2n) .projcard-textbox::before {
    display: none;
}

.projcard-textbox::after {
    display: none;
    left: initial;
    right: -55px;
}

.projcard:nth-child(2n) .projcard-textbox::after {
    display: block;
}

.projcard-textbox * {
    position: relative;
}

.projcard-title {
    font-family: 'Voces', 'Open Sans', arial, sans-serif;
    font-size: 24px;
}

.projcard-subtitle {
    font-family: 'Voces', 'Open Sans', arial, sans-serif;
    color: #888;
}

.projcard-bar {
    left: -2px;
    width: 50px;
    height: 5px;
    margin: 10px 0;
    border-radius: 5px;
    background-color: #424242;
    transition: width 0.2s ease;
}

.projcard-blue .projcard-bar {
    background-color: #0088FF;
}

.projcard-blue::before {
    background-image: linear-gradient(-70deg, #0088FF, transparent 50%);
}

.projcard-blue:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #0088FF, transparent 50%);
}

.projcard-red .projcard-bar {
    background-color: #D62F1F;
}

.projcard-red::before {
    background-image: linear-gradient(-70deg, #D62F1F, transparent 50%);
}

.projcard-red:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #D62F1F, transparent 50%);
}

.projcard-green .projcard-bar {
    background-color: #40BD00;
}

.projcard-green::before {
    background-image: linear-gradient(-70deg, #40BD00, transparent 50%);
}

.projcard-green:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #40BD00, transparent 50%);
}

.projcard-yellow .projcard-bar {
    background-color: #F5AF41;
}

.projcard-yellow::before {
    background-image: linear-gradient(-70deg, #F5AF41, transparent 50%);
}

.projcard-yellow:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #F5AF41, transparent 50%);
}

.projcard-orange .projcard-bar {
    background-color: #FF5722;
}

.projcard-orange::before {
    background-image: linear-gradient(-70deg, #FF5722, transparent 50%);
}

.projcard-orange:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #FF5722, transparent 50%);
}

.projcard-brown .projcard-bar {
    background-color: #C49863;
}

.projcard-brown::before {
    background-image: linear-gradient(-70deg, #C49863, transparent 50%);
}

.projcard-brown:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #C49863, transparent 50%);
}

.projcard-grey .projcard-bar {
    background-color: #424242;
}

.projcard-grey::before {
    background-image: linear-gradient(-70deg, #424242, transparent 50%);
}

.projcard-grey:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, #424242, transparent 50%);
}

.projcard-customcolor .projcard-bar {
    background-color: var(--projcard-color);
}

.projcard-customcolor::before {
    background-image: linear-gradient(-70deg, var(--projcard-color), transparent 50%);
}

.projcard-customcolor:nth-child(2n)::before {
    background-image: linear-gradient(-250deg, var(--projcard-color), transparent 50%);
}

.projcard-description {
    z-index: 10;
    font-size: 15px;
    color: #424242;
    height: 125px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.projcard-tagbox button {
    bottom: 3%;
    font-size: 25px;
    cursor: default;
    user-select: none;
    padding: 10px 20px;
    border-radius: 25px;
    text-decoration: none;
    border: none;
    outline: none;
   
}

.projcard-tagbox a{
    text-decoration: none;
    color: #ddd;
}

.results-summary-container {
  font-family: "Hanken Grotesk", sans-serif;
  display: flex;
  width: 320px;
  border-radius: 30px;
 
  backface-visibility: hidden;
}

.heading-primary,
.heading-secondary,
.heading-tertiary {
  color: #ffffff;
  text-transform: capitalize;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.heading-primary {
  font-size: 36px;
  font-weight: 600;

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transform: scale(1.6);
}

.heading-secondary {
  font-size: 24px;
  font-weight: 600;
  margin-top: 20px;
  letter-spacing: 2px;
}

.heading-tertiary {
  font-size: 20px;
  font-weight: 500;
  color: hsl(221, 100%, 96%);
}

.paragraph {
  font-size: 17px;
  line-height: 1.4;
  color: hsl(221, 100%, 96%);
}

.paragraph-text-box {
  width: 100%;
}

.text-center {
  text-align: center;
}

.margin-1 {
  margin-bottom: 10px;
}

.results-summary-container__result {
  width: 100%;
  display: flex;
  flex-direction: column;
  text-align: center;
  align-items: center;
  justify-content: center;
  padding: 20px;
  border-radius: 30px;

  animation: gradient 9s infinite alternate linear;
 
}

.result {
  margin-top: -8px;
  font-size: 16px;
  font-weight: 400;
  color: hsl(241, 100%, 89%);
}
}


@keyframes gradient {
  0% {
    background-position: 0% 50%;

  }

  50% {
    background-position: 100% 50%;
  
  }

  100% {
    background-position: 0% 50%;
   
  }
}

.confetti {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 300px;
  height: 60%;
  overflow: hidden;
  z-index: 1000;
}

.confetti-piece {
  position: absolute;
  width: 10px;
  height: 20px;
 
  top: 0;
  opacity: 0;
  animation: makeItRain 3000ms infinite linear;
}

.confetti-piece:nth-child(1) {
  left: 7%;
  transform: rotate(-10deg);
  animation-delay: 182ms;
  animation-duration: 2000ms;
}

.confetti-piece:nth-child(2) {
  left: 14%;
  transform: rotate(20deg);
  animation-delay: 161ms;
  animation-duration: 2076ms;
}

.confetti-piece:nth-child(3) {
  left: 21%;
  transform: rotate(-51deg);
  animation-delay: 481ms;
  animation-duration: 2103ms;
}

.confetti-piece:nth-child(4) {
  left: 28%;
  transform: rotate(61deg);
  animation-delay: 334ms;
  animation-duration: 1008ms;
}

.confetti-piece:nth-child(5) {
  left: 35%;
  transform: rotate(-52deg);
  animation-delay: 302ms;
  animation-duration: 1776ms;
}

.confetti-piece:nth-child(6) {
  left: 42%;
  transform: rotate(38deg);
  animation-delay: 180ms;
  animation-duration: 1168ms;
}

.confetti-piece:nth-child(7) {
  left: 49%;
  transform: rotate(11deg);
  animation-delay: 395ms;
  animation-duration: 1200ms;
}

.confetti-piece:nth-child(8) {
  left: 56%;
  transform: rotate(49deg);
  animation-delay: 14ms;
  animation-duration: 1887ms;
}

.confetti-piece:nth-child(9) {
  left: 63%;
  transform: rotate(-72deg);
  animation-delay: 149ms;
  animation-duration: 1805ms;
}

.confetti-piece:nth-child(10) {
  left: 70%;
  transform: rotate(10deg);
  animation-delay: 351ms;
  animation-duration: 2059ms;
}

.confetti-piece:nth-child(11) {
  left: 77%;
  transform: rotate(4deg);
  animation-delay: 307ms;
  animation-duration: 1132ms;
}

.confetti-piece:nth-child(12) {
  left: 84%;
  transform: rotate(42deg);
  animation-delay: 464ms;
  animation-duration: 1776ms;
}

.confetti-piece:nth-child(13) {
  left: 91%;
  transform: rotate(-72deg);
  animation-delay: 429ms;
  animation-duration: 1818ms;
}

.confetti-piece:nth-child(14) {
  left: 94%;
  transform: rotate(-72deg);
  animation-delay: 429ms;
  animation-duration: 818ms;
}

.confetti-piece:nth-child(15) {
  left: 96%;
  transform: rotate(-72deg);
  animation-delay: 429ms;
  animation-duration: 2818ms;
}

.confetti-piece:nth-child(16) {
  left: 98%;
  transform: rotate(-72deg);
  animation-delay: 429ms;
  animation-duration: 2818ms;
}

.confetti-piece:nth-child(17) {
  left: 50%;
  transform: rotate(-72deg);
  animation-delay: 429ms;
  animation-duration: 2818ms;
}

.confetti-piece:nth-child(18) {
  left: 60%;
  transform: rotate(-72deg);
  animation-delay: 429ms;
  animation-duration: 1818ms;
}

.confetti-piece:nth-child(odd) {
  background-color: hsl(0, 100%, 67%);
}

.confetti-piece:nth-child(even) {
  z-index: 1;
}

.confetti-piece:nth-child(4n) {
  width: 6px;
  height: 14px;
  animation-duration: 4000ms;
  background-color: #c33764;
}

.confetti-piece:nth-child(5n) {
  width: 3px;
  height: 10px;
  animation-duration: 4000ms;

}

.confetti-piece:nth-child(3n) {
  width: 4px;
  height: 12px;
  animation-duration: 2500ms;
  animation-delay: 3000ms;

}

.confetti-piece:nth-child(3n-7) {
  background-color: hsl(166, 100%, 37%);
}

@keyframes makeItRain {
  from {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  to {
    transform: translateY(250px);
  }
}

.headerHadatha {
	height:10px;
	width:100% !important;
	 background: rgb(0,231,197);
background: linear-gradient(90deg, rgba(0,231,197,1) 0%, rgba(41,133,182,1) 50%, rgba(111,44,173,1) 100%); 
}

.containerT {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 15vh;
  font-size: clamp(2rem, 2.8vw, 5rem);
  font-weight: bold;
 font-family: 'Noto Sans Kufi Arabic', sans-serif !important;
  
}
.gradient-text {
    background-color: #f3ec78;
   background-image: linear-gradient(90deg, rgba(0,231,197,1) 0%, rgba(41,133,182,1) 50%, rgba(111,44,173,1) 100%); 
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;
}
.typewriter {
	width: 21.5ch;
	white-space: nowrap;
	overflow: hidden;

	animation: cursor 1s step-start infinite, 
    text 5s steps(18) alternate infinite;
}

@keyframes cursor {
	0%, 100% { 
    border-color: #212121; 
  }
}

@keyframes text {
	0% { 
    width: 0; 
  }
	100% { 
    width: 21.5ch; 
  }
}


.input-group {
  padding: 12px;
  display: flex;
  align-items: center;
}
.kirin-post2{
	text-align: justify;
font-size: 14px;
padding: 20px;

}
 .kirin-wrapper-nn {
	border: 1px solid #ddd;
	background: #fcfcfc;
	padding: 8px;
	border-radius: 8px;
	display: grid;
	grid-template-columns: 16px 1fr;
	grid-gap: 4px;
  }