@import url("http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css");

* { margin:0; padding:0; box-sizing:border-box; }

body { background-color:#383838; font-family:"Open Sans", sans-serif; font-size:16px; line-height:20px; }

img { max-width:100%; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; vertical-align:middle; } /* html5 img margin bottom fix */

a { color:#147; text-decoration:none; }
a:hover { color:#013; text-decoration:underline; }

.row { display:table; table-layout:fixed; width:100%; }
.col { display:table-cell; vertical-align:top; padding:10px; }

.percent10 { width:10%; }
.percent15 { width:15%; }
.percent20 { width:20%; }
.percent25 { width:25%; }
.percent30 { width:30%; }
.percent33 { width:33.33333333333333%; }
.percent35 { width:35%; }
.percent40 { width:40%; }
.percent50 { width:50%; }
.percent60 { width:60%; }
.percent70 { width:70%; }
.percent75 { width:75%; }
.percent80 { width:80%; }
.percent90 { width:90%; }

.padding0 { padding:0; }
.padding5 { padding:5px; }
.padding10 { padding:10px; }
.padding20 { padding:20px; }

.left { text-align:left; }
.center { text-align:center; }
.right { text-align:right; }

.inner { background-color:#e8e8e8; padding:20px; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; box-shadow:3px 3px 0px rgba(0,0,0,.3); }

.wrapper { padding:10px; width:1200px; margin:auto; }

#header .inner { padding:10px; background-color:transparent; color:#fff; text-shadow:1px 1px 2px #000; box-shadow:none; }

#navigation .inner { padding:0; }
#navigation .inner a { display:block; text-decoration:none; padding:15px 10px; color:#000; }
#navigation .inner:hover  { background-color:#bdf; }

#contents {  }
#contents .inner { padding:10px; }
#contents p { margin:0 0 20px 0; }
#contents p:last-child { margin:0; }

#page h1 { font-size:25px; line-height:29px; }
#page h2 { font-size:22px; line-height:26px; }
#page h3 { font-size:20px; line-height:24px; }
#page h4 { font-size:19px; line-height:23px; }
#page h5 { font-size:18px; line-height:22px; }
#page h6 { font-size:17px; line-height:21px; }
#page h1,#page h2,#page h3,#page h4,#page h5,#page h6 { margin-bottom:20px; }

#contact { margin:30px 0 10px 0; }
#copyright { margin:0 0 20px 0; }
#contact *, #copyright * { color:#fff; text-shadow:1px 1px 2px #000; }

/*******************/
/*** SEARCH FORM ***/
/*******************/

#form-container { width:100%; margin-bottom:20px; }
#searchinput {
	background:none repeat scroll 0 0 #fafafa;
	border:1px solid #383838;
	border-right:none;
	border-radius:3px 0 0 3px; -webkit-border-radius:3px 0 0 3px; -moz-border-radius:3px 0 0 3px;
	color:#5e5e5e;
	display:block;
	padding:10px;
	width:100%;
	box-sizing:border-box;
	font-size:16px;
	margin:0;
	outline:0;
	height:40px;
}
#searchtext { overflow:hidden; }
button.search-submit-button {
	background:none repeat scroll 0 0 #383838;
	border:1px solid #383838;
	border-left:none;
	border-radius:0 3px 3px 0; -webkit-border-radius:0 3px 3px 0; -moz-border-radius:0 3px 3px 0;
	color:#fff !important;
	text-shadow:1px 1px 2px rgba(0,0,0,.6);
	display:block;
	float:right;
	font-size:20px;
	padding:8px 6px;
	margin:0;
	text-align:center;
	width:50px;
	box-sizing:border-box;
	outline:0;
	height:40px;
	cursor:pointer;
}

/******************************/
/*** RESPONSIVE BREAKPOINTS ***/
/******************************/

@media screen and (max-width:1215px){
	.wrapper { width:100%; }
}

@media screen and (max-width:900px){
	.hiddenonmedium { display:none !important; }
}

@media screen and (max-width:600px){
	.hiddenonsmall { display:none !important; }
	
	#page { display:block; width:100%; margin-bottom:20px; }
	
	#side { display:block; width:100%; }
	
	#footer .col { display:table-row; }
	#footer .col .inner { margin:10px; }
	#footer span { display:block; height:5px; visibility:hidden; }
	
	#sociallinks { width:100%; }
	
	#contact { margin:20px 0 25px 0; }
	#contact span { display:block; height:5px; visibility:hidden; }
	#copyright span { display:block; height:5px; visibility:hidden; }
}