/**
 * This file should get overwritten if Method 1 is used. If Method 2 is chosen,
 * remove this comment and start adding your styles to this file.
 */


html, body {
	min-height: 100%;
	height: 100%;
	background-color: #fdf8e2;
	font-family: "kepler-std",serif;
	font-weight: 400;
	font-size: 18px;
	width: 100%;

}

body {
	overflow-x: hidden;
}

 /* Wrapper for page content to push down footer */
#wrap {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	padding-bottom: 10px;
    /* Negative indent footer by it's height */
    margin: 0 auto -130px;
}

/* Set the fixed height of the footer here */
#push,
#footer {
	height: 130px;
}

.main
{
	padding-top: 50px;
	margin-top: 10px;
}

.navbar {
	background-color: #df5426;
}

.masthead {
	font-family: "adelle-sans",sans-serif !important; 
	font-weight: 800;
	font-size: 28px;
	color: #fdf8e2 !important;
}

.masthead a {
	color: #fdf8e2; text-decoration: none;
}

.navbar-nav > li {
	font-family: "adelle-sans",sans-serif !important;
	font-weight: 400 !important;
	font-size: 14px !important; 
	padding-top: 7px !important;
}

.navbar-nav > li > a {color: #fdf8e2 !important; text-decoration: none !important; }
.navbar-nav > li > a:hover {color: #fdf8e2 !important; border-bottom:1px solid #fdf8e2 !important;}

.navbar-nav > li {
  padding-left:30px;
}

.navbar-default .navbar-nav .open .dropdown-menu>li>a, .navbar-default .navbar-nav .open .dropdown-menu {
    background-color: #5E2310;
    color:#fdf8e2;
    padding-left: -30px;
    padding-right: -30px;
}


.navbar-nav > li > a {padding-top:5px !important; padding-bottom:5px !important;}
.navbar {min-height:50px !important}

#footer {
	padding: 10px 0px 10px 0px;
	color: white;
	border-top: black 1px solid;
 	margin-top: 10px;
}

.footer-presented {
	font-family: "kepler-std",serif;
	color: black;
	font-size: 18px;
	font-weight: 500;
	font-style: italic;
}

.footer-nav {
	font-family: "adelle-sans",sans-serif !important;
	font-weight: 400 !important;
	font-size: 15px !important; 
	padding-top: 7px !important;
}

#footer-socialmedia {
	text-align: right;
}

#footer-socialmedia a {color: white;}
#footer-socialmedia a:link {color: white;}
#footer-socialmedia a:hover {color: white;}
#footer-socialmedia a:active {color: white;}
#footer-socialmedia a:visited {color: white;}

