@charset "utf-8";
/*======================================

 [ -Main Stylesheet-
  Theme: Gmag
  Version: 1.0
  Last change: 23/12/2021 ]
     ++ Fonts ++
	++ loader ++
	++ Typography ++
	++ General ++
	++ navigation ++
	++ footer ++
	++ button ++
	++ hero ++
	++ section ++
	++ post ++
	++ widget ++
	++ shop ++
	++ forms ++
	++ responsive ++
*/
/*-------------Import fonts ---------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;700&family=Poppins:wght@200;300;400;500;600;700;800;900&display=swap');
/*-------------General Style---------------------------------------*/
html{
    overflow-x:hidden !important;
    height:100%;
}
body{
    margin: 0;
    padding: 0;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #292929;
    background:#fff;
    min-height: 100vh;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed;
    text-align: center;
}
@-o-viewport {width: device-width;}
@-ms-viewport {width: device-width;}
@viewport {width: device-width;}
/*--------------Typography--------------------------------------*/
p {
    text-align:left;
    font-size:15px;
    line-height:24px;
    padding-bottom:10px;
    font-weight: 500;
    color: #5e646a;
}
blockquote {
    float:left;
    padding: 20px 20px 10px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 15px solid #eee;
    background: #f9f9f9;
    position: relative;
}
blockquote p {
    font-family: 'Playfair Display', cursive;
    color:#494949;
}
blockquote:before {
    font-family: Font Awesome\ 5 Pro;
    content: "\f10e";
    position: absolute;
    color: #ccc;
    bottom: 3px;
    font-size: 43px;
    right: 6px;
    opacity: 0.4;
}
/* ---------Content Styles--------------------------------------*/
#main{
    height:100%;
    width:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:2;
    opacity:1;
    background:#fff;
}
#wrapper{
    float:left;
    width:100%;
    position:relative;
    padding-top:140px;
}
.fl-wrap {
    float: left;
    width: 100%;
    position: relative;
}
.container{
    max-width: 1300px;
    width:92%;
    margin:0 auto;
    position: relative;
    z-index:2;
}
.content {
    width:100%;
    position:relative;
    z-index:13;
    background:#fff;
    float:left;
}
.full-height {
    height:100%;
}
.bg{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-size: cover;
    background-attachment: scroll  ;
    background-position: center  ;
    background-repeat:repeat;
    background-origin: content-box;
}
.respimg , .single-slider img , .single-slider-wrap img  {
    width:100%;
    height:auto;
}
.overlay {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:0.3;
    z-index:2;
}
.no-padding {
    padding:0 !important;
}
.bg-wrap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    overflow: hidden;
}
.gray-bg {
    background: #f9f9f9;
}
.content-banner-wrap {
    margin: 0 auto;
    max-width: 860px;
}
/* ---------tabs--------------------------------------*/
.tab-content   {
    width: 100%;
    display: none;
    float:left;
}
.tab{
    width: 100%;
    float:left;
}
.first-tab {
    display: block;
}
/*------ Header  ------------------------------------------------*/
.main-header {
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:100;
    -webkit-transform: translate3d(0,0,0);
}
.top-bar {
    background: #292929;
    height: 70px;
    overflow: hidden;
    transition: all .2s ease-in-out;
}
.top-bar.scroll-sticky {
    height: 0;
}
.topbar-social {
    float:right;
    position:relative;
    height: 32px;
    top:18px;
}
.topbar-social li {
    float:left;
    margin-left: 6px;
}
.topbar-social li a  {
    font-size:12px;
    width: 32px;
    height: 32px;
    line-height: 32px;
    float: left;
    color: #fff;
    border-radius: 2px;
}
.topbar-social a  {
    transition: all 100ms linear;
}
.topbar-social a:hover   {
    color:#fff;
}
.date-holder {
    float: left;
    height: 70px;
    color: #fff;
    position: relative;
    padding-left: 50px;
    width: 90px;
    padding-top: 18px;
}
.date-holder:before {
    content: '';
    position: absolute;
    right: 2px;
    width: 1px;
    height: 40px;
    background: rgba(255,255,255,0.2);
    top: 50%;
    margin: -20px 0 0 0;
}
.date_num {
    position: absolute;
    width: 50px;
    height: 70px;
    line-height: 70px;
    font-size: 34px;
    left: 0;
    top: 0;
    font-weight: 500;
}
.date_mounth , .date_year {
    text-align: left;
    float: left;
    width: 100%;
    font-size: 11px;
    font-weight: 500;
}
.header_news-ticker-wrap {
    float: left;
    width: 650px;
    position: relative;
    padding:0 40px 0 130px;
    height: 70px;
    overflow: hidden;
}
.header_news-ticker-wrap:before {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    background: #222;
    left: 130px;
    right: 50px;
}
.header_news-ticker-wrap li {
    float: left;
    width: 100%;
    height: 70px;
    line-height: 70px;
    text-align: left;
    padding: 0 15px 0 30px;
}
.header_news-ticker-wrap li a {
    color: #fff;
}
.hnt_title {
    position: absolute;
    left: 10px;
    top: 20px;
    width: 100px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    font-weight: 600;
    font-size: 11px;
}
.n_contr-wrap{
    position: absolute;
    right: 0;
    width: 30px;
    top: 50%;
    height: 20px;
    line-height: 20px;
    cursor: pointer;
    margin-top: -10px;
}
.n_contr {
    float: left;
    cursor: pointer;
    font-size: 18px;
}
.p_btn {
    margin-right: 14px;
}
.header-inner {
    background: #ff0000;
    height: 70px;
    border-bottom: 1px solid #eee;
    box-shadow: 0 15px 30px 0 #0000000f;
}
.logo-holder {
    float:left;
    position:relative;
    z-index:21;
    height: 34px;
    top:8px;
}
.logo-holder img {
    width: auto;
    height:180%;
}
.show-cart , .srf_btn , .search_btn {
    float:right;
    font-size:16px;
    color:#666;
    cursor:pointer;
    position:relative;
    width:70px;
    height:70px;
    line-height:70px;
    margin-left:24px;
    border-left:1px solid #eee;
    text-align:center;
    box-sizing:border-box;
    font-weight: 600;
}
.search_btn {
    border-right:1px solid #eee;
}
.show-cart i, .srf_btn i  , .search_btn i{
    position: relative;
    z-index: 2;
}
.htact:after {
    content: '';
    position: absolute;
    left: -1px;
    right: -1px;
    bottom: 0;
    top: 100%;
    background: #292929;
    z-index: 1;
    transition: all .3s ease-in-out;
}
.sc_btn.scwllink:after  , .search_btn.scwllink2:after {
    top:0;
}
.srf_btn , .search_btn  {
    margin-left:0;
    font-size:14px;
}
.header-tooltip {
    position:absolute;
    top:100%;
    right:0;
    width:140px;
    height:50px;
    line-height:50px;
    background:#292929;
    font-weight:600;
    color:#fff;
    transition: all .3s ease-in-out;
    font-size:10px;
    text-transform: uppercase;
    opacity:0;
    visibility:hidden;
    border-top:none;
}
.htact:hover .header-tooltip {
    opacity:1;
    visibility:visible;
}
.show-cart_count {
    position:absolute;
    bottom:16px;
    width:16px;
    height:16px;
    line-height:16px;
    border-radius:100%;
    color:#fff;
    left:16px;
    z-index:10;
    font-size:10px;
    background: #eee
}
.show-cart i , .show-cart_count  , .header-cart_wrap  {
    transition: all .3s ease-in-out;
}
.show-cart:before {
    content: "";
    display: block;
    width: 1px;
    height: 16.8px;
    position: absolute;
    top: 50%;
    left: -20px;
    background:rgba(255,255,255,0.51);
    margin-top: -8.4px;
    transform: rotate(45deg);
}
.sc_btn.scwllink i:before    , .search_btn.scwllink2 i:before {
    content: "\f00d";
    color: #fff;
}
.sc_btn.scwllink .show-cart_count{
    transform: scale(0);
}
.header-btn {
    float: right;
    position: relative;
    color: #292929;
    font-size: 11px;
    font-weight: 700;
    width: 180px;
    height: 70px;
    line-height: 70px;
    cursor: pointer;
    transition: all .2s ease-in-out;
}
.header-btn i {
    margin-left: 15px;
    font-size: 16px;
    color: #fff;
}
.progress-bar-wrap {
    position:fixed;
    top:0;
    left:0;
    right:0;
    height:2px;
    z-index:123;
}
.progress-bar {
    position:relative;
    height:100%;
    width:0%;
    z-index:2;
    top:0;
    transition: all .2s ease-in-out;
}
.header-cart_wrap_container  .ps__thumb-y {
    border-radius: 4px;
}
.header-search-wrap {
    position: absolute;
    top: 100%;
    right: 0;
    width: 350px;
    padding: 20px 15px;
    background: #292929;
    border-top: none;
    box-shadow: 0 13px 20px rgb(58 87 135 / 5%);
    transition: all .3s ease-in-out;
    opacity: 0;
    visibility: hidden;
    margin-top: 10px;
}
.vis-search {
    opacity: 1;
    visibility: visible;
    margin-top: 0;
}
.header-search-wrap .widget-inner {
    margin:0;
}
.search {
    border: none;
    float: left;
    background: rgba(255,255,255,0.1);
    border-radius: 2px;
    position: relative;
    outline: none;
    padding: 0px 0px 0px 20px;
    width: 100%;
    height: 50px;
    color: #fff;
    font-family: 'Poppins', sans-serif;
    -webkit-appearance: none;
}
.search::-webkit-input-placeholder  {
    color: #fff;
    font-weight: 500;
    font-size: 12px;
    position: relative;
    font-family: 'Poppins', sans-serif;
}
.search-submit {
    border: none;
    outline: none;
    cursor: pointer;
    background: none;
    position: absolute;
    top: 20px;
    right: 15px;
    width: 70px;
    height: 50px;
    font-size: 11px;
    color: #fff;
    border-radius: 0 2px 2px 0;
}
.header-cart_wrap {
    position:absolute;
    top:70px;
    right:119px;
    padding:25px 20px 15px;
    width: 391px;
    background:#fff;
    opacity: 0;
    visibility: visible;
    display: none;
    border:1px solid #eee;
    border-top:none;
    box-shadow: 0 5px 15px rgb(0 0 0 / 5%);
}
.vis-cart {
    opacity:1;
    visibility:visible;
    right:139px;
}
.header-cart_title {
    font-size:14px;
    font-weight:600;
    color:#292929;
    padding: 0 0 20px 0;
    text-align:left;
    margin-bottom:10px;
    border-bottom:1px solid #eee;
}
.header-cart_wrap_container {
    max-height:290px;
    float:left;
    width:100%;
    overflow:auto;
    padding-right:10px;
}
.header-cart_wrap_total {
    padding:18px 20px 12px;
    text-align:left;
    margin-top:10px;
    background: #f7f7f7;
}
.header-cart_wrap_total_item {
    color:#292929;
    font-size:13px;
    font-weight: 600;
}
.header-cart_wrap_total_item span , .header-cart_title span {
    float: right;
}
.header-cart_wrap_total_item span  {
    font-size: 13px;
    position: relative;
    top: -2px;
}
.header-cart_title span {
    font-size:12px;
    font-weight:600;
    position:relative;
    top:2px;
    color:#222;
}
.box-widget-content .widget-posts li {
    position:relative;
    border-bottom:1px  solid #eee;
    padding: 10px 0;
    margin-bottom: 10px;
}
.box-widget-content .widget-posts li:last-child {
    margin-bottom:0;
}
.box-widget-content .widget-posts-img , .cart-details_header  .widget-posts-img  {
    float:left;
    width:30%;
}
.box-widget-content .widget-posts-img img, .cart-details_header  .widget-posts-img img {
    border-radius: 2px;
}
.box-widget-content .widget-posts-img:hover {
    opacity: 0.6;
}
.box-widget-content  .widget-posts-descr  {
    float:left;
    width:70%;
    padding:0 30px 0 20px;
    text-align:left;
    position:relative;
}
.box-widget-content  .widget-posts-descr a   {
    color:#444;
    font-weight:700;
    font-size:13px;
}
.widget-posts-descr_calc {
    width:100%;
    font-weight:500;
    color: #828282;
    padding-top:3px;
    font-size:11px;
}
.widget-posts-descr_calc  span{
    padding:0 4px;
}
.clear-cart_button {
    cursor:pointer;
    border-radius:100%;
    text-align:center;
    position:absolute;
    right:20px;
    top:30px;
    font-weight: bold;
}
.header-cart_wrap_footer {
    padding-top:15px;
}
.header-cart_wrap_footer:before {
    content: "";
    display: block;
    width: 1px;
    height: 14px;
    position: absolute;
    top: 34px;
    left:50%;
    background: #ccc;
    margin-top: -7px;
}
.header-cart_wrap_footer a{
    width:45%;
    float:left;
    padding:14px 0;
    color:#fff;
    background:#292929;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 10px;
    border-radius: 4px;
    transition: all .2s ease-in-out;
}
.header-cart_wrap_footer a:last-child {
    float:right;
}
.header-cart_wrap_footer a:hover {
    color: #fff
}
/*------ navigation  ------------------------------------------------*/
.nav-holder {
    float:right;
    position:relative;
    opacity:1;
    top:17px;
    visibility:visible;
    z-index:20;
}
.nav-holder nav {
    position:relative;
    float: right;
}
.nav-holder nav li{
    float:left;
    position:relative;
    margin-right:6px;
    height:50px;
}
.nav-holder nav li ul {
    margin: 30px 0 0 0;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    min-width:150px;
    top: 53px;
    left: 0;
    z-index: 1;
    padding:10px 0;
    background:#292929;
    transition: all .2s ease-in-out;
}
.nav-holder nav li:hover > ul {
    opacity: 1;
    visibility: visible;
    margin: 0;
}
.nav-holder nav li ul li ul {
    top: -10px  ;
    left: 100%;
    margin-left:25px;
    margin-top:0;
    max-width:150px;
}
.nav-holder nav li ul li:hover  > ul  {
    opacity: 1;
    visibility: visible;
    margin-right:0px;
}
.nav-holder nav li ul li {
    width:100%;
    float:left;
    height:auto;
    position:relative;
}
.nav-holder nav li a {
    float: left;
    padding: 5px 11px;
    color: #222;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 25px;
    transition: all 100ms linear;
    position:relative;
}
.nav-holder nav li a.act-link , .nav-holder nav li a:hover   {
    color: #ffffff;
}
/* Active marker: a bar under the current top-level item, so "current" is
   distinguishable from "hovered" (both turn the text white). */
.nav-holder nav > ul > li > a.act-link:after {
    content: "";
    position: absolute;
    left: 11px;
    right: 11px;
    bottom: 0;
    height: 2px;
    background: #bcd532;
}
.nav-holder nav li a i ,
.nav-holder nav li a.act-link i {
    color: #bcd532 !important;
}
/* Dropdown items sit on #292929: highlight current and hovered in brand green. */
.nav-holder nav li ul a:hover ,
.nav-holder nav li ul a.act-link ,
.menusb a.act-link {
    color: #bcd532;
}
.nav-holder nav li ul a i {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    padding-left: 0;
}
.nav-holder nav li ul a:hover i {
    transform: translateY(-50%);
}
.nav-holder nav li ul {
    min-width: 200px;
}
/* The last item (Shop) sits against the right edge: anchor its dropdown to the
   right and open its flyouts leftwards so they are not cut off. */
.nav-holder nav > ul > li:last-child > ul {
    left: auto;
    right: 0;
}
.nav-holder nav > ul > li:last-child > ul li ul {
    left: auto;
    right: 100%;
    margin-left: 0;
}
/* Button/filter-chip used by the classifieds pages; the theme never defined it,
   so those links rendered as bare inline text on a red highlight. */
.btn-a {
    display: inline-block;
    padding: 9px 20px;
    margin: 0 6px 8px 0;
    background: #292929;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    text-transform: uppercase;
    border-radius: 2px;
    transition: background 150ms linear;
}
.btn-a.color-bg ,
.btn-a:hover {
    background: #e93314;
    color: #fff;
}
button.btn-a {
    border: 0;
    cursor: pointer;
}
/* The e-commerce forms (notice, checkout, basket, mailing list) use Bootstrap
   form markup, but the front theme does not load Bootstrap's CSS. */
