/* @import url('http://example.com/example_style.css'); */
@import url('https://fonts.googleapis.com/css?family=Palanquin:300,400,500,700&subset=latin-ext'); 
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500');

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/**********************************************
 * Custom Override CSS for the Sodium Template
 * Debra Jensen 2019
 *********************************************/

/*********************************************
 * Navbar overrides
 ********************************************/
header.header #menu ul li.hs-menu-depth-1:last-child a {
	display: inline-block;
    background-color: #ef6923;
    border: 2px solid #ef6923;
    color: #FFFFFF;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    -moz-transition: all .3s linear;
    transition: all .3s linear;
    line-height: 40px;
    padding: 0px 10px;
}

header.header #menu ul li.hs-menu-depth-1:last-child {
    line-height: 40px;
    top: 12px;
}

header.header #menu ul li.hs-menu-depth-1:last-child a:hover {
background-color: #FFFFFF;
    border: 2px solid #ef6923;
    color: #ef6923;
    -webkit-appearance: none;
}

.footer-container-wrapper .footer ul li {
  float: none;
  display: inline-block;
}
/* Expand navigation bar to 90% width on devices > 1500px*/
header .container {
    max-width: 90%;
}
/* Expand navigation bar to 100% width devices <= 1500px
 * This gets overriden once then menu collapses at 1055px */
@media only screen and (max-width: 1500px){
  header .container {
    max-width: 100%;
  }
}

@media only screen and (max-width: 1250px) and (min-width: 1200px){
    header.header #menu ul li.hs-menu-depth-1 a {
        font-size: 15px;
    }
}

@media only screen and (max-width: 1199px) and (min-width: 1055px){
  header.header #menu ul li.hs-menu-depth-1 a {
      padding: 0 8px;
      font-size: 14px;
  }
}
/*********************************************
 * Footer overrides
 ********************************************/
