/*
* Created By: MDC Web Services
* Description:  Cybersecurity of the Americas -  css
* Revised: 12/13/2019
*/


/*cybersecuritycenter@mdc.edu*/


/*Masthead Code*/

/*Applied Artificial Intelligence*/

.third-intro-section {
    background-color: #EEEEEE;
    padding-top: 30px;
    padding-bottom: 30px;
}

section.fourth-intro-section {
    margin-bottom: 0px;
}

section.fifth-intro-section {
    margin-bottom: 0px;
}

section.sixth-intro-section {
    margin-bottom: 30px;
}

.seven-intro-section p {
	color: #fff;
}

p.mediansalary {
    font-size: 28px;
}

.seven-intro-section h3 {
    color: #fff;
    margin-bottom: 2px;
}

.navbar-default {
    border-color: initial;
    /*background-color: #101a23;*/
}

section.fourth-intro-section .col-sm-4.col-lg-3 {
    padding-top: 40px;
}

section.fifth-intro-section .col-sm-4.col-lg-3 {
    padding-top: 20px;
}

section.sixth-intro-section .col-sm-4.col-lg-3 {
    padding-top: 25px;
}

section.intro-section .col-sm-8 {
    padding-top: 18px;
}

section.fourth-intro-section h3 {
    margin-bottom: 3px;
}

section.fifth-intro-section h3 {
    margin-bottom: 3px;
}

.container.banner-content:last-of-type {
    text-align: left;
	margin-top: auto;
	padding-top: 20px;
}

.banner.new-banner {
    margin-top: -20px;
    height: 15em;
}

section.sixth-intro-section h3 {
    margin-bottom: 3px;
}

h3 {
    margin-bottom: 3px;
}

.seven-intro-section {
	background-color: #192D48;
}

.seven-intro-section {
    margin-bottom: -90px;
    padding-bottom: 34px;
    padding-top: 30px;
}

.banner.new-banner h3{
    font-weight: 200;
    color: white;
    margin-top: 10px;
}

.full-width-banner.intro-banner h3 {
    font-weight: 200;
    margin-top: auto;
    margin-bottom: auto;
    font-size: 2.3em;
}

.col-sm-4.col-lg-3 {
    width: 32%;
    padding-top: 30px;
}

.second-intro-section p {
	color: #fff;
}

.second-intro-section h3 {
	color: #fff;
	margin-top: auto;
}

.thumbnail{
    background-color: #192d48;
}

.second-intro-section h4 {
    color: #fff;
}

.seven-intro-section a {
    color: white;
}


/*End Applied Artificial Intelligence*/

/*Site Branding*/

body {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}

.title-area {
	height: 120px;
}

.title-container {
	height: 100%;
}

.title-name h1{
	font-size: 50px;
	margin: 0;
	/*font-size: 20px;*/
}

#siteContent {
	margin-top: 20px;
}

section {
	margin-bottom: 30px;
}

h3.thumbnail-title{
    font-size: 20px;
    text-align: center;
}

h4.no-margin{
    margin-top: -15px;
}

.thumbnail-caption p a {
	/*font-size: 18px;*/
}

div.thumbnail-caption p {
    text-align: center;
}

/*
.site-masthead {
    background-position: center;
    background-repeat: no-repeat;
    background-color: #1a2d48;
    color: #fff;
    background-image: none;
}
*/

.title-name.title-background span {
    background-color: rgba(0, 0, 0, 0.3);
    padding-left: 12px;
    padding-right: 12px;
}

.btn.btn-primary a {
    text-decoration: none !important;
    color: white;
	font-size: 18px;
}

p .btn-primary {
    padding: 15px 50px 15px 50px;
	font-size: 18px;
}

p.lead strong {
	font-weight: 500;
    font-size: 30px;
}

.banner {
    margin-top: 20px;
	height: 29em;
	margin-bottom: -30px;
}

.banner.hp-top-banner {
    margin-top: -20px;
	height: 40em;
}

.banner.banner-35 {
	height: 35em;
}

.container.banner-content {
    text-align: center;
	margin-top: 20em;
}

.well {
	margin-top: 20px;
}

.full-width-banner {
	/*background-color: #101a23;*/
	background-color: #192D48;
	margin-bottom: 0px;
}

.full-width-banner h2 {
	font-weight: 300;
}

.full-width-banner .content {
	width:100%;
}

#banner-statement {
	font-size: 2em;
}

