main.css

body
{

	font-family: 'Libre Baskerville', serif;
	margin:0;
	padding: 0;
	color: white;
	text-align: center;
	overflow: hidden;
	
}
#second
{
	overflow:scroll;	
}

#third
{
	overflow:scroll;
	
}
	
.background-video video
{
	position: fixed;
	min-width: 100%;
	min-height: 100%;
	height: auto;
	width: auto;
	display:inline-block;
	z-index: -1000;
	overflow: hidden;
	top:0;		
	left:0;
	background-repeat: no-repeat;
	background-size:100%;
	background-position:center;
	-webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
   

}
 #page_cover
{
	position: fixed;
	/*background: rgba(251,128,0,0.3);*/
	/*background:rgba(32,32,32,0.5);*/
	background:rgba(153,76,0,0.2);
	min-width: 100%;
	min-height: 100%;
	height: auto;
	width: auto;
	z-index: -500;
	overflow: hidden;
	top:0;
	left:0;
	background-repeat: no-repeat;
	background-size:100%;
} 


#Title
{
	/*margin-top: 13%;*/
	/*background:rgba(30,144,255,0.6);*/
	padding-bottom: 0.5em;
	/*padding-top: 0.5em;	*/	
}
/*#container
{
	background: black;
	padding-top:1px;

}*/
.Title
{
	
	
}
.Title h1
{
	
	font-size: 90px;
	font-weight: bold;
	letter-spacing:8px;
	min-width: 1100px;
	margin-bottom: 10px;
	margin-top: 10px;
	color: inherit;
	padding-top: 10px;
	color:white;
	margin-top: 15%;
}

.Title p
{
font-size: 40px;
	font-weight: bold;
	font-family: 'Titillium Web', sans-serif;
	min-width: 1100px;
	margin-bottom: 10px;
	margin-top: 10px;
	color: inherit;
	padding-top: 10px;
	color:white;
}

a 
{
	text-decoration: none;
	color: inherit;
}

#navigation_container
{
	position: relative;
	display:inline-block;
	background:rgb(251,128,0);
	min-width:100%;
	max-height: 4em;
	min-height: 4em;
	/*overflow: hidden;*/

}
#nav_bar
{
	/*margin-top: 7%;*/
	list-style: none;
	min-width: 1100px;
	background: transparent;
	min-height:63px;
	max-height:63px;
	float:right;
	/*max-height: 4em;*/
	
	
	
}
#logo
{
	position: absolute;
	float:left;
	font-size: 2em;
	top: 30%;
	margin-left:1em;

}


.up_arrow
{
	position: absolute;       
    bottom: 0px;     
    left: 50%;
    margin-left: -75px;
    cursor: pointer;
    color:rgb(204,102,0);
    bottom: -60px;
  
}

#watch
{
	position: relative;
	top:100px;
}

/*.up_arrow:hover
{
	-o-transition:.4s;
	-ms-transition:.4s;
	-moz-transition:.4s;
	-webkit-transition:.4s;
	transition:.4s;
	transform:translateY(-100px);
}*/
#down_arrow
{
	position: fixed;
	/*position: absolute;*/
	left:-100px;
	color: rgb(204,102,0);
	cursor: pointer; 
	/*z-index: -100;*/
}
#nav_bar 
{
	position: relative;
	/*background-color: black;*/
	margin-top:0;
}
#nav_bar li
{
	display: inline-block;
	position: relative;
font-family: 'Titillium Web', sans-serif;
	/*padding: 20px 0px 20px 0px;*/
	font-size: 20px;
	font-weight: bold;
	color: white;
	min-width: 200px;
  	/*background: rgb(30,144,255); */ 
  	background:rgb(251,128,0);
	min-height:43px;
	max-height:43px;
  	/*background: rgb(121,30,29);*/
  	padding-top: 20px;
	padding-left:25px;
	padding-right:25px;
}

#nav_bar li:hover
{

	/*border:solid thick rgb(30,144,255);*/
	/*background:rgba(255,255,255,1.0);*/
	background:rgb(255,153,51);
	-o-transition:.4s;
	-ms-transition:.4s;
	-moz-transition:.4s;
	-webkit-transition:.4s;
	transition:.4s;
	/*-moz-transform: translate(-2px, -2px);
	-ms-transform: translate(-2px, -2px);
	-o-transform: translate(-2px, -2px);
	-webkit-transform: translate(-2px, -2px);
	transform: translate(-2px, -2px)*/
 
}
 
/* contact*/
#nav_bar li#contact:hover span#a
{
	display:inline;
}
#nav_bar li#contact span#b
{
	display:inline;
}
#nav_bar li#contact:hover span#b
{
	display:none;
}
#nav_bar li#contact span#a
{
	display:none;
}


/*recent assignments */
#nav_bar li#project #Rec_assig:hover span#a
{
	display:inline;
}
#nav_bar li#project #Rec_assig span#b
{
	display:inline;
}
#nav_bar li#project #Rec_assig:hover span#b
{
	display:none;
}
#nav_bar li#project #Rec_assig span#a
{
	display:none;
}

/* all drop down menu */