section.footer-info h3 {
	margin: 20px 0px 5px 0px;
}
section.footer-info h3:first-child {
	margin: 30px 0px 30px 0px;
}
@media only screen and (max-width: 767px){
  section.footer-info .span4:not(.ignoreMobileBottomSpacing){
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 900px) and (min-width: 768px){
  .social-footer .text .hs_cos_wrapper_type_text {
    font-size: 20px;
  }
  section.footer-info a:not(.cta_button){
    font-size: 16px;
  }
}
/*******************************************
 * Testimonials slick override 
 ******************************************/
.testimonials-quotes {
  /*min-height: 595px;*/
  min-height: 625px;
}  

.testimonials-quotes .slick-testimonial-quotes .slick-track .hs_cos_wrapper .testimonial-box .person {
    margin-top: 30px;
    padding: 0 40px; /*changes padding from 90 to 60px for names and titles */
}

.testimonials-quotes .slick-testimonial-quotes .slick-track .hs_cos_wrapper .testimonial-box .testimonial-quote:before {
  font-family: 'Palanquin'; 
}

.testimonials-quotes .logo-test .slick-track .hs_cos_wrapper .testimonial-box img {
    height: 86px;
    width: 86px;
}

@media only screen and (min-width:1024px) {
  .testimonials-quotes .slick-testimonial-quotes .slick-track {
    height: 460px;
  }
}



/*******************************************
 * Client Logos Carousel
 ******************************************/
.client-logos-wrapper {
  padding-top: 30px;
  padding-bottom: 30px;
  background:#f7f7f7;
  width: 100%;
}

.logo-slick-track {
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 80%;
}

@media only screen and (max-width:1024px){
  .logo-slick-track {
    width: 100%;
  }
  .hs-logo-carousel__inner {
    padding: 10px 20px;
  }
}

.client-logos-wrapper .slick-dots li button:before {
  font-size: 10px;
}

/******************************************
 * Header & Text styling
 *****************************************/
.h2-center-override {
  text-align: center; /*Overrides the left alignment in the sodium template*/
  text-transform: none;
  font-weight: 300;
}

.lowercase {
    text-transform: lowercase;
}

/*Override span styling and reset to normal blog header styling */
span.blog-white-text {
    color: #fff !important;
    font-weight: 200 !important;
}

.small-header-for-blog h1 .subtitle {
    color: white;
    font-size: 32px;
    font-weight: 300;
}

.shift-company-culture .hero-banner .hero-banner-wrap h2 {
  text-transform: none;
}

.left-align-override h2 {
  text-align: left;
}

.right-align-override h2 {
  text-align: right;
}

/*Overrides the text color to be white*/
.white-text h2, .white-text p {
  color: white;
}

.results-section h2, .results-section p {
  color: white;
}

.orange-text h1, .orange-text h2, .orange-text h3, .orange-text h4, .orange-text h5, .orange-text p, .orange-text span {
  color: #ea6c0f;
}

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

.content-md {
  font-family: 'Montserrat';
  font-weight: 500;
}

.content-str {
  font-family: 'Montserrat';
  font-weight: 600;
}

.content-lg-orange {
  font-size: 24px;
  color: #ea6c0f;
  font-weight: bold;
}

.intro-section-vertical-padding {
  padding: 5% 0;
}

@media only screen and (max-width: 767px) {
  .rs-center-txt-mobile{
    text-align: center;
  }
}
/****************************************************
 * Blog Landing Page fixes.  
 * **************************************************/
/*Adjust Blog Comments section to look better */
.sodium-blog div.hs-fieldtype-text {
	margin-top: 10px;
}
.sodium-blog span.hs-form-required{
	color: #ef6923;
	font-weight: 500;
}
.sodium-blog .hs-error-msgs label{
	color: #ef6923;
	font-weight: 500;
	font-size: 11pt;
}
.sodium-blog div.grecaptcha-badge,
.sodium-blog input.cta-primary{
	margin-top: 10px;
	margin-bottom: 10px;
}
.sodium-blog form.hs-form{
	margin-top: 15px;
	margin-bottom: 15px;
}

/*Make blog author's name bolder.*/
.sodium-blog .single-post-details span{
  font-weight: 400;
}

/*Re-align checkmark bullet to first line of text*/
.sodium-blog .blog-section .post-body .hs_cos_wrapper_type_rich_text ul li:before, .hs_cos_wrapper_type_rich_text ul li:before
{
  top: 0.6em;
}


/*Remove checkmark bullet on blog and policy pages*/
.sodium-blog .blog-section .post-body ul li:before {
  content: none;
}
.sodium-blog .blog-section .post-body ul {
  list-style: disc;
}

.privacy .hs_cos_wrapper_type_rich_text ul li:before{
  content:none;
}

.privacy ul {
    list-style: disc;
}

.sodium-blog .single-post-details p{
  margin: 20px 0px;
}



/*Remove Number List Styling*/
.sodium-blog .blog-section .post-body ol li:before{
    color: #000000;
    content: counter(li)'.';
    top: 0%;
    font-size: 16px;
 -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
    vertical-align: middle;
    height: 32px;
    font-weight: 900;
}
.sodium-blog .blog-section .post-body ol li {
    margin-bottom: 12px; 
}
/*Make "Subscribe to Blog" button fit the screen properly at various sizes. */
@media only screen and (max-width:400px), only screen and (min-width:768px) {
  .sodium-blog .side-bar-blog form .hs_submit input{
    width: 100%;
    padding: 5px;
    white-space: normal;
  }
}


/*Make Recent Blog Posts have a more fitting max-width for our photos*/
@media only screen and (max-width:1099px) {
  .sodium-blog .recent-post{
    max-width: 460px;
  }
}

/* CTA Buttons button color fixes. */
.sodium-blog .blog-section a.cta-primary {
	color: #ffffff;
}
  
.sodium-blog .blog-section a.cta-primary:hover {
	color: #ef6923;
}


/*Blog page mobile device fixes */
@media only screen and (max-width:1024px)
{
  .hs-blog-post .small-header-for-blog h1 {
       font-size: 38px;
  }
  .small-header-for-blog h1 .subtitle {
        font-size: 28px;
  }
  .side-bar-blog .hs_recaptcha {
      transform:scale(0.77);
      -webkit-transform:scale(0.77);
      transform-origin:0 ;
      -webkit-transform-origin:0;
	}

}
@media only screen and (max-width:1000px) {
  /* Center all images on small devices */
  .sodium-blog .blog-section img {
    display: block;
    max-width: 100%;
    margin: 0px auto 25px auto !important;
    float: none !important;
  }
}
@media only screen and (max-width:850px) {
   .side-bar-blog .hs_recaptcha {
    transform:scale(0.70);
    -webkit-transform:scale(0.70);
    transform-origin:0 ;
    -webkit-transform-origin:0;
	} 

}
@media only screen and (max-width:767px) {
  .hs-blog-post .small-header-for-blog h1 {
    bottom: 150px;
    font-size: 30px;
  }
  .small-header-for-blog h1 .subtitle {
        font-size:22px;
  }
  .small-header-for-blog h1 {
    	line-height: 1.0;
  }
  .sodium-blog .blog-section{
    margin: 0px;
    padding: 0px;
  }
  .sodium-blog.hs-blog-post .social-blog{
    width: 100%;
    height: auto;
    position: initial;
    transform: none;
  }
  .sodium-blog.hs-blog-post .social-blog .social-list{
    width: 100%;
    height: auto;
    position: initial;
    margin: 18px 0px;
  }
  .sodium-blog.hs-blog-post .social-blog .hide-arrow{
    display: none;
  }
  .sodium-blog.hs-blog-post .social-blog .social-list ul{
    display: flex;
    flex-direction: row;
    width: 100%;
    height: auto;
    justify-content: center;
  }
  .sodium-blog.hs-blog-post .social-blog .social-list ul li{
    margin: 0px 3px;
  }
  .sodium-blog .section.post-header{
    margin: 0px;
  }
  .sodium-blog .section.post-body{
    text-align: left;
  }
  .sodium-blog .single-post-details p{
    font-size: 0.9em;
  }
  .sodium-blog .single-post-details span{
    display: block;
    padding-bottom: 10px;
    font-size: 1.25em;
  }
  .side-bar-blog .hs_recaptcha {
    transform:scale(1);
    -webkit-transform:scale(1);
    transform-origin:0 ;
    -webkit-transform-origin:0;
  }
}

/*Blog Subscription Landing Page*/

.blog-subscribe-form .widget-type-form form input {
  border-bottom: solid 1px #ef6923;
  color: #2d2d2d;
}

.blog-subscribe-form .widget-type-form .hs-form-field {
	margin-top: 20px;
  padding-right: 40px;
}

.blog-subscribe-form .widget-type-form form input.primary {
  color:#ffffff;
}

.blog-subscribe-form .widget-type-form form input.primary:hover {
  color:#ef6923;
}

@media only screen and (max-width: 767px) {
  .thank-you-page .blog-subscribe-form .widget-type-form form input.primary {
    max-width: 90%;
    padding: 21px 40px;
  }
  .blog-subscribe-form .widget-type-form .hs-form-field {
    padding-right: 10px;
  }

}

/******************************************
 * Feature Box styling
 *****************************************/
.features{
  margin-bottom: 50px;
}

.features .row {
  display: flex;
}

@media only screen and (max-width: 767px) {
  .features .row {
    display: block;
  }
}
.homepage .features{
  margin-bottom: 80px;
}

@media only screen and (max-width: 1000px) {
  .product-spacing.homepage .features h2{
    margin-bottom: 0px;
  }
  .product-spacing.homepage .about-me_skills .text-block .text-block-content{
	  text-align: center;
  }
}

#main_section.featured-box-container{
  padding-bottom: 0px;
}

