body {
background: rgb(0,0,0);
background: linear-gradient(135deg, rgba(0,0,0,1) 10%, rgba(12,74,101,1) 90%);
    
        /* Set content width to viewport height 
        width: 100vh;
        /* Set content height to viewport width 
        height: 100vw;*/

}

html, body {
    height: 100%!important; /* Ensure both html and body take full viewport height */
    margin: 0!important; /* Remove default margins */
    padding: 0!important; /* Remove default padding */
}
    body {
    background: rgb(0,0,0)!important;
    background: linear-gradient(135deg, rgba(0,0,0,1) 10%, rgba(12,74,101,1) 90%)!important;
    background-size: cover!important; /* Ensure the gradient covers the entire area */
    background-repeat: no-repeat!important; /* Prevent gradient from repeating */
    background-attachment: fixed!important; /* Fix the gradient to the viewport */
}

.field_bg {
background: #fff!important;
}

.logo {
	
	float:left;
	width:30%;
	padding-top: 5%;
	z-index: 10;
	position: absolute;
}

.logo_header {
	padding-top: 30px;
}

.row_header {
	background-image: url("../img/header_bg.webp");
	background-size: cover;
	height: 200px;
}

.row_text {
	font-size: 1em !important;
	color: #0f5b7d;
}

.row_center {
  border-right: 1px solid #0f5b7d;
	  border-left: 1px solid #0f5b7d;
}

.menu {
	 top:6%;
	float: right;
	width:3%;
	padding-top: 0%;
	z-index: 5;
	position: absolute;
	right:0;
}

.button {

border: 1px solid #d48453;
color: #d48453;
padding: 10px 30px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1em;
	font-weight: normal;
}

.button:hover {
    color: #fff;
}

a {
    color: #d48453;
}

a:hover {
    color: #0f5b7d;
}
.logo_footer a:hover {
    color: #fffd;
}

.button-fields {

border: 1px solid #d48453;
color: #d48453;
padding: 5px 10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1.1em;
font-weight: normal;
}

.button-fields:hover {
    color: #0f5b7d;
	border: 1px solid #0f5b7d;
}

/* ------MODAL - Sidebar-------*/
.modal-body_sidebar_custom{
	
	background-color: rgba(0, 0, 0, 0);
	overflow-x: hidden;
	overflow-y: hidden;

}

.modal-content_sidebar_custom{
	
	background-color: rgba(0, 0, 0, 0.5);

}

.modalmain{
	
	background-color: rgba(0, 0, 0, 0);
	overflow-x: hidden;
	overflow-y: auto;

}

.modal-title-custom {
    text-decoration: none;
    color:  #d88357 !important;
	font-size: 1.4em !important;
	font-weight: bold;
	
}

.sidebar-text {
	
	font-size: 1em !important;
	text-align: center;
	padding: 20px 10px 10px 10px;
	color: #fff;
	border-bottom: 1px solid #d48453;
}

.close_sidebar {
    color: #fff; 
    opacity: 1;
}

.close_sidebar:hover {
    color: #d88357; 
    opacity: 1;
}

.sponsor-logo {
	text-align: center;
	width: 60px;
	margin:auto;
	haight:60px;
}
/* ------CLOSE - Sidebar-------*/

.modal-header-custom {
    background: linear-gradient(135deg, rgba(0,0,0,1) 10%, rgba(12,74,101,1) 90%);
    color: #d48453;
	/*position: absolute;*/
  	bottom: 0;
  	width: 100%;
	height:60px;
	text-align: left;
	font-weight: bold;
  /* Set the fixed height of the footer here */
}

.modal-title-custom {
	font-weight: bold;
}

.modal-lg {
    max-width: 65% !important;
	overflow-y: hidden;
	overflow-x: hidden;

}

.modal-content  {
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    border-radius: 10px !important; 
}

.modal-text {
	font-size: 0.8em !important;
	color: #0f5b7d;
}

.col-sm{
	text-align: center;
}

.col-sm-left {
	text-align: center;
}
.col-sm-header {
	text-align: left;
	color: #d48453;
	font-size: 1.1em !important;
	font-weight: normal;
}
.modal-footer-custom {
	border-top: 0 none;
}

.slick-slider {
	margin-left: 50px;
}
.als-container {
	position: relative;
	width: 100%;
	margin: 0px auto;
	z-index: 0;
}

.als-viewport {
	position: relative;
	overflow: hidden;
	margin: 0px auto;
}

.als-wrapper {
	position: relative;
	list-style: none;
}

.als-item {
	position: relative;
	display: block;
	text-align: center;
	cursor: pointer;
	float: left;
}

.als-prev, .als-next {
	position: absolute;
	cursor: pointer;
	clear: both;
}

.interactiveContols{
	margin-top: 40px;
	bottom: 0;
}
/*************************************
 * specific styling for #buttonScroll
 ************************************/

#buttonScroll {
	margin: auto;
}

.film {
	width: 100%;
	vertical-align: bottom;

}
.filmButton {
	border: none;
	padding: 0px;
}
.vidImg {
	width:60px;
	position:absolute; 
}

.slick-list{
	height: 31px;
}
 .scroll-wrapper{
	 width: 90%;
	 padding: 0;
	 margin: 30px 0 0 0;
 }
.modalfooter table tr td
{font-size:10px;}


