/*-----------This is the main stuff-------------*/
/*----------------------------------------------*/

* {
margin:0;
padding:0;
}

body{
		background-color: #ded9d3;
		margin: 0px;
		font-family: Courier;
		color: #5E9DBF;
		font-size: 14px;
    padding-top: 0px;
    padding-bottom: 20px;
}
/*colors banner:5E9DBF background:ded9d3 icon:eeb6b7 font:136997*/

#wrapper{
    margin:0 auto;
    width: 85%;
    background: #FFF;
  	border: 1px solid #878e63;
		box-shadow: 0 0 10px rgba(12, 3, 25, 0.8);

}

header{
		height:100px;
		margin: 0;
		background-color: #5E9DBF;
    text-align: center;
    padding-top: 45px;
    padding-bottom: 15px;

}

h1{
		font-family: 'Handlee';
		letter-spacing: 0.5px;
		font-size: 60px;
		margin: 0;
		padding: 10px 0 0 10px;
		color:#fff;
    border-top: 15px solid #136997;
    border-bottom:15px solid #136997;
}

h2{
    font-family: 'Handlee';
		font-size: 27px;
		margin: 0;
		color: #000;
}

h3{
    font-family: 'Handlee';
		font-size: 19px;
		margin:0px;
		padding: 5px;
		color: #000;
		letter-spacing: 0.5px;
}

p{
		margin: 10px 0;
		padding: 0;
		font-size: 15px;
}

/*------------This is the main page-------------*/
/*----------------------------------------------*/
.quote, .quotePerson{
  text-align: center;
  font-size: 35px;
  font-family: 'Handlee';
  padding-right: 5%;
}

#mainImg{
  display: block;
  padding-left: 10%;
  padding-right: 30px;
  padding-top: 30px;
  padding-bottom: 40px;
  float:left;
  width: 25%;
}

.mainQuote{
  padding-top: 10%;
}

section h2{
  text-align: center;
}
table{
	margin: auto;
}
table, th, td {
    border: 3px solid #ded9d3;
    border-collapse: collapse;
		background-color: #fff;
}
table tr td.done{
	background-color: #eeb6b7;
}

p#end{
	text-align: right;
	padding-right: 35px;
}

/*-----------This is the about page-------------*/
/*----------------------------------------------*/
#aboutImg{
  display: block;
  padding-left: 5%;
  padding-right: 30px;
  padding-top: 30px;
  padding-bottom: 40px;
  width: 45%;
  float: left;
}

.aQuote, .translation{
  text-align: center;
  font-size: 45px;
  font-family: 'Handlee';
  padding-right: 5%;
}

.aboutQuote{
  padding-top: 10%;
}

#me{
  float:right;
}

/*----------------Resources Page----------------*/
/*----------------------------------------------*/

section ul{
  padding-left: 10px;
  font-family: 'Handlee';
  font-size: 24px;
  text-align: center;
}

section ul li, section ul li ul li{
  list-style: none;
}

section ul li ul li a{
  text-decoration: none;
}

#resourceImg{
  display: block;
  padding-left: 5%;
  padding-right: 30px;
  padding-top: 30px;
  padding-bottom: 40px;
  float:left;
  width: 30%;
}

.resourceQuote{
  padding-top: 5%
}

/*-------------Accomplishments Page-------------*/
/*----------------------------------------------*/

section ul{
  padding-left: 10px;
  font-family: 'Handlee';
  font-size: 24px;

}


section ul li ul li a{
  text-decoration: none;
}

/*-----------------Projects Page----------------*/
/*----------------------------------------------*/

section h3{
  text-align: center;
}
.projects p{
  text-align: center;
}

.projects hr{
  margin-bottom: 35px;
}

/*------------------Album Page------------------*/
/*----------------------------------------------*/

.album{
  width: 300px;
	float: left;
	padding: 0 85px 0 15px;
}