.content form {
    text-align: left;
}
.content form label {
    display: block;
    text-align: left;
    font-size: 13px;
    color: #333;
    margin-bottom: 4px;
}
.content form .form-control ,
.content form .form-select {
    display: block;
    float: none;
    width: 100%;
    height: auto;
    padding: 10px 14px;
    margin-top: 4px;
    border: 1px solid #e5e5e5;
    border-radius: 2px;
    background: #f9f9f9;
    color: #222;
    font-size: 13px;
    line-height: 1.5;
}
.content form .form-control:focus ,
.content form .form-select:focus {
    outline: none;
    border-color: #e93314;
    background: #fff;
}
.content form textarea.form-control {
    min-height: 160px;
    resize: vertical;
}
.content form input[type=checkbox] ,
.content form input[type=radio] {
    display: inline-block;
    width: auto;
    height: auto;
    margin: 0 6px 0 0;
    vertical-align: middle;
}
.content form small {
    display: inline-block;
    color: #777;
}
.content .mb-2 { margin-bottom: 8px; }
.content .mb-3 { margin-bottom: 16px; }
.content .box-widget-content ol {
    text-align: left;
    list-style: decimal;
}
.nav-holder nav li a i {
    padding-left:10px;
    transition: all 200ms linear;
}
.nav-holder nav li a:hover i {
    transform: rotateX(180deg);
}
.nav-holder nav li ul a {
    float:left;
    width:100%;
    text-align:left;
    padding:2px 15px;
    font-size: 12px;
    color: #fff;
}
.nav-holder nav li ul a:before , .nav-holder nav li ul a:after , .nav-button-wrap {
    display:none;
}
/* ------Hero content------------------------------------------------------------ */
.hero-slider-wrap   {
    overflow: hidden;
    height: 650px;
}
.hero-carousel-wrap {
    background: #111;
    padding: 0 10px 10px;
    overflow: hidden;
    height: 550px;
}
.hero-carousel-item {
    height: 100%;
    padding: 10px 0 0;
}
.hero-carousel-item.hero-carousel-item_half {
    height: 50%;
}
.hero-carousel-item .grid-post-item , .hero-carousel-item .grid-post-item .grid-post-media.gpm_sing  {
    padding: 0;
    height: 100%!important;
    margin: 0;
}
.hero-carousel-controls {
    position: absolute;
    top: 50%;
    right: 10px;
    background:rgba(0,0,0,0.6);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    z-index: 10;
    width: 50px;
    padding: 30px 0 6px;
    border-radius: 6px 0 0 6px;
    transform: translateY(-50%);
}
.hero-carousel-pag {
    display: inline-block;
    width: 10px;
    margin-bottom: 20px;
}
.hc-cont {
    float: left;
    width: 36px;
    height: 36px;
    line-height: 36px;
    margin:  0 0 1px 7px;
    cursor: pointer;
    color: #fff;
}
.hc-cont-next  {
    border-radius: 4px 4px 0 0;
}
.hc-cont-prev  {
    border-radius: 0 0 4px 4px ;
}
.hero-hrid {
    padding: 30px 0 10px;
}
.hero-hrid .grid-post-item .grid-post-media.gpm_sing  {
    padding: 0;
    height: 450px;
    margin: 0;
}
.hero-hrid .grid-post-item .grid-post-media.gpm_sing.bold_gpi_half {
    height: 215px;
}
.hero-hrid .grid-post-item .grid-post-media.gpm_sing.bold_gpi_half .author-link {
    left: 20px;
    top: 20px;
}
.hero-hrid .grid-post-item .grid-post-media.gpm_sing.bold_gpi_half .grid-post-media_title {
    padding: 10px 20px 15px;
}
.hero-hrid .grid-post-item .grid-post-media.gpm_sing.bold_gpi_half .grid-post-media_title h4 {
    font-size: 13px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}
.hero-slider_controls-wrap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
}
.slider-progress-bar {
    position:absolute;
    top:50px;
    right:30px;
    z-index:120;
}
.progress-indicator svg {
    position:relative;
    top:-5px;
    height: 50px;
    transform: rotate(-90deg);
    width: 50px;
    z-index: 20;
}
.progress-bar__background {
    fill: none;
    stroke:  rgba(255,255,255,0.4);
    stroke-width: 1.0;
}
.progress-bar__progress {
    fill: none;
    stroke: #fff;
    stroke-dasharray: 100 100;
    stroke-dashoffset: 100;
    stroke-linecap: round;
    stroke-width: 1.8;
}
.circ {transform:  scale(1.0) rotate(-90deg); transition: transform .3s ease; z-index:3; position:relative;}
.circ circle {stroke-dasharray: 440px;}
.circ1 {stroke-dashoffset: 440px;  }
.slider-progress-bar.act-slider .circ1 {
    stroke-dashoffset: 220px; transition: linear 6s stroke-dashoffset;
}
.hero-slider-container .swiper-container {
    width: 100%;
    height: 100%;
}
.hero-slider_controls-list {
    position: absolute;
    right: 0;
    height: 110px;
    bottom: 20px;
    left: 0;
    box-sizing: border-box;
}
.hero-slider_controls-list .swiper-slide-thumb-active .hsc-list_item:before  {
    width: 100%;
}
.hero-slider_controls-list .swiper-slide-thumb-active .hsc-list_item-media:before , .hero-slider_controls-list .swiper-slide-thumb-active .hsc-list_item-media:after {
    opacity: 1;
}
.hsc-list_item {
    padding:0 0 0 120px;
    height: 100px;
    cursor: pointer;
    border-top: 1px solid rgba(255,255,255,0.3);
}
.hsc-list_item:before {
    content: '';
    position: absolute;
    left: 0;
    width: 0;
    height: 1px;
    top: -1px;
    transition: all .3s ease-in-out;
}
.hsc-list_item:after {
    content: '';
    position: absolute;
    width: 50px;
    left: 120px;
    height: 1px;
    bottom: 10px;
}
.hsc-list_item-media {
    position: absolute;
    left: 0;
    width: 100px;
    height: 70px;
    top: 20px;
    overflow: hidden;
    border-radius: 4px;
}
.hsc-list_item-media:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:rgba(0,0,0,0.4);
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
    opacity: 0;
    z-index: 5;
    transition: all .3s ease-in-out;
}
.hsc-list_item-media:after {
    font-family: Font Awesome\ 5 Pro;
    content: "\f106";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 10px;
    height: 10px;
    line-height: 10px;
    margin: -5px 0 0 -5px;
    z-index: 6;
    font-weight: 900;
    color: #fff;
    opacity: 0;
    font-size: 18px;
    transition: all 200ms linear;
}
.hsc-list_item-content {
    padding-top: 28px;
}
.hsc-list_item-content h4 {
    color: rgba(255,255,255,0.7);
    display: block;
    text-align: left;
    font-weight: 600;
    font-size: 12px;
    float: left;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    margin-bottom: 8px;
}
.hsc-list_item-content .post-date {
    float: left;
    color: rgba(255,255,255,0.7);
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 700;
}
.hero-slider_controls-list .swiper-slide-thumb-active .hsc-list_item-content h4  , .hero-slider_controls-list .swiper-slide-thumb-active .hsc-list_item-content .post-date {
    color: #fff;
}
.hero-item {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 20;
    bottom: 0;
    padding-bottom: 240px;
}
.hero-item:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.99) 100%);
    z-index: -1;
    opacity: 0.8
}
.hero-item h2 {
    font-size: 35px;
    text-align: left;
    font-weight: 600;
    color: #fff;
    position: relative;
    max-width: 700px;
    line-height: 42px;
    padding-bottom: 20px;
}
.hero-item h2 a , .hero-item h4 , .hero-item .author-link a , .hero-item .post-date {
    color:#fff;
}
.hero-item h4 {
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    font-family: 'Playfair Display', cursive;
    max-width: 700px;
    line-height: 22px;
    padding-bottom: 15px;
}
.hero-item .post-category-marker {
    float: left;
    margin: 0 0 10px 0;
}
.hero-item .post-date {
    float: left;
    margin:10px 0 0 20px;
    font-size: 10px;
    text-transform: uppercase;
}
.hero-item .post-date i , .hsc-list_item-content .post-date i {
    margin-right: 10px;
}
.multi-pag {
    left: 0;
    bottom: 160px;
    width: auto;
    position: absolute;
}
.fs-slider_btn {
    position: absolute;
    top: 50%;
    width: 36px;
    height: 36px;
    line-height: 36px;
    margin-top: -18px;
    border-radius: 4px;
    color: #fff;
    z-index: 50;
    cursor: pointer;
    right: 30px;
}
.fs-slider-button-prev {
    margin-top:25px;
}
.ajax-nav {
    position: absolute;
    right: 0;
    bottom: 20px;
    border: 1px solid #ddd;
    overflow: hidden;
    border-radius: 4px;
}
.ajax-nav li {
    float: left;
    border-left: 1px solid #ddd;
}
.ajax-nav li:first-child{
    border-left: none;
}
.ajax-nav li a {
    padding: 8px 12px;
    float: left;
    background: #f9f9f9;
    font-weight: 600;
    font-size: 10px;
    text-transform: uppercase;
}
.ajax-nav li a.current_page {
    color: #fff;
}
.ajax-loader {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgba(255,255,255,0.4);
    z-index: 100;
    padding-top: 100px;
    display: none;
}
#ajax-content {padding: 10px 0;  overflow: hidden; height: auto; min-height: 450px  }
/*------  Section ------------------------------------------------------*/
section {
    float:left;
    width:100%;
    position:relative;
    padding:70px 0;
    z-index:10;
    overflow:hidden;
}
.ad-wrap {
    padding:50px 0;
}
.section-title h2 {
    text-align: left;
    font-size: 24px;
    font-weight: 700;
    color: #292929;
}
.section-title {
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ddd;
    position: relative;
}
.section-title h3 {
    text-align: left;
    font-size: 16px;
    font-weight: 700;
    color: #292929;
    padding-bottom: 20px;
    position: relative;
    top: 15px;
}
.section-title:before , .single-post-header:after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 70px;
    height: 1px;
}
.sect_dec:after {
    font-family: Font Awesome\ 5 Pro;
    content: "\f0d7";
    position: absolute;
    right: 20px;
    top: 30px;
    font-weight: 900;
    font-size: 16px;
}
.section-title h4 {
    text-align: left;
    color: #666;
    font-size: 13px;
    font-weight: 600;
    margin-top: 4px;
}
.hero-section {
    padding: 150px 0 60px;
}
.hero-section_bg {
    z-index: -1;
}
.hero-section_bg:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 70%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.99) 100%);
    z-index: 10;
}
.hero-section_title h2{
    font-size: 30px;
    text-align: left;
    font-weight: 600;
    color: #fff;
    position: relative;
}
.hero-section_title h2:before , .banner-widget_content h5:before {
    content: '';
    position: absolute;
    left: 0;
    top: -10px;
    width: 30px;
    height: 2px;
}
.hs_single-post h2:before  {
    display: none;
}
.hs_single-post h2 {
    text-transform: capitalize
}
.hs_single-post {
    margin-bottom: 30px;
}
.hero-section_title h5 {
    font-weight: 500;
    text-align: left;
    color: #fff;
    font-family: 'Playfair Display', cursive;
    padding-bottom: 20px;
}
.hs_single-post .post-category-marker {
    float: left;
    margin-bottom: 14px;
}
.hs_single-post  .author-link a , .hs_single-post .post-opt {
    color: #fff;
}
.hs_single-post .post-opt {
    margin: 2px 0 0 20px;
    float: left;
    padding: 6px 20px 6px 0;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.21);
    border-radius: 2px;
}
.hs_single-post .post-date  {
    float: left;
    margin: 6px 0 0 20px;
    color: #fff
}
.hs_single-post .post-date i {
    margin-right: 6px;
}
.post-date i {
    font-weight: 800;
}
.hs_single-post .post-opt li {
    margin-left: 15px;
}
.steader_opt_abs{
    position: absolute;
    top: 0;
    right: 0;
    width: 250px;
}
/*------ pagination -------------------------------------------------*/
.breadcrumbs-section {
    padding: 25px 0;
    background: #f5f5f5;
    border-bottom: 1px solid #eee;
}
.breadcrumbs-header {
    padding: 40px 0;
    background: #f5f5f5;
    border-bottom: 1px solid #eee;
}
.breadcrumbs-list a , .breadcrumbs-list span , .breadcrumbs-header_url a , .breadcrumbs-header_url span {
    color: #fff;
    float: left;
    margin-right: 14px;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 10px;
    margin-top: 6px;
    position: relative;
}
.breadcrumbs-header_url {
    float: left;
}
.breadcrumbs-section .breadcrumbs-header_url  {
    margin-top: 13px;
}
.breadcrumbs-header_url a  {
    color: #000;
    font-weight: 600;
    font-size: 11px;
}
.breadcrumbs-header_url span{
    color: #666;
    font-weight: 600;
    font-size: 11px;
    position: relative;
}
.breadcrumbs-list a , .breadcrumbs-header_url a , .breadcrumbs-list span , .breadcrumbs-header_url span   {
    padding-left: 14px;
}
.breadcrumbs-list a:before , .breadcrumbs-header_url a:before , .breadcrumbs-list span:before , .breadcrumbs-header_url span:before {
    font-family: Font Awesome\ 5 Pro;
    content: "\f0da";
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 11px;
    transition: all 200ms linear;
}
.scroll-down-wrap {
    position: absolute;
    right: 0;
    bottom: -5px;
}
.scroll-down-wrap.scw_transparent  {
    bottom: 0;
}
.scroll-down-wrap span {
    float: left;
    margin-left: 20px;
    position: relative;
    top: 8px;
    color: #000;
    font-weight: 500;
    font-size: 11px;
}
.scroll-down-wrap.scw_transparent span {
    color: #ffff;
}
.mousey {
    float: left;
    width: 20px;
    height: 30px;
    border-radius: 4px;
    padding: 0 6px;
    border: 1px solid  #bbb;
    box-sizing: border-box;
    background: rgba(0,0,0,0.05)
}
.scroll-down-wrap.scw_transparent .mousey{
    border: 1px solid  rgba(255,255,255,0.2);
    background:rgba(255,255,255,0.1);
}
.scroller {
    position: relative;
    left: 50%;
    top: 6px;
    margin-left: -1px;
    width: 3px;
    height: 3px;
    border-radius: 25%;
    animation-name: scroll;
    animation-duration: 2.2s;
    animation-timing-function: cubic-bezier(.15, .41, .69, .94);
    animation-iteration-count: infinite;
}
@keyframes scroll {
    0% {
        opacity: 0;
    }
    10% {
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        transform: translateY(50px);
        opacity: 0;
    }
}
.pwh_bg {
    position: absolute;
    top: -120px;
    width: 800px;
    right: 0;
    height: 232px;
    background: url(../images/city-bg.png);
}
.picker-wrap-container {
    padding-right: 50px;
    overflow: hidden;
}
.picker-wrap-controls {
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
}
.picker-wrap-controls li span{
    width: 50px;
    height: 50px;
    line-height: 50px;
    float: left;
    cursor: pointer;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0.4);
}
.picker-wrap-controls li span.pwc_pause {
    font-size: 10px;
}
.picker-wrap-controls li span.pwc_pause.pwc_tog-pp i:before {
    content: "\f04b";
}
.picker-wrap-controls li:last-child span {
    border: none;
    border-radius: 0 0 4px 0 ;
}
.picker-wrap-controls li:first-child span {
    border-radius: 0 4px 0 0;
}
.picker-wrap .list-post-wrap {
    overflow: hidden;
    border: 1px solid #eee;
    border-bottom: none;
    box-sizing: border-box;
}
.picker-wrap .list-post {
    border: none;
    padding: 15px 20px;
    background: #f9f9f9;
}
.picker-wrap .list-post:after {
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    bottom: 1px;
    background: #eee;
    height: 1px;
    z-index: 20;
}
.picker-wrap .list-post:before , .picker-wrap .list-post .list-post-content:before {
    display: none;
}
.picker-wrap .list-post .list-post-media , .picker-wrap .list-post .list-post-content {
    float: right;
}
.picker-wrap .list-post .list-post-content {
    padding: 3px 30px 0 0;
}
.picker-wrap .list-post .list-post-content h3 {
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
}
/*------ aside panel -------------------------------------------------*/
.cookie-info-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: #fff;
    padding: 30px 0;
    box-shadow: 0 -1px 10px 0 rgb(172 171 171 / 30%);
}
.cookie-info-bar_title {
    font-family: 'Playfair Display', cursive;
    font-size: 15px;
    display: inline-block;
}
.cookie-info-bar_title i {
    margin-right: 10px;
    font-size: 16px;
}
.sicb_btn {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 4px;
    background: #222;
    color: #fff;
    margin-left: 10px;
    font-weight: 600;
    font-size: 11px;
}
.aside-panel {
    position: fixed;
    top: 30%;
    right: -60px;
    width: 50px;
    padding: 0 0 0;
    background: #fff;
    z-index: 30;
    border: 1px solid #eee;
    border-right: none;
    border-radius: 6px 0 0 6px;
    box-shadow: 0 5px 40px rgb(0 0 0 / 7%);
    visibility: hidden;
    transition: all 300ms linear;
}
.vis_secnav {
    right: 0;
    visibility: visible;
}
.aside-panel li a {
    float: left;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid #eee;
    transition: all 200ms linear;
    font-size: 15px;
    position: relative;
    background: #fff;
    color: #999;
}
.aside-panel li:last-child a {
    border: none;
    border-radius: 6px 0 0 0;
}
.aside-panel li a:hover {
    background: #f5f5f5;
}
.aside-panel li a span {
    position: absolute;
    right: 100%;
    top: 50%;
    margin:-15px 20px 0 0;
    color: #fff;
    background: #222;
    width: auto;
    height: 30px;
    line-height: 30px;
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 600;
    min-width: 120px;
    border-radius: 2px;
    opacity: 0;
    visibility: hidden;
    transition: all 200ms linear;
    box-shadow: 0 5px 40px rgb(0 0 0 / 7%);
}
.aside-panel li a:hover span {
    opacity: 1;
    visibility: visible;
}
/*------ pagination -------------------------------------------------*/
.pagination {
    margin:20px 0 0 0;
    text-align:center;
    float: left;
    z-index:10;
    position:relative;
    background: #222;
    overflow: hidden;
    border-radius: 4px;
}
.pagination  a {
    float:left;
    width:50px;
    height:50px;
    line-height:50px;
    box-sizing:border-box;
    position:relative;
    font-size:10px;
    font-weight: 500;
    color:#fff;
    border-right: 1px solid rgba(255,255,255,0.15);
}
.pagination a.current-page, .pagination a:hover {
    color:#fff;
}
.pagination  a i {
    font-size:12px;
}
.pagination  a , .cat-item a  {
    transition: all 150ms linear;
}
.load-more_btn   {
    float: right;
    height: 50px;
    line-height: 50px;
    padding: 0 40px;
    background: #222;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    font-size: 11px;
    margin-top: 20px;
    border-radius: 4px;
}
.lmb_center-align {
    display: inline-block;
    float: none;
    padding: 0 60px;
}
.load-more_btn i {
    margin-right: 13px;
    position: relative;
}
.lmb_center-align.load-more_btn i {
    color:#fff;
}
.load-more_btn:hover i {
    animation: spin3 .5s linear infinite;
}
@keyframes spin3 {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(-360deg);
    }
}
/*------ forms -------------------------------------------------*/
.custom-form textarea,
.custom-form input[type="text"],
.custom-form input[type=email],
.custom-form input[type=password] {
    float: left;
    border: none;
    border: 1px solid #e1e1e1;
    background: #f9f9f9;
    width: 100%;
    padding: 15px 30px;
    border-radius: 4px;
    color: #000;
    font-size: 12px;
    -webkit-appearance: none;
    font-family: 'Poppins', sans-serif;
}
.custom-form input::-webkit-input-placeholder,
.custom-form textarea::-webkit-input-placeholder  , .subcribe-form input.enteremail::-webkit-input-placeholder {
    color: #666;
    font-weight: 500;
    font-size: 12px;
    position: relative;
    font-family: 'Poppins', sans-serif;
}
.custom-form input:-moz-placeholder,
.custom-form textarea:-moz-placeholder {
    color: #666;
    font-weight: 500;
    font-size: 12px;
    font-family: 'Poppins', sans-serif;
}
.custom-form textarea {
    min-height: 180px;
    resize: vertical ;
    padding: 25px 30px;
    -webkit-appearance: none;
    border: 1px solid #e1e1e1;
}
.custom-form input {
    margin-bottom: 20px;
}
.custom-form .btn {
    border:none;
    -webkit-appearance: none;
    cursor:pointer;
    margin-top:20px;
    padding: 18px 30px;
    border-radius: 4px;
}
.custom-form .btn:hover {
    background: #222;
}
.custom-form  textarea:focus , .custom-form input[type="text"]:focus  , .custom-form  input[type=email]:focus  , .custom-form  input[type=password]:focus   {
    background:#fff;
    box-shadow: 0px 10px 14px 0px rgba(12, 0, 46, 0.06);
}
.nice-select{
    font-size:12px;
    font-weight:500;
    height:48px;
    line-height:48px;
    border-radius: 2px;
    border: 1px solid #eee;
    background: #f5f5f5
}
.nice-select .option.focus,.nice-select .option.selected.focus , .nice-select.open {
    color:#000;
}
.irs-line-left , .irs-line-mid , .irs-line-right , .irs-bar-edge {
    background: #ccc;
}
.irs-single {
    color: #292929;
    font-weight: 600;
}
/*------ footer-------------------------------------------------*/
.main-footer {
    background: #222;
    padding: 80px 0 0;
}
.footer-widget-title {
    text-align: left;
    font-weight: 600;
    font-size: 16px;
    color: #fff;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.footer-widget-content p{
    color: #fff
}
.footer-bottom {
    padding: 18px 0;
    margin-top: 70px;
    background: #191919;
}
.footer-logo {
    margin-bottom: 34px;
    display: block;
    text-align: left;
}
.footer-logo img {
    width: auto;
    height: 65px;
}
.footer-social {
    margin-top: 22px;
}
.footer-social li {
    float: left;
    margin-right: 6px;
}
.footer-social li a {
    font-size: 12px;
    width: 32px;
    height: 32px;
    line-height: 32px;
    float: left;
    color: #fff;
    border-radius: 2px;
}
.footer-list li {
    display: block;
    text-align: left;
    margin-bottom: 10px;
    padding-left: 20px;
    position: relative;
    font-size: 12px;
    font-weight: 600;
}
.footer-list li:before {
    font-family: Font Awesome\ 5 Pro;
    content: "\f0da";
    position: absolute;
    left: 0;
    top: 5px;
    font-size: 11px;
    transition: all 200ms linear;
}
.footer-list li:hover:before {
    left: 4px;
}
.footer-list li a {
    color: #B6B6B6;
    transition: all 200ms linear;
}
.footer-list li a:hover {
    color: #fff
}
#subscribe {
    margin-top: 20px;
}
.subcribe-form input.enteremail {
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.05);
    padding: 0 20px;
    height: 50px;
    line-height: 50px;
    position: relative;
    z-index: 1;
    color: #fff;
    width: 70%;
    outline: none;
    float: left;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}
