/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {display: block;}
audio, canvas, progress, video {display: inline-block; /* 1 */vertical-align: baseline; /* 2 */}
audio:not([controls]) {	display: none;	height: 0;}
 [hidden], template { display: none;}
a {	background-color: transparent;}
a:active, a:hover {	outline: 0;}
abbr[title] {border-bottom: 1px dotted;}
b, strong {	font-weight: bold;}
dfn {font-style: italic;}
h1 {font-size: 2em;	margin: 0.67em 0;}
mark {background: #ff0;	color: #000;}
small {	font-size: 80%;}
sub, sup {	font-size: 75%;	line-height: 0;	position: relative;	vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
img {border: 0;}
svg:not(:root) { overflow: hidden;}
/*figure {margin: 1em 40px;}*/
hr {-moz-box-sizing: content-box;box-sizing: content-box;height: 0;}
pre {overflow: auto;}
code, kbd, pre, samp {font-size: 1em;}
button, input, optgroup, select, textarea {color: inherit; /* 1 */font: inherit; /* 2 */margin: 0; /* 3 */}
button {	overflow: visible;}
button, select {text-transform: none;}
button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] {-webkit-appearance: button; /* 2 */	cursor: pointer; /* 3 */}
button[disabled], html input[disabled] {cursor: default;}
 button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0;}
input {	line-height: normal;}
input[type="checkbox"], input[type="radio"] {box-sizing: border-box; /* 1 */padding: 0; /* 2 */}
 input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto;}
input[type="search"] {	-webkit-appearance: textfield; /* 1 */	-moz-box-sizing: content-box;	-webkit-box-sizing: content-box; /* 2 */box-sizing: content-box;}
 input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none;}
