/* Some CSS resets, mixed selectively from Eric Meyer and HTML5 Boilerplate 
If they're too stringent for your taste, feel free to edit */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0px;
	padding: 0px;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

body {
	line-height: 1;
}





/* ==================================== 
 This will enforce block-level properties to HTML5 elements */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, fieldset, address, small, fieldset {
	display: block;
}


body {
	font-family: 'Open Sans', sans-serif;
	color:rgb(112,112,112);
	background:rgb(220,221,222);
}


#container {
width:1028px;
margin:auto;
position:relative;
}


#main {
	height:495px;
	background: white url('../images/office.jpg') no-repeat;
	position:relative;
}


#contact {
	width:160px;
	height:200px;
	text-align:right;
	position:absolute;
	right:90px;
	top:140px;
}

#contact  address {
	font-size:14px;
	line-height:18px;
	color:rgb(93,93,93);
	margin-bottom:30px;
	margin-right:18px;
	font-weight:300;
}

#contact img {
	border:0;
	
}

#contact div {
	margin-top:10px;
}


.contactbutton {
	-webkit-opacity:0.8;
	-moz-opacity:0.8;
	opacity:0.8;
}

.contactbutton:hover {
	-webkit-opacity:1;
	-moz-opacity:1;
	opacity:1;
}

img[src="images/linkedin_button.jpg"] {
	margin-right:29px;
}


#dottedline {
	position:absolute;
	right:1px;
	bottom:16px;
}

#sendnote {
	position:relative;
	bottom:2px;
}

footer {
	font-size:12px;
	margin:10px 0px 0px 0px;
}


em {
	font-style:italic;
}

@font-face {
  font-family: "FrederickatheGreat-Regular";
  src: url('css/FrederickatheGreat-Regular.ttf') format('truetype');
    font-weight: normal;
  font-style: normal;
    }

/* form container */
article {
	width:850px;
	height:630px;
	border:4px solid rgb(237,239,114);
	padding:25px;
	background:white;
	position:relative;
}

.modal_box {
		z-index:40;
	position:fixed;
	left:50%;
	top:50%;
	margin-left:-450px;
	margin-top:-370px;
}



#modal_shade {
position:fixed;
width:100%;
height:100%;
background:rgb(70,70,70);
opacity:0.7;
z-index:22;
}

article .close, section .close {
	position:absolute;
	right:20px;
	bottom:20px;
	display:block;
	border:2px solid white;
	width:20px;
	height:18px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	-webkit-box-shadow:0 0 3px black;
	-moz-box-shadow:0 0 3px black;
	box-shadow:0 0 3px black;
	text-decoration:none;
	text-align:center;
	background:rgb(70,70,70);
	color:white;
	padding:4px 1px 0 0;
	font-weight:700;
	font-size:13px;
	line-height:11px;
}

article .close:hover, section .close:hover {
	background:rgb(236,0,140);
}


form {
	line-height:1.5em;
	margin-top:20px;
}


form header {
	
}



form #left {
	position:relative;
	width:340px;
}

form #right {
	position:absolute;
	top:128px;
	right:100px;
	width:340px;
}



form h2, form p {
	font-family: 'FrederickatheGreat-Regular', serif;
}

img[src="images/howcanwehelpyou.jpg"] {
	width:362px; 
	height:37px; 
	position:relative; 
	right:6px;
}



.checkstax input {
clear:left;
display:block;
float:left;
margin-right:9px;
margin-top:2px;
}



.checkstax label {
	display:block;
	float:left;
	width:305px;
	margin-bottom:8px;
	line-height:1em;
}

textarea {
	width:340px;
	height:150px;
	margin-bottom:8px;
}

#visitor_info {
	line-height:1.75em;
}

#visitor_info label {
	font-size:0.8em;
}


input[name="visitor_name"] {
	width:200px;
}

input[type="email"] {
	width:150px;
}

input[name="phone1"],input[name="phone2"] {
	width:27px;
}

input[name="phone3"] {
	width:40px;
}

input[type="submit"] {
	margin-top:40px;
	cursor:pointer;
	display:block;
	float:right;
	margin-right:80px;
}

.error {
	width:340px;
	position:absolute;
	bottom:30px;
	left:30px;
}



/*Thankyou box*/
#thanks {
	width:300px;
	border:4px solid rgb(255,226,96);
	padding:25px;
	background:white;
	display:none;
}

.modal_box2 {
		z-index:40;
	position:fixed;
	left:50%;
	top:50%;
	margin-left:-150px;
	margin-top:-40px;
}






/* ++++++++++++++++++++++++
		MEDIA QUERIES 
	++++++++++++++++++++++++ */
	
/*
Note: when creating media queries for iPhone (320px-480px), it is recommended to do the following to disable text-size-adjust: 

html {
		-webkit-text-size-adjust: none;
	}

 */