.subcribe-form input.enteremail::-webkit-input-placeholder,
.subcribe-form input.enteremail::-webkit-input-placeholder  {
    color: #fff;
    font-weight: 500;
    font-size: 11px;
    position: relative;
    font-family: 'Poppins', sans-serif;
}
.subcribe-form .subscribe-button {
    float: right;
    width: 28%;
    z-index: 2;
    height: 50px;
    line-height: 50px;
    color: #fff;
    outline: none;
    border: none;
    cursor: pointer;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
    border-radius: 2px;
}
.copyright {
    font-weight: 500;
    font-size: 12px;
    color: #999;
    text-align: left;
    float: left;
    line-height: 36px;
}
.copyright__sep {
    margin: 0 6px;
    color: #555;
}
.copyright a.copyright__dev {
    color: #bcd532;
    transition: color 150ms linear;
}
.copyright a.copyright__dev:hover {
    color: #fff;
}
/* Footer mailing-list form. It now carries name, email and a consent box, so
   the theme's one-line "70% input + 28% button" layout pushed the checkbox
   into the button column, and its text inherited the dark body colour on the
   dark footer. Stacked, full width, light text. */
.footer-subscribe input.enteremail ,
.subcribe-form .footer-subscribe .subscribe-button {
    float: none;
    display: block;
    width: 100%;
}
.footer-subscribe input.enteremail {
    margin-bottom: 8px;
}
.footer-subscribe input.enteremail::placeholder {
    color: rgba(255, 255, 255, 0.6);
}
.footer-subscribe input.enteremail:focus {
    border-color: #bcd532;
}
.footer-subscribe__consent {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: 4px 0 14px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.6;
    text-align: left;
    color: #B6B6B6;
    cursor: pointer;
}
.footer-subscribe__consent input {
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    margin: 3px 0 0;
    accent-color: #e93314;
}
.footer-subscribe__consent a ,
.footer-subscribe__more {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.footer-subscribe__consent a:hover ,
.footer-subscribe__more:hover {
    color: #bcd532;
}
.footer-subscribe__more {
    display: block;
    margin-top: 14px;
    font-size: 12px;
    text-align: left;
    text-decoration: none;
    color: #B6B6B6;
}
.footer-subscribe__ok ,
.footer-subscribe__error {
    margin: 10px 0 0;
    font-size: 12px;
    text-align: left;
}
/* Flash messages (front/partials/flash, order confirmation). They use
   Bootstrap's alert markup, but the front end does not load Bootstrap, so they
   rendered as small unstyled centred text with a stray close button. */
.content .alert {
    position: relative;
    float: left;
    width: 100%;
    margin: 0 0 20px;
    padding: 14px 18px;
    font-size: 13px;
    line-height: 1.6;
    text-align: left;
    border-left: 4px solid #999;
    background: #f5f5f5;
    color: #333;
}
.content .alert h4 , .content .alert h5 { margin: 0 0 4px; font-size: 15px; font-weight: 700; line-height: 1.4; text-align: left; color: inherit; }
.content .alert ul { margin: 6px 0 0 18px; list-style: disc; }
.content .alert-success { background: #f3f8dc; border-color: #9bb222; color: #3d4a0c; }
.content .alert-danger { background: #fdecea; border-color: #e93314; color: #8a1d0a; }
.content .alert-warning { background: #fff6e0; border-color: #e0a100; color: #6b4d00; }
.content .alert-info { background: #eef5fb; border-color: #3b82c4; color: #1d4466; }
.content .alert .btn-close { display: none; }
.footer-subscribe__ok { color: #bcd532 !important; }
.footer-subscribe__error { color: #ff7a63 !important; }
.subfooter-nav {
    float: right;
}
.subfooter-nav li {
    float: left;
    margin-left: 10px;
    line-height: 36px;
}
.subfooter-nav li a {
    color: #fff;
}
.to-top {
    float: right;
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 2px;
    color: #fff;
    margin-left: 20px;
    cursor: pointer;
    transition: all 200ms linear;
}
.to-top i {
    transition: all 200ms linear;
    transform: translateY(0px);
    position: relative;
}
.to-top:hover  i{
    transform: translateY(-6px)
}
/*------login------------------------------------------------*/
.mg_logo {
    position: absolute;
    z-index: 3;
    top: 50%;
    height: 30px;
    margin-top: -15px;
    right: 0;
    left: 0;
}
.mg_logo:before {
    content: '';
    position: absolute;
    width: 100px;
    height: 100px;
    left: 50%;
    top: 50%;
    margin: -50px 0 0 -50px;
    background: rgba(255,255,255,0.05);
    z-index: 1;
    border-radius: 50%;
    box-shadow: 0px 0px 0px 26px rgb(255 255 255 / 10%);
}
.mg_logo img {
    height: 30px;
    width: auto;
    position: relative;
    z-index: 2;
}
.main-register-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    overflow: auto;
    display: none;
    -webkit-transform: translate3d(0,0,0);
    background: rgba(0,0,0,.6);
}
.reg-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-transform: translate3d(0,0,0);
}
.main-register-holder {
    max-width: 820px;
    margin: 150px auto;
    position: relative;
    z-index: 2;
}
.main-register-wrap {
    padding-left: 400px;
    background: #fff;
    overflow: hidden;
    border-radius:6px;
    transition: all .4s ease-in-out;
    transform :scale(0.8);
    opacity:0;
}
.main-register_bg {
    position: absolute;
    left: 0;
    width: 400px;
    top: 0;
    bottom: 0;
}
.main-register {
    float:left;
    width:100%;
    position:relative;
    padding:100px 50px 30px;
    background:#fff;
    overflow:hidden;
    box-shadow: 0 15px 5px rgba(0,0,0,0.08);
}
.vis_mr {
    opacity:1;
    transform :scale(1.0);
}
.main-register .tabs-menu {
    position: absolute;
    left: 0;
    top: 0;
    right: 50px;
}
.close-modal {
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 50px;
    line-height: 50px;
    cursor: pointer;
    font-size: 15px;
    transition: all .4s ease-in-out;
}
.close-modal:hover {
    background: #f1f1f1;
}
.main-register .tabs-menu li {
    float: left;
    width: 50%;
}
.main-register .tabs-menu li a {
    height: 50px;
    line-height: 50px;
    float: left;
    width: 100%;
    background: #292929;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
    color: #fff;
}
.main-register .tabs-menu li.current a , .main-register .tabs-menu li.current a i  {
    color: #fff;
}
.main-register .tabs-menu li a i {
    margin-right: 10px;
    font-weight: 800;
}
.soc-log {
    padding: 5px 0;
}
.soc-log p {
    margin-bottom:12px;
    font-size:11px;
    color:#454545;
    text-align: center;
}
.soc-log a {
    float:left;
    width:100%;
    color:#fff;
    height:50px;
    line-height:50px;
    margin-bottom:10px;
    border-radius:4px;
    font-size:11px;
    font-weight:600;
    position:relative;
    text-align: center;
    background: #292929;
}
.soc-log a i {
    font-size:12px;
    position: absolute;
    top:0;
    width:50px;
    height:50px;
    left:0;
    line-height:50px;
    border-right: 1px solid rgba(255,255,255,0.1);
}
.log-separator  span{
    position:relative;
    width:90px;
    display:inline-block;
    background:#fff;
    z-index:2;
}
.log-separator:before {
    content:'';
    position:absolute;
    top:50%;
    left:0;
    right:0;
    height:1px;
    background:#eee;
    z-index:1;
}
.custom-form .log-submit-btn {
    float:left;
    padding:18px 0;
    width: 100%;
    border:none;
    border-radius:4px;
    color:#fff;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    cursor:pointer;
    -webkit-appearance: none;
    margin-bottom:16px;
    font-family: 'Poppins', sans-serif;
}
.custom-form .log-submit-btn:hover {
    color: #000
}
.custom-form label {
    float: left;
    position: relative;
    width: 100%;
    text-align: left;
    font-weight: 500;
    color: #666;
    font-size: 11px;
    margin-bottom: 6px;
}
.main-register .filter-tags{
    float:left;
    margin:2px 0 0 0;
}
.main-register .filter-tags input {
    float: left;
    position: relative;
    border: 1px solid #e5e7f2;
    cursor: pointer;
    padding: 0;
    width: 20px;
    height: 20px;
    border-radius: 2px;
    color: #fff;
    background: #fff;
    -webkit-appearance: none;
}
.filter-tags input:checked:after  {
    font-family: Font Awesome\ 5 Pro;
    content: "\f00c";
    font-size: 12px;
    position: absolute;
    top:2px;
    left: 3px;
    z-index:20;
}
.main-register .filter-tags label{
    color: #50596E !important;
    width: auto;
    margin:2px 0 0 12px;
}
.lost_password {
    margin-top:4px;
    float:right;
}
.lost_password a   {
    float:left;
    color: #666;
    font-size:11px;
    font-weight:500;
}
.lost_password a:hover {
    text-decoration: underline;
}
.tbhc_btn , .mob-hid_btn {
    display: none;
}
.stp-bot {
    padding-bottom: 50px;
}
/*------ post ------------------------------------------------*/
.bold_gpi , .gpi_light {
    margin-bottom: 20px;
}
.bold_gpi:after {
    content: '';
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 10px;
    z-index: -1;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0 10px 14px 0 rgb(37 44 65 / 12%);
    transition: all .3s ease;
}
.bold_gpi .grid-post-content {
    border: 1px solid #eee;
    padding: 20px 20px 0px;
    background: #fff;
}
.grid-post-content h3{
    text-align: left;
    font-weight: 600;
    font-size: 15px;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
}
.grid-post-media {
    overflow: hidden;
    position: relative;
    border-radius: 4px 4px 0 0;
    height: 220px;
}
.grid-post-media a.gpm_link {
    float: left;
    width: 100%;
    height: 100%;
}
.grid-post-media.gpm_sing {
    border-radius: 4px;
    padding: 200px 0;
    height: auto;
}
.grid-post-media_title {
    position: absolute;
    bottom: 0;
    z-index: 20;
    left: 0;
    right: 0;
    padding: 10px 40px 30px;
}
.grid-post-media_title .post-opt {
    margin-left: 20px;
    color: #fff;
    top: 6px;
    position: relative;
    float: left;
}
.grid-post-media_title .post-opt i  , .grid-post-media_title .post-opt li  {
    margin-right: 10px;
}
.gpm_sing .author-link {
    position: absolute;
    z-index: 10;
    left: 40px;
    top: 30px;
}
.grid-post-media_title h4 {
    text-align: left;
    color: #fff;
    float: left;
    width: 100%;
    font-size: 19px;
    font-weight: 600;
}
.grid-post-media_title h4 a , .gpm_sing .author-link a {
    color: #fff;
}
.gpi_light .grid-post-media {
    margin-bottom: 15px;
}
.grid-post-media .bg{
    -webkit-transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms;
}
.grid-post-media:hover .bg  {
    -webkit-transform: scale(1.15);
    -moz-transform:scale(1.15);
    transform: scale(1.15);
}
.grid-post-content .post-date , .list-post-content  .post-date {
    float: left;
    width: 100%;
    text-align: left;
    color: #666;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 3px 0 10px 0;
}
.grid-post-content .post-date i , .post-opt li i , .list-post-content  .post-date i {
    margin-right: 4px;
}
.post-opt li i {
    font-weight: 600;
}
.bold_gpi .grid-post-footer {
    background: #fff;
    border: 1px solid #eee;
    border-top: none;
    border-radius: 0 0 4px 4px;
    overflow: hidden;
    padding: 16px 20px;
}
.post-opt li {
    float: left;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}
.author-link {
    float: left;
}
.author-link img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    float: left;
    margin-right: 8px;
}
.author-link span {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    position: relative;
    top: 9px;
}
.author-link strong {
    color: #777;
}
.author-link:hover strong {
    color: #000;
}
.grid-post-footer .post-opt {
    float: right;
    position: relative;
    top: 12px;
}
.grid-post-footer .post-opt li {
    margin-right: 10px;
    color: #000;
}
.grid-post-footer .post-opt li span , .grid-post-footer .post-opt li a {
    color:#000;
    margin-right: 2px;
}
.grid-post-item  .post-category-marker  {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
}
.grid-post-media_title .post-category-marker {
    position: relative;
    top: 0;
    right: 0;
    float:left;
    margin-bottom: 15px;
}
.grid-post-item  .post-category-marker:hover {
    background: #292929;
}
.gs-controls {
    position: absolute;
    bottom: 30px;
    right: 30px;
    left: 50px;
    z-index: 10;
}
.gs-controls:before {
    content: '';
    position: absolute;
    left:0;
    right: 120px;
    height: 1px;
    bottom: 18px;
    background: rgba(255,255,255,0.2);
}
.gs_button {
    float: right;
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    margin-left: 6px;
}
.gc-pagination.pag-style {
    float: right;
}
.gc-pagination.pag-style .swiper-pagination-bullet {
    background: #bbb;
}
.gc-pagination.pag-style  .swiper-pagination-bullet:before {
    border-color: #ccc;
}
.sgs_ver {
    position: absolute;
    right: 40px;
    left: auto;
    bottom: 50%;
    z-index: 50;
    width: 10px;
    transform: translateY(50%);
}
.sgs_hor {
    position: absolute;
    bottom: 35px;
    z-index: 50;
    width: 100%;
}
.single-grid-slider-wrap {
    margin: 15px 0;
}
.sgs-pagination .swiper-pagination-bullets , .multi-pag .swiper-pagination-bullets {
    width: 10px;
}
.sgs-pagination  .swiper-pagination-bullet ,  .multi-pag .swiper-pagination-bullet , .hero-carousel-pag .swiper-pagination-bullet   {
    width: 7px;
    height: 7px;
    background: #fff;
    opacity:1;
    position: relative;
}
.sgs_ver  .swiper-pagination-bullet , .hero-carousel-pag .swiper-pagination-bullet {
    margin-bottom: 10px;
}
.sgs_hor  .swiper-pagination-bullet {
    margin:0  8px;
}
.gallery-item {
    width:33.3%;
    position: relative;
    float: left;
    padding: 5px;
}
.list-post {
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #eee;
}
.list-post:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30px;
    height: 1px;
}
.list-post-media {
    position: relative;
    width:40%;
    overflow: hidden;
    height: 190px;
    float: left;
    border-radius: 4px;
}
.post-media_title {
    position: absolute;
    right: 0;
    bottom: -50px;
    z-index: 20;
    color: #fff;
    font-size: 10px;
    font-weight: 500;
    background: rgba(255,255,255,0.2);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    padding: 6px 13px;
    border-radius: 4px 0 0 0;
    transition: all 400ms linear;
}
.list-post-media:hover .post-media_title , .grid-post-media:hover .post-media_title  {
    bottom: 0;
}
.list-post-media a {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
}
.list-post-content {
    float: left;
    width: 60%;
    padding: 3px 0 0 30px;
    position: relative;
}
.list-post-content:before , .single-post-header:before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
}
.list-post-wrap_column .list-post-media , .list-post-wrap_column .list-post-content {
    width: 100%;
}
.list-post-wrap_column .list-post-media {
    height: 240px;
}
.list-post-wrap_column_fw.list-post-wrap_column .list-post-media {
    height: 375px;
}
.list-post-wrap_column_fw.list-post-wrap_column .list-post-content {
    padding: 22px 0 0 0;
}
.list-post-wrap_column .list-post-content {
    padding: 12px 0 0 0;
}
.list-post-wrap_column .list-post-content:before {
    display: none;
}
.list-post-wrap_column_fw.list-post-wrap_column .list-post-content:before {
    display: block;
    top: 22px;
}
.list-post-wrap_column .list-post {
    padding-bottom: 10px;
    margin-bottom: 20px;
}
.list-post-wrap_column_fw.list-post-wrap_column .list-post {
    padding-bottom: 30px;
    margin-bottom: 30px;
}
.cen-align-container {
    padding-left: 30px;
    border-left: 1px solid #eee;
}
.list-post-content h3 {
    font-size: 18px;
    font-weight: 600;
    text-align: left;
    display: block;
    width: 100%;
    clear: both;
}
.list-post-wrap_column_fw.list-post-wrap_column .list-post-content h3 {
    font-size: 24px;
}
.list-post-content .post-opt li {
    margin-right: 10px;
}
.list-post-content .post-opt {
    margin-top: 20px;
    float: right;
}
.list-post-content .post-category-marker , .single-post-header .post-category-marker {
    float: left;
    margin-bottom: 6px;
}
.list-post-wrap_column .post-category-marker {
    display: block;
    top: 30px;
    left: 2px;
    z-index: 20;
    margin-right: 2px;
    float: left;
}
.list-post-content .post-category-marker , .grid-post-media_title .post-category-marker {
    padding: 4px 13px;
    font-size: 10px;
}
.list-post-content .post-category-marker:hover {
    background: #222;
}
.single-post-header {
    padding: 0 0 30px;
    border-bottom: 1px solid #eee;
}
.single-post-header h1 {
    font-size: 28px;
    font-weight: 700;
    text-align: left;
}
.single-post-header h4 {
    font-size: 12px;
    font-weight: 600;
    text-align: left;
    color: #6c6f72;
    font-family: 'Playfair Display', cursive;
    padding-bottom: 20px;
}
.single-post-header .post-opt {
    float: right;
    padding: 6px 14px 6px 5px;
    background: #f9f9f9;
    border: 1px solid #eee;
}
.single-post-header .post-opt li {
    margin-left: 15px;
    font-size: 11px;
}
.single-post-header .post-date {
    float: left;
    margin:10px 0 0 20px;
    position: relative;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
}
.single-post-header .post-date i {
    margin-right: 6px;
}
.ss-slider-cont{
    position: absolute;
    top: 50%;
    width: 40px;
    height: 40px;
    line-height: 40px;
    margin-top: -20px;
    border-radius: 4px;
    color:#fff;
    z-index: 50;
    cursor: pointer;
}
.ss-slider-cont-next {
    right: 20px;
}
.ss-slider-cont-prev {
    left: 20px;
}
.pmd_vis {
    bottom: 0;
    background: rgba(0,0,0,0.2);
}
.box-media-zoom {
    position: absolute;
    right: 0;
    top: -60px;
    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 10px;
    background: #202020;
    color: #fff;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s ease-in-out;
}
.hov_zoom:hover .box-media-zoom {
    top: 0;
}
.spc_column:before {
    content: '';
    position: absolute;
    left: 86px;
    height: 100%;
    width: 1px;
    background: #eee;
    top: 0;
}
.ss-slider-controls2 {
    position: absolute;
    left: 20px;
    z-index: 20;
    bottom: 20px;
}
.single-post-media {
    margin-bottom: 20px;
}
.single-post-media .video-holder {
    border-radius: 6px;
    height: 450px;
}
.spc_column {
    padding-left: 120px;
}
.mb_head {
    font-size: 18px;
    text-align: left;
    padding-bottom: 10px;
    font-weight: 600;
}
.has-drop-cap:first-letter {
    font-size: 70px;
    float: left;
    padding: 20px 20px 40px 0;
    font-family: 'Playfair Display', cursive;
    color: #000;
}
.single-post-content_text_media {
    margin: 15px 0;
}
.single-post-content_text_media img {
    border-radius: 4px;
}
.single-post-content_text p {
    font-weight: 400;
    color: #000;
}
.single-post-content_column {
    position: absolute;
    top: 0;
    left: 0;
}
.print-btn {
    float: right;
    margin: 10px 20px 0 0;
    padding: 8px 20px;
    background: #f9f9f9;
    border: 1px solid #eee;
}
.print-btn i {
    font-size: 16px;
    margin-left: 10px;
}
.print-btn span {
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 600;
    position: relative;
    top: -2px;
}
.fontSize {
    float: left;
    width: 350px;
    padding:0 50px 15px 120px;
    position: relative;
    background: #f9f9f9;
    border: 1px solid #eee;
    overflow: hidden;
    border-radius: 4px;
}
.fs-wrap {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
    z-index: 20;
}
.fs_title {
    position: absolute;
    left: 15px;
    top:19px;
    font-size: 13px;
    font-family: 'Playfair Display', cursive;
    font-weight: 600;
}
.fontSize input {
    float: left;
}
.fontSize .irs-single  {
    display: none;
}
.fontSize .irs-line, .fontSize .irs-line-left , .fontSize .irs-line-mid , .fontSize .irs-bar, .fontSize .irs-line-right , .fontSize .irs-bar-edge {
    height: 2px;
}
.fontSize .irs-max, .fontSize .irs-min {
    visibility: visible!important;
    top: 20px;
    color: #333;
    font-size: 10px;
}
.fontSize .irs-slider:before {
    width: 14px;
    height: 14px;
    margin: -7px 0 0 -7px;
}
.fontSize .irs-min  {
    left: -35px;
}
.fontSize .irs-max  {
    right: -36px;
}
.show-more-snopt  {
    float:right;
    font-size:24px;
    height:36px;
    line-height:36px;
    width: 36px;
    border: 1px solid #eee;
    background: #f9f9f9;
    color: #000;
    cursor:pointer;
    border-radius:2px;
    position:relative;
    margin-top: 10px;
}
.smact_vis i:before {
    content: "\f00d";
}
.smact_vis   {
    font-size: 12px;
}
.show-more-snopt-tooltip {
    position:absolute;
    right:0;
    width:190px;
    background:#f9f9f9;
    top:100%;
    margin-top:30px;
    z-index:20;
    border:1px solid #eee;
    overflow:hidden;
    padding:5px 10px;
    border-radius:4px;
    transition: all 300ms linear;
    opacity:0;
    visibility:hidden;
    box-shadow: 0 5px 5px rgb(0 0 0 / 6%);
}
.show-more-snopt-tooltip.show-more-snopt-tooltip_vis {
    margin-top:0;
    opacity:1;
    visibility:visible;
}
.show-more-snopt-tooltip a {
    display:block;
    border-bottom: 1px solid #ddd;
    padding:10px;
    text-align:left;
    font-size:11px;
    color: #000;
    font-weight:600;
    position:  relative;
}
.show-more-snopt-tooltip a i {
    margin-right:10px;
}
.show-more-snopt-tooltip a:last-child {
    border-bottom:0;
}
.single-post-footer {
    margin-top: 15px;
    padding-top: 25px;
    border-top: 1px solid #eee;
}
.post-single-tags , .tags-title , .post-single-tags .tags-widget {
    float: left;
}
.tags-title {
    margin:10px 20px 0 0;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
}
.tags-title i {
    margin-right: 10px;
}
.post-author {
    float: left;
    background: #f9f9f9;
    border: 1px solid #eee;
    margin: 40px 0;
    border-radius: 4px;
    overflow: hidden;
}
.author-content {
    padding: 30px 35px 30px 130px;
}
.author-img  {
    position: absolute;
    z-index: 2;
    top: 30px;
    left: 25px;
}
.author-img img {
    width: 80px;
    height: 80px;
    border-radius: 4px;
    float: left;
    box-shadow: 0 15px 40px rgb(0 0 0 / 37%);
}
.author-content h5 {
    text-align: left;
    color: #666;
    float: left;
    width: 100%;
    font-weight: 600;
    font-size: 14px;
    padding-bottom: 15px;
}
.author-content p {
    text-align: left;
}
.profile-card-footer_soc {
    float: right;
}
.profile-card-footer_soc .profile-card-footer_title {
    margin-right: 25px;
}
.post-author_link {
    float: left;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 600;
    height: 50px;
    line-height: 50px;
    margin-left: 30px;
}
.post-author_link i {
    margin-left: 10px;
}
.single-post-comm {
    margin-top: 20px;
}
.comment{
    padding: 0 0 30px 100px;
    position: relative;
    float: left;
    margin-bottom: 40px;
    width: 100%;
    border-bottom: 1px solid #eee;
}
.comment_reply {
    float: right;
    width:calc(100% - 90px);
}
.comment_reply:before {
    content: '';
    position: absolute;
    top: -10px;
    left: -60px;
    width: 40px;
    height: 40px;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.comment-author {
    position: absolute;
    top: 0;
    left: 10px;
    width: 80px;
    height: 80px;
}
.comment-author:before {
    content: '';
    position: absolute;
    right: -14px;
    top: 20px;
    width: 8px;
    height: 8px;
    border-left: 1px solid #eee;
    border-bottom: 1px solid #eee;
    transform: rotate(45deg);
    background: #f9f9f9;
    z-index: 10;
}
.comment-author img {
    width: 60px;
    height: 60px;
    float: left;
    border-radius: 50%;
}
.comment-body{
    float: left;
    width: 100%;
    position: relative;
    padding: 25px 30px;
    background: #f9f9f9;
    border-radius: 2px;
    border: 1px solid #eee;
}
.comment-body h4 {
    text-align: left;
    float: left;
    font-size: 15px;
    font-weight: 600;
    color: #666;
    margin-bottom: 15px;
}
.comment-body .star-rating {
    float: left;
    margin:5px 0 0 20px;
    font-size: 10px
}
.comment-body p{
    text-align: justify;
}
.comment-meta {
    float: left;
    top: 20px;
    position: relative;
    text-transform: uppercase;
    font-size: 10px;
    color: #000;
    font-weight: 500;
}
.box-widget-menu-btn {
    position: absolute;
    right: 30px;
    top: 25px;
    cursor: pointer;
    z-index: 20;
    font-size: 16px;
}
.comment-body .show-more-snopt-tooltip  {
    background: #fff;
    top: 60px;
}
.comment-meta i {
    margin-right: 10px;
}
.comment-reply-link {
    float: right;
    padding: 8px 20px;
    background: #292929;
    font-weight: 500;
    font-size: 11px;
    margin-top: 10px;
    color: #fff;
    border-radius: 2px;
}
.comment-reply-link i {
    padding-right: 10px;
    font-size: 10px;
}
.comment-body_dec {
    position: absolute;
    bottom: 40px;
    right: 150px;
    left: 180px;
    height: 1px;
    background: #d9d9d9;
}
.add-comment .btn {
    padding: 18px 30px;
}
.pr-subtitle {
    float: left;
    font-size: 14px;
    font-weight: 600;
    color: #000;
    margin-bottom: 30px;
}
.pr-subtitle i {
    margin-left: 10px;
}
.pr-subtitle.prs_big {
    font-size: 18px;
    position: relative;
    width: 100%;
    text-align: left;
}
.pr-subtitle.prs_big:before {
    content:"";
    position: absolute;
    right: 0;
    top: 50%;
    width: 70%;
    height: 1px;
    background: #eee;
    z-index: 1;
}
.pr-subtitle.prs_big:after {
    content:"";
    position: absolute;
    right: 0;
    top: 50%;
    width: 50px;
    height: 1px;
    z-index: 2;
}
.spn_box {
    float: left;
    width: 50%;
    position: relative;
}
.single-post-nav {
    padding: 25px 0;
    padding-bottom: 70px;
    margin-top: 25px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}
.single-post-nav:before {
    content: '';
    position: absolute;
    top: 20px;
    bottom: 20px;
    width: 1px;
    background: #eee;
    z-index: 0;
}
.single-post-nav_prev {
    padding:0 20px 0 110px;
}
.single-post-nav_next {
    padding:0 110px 0 20px;
}
.spn_box_img {
    position: absolute;
    top: 0;
    width: 90px;
}
.spn_box_img  img {
    border-radius: 4px;
    box-shadow: 0 5px 10px rgb(0 0 0 / 0%);
    transition: all 200ms linear;
    transform: translateY(0)
}
.spn_box:hover img {
    box-shadow: 0 5px 5px rgb(0 0 0 / 15%);
    transform: translateY(-4px)
}
.single-post-nav_prev .spn_box_img {
    left: 0;
}
.single-post-nav_next .spn_box_img {
    right: 0;
}
.spn-box-content_subtitle {
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 600;
    color: #666;
    display: block;
    padding-bottom: 4px;
}
.spn-box-content_title {
    font-size: 13px;
    font-weight: 600;
    display: block;
}
.single-post-nav_prev .spn-box-content_subtitle , .single-post-nav_prev .spn-box-content_title {
    text-align: left;
}
.single-post-nav_next .spn-box-content_subtitle , .single-post-nav_next .spn-box-content_title {
    text-align: right;
}
.single-post-nav_prev .spn-box-content_subtitle i {
    margin-right: 10px;
}
.single-post-nav_next .spn-box-content_subtitle i {
    margin-left: 10px;
}
.fs-carousel-wrap {
    padding-left: 400px;
    background: #111;
    overflow: hidden;
}
.fs-carousel-wrap_title {
    position: absolute;
    top: 0;
    left: 0;
    width: 400px;
    height: 100%;
    padding: 0 50px;
}
.fs-carousel-wrap_title-wrap {
    text-align: left;
    color: #fff;
    top: 50%;
    transform: translateY(-50%);
}
.fs-carousel-wrap_title-wrap h4 {
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 12px;
    position: relative;
}
.fs-carousel-wrap_title-wrap h4:before {
    content: '';
    position: absolute;
    top: -30px;
    left: 0;
    width: 40px;
    height: 2px;
}
.fs-carousel-wrap_title .abs_bg {
    top: auto;
    bottom: 0;
    opacity: 0.1;
}
.fs-carousel .bold_gpi{
    margin-bottom: 0;
    border-radius: 0;
}
.fs-carousel .grid-post-media.gpm_sing {
    padding: 250px 0;
    height: auto;
    border-radius: 0;
}
/*------ btn ------------------------------------------------------*/
.ver-share {
    margin-top: 20px;
}
.share-holder.hor-share {
    float: right;
}
.share-holder.hor-share .share-title {
    float: left;
    font-size: 13px;
    font-family: 'Playfair Display', cursive;
    font-weight: 600;
    text-align: left;
    position: relative;
    margin:15px 20px 0 0;
}
.ver-share .share-title {
    margin-bottom: 20px;
    font-size: 13px;
    font-family: 'Playfair Display', cursive;
    font-weight: 600;
    text-align: left;
    position: relative;
}
.ver-share .share-title:before {
    content: '';
    position: absolute;
    left: 0;
    top: -10px;
    height: 2px;
    width: 20px;
}
.ver-share .share-container {
    width: 50px;
    float: left;
    border: 1px solid #eee;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 5px 30px rgb(0 0 0 / 5%);
}
.share-holder.hor-share .share-container {
    float: left;
    border: 1px solid #eee;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 5px 30px rgb(0 0 0 / 5%);
}
.share-icon {
    float:left;
    width: 50px;
    height: 50px;
    line-height: 50px;
    background: #fff;
    font-size: 12px;
    transition: all 100ms linear;
}
.share-holder.hor-share .share-container .share-icon {
    border-right: 1px solid #eee;
}
.ver-share .share-container .share-icon {
    border-bottom: 1px solid #eee;
}
.ver-share .share-container .share-icon:last-child , .share-holder.hor-share .share-container .share-icon:last-child {
    border: none;
}
.share-icon:hover {
    color: #fff;
    border-color: transparent;
}
.share-icon:before {
    font-family: Font Awesome\ 5 Brands;
}
.share-icon-digg:before {
    content: "\f1a6";
}
.share-icon-rss:before {
    content: "\f09e";
}
.share-icon-facebook:before  {
    content: "\f39e";
}
/* X share button — glyph defined with the .fa-x-twitter mask further down. */
.share-icon-tumblr:before {
    content: "\f173";
}
.share-icon-linkedin:before {
    content: "\f0e1";
}
.share-icon-pinterest:before {
    content: "\f231";
}
.share-icon-stumbleupon:before {
    content: "\f1a4";
}
/*------ btn ------------------------------------------------------*/
.btn {
    padding: 12px 40px;
    color: #fff;
    border-radius: 2px;
    background: #292929;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
}
.float-btn {
    float: left;
}
.btn i , .dark-btn i {
    margin-left: 10px;
}
.dark-btn {
    display: inline-block;
    height: 50px;
    line-height: 50px;
    padding: 0 90px;
    background: #222;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    font-size: 12px;
    margin-top: 10px;
    border-radius: 4px;
}
/*------ widgets ------------------------------------------------------*/
.categories_nav-inner  {
    float: left;
    overflow: hidden;
    width:100%;
    position: relative;
    margin-bottom: 30px;
}
.categories_nav-inner   ul {
    margin: 0;
    float: left;
    width: 100%;
    overflow: hidden;
}
.categories_nav-inner   li {
    margin: 0;
    position: relative;
    float: left;
    width: 100%;
    margin-bottom: 4px;
}
.categories_nav-inner   a {
    float: left;
    padding: 0 0 0 20px;
    border: 1px solid #eee;
    background: #f5f5f5;
    height: 54px;
    line-height: 54px;
    position: relative;
    font-weight: 700;
    font-size: 10px;
    text-align: left;
    color:#000;
    text-transform: uppercase;
    z-index:2;
    width:100%;
}
.categories_nav-inner   a:hover , .categories_nav-inner  a.back  {
    color:#fff;
    background: #222;
    border-color: transparent;
}
.categories_nav-inner   a i {
    margin-right: 10px;
    font-size: 13px;
}
.categories_nav-inner  a.back {
    margin-bottom: 10px
}
.categories_nav-inner  a.back:after {
    content: 'Back';
    color: #fff;
    padding-left: 20px;
}
.categories_nav-inner  a.back:before {
    font-family: Font Awesome\ 5 Pro;
    content: '\f104';
    color: #fff;
}
.categories_nav-inner .submen-dec:before {
    font-family: Font Awesome\ 5 Pro;
    content: '\f0da';
    position: absolute;
    right: 20px;
    width: 10px;
    height: 10px;
    top: 19px;
    font-size:13px;
    color:rgba(255, 255, 255, 0.371);
    z-index: 20;
    font-weight: 600;
}
.sidebar-content {
    border-left: 1px solid #eee;
}
.box-widget {
    margin-bottom: 40px;
    padding-left: 30px;
}
.sidebar-content .box-widget:last-child {
    margin-bottom: 0;
}
.widget-title {
    text-align: left;
    font-size: 18px;
    font-weight: 700;
    color: #292929;
    padding-bottom: 15px;
    margin-bottom: 30px;
    border-bottom: 1px solid #ddd;
    position: relative;
}
.widget-title:before {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 70px;
    height: 1px;
}
.tags-widget a {
    float: left;
    padding: 12px 20px;
    color: #fff;
    font-size: 10px;
    text-transform: uppercase;
    border-radius: 2px;
    margin: 0 5px 5px 0;
    font-weight: 600;
    background: #222;
}
.slider_widget_title {
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    z-index: 20;
    color: #fff;
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    font-family: 'Playfair Display', cursive;
}
.slider_widget_title:before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -10px;
    width: 40px;
    height: 2px;
    margin-left: -20px;
}
.slider_widget .grid-post-media_title {
    padding: 10px 20px 70px;
}
.slider_widget .grid-post-media.gpm_sing:before {
    display: none;
}
.slider_widget .grid-post-media.gpm_sing {
    padding: 380px 0;
}
.slider_widget .grid-post-media_title h4 {
    text-align: center;
    font-size: 16px;
}
.slider_widget .grid-post-media_title .video-date  {
    width: 50%;
    text-align: center;
}
.slider_widget .grid-post-media_title .post-opt {
    width: 50%;
    margin: 0;
    padding-left: 10px;
}
.slider_widget .grid-post-media_title .post-category-marker {
    display: inline-block;
    float: none;
}
.social-widget a{
    float: left;
    width:48%;
    margin:0 2% 2% 0;
    padding: 20px 4px 0 66px;
    color: #000;
    border-radius: 2px;
    height: 60px;
    background: #f5f5f5;
    border: 1px solid #eee;
}
.slider_widget {
    position: relative;
}
.social-widget span {
    font-weight: 600;
    float: left;
    margin-right: 5px;
}
.social-widget a i  {
    font-size: 15px;
    position: absolute;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: #fff;
    left: 8px;
    top: 50%;
    margin-top: -20px;
    box-shadow: 0 5px 5px rgb(0 0 0 / 6%);
    transition: all 200ms linear;
}
.social-widget a:hover i {
    box-shadow: 0 0px 0px rgb(0 0 0 / 6%);
}
.soc-widget-title {
    color: #6c757d
}
.facebook-soc i {
    color: #3C579C;
}
.twitter-soc i {
    color: #000000;
}
.instagram-soc i {
    color: #c862dc;
}
.sb-categories_bg_item {
    position: relative;
    display: block;
    padding: 25px 60px 25px 30px;
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 4px;
    background: #f5f5f5;
    border: 1px solid #eee;
}
.spb-categories_counter {
    position: absolute;
    top: 50%;
    right: 20px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    margin-top: -18px;
    border-radius: 2px;
    color: #fff;
    z-index: 10;
    font-weight: 600;
    overflow: hidden;
}
.spb-categories_counter:before {
    font-family: Font Awesome\ 5 Pro;
    content: "\f0da";
    position: absolute;
    width: 36px;
    height: 36px;
    line-height: 36px;
    top: 50%;
    left: 50%;
    margin: -18px 0 0 -18px;
    z-index: 10;
    opacity: 0;
    background: #fff;
}
.sb-categories_bg_item:hover .spb-categories_counter:before {
    opacity: 1;
}
.sb-categories_bg_item .bg {
    -webkit-transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms;
}
.sb-categories_bg_item:hover .bg {
    -webkit-transform: scale(1.15);
    -moz-transform:scale(1.15);
    transform: scale(1.15);
}
.spb-categories_title {
    text-align: left;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 600;
    float: left;
    padding: 6px 30px 6px 10px;
    background: rgba(255,255,255,0.2);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    position: relative;
    border-radius: 2px;
    color: #fff;
    z-index: 10;
}
.spb-categories_title span {
    padding-right: 6px;
}
.cbw_mar {
    margin: 30px auto;
}
#footer-twiit {
    text-align:left;
}
#footer-twiit a {
    color:#000;
}
#footer-twiit p.tweet {
    color:#666;
    float:left;
    padding:20px;
    border: 1px solid #eee;
    background: #f9f9f9;
    font-family: 'Playfair Display', cursive;
    font-size: 12px;
    border-radius:4px;
    overflow:hidden;
    font-weight:600;
    margin-bottom:10px;
}
#footer-twiit img  , #footer-twiit div.user {
    display:none;
}
.interact {
    float: right;
}
#footer-twiit .interact  a {
    float: left;
    margin-left: 10px;
    font-size: 13px;
}
#footer-twiit .interact  a:hover {
    color: #aaa
}
#footer-twiit  .timePosted a {
    color:#666;
    font-family: 'Playfair Display', cursive;
    font-style:italic;
    position:relative;
    float:left;
    margin-bottom:30px;
    padding-left:20px;
    font-size: 12px;
}
#footer-twiit  .timePosted a:before {
    font-family: Font Awesome\ 5 Brands;
    content: "\f081";
    position:absolute;
    top:0;
    left:0;
    font-size:14px;
}
#footer-twiit  .timePosted a:after {
    top: -10px;
    left: 22px;
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
#footer-twiit  .timePosted a:after {
    border-color: transparent;
    border-top-color: rgba(255,255,255,0.11);
    border-width: 7px;
    margin-left: 7px;
}
.tabs-widget .tabs-menu {
    overflow: hidden;
    border-radius: 4px 4px 0 0;
    border: 1px solid  #eee;
}
.tabs-widget .tabs-menu li {
    float: left;
    width: 50%;
}
.tabs-widget .tabs-menu li a {
    background: #222;
    box-sizing: border-box;
    display: block;
    padding: 15px 0;
    color: #fff;
    font-weight: 600;
    font-size: 10px;
    text-transform: uppercase;
}
.tabs-widget .tabs-menu li.current a {
    color:#fff;
}
.tab-content .post-widget-container{
    padding: 25px 20px;
    background: #f9f9f9;
    border: 1px solid  #eee;
    border-top: none;
}
.post-widget-item {
    padding-top: 20px;
    margin-bottom: 20px;
    border-top: 1px solid #ddd;
}
.post-widget-container .post-widget-item:first-child {
    padding-top: 0;
    border-top: none;
}
.post-widget-container .post-widget-item:last-child {
    margin-bottom: 0;
}
.post-widget-item-media {
    float: left;
    width: 30%;
    overflow: hidden;
    border-radius: 4px;
}
.post-widget-item-media a , .grid-post-media a {
    position: relative;
    display: block;
}
.post-widget-item-media a:before , .list-post-media a:before , .grid-post-media  a.gpm_link:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 2;
    background: rgba(0,0,0,0.5);
    opacity: 0;
    transition: all 200ms linear;
}
.post-widget-item-media a:after , .list-post-media a:after , .grid-post-media a.gpm_link:after   {
    font-family: Font Awesome\ 5 Pro;
    content: "\f178";
    position: absolute;
    left: 50%;
    top:50%;
    width: 10px;
    height: 10px;
    line-height: 10px;
    margin: -5px 0 0 -5px;
    z-index: 3;
    color: #fff;
    opacity: 0;
    transition: all 200ms linear;
}
.list-post-media a:after , .grid-post-media a.gpm_link:after {
    width: 40px;
    height: 40px;
    line-height: 40px;
    margin: -20px 0 0 -20px;
    border-radius: 50%;
    font-size: 10px;
    box-shadow: 0px 0px 0px 4px rgb(255 255 255 / 40%);
}
.post-widget-item-media a:hover:before , .post-widget-item-media a:hover:after , .list-post-media a:hover:before , .list-post-media a:hover:after , .grid-post-media a.gpm_link:hover:before , .grid-post-media a.gpm_link:hover:after {
    opacity: 1;
}
.post-widget-item-media img {
    width: 100%;
    height: auto;
}
.post-widget-item-content{
    float: left;
    width: 70%;
    position: relative;
    padding: 6px 0 0 15px;
}
.post-widget-item-content h4 {
    text-align: left;
    font-weight: 600;
    padding-bottom: 4px;
    font-size: 13px;
}
.pwic_opt li {
    float: left;
    margin-right: 8px;
    color: #666;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
}
.pwic_opt li i {
    margin-right: 4px;
    font-weight: 900;
}
.pwic_opt li:first-child i  {
    font-weight: 400;
}
.search-widget input.search {
    background: #eee;
    border-radius:  4px 0 0 4px;
    position: relative;
    color: #000;
    -webkit-appearance: none;
}
.search-widget input.search::-webkit-input-placeholder,
.search-widget input.search::-webkit-input-placeholder  {
    color: #000;
}
.search-submit2 {
    border: none;
    outline: none;
    cursor: pointer;
    background: none;
    position: absolute;
    top: 0;
    right: 0;
    width: 70px;
    height: 50px;
    font-size: 11px;
    color: #fff;
    border-radius: 0 4px 4px 0;
}
.bg-parallax-wrap-gradien:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,rgba(0, 0, 0, 0.6) 90%);
}
.banner-widget {
    padding: 100% 30px 20px;
    overflow: hidden;
    border-radius: 4px;
}
.banner-widget_content {
    z-index: 2;
    position: relative;
}
.banner-widget_content h5 {
    text-align: left;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    position: relative;
}
.banner-widget_content .btn {
    margin-top: 15px;
}
.cat-wid-list  {
    float:left;
    width:100%;
    position:relative;
}
.cat-wid-list li {
    float:left;
    width:100%;
    text-align:left;
    padding-bottom: 8px;
    margin-bottom: 15px;
    position: relative;
    color:#292929;
}
.cat-wid-list li:last-child {
    margin-bottom: 0;
}
.cat-wid-list li a {
    color:#999;
    font-size:12px;
    padding: 4px 20px 0 0;
    font-weight:500;
    float: left;
    background: #fff;
    position: relative;
    z-index: 2;
}
.cat-wid-list li a:hover {
    color: #000;
}
.cat-wid-list li:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 50px;
    z-index: 1;
    border-top: 1px dotted #ccc;
}
.cat-wid-list li  span {
    float: right;
    width: 26px;
    height: 26px;
    line-height: 26px;
    color: #fff;
    font-weight: 600;
    border-radius: 2px;
    text-align: center;
    font-size: 10px;
}
.profile-card-wrap {
    overflow: hidden;
    border: 1px solid #eee;
    background: #f9f9f9;
    border-radius: 6px;
}
.profile-card_media {
    padding: 55px 30px 40px;
    position: relative;
}
.profile-card_media:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    background: #f9f9f9;
    z-index: 1;
}
.profile-card_media img {
    width: 80px;
    height: 80px;
    position: relative;
    z-index: 2;
    border-radius:4px;
    float: left;
    top: 10px;
    box-shadow: 0 15px 40px rgb(0 0 0 / 37%);
}
.profile-card_media_content {
    float: left;
    padding:0 0 20px 20px;
    text-align: left;
    font-weight: 600;
    position: relative;
    z-index: 10;
}
.profile-card_media_content h4 {
    font-size: 16px;
    text-align: left;
    color: #fff;
    padding-bottom: 4px;
}
.profile-card_media_content h5 {
    font-size: 10px;
    text-align: left;
    text-transform: uppercase;
    color: #fff;
}
.profile-card_content {
    padding: 45px 30px 20px;
    position: relative;
    z-index: 2;
}
.profile-card_content h4 {
    text-align: left;
    font-size: 16px;
    font-weight: 600;
}
.profile-card-stats {
    position: absolute;
    bottom: 15px;
    left: 130px;
    right: 30px;
    padding: 15px 0;
    background: #fff;
    border-radius: 2px;
    z-index: 20;
    box-shadow: 0 15px 20px rgb(0 0 0 / 7%);
}
.profile-card-stats:before {
    content: '';
    position: absolute;
    left: 50%;
    width: 1px;
    top: 10px;
    bottom: 10px;
    background: #ddd;
}
.profile-card-stats li {
    float: left;
    width: 50%;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
}
.profile-card-stats li span {
    padding-right: 6px;
}
.abs_bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 150px;
    background-attachment: scroll;
    background-position: right;
    background-origin: content-box;
    background-image: url("../images/city-bg.png");
    opacity: 0.6;
    z-index: 1;
}
.profile-card-footer {
    border-top: 1px solid #eee;
    background: #fff;
}
.profile-card-social {
    float: right;
}
.profile-card-social li , .profile-card-social li a  {
    float: left;
}
.profile-card-social li a {
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-left: 1px solid #eee;
    background: #fff;
}
.profile-card-social li a:hover {
    background: #f9f9f9;
}
.profile-card-footer_title {
    float: left;
    padding-left: 30px;
    height: 50px;
    line-height: 50px;
    font-weight: 600;
}
.pc_contacts {
    padding: 10px 0;
}
.pc_contacts ul {
    background: #fff;
    padding: 6px 20px;
    box-shadow: 0 15px 20px rgb(0 0 0 / 3%);
}
.pc_contacts ul li {
    text-align: left;
    width: 100%;
    padding: 15px 0;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
}
.pc_contacts ul li:first-child {
    border-bottom: 1px solid #eee;
}
.pc_contacts ul li span {
    padding-right: 10px;
}
.ideaboxWeather:before{
    content:'';
    position:absolute;
    top:0;left:0;right:0;height:100%;
    background-size:cover;
    background-attachment:scroll;
    background-position:center;
    background-repeat:repeat;
    background-origin:content-box;
    background-image:url("../images/bg/7.jpg");
    z-index:1
}
/*------ video ------------------------------------------------------*/
.dark-bg {
    background: #191919;
}
.video-section-title {
    margin-bottom: 30px;
}
.video-section-title:before {
    content: '';
    position: absolute;
    left: 40%;
    right: 200px;
    height: 1px;
    bottom: 12px;
    background: rgba(255,255,255,0.1);
}
.video-section-title h2 {
    text-align: left;
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    float: left;
}
.video-section-title h4 {
    float: left;
    margin-left: 20px;
    color: #bfc2c9;
    font-weight: 600;
    padding-top: 14px;
}
.video-section-title a {
    float: right;
    color: #fff;
    padding: 10px 40px;
    border-radius: 2px;
    font-weight: 600;
    font-size: 10px;
    text-transform: uppercase;
}
.video-section-title a i {
    margin-left: 10px;
}
.video-holder-title .post-category-marker  {
    position: absolute;
    right: 20px;
    top: 26px;
}
.video-holder {
    height: 370px;
    overflow: hidden;
}
.vh-preloader {
    position: absolute;
    top: 66px;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.7);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    z-index: 20;
    display: none;
}
.big_prom {
    position: absolute;
    z-index: 10;
    width: 60px;
    height: 60px;
    line-height: 60px;
    background: #fff;
    top: 50%;
    left: 50%;
    margin: -30px 0 0 -30px;
    border-radius: 50%;
    box-shadow: 0px 0px 0px 16px rgb(255 255 255 / 30%);
    transition: all .3s ease-in-out;
}
.video-holder:hover .big_prom {
    box-shadow: 0px 0px 0px 26px rgb(255 255 255 / 30%);
}
.video-holder-title  {
    padding: 15px 20px;
    background: #222;
    z-index: 20;
}
.video-holder-title_item {
    font-size: 18px;
    text-align: left;
    color: #fff;
    font-weight: 600
}
.video-holder-title_item a {
    color:#fff
}
.video-main-cont {
    float: left;
    width: calc(100% - 430px);
    position: relative;
}
.video-links-wrap {
    position: absolute;
    right: 0;
    top: 0;
    width: 420px;
    max-height: 516px;
    overflow: auto;
    padding: 0 16px 0 0px;
}
.video-links-wrap .ps__rail-y:before {
    border-left: 1px solid rgba(255,255,255,0.2);
}
.video-links-wrap .video-item {
    cursor: pointer;
}
.video-item {
    margin-bottom: 10px;
}
.video-item:last-child {
    margin-bottom: 0;
}
.video-item-img {
    overflow: hidden;
}
.video-item-title {
    position: absolute;
    bottom: 0;
    z-index: 20;
    left: 0;
    right: 0;
    padding: 10px 20px 20px;
}
.play-icon {
    position: absolute;
    left: 26px;
    width: 40px;
    height: 40px;
    top: 30px;
    line-height: 40px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0px 0px 0px 6px rgb(255 255 255 / 30%);
    z-index: 10;
    font-size: 9px;
    transition: all .3s ease-in-out;
    cursor: pointer;
}
.video-item_active .play-icon , .play-icon:hover {
    color:#fff;
    box-shadow: 0px 0px 0px 10px rgb(255 255 255 / 30%);
}
.video-item-img:before , .grid-post-media.gpm_sing:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,rgba(0, 0, 0, 0.9) 90%);
}
.grid-post-media.gpm_sing:before {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,rgba(0, 0, 0, 0.8) 90%);
}
.video-item .post-category-marker  {
    position: absolute;
    right: 20px;
    top: 30px;
    z-index: 10;
}
.video-item img {
    transition: all .3s ease-in-out;
    transform: scale(1.0);
}
.video-item:hover img  {
    transform: scale(1.1);
}
.video-item-title h4 {
    text-align: left;
    color: #fff;
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
}
.video-item-title h4 a {
    color: #fff
}
.video-date {
    float: left;
    color: #fff;
    font-size: 11px;
    margin-top: 6px;
    font-weight: 500;
}
.video-date i {
    margin-right: 10px;
}
.video_carousel-wrap {
    margin-top: 40px;
}
.video_carousel-container {
    background: #222;
    padding: 20px 40px 30px;
}
.video_carousel_title h4 {
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #fff;
}
.vc-item-title {
    padding: 10px 0 0 0;
}
.no-bottom-padding {
    padding-bottom: 0;
}
.video_carousel-wrap:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 30%;
    background: #fff;
}
.video_carousel .video-item {
    border-radius: 4px;
    overflow: hidden;
}
.cc_btn {
    position: absolute;
    bottom: 50%;
    width: 36px;
    height: 36px;
    line-height: 36px;
    margin-bottom: -18px;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
}
.cc-prev {
    left: -18px;
}
.cc-next {
    right: -18px;
}
.vc-pagination {
    position: absolute;
    right: 40px;
    top: 24px;
}
.pag-style .swiper-pagination-bullet , .multi-pag .swiper-pagination-bullet {
    opacity: 1;
    background: #fff;
    margin: 0 8px;
    display: inline-block;
    width: 6px;
    height: 6px;
    position: relative;
    border-radius: 100%;
    transition: all 300ms ease-out;
}
.multi-pag .swiper-pagination-bullet {
    float: left;
}
.pag-style .swiper-pagination-bullet:before  , .sgs-pagination .swiper-pagination-bullet:before , .multi-pag .swiper-pagination-bullet:before ,   .hero-carousel-pag .swiper-pagination-bullet:before {
    content: '';
    position: absolute;
    left: -7px;
    top: -7px;
    right: -7px;
    bottom: -7px;
    border-radius: 50%;
    box-sizing: border-box;
    border: 1px solid rgba(255,255,255,0.4);
    transition: all 300ms ease-out;
    transform: scale(0);
}
.pag-style .swiper-pagination-bullet.swiper-pagination-bullet-active:before , .sgs-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before , .multi-pag .swiper-pagination-bullet.swiper-pagination-bullet-active:before , .hero-carousel-pag .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
    transform: scale(1.0);
}
.resp-video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-bottom: 20px;
}
.resp-video iframe,
.resp-video object,
.resp-video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*------  categoties ------------------------------------------------------*/
.post-category-marker {
    padding: 6px 13px;
    border-radius: 2px;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    background: rgba(0,0,0,0.6);
}
/*------404------------------------------------------------*/
.error-section {
    padding-top: 20px;
}
.error-wrap {
    padding:0 0 40px 0;
}
.error-wrap h2 {
    font-size: 194px;
    color: #fff;
    font-weight: 600;
    letter-spacing: 10px;
    position: relative;
    font-family: 'Playfair Display', cursive;
}
.error-wrap h2:before {
    content: '';
    position: absolute;
    left: 50%;
    width: 50px;
    height: 2px;
    bottom: 30px;
    margin-left: -30px;
}
.error-wrap p {
    color: #fff;
    font-size: 12px;
    text-align: center;
}
.error-wrap form {
    margin: 30px auto 20px;
    max-width: 550px;
    overflow: hidden;
    border-radius: 2px;
    position: relative;
    box-shadow: 0px 0px 0px 7px rgba(255, 255, 255, 0.2);
}
.error-wrap form.custom-form input {
    float: left;
    width: 100%;
    border: none;
    background: #fff;
    height: 50px;
    padding: 0 100px 0 20px;
    z-index: 1;
    margin: 0;
}
.error-wrap form .search-submit {
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 50px;
    line-height: 50px;
    z-index: 2;
    color: #fff;
    border: none;
    cursor: pointer;
}
.error-wrap form .search-submit:hover {
    background: #292929;
}
.error-wrap a.btn {
    display: inline-table;
    margin-top: 10px;
    float: none;
}
/*------  contacts------------------------------------------------------*/
.contacts-list {
    background: #f9f9f9;
    border: 1px solid #eee;
    padding: 15px 20px;
}
.contacts-list li {
    float:left;
    width:100%;
    height: 45px;
    line-height: 45px;
    border-bottom: 1px dashed #ddd;
    font-weight: 500;
}
.contacts-list li:last-child {
    border:none;
}
.contacts-list  li span  {
    float:left;
    text-align:left;
    min-width:80px;
    color: #666;
}
.contacts-list li span i {
    margin-right:7px;
    font-size:14px;
}
.contacts-list li a {
    margin-left:20px;
    color:#333;
    text-align: left;
    float:left;
}
.cs-title {
    margin-right: 20px;
    text-transform: uppercase;
    font-weight: 600;
    position: relative;
    top: 10px;
    font-size: 11px;
    color: #000;
}
.contacts-opt {
    margin: 10px 0 40px 0;
}
.contact-social  {
    float: right;
    margin:20px 0 40px;
}
.contact-social li , .contact-social .cs-title , .contact-social ul {
    float: left;
}
.contact-social li ul {
    border: 1px solid #eee;
}
.contact-social li a {
    width: 32px;
    height: 32px;
    line-height: 32px;
    margin-left: 2px;
    border-radius: 4px;
    float: left;
    color: #fff;
    background: #333;
}
.contact-social li a:hover {
    background: #222;
}
/*------ shop-------------------------------------------------*/
.det-box h3 {
    float:left;
    text-align:left;
    font-size:16px;
    padding-bottom:8px;
    font-weight:700;
    width:100%;
}
.det-box {
    float:left;
    width:100%;
    margin-bottom:30px;
    position:relative;
    overflow: hidden;
}
.det-box-media {
    position: relative;
    display: block;
    z-index: 8;
    overflow: hidden;
    border-radius: 6px 6px 0 0;
}
.det-box-ietm {
    background: #fff;
    padding: 25px 30px;
    border-radius: 0 0 6px 6px;
    border: 1px solid #eee;
    border-top: none;
}
.det-box-media:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: #292929;
    opacity: 0;
    z-index: 2;
    transition: all .3s ease-in-out;
}
.det-box-media span {
    z-index: 5;
    position: absolute;
    left: 50%;
    top: 40%;
    opacity: 0;
    height: 36px;
    line-height: 36px;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 10px;
    width: 130px;
    color: #fff;
    border-radius: 4px;
    margin: -13px 0 0 -65px;
    transition: all .3s ease-in-out;
}
.det-box-media:hover:before {
    opacity: .4;
}
.det-box-media:hover span {
    top:50%;
    opacity: 1;
}
.shop-item-grid {
    padding:130px 30px;
    margin-bottom:20px;
    position:relative;
    overflow:hidden;
    border-radius:2px;
}
.listing-item-grid .d-gr-sec:before {
    opacity:0.7;
}
.shop-item-grid_title {
    position:absolute;
    left:30px;
    bottom:14px;
    right:30px;
    z-index:10;
    text-align:left;
}
.shop-item-grid_title h3 , .shop-item-grid_title h3 a  , .shop-item-grid:hover p {
    color:#fff;
}
.shop-item-grid_title p {
    color:rgba(255,255,255,0.7);
    transition: all .3s ease-in-out 0s;
}
.shop-item-grid_title h3  {
    font-weight:700;
    padding-bottom:5px;
    margin-bottom:10px;
    font-size:16px;
    position:relative;
}
.shop-item-grid_title h3:before {
    content:'';
    position:absolute;
    left:0;
    bottom:0;
    width:20px;
    height:2px;
}
.shop-item-grid .shop-counter {
    position:absolute;
    left:20px;
    top:30px;
    z-index:10;
    padding: 8px 16px;
    color: #292929;
    border-radius: 2px;
    font-size: 11px;
    font-weight: 600;
}
.shop-item-grid .shop-counter span {
    padding-right:6px;
}
.d-gr-sec {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 2;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.95) 100%);
}
.shop-header  {
    background: #fff;
    padding: 15px 30px;
    box-shadow: 0 19px 20px rgba(58, 87, 135, 0.08);
    margin-bottom:20px;
}
.hero-wrap_custom_title {
    margin-top: 70px;
}
.hero-search {
    background: #fff;
    border-radius: 2px;
    padding: 80px 30px 30px;
    box-shadow: 0px 0px 0px 6px rgb(255 255 255 / 30%);
}
.hero_prwarp {
    padding: 0 0 0 60px;
}
.hero_prwarp-title {
    position: absolute;
    left: 0;
    top: 20px;
    font-size: 11px;
    color: #666;
    font-weight: 600;
}
.hero-search-title {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 0 30px;
    height: 60px;
    line-height: 60px;
    border-bottom: 1px solid #eee;
    text-align: left;
    color: #292929;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
}
.hero-search-title i {
    margin-right: 15px;
    font-size: 14px;
    position: relative;
    top: 1px;
}
.hero-search-submit {
    height: 50px;
    line-height: 50px;
    border: none;
    border-radius: 2px;
    text-transform: uppercase;
    -webkit-appearance: none;
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    background: #292929;
}
.hero-search-submit:hover {
    color: #292929;
}
.hero-search-submit i {
    margin-right: 10px;
}
.shop-header  .nice-select {
    border: 1px solid #eee;
    background: #f5f5f5;
}
.box-widget-content .irs-single {
    color: #fff
}
.shop-header_opt {
    float:right;
    width:200px;
}
.shop-header  h4 {
    float:left;
    font-size:14px;
    font-weight:600;
    position:relative;
    top:15px;
}
.price-rage-wrap.shop-rage-wrap {
    padding-left: 0;
    padding-right: 70px;
}
.shop-rage-wrap .srw_btn {
    position: absolute;
    right: 0;
    width: 60px;
    height: 28px;
    line-height: 28px;
    color: #fff;
    top: 8px;
    font-size: 10px;
    font-weight: 600;
}
.shop-rage-wrap .srw_btn:hover {
    background: #222;
}
.radio-group input[type=radio] {
    position: absolute;
    visibility: hidden;
    display: none;
}
.radio-group label {
    color: #666;
    float: left;
    padding: 12px 0;
    cursor: pointer;
    width: 33.3333333%;
    font-weight: 500;
    font-size: 11px;
}
.radio-group input[type=radio]:checked + label {
    color: #292929;
}
.radio-group label + input[type=radio] + label {
    border-left:1px solid #e1e1e1;
}
.radio-group {
    border: 1px solid #e1e1e1;
    background: #f2f2f2;
    border-radius: 2px;
    overflow: hidden;
}
.reviews_counter_wrap {
    float: left;
    margin-bottom: 15px;
}
.reviews_counter_wrap_text , .reviews_counter_wrap .star-rating {
    float:left;
}
.reviews_counter_wrap_text {
    font-size: 11px;
    color: #666;
    font-weight: 500;
    margin-top: 1px;
}
.reviews_counter_wrap .star-rating i {
    margin: 0 1px;
    font-size: 10px;
}
.reviews_counter_wrap .star-rating {
    margin-right: 10px;
}
.grid-item_price_item{
    font-size: 11px;
    position: relative;
    float:left;
    font-weight: 600;
    text-transform: uppercase;
    color: #777;
    top: 0px;
}
.grid-item_price_item strong {
    font-size: 17px;
    color: #333;
    position: relative;
    top: 1px;
    margin-left: 7px;
    font-weight: 700;
}
.grid-item_price {
    border-top:1px solid #eee;
    padding-top: 15px;
}
.grid-item_price .add_cart {
    float: right;
    padding: 8px 10px;
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    background: #222;
    color: #fff;
    border-radius: 4px;
    text-transform: uppercase;
}
.grid-item_price .add_cart i {
    margin-right: 6px;
}
.grid-item_price .add_cart:hover {
    color: #ccc;
}
.detbox_notifer {
    position:absolute;
    top: 0;
    right: 0;
    padding: 12px 15px;
    font-size: 11px;
    font-weight: 600;
    z-index: 50;
    color: #fff;
    box-shadow: 0px 0px 0px 6px rgb(255 255 255 / 40%);
}
.shop_post-content {
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
    margin: 20px 0;
}
.det-box-ietm.dbi_shop {
    padding-bottom: 15px;
}
.shop-header-title {
    background: #f9f9f9;
    padding: 30px 35px 20px;
    border: 1px solid #eee;
    border-bottom: none;
}
.shop-header-title .qty_btn input {
    background: #fff;
}
.shop-header-title h2 {
    text-align: left;
    font-size: 22px;
    font-weight: 700;
    border-bottom: 1px solid #ddd;
    padding-bottom: 15px;
}
.shop-header-title h2 span {
    font-size: 12px;
    color:#666;
    font-weight: 500;
    margin-left: 10px;
    position: relative;
    top: -12px;
}
.shop-header-title_opt , .shop-header-title_opt li  {
    float:left;
}
.shop-header-title_opt  {
    margin-top:10px;
}
.shop-header-title_opt li , .shop-header-title .single_post-opt li {
    margin-right:20px;
}
.shop-header-title .single_post-opt {
    margin-top:16px;
}
.shop-header-title_opt li .reviews_counter_wrap {
    margin-top: 5px;
}
.qty_btn {
    float:right;
    margin-top: 20px;
}
.qty_btn .btn {
    border:none;
    margin-top:0;
    height: 48px;
    padding: 0 36px;
    cursor: pointer;
    line-height: 48px;
}
.qty_btn  input {
    float:left;
    border:1px solid #eee;
    margin-right:10px;
    background:#f9f9f9;
    position:relative;
    height: 50px;
}
.content-table table{
    width: 100%;
    margin-top:20px;
    float:left;
}
.content-table table td, .content-table table th{
    padding: 18px 30px;
    font-size: 12px;
    line-height: 24px;
    font-weight: 500;
}
.content-table table td, .content-table table th{
    border-left: 1px solid #E2E6E7;
}
.content-table table td:first-child, .content-table table th:first-child{
    text-align: left;
    border-left: none;
}
.content-table table.align-left td:first-child,  .content-table table.align-left th:first-child{
    text-align: left;
}
.content-table table tr:nth-child(odd){
    background: #F5F5F5;
}
.mar-top {
    margin-top:30px;
}
.leave-rating-wrap {
    top: -6px;
    margin:0 0 20px 0;
}
.leave-rating, .leave-rating-title {
    float: left;
}
.leave-rating-title {
    margin-right:10px;
    font-size:12px;
    color:#000;
    position:relative;
    font-weight: 600;
}
.leave-rating input[type="radio"] {
    display: none;
}
.custom-form .leave-rating label {
    font-size: 14px;
    float: right;
    letter-spacing: 4px;
    cursor: pointer;
    transition: 0.3s;
    font-weight:500;
    width: auto;
}
.leave-rating label:hover:before  , .leave-rating label.selected:before {
    font-weight:900;
}
.leave-rating:hover input[type="radio"]:checked~label:before , .leave-rating input[type="radio"]:checked~label:before  , .leave-rating label:hover~label:before{
    font-weight:900!important;
}
.checkout-table {
    border: 1px solid #eee;
    float:left;
    width:100%;
    font-size:12px;
    background:#fff;
    font-weight: 600;
}
.checkout-table > tbody > tr > td,
.checkout-table > tbody > tr > th,
.checkout-table > tfoot > tr > td,
.checkout-table > tfoot > tr > th,
.checkout-table > thead > tr > td,
.checkout-table > thead > tr > th {
    border-top: 1px solid #eee;
    padding: 12px;
    border-right: 1px solid #eee;
}
.checkout-table tr td:nth-child(odd) {
    background:#f9f9f9;
}
.checkout-table tbody tr td:first-child,
.checkout-table tbody tr th:first-child {
    max-width: 56px;
    background:#fff;
    border-right: 1px solid #eee;
}
.pr-remove {
    vertical-align: middle !important;
    text-align: center;
}
.order-money {
    font-size:12px;
}
.order-count {
    border:none;
    width:60px;
    height:50px;
    text-align:center;
    font-weight:bold;
}
.pr-remove {
    font-size: 10px;
}
.pr-remove:hover i {
    color:#292929;
}
.product-name {
    font-weight:500;
}
.coupon-holder {
    margin-top:30px;
    padding: 12px 0 0 0;
}
.coupon-holder input{
    float:left;
    margin-bottom:20px;
    font-size: 14px;
    height:50px;
    border-radius: none;
    position:relative;
    z-index:20;
    padding-left:18px;
    color:#000;
    border:0;
    border:1px solid #eee;
    background:#fff;
}
.coupon-holder button {
    float:left;
    height:50px;
    border:none;
    color:#fff;
    cursor:pointer;
    padding:0 40px;
    font-size: 10px;
    font-weight: 600;
    border-radius: 4px;
    background:#292929;
    -webkit-appearance: none;
    font-family: 'Poppins', sans-serif;
    transition: all 0.3s ease-in-out;
}
.coupon-holder button.btn-uc {
    float:right;
}
.coupon-holder button:hover {
    color:#ccc;
}
h4.cart-title {
    font-size:15px;
    font-weight:600;
    margin-bottom:20px;
    text-align:left;
    color: #000;
}
h4.cart-title span {
    padding: 0 2px;
    color: #555;
}
.cart-totals  button {
    float:right;
    margin-top:40px;
    height:48px;
    border:none;
    color:#fff;
    width:100%;
    cursor:pointer;
    padding:0 20px;
    font-size: 11px;
    font-weight: 600;
    -webkit-appearance: none;
    position:relative;
    border-radius: 4px;
    z-index:2;
    font-family: 'Poppins', sans-serif;
    transition: all 0.3s ease-in-out;
}
.cart-totals  button:hover {
    background:#fff;
}
.cart-totals:before {
    content: '';
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border: 1px solid rgba(255,255,255,0.2);
    z-index: 2;
    box-shadow: 0px 0px 0px 20px rgba(255,255,255,0.03);
}
.cart-totals {
    padding:66px 50px;
    background:#292929;
}
.cart-totals:after {
    font-family: Font Awesome\ 5 Pro;
    content:'\f83e';
    position:absolute;
    right:50px;
    top:30px;
    font-size: 44px;
    color: rgba(255,255,255,0.1);
    z-index: 1;
}
.cart-totals h3 {
    font-size:20px;
    font-weight:500;
    text-align:left;
    padding-bottom:20px;
    color: #fff;
}
.total-table {
    width:100%;
    float:left;
    position:relative;
    z-index:2;
}
.total-table tr {
    font-size:14px;
    text-align:right;
}
.total-table  th , .total-table tr  {
    padding:15px 0;
    color:#fff;
}
.total-table th {
    border-bottom:1px solid rgba(255,255,255,0.1);
    text-align:left;
    font-size: 12px;
}
.tab-content   {
    width: 100%;
    display: none;
    float:left;
}
.tab{
    width: 100%;
    float:left;
}
.first-tab {
    display: block;
}
.shop-tabs-menu {
    margin-bottom: 20px;
}
.shop-tabs-menu , .shop-tabs-menu li {
    float: left;
}
.shop-tabs-menu li {
    margin-right: 10px;
    position: relative;
    z-index: 3;
}
.shop-tabs-menu li  a {
    padding-top: 12px;
    padding-bottom: 12px;
    background: #f5f5f5;
}
.shop-tabs .content-table table {
    margin: 0 0 20px;
}
.shop-tabs-menu:before , .shop-tabs-menu:after {
    content: '';
    position: absolute;
    left: 20%;
    height: 1px;
    right: 0;
    background: #eee;
    top: 50%;
    z-index: 1;
}
.shop-tabs-menu:after {
    left: auto;
    width: 40px;
    z-index: 2;
}
.item-related {
    text-align:left;
}
.item-related_content {
    padding: 15px 20px;
    background: #f9f9f9;
    border: 1px solid #eee;
    border-top: none;
}
.post-related h6 {
    margin-bottom:20px;
}
.item-related img {
    width:100%;
    height:auto;
}
.item-related h3 {
    float:left;
    width:100%;
    font-weight:600;
    font-size:14px;
    padding-bottom: 4px;
}
.item-related {
    padding-top:15px;
    padding-bottom:15px;
}
.item-related_title {
    float: left;
    width: 100%;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    color: #292929;
    margin: 30px 0 20px;
    position: relative;
}
.item-related_title:before {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 30px;
    height: 3px;
}
.about-img img {
    position: relative;
    z-index: 10;
}
.about-img-hotifer {
    position: absolute;
    right: -60px;
    bottom: 20px;
    width: 280px;
    padding: 25px 30px;
    z-index: 11;
    border-radius: 4px;
    color: #fff;
    text-align: left;
    box-shadow: 0 5px 25px rgba(0,0,0,0.2);
}
.about-img-hotifer:before {
    font-family: Font Awesome\ 5 Pro;
    content: "\f10e";
    bottom: 30px;
    right: 20px;
    position: absolute;
    color: #fff;
    font-size: 19px;
    font-weight: bold
}
.about-wrap p {
    font-size: 15px;
}
.about-img-hotifer p {
    color: #fff;
    font-size: 13px;
    margin-bottom: 10px;
    text-align: left;
    font-weight: 600;
}
.about-wrap .btn {
    margin-top: 30px;
}
/* CMS pages are edited in CKEditor, which writes hard pixel widths onto
   resized images and tables (e.g. width:856px). Those widths are wider than
   the col-md-8 text column, so the content spilled over the sidebar and its
   banner adverts. Cap anything the editor drops in to the column width. */
