landingpagev1.css

* {
  font-family: 'Fira Sans', sans-serif !important;
}


/* Top Nav */


#topRightNavBar {
  box-shadow:2px 2px 12px rgba(116, 116, 116, 0.533);
}

#topRightNavBar ul li a:hover {
  color:#862633 !important;
}

#topRightNavBar ul li {
    text-decoration:none;
    display:inline;
    text-align:right;
    color:#001e60;
    border:none;
}

#topRightNavBar ul {
  text-align:right;
  padding:1.5em;
}

#topRightNavBar ul li a {
  margin:1em;
  line-height:2.5em;
}

#topRightNavBar ul li:hover {
  font-weight:600;
}

.logoSection {
  text-align:center;
  padding:2em;
}

#headerLogo {
  max-width:350px;
  margin:1em;
}

@media screen and (max-width: 600px) {
 #topRightNavBar ul li a {
  font-size:1.1em;
 }
}


/* responsive main nav */

#responsive-nav {
  padding:0.7em 1.7em;
  background: rgb(0,18,59), url("../images/TC20-010_frontof920_CAMPUS08_landscape.png");
  background: linear-gradient(323deg, rgba(0,18,59,0.9) 36%, rgba(0,15,47,0.9) 63%), url("../images/TC20-010_frontof920_CAMPUS08_landscape.png");
  /* background: rgba(0, 58, 74, 0.799), url("../images/TC20-010_frontof920_CAMPUS08_landscape.png");
  background: linear-gradient(323deg, rgba(0, 58, 74, 0.952) 36%, rgba(0, 50, 64, 0.903) 63%), url("../images/TC20-010_frontof920_CAMPUS08_landscape.png"); */
  background-position:center bottom;
  background-repeat:none;
  background-size:cover;
  color:#fff !important;
  margin:0;
  box-shadow:2px 2px 12px rgba(105, 105, 105, 0.494);
}

.navbar {
border-bottom:solid 4px #ffb500;
}

#responsive-nav a {
  color:#fff !important;
}

#navbardrop:hover {
  color:#ffb500 !important;
}

.dropdown-menu {
  background-color:#00123b;
  color:#fff;
}

.nav-item {
  padding:0em 1em;
}

.nav-link.dropdown-toggle.active {
background-color:#00123b;
}

.dropdown-item:hover {
background-color:#001e60 !important;
color:#fff !important;
}



.dropdown-toggle:after { 
  content: none 
}

/* ----- Body ----- */ 

body {
    margin:0em 8em;
    padding:0em 8em;
    background-color:rgb(235, 235, 235);
  }
  
  h1 {
    font-size:4vw;
    color:#862633;
    padding: 0.5em 0em;
  }

  #pageHeading {
    padding-bottom:0em !important;
  }
  
  h2 {
    font-size:2vw;
    color:#862633; 
    padding:0.6em 0em;
  }
  
  h3 {
    font-size:1.5vw;
    font-weight:600;
    padding: 0em 0em 0.5em 0em;
    color:#862633;
  }

  h4, h5 {
    color:#862633;
  }

  h5.bulletList {
    color:#862633;
    font-weight:600;
    font-size:medium;
  }

  button.linkRequest {
    background-color:#005f86;
    border-radius:10px;
    padding:0.5em 1.7em;
    margin:1em 0em;
  }

  button.linkRequest a {
    color:#fff !important;
  }

  button.linkRequest:hover {
    background-color:#007fa3;
  }

  button.linkRequest a:hover {
    font-weight:400 !important;
  }

  button.applyNow {
    background-color:#ffb500;
    border-radius:10px;
    padding:0.5em 1.7em;
    margin:1em 0em;
    box-shadow:2px 2px 2px rgba(115, 115, 115, 0.448);
    border:none;
  }

  button.applyNow a {
    color:#001e60 !important;
    font-weight:400 !important;
  }

  button.applyNow:hover {
    box-shadow:2px 2px 12px rgba(87, 87, 87, 0.531);
  }

  button.fafsa {
    background-color:transparent;
    border:solid 1px #007fa3;
    border-radius:10px;
    padding:0.5em 1.7em;
    margin:1em 0em;
    box-shadow:2px 2px 8px rgba(115, 115, 115, 0.448);
  }

  button.fafsa a:hover {
    font-weight:400 !important;
  }

  button.fafsa:hover {
    border-width:2px;
  }

  hr.divider {
    margin:4em;
    border:1px solid rgba(169, 169, 169, 0.573);
  }

  hr.dividerSmall {
    margin:2em;
    border: 1px solid rgba(169, 169, 169, 0.573);
  }
  
  @media screen and (max-width: 900px) {
    body {
      margin:0.5em;
    }
    }