.modal-xl {
max-width: 90% !important;
		}

.modal-text {
	font-size: 1em !important;}

p.stemcaption {
	font-size: 0.9em !important;}

.logo_footer, .logo_footer .row_text{
	background-color: #005b7f;
	color: #FFFFFF !important;
	font-size: 0.7em;
	text-align: center;
}
.logo_footer .row_text{
margin:35px;
}

.modal-header .modal-title h4 {
		
}

.citation{
	
font-size:12px;
	color:#666;
	font-weight: 700;
	text-align: left;
    position:absolute;
     bottom:5px;
    width:99%;
}

.math-button{
margin:auto;
	text-align: center;
   margin-bottom:15px;
    margin-top:15px;
display:block;
   
}

.math-button img{
   margin:8px 5px;
}

.car-text h4 {
	position: absolute;
	color: #fff;
  top: 240px;
  left: 24%;
}

.corrosion-text h4 {
	position: absolute;
	color: #fff;
  top: 65px;
  left: 15%;
}

.turngif {
	position:absolute;
		display: block;
	text-align: center;
	top:400px;
	left: 600px;
}


tt{display: inline;
    visibility: visible;}

.rotated{
		display: none;
	
	}

.cirriculum-h2{
		font-weight: bold;
		color: #d88357;	
	font-size: 30px;
	}
.cirriculum-h3{
		font-weight: normal;
		color: #005b7f;	
	font-size: 27px;
	}

bold, strong{
	font-weight:bold!important;
}

table td {
	font-size: 1em!important;
}

.curriculum-bold{
	font-weight: bold;
}
.teach-cur{
	background-color: #e0b497;
	border:1px solid black;
	padding:15px;
	color: black;
}
.teach-cur table{
	border:1px solid black;
	
}
.teach-cur a{
	color: #0f5b7d!important;
}
.test-cur{
	background-color: #85b1c2;
	border:1px solid black;
	padding:15px;
	color: black;
}
.test-cur table{
	border:1px solid black;
	
}
.test-cur a{
	color: #0f5b7d!important;
}
.test-cur a:hover{
	color: #000A58!important;
}
.curriculumlink{
	color: #d88456!important;
}

a.curriculumlink2{
	color: #d88456!important;
}

a.curriculumlink2:hover{
	color: #000A58!important;
}

.testknow{
	color:#000000;
}

/*submenu*/
/* Dropdown button */
.dropdown {
  position: relative;
  display: inline-block;
transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  /*background-color: #000;*/
  min-width: 210px;
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: #d48453;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
  background-color: #000;
  color: #0f5b7d;
}

/* Show the dropdown menu on button click */
.show {
  display: block;
}

.logo-home {
	width:400px;
	}
.logo-small {
	width:250px;
	}

.button,
.button-fields,
a {
    transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}
/* END submenu*/

/*math style*/
table.mathf {
  
}
 
div.num {
  border-bottom:1px solid;
  text-align:center;
  font-size: 0.6em;
}
 
div.denom {
  font-size: 0.6em;
  border-top: 1px solid;
  text-align: center;
}

table.sponsorstable{
	text-align: center;
	margin: auto;
}
table.sponsorstable a, table.sponsorstable p {
	font-size: 12px;
	margin:0 2px 0 1px;
	padding:0 2px 0 1px
}
table.sponsorstable td{
	width:112px!important;
	vertical-align: top;
}
/*end math style*/



.stemcareerimageright, .stemcareerimageleft{
	border: 1px solid #d48453;
}

.stemcareerimageright{
	float: right; margin: 0 0 15px 15px; 
}

.stemcareerimageleft{
	float: left; margin: 0 15px 15px 0; 
}

#mce-success-response{font-weight: bold; color: darkgreen;}
#mce-error-response{font-weight: bold; color: darkred;}

@media only screen and (orientation: portrait) {
	.rotated{
	display:block;
	z-index: 10;
	position: relative;
	
	margin-left:20%;
	margin-right:20%;
	margin-top:20%;
		
	}
	.rotated img{
width:100%;
		
	}
.nav-links{
	display: none!important;
	}
	#animation_container{
		display: none;
	
	}

		
	
/*@media only screen and (orientation: portrait) {
	.turngif{
   display: block;
}
  html {
        /* Rotate the content container */
        /*transform: rotate(-90deg);
        transform-origin: left top;*/
        /* Set content width to viewport height */
        /*width: 100vh;
        /* Set content height to viewport width */
        /*height: 100vw;
        overflow-x: hidden;
	  	overflow-y: hidden;
        position: absolute;
        top: 100%;
	  	left: 0;
	  background: rgb(0,0,0);*/
	  

	  
/*background: linear-gradient(135deg, rgba(0,0,0,1) 10%, rgba(12,74,101,1) 90%);
      } */
}
@media only screen and (max-height: 800px) {
.logo {
	float:left;
	width:22%;
	padding-top: 4%;
	z-index: 10;
	position: absolute;
}
	.logo-home {
	width:300px;
		
	}
	.logo-small {
	width:250px;
	}
}
@media only screen and (max-height: 700px) {
.logo {
		float:left;
	width:15%;
	padding-top: 2%;
	z-index: 10;
	position: absolute;
}
	.logo-home {
	width:200px;
	}
	.logo-small {
	width:200px;
	}
}

#signup-link{
	padding-right:30px;
}