@charset "utf-8";
/* CSS Document*/
/* move header out a bit from the left margin */
header {
 	margin-left:20px;  
}

/* Styling body*/
body {
	background-color:#FFF;
	font-family: 'Roboto', sans-serif;
	font-size:12px;
    padding:30px; 
}

/* Styling hyperlinks */
a {
	color:#5A5A5A;
	text-decoration:none;
	border:none;
	list-style:none;
}

a:hover {	
	color:#B11F1F;
}

/* Styling headings */
h1,h2,h4 {
 	margin:0;
}
h4 {
	color:#C9C9C9;
	font-weight:300;
	/* move quote closer to header*/
    margin-top:-8px; 
}
h2 {
	color:#5A5A5A;
	font-weight:100;

}

h3 {
/*	color:#C9C9C9; */
	color:	#666;
	font-weight:300;
	/* move quote closer to header*/
    margin-top:-8px; 
}

/* Styling navigation list */
nav {
	float:left;
	width:60px;
	font-size:14px;
	/* align menu to centre above gallery  */
	padding:2%;
}

nav ul {
 	list-style-type:none; 
	padding:0px;
/*	width:60px;  */
}
nav ul ul {
	display:none;
/*	width:60px; */
}
nav ul li:hover ul {
	display:block;
	position:absolute;
	float:right;
	margin-left:60px;
	margin-top:-20px;
	background:#FFF;
	-moz-box-shadow: 4px 4px 2px #888;
	-webkit-box-shadow: 4px 4px 2px #888;
	box-shadow: 4px 4px 2px #888;
	border-radius:3px;
	width:220px;
}
nav ul:after {
	content:"";clear:both; display :block;
}
nav ul li:hover {
	background:	#f4f5f5;
	background: linear-gradient(top, #f4f5f5, #dfdddd);
	background: -moz-radial-gradient(top, #f4f5f5, #dfdddd);
	background: -webkit-radial-gradient(top, #f4f5f5, #dfdddd); 
	border-radius:7px; 
} 

/* Formatting images - remove all borders (for ie8) */
img {
	border:	none;

}

/* Formating & positioning content*/
#container {
	width:1154px;
	margin-left:auto;
	margin-right:auto;
}
#social {
	float:right;
/*	background:#F00; */
	width:1154px;
}

/* Adding drop shadow to main image */
#image img {
	-moz-box-shadow: 8px 8px 5px #888;
	-webkit-box-shadow: 8px 8px 5px #888;
	box-shadow: 8px 8px 5px #888;
	border-radius:10px;
}
#image td img {
	-moz-box-shadow: 6px 6px 4px #888;
	-webkit-box-shadow: 6px 6px 4px #888;
	box-shadow: 6px 6px 4px #888;
	border-radius:8px;
}
/*Formatting table header */
#image th {
	font-size:12px;
	font-weight:300;
	color:#C9C9C9;
	padding:0px;
/*	margin-bottom:-50px; */
}

#bio_image {
	width:300px;
	border:medium;
	float:left;
/*	margin-right:20px;
	margin-top:20px; */
	padding:20px;
}

/*add drop shadow to gallery images */

#bio_section {
	width:996px;
	float:right;
	margin-left:auto;
	margin-right:auto;

}
#bio_image img {
	-moz-box-shadow: 4px 4px 2px #888;
	-webkit-box-shadow: 4px 4px 2px #888;
	box-shadow: 4px 4px 2px #888;
	border-radius:3px;
}

#bio {
	margin-top:20px; 
	width:950px;
	margin-right:auto;
	text-align:justify;
text-justify:inter-word;

}
#image {
	width:980px;
	float:right;
}
	
	
#gallery {
	width:120px;
	float : left;
	clear:left; 
}
/*add drop shadow to gallery images */
#gallery td img {
	-moz-box-shadow: 4px 4px 2px #888;
	-webkit-box-shadow: 4px 4px 2px #888;
	box-shadow: 4px 4px 2px #888;
	border-radius:3px;
}
/*Formatting table header */
#gallery th {
	font-size:9px;
	font-weight:300;
	color:#C9C9C9;
}

/* Styling footer*/
footer {
	color:#5A5A5A;
	clear:both;
	font-size:12px;
	margin-left:20px;
	margin-top:10px;
}

@media screen and (max-width:1140px) {
	#container {
	width:100%;
		background:#099;
}
#social {
	float:right;
	width:100%;
}

#bio_image {
	width:26%;
	float:left;
	margin-right:2%; 
}


#bio_section {
	width:66%;
	float:right;
}

#bio {
	margin-top:2%;
	width:100%;
	margin-right:auto; 
}
#image {
	width:80%;
	float:right;
}
#bio_image img {
	width:100%;
}
#image img {
	width:100%;
}
#gallery img{
	width:100%;
}
#gallery {
	width:20%;
}
}