/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/*********************************************** my code *************************************************************/

.main-wrapper {
	
	margin: 0 auto;
	width: 90%;
}

.contact-header {
	
	font-weight: bold;
	text-shadow: 1px 1px rgb(0, 128, 0), 
				 2px 2px rgb(0, 128, 0), 
				 3px 3px rgb(0, 128, 0);
	border-bottom: 3px solid rgb(255, 255, 255);
	border-top: 3px solid rgb(255, 255, 255);
	margin-left: 100px;
	margin-right: 100px;
}

a {
	
	text-decoration: none;
}

body {

	background-color: black;
}

header nav {
	
	padding-top: 5px;
	width: 100%;
	height: 40px;
	background-color: rgb(51, 51, 51);
	z-index: 100;
}

header nav ul li {
	
	float: left;
	list-style: none;
	z-index: 100;
}

header nav ul li a {
	
	font-family: arial;
	font-size: 16px;
	color: white;
	font-weight: bold;
	z-index: 100;
}

header nav ul li a:hover {
	
	color: rgb(192, 0, 0);
}

header .nav-login {
	
	float: right;
}

header .nav-login form {
	
	float: left;
	padding-top: 3px;
}

header .nav-login form input {
	
	float: left;
	width: 140px;
	height: 30px;
	padding: 0px 10px;
	margin-right: 10px;
	border: none;
	background-color: #ccc;
	font-family: arial;
	font-size: 14px;
	color: #111;
	line-height: 30px;
}

header .nav-login form button {
	
	float: left;
	width: 60px;
	height: 30px;
	margin-right: 10px;
	border: none;
	background-color: #f3f3f3;
	font-family: arial;
	font-size: 14px;
	color: #111;
	cursor: pointer;
}

header .nav-login form button:hover {
	
	background-color: #ccc;
}
	
header .nav-login a {
	
	display: block;
	width: 80px;
	height: 20px;
	border: none;
	float: left;
	background-color: rgb(51, 51, 51);
	font-family: arial;
	font-size: 16px;
	font-weight: bold;
	color: white;
	cursor: pointer;
}

header .nav-login a:hover {
	
	color: rgb(192, 0, 0);
}

.main-container {
	
	padding-top: 100px;	
}

.main-container h2{
	
	font-family: Bodoni MT Black;
	font-size: 40px;
	line-height: 50px;
	text-align: center;
	color: white;
}

/*** signup.php ***/

.contact-container {
	
    width: 500px;
	background-color: black;
	border: 2px solid rgb(255, 255, 255);
	display: block;
	position: absolute;
	float: left;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.signup-container {
	
	width: 500px;
	background-color: black;
	border: 2px solid rgb(255, 255, 255);
	display: block;
	position: absolute;
	float: left;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);    
}

.signup-form {
	
	width: 400px;
	margin: 0 auto;
	padding-bottom: 5px;
}

.signup-form input {
	
	width: 90%;
	height: 40px;
	padding: 0px 5%;
	margin-bottom: 4px;
	border: none;
	background-color: white;
	font-family: arial;
	font-size: 16px;
	color: #111;
	line-height: 40px;
}

.signup-form button {
	
	display: block;
	margin: 10px;
	margin-left: 300px;	
	width: 25%;
	height: 35px;
	border: none;
	background-color: #f3f3f3;
	font-family: arial;
	font-size: 16px;
	color: black;
	cursor: pointer;
}

.signup-form button:hover {
	
	background-color: #ccc;;
}

nav {
	
	width: 100%;
	display: inline-block;
	background-color: rgb(51, 51, 51);
	font-family: Arial;
	float: center;
	text-align: center;
	margin: 0, 0, 1em 0;
	position: fixed;
	top: 0;
	list-style: none;
}

ul {

	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
}
 
ul ul {

  opacity: 0;
  position: absolute;
  top: 160%;
  visibility: hidden;
  transition: all .4s ease;
  -webkit-transition: all .4s ease;
} 

