html{
	scroll-behavior: smooth;
	margin: 0;
	padding: 0;
}

body{
	font-family: 'Play', sans-serif;
	margin: 0;
	padding: 0;
}

#mainNav{
	font-size: 1rem;
	background: #1d86a3;
	padding: 0.2rem;
	padding-left: 0.5rem;
}

#mainNav .navbar-brand{
	font-size: 1rem;
}

#topBanner{
	max-width: 100%;
	max-height: 100%;
}


#topBanner img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.vr{
	margin-top: 15px;
	margin-left: auto;
	width: 2px;
	height: 250px;
	background-image: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

#btn1{
	margin-top: 40px;
	margin-left: auto;
	
}

#btn1 a{
	width: 15rem;
}

#btn2{
	margin-top: 10px;
	margin-left: auto;
}

#btn2 a{
	width: 15rem;
}

#btn3{
	margin-top: 10px;
	margin-left: auto;
}

#btn3 a{
	width: 15rem;
}

#btn4{
	margin-top: 10px;
	margin-left: auto;
}

#btn4 a{
	width: 15rem;
}

#openText{
	margin-left: 40px;
	margin-right: 40px;
	margin-top: 10px;
	padding-top: 8px;
	padding-bottom: 8px;
}

#openText{
	border-top-left-radius: 40%;
	border-bottom-right-radius: 40%;
	background: #1e1e1f; 
	color: #1d86a3;
}

.lead{
	padding-top: 30px;
}

@keyframes colorChange {
	0% {color: black;}
	50% {color: #1d86a3;}
	100% {color: black;}
}

#description h5{
	color: #1e1e1f;
}

#description a{
	background:	#1d86a3;
	color: #1e1e1f;
	width: 60%;
}

#description img{
	width: 94%;
	height: 100%;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#featuredProduct .prodimg{
	background: rgba(29, 134, 163, 0.8);
	padding: 20px;
	/*max-height: 560px;*/
	height: 50%;
}

#featuredProduct a{
	color: black;
}

@keyframes color-change {
	0% {color: black;}
	50% {color: white;}
	100% {color: black;}
}

.prodimg .lead{
	font-size: 1rem;
}

.prodimg li{
	font-size: 0.8rem;
}

.line{
	margin-top: 5px;
	margin-bottom: 15px;
	margin-left: 50px;
	width: 2px;
	height: 95%;
	padding-right: 1px;
	background-image: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
}

#featuredProduct img{
	width: 50%;
	opacity: 100%;
}

#price{
	animation: color-change 1s infinite;
	font-weight: 600;
	font-size: 2rem;
	letter-spacing: 3px;
}


/*.smJumbo .container{
	width: 100%;
	margin: 0;
	padding: 0;
}*/

#carouselExampleControls{
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
}

.carousel-inner{
	/*max-height: 460px;*/
	/*min-width: 100%;*/
	width: 100%;
	height: 90%;
	overflow: hidden;
  	background-color: white;
  	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.29);
}

.carousel-inner img{
	max-height: 460px;
}

.carousel-item{
	transition: transform 2s ease, opacity .5s ease-out

}

.carousel-content {
	background: rgba(29, 134, 163, 0.9); 
	width: 30%;
	max-height: 530px;
	height: 95%;
  	position: absolute;
  	top: 2%;
  	left: 2%;
  	z-index: 20;
  	color: white;
  	text-shadow: 0 1px 2px rgba(0,0,0,.6);
  	border-top-right-radius: 20%;
  	border-bottom-left-radius: 20%;
}

/*#slide1 {
	background: rgba(29, 134, 163, 0.9); 
	width: 30%;
	max-height: 530px;
	height: 95%;
	size: auto;
  	position: absolute;
  	top: 2%;
  	left: 2%;
  	z-index: 20;
  	color: white;
  	text-shadow: 0 1px 2px rgba(0,0,0,.6);
  	border-top-right-radius: 20%;
  	border-bottom-left-radius: 20%;
}*/

