/* Do whatever you want */


@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');

body{
    font-family: 'Roboto Slab', serif !important;
    background-color: #101010 !important;}

a.navbar-brand h1, a.navbar-brand h2{
    font-family: 'Open Sans', sans-serif;
    color: white;}

a.navbar-brand h1{
    font-size: 21px;
    text-transform: uppercase;
    font-weight: 600;}

a.navbar-brand h2{
    font-size: 10.5px;
    font-weight: 22;
    margin-bottom: 0px;}

.navbar-dark.black, .bg-dark.black{
    background-color: #101010 !important;
    z-index: 1200;}

#footer-menu{
    display: none;}

#nav-main .nav-link{
    font-size: 0.75em;
	color:white;
	opacity:0.65;}

.navbar-nav .dropdown-menu{
    background-color: #101010;}

.dropdown-item{
    font-size: 0.75em;
    text-transform: uppercase;
    color: rgba(255,255,255,.5) !important;}

.dropdown-item:hover{
    background-color: #101010 !important;
    color: white !important;
	opacity:1;}

#nav-main .nav-link:hover{
    color: white !important;
	opacity:1;}

#nav-main li.active .nav-link{
    color: white !important;
	opacity:1;}

#bootscore-navbar-collapse{
	font-size:18px;}

p{
    font-family: 'Open Sans';
    font-size: 0.85rem;}

#page{
	padding-left:86px;}

.search-box {
    cursor: pointer;
    height: 73px;
    background-color: #d4421f;
    position: fixed;
    top: 0;
    left: 0;
    width: 86px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
	z-index: 1500;
	min-width:86px;
}

.search-expand {
    position: fixed;
    top: 0;
    left: 86px;
    height: 73px;
    width: 0;
    background-color: #ec4922;
    transition: all ease-in-out 0.3s;
    z-index: 1100;
    display: flex;
    align-items: center;
}

.search-expand.expand {
    width: calc(100% - 86px);
}

.search-expand .input-group-append {
    display: none;
}

.search-expand input {
    padding: 0 20px;
    font-size: 16px!important;
}

.search-expand input, .search-expand input:focus {
    color: #fff;
    background-color: transparent!important;
    border: none;
    outline: 0;
    box-shadow: none;
}

.search-expand input::placeholder {
    color: #fff;
}

.search-expand input:-webkit-autofill,
.search-expand input:-webkit-autofill:hover, 
.search-expand input:-webkit-autofill:focus, 
.search-expand input:-webkit-autofill:active  {
  transition: background-color 5000s;
  -webkit-text-fill-color: #fff !important;
}

/* .search-box{
    height: 100%;
	min-height: 73px;
    background-color: #ec4922;
    position: absolute;
    width: 86px;
    margin-left: -16px;
    color: white;
    display: table;
	z-index: 1000;
	min-width:86px;} 
 
    .search-box .search-inner{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
} */

/* .search-box.expand .search-expand{
    display: inline-block;
	float: left;
	width: 95%;} */

/* .search-box.expand .search-expand input{
	background-color: transparent;
	border: 0px;}

.search-box.expand .search-expand input::placeholder {
	color:white;} */

/* .search-box.expand .fa-search{
	float:left;
	margin-left:20px;
    margin-top: 8px;} */

/* .search-box.expand .input-group-append{
	display:none;} */

.container.nav-container{
    max-width: 1470px;
    padding-left: 80px !important;
    padding-right: 0px !important;}

#content{
    background-color: #f2f5f7;
    min-height: auto !important;}

.page #content, .archive #content, .single #content{
    padding: 20px;
    max-width: 100%;}

.search #content{
	margin:0px;}

#gdpr-box{
	color:white;}

#primary{
	max-width:1400px;
	margin:0 auto;}

.home #primary{
	max-width:100%;}

.single #main #content{
    padding: 0px;
    background-color: transparent;}

.home #content{
    padding: 0px;}

h2.latest{
    margin-top: 30px;
    margin-bottom: 20px;}

.width-100{
    margin-left: -53vw;}

.archive .sidebar{
    margin-top: 72px;}

.home .sidebar{
    margin-top: 88px;}