/************************************************************
 * Cognition Feature Page Styling Overrides
 * Used on Talent Management and Performance Management Features
 * Denoted with the cognition-features class
 ***********************************************************/
.homepage.cognition-features .features {
  margin-bottom: 35px;
}

.homepage.cognition-features li {
  font-size: 16px;
}

.homepage.cognition-features ul {
    padding-left: 20px;
}

.homepage.cognition-features .section-summary {
    text-align: center;
    max-width: 920px;
    margin-left: auto !important;
    margin-right: auto;
}

.prog-dev .text-and-image-overflow .container-fluid .text-wrapper .text-content h2 {
  font-size:34px;
}

@media only screen and (max-width: 768px){ 
  .homepage.cognition-features .feature-subheader {
    text-align: center;
}
}

@media only screen and (max-width: 500px){ 
     .homepage.pm-features.product-spacing .text-and-image-overflow .container-fluid .text-wrapper .text-content h2 {
     font-size: 38px;
  }
}
/************************************************************
 * Full Color Image Blocks
 * This element is used on the RS Media Services page
 * The CSS here modifies the image alignment and padding for 
 * the container class used by the Sodium template
 * **********************************************************/
.img-center img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.full-color-block .container {
  padding-right: 0px;
  padding-left: 0px;
  
}