fieldset {border: 1px solid #c0c0c0;	margin: 0 2px;	padding: 0.35em 0.625em 0.75em;}
legend {border: 0; /* 1 */	padding: 0; /* 2 */}
textarea {overflow: auto;}
optgroup {font-weight: bold;}
table {	border-collapse: collapse;	border-spacing: 0;}
td, th {padding: 1px !important;}
/*-------------------------------------------------------------*/
/*-------------------- Sliders css style ----------------------*/
/*-------------------------------------------------------------*/
/*-------------------------------------------------------------*/
.ks-demo-slider { width: 100%; height: 100%;}
.ks-demo-slider,.ks-carousel-slider { font-size: 25px; font-weight: 300;}
.ks-demo-slider .swiper-slide, .ks-carousel-slider .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex  display: flex; -webkit-box-pack: center  -ms-flex-pack: center;   -webkit-justify-content: center; justify-content: center; -webkit-box-align: center  -ms-flex-align: center; -webkit-align-items: center  align-items: center  background: #fff;}
.ks-carousel-slider .swiper-slide { box-sizing: border-box; border: 1px solid #ccc; background: #fff;}
.ks-carousel-slider.ks-carousel-slider-auto .swiper-slide {width: 85%;}
.ks-carousel-slider.ks-carousel-slider-auto .swiper-slide:nth-child(2n) { width: 70%;}
.ks-carousel-slider.ks-carousel-slider-auto .swiper-slide:nth-child(3n) { width: 30%;}
.page[data-page="swiper-multiple"] .swiper-container { margin: 0px 0 35px; font-size: 18px; height: 120px;}
.ks-slider-custom { height: 100%;}
.ks-slider-custom .swiper-container { background: #000; height: 100%;}
.ks-slider-custom .swiper-slide { -webkit-background-size: cover; background-size: cover; background-position: center;}
.ks-slider-custom .swiper-pagination .swiper-pagination-bullet {cursor: pointer;  width: 10px;height: 10px; background: rgba(255, 255, 255, 0); opacity: 1; border-radius: 0; -webkit-transition: 200ms; -moz-transition: 200ms; -ms-transition: 200ms;-o-transition: 200mstransition: 200ms; position: relative; -webkit-transform: scale(0.9);-moz-transform: scale(0.9);transform: scale(0.9);  box-sizing: border-box; border: 1px solid rgba(255, 255, 255, 0.8);}
.ks-slider-custom .swiper-pagination .swiper-pagination-bullet-active {z-index: 1; border: 1px solid #007aff; -webkit-transform: scale(1.4); -moz-transform: scale(1.4)  transform: scale(1.4);}
.ks-cube-slider { width: 80%;  height: 70%;  top: 15%;}
.ks-coverflow-slider {  height: 60%; }
.ks-coverflow-slider .swiper-slide { width: 65%;}
.ks-cube-slider .swiper-slide, .ks-coverflow-slider .swiper-slide { background-size: cover;  color: #fff;  -webkit-backface-visibility: hidden;}
.ks-fade-slider .swiper-slide { background-size: cover; background-position: center;}
.page[data-page="swiper-gallery"] { background: #000;}
.ks-swiper-gallery-top { height: 70%;}
.ks-swiper-gallery-thumbs {margin-top: 10px; height: 20%; height: -webkit-calc(30% - 20px); height: -moz-calc(30% - 20px); height: -ms-calc(30% - 20px); height: calc(30% - 20px);}
.ks-swiper-gallery-thumbs .swiper-slide { width: 25%;}
.ks-swiper-gallery-thumbs .swiper-slide-pic { position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  opacity: 0.35;  -webkit-transition: 300ms;}
.ks-swiper-gallery-thumbs .swiper-slide-active .swiper-slide-pic { opacity: 1;}
.ks-swiper-gallery-top .swiper-slide, .ks-swiper-gallery-thumbs .swiper-slide, .ks-swiper-gallery-top .swiper-slide-pic, .ks-swiper-gallery-thumbs .swiper-slide-pic { -webkit-background-size: cover; background-size: cover; background-position: center;}
.ks-parallax-slider { height: 100%;}
.ks-parallax-slider .swiper-parallax-bg { position: absolute;  left: 0;  top: 0;  width: 130%;  height: 100%;  -webkit-background-size: cover;  background-size: cover;  background-position: center;}
.ks-parallax-slider .swiper-slide {-webkit-box-sizing: border-box;box-sizing: border-box;padding: 40px 60px;color: #fff;background: rgba(0,0,0,0.4);}
.ks-parallax-slider .swiper-slide-title { font-size: 41px;  font-weight: 300;}
.ks-parallax-slider .swiper-slide-subtitle {  font-size: 21px;}
.ks-parallax-slider .swiper-slide-text { font-size: 14px;  max-width: 400px;  line-height: 1.3;}
/*-------- Custom style by  Maxartkiller  start from here ---- */
/*-------------------------------------------------------------*/
/*----------- copy @ maxartkiller.in, m_admin -----------------*/
/*-------------------------------------------------------------*/
html, bodyold {
	position: relative;
	height: 100%;
	width: 100%;
/*	overflow-x: hidden;*/ 
}             
body_old {
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
	margin: 0;
	padding: 0;
	color: #191919;
	font-size: 18px;
	line-height: 1.5;
	width: 100%;
	-webkit-text-size-adjust: 100%;
	font-weight: 300
}
* {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-touch-callout: none;
}
.navbar .center, .subnavbar .center {font-size: 16px; font-weight: 300;  }
.navbar.header{ background: transparent}
.list-block .item-title { text-transform: capitalize; }
hr{ clear: both; border: 0; border-top: 1px solid #eeeeee; width: 100%;}
.text-right{ text-align: right}
.center{ text-align: center}
.fullscreenmap{border:0; height:100%; width:100%}
.list-block .item-subtitle {  color: #03a9f4;}
.list-block .item-title{color: #000000 }
.list-block .item-content:after { content: ''; position: absolute; left: 0; bottom: 0; right: auto; top: auto; height: 1px;  width: 100%; display: block; z-index: 15; -webkit-transform-origin: 50% 100%;  transform-origin: 50% 100%;}
.list-block .item-inner:after{ display: none}
.list-block.inputs-list .item-content:after{ display: none}
.list-block.inputs-list:after, .list-block.inputs-list ul:before{ display: none}
/*--------------------------------------------*/
/*-------- theme1 lading screen Intro -------*/
/*--------------------------------------------*/
.landingpage{ background: #5c6693}
.buttonbar{ position: inherit; bottom: 0; width: 100%; left: 15px; z-index: 1}
.buttonbar .button{left: 0;   padding: 0; vertical-align: middle; text-align: center;   border-radius: 0}
.color2{ background: #d667cd ; color:#ffffff !important;}
.color3{ background: #0b9032 ; color:#ffffff !important;}
.color_red{ background: #f60000 ; color:#ffffff !important;}
.introtext{ color: #ffffff; text-align: center}
.introtext h1{margin: 0;color: #fff;}
.introtext p{margin: 0; font-size: 14px; }
/*--------------------------------------------*/
/*-------- theme1 login screen -------*/
/*--------------------------------------------*/
.loginsimag{ margin: 0; padding: 0; background: #5c6693; text-align: center}
.loginsimag img{ max-width: 200px; margin: 0 auto}
.focus-state .input-field:after, .focus-state .item-input-field:after, .input-field.focus-state:after, .input-field.not-empty-state:after, .item-input-field.focus-state:after, .item-input-field.not-empty-state:after, .not-empty-state .input-field:after, .not-empty-state .item-input-field:after { background: #ffffff;-webkit-transform: scaleY(1)!important; -moz-transform: scaleY(1)!important;-ms-transform: scaleY(1)!important; transform: scaleY(1)!important;}
.button-connect .button.facebook{ background: #0e449a;}
.button-connect .button.twitter{ background: #00aceb;}
.button-connect .button.googpleplus{ background: #eb2727;}
.button-connect .button.pinterest{ background: #b40000;}
.button-connect .button i{ width: 20px; margin-right: 10px;}
/*--------------------------------------------*/
/*-------- theme1 home screen -------*/
/*--------------------------------------------*/
.largebanner {height: 100%;}
.largebanner img{opacity: 0.2; min-height: 100%}
.largebanner .textblock{position: absolute;z-index: 1;color: #ffffff;text-align: center;width: 100%;display: block;top: 30%;padding: 10px;box-sizing: border-box;}
.largebanner .swiper-slide {background: #5c6693;}
.largebanner .textblock h2, .largebanner .textblock h3, .largebanner .textblock h4, .largebanner .textblock h5{margin: 0;clear: both;width: 100%;display: block;line-height: 40px;vertical-align: middle;color: #fff;}
.prductlist .content-block  h2, .prductlist .content-block  h3, .prductlist .content-block p{ margin: 0; clear: both; width: 100%; display: block;  line-height: 40px; vertical-align: middle}
.largebanner .textblock h5{ font-weight: 200}
.largebanner .textblock .button{ width: 120px; margin: 0 auto}
.starhhh {margin:0 auto 10px auto; display: block; width: 100%;  font-size: 18px;}
.prductlist .card{margin:0 0 15px 0;border: 1px solid #ddd; }
.titleicon{ margin-right: 10px;}
.text-right .titleicon{ margin-right: 0px; margin-left: 10px }
.darkbgblock{background: #5c6693; overflow: hidden; position: relative; color: #ffffff; padding:15px;}
.darkbgblock *{ position: relative; color:#ffffff; z-index: 1}
.darkbgblock img{ position: absolute; top: 0; left: 0; width: 100%; opacity: 0.2; z-index: 0}
.testimonials{background: #5c6693; color: #ffffff}
.testimonials *{ color: #ffffff}
.testimonials h2{ display: block; margin: 10px auto}
.testimonials .pic{ width: 100%; text-align: center; }
.testimonials .pic img{height: 50px; width: 50px; border-radius: 50%; margin: 0px auto;}
.iconset{ text-align: left}
.iconset a{ width: 48%; padding-right: 1%; display: inline-block; color: #666666; line-height: 40px; vertical-align: middle; text-overflow: ellipsis; white-space: nowrap; overflow-x: hidden }
.iconset a i{ font-size: 18px; width: 20px; margin-right: 10px; text-align: center}
.socials{ margin: 0 auto; padding: 0; width: auto; text-align: center}
.socials li{ margin: 0 auto; padding: 0; width: auto; display: inline-block; list-style: none}
.socials li a{width: 40px;height: 40px;float: left;line-height: 40px;text-align: center;color: #ffffff;font-size: 16px;border-radius: 40px;margin: 5px;}
.fb{ background: #0a499f;}
.tw{ background: #00aceb;}
.gp{ background: #eb2727;}
.pin{ background: #b40000;}
.env{ background: #ff7a27;}
/*--------------------------------------------*/
/*-------- theme1 sidebar left -------*/
/*--------------------------------------------*/
.sidebar { padding-bottom: 60px;}
.sidebar .accordion-list {margin: 0}
.userprofile{ background: url(../img/proflebg.png) no-repeat #5c6693; background-size: 100%;  padding:70px 0 20px 0; height: 50px; display: flex; direction: ltr; flex-flow: row}
.userprofile .item-inner{  width: 80%; float: left; color: #ffffff}
.userprofile .item-inner .item-subtitle{color: rgba(255, 255, 255, 0.5)}
.userprofile .item-media{width:20%; max-width: 56px; float: left; padding:0 15px;}
.userprofile .item-media img{ width: 100%; border-radius:50%;}
.sidebar .view{ overflow-y: auto}
.menu li a.item-content{ font-size: 13px; text-transform: uppercase; text-align: left; -webkit-justify-content: flex-start; justify-content: flex-start;}
.itemmeniinner{padding-right: 16px;  position: relative;  width: 100%;  padding-top: 8px;  padding-bottom: 8px;  min-height: 48px;  box-sizing: border-box;  -webkit-box-flex: 1;  -ms-flex: 1;    min-width: 0;
    display: -webkit-box; display: -ms-flexbox;  display: -webkit-flex;  display: flex; line-height: 32px  align-self: stretch; vertical-align: middle}
.itemmeniinner:after{  content: '';  position: absolute;  left: 0;  bottom: 0; right: auto; top: auto; height: 1px; width: 100%; background-color: rgba(0,0,0,.12);display: block;  z-index: 15; -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%;     -webkit-transform: scaleY(.5);  transform: scaleY(.5);}
.menu li a i{height: 30px;width: 30px;margin-right: 10px;display: inline-block;font-size: 16px;vertical-align: middle;line-height: 30px; color: #666666}
.menu li a span{ vertical-align: middle; line-height: 32px;}
.menu li .accordion-item-content .content-block{padding-right: 0}
.menu li .accordion-item-content .content-block ul{border-top: 1px solid #eeeeee}
.menu li .accordion-item-content .content-block ul li{border-bottom: 1px solid #eeeeee}
.menu li .accordion-item-content li a{line-height: 40px; vertical-align: middle; padding-left: 40px }
/*--------------------------------------------*/
/*----------- theme1 about screen ------------*/
/*--------------------------------------------*/
.ks-parallax-slider, .swiper-parallax-bg{ height: 100%  }
/*--------------------------------------------*/
/*----------- theme1 profile screen ------------*/
/*--------------------------------------------*/
.loginsimag.profi{ height: 100px; padding:20px 0}
.loginsimag.profi img{width: 100px; border-radius: 50%}
.page-content.tab { padding-top: 0}
.tabbar a.tab-link{  width:90%;     height: 33px; border-radius: 40px;  margin: 0 2.5%;  background: rgba(0, 0, 0, 0.1); font-size: 12px;}
.userprofile.large { padding: 100px 0 20px 0;  height: 70px;}
.userprofile.large .item-title { margin-top: 15px;}
.tabbar a.tab-link.active{ background:none}
/*--------------------------------------------*/
/*----------- theme1 Gallery screen ------------*/
/*--------------------------------------------*/
.gallery a{ padding: 1px; height: 100px; overflow: hidden}
.gallery.two a{ padding: 1px; height: 150px;}
.gallery.one a{ padding: 1px; height: 200px;}
.gallery a img{max-width: 100%; min-height: 100%; overflow: hidden}
/*--------------------------------------------*/
/*----------- theme1 Blog list screen ------------*/
/*--------------------------------------------*/
.list-block.media-list{margin: 0;}
.author { font-size: 12px;font-weight: 700;text-transform: uppercase;margin-top: 10px;}
.time-old {font-size: 12px; color: #60BB87;	margin-top: -17px;	float: right;}
img.article {width: 100%;height: auto;margin-top: 0;}
.article-title {	font-weight: 200;	font-size: 24px;	color: #222222;	margin: 15px 0;	padding: 0 15px;}
.article-content {	color: #666666;	margin: 20px 0;	padding: 0 15px;	line-height: 25px;}
.readmore {	margin: 15px 0;	padding: 0 15px;}
a.readmore {	color: #60BB87;	font-size: 12px;	text-transform: uppercase;}
a.link.nextstory {	color: #171717;	font-size: 12px;	font-weight: 700;	text-transform: uppercase;}
.separator {border-bottom: #E4E4E4 1px solid; margin-top: 20px;}
.separator-intro {border-bottom: #E4E4E4 1px solid;	margin-top: 20px;margin: 0 15px;}
ul.comment {margin: 15px 0;}
.content-block-inner.comment {	background: #f7f7f7;	padding: 15px 15px;}
.left.number-comment {	font-size: 12px;font-weight: 700;	text-transform: uppercase;}
.right.post-comment {	font-size: 12px;	text-transform: uppercase;	color: #777777;}
.list-block.media-list.comment {	margin: -10px 0;}
ul.comment:before {	display: none;}
.item-title.author-comment {	font-size: 12px; font-weight: 700 !important; text-transform: uppercase; margin-top: 10px;}
.item-text.comment {font-size: 14px; margin-top: 10px;	color: #777777;	height: 100%;	display: block;}
.list-block ul.comment:after {display: none;}
a.button.button-big.button-round.post { width: 85%;	margin: 50px auto;	border: 1px solid #60BB87;	font-size: 14px; color: #60BB87;}
a.button.button-big.button-round.post.active-state {width: 85%;	margin: 50px auto;	border: 1px solid #60BB87;	background-color: #60BB87; font-size: 14px; color: white;}
.list-block.comment {margin: 0;}
.content-block.comment-write {margin: 30px 0;}
ul.message-comment {margin: -15px 0;}
ul.message-comment:before {display: none;}
.list-block.media-list .item-link .item-title-row {	background-image: none;}
.text-center {	text-align: center}
.item-title.author.profiles {font-weight: 300;font-size: 20px;	color: #171717;	margin: 5px 0;	padding: 0px;	text-align: center;}
.item-subtitle.location.profiles {text-transform: uppercase;	font-size: 12px;	color: #777777;}
hr {border-top: 0;	border-bottom: 1px solid #dddddd} 
a.button.button-big.button-round.follow.profiles.active-state{border: 1px solid #60BB87;background-color: #60BB87;width: 80%;margin-left: 15px;font-size: 14px;color: white;line-height: 32px; height: 35px;}
.col-33.profiles {	background: #fff;text-align: center; color: #171717;font-weight: 300;font-size: 20px;}
.profilepic img {width: 80px;height: 80px;display: block;max-width: none}
li.profiles {background-color: white;}
.button.follow {width: 100px;margin-top: 20px;}
.content-profiles {	font-size: 14px;line-height: 18px;color: #777777;height: 100%; margin-top: 10px; padding: 15px 15px 0;}
.share {color: #777777;}
.share-section {padding: 15px 0;}
ul.profiles::after {height: 1px;}
/*--------------------------------------------*/
/*----------- theme1 theme color  ------------*/
/*--------------------------------------------*/
.ks-color-theme, .ks-layout-theme{ height: 30px; margin-bottom: 10px}
/*--------------------------------------------*/
/*----------- theme1 contacts color  ------------*/
/*--------------------------------------------*/
.list-block.media-list .item-media img{ border-radius: 50%}
/*--------------------------------------------*/
/*----------- theme1 todo task color  ------------*/
/*--------------------------------------------*/
.primarystatus:before{ content: " "; height: 100%; width: 3px; position: absolute; left: 0; top: 0; background: #ff0000}
.taskstatus:before{ content: " "; height: 100%; width: 3px; position: absolute; left: 0; top: 0; background: #00baff}
.workstatus:before{ content: " "; height: 100%; width: 3px; position: absolute; left: 0; top: 0; background: #ffba00}
.meetingstatus:before{ content: " "; height: 100%; width: 3px; position: absolute; left: 0; top: 0; background: #18c111}
.speed-dial-buttons a.color-pink{ color: #fff;  background: #e91e63;}
.speed-dial-buttons a.color-indigo{ color: #fff;  background: #3f51b5;}
.floating-button.color-red{ color: #fff;  background: #f22948;}
.floating-button{ font-size: 18px;}
/*--------------------------------------------*/
/*------------------- chart  -----------------*/
/*--------------------------------------------*/
.chartblock .card{    margin: 10px 0;  box-shadow: none; padding: 10px}
.chartblock{ padding:0px;}
/*--------------------------------------------*/
/*------------------- Dashboard -----------------*/
/*--------------------------------------------*/
.alertblock{}
.alertblock .content-block h2{ color: #ffffff}
.alertblock .content-block { padding: 16px}
.orange{ background: #ff9800; border:1px solid #ff9800 !important; color:#ffffff;}
.red{ background: #f44336; border:1px solid #f44336 !important; color:#ffffff;}
.blue{ background: #2196f3; border:1px solid #2196f3 !important; color:#ffffff;}
.green{ background:#4caf50; border:1px solid #4caf50 !important; color:#ffffff;}
.padding{ padding: 0 16px;}
.sliderdashboard {  height: 314px; }
table{ border-collapse: collapse; width: 100%}
table tr th{ color: #222222; background: #eeeeee;}
table tr td, table tr th{ border: 1px solid #dddddd; font-weight: 400; padding: 0 10px; line-height: 30px; text-align: left}
.largebanner.shop{ height: 350px;}
/*--------------------------------------------*/
/*------------------- Category -----------------*/
/*--------------------------------------------*/
.category{margin: 0; padding: 0px}
.category.prductlist .card{ position: relative; overflow: hidden; margin: 0 0 1px 0; border:0}
.categoryimg{width: 100%;position: absolute;top: 0;left: 0;opacity: 0.5; z-index: 0; min-height: 100%}
.category .card-content{z-index: 1; text-align: center; float: left; width: 100%}
.category .card-content h2, .category .card-content p{color: #ffffff}
.category .card{padding: 30px 0}
.category.homes .card{margin: 0px 0 16px 0 }
.shop.list-block .item-media{ height: 120px; width: 100px; overflow: hidden}
.shop.list-block .item-media img{ width: 100%; min-height: 100%; border-radius: 0}
/*--------------------------------------------*/
/*------------------- masonary -----------------*/
/*--------------------------------------------*/
.grid .grid-item{ width:33.33333%; padding: 1px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box;}
.grid.two .grid-item{ width:50%;}
.grid.one .grid-item{ width:100%;}
.grid a{width: 100%; display: block; float: left}
.grid a img{width: 100%; display: block; float: left}
/*--------------------------------------------*/
/*------------------- menu landing -----------------*/
/*--------------------------------------------*/
.menulanding{ padding: 00; width: 100%; float: left; margin: 0 auto;}
.menulanding  li { width: 33.30%; float: left; list-style: none; text-align: center;}
.menulanding li .item-link { height: 80px; width: 90%; display: block; border: 1px solid rgba(0, 0, 0, 0.10); margin: 10px auto;}
.menulanding li .item-link i{ width: 100%; display: block; line-height: 48px; font-size: 24px;}
.menulanding li .item-link span{ font-size: 13px; line-height: 18px; padding: 0 2%; text-align: center; width: 96%; display: block; text-overflow: ellipsis; overflow: hidden ; white-space: nowrap;  }
/* scrollbars */
::-webkit-scrollbar {
 width: 2px;
    height: 2px
}
::-webkit-scrollbar-track {
 -webkit-border-radius: 10px;
 border-radius: 10px;
}
::-webkit-scrollbar-thumb {
 -webkit-border-radius: 10px;
 border-radius: 10px;
 background: rgba(0,0,0,0.4);
}
::-webkit-scrollbar-thumb:window-inactive {
 background: rgba(0, 0, 0, 0.2);
}
.demo-card-header-pic .card-header {
    height: 40vw;
    background-size: cover;
    background-position: center;
}