.about-wrap {
    overflow-wrap: break-word;
}
.about-wrap img,
.about-wrap figure,
.about-wrap table,
.about-wrap iframe,
.about-wrap video {
    max-width: 100% !important;
    height: auto;
}
/* Where the content wraps media in an editor table, the table sizes to its
   cell's max-content width (the image's width attribute), so the cap above
   never gets a chance to bite. Fixed layout hands the cap back control. */
.about-wrap table {
    table-layout: fixed;
    width: 100% !important;
}
.pad-con {
    padding-left: 50px;
}
/*------  Responsive ------------------------------------------------------*/
@media only screen and  (max-width: 1064px) {
    .aside-panel , .header_news-ticker-wrap  {
        display: none;
    }
    .hero-slider-wrap , .hero-slider-container , .hero-slider-container .swiper-container {
        height: auto;
    }
    #hero-main-slider .swiper-slide {
        height: auto;
        display: flex;
        flex-direction: column;
    }
    #hero-main-slider .swiper-slide .bg-wrap {
        position: relative;
        width: 100%;
        aspect-ratio: 1750 / 650;
        overflow: hidden;
        flex: none;
    }
    #hero-main-slider .swiper-slide .bg {
        transform: none !important;
    }
    .hero-slider_controls-wrap {
        display: none;
    }
    #hero-main-slider .hero-item {
        position: relative;
        width: 100%;
        background: #111;
        padding-top: 25px;
        padding-bottom: 90px;
        flex: 1;
    }
    .hero-slider-wrap .fs-slider_btn {
        top: auto;
        margin-top: 0;
        right: auto;
        bottom: 30px;
        left: 40px;
    }
    .hero-slider-wrap .fs-slider-button-next {
        margin-left: 50px;
    }
    .single-grid-slider:not(.slider_widget) .swiper-slide , .fs-carousel .swiper-slide {
        height: auto;
        display: flex;
        flex-direction: column;
    }
    .single-grid-slider:not(.slider_widget) .swiper-slide .grid-post-item , .fs-carousel .swiper-slide .grid-post-item {
        display: flex;
        flex-direction: column;
        flex: 1;
    }
    .single-grid-slider:not(.slider_widget) .grid-post-media.gpm_sing , .fs-carousel .grid-post-media.gpm_sing {
        padding: 0;
        height: auto;
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    .single-grid-slider:not(.slider_widget) .gpm_sing .bg , .fs-carousel .gpm_sing .bg {
        position: relative;
        width: 100%;
        height: auto;
        aspect-ratio: 860 / 400;
        flex: none;
    }
    .single-grid-slider:not(.slider_widget) .gpm_sing .author-link , .fs-carousel .gpm_sing .author-link {
        left: 20px;
        top: 15px;
    }
    .single-grid-slider:not(.slider_widget) .gpm_sing .grid-post-media_title , .fs-carousel .gpm_sing .grid-post-media_title {
        position: relative;
        width: 100%;
        background: #111;
        padding: 15px 20px 20px;
        flex: 1;
    }
    #hero-main-slider .hero-item:before {
        display: none;
    }
    .cen-align-container {
        padding-left: 0;
        border-left: none;
    }
    .pad-con {
        padding:30px  0 0;
    }
    .nav-button-wrap {
        float:right;
        height:70px;
        width:70px;
        cursor:pointer;
        position:relative;
        display: block;
        border-left:1px solid #eee;
        left:0px;
    }
    .nav-button  {
        position:absolute;
        top:50%;
        left:50%;
        width:22px;
        height:20px;
        margin-left:-11px;
        margin-top:-6px;
    }
    .nav-button span{
        float:left;
        width:100%;
        height:2px;
        background:#000;
        margin-bottom:4px;
        border-radius:4px;
        -webkit-transition: all 200ms linear;
        transition: all 200ms linear;
    }
    .nav-button span:first-child {
        width: 50%;
    }
    .main-menu nav ul {
        display:none;
    }
    .main-menu{
        position: absolute  ;
        top:70px;
        right:-20px;
        width:300px;
        z-index:50;
        padding:15px 10px ;
        background:#292929;
        visibility:hidden;
        opacity:0;
        -webkit-transition: all 0.4s  ease-in-out;
        transition: all 0.4s  ease-in-out;
    }
    .vismobmenu {
        opacity:1;
        right:0;
        visibility:visible;
    }
    .menusb {
        display:block;
        float:left;
        position:relative;
        width:100%;
        overflow:hidden;
    }
    .main-menu .menusb ul  {
        display:block;
        float:left;
        position:relative;
        width:100%;
    }
    .menusb li {
        margin: 0;
        float: left;
        width:100%;
        position:relative;
        overflow:hidden;
        padding:0 20px;
    }
    .menusb li i {
        position:absolute;
        right:18px;
        top:12px;
    }
    .menusb li i:before {
        content:"\f0da"
    }
    .menusb  a {
        float:left;
        width:100%;
        padding:8px 5px;
        position:relative;
        font-weight: 600;
        text-transform:uppercase;
        font-size: 13px;
        color: #fff;
        line-height:20px;
        text-align:left;
    }
    .menusb a.back{
        padding-left:24px;
    }
    .menusb a.back:before{
        font-family: Font Awesome\ 5 Pro;
        content: "\f0d9";
        font-size:14px;
    }
    .sidebar-content {
        border-left: none;
        margin-top: 30px;
    }
    .box-widget {
        margin:0 0 30px;
        padding-left: 0;
    }
    .main-footer , #footer-twiit li  , #footer-twiit p.tweet  , .slider_widget .grid-post-media_title .video-date , .slider_widget .grid-post-media_title .post-opt , .footer-widget , .fs-carousel-wrap_title , .about-img-hotifer {
        width:100%;
    }
    #footer-twiit li , .footer-widget , .fs-carousel-wrap_title  , .topbar-social , .about-img-hotifer {
        float: left;
    }
    .topbar-social {
        margin-left: 10px;
    }
    .post-opt li {
        float: none;
        display: inline-block;
    }
    .footer-widget  {
        margin-bottom: 20px;
    }
    .fs-carousel-wrap {
        padding-left: 0;
    }
    .fs-carousel-wrap_title {
        position: relative;
        padding: 120px 50px;
    }
    .video-main-cont {
        width: calc(100% - 340px);
    }
    .video-links-wrap {
        width: 330px;
    }
    .picker-wrap-container , .about-img   , .about-img-hotifer , .cart-totals {
        margin-top: 30px;
    }
    .profile-card-wrap {
        margin-bottom: 30px;
    }
    .gallery-item {
        width: 50%
    }
    .about-img-hotifer{
        position: relative;
        right: 0;
        bottom: 0;
    }
}
@media only screen and  (max-width: 856px) {
    .main-register-wrap {
        padding-left: 0;
    }
    .main-register_bg , .hero-slider_controls-wrap , .spc_column:before  {
        display: none;
    }
    .video-main-cont , .video-links-wrap , .ajax-nav , .video-section-title a , .single-post-content_column , .steader_opt_abs , .gallery-items , .qty_btn  {
        width: 100%;
    }
    .video-section-title a {
        margin-top: 10px;
    }
    .qty_btn .btn , .shop-header-title .single_post-opt {
        float: left;
    }
    .video-links-wrap {
        position: relative;
        float: left;
        margin-top: 10px;
        padding: 0 16px 0 0px;
    }
    #hero-main-slider .hero-item {
        padding-bottom: 100px;
    }
    .ajax-nav {
        position: relative;
        float: left;
        clear: both;
        bottom: 0 ;
        background: #f9f9f9;
        margin: 46px 0 20px;
    }
    .fs-slider_btn {
        top: auto;
        bottom: 40px;
        right: auto;
        left: 40px;
    }
    .fs-slider-button-prev {
        margin-top: 0;
    }
    .fs-slider-button-next {
        margin-left: 50px;
    }
    .spc_column {
        padding-left: 0;
    }
    .ver-share {
        margin: 10px 0 20px;
        border-bottom: 1px solid #eee;
        padding-bottom: 20px;
    }
    .single-post-content_column , .ver-share .share-title , .gallery-items {
        position: relative;
        float: left;
    }
    .ver-share .share-container {
        width: auto;
        margin: -6px 0 0 20px;
    }
    .ver-share .share-container .share-icon {
        border-left: 1px solid #eee;
        border-bottom: none;
    }
    .ver-share .share-container .share-icon:last-child {
        border-left: 1px solid #eee;
    }
    .ver-share .share-container .share-icon:first-child {
        border:none;
    }
    .steader_opt_abs {
        position: relative;
        float: left;
        margin: 40px 0 30px;
    }
}
@media only screen and  (max-width: 630px) {
    .spc_column:before , .comment-author:before , .single-post-nav:before {
        display: none;
    }
    .video-holder-title .post-category-marker {
        right: auto;
        left: 20px;
        top: -16px;
    }
    .logo-holder {
        top: 16px;
        left: 10px;
        height: 15px;
    }
    .header-inner , .show-cart, .srf_btn, .search_btn , .nav-button-wrap{
        height: 50px;
    }
    .show-cart, .srf_btn, .search_btn , .nav-button-wrap {
        width: 50px;
        line-height: 50px;
    }
    .header-inner .container , .top-bar .container , .picker-wrap .list-post .list-post-media, .picker-wrap .list-post .list-post-content , .list-post-media , .list-post-content , .subfooter-nav , .single-post-header .post-opt , .fontSize , .spn_box , .spn_box_img , .share-holder.hor-share , .profile-card-footer_soc , .load-more_btn , .social-widget a  , .gallery-item {
        width: 100%;
    }
    .picker-wrap .list-post .list-post-media, .picker-wrap .list-post .list-post-content , .subfooter-nav , .single-post-header .post-opt , .print-btn , .spn_box_img , .share-holder.hor-share , .load-more_btn  {
        float: left;
    }
    .social-widget a {
        float: left;
        margin: 0 0 10px 0;
    }
    .list-post-content {
        padding: 3px 0 0 0;
    }
    .single-post-header .post-opt ,  .share-holder.hor-share   {
        margin-top: 10px;
    }
    .picker-wrap .list-post .list-post-media , .list-post-media{
        margin-bottom: 20px;
    }
    .nav-button span{
        float:left;
        width:100%;
        height:2px;
        background:#000;
        margin-bottom:4px;
        border-radius:4px;
        -webkit-transition: all 200ms linear;
        transition: all 200ms linear;
    }
    .show-cart_count {
        bottom: 6px;
        left: 6px;
    }
    #wrapper {
        padding-top: 120px;
    }
    .main-menu , .header-cart_wrap{
        top:50px;
    }
    .header-cart_wrap {
        right: 0;
        width: 300px;
    }
    .main-footer {
        padding: 60px 0 0;
    }
    .footer-bottom {
        margin-top: 30px;
    }
    .subfooter-nav li {
        float: left;
        margin:0 10px 0 0;
    }
    .hero-item h2 , .hero-section_title h2 {
        font-size: 25px;
        line-height: 32px;
    }
    .scroll-down-wrap.scw_transparent {
        bottom: -50px;
        left: 0;
        right: auto;
    }
    .hero-section {
        padding: 150px 0 80px;
    }
    .hero-item h4 {
        font-size: 12px;
        line-height: 20px;
    }
    .single-post-header h1 {
        font-size: 20px;
    }
    .single-post-nav_prev , .single-post-nav_next {
        padding:0;
    }
    .single-post-nav_prev , .cookie-info-bar_title   {
        margin-bottom: 20px;
    }
    .spn_box_img {
        position: relative;
        margin-bottom: 20px;
    }
    .tags-title {
        margin: 10px 20px 20px 0;
    }
    .comment {
        padding: 0 0 30px 0;
    }
    .comment-author , .comment-author img {
        width: 40px;
        height: 40px;
        z-index: 20;
    }
    .comment-author  {
        top: 20px;
        left: 30px;
    }
    .comment-body h4 {
        margin-left: 50px;
    }
    .comment_reply {
        width: calc(100% - 40px);
    }
    .comment_reply:before {
        top: -10px;
        left: -30px;
        width: 20px;
        height: 20px;
    }
    .profile-card-footer_soc {
        border-top: 1px solid #eee;
    }
    .shop-header-title .single_post-opt {
        margin-top: 0;
    }
    .shop-header-title {
        padding: 30px 25px 20px;
    }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .bg {
        background-attachment: scroll !important;
        -webkit-background-size:cover;
        background-position:center;
    }
}

