.container {
  max-width: 960px;
}

/*
 * Custom translucent site header
 */

.site-header {
	background-color: rgba(201, 0, 58, .85);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	backdrop-filter: saturate(180%) blur(20px);
}
.site-header a {
	color: #fff;
	transition: ease-in-out color .15s;
}
.site-header a:hover {
	color: #fff;
	text-decoration: none;
}

/*
 * Dummy devices (replace them with your own or something else entirely!)
 */

.product-device {
	position: absolute;
	right: 10%;
	bottom: -30%;
	width: 300px;
	height: 540px;
	background-color: #333;
	border-radius: 21px;
	-webkit-transform: rotate(30deg);
	transform: rotate(30deg);
}

.product-device::before {
	position: absolute;
	top: 10%;
	right: 10px;
	bottom: 10%;
	left: 10px;
	content: "";
	background-color: rgba(255, 255, 255, .1);
	border-radius: 5px;
	z-index: 1
}

.product-image{
	width: 91%;
	margin: 57px 0px 0px 0px;
	border-radius: 4px !important;
}

.product-image-2{
	width: 90.4%;
	margin: -60px 0px 0px 0px;
	border-radius: 4px !important;
	opacity: 0.4;
	height: 100%;
}

.product-device-2 {
	top: -25%;
	right: auto;
	bottom: 0;
	left: 5%;
	background-color: #e5e5e5;
}


/*
 * Extra utilities
 */

.border-top { border-top: 1px solid #e5e5e5; }
.border-bottom { border-bottom: 1px solid #e5e5e5; }

.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }

.flex-equal > * {
	-ms-flex: 1;
	flex: 1;
}
@media (min-width: 768px) {
	.flex-md-equal > * {
		-ms-flex: 1;
		flex: 1;
	}
}

.overflow-hidden { overflow: hidden; }

/* CSS THEME */
/* Light */
body.light-theme,
body.light-theme > .hero > div > .store-wrapper{
	color: #333 !important;
	background-color: #fff !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.light-theme > .theme-switch-box, 
body.light-theme > ul > a > li.theme-switch-box, 
body.light-theme > .hero, 
body.light-theme > .hero > div > .store-wrapper > a > .store-box,
body.light-theme > div > .feature-box{
	color: #333 !important;
	background-color: #e4e4e4 !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.light-theme > .hero > div > .store-wrapper  > a:hover > .store-box{
	color: #333 !important;
	background-color: #b7b7b7 !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.light-theme > .hero > .product-device-2{
	background-color: #e5e5e5 !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.light-theme .text-muted{
	color: #6c757d !important;
}

/* Dark */ 
body.dark-theme,
body.dark-theme > .hero > div > .store-wrapper{
	color: #dbdbdb !important;
	background-color: #333 !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.dark-theme > .theme-switch-box, 
body.dark-theme > ul > a > li.theme-switch-box, 
body.dark-theme > .hero, 
body.dark-theme > .hero > div > .store-wrapper  > a > .store-box,
body.dark-theme > div > .feature-box{
	color: #dbdbdb !important;
	background-color: #444 !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.dark-theme > .hero > div > .store-wrapper  > a:hover > .store-box{
	color: #dbdbdb !important;
	background-color: #626262 !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.dark-theme > .hero > .product-device-2{
	background-color: #666 !important;
	
	-webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

body.dark-theme .text-muted{
	color: #999 !important;
}

.theme-switch-box{
	padding: 20px;
	margin: 20px;
}

.store-wrapper{
	font-size: 28px;
	border-radius: 4px;
	margin-top: 30px;
	padding: 15px;
}

.store-box{
	padding: 10px;
	border-radius: 4px;
}

/* Feature */
.feature-box{
	padding: 30px;
}

.feature-img{
	width: 100%;
}

.feature-text{
	padding: 15px
}

.box-head{
	padding-bottom: 5px;
	margin-bottom: 15px;
	border-bottom: 1px solid #dbdbdb;
}

.help-menu{
	margin-top: 30px;
	list-style: none;
}