.albumtext{
  text-align: center;
  margin-top: -12px;
  margin-bottom: 12px;
}
#albImg{
display: block;
padding-left: 5%;
padding-right: 30px;
padding-top: 30px;
padding-bottom: 40px;
width: 35%;
float: left;
}

.albumQuote{
  padding-top: 5%;
}
.albquote, .albumPerson{
  text-align: center;
  font-size: 35px;
  font-family: 'Handlee';
  padding-right: 5%;
}

/*-------------This is for lightbox-------------*/
/*----------------------------------------------*/

#curtain{
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: fixed;
	background-color: rgba(0,0,0,0.4);
}

#light{
	max-width: 90%;
	max-height: 90%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
  padding-top:100%;
	position: absolute;
	margin: auto;
}
#lightboxwrapper{
  position: relative;
}
#close{
	height: 50px;
	width: 50px;
  padding-top: 50%;
  padding-right: 10px;
	top: 0;
	right: 0;
	position: absolute;
	z-index: 990;
}


/*--------------This is for Slider--------------*/
/*----------------------------------------------*/

.banner{
	width: 100%;
	height: 538px;
	position: relative;

}

.slide{
  padding-left: 35%;
  display: block;
  margin: auto;
  background-color: #fff;
}

.slide1{
  padding-left: 25%;
  display: block;
  margin: auto;
  background-color: #fff;
}

.slide2{
  padding-left: 14%;
  display: block;
  margin: auto;
  background-color: #fff;
}

.slide3{
  padding-left: 37%;
  display: block;
  margin: auto;
  background-color: #fff;
}

#slider{
	width: 100%;
	height: 538px;
	position: absolute;
	overflow: hidden;
  display: block;
  margin: auto;

}

#next{
	text-align: center;
	line-height: 50px;
	color: #ffffff;
	width: 50px;
	height: 50px;
	background-color: #eeb6b7;
	position: absolute;
	top: 205px;
	right: 0;
	z-index: 99;
	cursor: pointer;
	opacity: .4;
}

#pre{
	text-align: center;
	line-height: 50px;
	color: #ffffff;
	width: 50px;
	height: 50px;
	background-color: #eeb6b7;
	position: absolute;
	top: 205px;
	left: 0;
	z-index: 99;
	cursor: pointer;
	opacity: .4;
}

.banner: hover #next{
	opacity: 1;
	transition: all .5s ease-out;
	-webkit-transition: all .5s ease-out;
	-ms-transition: all .5s ease-out;
}

.banner: hover #pre{
	opacity: 1;
	transition: all .5s ease-out;
	-webkit-transition: all .5s ease-out;
	-ms-transition: all .5s ease-out;
}

/*------------------Navigation------------------*/
/*----------------------------------------------*/

nav{
    width: inherit;
    position: fixed;
    top: 0;
}

nav ul{
		list-style-type: none;
		background:#fff;
		padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
}

nav ul li{
		display: inline-block;
		position: relative;
		padding-left: 45px;
		padding-right: 45px;
    color: #136997;
    font-weight: bold;

}
nav ul li:hover{
  cursor:default;
}

nav ul li ul{
		min-width: 60%;
		opacity: 0.8;
		display: none;
		position: absolute;
    overflow: hidden;
}

nav ul li ul li a{
		padding: 7px;
    text-align: left;
    float: left;
}

nav a{
		text-decoration: none;
		font-weight: bold;
		color: #136997;
    top: 0;
}

nav a:hover{
		color: #5E9DBF;
}

a{
	color: #136997;
	text-decoration: none;
}

nav li a.current{
	color:#5E9DBF;
}

p a{
		text-decoration: none;
		letter-spacing: 0.5px;
		font-weight: bold;
}

