html{
    font-family: Avant Garde, Avantgarde, Century Gothic, CenturyGothic, AppleGothic, sans-serif;
    font-size: 14px;
    color: #4f4f4f;
}

a {
    color: #4f4f4f;
    text-decoration: none;
}

/**********Tool Bar *****************/
#header{
    height: 200px;
    width: 80%;
    margin-left: 10%;
}

#controls{
    width: 70%;
    font-size: 2vh;
    transition: height 1s, width 1s, padding 1s, visibility 1s, opacity 0.5s ease-out;
}

#controls > a{
    text-decoration: none;
    color: black;
}

#controls > a:hover{
    text-decoration: underline;
}

#logo{
text-align: right;
}

#topmargin{
    border-color: #4f4f4f;
    width: 80%;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
    margin-bottom: 48px;
}

/************Home***************/

.projects{
	width: 610px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
}

.projectrow{
	height: 650px;
}

.project{
	width: 500px;
	padding-bottom: 50px;
	cursor: pointer;
	font-size: 18px;
}

.rightcol{
	text-align: right;	
}

.project > img{
	padding-bottom: 10px;
	width: 550px;
}

/************Selected***************/

.projectselected{
	text-align: center;
	vertical-align: top;
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
}

.projectdesc{
/*set col width , set font type and color here*/	
	width: 80%;
	margin-left: 10%;
	vertical-align: top;
	padding-bottom: 20px;
}

.projectdeschead{
	font-size: 20px;
	font-weight: bold;
}

.projectdesctext{
	padding-top: 20px;
	text-align: justify;
}

.credit{
	font-style: italic;
	font-size: 12px;
}

.pics{
    padding-top: 20px;
}

.projectpics{
text-align: center;
width: 100%;
}


/************Media***************/
.mediahead{
	font-stze: 16px;
	margin-left: 10%;
	margin-bottom: 15px;
}

.mediatext{
	width:80%;
	margin-left: 10%;
}

.mediatd{
    width: 100%;
}

.mediaimg{
	width: 100%;
	margin-top: 15px;
}

/************About***************/
.abouthead{
	font-stze: 20px;
	margin-left: 79px;
}

.abouttable{
	margin-left: 79px;
	margin-right: 79px;
}

.abouttext{
	vertical-align: top;
	text-align: justify;
	text-justify: inter-word;
	padding-bottom: 30px;
	min-width: 500px;
	font-stze: 12px;
}

.aboutimg > img{
    width: 100%;	
}

/************Contact***************/
#contacttable{
    width: 80%;
    margin-left: 10%;
}

#details{
    vertical-align: top;
    width: 30%;
}

#formtd{
    vertical-align: top;
}

#theform{
    width: 600px;
}

#lname, #lphone, #lemail, #lmessage{
	width: 48%;
	font-size: 14px;
}
	
#iname, #iphone, #iemail, #imessage{
	margin-bottom: 20px;
	font-size: 18px;
	padding: 5px;
	font-family: sans-serif;
}

#iname{
	width: 97%;
}


#iphone{
	width: 97%;
}

#iemail{
	width: 97%;
}

#imessage{
	width: 97%;
}

input[type='submit']
{
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;  

    padding: 15px;
    font-family: Avant Garde, Avantgarde, Century Gothic, CenturyGothic, AppleGothic, sans-serif;
    font-size: 20px;
    color: #4f4f4f;
    background-color: white;
}