/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 70%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #565a63 !important;
  opacity: 1.0 !important;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  cursor: pointer;
}
.myBtn_multi {
    border: 0px;
    background: none;
    color: #525311;
    margin: 0 auto 30px;
    display: inherit;
}

 .fixedElement {
	 position:sticky;
	 top:90px;
	 width:100%;
	 z-index:100;
	 max-width: 1111px;
}

.line-left {
    padding-left: 30px;
    border-left: 1px solid #c0c2c5;
    min-height: 140px;
}
.msthd {
    position: relative;
    top: 0px !important;
    padding-bottom: 0px !important;
}
.resp-container {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
}
.resp-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.row-nomargin {
    margin-right: 0px;
    margin-left: 0px;
}
.large {
    display: none !important;
    }
.small {
    font-size: 16px;
    line-height: 48px;
    margin-bottom: 0px;
    line-height: 1.2em;
}
.small-h2 {
    font-weight: 300;
    margin-top: 0px;
    line-height: 1.2em;
}
 /* NAVIGATION */
.topnav {
  background-color: #565a63;
  overflow: hidden;
  text-align: center;
  margin-bottom: 40px;
  margin-top: 0px;
}
.second {
  background-color: #ffffff !important;
  overflow: hidden;
  text-align: center;
  margin-bottom: 40px;
  margin-top: -20px;
}
.topnav a {
  display: inline-block;
  color: #ffffff;
  text-align: center;
  padding: 14px 0px 3px;
  margin: 0px 26px 11px;
  text-decoration: none;
  font-size: 17px;
  text-transform: uppercase;
  border-bottom: 2px solid #565a63;
}
.topnav a:hover, .topnav .on {
  border-bottom: 2px solid #ffffff;
  text-decoration: none;
  color: #ffffff;
}
.second a {
  display: inline-block;
  color: #565a63 !important;
  text-align: center;
  padding: 10px 0px 3px;
  margin: 0px 26px;
  text-decoration: none;
  font-size: 16px;
  text-transform: uppercase;
  border-bottom: 2px solid #ffffff;
}
.second a:hover, .second .on {
  border-bottom: 2px solid #565a63;
  text-decoration: none;
  color: #565a63;
}
.topnav span {
    color: #3e434b;
    display: none;
}
.topnav .icon {
  display: none;
}

