body{

		font-family: Open Sans, Arial, sans-serif;

	font-size:1em;

	font-weight:300;

	margin:0px;

}

h1, h2, h3, h4{

	line-height:1em;

	margin:.45em 0;

	padding:0;

}


hr {

  border: 0;

  color: #666;

  background-color: #666;

  height: 1px;

  width: 100%;

  text-align: left;

  clear: both;

  margin-bottom: 15px;

} 

h1 {

	font-size: 1.8em;

	font-weight:300;

	margin-top: 0.5em;

	margin-right: 0;

	margin-bottom: 1em;

	margin-left: 0;

}



h2 {

    font-size: 1.6em;

    margin-top: 1em;

	margin-right: 0;

	margin-bottom: 0.67em;

	margin-left: 0;

	font-weight:300;

}



h3 {

    font-size: 1.4em;

    margin-top: 1em;

	margin-right: 0;

	margin-bottom: 0.67em;

	margin-left: 0;

	font-weight:400;

}



h4 {

    font-size: 1.2em;

    margin-top: 1em;

	margin-right: 0;

	margin-bottom: 0.67em;

	margin-left: 0;

	font-weight:400;

}

a,

a:visited,

a:active,

a:hover{color:#fff;}

a:hover{ text-decoration:none;}



a.mapprint{

	display:none;

}



*{	box-sizing:border-box;

	-moz-box-sizing:border-box;}



.wrapper{

	width: 100%; 

	margin: 0 auto;

}

.wrapper-c{

	width: 0%; 

	margin: 0 auto;

}





#header{

	width: 100%;

	padding-top:0px;

	padding-bottom:0px;

	padding-left:0em;

	padding-right:0em;

	margin: 0em;
	border-bottom: solid 1px #e0e0e0;

}

#header img, #logo img, #imeche img{

	vertical-align:top;

}

#logo{

	float:none;

	text-align:center;

	width:100%;

	padding: 1em;

	margin: 0em;

}

#menu{

	width: 100%;

	margin-top: 0px;

	margin-right: auto;

	margin-bottom: 0em;

	margin-left: auto;



}

#menu a{

color:#ec008b;
}

#menu a:hover{

	color:#000;

}


div.rowe{

	width: 100%;

	margin-top: 0px;

	margin-right: auto;

	margin-bottom: 0em;

	margin-left: auto;
	
	border-bottom: solid 1px #e0e0e0;
	
	color:#fff;

}

div.lefside{

	width: 100%;

	padding-bottom: 1.5em;

	padding-top: 1.5em;

	padding-left:1em;

	padding-right:1em;
	
	margin-top: 0px;

	margin-right: auto;

	margin-bottom: 0em;

	margin-left: auto;

}

div.nypd {
	padding: 0px !important;
}

div.swpgry {
	color:#5a5a5c !important;
}


div.lefside-txt{

	text-align:center;

}

div.rigside{

	width: 100%;

	padding-bottom: 1.5em;

	padding-top: 1.5em;

	padding-left:1em;

	padding-right:1em;

	margin-top: 0px;

	margin-right: auto;

	margin-bottom: 0em;

	margin-left: auto;

}

div.rigside-txt{

	text-align:center;

}
div.redrun{
	background-color: #02aef0;
}
div.yelrun{
	background-color: #Fef200;
	color:#000;
}
div.yelrun a, div.yelrun h2{
	color: #000;
}
div.grerun{
	background-color: #ec008b;
}
div.gryrun{
	background-color: #000;
}

div.shopper {
		background-image: url("/images/workshop-another.jpg");
		background-size: cover;
		background-position: center center;
	min-height:300px !important;
	}

.redt{
	color: #700019;
}
.yelt{
	color: #F9A61A;
}
.gret{
	color: #005F63;
}


#content {

	width: 100%;

	margin-right: auto;

	margin-left: auto;

	margin-bottom: 0em;

	margin-top: 0em;

	text-align: center;

	padding-top: 2em;

	padding-right: 1em;

	padding-bottom: 2em;

	padding-left: 1em;

	color: #5a5a5c;

	border-bottom: solid 1px #e0e0e0;
}