/* Breadcrumbs */

/* Style the list */
ul.breadcrumb {
list-style: none;
background-color:transparent;
}

/* Display list items side by side */
ul.breadcrumb li {
  display: inline;
  font-size: 14px;
}

/* Add a slash symbol (/) before/behind each list item */
ul.breadcrumb li+li:before {
  padding: 0px 8px;
  color: black;
  content: "/\00a0";
}

/* Add a color to all links inside the list */
ul.breadcrumb li a {
  color: #0275d8;
  text-decoration: none;
}

/* Add a color on mouse-over */
ul.breadcrumb li a:hover {
  color: #01447e;
}

  
/* Main Section */

#mainSection {
    padding:0em 2em;
}

#mainContainer {
  background-color:#fff;
  box-shadow:8px 8px 8px rgba(135, 135, 135, 0.293);
  border-radius:5px;
  margin:1em;
}


/* ----- Two Column Layout Container ----- */

/* #twoColumns {
  padding:0em 2em;
} */

#rightColumn {
  margin-left:1em;
}

/* --------- Scroll Animation --------- */

/* 
.slideanim {visibility:hidden;}
.slide {
  animation-name: slide;
  -webkit-animation-name: slide;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  visibility: visible;
}

 @keyframes slide {
  0% {
    opacity: 0.1;
    transform: translateY(70%);
  } 
  100% {
    opacity: 1;
    transform: translateY(0%);
  }
}
@-webkit-keyframes slide {
  0% {
    opacity: 0.1;
    -webkit-transform: translateY(90%);
  } 
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
  }
} */
  
  
  /* ----- Header Image w/ Text Overlay ----- */
  
  #headerImage {
      text-align:center;
      background-color:rgba(169, 169, 169, 0.401);
      padding-bottom:0.4em;
  }
  
    #headerImage img {
      max-width:100%;
      box-shadow:2px 2px 2px rgba(95, 95, 95, 0.561);
    }

  
  
  /* ----- Content Blocks *OPTIONAL ADD-ON* ----- */
  
  p.contentText {
      line-height:1.7em;
      margin:0.3em 4em;
      font-size:medium;
  }
  
  
  /* ----- Links *OPTIONAL ADD-ON* ----- */
  
  a {
      text-decoration:none;
      color:#005f86 !important;
  }
  
  a:hover {
      font-weight:600;
      text-decoration:none;
  }
  
  
  /* ----- Button *OPTIONAL ADD-ON* ----- */
  
  .btn-primary, .btn-secondary {
      margin:1em;
  }
  
  /* Primary*/
  .btn-primary {
      background-color:#862633;
      color:#fff;
      border-radius:6px;
      padding:0.5em 2.5em;
      border:none;
  }
  
  .btn-primary:hover {
      background-color:#9b2b3a;
      border:solid 1px #fff;
      padding:0.6em 2.5em;
  }
  
  /* Secondary */ 
  .btn-secondary {
      background-color:transparent;
      border:solid 1px #862633;
      color:#862633;
      border-radius:6px;
      padding:0.5em 2.5em;
  }
  
  .btn-secondary:hover {
      border:solid 2px;
      background-color:transparent;
      color:#862633;
  }
  
  /* ----- Video Wrapper ----- */
  
  #video {
    text-align:center;
    margin:2em;
  }
  
  iframe {
    max-width:100%;
    padding:0.5em;
    border:1px solid rgb(217, 217, 217);
    border-radius:6px;
    box-shadow:2px 2px 6px rgba(88, 88, 88, 0.364);
  }
  
/* ----- Table *OPTIONAL ADD-ON* ----- */

#table {
    margin:2em;
}

