@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,700');

html, body {
	height: 100%;
	width: 100%;
	font-family: 'Poppins', sans-serif;
	color: #222;
}

.navbar{
	padding: .8rem;
}

.navbar-nav li {
	padding-right: 20px;
}

.nav-link{
	font-size: 1.1em !important; 
}

.carousel-inner img{
	width: 100%;
	height: 100%;
}

.carousel-caption {
	positon: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.carousel-caption h1 {
	font-size: 350%;
	text-transform: uppercase;
	text-shadow: 1px 1px 15px #000;
}

.padding {
	padding-bottom: 2rem;
}

.welcome {
	width: 75%;
	margin: 0 auto;
	padding-top: 2rem;
}

.welcome hr{
	border-top: 2px solid #b4b4b4;
	width: 95%;
	margin-top: .3rem;
	margin-bottom: 1rem;
}

footer{
	background-color: #343A40;
	color: #d5d5d5;
	padding-top: 2rem;
}

hr.light{
	border-top: 1px solid #d5d5d5;
	width: 75%;
	margin-top: .8rem;
	margin-bottom: 1rem;
}

hr.light-100{
	border-top: 1px solid #d5d5d5;
	width: 100%;
	margin-top: .8rem;
	margin-bottom: 1rem;
}

footer a{
	color: #d5d5d5;
}

.logos {
	width: 65%;
	height: 65%;
}
.navbar-brand{
	width:auto;
}
	
.nav-link{
	color: #FFFFFF;
}

.seals{
    height: 150px;
    object-fit: contain;
	padding: 1.5rem;
}

.seals_about{
    width: 150px;
	height: 150px;
    object-fit: contain;
}

.certs{
    height: 400px;
    object-fit: contain;
}

.sealContainer{
	padding: 3rem;
}

.text-box{
	margin: auto;
}

.shadow-me {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	text-align: center;
}
.service_option{
	color:#F5F5F5;
	font-size:125%;
}
.service_option a:link,a:visited{
		color:#F5F5F5;
}
.services{
	font-size:120%;
	height:100%;
	text-align: center;
	margin:autopx;
	width:100%;
}

.certificate{
	outline-style: solid;
	outline-width: 2px;
	outline-color: #454545;
	text-align: center;
	width: 180px;
}

a:link.normal-link, a:visited.normal-link{
	color: #0000EE;
	height: 100%;
	width: 100%;
	font-family: 'Poppins', sans-serif;
}

/*---Media Queries --*/
@media (max-width: 1400px) {
	.social a{
		font-size: 4em;
		padding: 2rem;
	}
	.carousel-caption {
		top:40%;
	}

	.carousel-caption h1 {
		font-size: 250%;
	}
	
	.service_option{
		color:#F5F5F5;
		font-size:80%;
	}

	.service_option a:link,a:visited{
		color:#F5F5F5;
	}

}
@media (max-width: 1200px) {
	.social a{
		font-size: 2.5em;
		padding: 1.2rem;
	}
	
	.carousel-caption {
		top:45%;
	}

	.carousel-caption h1 {
		font-size: 200%;
	}

	.carousel-caption .btn{
		font-size: 95%;
		padding: 8px 14px;
	}
	
	.display-4{
		font-size: 200%;
	}
	
	.service_option{
		color:#F5F5F5;
		font-size:80%;
	}

	.service_option a:link,a:visited{
		color:#F5F5F5;
	}
}
@media (max-width: 800px) {
	.social a{
		font-size: 2em;
		padding: .7rem;
	}
	
  	.carousel-caption {
		top:40%;
	}

	.carousel-caption h1 {
		font-size: 150%;
	}

	.carousel-caption .btn{
		font-size: 90%;
		padding: 4px 8px;
	}
	.carousel-indicators {
		display: none;
	}
	
	.display-4{
		font-size: 160%;
	}
	
	.service_option{
		color:#F5F5F5;
		font-size:80%;
	}

	.service_option a:link,a:visited{
		color:#F5F5F5;
	}
	
	.logos {
		width: 100%;
		height: 100%;
	}
	
	.navbar-brand{
		width: 40%;
		margin:0px;
		padding-right:0px;
	}
}


/*---Firefox Bug Fix --*/
.carousel-item {
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
}
/*--- Fixed Background Image --*/

figure {
	height:100%;
}

/*--- Bootstrap Padding Fix --*/
[class*="col-"] {
    padding: 1rem;
}

/*- Image Hover CSS -*/
.img-hover img {
    -webkit-transition: all .3s ease; /* Safari and Chrome */
  	-moz-transition: all .3s ease; /* Firefox */
  	-o-transition: all .3s ease; /* IE 9 */
  	-ms-transition: all .3s ease; /* Opera */
  	transition: all .3s ease;
  	position:relative;
}
.img-hover img:hover {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform:translateZ(0) scale(1.20); /* Safari and Chrome */
    -moz-transform:scale(1.20); /* Firefox */
    -ms-transform:scale(1.20); /* IE 9 */
    -o-transform:translatZ(0) scale(1.20); /* Opera */
    transform:translatZ(0) scale(1.20);
}
  
.img-hover:hover:after {
    content:"";
    position:absolute;
    top:0;
    left:0;
    z-index:2;
    width:30px;
    height:30px;
}

.img-hover2 img {
    -webkit-transition: all .3s ease; /* Safari and Chrome */
  	-moz-transition: all .3s ease; /* Firefox */
  	-o-transition: all .3s ease; /* IE 9 */
  	-ms-transition: all .3s ease; /* Opera */
  	transition: all .3s ease;
  	position:relative;
}
.img-hover2 img:hover {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform:translateZ(0) scale(1.10); /* Safari and Chrome */
    -moz-transform:scale(1.10); /* Firefox */
    -ms-transform:scale(1.10); /* IE 9 */
    -o-transform:translatZ(0) scale(1.10); /* Opera */
    transform:translatZ(0) scale(1.10);
}
  
.img-hover2:hover:after {
    content:"";
    position:absolute;
    top:0;
    left:0;
    z-index:2;
    width:30px;
    height:30px;
}
  
.grayscale {
  -webkit-filter: brightness(1.10) grayscale(100%) contrast(90%);
  -moz-filter: brightness(1.10) grayscale(100%) contrast(90%);
  filter: brightness(1.10) grayscale(100%); 
}

/*
Extra small (xs) devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap

Small (sm) devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

Medium (md) devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

Large (lg) devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

Extra (xl) large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
*/