.full-color-block .product-single .lead-section {
  padding-top: 100px;
  padding-bottom: 100px;
}

@media only screen and (max-width: 768px) {
  .lead-section.iphone-section div.img-center{
    width: 100%;
  }
  
  .img-center img {
    width: 500px !important;
    max-width: 100%;
  }

  .lead-section.iphone-section div.lead-section__content{
    margin-left: 0px;
  }
}

/*****************************************
 * Promo Video
 ****************************************/

.promo-video iframe {
    max-width: 100%;
    max-height: 100%;
    min-height: 360px;
}

.vidyard-cta-holder {
  background: #313131bf !important;
}
/****************************************
 * Lead Section Color Overrides
 ***************************************/
section.orange.lead-section.iphone-section.flex-wrapper {
  background: #ef6923;
}

.blue-row {
  background: #1c7cb6;
  color: #fff;
}

.orange-row {
  background: #ef6923;
  color: #fff;
}

.gray-row {
  background: #f2f2f2;
}

section.lead-section.client-header-row.orange-row{
   padding-top: 10px;
   text-align: center;
   padding-bottom: 10px; 
}

.orange-row h1, .orange-row h2, .orange-row h3, .orange-row h4, .orange-row .txt-cta-separator .separator-content h3,
.blue-row h1, .blue-row h2, .blue-row h3, .blue-row h4, .blue-row .txt-cta-separator .separator-content h3 {
  color: #fff;
}



/******************************************
 *  Txt and Img Overflow Component
 *  Add padding to module when body class 
 *  is added to template
 *****************************************/
.text-and-image-overflow .container-fluid .image-wrapper img {
	padding: 15px;
}
.product-spacing .text-and-image-overflow {
    padding-bottom: 30px;
}
.product-spacing .text-and-image-overflow .container-fluid .text-wrapper .text-content h2{
  margin-top: 20px;
}

@media only screen and (max-width: 767px) {
  .product-spacing .text-and-image-overflow {
    padding-bottom: 0px;
  }
  .text-wrapper {
    order:2;
  }
  div.text-and-image-overflow-cta-button {
    float: none !important;
    width: 170px;
    margin: auto;
  }
}

@media only screen and (max-width: 1000px) {
  .product-spacing .text-and-image-overflow .container-fluid .text-wrapper .text-content h2{
    margin-top: 0px;
  }
  .rs-stack-on-tablet .container-fluid {
    display: flex;
    flex-direction: column;
  }
  .rs-stack-on-tablet .text-wrapper {
    order:2;
  }
  .rs-stack-on-tablet .text-and-image-overflow .container-fluid .text-wrapper h2{
    text-align: center;
  }
  .rs-stack-on-tablet .text-and-image-overflow .container-fluid .text-wrapper, 
  .rs-stack-on-tablet .text-and-image-overflow .container-fluid .image-wrapper {
    width: 100%;
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-bottom: 0px;
  }
  .rs-stack-on-tablet .text-and-image-overflow .container-fluid .text-wrapper .text-content{
    max-width: 1000px;
  }
  .rs-stack-on-tablet .text-and-image-overflow .container-fluid .image-wrapper img{
    float: none !important;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
  .rs-stack-on-tablet div.text-and-image-overflow-cta-button {
    float: none !important;
    width: 170px;
    margin: auto;
  }
}

/******************************************
 *  Text Image Block Overrides
 *****************************************/
.about-me-rs-custom > span > div:nth-child(2) .image-container {
  background-position: 77% 50%;
}

@media only screen and (min-width: 992px) {
   .rs .about-me_skills
  {
    min-height: 400px;
  }
}

@media only screen and (max-width: 992px) {
  .about-me-rs-custom > span > div:nth-child(1) .image-container {
    background-position: 88% 50%;
  }
}

/*****************************************
 * Landing Page Overrides
 * **************************************/
.landing-page-v1 .box-white-bg .square-box .icon i {
  text-align: center; /*fixes alignment of fontawesome icons*/
}

/*****************************************
 * Preventing Harassment Page Overrides
 * **************************************/
@media only screen and (max-width: 1000px) {
  .rs-ph-cta-separator{
    text-align: center;
  }
}

/*****************************************
 * Instructor Support Materials Page Overrides
 * **************************************/
@media only screen and (max-width:768px){
  .rs-ism-color-block .row-fluid {
    display: -webkit-flex;
    display: flex;
    flex-direction: column-reverse;
  }
  
  .rs-ism-color-block .row-fluid .img-center{
    order: 1;
  }
}
/*****************************************
 * Home Page Overrides
 * **************************************/

.home-page-cta .txt-cta-separator div.separator-content {
  -webkit-justify-content: space-evenly;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-evenly;
}

/*****************************************
 * Cognition Page Overrides
 * **************************************/
@media only screen and (max-width:1000px){
  .cognition-home-color-block .row-fluid {
    display: -webkit-flex;
    display: flex;
    flex-direction: column-reverse;
  }
  
  .cognition-home-color-block .row-fluid .img-center{
    order: 1;
  }
}

#cognition-home-intro {
  text-align: left;
}
@media only screen and (max-width:767px){
  #cognition-home-intro {
    text-align: center;
  }
  div#cognition-home-logo {
    text-align: center;
  }
  div#cognition-home-logo img{
    width: 100% !important;
    max-width: 450px;
  }
}