#content h2 {
	
	color: #5a5a5c;
	
}
#mbanner{

	width: 100%;

	text-align: center;

	margin: 0px;

	padding-bottom: 0em;

	padding-top: 0em;

	padding-left:0em;

	padding-right:0em;
border-bottom: solid 1px #e0e0e0;
}


p.testi{

	font-size:1.2em;

}

.iconn{

	margin-bottom:2em;

	margin-left: 0%;

	margin-right: 0%;

	width:100%;

	min-height:255px;

	background-color:#fff;

	padding-top: 0em;

	padding-bottom: 0em;

	padding-left:0em;

	padding-right:0em;

	float: left;

}



.iconn-text{

	padding-top: 1em;

	padding-right: 1em;

	padding-bottom: 1em;

	padding-left: 1em;

	color:#869099;

}

.iconn-text p{

	font-size:1em;

	padding:0px;

	margin:0px;

	color:#869099;

}

.iconn-text a{

	text-decoration:none;

	color:#869099;

	font-weight:bold;

}

#footer{

	width: 100%;

	text-align: center;

	background-color: #000;

	color: #fff;

	margin: 0px;

	padding-top: 1.5em;

	padding-right: 1em;

	padding-bottom: 1.5em;

	padding-left: 1em;

	font-weight:400;

	font-size:0.9em;

}

#footer a{

	text-decoration:underline;

	color:#ec008b;

}

#footer p.clause{

	font-size:0.8em;

}

#footer span.clause{

	font-size:0.8em;

	font-weight:normal;

}

.footer-element{

	text-align:center;

	font-weight:bold;
	padding-bottom: 12px;
	padding-top: 12px;

}	



p{ margin:0 0 1.0em;

	line-height:1.4em; 

}



p.credit{

	font-size:0.8em;

}



ul.cols {

	list-style-type:none;

    -moz-column-count: 2;

    -moz-column-gap: 20px;

    -webkit-column-count: 2;

    -webkit-column-gap: 20px;

    column-count: 2;

    column-gap: 20px;

}

ul.cols li{

	margin-bottom:20px;

	padding-bottom:1em;

	line-height:1.4em;

	font-weight:bold;

	border-bottom-width: 1px;

	border-bottom-style: solid;

	border-bottom-color: #eeeeee;

}



/* RESPONSIVE IMAGES */

img{

	max-width:100%;

	height:auto;

	border: none;

}



.right-img {

	display:block;

	width:100%;

}



/*colors and backgrounds*/

body{

	background:#fff;

}

h1, h3, h5{

	color:#fff; 

}

h2, h4, h6{

	color:#fff;

}



a.buttonlink{

	background:#869099;

	border-radius:7px;

	color:#fff;

	padding:10px;

	text-decoration:none;

	margin-top: 10px;

	margin-right: 15px;

	margin-bottom: 10px;

	margin-left: 0;

}

a.buttonlink:hover{

	background:#009EE3;

}





/* Contain floats*/ 

.clearfix:before,

.clearfix:after,

.row:before,

.row:after {

  content: " ";

  display: table;

}

.clearfix:after,

.container:after,

.row:after{

  clear: both;

}




/*

LARGER MOBILE DEVICES

This is for mobile devices with a bit larger screens.

*/

@media only screen and (min-width: 450px) {

.iconn{

	margin-left: 1%;

	margin-right: 1%;

	margin-top:2em;

	width:48%;

	min-height:255px;

}

}



/*

TABLET START

The average viewing window and preferred media query for those is 768px.

But I think that some more breathing space is good:)

*/

@media only screen and (min-width: 600px) {





}



/*

TABLET & SMALLER LAPTOPS

The average viewing window and preferred media query for those is 768px.

But I think that some more breathing space is good:)

*/