ul ul ul {

  top: 0%;
  left: 160%;
}

ul ul li:hover > ul {

  top: 0%;
  left: 100%;
  opacity: 1;
  visibility: visible;
  color: rgb(255, 0, 0);

}
 
ul li:hover > ul {

  opacity: 1;
  top: 100%;
  visibility: visible;
  color: rgb(255, 0, 0);
  
}
 

ul li {

  display: inline-block;
  float: left;
  position: relative;
  text-align: center;
}

 

ul ul li { 

	display: inline-block;
	float: none; 
}


ul li {

  background-color: rgb(51, 51, 51);
  cursor: pointer;

}
 
ul a {

  text-decoration: none;
  display: inline-block;
  color: rgb(255, 255, 255);
  padding: 10px 15px;
  width: 7em;
  text-align: center;
  text-shadow: 0px -1px 0px rgba(0,0,0,.2);

}

ul li:hover { 
	
	color: rgb(0, 128, 0);
}
 
ul li a:hover { 

	color: rgb(0, 128, 0);
}

span.dropBottom, span.dropRight {
	
  display: inline-block;
  position: absolute;
  left: 0px;
  width: 100%;
  height: 100%;
  top: 0px;
}

span.dropBottom {
	
  position: absolute;
  width: 100%;
  bottom: 0px;
}

.homePage {
	
	background:url('images/Home_Page.mp4');
	width: 100vh;
	/*** height: 100vw; ***/
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: white;	
}

.read {
	
	background:url('images/NYSE1.jpg');
	width: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: black;	
}

.headerText {
	
	display: block;
	position: relative;
	float: left;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	width: 1200px;
	padding-top: 2px;
	background: linear-gradient(to right, rgb(0, 0, 0, 0), rgb(0, 0, 0, 1), rgb(0, 0, 0, 1), rgb(0, 0, 0, 0));
	height: 95px;	
	color: rgb(255, 255, 255);
	font-family: Bodoni MT Black;
	font-size: 85px;
	font-weight: bold;
	text-shadow: 1px 1px rgb(0, 128, 0), 
				 2px 2px rgb(0, 128, 0), 
				 3px 3px rgb(0, 128, 0), 
				 4px 4px rgb(0, 128, 0), 
				 5px 5px rgb(0, 128, 0);
	border-bottom: 5px solid rgb(255, 255, 255);
	border-top: 5px solid rgb(255, 255, 255);
	position: fixed;
	
}

.video-container {
	
	position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url(polina.jpg) no-repeat;
	background-size: cover; 

}

.video-container-home-page {

	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	/*** height: 100%;  ***/
	overflow: hidden;
}

