/*html {
	  --scrollbarBG: #CFD8DC;
	  --thumbBG: #b7a481;
	  --bodyColor: #b7a481;
	  --fontColor: #b7a481;
	  --borderColor:#b7a481;
	  --h5Color:#b7a481;
	  --navlinkActive:#ffffff;
	  
	  --mainColor:#b7a481;
	}*/
	
	html {
	  --scrollbarBG: #CFD8DC;
	  --thumbBG: #000000;
	  --bodyColor: #ffffff;
	  --fontColor: #000000;
	  --borderColor:#000000;
	  --h5Color:#000000;
	  --h4Color:#000000;
	  --navlinkActive:#000000;
	  --activeColor:#1c3397;
	  --mainColor:#ffffff;
	}
	
	body{
		padding:15px;
		background-color:var(--bodyColor);
	}
	
	body > .container{padding-top:100px;}
	
	.nav-link.active{
		color:var(--navlinkActive) !important;
	}
	
	img{width:100%;}
	
	h5{
		font-weight:bold;
		color:var(--h5Color) !important;
	}
	h4,h3{
		color:var(--h4Color) !important;
	}
	
	h6{text-align:center;}
	
	hr{border: 0.5px dotted black; }	

	.badge-notify{
		background: var(--mainColor);
		position: absolute;
		top: 10px;
		left: 25px;
		font-size:13px;
	}
	
	#closeSplash,#closeSplash2,#closeSplash3{
		/*background-color: #dfe4e8;*/
		border-color: var(--mainColor);
		color:var(--mainColor);
		font-weight:bold;
	}

	#splash{
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0px;
		left: 0px;
		z-index: 9999;
		background-color: var(--mainColor);
		text-align:center;
	}
	
	#splash img{
		/*width:50%;
		margin-top:30%;*/
	}
	
	#splash p{
		color:var(--fontColor);
		position:absolute;
		width:100%;
		font-size:1.2em;
	}
	
	#splash p:nth-child(2){
		top:47%;
	}
	
	#splash p:nth-child(3){
		bottom:10%;
		padding:10px;
	}	
	
	#splash p:nth-child(4){
		bottom:5%;
		padding:10px;
	}
	
	#splash p:nth-child(5){
		bottom:2%;
	}	
	
	#splash button{
		font-size:1.2em;
	}
	
	#splash a{
	  text-align: center; /* Center-align text */
	  width: 20%; /* Equal width (5 icons with 20% width each = 100%) */
	  padding: 5px; /* Some top and bottom padding */
	  transition: all 0.3s ease; /* Add transition for hover effects */
	  color: var(--mainColor); /* White text color */
	  font-size: 36px; /* Increased font size */
	  position:relative;
	}	
	
	.list-group-item.active .text-muted{
		color: rgba(255, 255, 255, 0.70) !important;
	}
	
	.list-group-item{
		position:relative;
		margin-bottom: 12px;
		border:1px solid var(--borderColor);
	}
	
	.justify-content-between p:nth-child(2){
		font-weight:bold;
	}

	.footer {
		position: absolute;
		bottom: 0;
		width: 100%;
		/* Set the fixed height of the footer here */
		height: 60px;
		line-height: 60px; /* Vertically center the text there */
		background-color: #f5f5f5;
	}
	
		
	.icon-bar {
	  width: 100%; /* Full-width */
	  background-color: #afc7ef; /* Dark-grey background */
	  overflow: auto; /* Overflow due to float */
	  position:sticky;
	  bottom:10px;
	  z-index:999;
	}

	.icon-bar a {
	  float: left; /* Float links side by side */
	  text-align: center; /* Center-align text */
	  width: 20%; /* Equal width (5 icons with 20% width each = 100%) */
	  padding: 0px; /* Some top and bottom padding */
	  transition: all 0.3s ease; /* Add transition for hover effects */
	  color: white; /* White text color */
	  font-size: 36px; /* Increased font size */
	  position:relative;
	}

	.icon-bar a:hover {
	  background-color: var(--mainColor); /* Add a hover color */
	}

	a.active {
	  background-color: var(--activeColor); /* Add an active/current color */
	}	
	
	#myBtn {
	  display: none; /* Hidden by default */
	  position: fixed; /* Fixed/sticky position */
	  bottom: 70px; /* Place the button at the bottom of the page */
	  right: 2px; /* Place the button 30px from the right */
	  z-index: 99; /* Make sure it does not overlap */
	  border: none; /* Remove borders */
	  outline: none; /* Remove outline */
	  background-color: #afc7ef; /* Set a background color */
	  color: white; /* Text color */
	  cursor: pointer; /* Add a mouse pointer on hover */
	  padding: 15px; /* Some padding */
	  border-radius: 10px; /* Rounded corners */
	  font-size: 14px; /* Increase font size */
	}	
	
	#myBtn:hover {
	  background-color: var(--mainColor); /* Add a dark-grey background on hover */
	}	
	
	.icon-bar-social {
	  position: absolute;
	  top:20px;
	  left:25%;
	  /*-webkit-transform: translateY(-50%);
	  -ms-transform: translateY(-50%);
	  transform: translateY(-50%);*/
	}	
		
	.icon-bar-social a {
	  /*display: block;*/
	  display:inline-block;
	  text-align: center;
	  padding: 10px;
	  transition: all 0.3s ease;
	  color: white;
	  font-size: 20px;
	}	
	
	.facebook {
	  background: #3B5998;
	  color: white;
	}

	.twitter {
	  background: #55ACEE;
	  color: white;
	}	
	.youtube {
	  background: #bb0000;
	  color: white;
	}	
	.instagram {
	  background: #e87e59;
	  color: white;
	}	
	
	#shoppingCart label{
		width:150px;
		max-width:150px;
	}
	
	.cart{
		text-align: center;
		padding: 0px;
		margin:0px;
		transition: all 0.3s ease;
		font-size: 36px;		
		width: 45px;
		position: absolute;
		bottom: 0px;
		right: 0px;
		z-index:1;
	}
	

	.navbar-collapse::-webkit-scrollbar {
	  width: 11px;
	}
	.navbar-collapse {
	  scrollbar-width: thin;
	  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
	}
	.navbar-collapse::-webkit-scrollbar-track {
	  background: var(--scrollbarBG);
	}
	.navbar-collapse::-webkit-scrollbar-thumb {
	  background-color: var(--thumbBG) ;
	  border-radius: 6px;
	  border: 3px solid var(--scrollbarBG);
	}	
	
@media (max-width: 992px) {
    .navbar-collapse {
        position: absolute;
        top: 54px;
        right: 100%;
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 15px;
        width: 100%;
        transition: all 0.3s ease;
        display: block;
		overflow: scroll;
		max-height: 320px;
		overflow-x: hidden;
    }
    .navbar-collapse.collapsing {
        height: auto !important;
        margin-right: 50%;
        transition: all 0.3s ease;
        display: block;
    }
    .navbar-collapse.show {
		top:160px;
        right: 0;
    }
	
	#closeSplash img,#closeSplash2 img,#closeSplash3 img{
		margin:0px;
		width:30%;
	}
}	

@media (min-width: 992px) {
	#splash img{
		margin-top:0;
		width:30%;
	}
}	

p.cart{
	display:none;
}