nav ul li a:before{
		content:"";
		position:absolute;
		width: 100%;
		height: 2px;
		bottom: 0;
		left: 0;
		background-color: #000;
		visibility: hidden;
		-webkit-transform:scaleX(0);
		transform: scaleX();
		-webkit-transition: all 0.3s ease-in-out 0s;
		transition: all 0.3s ease-in-out 0s;
}

nav ul li a:hover before{
		visibility: visible;
		transform: scaleX(1);
}

nav ul ul{
	position: absolute;
	padding: 0;
	opacity: .9;
	z-index: 999;
}

nav ul li a, nav ul li:hover ul, nav ul li ul li{
		display:block;
}

/*---------------Main Area of Page--------------*/
/*----------------------------------------------*/

main{
		margin: 15px;
}

aside {
  padding: 10px 25px 10px 25px;
  width: 20%;
	margin-left: 15px;
	float: left;
  text-align: center;

}

section {
  	padding: 6px 15px 6px 35px;
  	width: 70%;
		float: right;
    border-left: 2px solid #ded9d3;
}

#connect{
  text-align: center;
  background-color: #fff;
}

.connectContainer{
  display: inline-block;
  padding-right: 10px;
}

.clear{
	clear:both;
}

footer{
  background-color: #5E9DBF;
  height: 40px;
  color: #FAFAFA;
  padding: 5px;
	text-align: center;
}

hr{
  background: #ded9d3;
  border: 0;
  height: 5px;
}

/*---------------------Blog---------------------*/
/*----------------------------------------------*/

#internpic{
  float: left;
  padding-right: 25px;
}

#internship{
  font-family: 'Handlee';
  font-size: 24px;
  padding-left: 0;
  padding-top: 20px;
  padding-right: ;
}

#pi{
  float: right;
  padding-right: 20px;
}

#blogImg{
display: block;
padding-left: 10%;
padding-right: 30px;
padding-top: 30px;
padding-bottom: 40px;
width: 20%;
float: left;
}

.blogQuote{
  padding-top: 5%;
}
.bquote, .blogPerson{
  text-align: center;
  font-size: 35px;
  font-family: 'Handlee';
  padding-right: 5%;
}

/*----------This is for Contact Page------------*/
/*----------------------------------------------*/

textarea{
  overflow-y: scroll;
  height: 150px;
  width: 700px;
  outline: none;
  border: solid  3px #5E9DBF;
  font-size: 15px;
  font-family: Courier;
  padding: 4px;
}
.send{
  text-align: center;
  background-color: #5E9DBF;
  color: #fff;
  padding: 3px 8px 3px 8px;
  border: solid 1px #136997;
  font-family: Courier;
  font-size: 15px;
  margin-left: 77%;
}

input[type=text]{
  border: solid  3px #5E9DBF;
  font-size: 15px;
  font-family: Courier;
  padding: 4px;
  margin-left: 115px;
}

input[type=email]{
  border: solid  3px #5E9DBF;
  font-size: 15px;
  font-family: Courier;
  padding: 4px;
  margin-left: 115px;

}

.submit{
  text-align: center;
  background-color: #5E9DBF;
  color: #fff;
  padding: 3px 8px 3px 8px;
  border: solid 1px #136997;
  font-family: Courier;
  font-size: 15px;
  margin-left: 45%;
}

.jtf{
  float: left;
}

.beachImg{
  padding-left: 45px;
  padding-bottom: 30px;
  float: left;
}

#beach{
  border: solid 2px #136997;
}

#contactImg{
  padding-left: 3%;
  padding-top: 2%;
  float: left;
  padding-right: 3%;
}

.contactQuote{
  padding-top: 7%;

}

.term, .definition{
  text-align: center;
  font-size: 45px;
  font-family: 'Handlee';
  padding-right: 5%;
}

.definition{
  font-size: 30px;

}

/*----------This is for Welcome Page------------*/
/*----------------------------------------------*/
.short{
	border-right: 2px solid #ded9d3;
	padding-right: 30px;
}

.shortalso section{
	border: none;
}