.video-container-home-page video {
	
	/* Make video to at least 100% wide and tall */
  max-width: 95%; 
  max-height: 95%; 

  /* Setting width & height to auto prevents the browser from stretching or squishing the video */
  width: auto;
  height: auto;

  /* Center the video */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
	
.video-container img, .video-container video {
	
    display: block;
    height: auto;
    left: auto;
    max-width: none;
    min-height: 100%;
    min-width: 100%;
    right: auto;
    position: absolute;
    top: 0;
    width: auto;
    z-index: 1;
	
}

@supports (transform: translateX(-50%)) {

    .video-container img, .video-container video {
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
		
    }

}

@media screen and (min-aspect-ratio: 16/9){/* Make this the same aspect ratio as your video */

    .video-container img, .video-container video {
        max-width: 100vw;
        min-width: 100vw;
        width: 100vw;
    }

}

@media screen and (max-aspect-ratio: 16/9){/* Make this the same aspect ratio as your video */

    .video-container img, .video-container video {
        height: 100vh;
        max-height: 100vh;
        min-height: 100vh;
    }

}

.background-image-contact {
	
	background:url('images/NYSE1.jpg');
	width: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: black;
}

.background-image-data-camp {
	
	background:url('images/Data Camp.png');
	background-size: cover;
	background-attachment: fixed;
	background-color: black;
}

.background-image-pmst {
	
	background:url('images/UofU2.jpg');
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: black;
}

.background-image-bio {
	
	background:url('images/Bio_2.jpg');
	background-size: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: black;
}

.background-image-project {
	
	background:url('images/Volatility Surface.png');
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: black;
}

.background-image-reading-list {
	
	background:url('images/Background 7.jpg');
	background-size: cover;
	background-attachment: fixed;
	background-color: black;
}

.background-image-resume {
	
	background:url('images/LSE1.jpg');
	background-size: cover;
	background-attachment: fixed;
	background-color: black;
}

.background-image-signup {
	
	background:url('images/NASDAQ1.jpg');
	width: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: black;
}

.book-image {
	
	width: 100px;
	float: left;
	margin-top: 0;
	border-top: 0;
	padding-left: 50px;
	background-color: white;

}

.book-image:hover {
	
	background-color: rgba(0, 0, 0, 0.0);
	transform: scale(2, 2);
	padding: 0;
	padding-left: 50px;

	
}

.center{

	margin: auto;
    width: 975px;
	margin-top: 100px;
}

.center-logo{

	margin-top: 10px;
	margin-left: 237px;
}

.center-link{

	text-align: center;
}

.center-link a {

	color: black;
}

.center-link a:hover {

	color: gray;
}

.certificate {
	
	height: 20px;
	width: 350px;
	float: right;
}

.class-list a {
	
	padding-left: 100px;
	color: black;
	font-weight: normal;
	font-size: 14px;	
}

.class-list a:hover {
	
	color: gray;
	font-weight: bold;
}

.headings {
	
	font-family: arial;
	font-weight: bold;
	padding-left: 50px;
}

#box1 {

	margin: auto;
    width: 975px;
	background-color: white;
	height: 8828px;
}

#box2 {

	margin: auto;
    width: 975px;
	margin-top: 100px;
	background-color: white;
	height: 7008px;
}

#box3 {

    margin: auto;
	width: 975px;
	background-color: white;
	height: 1125px;
}

#box4 {

	margin: auto;
    width: 975px;
	background-color: white;
	height: 60px;
}

#box5 {

	margin: auto;
    width: 975px;
	background-color: black;
	height: 75px;
}

.box6a {

	float: left;
	width: 40%;
	height: 50%;
	padding-left: 5%;
	margin-top: 5%;
	background-color: black;
	color: white;
    font-size: 1vw;
	line-height: 100%;
}

.box6b {

	float: left;
	position: fixed;
	width: 50%;
	height: 50%;
	top: 50%;
	left: 0;
	background: url('images/Volatility Surface 1.png') no-repeat center;
}

.box6c {

	float: left;
	position: fixed;
	width: 50%;
	height: 50%;
	top: 45px;
	left: 50%;
	background: url('images/Volatility Surface 2.png') no-repeat center;
}

.box6d {

	float: left;
	position: fixed;
	width: 40%;
	height: 50%;
	top: 55%;
	margin-top: 5%;
	left: 50%;
	padding-left: 5%;
	background-color: black;
	color: white;
    font-size: 1vw;
	line-height: 100%;
}

#box7 {								/***  datacamp.php  ***/

	margin: auto;
    width: 975px;
	background-color: rgb(46, 144, 180, 131, 142, 106);
	height: 1600px;
}

#box8 {								/***  reading list sticky header  ***/

	margin: auto;
    width: 975px;
	height: 100px;
	position: -webkit-sticky;
	position: sticky;
	top: 45px;
	line-height: 100px;
}

