@charset "UTF-8";
body  {
	width: 100%;
	height: 100%;
	margin: 0px;
	color: #17295c;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	font-weight: 700;
	font-size: 1em;
	background-color: #cdd0d7;
	}
a:link, a:visited{
	color: #cdd0d7;
	text-decoration: none; /*removes the underline for links*/
}
a:hover, a:active{
	color: #17295c;
	text-decoration: none; /*removes the underline for links*/
}
.current   {
	color: #ffffff;
	cursor: pointer;
}
#container {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
}
#logo {
	float: left;
}
header h1 {
	margin-bottom: 0px;
	color: #1a57ab;
	font-family: Luminari, Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
	text-indent: -8px;
	line-height: 32px;
	padding-bottom: 0px;
	font-size: xx-large;
	margin-top: 35px;
	text-align: center;
	margin-right: 693px;
}
header h2 {
	color: #1a57ab;
	font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
	font-size: x-small;
	text-indent: 9px;
	margin-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 123px;
}
header:after{
	content:"";
	display: table;
	clear: both;
}
#topNav {
	padding-top: 10px;
	padding-right: 16px;
	padding-left: 0px;
	padding-bottom: 10px;
	margin-top: 15px;
	margin-right: 0px;
	margin-left: 0px;
	margin-bottom: 0px;
	text-align: right;
	list-style-type: none;
	background-color: #1a57ab;
}
#topNav li {
	display: inline-block;
	margin-left: 30px;
	font-size: 1.1em;
}
main #title {
	position: absolute;
	left: 51%;
	font-family: Luminari, Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
	font-size: 10em;
	text-align: center;
	margin-left: -1.9em;
	line-height: 1em;
	color: #cdd0d7;
	text-shadow: -2px -2px 0 #17295c, 2px -2px 0 #17295c, -2px 2px 0 #17295c, 2px 2px 0 #17295c;
	opacity: 0;
	z-index: 1;
	letter-spacing: -0.091em;
	text-indent: 85px;
	right: 40%;
	top: 20%;
	margin-top: 140px;
	/*makes h1 title fade out*/
	animation: logo 10s ease-out 2.5s;
}
/*animation*/
@keyframes logo {
	0% { transform: scale(1); opacity: 1; }
	50% { opacity: 1; }
	100% { transform: scale(0.1); opacity: 0;}
}
#titles{
	position: fixed;
	width: 17em;
	height: 50em;
	bottom: 0px;
	left: 51%;
	margin-left: -9em;
	font-size: 350%;
	font-weight: bold;
	text-align: justify;
	overflow: hidden;
	transform-origin: 50% 100%;
	transform: perspective(300px) rotateX(25deg);
}
#titles h1.center{
	text-align: center;
}

/*pseudo-element applied to overlay a fade-out gradient at the top of the outer div*/
#titles:after{
	position: absolute;
	content: '';
	left: 0;
	right: 0;
	top: 0;
	bottom: 60%;
	background-image: linear-gradient(top, rgba(0,0,0,1) 0%, transparent 100%);
	pointer-events: none;
}

/*scrolling content using CSS animation*/
#titlecontent{
	position: fixed;
	top: 100%;
	animation: scroll 170s linear 11.5s infinite;
	bottom: 0px;
}

/*animation*/
@keyframes scroll{
	0% {top:100%;}
	100% {top:-170%;}
	}#titles #titlecontent p {
	line-height: 1.5em;
	}
footer {
	position: relative;
	margin-top: 35px;
	margin-bottom: 0px;
	padding-top: 0px;
}
#homeFooter {
	position: fixed;
	bottom: -17px;
	width: 960px;
	padding-bottom: 0px;
}
footer ul {
	padding-top: 5px;
	padding-right: 0px;
	border-top-color: #cdd0d7;
	background-color: #1a57ab;
	text-align: center;
	list-style-type: none;
	padding-bottom: 5px;
	margin-left: 0px;
}
footer ul li {
	display: inline-block;
	padding-right: 0px;
	padding-left: 0px;
	margin-left: 20px;
	margin-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 0.9em;
}
#portfolioHeader {
	padding-bottom: 15px;
}
#portfolioContent h1   , #aboutContent h1, #servicesContent h1{
	font-weight: normal;
	font-size: 1.5em;
	padding-top: 7px;
}
#portfolioContent h2 , #aboutContent h2{
	padding-top: 35px;
	font-weight: normal;
	clear: both;
	margin-left: 20px;
	margin-top: 0px;
}
#portfolioIntro {
	line-height: 1.5em;
	margin-left: 20px;
	width: 530px;
}
#portfolioContent ul, #aboutContent ul{
	margin-top: 35px;
	text-align: center;
	list-style-type: none;
	background-color: #ffffff;
	padding-top: 5px;
	padding-bottom: 5px;
}
#portfolioContent ul li , #aboutContent ul li{
	display: inline-block;
	margin-left: 15px;
	margin-right: 15px;
}
#portfolioContent ul li a:link, #portfolioContent ul li a:visited , #aboutContent ul li a:link, #aboutContent ul li a:visited{
	color: #1a57ab;
}
#portfolioContent ul li a:hover, #portfolioContent ul li a:active , #aboutContent ul li a:hover, #aboutContent ul li a:active{
	color: #cdd0d7;
}
#portfolioContent a:link, #portfolioContent a:visited  , #aboutContent a:link, #aboutContent a:visited{
	color: #17295c;
}
#aboutContent h3 {
	font-weight: normal;
	clear: both;
	margin-left: 20px;
}
#aboutContent h4 {
	font-weight: normal;
	clear: both;
	margin-left: 20px;
}
.profile {
	width: 245px;
	height: 350px;
	background-image: url(assets/images/profile-278x350.jpg);
	margin-left: 20px;
}
#about {
	margin-left: 333px;
	float: left;
	margin-top: -369px;
	width: 525px;
	line-height: 1.5em;
}
#resumeP {
	margin-left: 20px;
}
#resumeP a:hover, a:active {
	color: #ffffff;
}
#aIBtT {
	margin-top: -5px;
}
.backToTop {
	font-size: 0.8em;
	float: left;
	clear: both;
	margin-left: 20px;
	width: auto;
}
#ai:after, #ps:after, #iD:after, #m:after         , #1997:after, #2002:after, #2003:after, #2004:after , #2006:after, #2011:after, #certificate:after{
	content: "";
	display: table;
	clear: both;
}
.imgTxt {
	width: 220px;
	padding-top: 20px;
	float: left;
	color: #1a57ab;
	text-align: center;
	background-color: #ffffff;
	margin-bottom: 40px;
	height: 280px;
	margin-left: 20px;
}
main:after {
	content: "";
	display: table;
	clear: both;
}