/*****************************************
 * Cognition LMS Page Overrides
 * **************************************/
.tall-screen .cell-wrapper
{
  max-height: 1000px;
  overflow-y: hidden;
}

div.cta-40{
  margin-top: 40px;
}

div.cta-40 a.cta_button{
  width: 40%;
}

/*****************************************
 * Contact Us Page Overrides
 * **************************************/

section.contact-banner-v2 .mask, section.contact-banner-v2 .separator--contact__mask {
  background: rgba(0, 0, 0, 0);
}

section.contact-banner-v2 {
 background-position: right; 
}

section.contact-banner-v2 .container .span12 {
    background: rgba(0, 0, 0, 0.65);
}

section.contact-banner-v2 a {
  color: #ef6923;
}

section.contact-page form.hs-form .hs-form-field .input input[type="checkbox"].hs-input + span{
    display: block;
    margin-left: 10px;
    max-height: 20px;
}

section.contact-page form.hs-form .inputs-list.multi-container li label{
	top: -12px;
}

/*section.contact-banner-v2 .container .span12 h3 {
    color: #ef6923;
}*/

@media only screen and (max-width: 1200px) {
  section.contact-banner-v2 {
    background-position: 80% 50%;
  }
  
  section.contact-banner-v2 .container .span12 {
    width: 50%;
    max-width: 100%;
  }
}

@media only screen and (max-width: 767px){
  .contact-page .container .row-fluid {
    flex-direction: column;
  }
  
  section.contact-banner-v2 .container .span12 {
    width: 100%;
    max-width: 100%;
    background: rgba(0,0,0,0.75);
  }
  
  section.contact-banner-v2 .container .span12 h3{
    font-size: 28px;
    text-align: center;
  }
  
  section.contact-banner-v2 .container .span12 a, 
  section.contact-banner-v2 .container .span12 p{
    font-size: 18px;
    text-align: center;
  }
  
  section.contact-banner-v2 .mask{
    background: rgba(255,255,255,0.5);
  }
  
  .contact-page ul.social{
    text-align: center;
  }
}

@media only screen and (max-width: 500px){
  section.contact-banner-v2 .container .span12 h3{
    font-size: 22px;
  }
  
  section.contact-banner-v2 .container .span12 a, 
  section.contact-banner-v2 .container .span12 p{
    font-size: 15px;
  }
}  

@media only screen and (max-width: 767px){
  /*Contact Us - Mobile Hero Banner Override*/
  section.contact-banner-v2{
    min-height: 370px;
    background-image: url('https://www.reflectionsoftware.com/hubfs/Web%20Assets%202019/Web%20Banners/Contact%20Us%20Mobile%20Banner_V4.png') !important;
    background-position: bottom left;
  }
  
  section.contact-banner-v2 .mask{
    background: rgba(0,0,0,0);
  }
  
  section.contact-banner-v2 .container{
    min-height: 300px;
    align-items: start;
    padding: 0;
    padding-bottom: 80px;
  }

  section.contact-banner-v2 .container .span12{
    min-height 300;
    padding: 50px 5px;
    border-left: none;
    background: #08151c;
  }
}

/*****************************************
 * OnBrand Page Overrides
 * **************************************/
.onbrand-team-img img {
  display: block; 
  margin-left: auto;
  margin-right: auto;
}
/*****************************************
 * 404/500 Error Page Overrides
 * **************************************/
