/* Reset */
* { margin: 0; padding: 0; }
html { overflow-y: scroll;}
body { background:#F2F2F2; font-size: 13px; color: #666666; font-family: Arial, helvetica, sans-serif;}
ol, ul { list-style: none; margin: 0;}
ul li { margin: 0; padding: 0;}
p { font-size:1.8em; line-height:1.2em; color:#4C4C4C; text-align:center;}
img { display: block; margin-bottom: 10px;}
aside { font-style: italic; font-size: 0.9em;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block;}
	
	
/* Layout */
#topwrap			{width:100%; margin-bottom:10%;}
					 
#topwrap img		{width:100%; position:absolute; z-index:-1;}

#description		{width:70%;
					 max-width:940px;
					 margin:0 auto;
					 z-index:100;
					 padding:15% 0% 0% 0%;
					 }
					 
#description h1		{color:#FFF;}
					 
#description p		{margin-top:1.5%; color:#FFF;}

#wrapper 			{width:96%; max-width:940px; margin:0 auto; padding:0% 2% 0% 2%;} 

.main_image			{width:100%; /*margin-top:10%;*/ float:left;}
.main_image img 	{width:100%;}

.module_1			{width:100%; margin:10% 0% 10% 0%; float:left;}

.module_2			{width:100%; margin-top:10%; float:left;}
.module_2 img		{width:50%; float:left; margin-right:4%;}
.module_2 p			{font-size:1.4em; line-height:1.4em; color:#4C4C4C; text-align:left;}

.module_3			{width:100%; margin-top:4%; float:left;}
.column_left		{width:48%; float:left;}
.column_right		{width:48%; float:right;}
.module_3 p			{font-size:1.8em; line-height:1.2em; color:#4C4C4C; text-align:left;}

.module_4			{width:100%; margin-top:10%; float:left;}
.module_4 img		{width:50%; float:left; margin-right:4%;}
.module_4 p			{font-size:2.7em; line-height:1.3em; color:#4C4C4C; text-align:left;}

.module_5			{width:100%; float:left;}
.module_5 img		{width:50%; float:left; margin-bottom:-1%;}

#skills				{width:100%; float:left; margin-top:1%;}		
#gifleft			{width:33%; background:url(../images/circle_gif_sd.gif) no-repeat center top; float:left;}
#gifcenter			{width:33%; background:url(../images/circle_gif_dpd.gif) no-repeat center top; float:left;}
#gifright			{width:33%; background:url(../images/circle_gif_dps.gif) no-repeat center top; float:left;}
footer				{width:100%; height:60px; left:0; margin-top:20%; float:left;}		

/* Type */
h1 					{font-size:3.8em; font-family:Arial, 'Helvetica Neue', Helvetica, sans-serif; color:#EF4939; line-height:1.1em; text-align:center; margin-bottom:1%;}
h2					{font-size:2.7em; font-family:Georgia, Times, 'Times New Roman', serif; font-weight:500; line-height:1.3em; color:#4C4C4C; text-align:left;}
footer h2			{font-size:1.0em; font-family:Georgia, Times, 'Times New Roman', serif; font-weight:500; line-height:1.2em; color:#B4B4B4; text-align:center; margin-bottom:10px;}
h3					{font-size:1.2em; font-family:Arial, 'Helvetica Neue', Helvetica, sans-serif; color:#FF4432; text-align:center; padding-top:16px;}
a					{color:#EF4939; text-decoration: none;}




#buttonleft			{width:30%; height:45px; border:solid 2px; border-color:#FF4432; /*margin:0 auto;*/ margin:15px 0px 0px 18%; display:block; background:none; float:left;
					 transition: background-color 0.6s ease;
  					 background-color:none;}
#buttonright		{width:30%; height:45px; border:solid 2px; border-color:#FF4432; /*margin:0 auto;*/ margin:15px 18% 0px 0px; display:block; background:none; float:right; 
					 transition: background-color 0.6s ease;
  					 background-color:none;}	
					 	 
#buttonleft:hover,#buttonright:hover
					{background-color:#FF4432;}
					
#buttonleft:active,#buttonright:active
					{color:#FF4432;}

#buttonleft h3		{padding-bottom:16px;
					 transition: color 0.6s ease;
					 color:#FF4432;
					 }
#buttonleft h3:hover {color:#FFF;}

#buttonright h3		{padding-bottom:16px;
					 transition: color 0.6s ease;
					 color:#FF4432;
					 }
#buttonright h3:hover  {color:#FFF;}




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

#description		{width:90%; padding:15% 0% 0% 0%;}
		

/* Media Queries */
@media screen and (max-width: 640px) {

#topwrap			{width:100%; margin-bottom:0%;}
#topwrap img		{width:100%; position:absolute; z-index:-1;}

#description		{width:90%; margin:0 auto; z-index:100; padding:18% 0% 0% 0%; margin-bottom:10%;}
#description h1		{font-size:3.8em; line-height:1.0em; text-align:center; margin-bottom:25%;}
#description p		{font-size:2.0em; line-height:1.3em; text-align:center; color:#4C4C4C; padding-top:5%;}

#topwrap			{margin-bottom:10%;}

#wrapper 			{width:100%; margin:0 auto; padding:0% 0% 0% 0%;}

.module_1			{width:90%; margin:10% 5% 10% 5%; float:left;}
h2					{font-size:2.0em; font-weight:500; line-height:1.3em; color:#4C4C4C; text-align:left;}

.module_3			{width:100%; margin-top:10%; float:left;}
.column_left		{width:100%; margin:0% 5% 0% 5%; float:left;}
.column_right		{width:100%; margin:10% 5% 0% 5%; float:left;}

.module_3 p			{font-size:1.8em; line-height:1.2em; color:#4C4C4C; text-align:left;}
.module_5 img		{width:100%; float:left; margin-bottom:-1%;}

#buttonleft			{width:42%; height:45px; border:solid 2px; border-color:#FF4432; /*margin:0 auto;*/ margin:15px 0px 0px 5%; display:block; background:none; float:left;}
#buttonright		{width:42%; height:45px; border:solid 2px; border-color:#FF4432; /*margin:0 auto;*/ margin:15px 5% 0px 0px; display:block; background:none; float:right;}

@media screen and (max-width: 640px) {
#description p		{padding-top:0%;}

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

#topwrap			{width:100%; margin-bottom:0%;}
#topwrap img		{width:100%; position:absolute; z-index:-1;}

#description		{width:70%; margin:0 auto; z-index:100; padding:20% 0% 0% 0%;}
#description h1		{font-size:3.0em; line-height:1.0em; text-align:left; margin-bottom:30%;}
#description p		{font-size:2.0em; line-height:1.3em; text-align:left; color:#4C4C4C;}

#wrapper 			{width:100%; margin:0 auto; padding:0% 0% 0% 0%;} 
#description		{width:90%; margin:0 auto; margin-bottom:10%;}
.module_5			{width:100%; float:left;}
.module_5 img		{width:100%; float:left; margin-bottom:-1%;}

.module_3			{width:100%; margin-top:10%; float:left;}
.module_3 p			{font-size:1.8em; font-family:Georgia, Times, 'Times New Roman', serif; line-height:1.2em; color:#4C4C4C; text-align:left;}
.column_left		{width:90%; margin:0% 5% 0% 5%; float:left;}
.column_right		{width:90%; margin:10% 5% 0% 5%; float:left;}

.module_1			{width:90%; margin:10% 5% 10% 5%; float:left;}
h2					{font-size:2.0em; font-weight:500; line-height:1.3em; color:#4C4C4C; text-align:left;}
.module_3 p			{font-size:1.6em; line-height:1.3em; color:#4C4C4C; text-align:left;}

#buttonleft			{width:42%; height:45px; border:solid 2px; border-color:#FF4432; /*margin:0 auto;*/ margin:15px 0px 0px 5%; display:block; background:none; float:left;}
#buttonright		{width:42%; height:45px; border:solid 2px; border-color:#FF4432; /*margin:0 auto;*/ margin:15px 5% 0px 0px; display:block; background:none; float:right;}

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

#description h1		{margin-bottom:18%;}

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

#description h1		{margin-bottom:12%;}
#description p		{margin-bottom:-4%;}

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

#description		{padding:10% 0% 0% 0%;}
#description h1		{font-size:2.6em; line-height:1.0em; text-align:left; margin-bottom:12%;}