.footer-nav > a {color: #fdf8e2 !important; text-decoration: none !important; }
.footer-nav > a:hover {color: #fdf8e2 !important; border-bottom:1px solid #fdf8e2 !important;}


/*** FRONT PAGE ***/

.banner
{
	background-image:url('https://firstdaysproject.s3.amazonaws.com/static/images/fdp-banner.png');
	height: 406px;
	background-size: cover;
	color: black;
	width: 100%;
	position: relative;
}

.banner-header
{
	font-family: "kepler-std",serif;
	font-size: 48px;
	font-weight: 800;
	font-style: italic;
}

.banner-subheader
{
	font-family: "kepler-std",serif;
	font-size: 24px;
	font-weight: 500;
	font-style: italic;
}


#fdp-frontpage-search .form-item-keys-1
{
	display: inline;
}

#fdp-frontpage-search .form-control
{
	display: inline;
	font-size: 16px;
	width: 98%;
	height: 36px;
	border-radius: 20px;
}

#fdp-frontpage-search .btn-primary
{
	height: 36px;
	border-radius: 20px;
}


.carousel
{
	background: none;
}

.carousel-control {
	visibility: hidden;
}

.carousel.fade {
  opacity: 1;
}

.carousel.fade .item {
  -moz-transition: opacity ease-in-out 1.4s;
  -o-transition: opacity ease-in-out 1.4s;
  -webkit-transition: opacity ease-in-out 1.4s;
  transition: opacity ease-in-out 1.4s;
  left: 0 !important;
  opacity: 0;
  top:0;
  position:absolute;
  width: 100%;
  display:block !important;
  z-index:1;
}

.carousel.fade .item:first-child {
  top:auto;
  position:relative;
}

.carousel.fade .item.active {
  opacity: 1;
  -moz-transition: opacity ease-in-out 1.4s;
  -o-transition: opacity ease-in-out 1.4s;
  -webkit-transition: opacity ease-in-out 1.4s;
  transition: opacity ease-in-out 1.4s;
  z-index:2;
}


.featured-story
{
	height: 65px;
	width: 100%;
	/* add following */
    background-size:cover;
    background-position:50% 50%;
}

.timeline-container {
	text-align: center !important;
	height: 175px;
}

.canvasjs-chart-credit {
	visibility: hidden;
}

.vertical-align {
    display: flex;
    align-items: center;
}

.horizontal-align {
	text-align: center;
}

.featured-browse-container {
	border-top: solid #ccc 1px;
	padding-top: 10px;
	margin-bottom: 7px;
}

.featured-browse {
	height: 150px;
	margin: 0px 10px 0px 10px;
	text-align: center;
}

.featured-browse-tabs {
	height: 150px;
	margin: 0px 10px 0px 10px;
}

.featured-browse-title {
	display: block;
	font-family: "adelle-sans",sans-serif;
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 0.07em;
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-bottom: 1px solid #ccc;
}

.featured-browse-title:link {text-decoration: none; color: black;}
.featured-browse-title:visited {text-decoration: none; color: black;}
.featured-browse-title:hover {text-decoration: none; color: black;}


.featured-browse-map {
	display: block;
	background: transparent url('https://firstdaysproject.s3.amazonaws.com/static/images/map.png') center top no-repeat;
	background-size: contain;
	height: 125px;
}

.featured-browse-map:hover {
	background-image: url('https://firstdaysproject.s3.amazonaws.com/static/images/mapHover.png');
}

.featured-browse-gallery {
	display: block;
	background: transparent url('https://firstdaysproject.s3.amazonaws.com/static/images/gallery.png') center top no-repeat;
	background-size: contain;
	height: 125px;
}

.featured-browse-gallery:hover {
	background-image: url('https://firstdaysproject.s3.amazonaws.com/static/images/galleryHover.png');
}

.featured-browse-random {
	display: block;
	background: transparent url('https://firstdaysproject.s3.amazonaws.com/static/images/random.png') center top no-repeat;
	background-size: contain;
	height: 125px;
}

.featured-browse-random:hover {
	background-image: url('https://firstdaysproject.s3.amazonaws.com/static/images/randomHover.png');
}



.featured-browse-header {
	font-family: "adelle-sans",sans-serif;
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 0.07em;
}

.recent-stories-container {
	margin-bottom: 10px;

}

.recent-stories-date {
	height:50px !important;
	width: 50px !important;
	float: left;
	border-radius:50px;
	font-size:20px;
	color:#fff;
	line-height:50px;
	text-align:center;
	background:#000;
	font-family: "kepler-std",serif;
	font-size: 16px;
	font-weight: 700;
	font-style: italic;

}

.recent-stories-date:link {text-decoration: none; color: white;}
.recent-stories-date:hover {text-decoration: none; color: white;}
.recent-stories-date:visited {text-decoration: none; color: white;}


.recent-stories-description {
	margin-left: 66px;
}

.recent-stories-title {
	font-family: "kepler-std",serif;
	font-size: 16px;
	font-weight: 700;
	font-style: italic;
}

.recent-stories-text {
	font-family: "adelle-sans",sans-serif;
	font-weight: 400;
	font-size: 13px;
	letter-spacing: 0.07em;
}


/**** Modal ***/

#email-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
}

#email-modal .underlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0,0,0,0.5);
  cursor: pointer;
  -webkit-animation: fadein 0.5s;
  animation: fadein 0.5s;
}
#email-modal .email-modal {
  width: 600px;
  height: 400px;
  background: url('https://firstdaysproject.s3.amazonaws.com/static/images/exit-modal.png');
  background-size: cover;
  position: absolute;
  margin: auto;
  padding: 10px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-animation: popin 0.3s;
  animation: popin 0.3s;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
}

#email-modal .e-title {
	text-align: center;
	color: black;
}

#email-modal .modal-body {
	text-align: center;
	padding-top: 60px;


}

#email-modal .modal-footer {
  position: absolute;
  padding: 0px;
  padding-top: 5px;
  padding-bottom: 5px;
  bottom: 0px;
  text-align: center;
  margin: 0px;
  cursor: pointer;
  color: white;
  background: none;
  width: 580px;
	font-family: "adelle-sans",sans-serif !important;
	font-weight: 400 !important;
	font-size: 14px !important; 
}