/*#unam {
	background: rgba(29, 134, 163, 0.9); 
	width: 30%;
	max-height: 300px;
	height: 95%;
	size: auto;
  	position: cover;
  	top: 2%;
  	left: 2%;
  	z-index: 20;
  	color: white;
  	text-shadow: 0 1px 2px rgba(0,0,0,.6);
  	border-top-right-radius: 20%;
  	border-bottom-left-radius: 20%;
}*/

/*#slide2{
	max-height: 313.33px;
}*/

/*#slide3{
	background: rgba(29, 134, 163, 0.9); 
	width: 33%;
	max-height: 530px;
	height: 95%;
	size: auto;
  	position: absolute;
  	top: 2%;
  	left: 2%;
  	z-index: 20;
  	color: white;
  	text-shadow: 0 1px 2px rgba(0,0,0,.6);
  	border-top-right-radius: 20%;
  	border-bottom-left-radius: 20%;
}*/

.carousel-content .lead{
	font-size: 1rem;
}

.carousel-content li{
	font-size: 0.9rem;
	padding-bottom: 5px;
}

.carousel-content h2{
	font-size: 1.5rem;
}


.carousel-content hr{
	margin-top: 15px;
	margin-bottom: 15px;
	margin-right: auto;
	width: 95%;
	padding-right: 0;
	background-image: linear-gradient(to left, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7));
}

#products{
	margin-top: 60px;

	margin-right: auto;
}

#products button{
	/*width:100%;*/
	color: black;
}

#products .container{
	background: #e3e3e3;
	border-radius: 50%; 
}

.card img{
	height: 13rem;
}

#products .row-col{
	margin: 3px;
}

#products .card{
	padding: 0;
	margin:0;
}

#products h1{
	text-shadow: 0px 1px 1px black;
}

 hr{
	 border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
    width: 100%;
}

#products .card{
	box-shadow: 1px 1px 2px #757575;
	max-width: 100%;
	max-height: 100%;
	margin-bottom: 30px;
}

 .modal-content{
	background: rgba(29, 134, 163, 0.9);
	color: black;
}

#info1 li{
	font-size: 0.9rem;
}

#contact{
	width: 40%;
	height: 20rem;
	background: #1d86a3;
	border-top-left-radius: 3%; 
	border-bottom-left-radius: 3%; 
}

#contact hr{
	width: 20%;
	height: 10px;
}

#visit{
	width: 40%;
	height: 20rem;
	background: #1e1e1f;
	color: white;
	border-top-right-radius: 3%; 
	border-bottom-right-radius: 3%; 
}

#visit hr{
	width: 25%;
	height: 10px;
	background-image: linear-gradient(to right, rgba(29, 134, 163, 0), rgba(29, 134, 163, 0.75), rgba(29, 134, 163, 0));
}

#visit h1{
	color: #1d86a3;
}

#visit h5{
	color: #1d86a3;
}

#covid .jumbotron{
	background:#1e1e1f;
	color: #1d86a3;
	border-top-left-radius: 50%;
	border-top-right-radius: 50%;
	border-bottom-right-radius: 50%;
	border-bottom-left-radius: 50%;
}

#selling .jumbotron{
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 12px 40px 0 rgba(0, 0, 0, 0.19);
	background: #e3e3e3;
}

#sonar{
	padding-left: 25%;
}

/*.navbar.scrolled {
	background: rgba(49, 91, 143, 0.9);
	transition: background 600ms;
}*/



#footer{
background: #1d86a3;
color: black;
padding-top: 20px;
}

#privacyBanner{
	display: flex;
	justify-content: space-between;
	font-size: 0.8rem;
}

#privacyBanner p{
	margin-bottom: 0;
}


#description a:hover{
	text-transform: uppercase; 
}

@media (max-width: 985px){
	.carousel-content .lead{
	font-size: 0.9rem;
	}

	.carousel-content li{
	font-size: 0.85rem;
	}

	.carousel-content h2{
		font-size: 1rem;
	}

	#footer a{
		font-size: 0.9rem;
	}

	#price{
		
		font-size: 1.2rem;

	}
}