#myTable {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
  }

  
  #myTable td, #myTable th {
    border: 1px solid #ddd;
    padding: 8px;
  }
  
  #myTable tr:nth-child(even){background-color: #f2f2f2;}
  
  #myTable tr:hover {background-color: #ddd;}
  
  #myTable th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #862633;
    color: white;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: 1px solid #ddd;
  }
  
  th, td {
    text-align: left;
    padding: 8px;
  }
  
  tr:nth-child(even){background-color: #f2f2f2}

  
  
  /* ----- Content Container ----- */

  #contentContainer {
    margin:0em 2em;
    padding:0em 2em;
  }

  
  /* ----- Divider *OPTIONAL ADD-ON* ----- */
  
  #divider {
      margin:4em;
      border: solid 1px rgb(210, 210, 210);
  }
  
  
  /* ----- Boxed Paragraph *OPTIONAL ADD-ON* ----- */
  
  #boxedParagraph {
      margin:2em 4em;
      padding:2em;
      border-radius:8px;
      box-shadow:6px 6px 16px rgba(113, 113, 113, 0.434);
      background: rgb(0,75,106);
      background: linear-gradient(323deg, rgba(0,75,106,1) 0%, rgba(0,77,107,1) 22%, rgba(0,80,112,1) 36%, rgba(0,95,134,1) 63%);
      color:#fff;
      font-size:1.2vw;
      font-weight:400;
      text-align:center;
  }
  
  @media screen and (max-width: 1024px) {
    #boxedParagraph {
      margin:0.5em;
      padding:2em;
      font-size:larger;
    }
    }
  
  
/* ----- Bullet List ----- */

ul li {
  line-height:1.7em;
}
  
  /* Style the cards */

   /* Style the cards */
  
   .card {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    padding: 16px;

    background-color: #fff;
    color: #000;
  }
  
  .card-body img {
    max-width:100%;
    margin-bottom:1em;
    transition: .2s;
  }

  .card-body img:hover {
    transform: scale(1.075);
  }

  .card-deck {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    grid-gap: .8rem;
    text-align:center;
    padding:2em 1em;
}

svg.icons {
  width:100px;
  padding:1em;
  fill:#00123b;
  transition:transform .3s;

}

svg.icons:hover {
  fill:#007fa3;
  transform: scale(1.06), skewY(20deg);
}

  
  /* ----- Footer //Use Default Footer ----- */

  #footer-background {
    /* background: rgb(0,59,83), url("../images/TC20-010_frontof920_CAMPUS08_landscape.png");
    background: linear-gradient(323deg, rgba(0,59,83,0.97) 0%, rgba(0,95,134,0.90) 90%), url("../images/TC20-010_frontof920_CAMPUS08_landscape.png"); */
    background: #00123b, url("../images/TC20-010_frontof920_CAMPUS08_landscape.png");
    background: linear-gradient(323deg, rgba(0,18,59,0.9) 36%, rgba(0,15,47,0.9) 63%), url("../images/TC20-010_frontof920_CAMPUS08_landscape.png");
    background-position:center bottom;
    background-repeat:none;
    background-size:cover;
    color:#fff;
    padding:4em 8em;
    border-bottom:solid 4px #ffb500;
    box-shadow:2px 2px 12px rgba(105, 105, 105, 0.494);
}
    img#footerLogo {
    width:350px;
    padding:2em;
  }
  
  .fa-brands {
    margin:1em 1em 1em 0em;
    color:#862633;
  }

  i.fa-brands {
    font: normal normal normal 32px/1 FontAwesome !important;
  }

  .fa-brands:hover {
    color:#001e60;
  }
  
  .socialMedia {
    text-align:center;
  }
  
  #footerLinks {
    padding:1em 2em;
    color:#fff;
  }
  
  footer ul li a, footer a {
    color:#fff !important;
  }

  footer ul li a:hover, footer a:hover {
    color:#ffb500 !important;
    font-weight:600;
    text-decoration:none;
  }
  
  footer ul li {
    line-height:2.3em;
  }
  
  footer #address {
    line-height:2.3em;
  }
  
  @media only screen and (max-width: 1024px) {
    footer {
      text-align:center;
      margin:0em;
      padding:0.5em;
    }
    img#footerLogo {
      margin:auto;
    }
    #map {
      margin:auto;
    }
    footer .col-lg-3 {
      margin:1em 0em;
    }
    #footer-background {
      margin:0em;
      padding:1.5em 0.5em;
    }
  }

  iframe#map {
    border-radius:10px;
  }
  
  .copyright {
    padding:1em;
    text-align:center;
    font-size:smaller;
    color:#862633;
    font-weight:600 !important;
  }
    
  
  
  /* ----- General Media Queries ----- */
  
  @media screen and (max-width: 1400px) {
    #mainSection, #mainContainer, #smallerContainer, body, #contentBlock {
      margin:0.5em;
      padding:0.5em;
    }
    }