/* Custom CSS */
.news-category {
    right: 0;
    bottom: 20px;
    border: 1px solid #ddd;
    overflow: hidden;
    border-radius: 4px;
    width: max-content;
    float: right;
}
.news-category li {
    float: left;
    border-left: 1px solid #ddd;
}
.news-category li:first-child{
    border-left: none;
}
.news-category li a {
    padding: 8px 12px;
    float: left;
    background: #f9f9f9;
    font-weight: 600;
    font-size: 10px;
    text-transform: uppercase;
}
.news-category li a.current_page {
    background: #e93314;
    color: #fff;
}

/*--------------Article content typography (restores heading/paragraph formatting
   for imported WordPress content and CKEditor output)------------------------*/
.single-post-content_text {
    --article-fs: 17px;
    text-align: left;
    font-size: var(--article-fs);
    line-height: 1.75;
    color: #33383d;
}
.single-post-content_text p,
.single-post-content_text li,
.single-post-content_text div {
    text-align: left;
}
.single-post-content_text p {
    font-size: var(--article-fs) !important;
    line-height: 1.75;
    margin: 0 0 18px;
}
/* editor-pasted markup often carries inline font-size / font-family / color on
   spans and paragraphs — normalise it so every article reads the same */
.single-post-content_text p span,
.single-post-content_text li span,
.single-post-content_text p font,
.single-post-content_text span[style],
.single-post-content_text p[style] {
    font-size: inherit !important;
    font-family: inherit !important;
    line-height: inherit !important;
}
.single-post-content_text h1,
.single-post-content_text h2,
.single-post-content_text h3,
.single-post-content_text h4,
.single-post-content_text h5,
.single-post-content_text h6 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700 !important;
    color: #292929;
    text-align: left;
    line-height: 1.3;
    margin: 32px 0 14px;
    clear: both;
}
.single-post-content_text h1 { font-size: 30px !important; }
.single-post-content_text h2 { font-size: 26px !important; }
.single-post-content_text h3 { font-size: 22px !important; }
.single-post-content_text h4 { font-size: 19px !important; }
.single-post-content_text h5 { font-size: 17px !important; }
.single-post-content_text h6 { font-size: 16px !important; }
/* headings wrapped in <strong>/<em>/<span> by the editor must not shrink */
.single-post-content_text h1 *,
.single-post-content_text h2 *,
.single-post-content_text h3 *,
.single-post-content_text h4 *,
.single-post-content_text h5 *,
.single-post-content_text h6 * {
    font-size: inherit !important;
    font-family: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
}
.single-post-content_text h1:first-child,
.single-post-content_text h2:first-child,
.single-post-content_text h3:first-child,
.single-post-content_text h4:first-child {
    margin-top: 0;
}
.single-post-content_text strong,
.single-post-content_text b {
    font-weight: 700;
}
.single-post-content_text em,
.single-post-content_text i {
    font-style: italic;
}
.single-post-content_text ul,
.single-post-content_text ol {
    margin: 0 0 16px 20px;
    text-align: left;
}
.single-post-content_text ul { list-style: disc outside; }
.single-post-content_text ol { list-style: decimal outside; }
.single-post-content_text ul li,
.single-post-content_text ol li {
    margin-bottom: 6px;
    font-size: var(--article-fs);
    line-height: 1.75;
}
.single-post-content_text blockquote {
    float: none;
    width: 100%;
    margin: 20px 0;
    text-align: left;
}
.single-post-content_text blockquote p,
.single-post-content_text blockquote p[style] {
    font-size: calc(var(--article-fs) + 2px) !important;
    line-height: 1.6;
}
.single-post-content_text figure {
    margin: 15px auto;
    max-width: 100%;
    text-align: center;
}
.single-post-content_text figure img {
    max-width: 100%;
    height: auto;
}
.single-post-content_text figcaption,
.single-post-content_text figure em {
    display: block;
    font-size: 14px;
    line-height: 1.5;
    color: #888;
    padding-top: 6px;
    text-align: center;
}
.single-post-content_text figure {
    max-width: 100% !important;
}
.single-post-content_text img {
    max-width: 100%;
    height: auto;
}
.single-post-content_text a {
    color: #e93314;
}
.single-post-content_text table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
}
.single-post-content_text table td,
.single-post-content_text table th {
    border: 1px solid #e5e5e5;
    padding: 8px 10px;
    text-align: left;
}
@media only screen and (max-width: 768px) {
    .single-post-content_text {
        --article-fs: 16px;
    }
    .single-post-content_text p,
    .single-post-content_text ul li,
    .single-post-content_text ol li {
        line-height: 1.7;
    }
    .single-post-content_text h1 { font-size: 26px !important; }
    .single-post-content_text h2 { font-size: 23px !important; }
    .single-post-content_text h3 { font-size: 20px !important; }
    .single-post-content_text h4 { font-size: 18px !important; }
    .single-post-content_text h5 { font-size: 17px !important; }
    .single-post-content_text h6 { font-size: 16px !important; }
}