@media(max-width: 768px){
	#footer h5{
		font-size: 1rem;
	}

	#footer p{
		font-size: 0.8rem;
	}

	.carousel-inner{
		max-height: 460px;
		overflow: hidden;
	}

	.carousel-content h2{
		font-size: 0.9rem;
		padding-top: 10px;
	}

	.carousel-content p{
		font-size: 0.8rem;
		padding-top: 20px;
	}

	.carousel-content .lead{
	font-size: 0.9rem;
	}

	.carousel-content li{
	font-size: 0.85rem;
	}

	.carousel-content h2{
		font-size: 1rem;
	}

	#footer a{
		font-size: 0.8rem;
	}

	#sonar{
		padding-left: 15%;
	}

	#sonar p{
		font-size: 0.8rem;
		margin-top: 48px;
	}

	#selling li{
		font-size: 0.9rem;
		padding-bottom: 5px;
	}
}

@media(max-width: 780px){
	
	#openText .lead{
		font-size: 0.8rem;
	}

	#topBanner img{
		align-content: center;
	}

	.carousel-content {
		font-size: 0.8rem;
	}

	#covid .lead{
		font-size: 0.9rem;
	}

	#covid p{
		font-size: 1rem;
	}

	.prodimg h4{
		font-size: 1.3rem;
	}

	.prodimg p{
		font-size: 0.9rem;
	}

	.prodimg li{
		font-size: 0.7rem;
		padding: 0;
	}

	.prodimg a{
		font-size: 0.6rem;
	}

	.carousel-content .lead{
	font-size: 0.7rem;
	padding-top: 0;
	}

	.carousel-content li{
	font-size: 0.6rem;
	}

	.carousel-content h2{
		font-size: 0.9rem;
	}

	

	/*#slide2{
		max-width: 690px;
		max-height: 460px;
	}*/


}

@media (max-width: 720px) {
	#btn1{
		display: none;
	}
	#btn2{
		display: none;
	}
	#btn3{
		display: none;
	}
	#btn4{
		display: none;
	}
}


@media(max-width: 512px){
	#featuredProduct hr{
		height: 3rem;
	}

	.carousel-content h2{
		font-size: 0.8rem;
		padding-top: 10px;
	}

	.carousel-content p{
		font-size: 0.7rem;
		padding-top: 20px;
	}

	/*#unam .carousel-inner{
	max-height: 140px;
	width: 100%;
	height: 70%;
	overflow: hidden;
  	background-color: white;
  	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	}*/
/*
	#unam{
		max-height: 321.33px;

	}*/

	#price{
		font-size: 2rem;
	}
}

/*@media (max-width: 482px){
	#unam{
		max-height: 300px;
	}
}*/


@media screen and (max-width: 520px){
	
	.carousel-content .lead{
	font-size: 0.7rem;
	padding-top: 0;
	}

	.carousel-content li{
	font-size: 0.6rem;
	}

	.carousel-content .lead{
		font-size: 0.6rem;
	}

	/*#unam  {
		width: 35%;
		height: 95%;
		left: 2%;
	}*/

	.carousel-content h2{
		font-size: 0.9rem;
	}


	/*.carousel-inner{
	max-height: 320px;
	width: 100%;
	height: 100%;
	overflow: hidden;
  	background-color: white;
  	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	}*/

	#price{
		font-size: 2rem;
	}


}
@media (max-width: 1024px){
	#price{
		font-size: 1.1rem; 
	}

	#description img{
		height: 85%;
	}
}

@media (max-width: 662px){
	#price{
		padding-left: 25%;
		padding-bottom: 5%;
		font-size: 2rem;
	}

	#featuredProduct img{
		margin-left: 25%;
	}

	#featuredProduct h1{
		font-size: 1.7rem;
	}

	#featuredProduct span{
		margin-bottom: 0;
	}
}






