body {font-family: "ropa-sans-pro"; /** RopaSansPro-Light **/
			font-weight: 300;
			margin:0px; 
			padding:0px;
			background-color:#232323;}
			
			.desktop {display:none;}
		
		.topbg {width:100%;
			float:left;
			background-color:#fff;
			padding:0 0 30px 0;}
			
		.wrapper {width:97%;
			max-width:1100px;
			margin:0px auto;
			padding:0px 5px;}
			
			.padding {width:100%;
				padding:40px 0;
				overflow:hidden;}
			
			.toppadding {width:100%;
				padding:40px 0 0 0;
				overflow:hidden;}
			
			.bottompadding {width:100%;
				padding:0 0 40px 0;
				overflow:hidden;}
			
			.nopadding {width:100%;
				padding:0;
				overflow:hidden;}
			
		.swrapper {width:97%;
			max-width:700px;
			margin:0px auto;
			padding:0px 5px;}
		
		#namebanner {width:180px;
			background-color:#0068b3;
			color:#fff;
			margin:0;
			padding:10px 35px 0px 35px;}
			
		h1 {font-size:40pt;
			font-weight:300;
			line-height:60px;
			letter-spacing: 2px;
			text-align:center;}
		
		h2 {font-size:28pt;
			font-weight:300;
			letter-spacing: 2px;
			color:#0068b3;
			display:block;
			width:100%;
			border-top:1px solid #0068b3;
			border-bottom:1px solid #0068b3;
			margin:0 0 30px 0;}
			
		p {font-size:15pt;
			line-height:30px;}
			
		.pagebg {width:100%;
			float:left;
			background-color:#fff;
			position:relative;
			z-index:5;
			overflow:hidden;
			padding:0 0 50px 0;}
				
			.button {width:45%;
				display:block;
				float:left;
				font-size:14pt;
				padding:10px 2%;
				background-color:#0068b3;
				color:#fff;
				text-decoration:none;}
				.button:hover {background-color:#333;
					-webkit-transition: all 0.3s ease-in-out;
					-moz-transition: all 0.3s ease-in-out;
					-o-transition: all 0.3s ease-in-out;
					-ms-transition: all 0.3s ease-in-out;
					transition: all 0.3s ease-in-out;}
				
				.button:nth-of-type(2n+1) {margin:0 1% 16px 0;}
				.button:nth-of-type(2n+2) {margin:0 0 16px 1%;}
				
				
			.lr {width:100%;
				float:left;
				margin:0 0 30px 0;}
			
				.lr img {width:96%;
					float:left;
					margin:0 2%;}
			
			.homelr img {width:48%;
				float:right;
				margin-left:2%;}
			
			.leftbutton {float:left;
				text-align:left;}
			.rightbutton {float:right;
				text-align:right;}
			.leftbutton, .rightbutton {display:block;
				width:45%;
				max-width:200px;
				background-color:#0068b3;
				border:1px solid #0068b3;
				font-size:16pt;
				color:#fff;
				padding:12px 2%;
				text-decoration:none;}
				.leftbutton:hover, .rightbutton:hover {color:#0068b3;
					background-color:#fff;
					-webkit-transition: all 0.3s ease-in-out;
					-moz-transition: all 0.3s ease-in-out;
					-o-transition: all 0.3s ease-in-out;
					-ms-transition: all 0.3s ease-in-out;
					transition: all 0.3s ease-in-out;}
			
			.backbutton {display:block;
				width:200px;
				background-color:#0068b3;
				border:1px solid #0068b3;
				font-size:16pt;
				color:#fff;
				padding:12px 2%;
				text-decoration:none;}
				.backbutton:hover {color:#0068b3;
					background-color:#fff;
					-webkit-transition: all 0.3s ease-in-out;
					-moz-transition: all 0.3s ease-in-out;
					-o-transition: all 0.3s ease-in-out;
					-ms-transition: all 0.3s ease-in-out;
					transition: all 0.3s ease-in-out;}
		
		
		@media only screen and (min-width: 851px) {
		.container {position: relative;
			width: 31%;
			float:left;
			margin-bottom:40px;}
			.container:nth-of-type(3n+1) {margin-right:3.5%;}
			.container:nth-of-type(3n+3) {margin-left:3.5%;}
		}
		@media only screen and (min-width: 551px) and (max-width: 850px) {
		.container {position: relative;
			width: 48%;
			float:left;
			margin-bottom:30px;}
			.container:nth-of-type(2n+1) {margin-right:2%;}
			.container:nth-of-type(2n+2) {margin-left:2%;}
		}
		@media only screen and (max-width: 550px) {
		.container {position: relative;
			width: 96%;
			float:left;
			margin:0 1% 25px 2%;}
		}
		
		
		@media only screen and (min-width:651px) {		
		.fourths {width:32%;
			float:left;}
			.fourths img {width:100%;}
			.fourths:nth-of-type(3n+1) {margin:0 1% 20px 0;}
			.fourths:nth-of-type(3n+2) {margin:0 1% 20px 1%;}
			.fourths:nth-of-type(3n+3) {margin:0 0 20px 1%;}
		}
		@media only screen and (max-width:650px) {		
		.fourths {width:49%;
			float:left;}
			.fourths img {width:100%;}
			.fourths:nth-of-type(2n+1) {margin:0 1% 15px 0;}
			.fourths:nth-of-type(2n+2) {margin:0 0 15px 1%;}
		}
			

		.portfolioimage {display: block;
		  width: 100%;
		  height: auto;}

		.overlay {position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			height: 100%;
			width: 100%;
			opacity: 0;
			transition: .5s ease;
			background-color: #0068b3;}

		.container:hover .overlay {opacity:.85;
			filter: alpha(opacity=80);
			-webkit-transition: all 0.3s ease-in-out;
			-moz-transition: all 0.3s ease-in-out;
			-o-transition: all 0.3s ease-in-out;
			-ms-transition: all 0.3s ease-in-out;
			transition: all 0.3s ease-in-out;}

		.text {color: #fff;
			font-size: 20px;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			-ms-transform: translate(-50%, -50%);
			text-align: center;}
					
		.bottombg {width:100%;
			float:left;
			text-align:center;
			color:#fff;}