.mt-20 {
    margin-top: 20px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mt-40 {
    margin-top: 40px;
}

.mb-40 {
    margin-bottom: 40px;
}

.bolder {
	font-weight: 600;
}


/*Formstack*/

body .fsBody {
    padding: 0;
}

body .fsBody .fsForm {
    padding: 0;
    margin: 0 auto;
}

body .fsForm textarea {
    line-height: 0.5em;
}

body .fsForm .fsSubmit {
    margin-top: 0;
    padding: 0;
}

body .fsSubmitButton {
    padding: 1em 1.5em;
    font-size: 1.2em !important;
}

.table.blue-table {
    background-color: #bbdefb;
}

.table.blue-table tbody tr th,
.table.blue-table tbody tr td {
    border-top: none;
}

.blue-caption {
    text-align: center;
    background-color: #1a2d48;
    color: #fff;
}

.ibm-h2 {
    color: #fff;
    margin-top: 0px;
    font-size: 6em;
    font-weight: 400;
}
.container.banner-content {
  margin-top: 100px;
}

.bold-info {
	font-weight: 600;
}

.col-sm-4.ibm-info {
	margin-top: 20px;
}


.question {
    font-weight: 600;
}
.answer {
    margin-bottom: 30px;
}


.banner h2 {
	font-weight: 500;
    color: #fff;
    /*font-size: 4em;*/
}

.banner p {
  color: #000;
  font-size: 1em;
}

.full-width-banner p {
	font-size: 18px;
}


.full-width-banner a:link,
.full-width-banner a:visited  {
  color: #fff !important;
  text-decoration: none !important;
  font-weight: bold !important;
}


.full-width-banner a:hover,
.full-width-banner a:active,
.full-width-banner a:focus {
  text-decoration: underline !important;
}



@media (min-width: 768px) {
    .title-area {
        width: 100%;
        position: relative;
    }
    .title-container {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        display: table;
    }
    .title-name {
        display: table-cell;
        vertical-align: middle;
    }
    aside h4 {
        margin-top: 0px;
    }
}

@media (max-width: 767px) {
    .site-masthead {
        padding: 10px 0;
    }
    aside {
     /* border: 1px solid #eee;
      background-color: #ddd;
      width: 85%;*/
      margin: 2.5em auto;
      padding: 2em;
    }

    aside .fsBody, aside  .fsPage, aside .fsBody .fsForm{
      background: transparent !important;
    }
    .cyber-caption-alt h1 {
         font-size: 28px;
    }
    .about-section h2 {        
        font-size: 26px !important;
    }

	.banner {
		height: 200px;
	}
    .banner.banner-35 {
        height: 15em;
    }

    .banner h2 {
          font-size: 2em;
      }
	.ibm-h2 {
    	font-size: 2em;
	}
	.container.banner-content {
		margin-top: 10px;
	}
	.hide-btn {
		display: none;
	}
	.ibm-h2 {
		margin-top: 20px;
	}
}

@media (max-width: 459px){
	.ibm-h2{
		font-size: 1.5em;
	}

  .banner h2 {
      font-size: 2em;
  }

}

/* Mobile devices (iPhones, Android phones, 375px and up, also covers NEW phones) */
@media (min-width: 350px) and (max-width: 640px) {
.container.banner-content:last-of-type {
    text-align: center;
    margin-top: auto;
    padding-top: 0px;
    margin-left: 0px;
}

.banner.hp-top-banner {
	height: 19em;
}

.banner.cyber-footer {
    margin-bottom: 0px;
}

section.intro-section .col-sm-8 {
    padding-top: 0px;
}

.banner.new-banner {
    margin-top: -20px;
}

.title-area {
    height: 35px;
}

.title-name h1 {
    font-size: 30px;
}

.container.banner-content h2 {
	font-size: 3em;
}

.full-width-banner.intro-banner h3 {
    font-size: 1.3em;
}

.banner h2 {
    margin-top: 8px;
}

.intro-section .col-sm-4.col-lg-3 {
    width: 100%;
    padding-top: 0px;
}

.intro-section .col-sm-8 .thumbnail-caption h3 {
    text-align: center !important;
}

.intro-section .col-sm-8 .thumbnail-caption p {
    text-align: center !important;
}

.intro-section .col-sm-8 .thumbnail-caption {
    padding: 0px 0px 0px 0;
}

.fourth-intro-section .col-sm-4.col-lg-3 {
    width: 100%;
    padding-top: 20px;
}

.fourth-intro-section .col-sm-8 .thumbnail-caption h3 {
    text-align: center !important;
}

.fourth-intro-section .col-sm-8 .thumbnail-caption p {
    text-align: center !important;
}

.fifth-intro-section .col-sm-4.col-lg-3 {
    width: 100%;
}

.fifth-intro-section .col-sm-8 .thumbnail-caption h3 {
    text-align: center !important;
}

.fifth-intro-section .col-sm-8 .thumbnail-caption p {
    text-align: center !important;
}

.sixth-intro-section .col-sm-4.col-lg-3 {
    width: 100%;
}

.sixth-intro-section .col-sm-8 .thumbnail-caption h3 {
    text-align: center !important;
}

.sixth-intro-section .col-sm-8 .thumbnail-caption p {
    text-align: center !important;
}

/* Small Devices 1: (iPad Classic)*/
@media (min-width: 768px) {}

/* Small devices (tablets, 768px and up) */

@media (min-width: 768px) and (max-width: 991px) {
    .title-area {
        height: 80px;
    }
    .title-container {
        height: 80px;
    }
    .title-name h1 {
        font-size: 36px;
    }
    .cyber-caption-alt h1 {
         font-size: 32px;
    }
    .about-section h2 {        
        font-size: 32px !important;
    }
	
}

/* Small devices 3: (Newer tablets, iPad Pro, 1024px and up) */
@media (min-width: 991px) and (max-width: 1024px) {}

/* Small devices 2: (tablets, iPad classic, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {}

/* Medium devices (desktops, 992px and up) */

@media (min-width: 992px) and (max-width: 1199px) {
    .title-area {
        height: 90px;
    }
    .title-container {
        height: 90px;
    }
    .title-name h1 {
        font-size: 36px;
    }
}

@media (max-width: 992px) {
  .full-width-banner p {
      font-size: 16px;
  }
}


/* Large devices (large desktops, 1200px and up) */

@media (min-width: 1200px) {
    .title-area {
        height: 100px;
    }
    .title-container {
        height: 100px;
    }
    .title-name h1 {
        font-size: 36px;
    }
}


/*Site Branding*/

.cybersecurity-intro {
    background-image: url("../img/intro-bg-altcopy.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    height: 595px;
    background-position: top;
    padding-top: 381px;
}

.cybersecurity-intro-alt {
    background-image: url("../img/intro-bg-altcopy.jpg");
    background-repeat: no-repeat;
    background-position: top;
    padding-top: 280px;
}

@media (min-width: 992px) {
    .cybersecurity-intro-alt {
        background-size: cover;
        background-position: top;
        padding-top: 420px;
    }
}

@media (min-width: 320px) {
    #siteContent {
        margin-top: 0;
    }
}

.icons {
    background-color: #3e6dae;
    color: #fff;
}

.cyber-range-features {
    background-color: #d1d5e2;
    padding: 30px 0;
}
.cybercenter-features {
    background-color: #d1d5e2;
    padding-top: 60px;
    padding-bottom: 60px;

}
.site-masthead h1 {
    text-transform: uppercase;
    /*font-size: 30px;*/
    font-weight: 400;
}
@media (max-width: 992px) {
	/*    
	.site-masthead h1 {
        font-size: 22px;
    }
	*/

}
.cyber-caption {
    color: #fff;
    background: rgba(26, 45, 72, 0.9);
    /* Navy background with 90% opacity */
}
@media (min-width: 992px) {
  .cyber-caption {
    padding: 45px 0;
    }  
}
@media (max-width: 992px) {
  .cyber-caption h2 {
    font-size: 24px;
    }
    .cyber-caption h3 {
    font-size: 18px;
    }  
}
.cyber-caption-alt {
    color: #fff;
    background: rgba(26, 45, 72, 0.9);
    /* Navy background with 90% opacity */
    padding: 29px 0;
}

.cyber-caption h1 {
    text-transform: uppercase;
    font-size: 50px;
    margin-top: 0;
}

.cyber-caption-alt h1 {
    text-transform: uppercase;
    margin-top: 0;
}

@media (min-width: 992px) {
    .cyber-caption-alt h1 {
        font-size: 36px;
    }
}

.cyber-range-features h3 {
    font-weight: 400;
}

.cyber-range-features h4 {
    color: #fff;
    background-color: #1a2d48;
    text-transform: uppercase;
    font-weight: 400;
    padding: 10px;
    height: 40px;
    font-size: 16px;
    margin-top: 0;
}
@media (min-width: 992px) {
    .cybercenter-features h3 {
    color: #fff;
    background-color: #1a2d48;
    text-transform: uppercase;
    font-weight: 400;
    padding: 10px;
    height: 40px;
    font-size: 16px;
    margin-top: 0;
    }
}

@media (max-width: 1200px) {
    .cyber-range-features h4 {
        font-size: 13px;
    }
}

@media (min-width: 992px) {
    .about-section {
        padding: 30px 0;
    }    
}

.highlight-section {
    padding: 30px 0;
    background-color: #3e6dae;
    color: #fff;
}

.cybericon-item {
    height: 100px;
}

.cybericon-item p {
    padding-top: 16px;
}

.page-header h2 {
    line-height: 1.1em;
}
.contact-section {
    padding: 30px 0;
}

.cyber-range-features h3 {
    font-weight: 400;
    font-size: 36px;
    border-bottom: 1px solid #a1a7bb;
    margin-bottom: 30px;
    padding-bottom: 4px;
}

.about-section h2 {
    font-weight: 400;
    font-size: 40px;
    border-bottom: 1px solid #d4d4d4;
    margin-bottom: 30px;
    padding-bottom: 4px;
}

.highlight-section h3 {
    font-weight: 400;
    font-size: 36px;
    border-bottom: 1px solid #28466f;
    margin-bottom: 30px;
    padding-bottom: 4px;
}

.contact-section h3 {
    font-weight: 400;
    font-size: 36px;
    border-bottom: 1px solid #d4d4d4;
    margin-bottom: 30px;
    padding-bottom: 4px;
}

h3.section-title {
	border-bottom: 1px solid #d4d4d4;
	padding-bottom: 4px;
	
}

.collage-cyber-range {
    margin-bottom: 30px;
}

.request-info h4 {
    font-size: 26px;
    font-weight: 400;
    margin-top: 0;
}
.about-section h3 {

    margin-top: 0;
}
h3 {
  font-weight: 400;
  /*font-size: 28px;*/
}
.cybersecurity-hp .navbar-default {
    margin-bottom: 0;
}

.cybersecurity-hp .mdc-footer-links {
    margin-top: 0;
}

.cybersecurity-page h3 {
    font-size: 26px;
}
.cybersecurity-page h4 {
    font-weight: 400;
    font-size: 20px;
}
.cybersecurity-intro a {
    color: #fff;
}
#learn-more {
    padding-top: 200px;
}

.full-width-banner.dark-background-banner {
	background-color: #192d48;
}

.class-title {
	font-size: 26px;
    font-weight: 400;
    color: #0f5088;
	margin-bottom: -10px;
}

.center-img {
	margin-left: auto;
    margin-right: auto;
}

.img-display-inline .img-responsive {
	display: inline-flex;
}

.col-sm-3 img {
    margin-right: auto;
    margin-left: auto;
}

h3.border-bottom {
    border-bottom: 1px solid #c9d0d7;
    padding-bottom: 4px;
    margin-bottom: 20px;
}


.row.footer-cyber {
	/*margin-top:20px;*/
    text-align: left;
}
.banner p:last-of-type {
	color: #000 !important;
	font-size: 14px;
} 
.container.banner-content:last-of-type {
	margin-top: auto;
}
.container.banner-content:last-of-type strong {
	color: #000;
}
.container.banner-content:last-of-type a,
.container.banner-content:last-of-type strong{
    font-size: 14px;
}

.banner.cyber-footer {
    height: auto;
    margin-top: 20px;
}

.banner.cyber-footer p{
    height: auto;
	margin-top: 20px;
	color: #000;
	font-size: 1.0em;
}

.banner.badge-courses p {
    color: #fff !important;
    font-size: 24px;
    margin-top: 20px;
}


@media (max-width: 400px) {
  .banner.badge-courses p {
    font-size: 16px;
    margin-top: 10px;
   } 
}

@media (min-width: 768px) {
  .banner.badge-courses  {
    padding: 75px 0 !important;
   } 
}

h3, h4 {
	font-weight: 400;
}

.mdc-footer-links {
    margin-top: -0px;
}


.thumbnail-caption.top-align-title h3 {
    margin-top: 0px;
}

.thumbnail-caption.top-align-title {
        padding-top: 0px;
}