/* CSS for new landing pages */

/* Font faces (from style2.css) */
@font-face {
    font-family: 'Lato-Bold';
    src: url('/css/fonts/Lato-Bold.eot');
    src: url('/css/fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/Lato-Bold.woff') format('woff'),
         url('/css/fonts/Lato-Bold.ttf') format('truetype'),
         url('/css/fonts/Lato-Bold.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'Lato-Regular';
    src: url('/css/fonts/Lato-Regular.eot');
    src: url('/css/fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/Lato-Regular.woff') format('woff'),
         url('/css/fonts/Lato-Regular.ttf') format('truetype'),
         url('/css/fonts/Lato-Regular.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'Lato-Black';
    src: url('/css/fonts/Lato-Black.eot');
    src: url('/css/fonts/Lato-Black.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/Lato-Black.woff') format('woff'),
         url('/css/fonts/Lato-Black.ttf') format('truetype'),
         url('/css/fonts/Lato-Black.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'Lato-Hairline';
    src: url('/css/fonts/Lato-Hairline.eot');
    src: url('/css/fonts/Lato-Hairline.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/Lato-Hairline.woff') format('woff'),
         url('/css/fonts/Lato-Hairline.ttf') format('truetype'),
         url('/css/fonts/Lato-Hairline.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* TODO: page responsiveness to size changes, mobile, etc. */


body {
    margin: 0px;
    color: #333333;
	font-size: 16px;
	font-family: 'Lato-Regular','Arial', sans-serif;
    background-color: white;
    min-width: 700px;
}

#navbar {
    width: 100%;
    display: flex;
    flex-flow: row nowrap;
    height: 80px;
}
#navbar .container {
    margin: auto;
}
#navbar-logo {
    width: 240px;
    height: 21px
}

#title-container #page-header,
#title-container #page-byline {
    margin-left: 15%;
    margin-right: 15%;
    text-align: center;
}
#title-container {
    width: 100%;
    height: 425px;
    display: flex;
    flex-flow: column nowrap;
    background-size: cover;
}
.page-header-container {
    display: flex;
    flex-flow: column nowrap;
    height: 55%;
}
#page-header {
    font-size: 36px;
    margin-top: auto;
    margin-bottom: 0;
    color: white;
}
.page-byline-container {
    display: flex;
    flex-flow: column nowrap;
    height: 45%;
}
#page-byline {
    font-weight: normal;
    font-size: 14px;
    color: lightgray;
    margin-bottom: auto;
    margin-top: auto;
}

#content-container {
    width: 100%;
    display: flex;
    flex-flow: row nowrap;
    margin-top: 15px;
}
#content-container .left-margin-area {
    width: 15%;
}
#content-container .center-content-area {
    width: 50%;
    display: flex;
    flex-flow: column nowrap;
}
#content-container .center-content-area p {
    line-height: 1.4em;
}
#content-container .center-content-area li {
    margin-bottom: 10px
}
#content-container .center-content-area img {
    max-width: 100%;
}
#content-container .right-margin-area {
    width: 35%;
}
.cta-content p,
.right-margin-box-content p {
    font-size: 1.1em;
    line-height: 1.4em;
}
.subheader {
    margin-top: 16px;
    margin-bottom: 0px;
}

.lato-bold {
    font-family: "Lato-Bold", "Arial", sans-serif;
}
.blockquote-area {
    font-weight: bold;
    font-size: 1.5em;
    line-height: 1.7em;
    margin-top: 1em;
    margin-bottom: 1em;
}
.blockquote-area::before,
.blockquote-area::after {
    content: '';
    display: block;
    width: 25%;
    margin: 0 auto;
    height: 1px;
    border-bottom: 1px solid gray;
}

.summary-container,
.cta-container,
.right-margin-box-container {
    border: 1px solid #eaeaea;
    border-radius: 2px;
    background-color: #FAFAFA;
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    flex-flow: column nowrap;
}
.summary-title,
.right-margin-box-title {
    font-size: 1.2em;
}

.right-margin-box-title,
.right-margin-box-content {
    line-height: 1.4em;
}

.summary-container {
    font-size: 1em;
    line-height: 1.5em;
    color: #444;
}
.summary-title {
    font-weight: bold;
}

.cta-container,
.right-margin-box-container {
    background-color: #FAFAFA;
}
.cta-container {
    margin-bottom: 60px !important;
}
.cta-btn-container-form {
    width: 100%;
    display: flex;
}
.cta-btn-container-form + .cta-btn-container-form {
    margin-top: 15px;
}
.cta-btn {
    border-style: none;
    color: #ffffff;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    font-size: 1em;
    font-weight: bold;
    height: 3em;
    width: 250px;
    background-color: #e02d2d;
    cursor: pointer;
    padding-left: 10px;
    padding-right: 10px;
    text-decoration: none;
}

.cta-button-inner-text {
    margin: auto;
    text-align: center;
}

.right-margin-box-container {
    min-width: 225px;
    max-width: 350px;
    margin: 16px 70px 16px 25px;

    position: -webkit-sticky;
    position: sticky;
    top: 16px;
}

#footer-section-container {
    display: flex;
    flex-flow: column nowrap;
    background-color: #F7F7F7;
}
.top-footer-link .container {
    display: flex;
}
.top-footer-link .container .row {
    display: flex;
    flex-flow: row nowrap;
    margin-left: auto;
    margin-right: auto;
}

/*--------------------footer-link--------------------*/
/* Mostly from style2.css */
.footer {
	color: #bdbdbd;
	font-size: 12px;
	font-family: 'Lato-Regular';
	padding-top: 30px;
	padding-bottom: 30px;
	background-color: #F7F7F7;
}

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

.faq-footer{
	position: absolute;
	height: 104px;
}

.footer a {
	color: #bdbdbd;
    text-decoration: underline;
}

.privacy-container{
	text-align: center;
}

/* Mostly from homepage.css */
.top-footer-link  {
	padding-top: 45px;
	padding-bottom: 15px;
}
.top-footer-link h4 {
	color: #9B9B9B;
	font-size: 14px;
	font-family: 'Lato-Regular';
}
.top-footer-link h5 {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 500;
}
.top-footer-link ul {
	padding-left: 0;
}
.top-footer-link li {
	list-style-type: none;
}
.top-footer-link a {
	font-size: 12px;
	font-family: 'Lato-Regular';
	color: #4a4a4a;
    line-height: 24px;
    text-decoration: none;
}
.top-footer-link .container {
    line-height: 1.1
}
.top-footer-link .container,
.footer .container {
    max-width: 800px;
    padding-right: 15px;
    padding-left: 15px;
    margin-left: auto;
    margin-right: auto;
}
.social-icon a {
	background: url("/images/social-icon.png") no-repeat scroll -1px 0 rgba(0, 0, 0, 0);
    display: block;
    height: 25px;
    margin: 5px 0;
    padding-left: 32px;
    line-height: 25px;
}
.linkedin {
	background-position: 3px -54px !important;
}
.fb {
	background-position: 7px -115px !important;
}
.contact-us {
	background: url("/img/envelope.png") no-repeat !important;
	background-position: 3px 3px !important;
}
.col-xs-6.col-sm-3 {
    padding-right: 15px;
    padding-left: 15px;
}
.col-xs-6.col-sm-3.fit-right {
    padding-left: 75px;
}