@charset "utf-8";
/* CSS Document */

#contact-box {
	margin: 0 auto;
	width: 75%;	
	padding-top: 1em;
	text-align: center;

}

h1 {
	text-align: left;
	display: inline-block;
	width: 1400px;
	color: #8DB630;
	font-size: 2em;
	font-weight: normal;
	font-family:"Century Gothic", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
}

.contact-image {
	border-radius: 1em;
	display: inline-block;	
	z-index: 199;
}

#photo-credit-box {
	width: 300px;
	display: inline-block;
	margin-right: 50px;
}

.photo-credit-2 {
	width: 300px;
	padding: 3px 0;
	text-align: left;
	font-size: .5em;
	color: #000;
	font-family:"Century Gothic", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
}

.contact-info {
	text-align: left;
	width: 350px;
	display: inline-block;
	color: #000;
	font-size: 1em;
	line-height: 1.5em;
	vertical-align: top;
	font-family:"Century Gothic", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
}

.contact-title, .contact-direct {
	font-size: 1.2em;
	font-weight: bold;
}

.contact-direct {
	background-color: #DDEDB8;
	padding: .1em .5em;
	border-radius: .5em;
	display: inline-block;
	margin-bottom: 10px;
	margin-left: -8px;
}

.contact-email {
	color: #607A2E;
	text-decoration: none;
}

.contact-email::before{content: url(../images/icon-email.png); margin-right: 7px;}
.contact-fax::before{content: url(../images/icon-fax.png); margin-right: 7px;}
.contact-phone::before{content: url(../images/icon-phone.png); margin-right: 7px;}

.contact-email:hover {
	color: #4A4A4A;
	font-weight: bold;
}

#MyGmaps {
	margin: 0 auto;
	width: 80%;
	text-align: center;
}


iframe {
	margin: 2em auto;
 	width: 600px; 
	height: 450px;
	border: 1px solid #CECECE;
}


/* Responsive Content */
@media all and (max-width: 1895px) {
	h1 {width: 1050px;}
}

@media all and (max-width: 1422px) {
	#contact-box {padding-left: 6.5em;}
	h1 {width: 700px;}
}

@media all and (max-width: 950px) {
	#MyGmaps {text-align: left;}
	iframe {margin: 2em 0; width: 75%; height: 300px;}
	#contact-box {text-align: left; padding-left: 0;}
	h1 {font-size: 1.8em; width: 150px;}
	.contact-image {margin: 0; padding: 0; display: block;}
	.contact-info {font-size: 85%;}
}

@media all and (max-width: 480px) {
	#contact-box {width: 80%;}
	iframe {height: 200;}
	h1 {font-size: 1.5em !important;}
	.contact-image {width: 75%; height: auto; margin: 0; padding: 0;}
	.contact-info {font-size: 75%; width: auto; display: block;}
	#photo-credit-box {width: auto;}
	.photo-credit-2 {width: auto; font-size: 5px !important;}
	footer {margin-top: 2em;}
}