#box9 {
	
    position: absolute;
	margin-left: 150px;
	margin-top: 12.5px;
	width: 675px;
	height: 60px;
	font-size: 55px;
	line-height: 60px;
	padding-top: 2px;
	background: linear-gradient(to right, rgb(0, 0, 0, 0), rgb(0, 0, 0, 1), rgb(0, 0, 0, 1), rgb(0, 0, 0, 0));
	color: rgb(255, 255, 255);
	font-family: Bodoni MT Black;
	font-weight: bold;
	text-align: center;
	text-shadow: 1px 1px rgb(0, 128, 0), 
				 2px 2px rgb(0, 128, 0), 
				 3px 3px rgb(0, 128, 0), 
				 4px 4px rgb(0, 128, 0), 
				 5px 5px rgb(0, 128, 0);
	border-bottom: 5px solid rgb(255, 255, 255);
	border-top: 5px solid rgb(255, 255, 255);	
}	

#box10 {
	
	margin: auto;
	width: 775px;
	background-color: white;
	height: 1000px;
	font-family: Calibri;
}

a {

	color: rgb(47, 117, 181); 
	font-family: Verdana; 
	font-size: large; 
	font-weight: bold;
	text-decoration: none;

}

a:hover {

	color: rgb(155, 194, 230);

}

body {
	
	background-color: black;
	margin: 0;
}

h1 {

	color: white;
	font-family: Verdana; 
	font-size: 35px; 
	font-weight: bold;
	padding-top: 75px;
	text-align: center;

}

.reading-list {
	
	color: black;
	font-family: Verdana;
	font-weight: normal;
	font-size: small;
	margin-left: 200px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 0px;
	height: 105px;
	width: 750px;
	background-color: white;
	text-align: left;

}

.line {

	background-color: white;
	margin-left: 0px;
	margin-bottom: 8px;
	border-bottom: 1px solid rgb(217, 217, 217);
	width: 975px;
	
}

.first-line {

	background-color: white;
	margin-left: 0px;
	margin-bottom: 8px;
	margin-top: 8px;
	border-bottom: 1px solid rgb(217, 217, 217);
	width: 975px;
	
}

.standard {
	
	color: black;
	font-family: Verdana;
	font-weight: normal;
	font-size: small;
	margin-left: 20px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 10px;
	width: 935px;
	background-color: white;
	text-align: left;
}

.project {
	
	height: 100%;
	padding: 0px;
	margin: 0px;
}

.dc-career-track {
	
	color: rgb(254, 199, 81);
	text-align: left;
	font-size: 12px;
	font-style: normal;
	font-family: Verdana;
	word-spacing: 1px;
	line-height: 40px;
	
}

.dc-career-title {
	
	color: white;
	text-align: left;
	font-size: 40px;
	font-style: normal;
	font-family: Calibri;
	
}

.dc-career-description {
	
	color: white;
	text-align: left;
	font-size: 15px;
	font-style: normal;
	font-family: Arial;
	font-weight: 10;
	
}

.class-link {
	
	color: white;
	text-align: left;
	font-size: 20px;
	font-family: Calibri;
}

.class-link a {
	
	padding-left: 25px;
	color: white;
	font-weight: normal;
	font-size: 20px;
	font-family: Calibri;
	font-weight: bold;	
}

.class-link a:hover {
	
	color: black;
	font-weight: bold;
}
	
.container > .nav-pills >li {

	background-color: transparent;
	padding: 0px 10px 0px 0px;
}
	
.container > .nav-pills > li.active > a,
.container > .nav-pills > li.active > a:focus {
	
	background-color: rgb(37, 59, 93); 
	color: rgb(254, 199, 81);
}


.container > .nav-pills > li.active > a:hover,
.container > .nav-pills > li > a:hover {
	
    background-color: rgb(37, 59, 93);
	color: rgb(254, 199, 81);
}

.container > .nav-pills > li > a {
	
	color: rgb(37, 59, 93);
	background-color: rgb(254, 199, 81);
	    border-radius: 5px;

}

#pic {

	background: url('images/Head Shot.jpg') no-repeat center;
	float: left;
	position: float;
	width: 142px;
	height: 174px;
	background-size: cover;
	margin-top: 25px;
	margin-right: 25px;
}