span.author a, p a, .page-box a, .page-box li a{
    color: #ec4921;}

span.author a:hover, p a:hover, .page-box a:hover, .page-box li a:hover{
    color: #ec4921;}

.news-box h3 a{
    color: initial;}

.news-box h3 {
    font-size: 1.2rem !important;
    margin-bottom: 10px;
    margin-top: 20px;}

.news-box h2 {
    font-size: 1.5rem  !important;
    margin-bottom: 10px;}

.news-box h4 {
    font-size: 1rem !important;
    margin-bottom: 20px;}

.news-box, .page-box{
    background-color: white;
    padding: 20px;
    margin-bottom: 30px;}

.thumb-container {
    position: relative;
    background: black;}

.thumb-container .thumb-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px;
    z-index: 103;
    border: 1px solid #fff;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    opacity: 0.9;
    pointer-events: none;
    padding-top: 10px;}

.thumb-container img{
    opacity: 0.9;}

.thumb-container img:hover{
    opacity: 0.5;}

.thumb-container .thumb-icon .arrow-right {
    font-size: 24px;
    padding-left: 3px;}

.thumb-container .thumb-icon .arrow-right {
    position: relative;
    z-index: 3;
    padding: 0;
    margin: 0;
    color: #fff;
    font-size: 20px;}

.arrow-right {
    width: 0;
    height: 0;
    border-top: 10px solid transparent; 
    border-bottom: 10px solid transparent;
    border-left: 10px solid white;
    margin-left: 22px !important;
    margin-top: 4px !important;}

.btn-primary {
    background-color: #ec4921 !important;
    border-color: #ec4921 !important;}

.center{
    text-align: center;}

.widget.bg-light{
    background-color: white !important;}

#search-2{
    padding: 0px;}

.form-control, .input-group>.input-group-append>.btn{
    border-radius: 0px !important;
    background-color: #ec4921;
    color: white;
    border-color: #ec4921;
    border-bottom: 0px;
    font-size: 14px !important;}

.page-box h1{
    font-size: 1.65rem;
    font-weight: 400;
    margin-bottom: 30px;}

.page-box h2 {
    font-size: 1.3rem;}

.page-box li{
    font-weight: inherit;
    font-size: 0.85rem;
    font-family: 'Open Sans';}

.card{
    border: 0px !important;
    border-radius: 0px !important;}

.badge-secondary {
    color: #fff;
    background-color: #ec4921 !important;
    border-radius: 0px !important;
    font-family: 'Open Sans' !important;
    font-weight: 600 !important;
    font-size: 70% !important;
    padding: 6px 7px 7px 7px !important;
    text-transform: uppercase !important;
    margin-bottom: 2px !important;}

h2.widget-title{
    font-size: 16px;
    text-transform: uppercase;
    padding-top: 0px !important;
    border-bottom: 0px !important;}

.single .page-box h1{
    font-size: 2.35rem;
    font-weight: 400;
    margin-bottom: 20px;}

.single .page-box h3{
    font-size: 1.6rem;
    margin-bottom: 30px;
    line-height: 1.4;}

.single .entry-content h2{
    font-size: 1.5rem;
    font-weight: 300;
    line-height: 1.3;
    margin-bottom: 15px;}

.single .entry-content h3{
    font-size: 1.2rem;
    font-weight: 300;
    line-height: 1.3;}

.category-badge a{
    color: white;}

.page-box .page-item:first-child a.page-link, .page-box .page-item:last-child a.page-link{
    color: #2e2e2e;
    font-size: 1.05rem;
    line-height: 1.4;
    border: 0px;
    padding: 30px;
    padding-top: 0px;
    font-family: "Roboto Slab", serif;}

.page-box .page-item:first-child a.page-link{
    text-align: right;
    border-right: 0.5px solid lightgray;}

.page-box .page-item:last-child a.page-link{
    border-left: 0.5px solid lightgray;}

.page-box .page-item a.page-link:hover{
    background-color: initial;}

.page-item.left{
    text-align: right;}

.page-item p.grey{
    padding-right: 30px;
    color: #aeaeae;
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 14px;}

.page-item.left p{
    padding-right: 30px;}

.page-item.right{
    text-align: left;}

.page-item.right p{
    padding-left: 30px;}

.page-box li{
    width: 40%;}

.page-box .entry-content li{
    width: 100%;}

/*home carousel*/
.showcase.carousel {
    height: 100vh;
    position: relative;
    background-color: #101010;}

.showcase.carousel .carousel-inner, .showcase.carousel .carousel-inner .item {
    height: 100%;
    width: 100%;
    background-color: #101010;}

.showcase.carousel .carousel-inner .carousel-item img {
    opacity: 0.5;
    z-index: 0;
    position: absolute;
top: 50%;
transform: translateY(-50%);}

.carousel-item{
	height:100%;}

.carousel-left {
    left: 30px;}

.carousel-right {
    right: 30px;}

.carousel-left, .carousel-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #fff;}

.carousel-left:hover, .carousel-right:hover, .carousel-left:focus, .carousel-right:focus {
    color: #fff;}

/* .carousel-indicators {
    float: left;
    position: relative !important;
    display: inline !important;
    color: white !important;
    margin: 0 !important;
    top: 300px !important;
    margin-left: -50px !important;} */

.carousel-indicators {
    right: auto!important;
    margin: 0 0 0 -50px!important;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.carousel-indicators li {
    background-color: #a9a9a9;
    border: none;
    margin: 4px;
    width: 10px !important;
    height: 10px !important;
    border-radius: 100%;
    margin: -3px;}

.showcase.carousel h1{
    font-size: 3rem;
    /* position: absolute; */
    color: white;
    z-index: 1000;
    /* margin-left: 10%; */}


.showcase .container {
    width: 100%;
    height: 100%;
    max-width: none;
    margin-left: 160px;
    display: flex;
    align-items: center;
    position: relative;
}

.showcase-content-box {
    max-width: 40%;
}


/* Carousel Title Indicators */

.carousel-sub-header {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1050;
    width: 250px;
    margin-right: 200px;
}

.carousel-sub-header h4 {
    cursor: pointer;
    margin: 50px 0!important;
}

/* .carousel-sub-header h4.active {
    padding-right: 30px;
    border-right: 1px solid rgba(250, 250, 250, 0.6);
} */




/* 
.showcase.carousel .category-badge{
    margin-left: 10%;} */

.carousel-row{
    margin: auto !important;
    max-width: 1100px;
	height:100%;
    margin-top: 50px !important;
	align-items: center;
    justify-content: center;}

.showcase.carousel h4{
    color: white;
    margin-bottom: 20px;
    font-weight: 300;
    font-size: 1.1rem;
    text-align: right;}

.showcase.carousel h1 a, .showcase.carousel h4 a{
    color: white !important;}

.showcase.carousel h4 {
    color: white!important;
}

.showcase.carousel h1 a:hover, .showcase.carousel h4 a:hover{
    text-decoration: none;}

.showcase.carousel .col-sm-4{
    padding-right: 10%;}

.showcase.carousel .col-sm-8{
    text-align: left;}

.hidden{
    display: none;}

.show{
    display: block;}

/* SOCIAL BUTTONS SINGLE.PHP */

.heateor_sss_sharing_container ul.heateor_sss_sharing_ul {
    margin: 60px 0!important;
    display: flex;
    justify-content: center;
    width: 100%;
	gap:2%;
}

.heateor_sss_sharing_container ul.heateor_sss_sharing_ul li {
    width: auto!important;
}



/* SINGLE.PHP */
.single-related-posts h2 {
    font-size: 14px;
    text-transform: uppercase;
}

.carousel-related {
    height: 300px;
    width: 100%;
}

.carousel-inner {
    height: 100%;
    overflow: hidden;
}

.carousel-related .carousel-item-container {
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
    max-width: 100%;
    overflow: hidden;
}

.carousel-related .carousel-item .black-cover-back{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0.2;
    z-index: 5;
}

.carousel-item-container .black-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0;
    z-index: 18;
    transition: opacity 0.2s ease;
}

.carousel-item-container .black-cover:hover {
    opacity: 0.5;
}

.carousel-related .carousel-control-prev,
.carousel-related .carousel-control-next {
    z-index: 20;
    width: 10%;
    top: 35%;
    bottom: 35%;
    cursor: pointer;
} 

.carousel-item-desc {
    width: 100%;
    height: 100%;
    z-index: 15;
    padding: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.carousel-item-desc h3 {
    font-size: 20px;
    color: #fff;
}



.carousel-related .carousel-item .carousel-item-container .post-thumbnail {
    height: 100%;
}

.carousel-related .carousel-item .carousel-item-container .post-thumbnail img {
    height: 100%;
    width: auto;
    max-width: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    margin-bottom: 20px;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}


@media (min-width: 576px) {
	
    .carousel-related .carousel-item {
        margin-right: 0;
    }

    /* show 2 items */
    .carousel-related .carousel-inner .active + .carousel-item {
        display: block;
    }
    
    .carousel-related .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
    .carousel-related .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item {
        transition: none;
    }

    .carousel-related .carousel-inner .carousel-item-next {
      position: relative;
      transform: translate3d(0, 0, 0);
    }
    
    /* left or forward direction */
    .carousel-related .active.carousel-item-left + .carousel-item-next.carousel-item-left,
    .carousel-related .carousel-item-next.carousel-item-left + .carousel-item,
    .carousel-related .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    } 
    
    /* farthest right hidden item must be abso position for animations */
    .carousel-related .carousel-inner .carousel-item-prev.carousel-item-right {
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        display: block;
        visibility: visible;
    }
    
    /* right or prev direction */
    .carousel-related .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
    .carousel-related .carousel-item-prev.carousel-item-right + .carousel-item,
    .carousel-related .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(100%, 0, 0);
        visibility: visible;
        display: block;
        visibility: visible;
    }

}

/*LG */
@media (min-width: 991px) {

    /* show 4th item */
    .carousel-related .carousel-inner .active + .carousel-item + .carousel-item {
        display: block;
    }
    
    .carousel-related .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
        transition: none;
    }
    
    .carousel-related .carousel-inner .active.col-lg-4.carousel-item + .carousel-item + .carousel-item + .carousel-item {
        position: absolute;
        top: 0;
        right: -33.3333%;  
        z-index: -1;
        display: block;
        visibility: visible;
    }
    
    /* left or forward direction */
    .carousel-related .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    
    /* right or prev direction //t - previous slide direction last item animation fix */
    .carousel-related .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(100%, 0, 0);
        visibility: visible;
        display: block;
        visibility: visible;
    }

}


/* MEDIA QUERIES */

@media(max-width: 992px) {
    .news-row .col-lg-3 {
        display: none!important;
    }
}

@media(max-width: 900px) {
    .search-box, .search-expand, .top-nav-search-mobile.visible {
        display: none!important;
    }

    .showcase.carousel {
        height: 75vh;
    }
   
    .carousel-indicators {
        display: flex!important;
    }

    #page {
        padding-left: 0;
    }

    .container.nav-container {
        padding-left: 0!important;
    }

    .carousel-indicators {
        position: absolute!important;
        right: auto!important;
        left: 50%!important;
        bottom: 40px!important;
        top: auto!important;
        transform: translateX(-50%);
        margin-left: auto!important;
        height: auto;
        flex-direction: row;
    }
    .carousel-indicators li {
        margin: 0 50px;
    }

    .showcase.carousel .carousel-inner .carousel-item img {
        top: 50%;
        transform: translateY(-50%);
    }

    .carousel-item .container {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .carousel-item .container .row {
        margin-top: 0!important;
    }

    .carousel-item .container {
        margin-left: 0;
    }

    .showcase.carousel h1 {
        margin-top: 20px;
        margin-left: 0;
        position: relative;
        text-align: center;
    }

    .showcase.carousel .category-badge {
        margin: 0!important;
        display: flex;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    .showcase.carousel .category-badge a {
        margin: 2px 3px;
    }

    .showcase .container .row {
        justify-content: center;
    }

    .showcase-content-box {
        max-width: 75%;
    }

    .carousel-sub-header {
        display: flex;
        justify-content: space-between;
        right: 50%;
        top: auto;
        bottom: 100px;
        transform: translateX(50%);
        width: 75%;
        margin-right: 0;
    }

    .carousel-sub-header h4 {
        font-size: 11px!important;
        text-align: center!important;
        padding: 30px 15px;
    }

    .entry-content .row .col-sm-6 {
        display: flex;
        flex-direction: column;
    } 

    .entry-content .row .col-sm-6 .news-box {
        height: 100%;
    }
	
	#primary .col-sm-3, #primary .col-md-9 {
		width: 100%;
    	flex: 100%;
		max-width: 100%;}
}

@media(max-width: 576px) {
    a.navbar-brand h1, a.navbar-brand h2 {
        font-size: 18px!important;
    }

    .carousel-sub-header {
        display: none;
    }
  
}

@media(max-width: 400px) {
    a.navbar-brand h1, a.navbar-brand h2 {
        font-size: 16px!important;
    }
}