/* Your custom styles */

/*-------------------------------------------------
>> Default Styles
-------------------------------------------------*/
html { scroll-behavior: smooth; }
.view,body,html{height:100%}.carousel{height:50%}.carousel .carousel-inner,.carousel .carousel-inner .active,.carousel .carousel-inner .carousel-item{height:100%}@media (max-width:776px){.carousel{height:100%}}.navbar{background-color:rgba(0,0,0,.2)}.page-footer,.top-nav-collapse{background-color:#929FBA}@media only screen and (max-width:768px){.navbar{background-color:#929FBA}}

html,body,header,.carousel {height: 85vh;}@media (max-width: 740px) {html,body,header,.carousel {height: 100vh;}}@media (min-width: 800px) and (max-width: 850px) {
	html,body,header,.carousel {height: 100vh;}}
@media (min-width: 800px) and (max-width: 850px) {.navbar:not(.top-nav-collapse) {background: #929FBA !important;}}

*{
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; 
}

/*-------------------------------------------------
>> Vars Styles
-------------------------------------------------*/
:root {
	--yellowish: #FDB913;
	--blueish: #0A2C4F;
	--transBlue: rgba(0, 26, 51, 0.85);;
}

/*-------------------------------------------------
>> Helper Classes Styles
-------------------------------------------------*/
.text-white{
	color: white!important;
}
.text-yellowish{
	color: var(--yellowish,#FDB913)!important;
}
.background-yellowish{
	background: #FDB913!important;
}
.background-dark-blue{
	background: #0A2C4F!important;
}
.uppercase-text{
	font-transform: uppercase!important;
}
.outline{
	background: transparent!important;
	border: 1px solid white!important;
	color: white!important;
	transition: all .5s;
}
.outline:hover{
	background: var(--yellowish, #FDB913)!important;
	border-color: var(--yellowish, #FDB913)!important;
}

/*-------------------------------------------------
>> Nav Styles
-------------------------------------------------*/
.navbar{
	background: white;
}
.top-nav-collapse br{
	display: none;
}
.top-nav-collapse .navbar-brand span{
	top: 10px!important;
}

/*-------------------------------------------------
>> Services Styles
-------------------------------------------------*/
.swerv{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	color: white;
	transition: all .5s;
}
.swerv hr{
	border-color:white;
}
.swerv > *, .swerv:before{
	transition: all .5s;
}
.swerv:before{
	content: '';
	background: rgb(255,255,255);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
}
.swerv:hover:before{
	opacity: .95;
}
.swerv:hover > *{
	position: relative;
	z-index: 1;
	color: rgb(50,50,50);
}
.swerv:hover > hr{
	border-top: 1px solid rgb(50,50,50); 
}
.services2{
	background:url('//bernhardtautorepair.com/images/neonbrand-2K_-PG95qlI-unsplash.jpg') center right no-repeat;
	background-size:cover;
}
.services3{
	background:url('//bernhardtautorepair.com/images/jia-ye-KqZ0rBcCYYg-unsplash.jpg') center center no-repeat;
	background-size:cover;
}
ul.socias{
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.socias li{
	display: inline;
	margin-right: 10px;
}

/*-------------------------------------------------
>> Slider Styles
-------------------------------------------------*/
.cntrlLeft, .cntrlRight{
	position: absolute;
}
.cntrlLeft{
	left: 0;
}
.cntrlRight{
	right: 0;
}
.slidey1{
	background-image: url('../../images/slide1.jpg'); 
}
.slidey2{
	background-image: url('../../images/slide2.jpg'); 
}
.slidey3{
	background-image: url('../../images/slide3.jpg'); 
}
.view{
	background-repeat: no-repeat; 
	background-size: cover;
}

/*-------------------------------------------------
>> Slider Caption Styles
-------------------------------------------------*/
.cappy {
	width: 63.75%;
	background: rgba(0, 26, 51, 0.85);
	padding: 8% 3%;
	text-align: left !important;
	position: absolute;
	bottom: 0;
	right: 2%;
}
.listy {
	position: absolute;
	top: 30px;
	right: 30px;
	list-style: none;
}
.listy li + li {

	margin: 12px 0;

}
.listy li a{
	color: white;
}
.listy li a:hover{
	color: #FDB913;
}

/*-------------------------------------------------
>> Package Box Styles
-------------------------------------------------*/
#packages{
	position: relative;
	background: #5B5B5B;
}
.packages ul{
	list-style: none;
	margin: 0;
	padding: 0;
}
.packages .card{
	text-align: center;
}
#packages::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url('//bernhardtautorepair.com/images/hannes-villez-exbw3-zgdu8-unsplash.jpg') center right no-repeat;
	background-size: auto;
	background-size: auto;
	background-size: cover;
	display: block;
	opacity: .2;
}
#packages .fancyLI + .fancyLI{
	border-top:1px solid grey;
	margin: 0 30px;
}

/*-------------------------------------------------
>> Footer Styles
-------------------------------------------------*/
footer form input, footer form textarea {
	color: white !important;
}
footer{
	background: #0C2D4E;
}
footer hr{
	border-color: white;
}
footer ul{
	margin: 0;
	padding: 0;
	list-style: none;
}