.page-404-body .body-container-wrapper {
	margin-top: 70px;
}

.page-404-body .body-container-wrapper .container {
	max-width: 100%;
	padding-left: 50px;
	padding-right: 50px;
}

.page-404-body .body-container-wrapper .container .page-404 img {
	margin-top: 0px;
	max-width: 100%;
}

.page-404-body div.page-404 {
	margin-top: 100px;
}

.page-404-body div.page-404 div.page-404-text-block{
  margin-top: 70px;
}

@media only screen and (min-width: 768px){
  .page-404-body div.page-404 div.page-404-text-block{
    max-width: 600px;
  }
}

@media only screen and (max-width: 999px){
  .page-404-body div.page-404 div.page-404-text-block{
    margin-top: 50px;
  }
}

@media only screen and (max-width: 767px){
  .page-404-body div.page-404 {
    margin-top: 60px;
  }
  
  .page-404-body div.page-404 div.page-404-text-block{
    margin-top: 30px;
  }
  
  .page-404-body div.page-404 div.page-404-text-block, .page-404-text-block p, .page-404-text-block h2 {
    text-align: center;
  }
}

/******************************************
 * Hero Banner Styling
 * Contains Responsive size fixes
 *
 *****************************************/

section.hero-banner .hero-banner-wrap {
  text-shadow: 1px 1px 6px rgba(0,0,0,0.85);
}

.hero-banner-landing-basic-2{
  min-height: 720px;
}
/*************************************************
 * General Inquiry Thank You Banner
 * **********************************************/
.thank-you-dog .hero-banner .hero-banner-wrap h1, .thank-you-dog .hero-banner .hero-banner-wrap h2 {
  text-align:left; 
}
.thank-you-dog .hero-banner-wrap {
		width: 50%;
		margin-left: 50%;
}

.thank-you-dog section.hero-banner {
  background-position: left;
}
/********************************************************************
 * Medium Laptops
 * *****************************************************************/
@media only screen and (min-width:1024px) and (max-width: 1500px){
  /* Essential Training */
   .essential-training section.hero-banner {
        background-image: url('//462737.fs1.hubspotusercontent-na1.net/hubfs/462737/Web%20Assets%202019/Web%20Banners/Essential%20Training_Laptop-1.png') !important;
	}
  .essential-training  .hero-banner-wrap {
		width: 50%;
		margin-left: 50%;
	}
	
	.essential-training  .hero-banner .hero-banner-wrap h1 {
		text-align: left;
	}

	.essential-training  .hero-banner .hero-banner-wrap h2 {
		text-align: left;
  }
}

.text-and-image-overflow .text-wrapper a:not(.cta_button){
	color: #ef6923;
}

/***************************************************************
 * iPad - Small Laptop Fix
 * ************************************************************/

@media only screen and (max-width: 1440px){
 
   /* Progressive Dev */
  .progdev-banner section.hero-banner {
    background-image: url('https://www.reflectionsoftware.com/hubfs/Web%20Assets%202019/Cognition/Progressive%20Development/Progressive%20Development_Laptop.png') !important;
    background-position: center;
  }
  
  .progdev-banner .hero-banner-wrap {
    width: 55%;
  }
  
}

@media only screen and (min-width:768px) and (max-width:1024px){
  
  /* General Fix */
	.laptop-banner section.hero-banner {
    background-position: 10%;
	}
	
	.laptop-banner .hero-banner-wrap {
		width: 55%;
		margin-left: 45%;
	}
	.pm-banner.laptop-banner .hero-banner-wrap {
    margin-left: 20%; 
  }
  
	.laptop-banner .hero-banner .hero-banner-wrap h1 {
		text-align: left;
	}

	.laptop-banner .hero-banner .hero-banner-wrap h2 {
		text-align: left;
	}
	
  /*  Performance Management */
   .pm-banner.laptop-banner section.hero-banner
  {
    background-position: 80%;
  }

}
  
@media only screen and (max-width: 1024px){
  .shift-company-culture .form-landing .widget-type-form form input.hs-button{
    font-size: 16px;
  }
  .txt-cta-separator .separator-content h3{
    text-align: center;
  }
  
  #main_section span.content-lg-orange {
    display: block;
  }
  .onbrand section.hero-banner {
     background-image: url('https://www.reflectionsoftware.com/hubfs/Web%20Assets%202019/Web%20Banners/OnBrand_Banner_Laptop_v2.png') !important;
    background-position: center;
  }
 
}