@media only screen and (min-width: 800px) {



h1 {

	font-size: 2.2em;

}



h2 {

    font-size: 2em;

}



h3 {

    font-size: 1.5em;

}



.wrapper, .wrapper-c{

	max-width: 1200px; 

	margin: 0px auto;

}



#header{

	padding:0em;

}



.iconn{

	margin-left: 1%;

	margin-right: 1%;

	margin-top:2em;

	width:23%;

	min-height:255px;

}



.iconn-text p{

	font-size:1.2em;

	padding:0px;

	margin:0px;

}



ul.cols {

    -moz-column-count: 3;

    -moz-column-gap: 20px;

    -webkit-column-count: 3;

    -webkit-column-gap: 20px;

    column-count: 3;

    column-gap: 20px;

} 

#logo {

	width: 30%;
	float: left;
	text-align: left;
	padding-bottom: 1em;
	padding-top: 1em;

}
	
	#menu {
		width:60%;
		float: right;
		text-align: left;
		padding-bottom: 0em;
	padding-top: 70px;
	}

#content{

	padding-bottom: 3em;

	padding-top: 3em;

	padding-left:2em;

	padding-right:2em;

}
	


	
#footer{

	padding-left:2em;

	padding-right:2em;

}



}



/*

DESKTOP

This is the average viewing window. So Desktops, Laptops, and

in general anyone not viewing on a mobile device. Here's where

you can add resource intensive styles.

*/

@media only screen and (min-width: 950px) {

	ul.cols {

    -moz-column-count: 4;

    -moz-column-gap: 20px;

    -webkit-column-count: 4;

    -webkit-column-gap: 20px;

    column-count: 4;

    column-gap: 20px;

} 

p.testi{

	font-size:1.5em;

}

h1 {

	font-size: 3em;

}



} 


@media only screen and (max-width: 1239px) {

	div.iceland {
		display: none;
	}
	
}

/*

LARGE VIEWING SIZE

This is for the larger monitors and possibly full screen viewers.

*/

@media only screen and (min-width: 1240px) {

#header{

	padding-left:0em;

	padding-right:0em;

}

.iconn{

	min-height:255px;

}
	
	div.lefside{

	width: 50%;

	float:left;

	text-align:center;

	padding-bottom: 2em;

	padding-top: 2em;

	padding-left:2em;

	padding-right:2em;

}

div.rigside{

	width: 50%;

	float:right;

	text-align:center;

	padding-bottom: 2em;

	padding-top: 2em;

	padding-left:2em;

	padding-right:2em;

}
	
	div.rigside-txt, div.lefside-txt{
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
	}

	div.hg6 {
	min-height:550px !important;
}
	
		div.hg4 {
	min-height:550px !important;
}
	
		div.iceland {
		background-image: url("/images/inside-workshop.jpg");
		background-size: cover;
		background-position: center center;
	}
	
#footer-text{

	width:100%;

	text-align:center;

}

.footer-element{

	text-align:center;

	padding-right:1em;

	padding-left:1em;

	display:inline;

}
	
	#menu{
		text-align: center;
	}

} 



/*

RETINA (2x RESOLUTION DEVICES)

This applies to the retina iPhone (4s) and iPad (2,3) along with

other displays with a 2x resolution.

*/

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),

       only screen and (min--moz-device-pixel-ratio: 1.5),

       only screen and (min-device-pixel-ratio: 1.5) {





} 



/*

iPHONE 5 MEDIA QUERY

iPhone 5 or iPod Touch 5th generation styles (you can include your own file if you want)

*/

@media (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) { 



  

}



/*

PRINT STYLESHEET

*/

@media print {

  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */

  a, a:visited { text-decoration: underline; }

  a[href]:after { content: " (" attr(href) ")"; }

  abbr[title]:after { content: " (" attr(title) ")"; }

  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */

  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }

  thead { display: table-header-group; } /* h5bp.com/t */

  tr, img { page-break-inside: avoid; }

  img { max-width: 100% !important; }

  @page { margin: 0.5cm; }

  p, h2, h3 { orphans: 3; widows: 3; }

  h2, h3 { page-break-after: avoid; }

}