/*==================================================================
   MOBILE: show slider / grid / post images in FULL (no cropping)
   The .bg divs get inline "background-size:cover" from JS, so these
   overrides use !important to win. contain = whole image visible.
==================================================================*/
@media only screen and (max-width: 1064px) {
    /* Hero main slider — show the entire cover image, centred on dark */
    #hero-main-slider .swiper-slide .bg {
        background-size: contain !important;
        background-repeat: no-repeat !important;
        background-position: center center !important;
        background-color: #111 !important;
        transform: none !important;
    }
    #hero-main-slider .swiper-slide .bg-wrap {
        background-color: #111;
    }

    /* Grid / carousel feature sliders */
    .single-grid-slider:not(.slider_widget) .gpm_sing .bg,
    .fs-carousel .gpm_sing .bg {
        background-size: contain !important;
        background-repeat: no-repeat !important;
        background-position: center center !important;
        background-color: #111 !important;
    }

    /* Any inline <img> never overflows its container on mobile */
    img {
        max-width: 100%;
        height: auto;
    }
}

/* Phones: give the hero image a taller, comfortable box so a fully
   contained 16:9/landscape image still reads well */
@media only screen and (max-width: 767px) {
    #hero-main-slider .swiper-slide .bg-wrap {
        aspect-ratio: 16 / 10;
    }
    .single-post-media img,
    .single-slider img,
    .single-slider-wrap img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }
}