/****************************************************************
 * Mobile Devices
 * *************************************************************/


@media only screen and (max-width:600px){
  /*  Instructor Support Materials */
  .instructor section.hero-banner {
    background-image: url('//462737.fs1.hubspotusercontent-na1.net/hubfs/462737/Web%20Assets%202019/Web%20Banners/Instructor%20Lead%20Materials_Mobile.png') !important;
  }
  .thank-you-dog .hero-banner .hero-banner-wrap h1, .thank-you-dog .hero-banner .hero-banner-wrap h2 {
  text-align:center; 
}
.thank-you-dog .hero-banner-wrap {
		width: 100%;
		margin-left: 0;
    top: -25%;
}
 /* .thank-you-dog .hero-banner .mask {
    opacity: 0.4 !important;
  }*/
	.thank-you-dog section.hero-banner {
    background-image: url('//462737.fs1.hubspotusercontent-na1.net/hubfs/462737/Web%20Assets%202019/Web%20Banners/ThankYou_laying_wShadow.png') !important;
    background-position: bottom;
	}

  /* OnBrand Learning */
  .onbrand section.hero-banner {
    background-image: url('https://www.reflectionsoftware.com/hubfs/Web%20Assets%202019/Web%20Banners/OnBrand_Banner_mobile.png') !important;
    background-position: center;

  }
  
    /* Progressive Dev */
  .progdev-banner section.hero-banner {
    background-image: url('https://www.reflectionsoftware.com/hubfs/Web%20Assets%202019/Cognition/Progressive%20Development/Progressive%20Development_Mobile.png') !important;
    background-position: center;
  }
    .progdev-banner .hero-banner-wrap {
    width: 100%;
  }
}

@media only screen and (max-width: 800px){
  .hero-banner-landing .container .hero-banner-wrap h1,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap h1{
    font-size: 38px;
    text-align: center;
  }
  
  .hero-banner-landing .container .hero-banner-wrap h2,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap h2{
    font-size: 30px;
    text-align: center;
  }
  
  .hero-banner-landing .container .hero-banner-wrap p,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap p{
    text-align: center;
  }
  
  .hero-banner-landing .container .hero-banner-wrap ul li,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap ul li {
    float: none;
    display: inline-block;
    margin-right: 15px;
    margin-left: 15px;
  }
  
  .hero-banner-landing .container .hero-banner-wrap ul li:last-child,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap ul li:last-child {
    display: none;
  }

  .hero-banner-landing .container .hero-banner-wrap ul,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap ul{
	  text-align: center;
    margin-bottom: 40px;
  }
  
  .hero-banner-landing-basic-2 .form-placeholder{
    max-width: none;
    width: 100%;
  }
  
  .hero-banner-landing .container,
  .hero-banner-landing .container .hero-banner-wrap,
  .hero-banner-landing .container .hero-banner-wrap p,
  .hero-banner-landing-basic-2 .container,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap,
  .hero-banner-landing-basic-2 .container .hero-banner-wrap p {
	  max-width: 100%;
  }
  
  #main_section span.content-lg-orange {
    margin-bottom: 40px;
  }
}


@media only screen and (max-width: 767px){
  section.footer.rs-global-footer{
    height: 120px;
    line-height: 67px;
    overflow-y: hidden;
  }

  .hero-banner .hero-banner-wrap h1{
    font-size: 38px;
  }
  .homepage .features h2 {
    font-size: 38px;
    margin-bottom: 0px;
  }
  
  .homepage .features .feature{
    margin-top: 40px;
  }
  
  .lead-section h2{
    font-size: 32px;
  }
  
  .text-and-image-overflow .container-fluid .text-wrapper .text-content h2{
    font-size: 38px;
    text-align: center;
  }
  
  .preventing-harassment-infographic img{
    display: none;
  }
  
  .process_text h2 {
    text-align: center !important;
  }
}



