@charset "utf-8";
/*
style.css
Site: Tuttle Group Splash Page
Authors: Nate Cornelius & Nicole Sohns| Hole in the Roof Marketing | holeintheroof.com

Color Codes:

Dark blue: #476aab
light blue: #7c9ad2
--------------------------
*/


/*-----------------
  EMBEDED FONTS
-----------------*/
@import url(http://fonts.googleapis.com/css?family=Francois+One);
@import url(http://fonts.googleapis.com/css?family=Vollkorn:400,700);
/*
font-family: 'Vollkorn', serif;
font-family: 'Francois One', sans-serif;
*/


/*-----------------
MAIN
-----------------*/

body{ font-family:Vollkorn; line-height:2;
	background: url(../images/bg.jpg) no-repeat fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;}
.container{width:100%;}
h1{font-size:66px; color:#476aab; text-transform:uppercase;padding-top:87px;font-family:Vollkorn; padding-bottom:0px;}
h2{font-family:Francois One; font-size:28px; color:#7c9ad2; text-transform:uppercase; margin-top:0px; padding-top:0px; padding-bottom:0px;}
h3{font-size:20px;margin-top:0px; margin-bottom:0px;}
.col-sm-12{text-align:center;}
.boxes ul{margin-top:35px;}
.boxes li{list-style:none; text-align:center; font-size:17px; color:white; line-height:2;}
.boxes li:first-child{text-decoration:underline; font-size:16px; margin-top:5%;}
.boxes li:first-child:hover{ font-style:italic;}
.boxes img{
	background: rgba(255, 255, 255, 0.1); display: block;
  margin-left: auto;
  margin-right: auto;
  padding:26px;
  border-radius:17px;}
.boxes img:hover{background: rgba(255, 255, 255, 0.4); display: block;}
.box-line{max-width:767px; margin:auto;}
.banner { 
	width:100%;
	height:auto;
	background: rgba(0, 0, 0, 0.1);
	margin-top:31px;
	padding:10px 0px;}
.banner p{
	font-family:Francois One;
	color:#fff;
	font-size:17px;
	padding:20px 3%;
	text-align:center;
	letter-spacing:1px;
	line-height:2;
	margin-bottom:0px;}
footer p{text-align:center; color:#fff; font-size:12px; padding-top:55px; letter-spacing:1px;}

@media only screen and (max-width: 767px) {
.box-line {max-width:none;}
.boxes img{
	background: rgba(255, 255, 255, 0.6); display: block;}
}
@media only screen and (max-width: 400px) {
h1{font-size:38px;}
.boxes img{width:100%; height:auto;}
}