body,html{
  margin:0;
  padding:0;
  width: 100%;
  overflow-x: hidden;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: normal;
  font-size: 24px;

}
header{
  background-image: url(../images/state-seal-web.png);
  background-size: cover;
  background-position: top right;
  background-repeat: no-repeat;
  position: fixed;
  height: 102px;
  top: 0;
  width: 100%;
  left: 0;
  z-index: 9999;
}

.navbar {
  overflow: visible;
  /*background-color: #393939;*/
  width: 100%;
  height: 102px;
  box-shadow: 0 8px 6px -6px #6e6f68;
  z-index: 5;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.navbar .logo{
    max-width: 300px;
}
.navbar .logo img {
  width: 100%;
}
.navbar ul {
  list-style: none;
  margin: 0;
}

li {
  display: inline;
  line-height: 40px;
  text-align: center;
}

ul li a {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: bold;
  padding: 15px;
  color: #b0bc22;
  text-decoration: none;
  font-size: 22px;
}
.nav a:hover {
  background-color: #005f5f;
}
 
.nav a.active {
  background-color: #fff;
  color: #444;
  cursor: default;
}
 /*
#home {
  height: 700px;
  width: 60%;

}*/
.fullsection {
  height: 100vh;
  position: relative;
  overflow: hidden;
}
#home {
  background-image: url(../images/hero.jpg);
  background-size: 100% ;
  background-repeat: no-repeat;
  z-index: 1;
}

.flex-container {
  width:100%;
  z-index: 1;
  display: flex;
}
.flex-container .column {
  margin-left: 40px;
  margin-right: 40px;
  
  text-align: center;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#393939+0,393939+100&1+50,0+100 */
  flex:1;
  
}
#home .flex-container {
  position: absolute;
  height: 200px;
  align-items: center;
  align-content: space-between;
  bottom: 0;
}
#home .flex-container .column {
  height: 100%;
  padding: 20px;
  transform: skewX(-15deg);
  background: -moz-linear-gradient(top,  rgba(57,57,57,1) 0%, rgba(57,57,57,1) 50%, rgba(57,57,57,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(57,57,57,1) 0%,rgba(57,57,57,1) 50%,rgba(57,57,57,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(57,57,57,1) 0%,rgba(57,57,57,1) 50%,rgba(57,57,57,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#393939', endColorstr='#00393939',GradientType=0 ); /* IE6-9 */
}
#home .flex-container .column h2 {
  transform: skewX(15deg);
}

#home .flex-container .column h2 span {
  display: block;
  font-size: 22px;
  font-weight: normal;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
/* div{
  display: block;
  border-block-start-color: #393939;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-size: 2em;
} */

#overview {
  background-color:#ffff;
  background-image: url(../images/mac-man.jpg);
  background-repeat: no-repeat;
  background-position: bottom left;
  background-size: 55%;
  
}


.one {
  background-color:#393939;
  color: #ffff;
  text-align: center;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: normal;
  font-size: 22px;
  border-style: solid;
  border-width: 5px;
  border-color: #b0bc22;
  box-shadow: 10px 10px 5px #393939;
  z-index: 4;
  max-width: 55%;
  box-sizing: border-box;
  padding: 50px;
  position: absolute;
  top: 50px;
  left: 50px;
}

.two {
  background-color: #b0bc22;
  height: 480px;
  width: 500px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: bold;
  font-size: 20px;
  padding: 150px 20px 20px 30px;
  background-image: url(../images/pen-icon-fixed-copy.png);
  background-repeat: no-repeat;
  background-size: 100px;
  background-position: 100% 5%;
  float: right;
  margin-top: 0;
  position: absolute;
  bottom: 0;
  right:0;
}
.two h1 {
  margin-left: -50px;
}

h1{
  font-size: 2em;
  color: #393939;
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  font-weight: bold;
  
}

#course{
  height: 900px;
  background-image: url(../images/degree-certificate.jpg);
  background-repeat: no-repeat;
  background-size: 95%;
  background-position: center;
}

.three{
  background-color:#393939;
  color: #ffff;
  height: 120px;
  width: 690px;
  padding: 80px 50px;
  text-align: center;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: normal;
  font-size: 24px;
  border-style: solid;
  border-width: 5px;
  border-color: #b0bc22;
  box-shadow: 10px 10px 5px #393939;
  z-index: 4;
  position: absolute;
  top: 100px;
  right: 100px;
}

.four {
  background-color: #b0bc22;
  height: 520px;
  width: 500px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-weight: bold;
  font-size: 20px;
  padding: 150px 20px 20px 30px;
  margin-top: 150px;
  float: left;
  left: 0;
  bottom: 0;
}
.four h1 {
  text-align: right;
  margin-right: -50px;
}
.four ul {
  list-style-type: circle;
}

#faculty{
  background: rgb(46,46,50);
background: linear-gradient(0deg, rgba(46,46,50,1) 0%, rgba(156,156,161,1) 58%, rgba(207,210,210,1) 100%);
}
#faculty .flex-container img {
  width: 100%;
  display: block;
}
#faculty .flex-container .column .photo {
  position: relative;
}
#faculty .flex-container .column .photo h2 {
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 100%;
  text-align: left;
  padding: 30px;
}
#faculty h1{
  margin-top: 20px;
  text-align: center;
}
#faculty .flex-container .column .description{
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b0bc22+0,b0bc22+100&1+50,0+100 */
background: -moz-linear-gradient(top,  rgba(176,188,34,1) 0%, rgba(176,188,34,1) 50%, rgba(176,188,34,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(176,188,34,1) 0%,rgba(176,188,34,1) 50%,rgba(176,188,34,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(176,188,34,1) 0%,rgba(176,188,34,1) 50%,rgba(176,188,34,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b0bc22', endColorstr='#00b0bc22',GradientType=0 ); /* IE6-9 */
  overflow: hidden;
  height: 200px;
}

/* #faculty img{
  height: 400px;
} */

h2{
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  color: #ffff;
  font-size: 30px;
  margin-bottom: 0;
  margin-left: 0px;
}