@media only screen and (max-width:500px){
  .hero-banner .hero-banner-wrap h1, 
  .homepage .features h2 {
    font-size: 32px;
  }  
  .hero-banner-landing-basic-2 .container .hero-banner-wrap h1 {
    font-size: 32px;
  }
  
  .hero-banner-landing-basic-2 .container .hero-banner-wrap h2 {
    font-size: 26px;
  }
  
  .hero-banner-landing-basic-2 .container .hero-banner-wrap p {
    font-size: 16px;
  }
  
  .lead-section h2{
    font-size: 24px;
  }
  
  .text-and-image-overflow .container-fluid .text-wrapper .text-content h2{
    font-size: 32px;
  }
  .txt-cta-separator .separator-content h3{
    font-size: 30px;
  }
  .contact-page .widget-type-form h3.form-title{
    font-size: 24px; 
  }
  .orange-h2-mobile-fix h2{
		font-size: 26px;
    margin-bottom: 0px;
	}
}

/****************************************************************
 * Specific/Individual Mobile Fixes
 * *************************************************************/

/*Decrease font size and spacing for bold, orange headers on "eLearning" and "Instructor Support Materials"*/
@media only screen and (max-width:500px){
  .orange-h2-mobile-fix h2{
		font-size: 26px;
    margin-bottom: 0px;
	} 
}

/*Fix hero banner on mobile so that the TM symbol isn't on it's own line. on "ACT to Survive" page*/
@media only screen and (max-width:360px){
  .act-to-survive-hero .hero-banner .hero-banner-wrap h1 {
    font-size: 28px;
  }  
}

/*Decrease font size for "Cognition Talent Management" hero banner header*/
@media only screen and (min-width:768px) and (max-width:900px){
  .talent-management-hero .hero-banner .hero-banner-wrap h1{
    font-size: 48px;
  }
}

/*Remove excess spacing after intro paragraph on "Learning Solutions (eLearning Homepage)" */
@media only screen and (max-width:768px){
  .learning-solutions-page #main_section {
    padding-bottom: 0px;
  }
}

/*Remove excess spacing before and after footer CTA on "Learning Solutions (eLearning Homepage)" */
.learning-solutions-page .footer-cta .lead-section{
  padding-top: 20px;
  padding-bottom: 20px;
}
.learning-solutions-page .lead-section.iphone-section{
	padding-top: 20px;
}

/*Add spacing above and below specific CTA buttons on mobile. Affects "Learning Solutions (eLearning Homepage)" and "Cognition Homepage"*/
@media only screen and (max-width:767px){
  .cta-mobile-padding-fix a.cta_button.cta-primary {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
}

/*Give specfic buttons a better mobile experience:
 * "Contact Us" - Fill width for Send button.
 * "Media Services" - Center Learn More button under Writing Services.
 * */
@media only screen and (max-width:400px){
  .center-cta-on-mobile {
    text-align: center;
  }
  .contact-us-form input.hs-button{
    width: 100%;
  }
}

/*Magnigific Video fixes ("Media Services" page) on iDevices, such as iPad/iPhone/etc.*/

/***********************************************************
 * Services Override
 * ********************************************************/
.process-line {
  background-image: url('//462737.fs1.hubspotusercontent-na1.net/hubfs/462737/IMG-TurboSodium/process-line.png');
}

@media only screen and (max-width: 767px) {
  .process-line {
    visibility: hidden !important;
  }
  
  .process-box .widget-type-linked_image{
	  margin-top: 35px;
  }
}
/*********************************************************
 * Hubspot Forms
 ********************************************************/
.hs-error-msgs a
{
  color: #ef6923;
}

.hs-error-msgs a:hover {
  text-decoration: underline;
}

.resubscribe-form .hs_submit.hs-submit {
  display: none;
}

.resubscribe-form .hero-banner-landing-basic-2 .form-placeholder .hero-banner-form {
    padding: 0 30px 10px;
}

.rs-single-col-form .field {
    padding-bottom:30px;
}
.rs-single-col-form .field ::placeholder {
  color: rgb(137 137 137);
}

.rs-single-col-form textarea {
    background: white;
    border: solid 1px rgb(118, 118, 118);
    outline: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 18px;
    font-weight: 300;
    color: rgb(45, 45, 45);
    margin-top: 10px;
    font-family: Palanquin, sans-serif;
    min-height: 130px;

}

/*********************************************************
 * Contact Forms
 ********************************************************/
.contact-page .widget-type-form form ul.hs-error-msgs label, .contact-page .widget-type-form form ul.hs-error-msgs a {
  color: #f10505; /*Make error message text red*/
}