/*------ authors grid ------------------------------------------------*/
.authors-grid {
    display: flex;
    flex-wrap: wrap;
}
.authors-grid .author-grid-col {
    display: flex;
    flex-direction: column;
}
.authors-grid .grid-post-item {
    width: 100%;
}
.authors-grid .grid-post-media .bg {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.authors-grid .grid-post-media .bg.no-avatar {
    background-color: #f5f6fa;
    background-size: 90px 90px;
    background-position: center center;
    background-repeat: no-repeat;
}
.authors-grid .author-grid-name {
    margin-top: 10px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
    min-height: 44px;
}
@media only screen and (max-width: 767px) {
    .authors-grid .grid-post-media {
        height: 180px;
    }
    .authors-grid .grid-post-media .bg.no-avatar {
        background-size: 70px 70px;
    }
}

/*------ two-column post grids (.more-post-wrap) ----------------------------
   These grids sit on the theme's Bootstrap-3 *float* grid (plugins.css sets
   .col-md-* { float: left }). A card taller than its neighbour keeps the left
   column occupied, so the next card cannot clear into the empty slot and
   stacks under the right-hand card instead of starting a new row — the grid
   develops large holes. CSS Grid lays the cards out in real rows, and making
   each card a stretched flex item keeps the bottom rules on one line. */
@media only screen and (min-width: 1064px) {
    .more-post-wrap > .list-post-wrap_column > .row {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
    /* plugins.css gives every .row a Bootstrap-3 clearfix :before/:after. In a
       grid container those pseudo-elements become grid items and swallow the
       first two cells, pushing every real card one slot along. Not needed here
       — grid contains its items without a clearfix. */
    .more-post-wrap > .list-post-wrap_column > .row:before,
    .more-post-wrap > .list-post-wrap_column > .row:after {
        content: none;
        display: none;
    }
    .more-post-wrap > .list-post-wrap_column > .row > [class*="col-"] {
        float: none;
        width: auto;
        display: flex;
        flex-direction: column;
    }
    .more-post-wrap > .list-post-wrap_column > .row > [class*="col-"] > .list-post {
        flex: 1 1 auto;
    }
}
/* Cap headlines at three lines so two cards in the same row stay close in
   height instead of one running to five lines and dwarfing its neighbour. */
.more-post-wrap > .list-post-wrap_column .list-post-content h3 a {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/*------ search results page ------------------------------------------------*/
.search-widget_page {
    margin-bottom: 30px;
}
.search-summary {
    margin-top: 6px;
    font-size: 14px;
    color: #666;
}
.search-summary strong {
    color: #222;
}

/*==================================================================
   MOBILE ADVERTISING
   -----------------------------------------------------------------
   Two problems this block solves:

   1. The skyscraper adverts were invisible below 1064px. The sidebar
      advert carousel carries .single-grid-slider, so the mobile
      overrides written for the *editorial* sliders applied to it too:
      they zero the .gpm_sing padding that gave the slide its height,
      but the advert markup nests the image in an absolutely-positioned
      .bg-wrap, which contributes no height. The slide collapsed to 0px
      and clipped the advert away. Those rules are now scoped with
      :not(.slider_widget) and the advert carousel is sized here from
      its own 300x600 skyscraper ratio.

   2. Adverts all landed near the foot of the page, because the whole
      sidebar stacks under the article/listing column. The advert
      widgets are pulled to the top of the stacked sidebar, and the
      article template shows an in-content unit high up instead of its
      (now hidden) sidebar twin.
==================================================================*/
@media only screen and (max-width: 1064px) {
    /* --- 1. sidebar advert carousel (skyscrapers) --- */
    .slider_widget .swiper-container,
    .slider_widget .swiper-wrapper,
    .slider_widget .swiper-slide,
    .slider_widget .grid-post-item {
        height: auto;
    }
    .slider_widget .grid-post-media.gpm_sing {
        padding: 0;
        height: auto;
    }
    /* Skyscrapers are 300x600. Cap the box so a full-width phone column
       does not stretch one to ~700px tall. */
    .slider_widget .gpm_sing .bg-wrap {
        position: relative;
        width: 100%;
        max-width: 300px;
        margin: 0 auto;
        aspect-ratio: 300 / 600;
        overflow: visible;
    }
    /* .bg-wrap above is the sized box; the image fills it. aspect-ratio is
       reset explicitly because the editorial-slider rules also match .bg
       and would otherwise impose their 860/400 landscape ratio here. */
    .slider_widget .gpm_sing .bg {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        width: auto;
        height: auto;
        aspect-ratio: auto;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        background-position: center center !important;
        background-color: transparent !important;
    }
    /* The gradient overlay only exists to darken editorial thumbnails
       behind a headline; on an advert it just dulls the artwork. */
    .slider_widget .gpm_sing .overlay {
        display: none;
    }
    /* Desktop parks the "Advertisement" label and the dots inside the
       slide's 380px padding. With that padding gone they would sit on top
       of the artwork, so lift the label out above and drop the dots below. */
    .slider_widget .slider_widget_title {
        position: relative;
        top: auto;
        color: #292929;
        margin-bottom: 22px;
    }
    .slider_widget .sgs-pagination.sgs_hor {
        position: relative;
        bottom: auto;
        margin-top: 12px;
    }
    .slider_widget .sgs_hor .swiper-pagination-bullet {
        background: #cfcfcf;
    }

    /* --- 2. advert widgets first in the stacked sidebar --- */
    .sidebar-content {
        display: flex;
        flex-direction: column;
    }
    .sidebar-content > .box-widget {
        order: 2;
    }
    .sidebar-content > .box-widget--ad {
        order: 1;
    }
    /* Structural fallback so a sidebar in a template that was never tagged
       with .box-widget--ad still hoists its adverts. Kept alongside the
       class rather than replacing it, because browsers without :has()
       support still need the tagged templates to work. */
    .sidebar-content > .box-widget:has(a[href*="track-ad-click"]),
    .sidebar-content > .box-widget:has(.slider_widget .swiper-slide) {
        order: 1;
    }
}

/* In-content advert shown to phones/tablets only, so the unit sits high
   in the page instead of below the whole article. The desktop sidebar
   keeps the same advert, so exactly one copy is ever visible. */
.mobile-inline-ad {
    display: none;
}
@media only screen and (max-width: 1064px) {
    .mobile-inline-ad {
        display: block;
        margin: 0 auto 25px;
        text-align: center;
    }
    .mobile-inline-ad img {
        display: inline-block;
        max-width: 300px;
        width: 100%;
        height: auto;
    }
    /* hide the sidebar twin so the advert is not shown twice */
    .box-widget--ad-mobile-hoisted {
        display: none;
    }
}

/* What's On / Features widget ------------------------------------------------
   Editors flag more than four events and features, so the pane scrolls instead
   of the list being cut off. A fade at the foot signals there is more below. */
.tabs-widget .tab-content .post-widget-container {
    max-height: 430px;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #c9c9c9 transparent;
}
.tabs-widget .tab-content .post-widget-container::-webkit-scrollbar {
    width: 6px;
}
.tabs-widget .tab-content .post-widget-container::-webkit-scrollbar-track {
    background: transparent;
}
.tabs-widget .tab-content .post-widget-container::-webkit-scrollbar-thumb {
    background: #c9c9c9;
    border-radius: 3px;
}
.tabs-widget .tab-content .post-widget-container::-webkit-scrollbar-thumb:hover {
    background: #a5a5a5;
}
.tabs-widget .tabs-container {
    position: relative;
}
.tabs-widget .tabs-container:after {
    content: '';
    position: absolute;
    left: 1px;
    right: 1px;
    bottom: 1px;
    height: 34px;
    background: linear-gradient(rgba(249, 249, 249, 0), #f9f9f9);
    pointer-events: none;
}

/* These widgets are hoisted directly under the hero slider on phones/tablets,
   where the sidebar otherwise falls into the bottom third of the page. */
.whats-on-mobile {
    display: none;
}
@media only screen and (max-width: 1064px) {
    .whats-on-mobile {
        display: block;
        padding: 40px 0 0;
    }
    .whats-on-mobile .box-widget:last-child {
        margin-bottom: 0;
    }
    /* hide the sidebar twins so the widgets are not shown twice */
    .box-widget--whats-on-hoisted,
    .box-widget--weather-hoisted {
        display: none;
    }
}

/* X (formerly Twitter) brand mark. Font Awesome 5.12 predates the rebrand and
   has no glyph for it, so the logo is painted as a currentColor mask instead. */
/* The mask lives on :before, not on the element itself, so wrappers that style
   the icon box (.social-widget a i sets its own 40px white tile) keep working
   exactly as they do for the real Font Awesome glyphs. */
.fa-x-twitter:before,
.share-icon-twitter:before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.fa-x-twitter {
    text-align: center;
}

/* Breadcrumb header on narrow screens: the crumb trail wraps onto two or three
   lines once the story title is long, and the absolutely positioned
   "Scroll Down To Discover" block sits on top of it. Below the tablet
   breakpoint the scroll cue drops out of the absolute flow and stacks under
   the crumbs instead. Scoped to .breadcrumbs-header so the hero variant
   (.scw_transparent) keeps its own placement. */
@media only screen and (max-width: 1064px) {
    .breadcrumbs-header .breadcrumbs-header_url {
        float: none;
        overflow: hidden;
    }
    .breadcrumbs-header .breadcrumbs-header_url a,
    .breadcrumbs-header .breadcrumbs-header_url span {
        text-align: left;
    }
    .breadcrumbs-header .scroll-down-wrap {
        position: static;
        overflow: hidden;
        margin-top: 18px;
    }
    .breadcrumbs-header .scroll-down-wrap span {
        margin-left: 12px;
    }
}

/* Advert placement ----------------------------------------------------------
   Adverts sit at the section breaks the reader already stops at, rather than
   being stacked together at the foot of the page. Three shapes carry all of
   them: a full-width band between sections (leaderboards), a centred unit in
   the reading column (MPUs and skyscrapers placed inside content), and the
   sidebar widget. */
.ad-band {
    padding: 30px 0;
    text-align: center;
}
.ad-band .content-banner-wrap {
    max-width: 728px;
}
.ad-band img {
    display: inline-block;
    max-width: 100%;
    height: auto;
}
.ad-band--top {
    padding: 30px 0 0;
}

.inline-ad-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    clear: both;
}
.inline-ad-wrap--band {
    padding: 30px 0;
}
/* Inside the story the advert breaks the text, so it needs air above and
   below and must not inherit the paragraph rules around it. */
.inline-ad-wrap--in-article {
    margin: 25px 0 30px;
}
.inline-ad {
    display: block;
    max-width: 300px;
    flex: 0 1 300px;
}
.inline-ad img {
    display: block;
    width: 100%;
    height: auto;
}

/* Sidebar advert: the artwork keeps its own aspect ratio, so a 300x250 MPU
   and a 300x600 skyscraper both sit in the same widget without cropping. */
.ad-widget-link {
    display: block;
    border-radius: 4px;
    overflow: hidden;
}
.ad-widget-link img {
    display: block;
    width: 100%;
    height: auto;
}

/* Leaderboard 3 on interior pages has two copies: a band at the foot of the
   page for desktop, and one inside the sidebar above What's On for narrow
   screens, where the sidebar is full width and the stack order is what the
   reader actually walks down. Exactly one is visible at any width. */
.ad-band--sidebar-only {
    display: none;
}
.ad-band--sidebar-only .container {
    width: 100%;
    max-width: none;
    padding: 0;
}
@media only screen and (max-width: 1064px) {
    .ad-band--desktop-only {
        display: none;
    }
    .ad-band--sidebar-only {
        display: block;
        padding: 0;
        margin-bottom: 30px;
    }
    /* Sidebar twins of the widgets hoisted under the hero on the home page
       (see front.home.whats-on-mobile). */
    .box-widget--mpu1-hoisted,
    .box-widget--skyscraper-hoisted {
        display: none;
    }
    /* The stacked sidebar carries its widgets in the order the reader meets
       them below the article, which is not the order the desktop column uses.
       These beat the blanket "adverts first" rule further up the file, which
       still applies to sidebars that were never given these classes. */
    .sidebar-content > .box-widget.sw-mpu2   { order: 1; }
    .sidebar-content > .box-widget.sw-mpu1   { order: 1; }
    .sidebar-content > .box-widget.sw-search { order: 2; }
    .sidebar-content > .box-widget.sw-weather { order: 3; }
    .sidebar-content > .box-widget.sw-tags   { order: 4; }
    .sidebar-content > .box-widget.sw-social { order: 5; }
    .sidebar-content > .ad-band.sw-lb3       { order: 6; }
    .sidebar-content > .box-widget.sw-whatson { order: 7; }
    .sidebar-content > .box-widget.sw-mpu3   { order: 8; }
    .sidebar-content > .box-widget.sw-live   { order: 9; }
}

/*------ Home: Culture & Lifestyle tabs ---------------------------------*/
/* The tab strip shares the heading row, so the title stops being a plain
   block and becomes a two-item flex row that wraps on narrow screens. */
.section-title--tabbed {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 20px;
}
.section-title--tabbed h2 {
    margin: 0;
}
.culture-tabs-menu {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
}
.culture-tabs-menu li {
    float: none;
    list-style: none;
}
.culture-tabs-menu li a {
    display: block;
    padding: 7px 16px;
    border: 1px solid #ddd;
    border-radius: 2px;
    color: #666;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    transition: all 0.2s ease-in-out;
}
.culture-tabs-menu li a:hover {
    border-color: #222;
    color: #222;
}
.culture-tabs-menu li.current a {
    background: #222;
    border-color: #222;
    color: #fff;
}
@media only screen and (max-width: 640px) {
    /* Below the two-column card breakpoint the strip gets its own line and
       runs full width so the three labels stay comfortably tappable. */
    .section-title--tabbed h2 {
        width: 100%;
    }
    .culture-tabs-menu {
        width: 100%;
    }
    .culture-tabs-menu li {
        flex: 1;
    }
    .culture-tabs-menu li a {
        padding: 9px 0;
        text-align: center;
    }
}