@charset "utf-8";
/*font-family: 'Lora', serif;
font-family: 'Overpass', sans-serif;
*/

/*Elegant Logotypes:
royal blue: #020873
dark blue: #020F59
light blue: #074073
turquoise: #9BF2EA
black: #0D0D0D
*/

/*A Cold Wall:
pastel blue: #4178BF
bright blue: #66B1F2
gray: #F0F1F2
tan: #BF877A
black: #0D0D0D
*/

/* serif font family Lora for body*/
body {font-family: 'Lora',serif;
}

h1,h2,h3,h4,h5,h6 {font-family: 'Overpass', sans-serif;
}
.navbar-custom {font-family:'Lora',serif;
}
/* Background color for navbar and dropdown menus */
.navbar-custom, .navbar-custom .dropdown-menu {
background-color: #66B1F2;
}
/* Text color for navbar and dropdown menus */
.navbar-custom .navbar-brand, .navbar-custom .navbar-text,
.navbar-custom .navbar-nav .nav-link,
.navbar-custom .dropdown-item {
color: #F0F1F2;
}
/* Background and text colors for current page link and links on hover and
focus */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link,
.navbar-custom .nav-item:focus .nav-link,
.navbar-custom .dropdown-item:hover,
.navbar-custom .dropdown-item:focus {
background-color: rgba(65,120,191,1.00);
color: #fff;
}
.navbar-custom a:hover {
	font-weight: 700;
	color: #074073;
	background-color:rgba(65,120,191,1.00);
}
.navbar-custom a:active {
	background-color: rgba(65,120,191,1.00);
	color: #074073;
}
/* Border and text colors for menu icon on small screens */
.custom-toggler.navbar-toggler {
border-color:#F0F1F2 ;
color: #fff;
}
/* Hamburger icon - use same rgb values as previous rule for stroke*/ 
.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(65,120,191,0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

/*navbar-brand logo*/

.navbar-brand {
    background-image: url(../images/logo%20redo.png);
    background-repeat: no-repeat;
    background-size: 37px auto;
    background-position: 10px center;
    padding-left: 60px;
}

/*header banner section*/
#about_banner {
	padding-left: 0px;
	padding-right: 0px;
	position: relative;
}

/*rem values are relative to the root html element, 1rem=16px*/
#about_banner h1 {
	font-size: 4rem;
	color: #FFF;
	text-shadow: 3px 5px rgba(36,35,35,1.00);
	position: absolute;
	left: 3%;
	bottom: 7%;
}

/*3 col main section*/
.main h2 {
	text-align: center;
	font-weight: 800;
}

/*Featurettes*/
.featurette {
	text-align: center;
	display: flex;
}

.featurette-divider {
	margin: 5rem 0; /*space out the bootstrap <hr> more*/
}

/*Thin out main section headings*/
.featurette-heading {
	padding-top: 60px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: .03rem;
}

.contact_head {
	color: #074073;
	font-weight: 900;
	
}

.contact_side {
	background: white url("../images/tree-car.jpg") no-repeat center center;
	background-size: cover;
	padding:0;
	height: 540px;
	
}

.fa {
	padding: 10px;
	font-size: 30px;
	width: 40px;
	margin-right: 5px;
	text-align: center;
	text-decoration: none;
}

.fa:hover {
	opacity: 0.7;
}


/*footer*/
footer {
	text-align: center;
	line-height: 60px;
	background-color: #22222A;
	color: #ffeee0;
}

/*Media Query Breakpoints*/

/*Small Devices ONLY*/
@media (min-width:375px){
	#about_banner h1 {
		font-size: 1rem;
		bottom: 3%;
		left: 3%;
	}
}

/*SMALL SIZE ONLY*/
@media screen and (min-width:576px){
	#about_banner h1 {
    font-size: 1rem;
    bottom: 3%;
    left: 3%;
    }    
}

/*MEDIUM SIZE ONLY*/
@media (min-width: 768px) {
  #about_banner h1 {font-size: 2rem;
               bottom: 5%;
               left: 3%;
              }
  }

/*LARGE SIZE ONLY*/
@media screen and (min-width:992px){
    #about_banner h1 {
        font-size: 3rem;
        bottom: 5%;
        left: 3%;
        }
}