/* Validated on 08/25/15 as CSS level 3 compliant */

/* ======== Body Behaviors - No Margins and 100% Body Height ======== */
BODY {
	margin-top : 0; 
	margin-bottom : 0; 
	margin-right : 0; 
	margin-left : 0; 
	height : 100%; 
	font-family: Arial, Helvetica, sans-serif;
} 

/* ======== Main Text Black 12 px ======== */
.font1-1-12pt-bla {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 12px; 
	font-style : normal; 
	color : #222222; 
	background : inherit; 
	line-height : 18px;
} 

.font1-1-12pt-bla a:link {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-12pt-bla a:visited {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-12pt-bla a:hover {
	color : #AA0000; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ======== Main Text Black 13 px ======== */
.font1-1-12pt-bla {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 13px; 
	font-style : normal; 
	color : #222222; 
	background : inherit; 
	line-height : 18px;
} 

.font1-1-13pt-bla a:link {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-13pt-bla a:visited {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-13pt-bla a:hover {
	color : #AA0000; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ======== Special Header Black Text 19 px ======== */
.font1-1-19pt-bla {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 19px; 
	font-style : normal; 
	color : #444444; 
	background : inherit; 
	line-height : 30px;
} 

.font1-1-19pt-bla a:link {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-19pt-bla a:visited {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-19pt-bla a:hover {
	color : #AA0000; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ======== Special Header White Text 19 px ======== */
.font1-1-19pt-whi {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 19px; 
	font-style : normal; 
	color : #DDDDDD; 
	background : inherit; 
	line-height : 30px;
} 

.font1-1-19pt-whi a:link {
	color : #AABBFF; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-19pt-whi a:visited {
	color : #AABBFF; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-19pt-whi a:hover {
	color : #FFFF55; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ======== Special Header Large Black Text 22 px ======== */
.font1-1-22pt-bla {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 22px; 
	font-style : normal; 
	color : #444444; 
	background : inherit; 
	line-height : 35px;
} 

.font1-1-22pt-bla a:link {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-22pt-bla a:visited {
	color : #0000AA; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-22pt-bla a:hover {
	color : #AA0000; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ======== Special Header Large White Text 22 px ======== */
.font1-1-22pt-whi {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 22px; 
	font-style : normal; 
	color : #FFFFFF; 
	background : inherit; 
	line-height : 35px;
} 	

.font1-1-22pt-whi a:link {
	color : #FFFFFF; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-22pt-whi a:visited {
	color : #CCCCCC; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-22pt-whi a:hover {
	color : #FFFFCC; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ======== Special Header Extra Large Black Text 32 px ======== */
.font1-1-30pt-bla {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 30px; 
	font-style : normal; 
	color : #000000; 
	background : inherit; 
	line-height : 40px;
} 

/* ======== Special Header White Text 30 px ======== */
.font1-1-30pt-whi {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 30px; 
	font-style : normal; 
	color : #7788AA; 
	background : inherit; 
	line-height : 50px;
} 

.font1-1-30pt-whi a:link {
	color : #CCCCCC; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-30pt-whi a:visited {
	color : #CCCCCC; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-30pt-whi a:hover {
	color : #FFFF55; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ======== Special Header Bright White Text 30 px ======== */
.font1-1-30pt-bri-whi {
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 30px; 
	font-style : normal; 
	color : #FFFFFF; 
	background : inherit; 
	line-height : 50px;
} 

.font1-1-30pt-bri-whi a:link {
	color : #FFFFFF; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-30pt-bri-whi a:visited {
	color : #CCCCCC; 
	text-decoration : none; 
	background : inherit; 
} 

.font1-1-30pt-bri-whi a:hover {
	color : #FFFF55; 
	text-decoration : underline; 
	background : inherit; 
} 

/* ========== Rounded Table Border Grey with Dark Box Shadow ========== */
.Table-Border-Round-Dark-Shadow {
	border-left : 1px solid #BBBBBB; 
	border-bottom : 1px solid #BBBBBB; 
	border-right : 1px solid #BBBBBB; 
	border-top : 1px solid #BBBBBB; 
	border-radius: 8px;
    box-shadow: 8px 8px 8px #C0C0C0;
} 

/* ========== Rounded Table Border Grey ========== */
.Table-Border-Round {
	border-left : 1px solid #888888; 
	border-bottom : 1px solid #888888; 
	border-right : 1px solid #888888; 
	border-top : 1px solid #888888; 
	border-radius: 8px;
    box-shadow: 0px 0px 0px #F6F6F6;
} 

/* ========== Rounded Table Border Grey Transparent ========== */
.Table-Border-Round-Transparent {
	border-left : 1px solid #888888; 
	border-bottom : 1px solid #888888; 
	border-right : 1px solid #888888; 
	border-top : 1px solid #888888; 
	border-radius: 8px;
    box-shadow: 0px 0px 0px #F6F6F6;
	background:rgba(200,200,200,0.5);
} 

.Table-Border-Round-Trans-heavy {
	border-left : 1px solid #888888; 
	border-bottom : 1px solid #888888; 
	border-right : 1px solid #888888; 
	border-top : 1px solid #888888; 
	border-radius: 8px;
    box-shadow: 0px 0px 0px #F6F6F6;
	background:rgba(255,255,255,0.6);
} 

.Background-Transparency {
	background:rgba(10,10,10,0.9);
} 

.Background-Transparency-Dark {
	background:rgba(5,5,5,0.5);
} 

/* ======== Form Text Font 12 px ======== */
TEXTAREA { font-family: arial; font-size: 12px;
	font-style : normal; 
	font-weight : normal; 
	padding: 0.3em 0.3em;
} 

/* ======== Form Box Shadow 13 px ======== */
.shadeform { 
	font-family : Arial, Verdana, Tahoma, Georga, "Times New Roman", Times, serif; 
	font-size : 13px; 
	font-style : normal; 
	color : #000000; 
	background: url("images/form_shadow.gif");
	text-align: left;
	BORDER: #000000 1px solid
} 

/* ======== Hover Hand Pointers ======== */	
#mouseover {
	cursor:pointer;
}

#mouseover-2 {
	cursor:pointer;
}

#mouseover-3 {
	cursor:pointer;
}

#mouseover-4 {
	cursor:pointer;
}

/* ======== HR (Horizontal Row) Style Grey ======== */
hr.style-six {
	border: 0;
	height: 0;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #FFFFFF;
}

.imagewrapper {
  width: 100%; /* Or whatever width you want */
}

/* ======== Google Map - Responsive CSS ======== */
.map-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.map-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

/* ============= Responsive Image ============ */

.responsive-image {
  height: auto;
  width: 100%;
}

.responsive-image-100 {
  height: auto;
  width: 100%;
  max-width: 531px;
}

.responsive-image-90 {
  height: auto;
  width: 90%;
  max-width: 300px;
}

.responsive-image-75 {
  height: auto;
  width: 75%;
  max-width: 750px;
}

.responsive-image-50 {
  height: auto;
  width: 50%;
  max-width: 500px;
}

/* ============= Transparent Background colors ============ */

.transparent {
  background:rgba(255,255,255,0.1);
}

.transparent-2 {
  background:rgba(255,255,255,0.1);
}

/* ============= Responsive YouTube Video Container ============ */

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* ============= CSS Responsive Navigation Menu ============ */

.topnav {
  overflow: hidden;
  background-color: inherit;
}

.topnav a {
  display:inline-block;
  float: left;
  color: #BBBBBB;
  text-align: center;
  padding: 16px 18px;
  text-decoration: none;
  font-size: 15px;
}

.topnav a:hover {
  background-color: #FFFFFF;
  color: #000000;
}

.active {
  background-color: #1C4670;
  color: #FFFFFF;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 1170px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 1170px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}

.footer-links a:link {
	color: #AABBFF;
	text-decoration: none
}

.footer-links a:visited {
	color: #AABBFF;
	text-decoration: none
}

.footer-links a:hover {
	color: #FFFF55;
	text-decoration: none
}

.footer-links p {
	color: #7D7D7D
}

/* ============= Header ============ */

.badges img {
	display: inline-block;
	margin-bottom: 10px;
	padding: 0 10px;
	height: 65px;
}

.inner-page-header {
	margin-top: 20px;
}

/*ACCESSIBILITY PAGE*/

.businessname::after {
	content: 'Hibbard Builders, Inc'
}

.contactemail::after {
	content: 's.hibbard@hibbardbuilders.com'
}

.contactphone::after {
	content: '815-716-6150'
}

.websiteurl::after {
	content: 'hibbardbuilders.com'
}