#nav_bar li ul :hover /* color of children differen */
{
	background:rgba(240,104,0,1.00);
}


/* project drop down*/
#nav_bar li ul#project
{
	display:none;
}
#nav_bar li:hover > ul#project
{
	  display: block;
    position: absolute;
    margin-left: -65px;
	margin-top:10px;
}

/*about drop down*/
#nav_bar li ul#about_drop
{
	display:none;
}
#nav_bar li:hover > ul#about_drop
{
	  display: block;
    position: absolute;
    margin-left: -65px;
	margin-top:10px;
}

/*experience drop down*/
#nav_bar li ul#experience_drop
{
	display:none;
}
#nav_bar li:hover > ul#experience_drop
{
	  display: block;
    position: absolute;
    margin-left: -65px;
	margin-top:10px;
}


@keyframes up-bump {
  0% { margin-top: 2em; }
  50% { margin-top: 1.5em; }
  100% { margin-top: 2em; }
}

#main-text
{
	
	border-style:solid;
	top:2em;
	z-index:-1000;
	position:relative;
	left:5%;
	background:rgba(232,232,232,1.00);
	min-height:auto;
	min-width: 50%;
	max-width:90%;
	overflow:auto;
	padding-bottom:5%;	
	border-radius:3%;
	
}

#main-text h1
{
	position:relative;
	color:rgba(117,117,117,1.00);
	text-align:left;
	left-margin: 100px;
	max-width:14%;
	min-width:13%;
	left:2%;
	
}

#pic_me { 
   position: relative; 
   width: 25%; /* for IE 6 */
   left:1em;
   float:left;
}


#pic_me h2 { 
display:relative;
color:black;
font-size:100%;
}
#pic_me #picture_aboutme
{
	width:100%;	
	
}


#donut { 
   position: relative; 
   width: 25%; /* for IE 6 */
   left:1em;
   float:right;
}


#donut h2 { 
display:relative;
color:black;
font-size:100%;
}
#donut #union_donut
{
	width:100%;	
	
}

#list
{
	float:left;
	text-align:left;
	color:black;
	line-height:200%;
}
#list #favorite_food
{
	text-decoration:underline;	
}
#list li
{
	list-style-type:none;	
}
#main-text .diff_p
{
	position:relative;
	top:1.2em;
	width:98%;
	left:2%;
	line-height:180%;
	text-align:left;
	color:black;
	font-size:130%;
}

#list2
{
 float:right;
 text-align:left;	
 color:black;
 line-height:200%;
}
#list2 li
{
	list-style-type:none;	
}
#list2 #favorite_places
{
	text-decoration:underline;	
}

#main-text #Work_Exp
{
	max-width:20%;
	min-width:20%;
}

#main-text .work-block
{
	position:relative;
	border-style: dashed;
	border-color: black;
	border-width:2px;
	width:50%;
	display:inline-block;
	text-align:left;
	padding-bottom:1%;
	margin-bottom:5%;
	padding-right:1%;
	
}

#main-text h3
{
	position:relative;
	left:1em;
	text-decoration: underline;
	color: black;
	
}

.work-block li
{
	color:black;
	list-style-type:circle;
	position:relative;
	left:1em;	
	
}
.work-block h4
{
	color:black;
	position:relative;
	text-align:center;	
}

#main-text #Prog
{
	max-width:28%;
	min-width:27%;
}

.skills h2
{
	color:black;
	text-align:left;
	position:relative;
	left:3em;
	text-decoration:underline;	
	max-width:30%;
	min-width:29%;
}
.skills p
{
	position: relative;
	color:black;
	font-size:160%;
	left:3em;
	width:20%;
	float:left;
	
}
progress {
	
	width:50%;
	height:4em;
	padding:1em 0 0 0;
	background:none;
	border-radius:50px;
	text-align: left;
	position:relative;
    font-size:15px;
	
	
}
progress::-webkit-progress-bar {
	height:40px;
	width:100%;
	margin:0 auto;
	background-color:#dadada;
	border-radius:100px;
}

progress::-webkit-progress-value {

	height:40px;
	margin:0px -10px 0 0;
    padding-left:50px; /* Rounded corners requires a padding */
	background:#ff9e2c;
	border-radius:100px;
}
#main-text-travel
{
	border-style:solid;
	display:center;
	top:8em;
	z-index:-1000;
	left:10%;
	position:absolute;
	background:rgba(232,232,232,1.00);
	min-height:100%;
	min-width: 80%;
	
	overflow:auto;
	padding-bottom:5%;	
	border-radius:3%;
	
}

#main-text-travel h1
{
	color: 	rgba(117,117,117,1.00);
	float:left;
	left:2em;
	position:relative;
}
#main-text-travel #map
{
	position: absolute; 
	width: 75%; 
	height: 75%;
	left:12.5%;
	right:12.5%;
	top:15%;
	z-index:1000;
	
}
#main-text-travel p
{
	color:black;
	position:absolute;
	top:90%;
	left:15%;
	
		
}
#main-text-travel ul
{
	color:black;
	position:absolute;
	top:95%;
	left:12%;
	
		
}