#email-modal input {
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	font-family: "adelle-sans",sans-serif !important;

}


/*** FORMS & BUTTONS ***/

input,
button,
select,
textarea {
	font-family: "proxima-nova-alt", Arial, sans-serif;
}

.input-small {
  margin-top:0px;
}

.radio {
padding-right:20px;
}

form input#mce-FNAME {
	width: 85px; height: 13px; padding: 7px; border: 1px solid #ccc; color: #888; margin-right: 0px; margin: 4px;
	-webkit-appearance: none;
}

form input#mce-LNAME {
	width: 85px; height: 13px; padding: 7px; border: 1px solid #ccc; color: #888; margin: 4px; -webkit-appearance: none;	
}

form input#mce-EMAIL {
	width: 150px; height: 13px; padding: 7px; border: 1px solid #ccc; color: #888; margin: 4px; margin-top: 20px; margin-bottom: 10px; -webkit-appearance: none;
}



.btn-gray {
  display: inline-block;
  *display: inline;
  padding: 4px 12px;
  margin-bottom: 0;
  *margin-left: .3em;
  font-size: 14px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-color: #828282;
  border: 1px solid #cccccc;
   -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.btn-gray:hover,
.btn-gray:focus,
.btn-gray:active {
	background-color:#aaaaaa;
}



/*** Webforms ***/

#node-612 .submitted {visibility: hidden;}

.webform-k12-name-wrapper {margin-bottom: 20px;}
.webform-k12-name {width: 350px;}

.webform-k12-email-wrapper {margin-bottom: 20px;}
.webform-k12-email {width: 350px;}

.webform-k12-phone-wrapper {margin-bottom: 20px;}
.webform-k12-phone {width: 350px;}

.webform-k12-schoolname-wrapper {margin-bottom: 20px;}
.webform-k12-schoolname {width: 350px;}

.webform-k12-schoollocation-wrapper {margin-bottom: 20px;}
.webform-k12-schoollocation {width: 350px;}

.webform-k12-gradestaught-wrapper {margin-bottom: 20px;}
.webform-k12-gradestaught {width: 350px;}

.webform-k12-subjectstaught-wrapper {margin-bottom: 20px;}
.webform-k12-subjectstaught {width: 350px;}

.webform-k12-stories-wrapper {margin-bottom: 20px;}
.webform-k12-interviews-wrapper {margin-bottom: 20px;}
.webform-k12-comments-wrapper {margin-bottom: 20px;}


.webform-reporter-name-wrapper {margin-bottom: 20px;}
.webform-reporter-name {width: 350px;}

.webform-reporter-email-wrapper {margin-bottom: 20px;}
.webform-reporter-email {width: 350px;}

label[for=edit-submitted-email]
{
	display: block;
}

#edit-submitted-email {

    display: block;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555;
    vertical-align: middle;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.webform-reporter-phone-wrapper {margin-bottom: 20px;}
.webform-reporter-phone {width: 350px;}

.webform-reporter-location-wrapper {margin-bottom: 20px;}
.webform-reporter-location {width: 350px;}

.webform-reporter-photo-wrapper {margin-bottom: 20px;}
.webform-reporter-photo {width: 350px;}

#edit-submitted-photo-upload-button {visibility: hidden;}


.webform-reporter-bio-wrapper {margin-bottom: 20px;}
.webform-reporter-interest-wrapper {margin-bottom: 20px;}
.webform-reporter-experience-wrapper {margin-bottom: 20px;}



/*** MediaElement.js ***/

audio, canvas, video {max-width:90%;}

/*** End MediaElement.js ***/


@media (max-width: 768px) {

#wrap { 
	
}

.banner {
	height: 100%;
	padding-bottom: 20px;
}

.btn-lg {
	width: 100%;
}

#fdp-frontpage-search .form-control
{
	width: 95%;
}

#fdp-frontpage-search #edit-submit-1
{
	width: 15%;
}


#footer {
	margin-top: 0px;
	padding: 10px;
	text-align: center;
	min-height: 100px;
	overflow: visible;
}

#footer-saada {padding-top: 7px;}
#footer-saada img {width: 200px;}
.footer-presented {font-size: 16px;}

#footer-socialmedia {
	text-align: center;
}

.fdp-sidebar {
	text-align: center;
	margin-bottom: 20px;
}

.more-story {
	margin-bottom: 20px;
	height: 350px !important;
}