/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 1200px) {
  .topnav a {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
  .topnav span {
    display: none;
}
.second a {
    display: inline-block;
    width: 49%;
    float: left;
    font-size: 13px !important;
    padding: 10px 0 !important;
    margin: 0 !important;
}

.fixedElement {
	 position: static !important;
	 top: inherit !important;
	 width:100%;
	 z-index:100;
	 max-width: 1111px;
}
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 1200px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
} 

 /* Style the buttons that are used to open and close the accordion panel */
.accordion {
  background-color: #eee;
  color: #492f24;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
  font-family: neuzeit-grotesk, sans-serif; 
  font-size: 18px;
  font-weight: 700;
  border-bottom: 1px solid #ffffff;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  background-color: #ccc;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  padding: 20px 18px 0px;
  background-color: white;
  display: none;
  overflow: hidden;
  box-shadow: none;
} 
.accordion:after {
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 17px;
  color: #492f24;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2796"; /* Unicode character for "minus" sign (-) */
}

.no-border {
		border-right: 0px;
	}
.app img {
max-width: 100% !important;	
height: auto;
	}
.app h2 {
    text-transform: none;
    width: 100%;
    display: inline-block;
    margin: 20px 0 -5px;
}
.app {
    min-height: 125px;
    vertical-align: middle;
    display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.app-left {
    float: left;
    width: 125px;
    margin-right: 15px;
}
.app-right {
    width: 300px;
    flex-direction: column;
}
.wide {
    width: 79%;
}
.myBlockBrown .storyType {
    color: #fff;
    background-color: #626f14;
    padding: 10px;
    margin: 0px;
    position: absolute;
    top: 0px;
    font-size: 12px;
    font-size: 90%;
    font-weight: bold;
}
p {
    padding: 10px 0;
}
h1, h2, h3, h4, h5, h6 {

}
h1 {
    font-size: 33px;
    line-height: 40px;
    font-weight: 700;
}
h2 {
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 30px 0 5px;
}
h3 { 
    font-size: 18px;
}
.center-width {
    text-align: center;
    max-width: 80%;
    margin: 0 auto;
}
.large-callout {
	font-size: 20px;
	padding-top: 20px;
	display: inline-block;
}
h1 span {
	font-size: 24px;
font-weight: 400;
text-transform: uppercase;
line-height: 30px;
display: block;
}
.fullGold a, .fullGray a, .fullGold a:link, .fullGray a:link, a, a:hover, div.Faculty.result_b a:hover, div.Faculty.result_b a, div.Faculty.result_a a:hover, div.Faculty.result_a a, .fullGray a:hover, .fullGray a {
    color: #525311;
    text-decoration: underline;
}
a.button {
    display: inline-block;
    background: #ffca11;
    padding: 15px 30px;
    color: #492f24;
    font-size: 14px;
    text-decoration: none;
}
a.button:hover {
    background: #d7ac17;
}
hr {
    border-bottom: 1px solid #c0c2c5;
    margin: 15px 0;
}
ul, td, ol {
    font-family: Verdana,Geneva,sans-serif;
font-size: 12px;
font-size: 90%;
color: #492f24;
}
td {
    padding: 5px;
}
a.button-blue, a.button-blue:hover {
    background: #1f5c7d;
    font-size: 17px;
    padding: 12px 35px;
    margin: 15px 0 10px;
    color: #ffffff;
    display: inline-block;
}
.white-wrapper {
    background: #ffffff;
    padding: 15px 35px;
}
.fullWhite {
    padding-top: 60px;
}
.fullGray {
    padding-top: 60px;
}
.fullGray img {
    max-width: 265px;
    padding: 10px 0 20px;
}
.grey {
    background: #ebebeb;
    padding: 15px 30px;
    margin: 30px 0;
}
.grey h2 {
    text-transform: none !important;
    margin-top: 10px;
}
.myBlockFeature {
    height: auto;
    width: 100%;
    background-color: #ffffff;
    margin-bottom: 15px;
}
.myBlockFeature .img-responsive {
    width: 100%;
}
.myBlockBrown {
    height: 212px;
    width: 265px;
    background-color: #ebebeb;
    margin-bottom: 10px;
}
.myBlockBrown a, .myBlockBrown a:link {
    color: #92952e !important;
    font-weight: bold;
}
.myBlockBrown .storyTitle {
    color: #FFC245;
    width: 240px;
    padding: 0px 10px 10px 0px;
    margin-left: 10px;
    margin-right: 10px;
    position: relative;
    top: 50px;
    font-size: 12px;
    font-size: 90%;
    line-height: 16px;
    border-bottom: 1px solid #d3d1d1;
}
.myBlockBrown p {
    color: #575a62;
    padding: 10px;
    position: relative;
    top: 40px;
}
.storyTitle.small a {

    color: #575a62;
    line-height: 1.1em !important;

}
.small {

    font-size: 128%;
    text-transform: uppercase;
    margin-left: 0px;
    position: relative;
    line-height: 1.3em;

}
.myBlockFeature .storyType {

    color: #fff;
    background-color: #626f14;
    padding: 10px;
    margin: 0px;
    position: absolute;
    top: 0px;
    font-size: 12px;
    font-size: 90%;
    font-weight: bold;

}
.myBlockBrown p {

    color: #575a62;
    padding: 10px;
    position: relative;
    top: 40px;

}
 @media only screen and (max-width: 1200px){
    .topnav a {
  padding: 14px 20px;
  font-size: 15px;
} 
 }
 @media only screen and (max-width: 640px){

    .Hide {
        display: none;
    }
    .msthd {
    margin-bottom: -24px;
    top: -30px !important;
}
.fullWhite:first-child {
    padding-top: 20px;
}
 }