/****************************************************************************/
/* This is the default custom CSS file that is included in every template.  */
/* It can be edited, but it cannot be renamed or deleted.                   */
/****************************************************************************/

/***************************HOMEPAGE ICONS***************************/
.icon-placement-a{
    z-index: 305;
    top: 44%;
    left: 97%;
    position: absolute;
    font-size: 30px;
}
.icon-placement-b{
    z-index: 305;
    top: 17%;
    left: 49%;
    position: absolute;
    font-size: 30px;
}
.icon-placement-c{
    z-index: 305;
    top: 17%;
    left: 70%;
    position: absolute;
    font-size: 30px;
}
/*************************END HOMEPAGE ICONS****************************/

/*************************HERO PROMO BANNER*****************************/
.promo-banner {
    position: absolute;
    width: 40%;
    height: 52%;
    background: white;
    top: 73%;
    left: -2%;
    border-radius: 40px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 10px rgba(0, 0, 0, 0.19);
    padding: 4%;
    padding-top: 5px;
    font-family: "proxima-nova", Helvetica, sans-serif;";
    line-height: 1em;
    -webkit-transition: top .5s; /* For Safari 3.1 to 6.0 */
    transition: .5s;
}
.promo-banner-mobile {
    padding-top: 5px;
    font-family: "proxima-nova", Helvetica, sans-serif;";
    line-height: 1em;
    border-top: 1px solid #ed1c23;
    border-bottom: 5px solid #ed1c23;
}
.promo-banner:hover { 
    top:62%;
}

.promo-subhead{
    font-size: 10px;
    color: #e24d5b;
    text-transform: uppercase;
    
}

.promo-text{
    color: #404040;
}
.btn-red {
  background: #ed1c23;
  background-image: -webkit-linear-gradient(top, #ed1c23, #f0533b);
  background-image: -moz-linear-gradient(top, #ed1c23, #f0533b);
  background-image: -ms-linear-gradient(top, #ed1c23, #f0533b);
  background-image: -o-linear-gradient(top, #ed1c23, #f0533b);
  background-image: linear-gradient(to bottom, #ed1c23, #f0533b);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 6px 19px 6px 20px;
  text-decoration: none;
}

.btn-red:hover {
  background: #f0533b;
  background-image: -webkit-linear-gradient(top, #f0533b, #ed1c23);
  background-image: -moz-linear-gradient(top, #f0533b, #ed1c23);
  background-image: -ms-linear-gradient(top, #f0533b, #ed1c23);
  background-image: -o-linear-gradient(top, #f0533b, #ed1c23);
  background-image: linear-gradient(to bottom, #f0533b, #ed1c23);
  text-decoration: none;
    -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 6px 19px 6px 20px;
  text-decoration: none;
}

/*************************EN HERO PROMO BANNER**************************/
.homepage-header {
    color: white;
    text-align: center;
    font-size: 65px;
    line-height: 1.2em;
    font-family: "proxima-nova", Helvetica, sans-serif;
    font-weight: 800;
    padding-top: 3%;
}
.homepage-header-live {
    color: white;
    text-align: left;
    font-size: 3.0vw;
    line-height: 1.2em;
    font-family: "proxima-nova", Helvetica, sans-serif;
    font-weight: 700;
    padding-top: 8%;
}
 @media screen and (max-width: 1199px) and (min-width: 1139px) {
     .homepage-header-live{font-size: 3.8vw;}
     p.subhead-live{font-size: 2.3vw;}
     }

img.hp-tri{
    width:26vw;
    padding-top:33px;
}
.homepage-header-mobile {
    color: white; 
    text-align: center; 
    font-size: 28px;
    font-family: "proxima-nova", Helvetica, sans-serif;
    font-weight: 800;
    line-height: 1.2em;
}

img.hotka{
    max-height: 80px;
}

.hero-headline {
    color: white;
    text-align: center: 
    padding-top: 15px;
    font-size: 20px;
    text-transform: uppercase;
}

.hero-subhead {
    font-size: 15px;
    font-weight: 300;
    color: white;
    text-align: center;
    padding-top: 15px;
}
p.subhead {
    width: ;
    margin-left: 0px;
    margin-right: auto;
    font-size: 1.8vw;
    font-family:"proxima-nova", Helvetica, sans-serif;
    font-weight: 300;
    padding-top: 3%;
    color: white;
    text-align: center;
    visibiity: hidden;
 }
 p.subhead-live {
    width: ;
    margin-left: 0px;
    margin-right: auto;
    font-size: 1.8vw;
    font-family:"proxima-nova", Helvetica, sans-serif;
    font-weight: 300;
    color: white;
    text-align: left;
 }
 p.cta {font-size: 28px; font-weight: 200; font-family: "proxima-nova", Helvetica, sans-serif;";
     
 }
 .subhead-lg{
     font-size: 2.4vw;
 }
 p.subhead-mobile {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    font-size: 17px;
    font-family:"proxima-nova", Helvetica, sans-serif;
    font-weight: 300;
    padding-top:;
    color: white;
    text-align: center;
 }
 @media screen and (max-width: 1139px) and (min-width: 640px) {
    p.subhead-mobile {
        font-size:25px;
        
}
    .homepage-header-mobile {
        font-size:40px;
    }
}
/*************************** BUTTONS ***************************/
.btn-lighter {
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  font-family: Arial;
  color: #138ec7;
  font-size: 18px;
  background: #ffffff;
  padding: 12px 20px 12px 20px;
  border: solid #71c1e6 1px;
  text-decoration: none;
}


.btn-lighter:hover{
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
  color: #fff;
}

.btn-stroke {
    display: inline-block;
    min-width: 225px;
    max-width: 35%;
    margin: 5px;
    padding: 7px 5px;
    border: 2px solid #fff;
    border-radius: 25px;
    color: #8fc9e1;
    text-decoration: none;
    font-size: 1.6rem;
    font-weight: light;
    transition: 0.3s;
    Text-align: center;
  letter-spacing: 2px;
}

.btn-stroke:hover{
        background: #7189B2;
        color: #ffffff;
        text-decoration: none;
}

.btn-stroke-dark {
    display: inline-block;
    min-width: 225px;
    max-width: 35%;
    margin: 5px;
    padding: 7px 5px;
    border: 2px solid #7189B2;
    border-radius: 25px;
    color: #8fc9e1;
    text-decoration: none;
    font-size: 1.6rem;
    font-weight: light;
    transition: 0.3s;
    Text-align: center;
  letter-spacing: 2px;
}

.btn-stroke-dark:hover{
        background: #7189B2;
        color: #ffffff;
        text-decoration: none;
}

.btn-yellow {
    display: inline-block;
    min-width: 225px;
    max-width: 35%;
    margin: 5px;
    padding: 15px 34px;
    border: 2px solid #eda737;
    border-radius: 25px;
    color: #ffffff;
    text-decoration: none;
    font-size: 1.6rem;
    font-weight: 700;
    transition: 0.3s;
    Text-align: center;
    background: #eda737;
  letter-spacing: 2px;
}

.btn-yellow:hover{
        background: #f6ca77;
        color: #ffffff;
        text-decoration: none;
        border: 2px solid #f6ca77;
}
.btn-purple {
    display: inline-block;
    min-width: 225px;
    max-width: 35%;
    margin: 5px;
    padding: 7px 5px;
    border-radius: 25px;
    color: #ffffff;
    text-decoration: none;
    font-size: 1.6rem;
    font-weight: light;
    transition: 0.3s;
    Text-align: center;
    background: #ae82a3;
  letter-spacing: 2px;
}

.btn-purple:hover{
        background: #AE4DA7;
        color: #ffffff;
        text-decoration: none;
}


.btn-lightblue {
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 6px;
  font-family: Arial;
  color: #ffffff;
  font-size: 18px;
  background: #71c1e6;
  padding: 10px 43px;
  border: solid #71c1e6 1px;
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 2px;
}
.btn-orange {
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  font-family: Arial;
  color: #ED4322;
  font-size: 18px;
  background: #ffffff;
  padding: 12px 20px 12px 20px;
  border: solid #ED4322 1px;
  text-decoration: none;
  letter-spacing: 2px;
}


.btn-orange:hover{
  background: #ED4322;
  background-image: -webkit-linear-gradient(top, #ED4322, #a51d01);
  background-image: -moz-linear-gradient(top, #ED4322, #a51d01);
  background-image: -ms-linear-gradient(top, #ED4322, #a51d01);
  background-image: -o-linear-gradient(top, #ED4322, #a51d01);
  background-image: linear-gradient(to bottom, #ED4322, #a51d01);
  text-decoration: none;
  color: #fff;
}

/******************************** END BUTTONS *************************/
/********************** Calendar Invite Style ************************/
/* Hide button at load */
.addeventatc {visibility:hidden;}

/* Make sure the options layer / dropdown is always visible */
.addeventatc_dropdown {display:block!important;}

/* Some demo styling of the options */
.addeventatc_dropdown span {display:inline-block;margin:2px;padding:0px 8px;background:#666;color:#404040;border-radius:4px;cursor:pointer;font:14px/30px Roboto,serif;box-shadow:1px 1px 5px 0px rgba(0,0,0,0.3);}
.addeventatc_dropdown span em {font-size:12px;color:#404040;}

/* Remove the AddEvent credits */
.addeventatc_dropdown .copyx {display:none;}

/******************************* END CALENDAR STYLE ********************************/

#rcorners {
    border-radius: 25px;
    background: #959698;
    padding: 10px; 
    width: auto;
    height: auto;    
}

.btn-darker {
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  font-family: Arial;
  color: #0d285d;
  font-size: 18px;
  background: #ffffff;
  padding: 12px 20px 12px 20px;
  border: solid #0d285d 1px;
  text-decoration: none;
}

.btn-darker:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #0d285d, #12367d);
  background-image: -moz-linear-gradient(top, #0d285d, #12367d);
  background-image: -ms-linear-gradient(top, #0d285d, #12367d);
  background-image: -o-linear-gradient(top, #0d285d, #12367d);
  background-image: linear-gradient(to bottom, #0d285d, #12367d);
  text-decoration: none;
  color: #fff;
}

.btn-darker:active {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #0d285d, #12367d);
  background-image: -moz-linear-gradient(top, #0d285d, #12367d);
  background-image: -ms-linear-gradient(top, #0d285d, #12367d);
  background-image: -o-linear-gradient(top, #0d285d, #12367d);
  background-image: linear-gradient(to bottom, #0d285d, #12367d);
  text-decoration: none;
  color: #fff;
}

.btn-white {
  -webkit-border-radius: 6;
  -moz-border-radius: 6;
  border: 1px solid #fff;
  border-radius: 6px;
  color: #ffffff;
  padding: 8px;
  font-family: helvetica;
  text-decoration: uppercase;
  background-color: rgba(255, 255, 255, 0);
}

.btn-white:hover {
  text-decoration: none;
}
p.subtext {
    font-weight: 200; 
    }
    
.testimonial {
    text-align: center;
    font-size: 1.5em;
    font-weight: 100;
    color: #5580b3;
    line-height: 1.3;
    margin-left: 10%;
    margin-right: 10%;
}

.attribution {
    font-size: 17px;
    line-height: 1.5;
    color: #6a6b6d;
    font-weight: 300;
    text-align: center;
    font-size: 20px;
}
.interior-hero-content {
  width: 100%;
  display: table;
  position: relative;
  z-index: 1;
  padding-top: 5%;
  color: #ffffff;
}

@media only screen and (max-width: 500px) {
    /* Graident Background for mobile */
    .interior-hero-content {
      background-size: cover; 
        padding-top: 0%;
    }
}

#overlay {
    background-image: url(https://cdn2.hubspot.net/hubfs/160569/images/BG-Gradient-2.png);
    background-size: cover;
    background-position: center;
}



.interior-hero-content-inner {
  display: block;
  padding: 0;
  vertical-align: middle;
  color: #ffffff;
  font-weight: 400;
  max-width: 950px;
  margin: auto;
  
}

@media only screen and (max-width: 500px) {
    /* Banner Text for mobile */
    .interior-hero-content-inner {
     width: auto;
    }
}

.billboard-content {
  vertical-align: middle;
  color: #ffffff;
}

.interior-hero-content h1,
.interior-hero-content h2,
.interior-hero-content h3,
.interior-hero-content h4,
.interior-hero-content h5,
.interior-hero-content h6,
.interior-hero-content p,
.interior-hero-content ul {
  color: #ffffff;
  font-family: "proxima-nova", Helvetica, sans-serif;";;
}

.interior-hero-content h1 {
    text-transform: uppercase;
    font-weight: 500;
    text-shadow: 2px 2px #000;
}

.billboard-content h1,
.billboard-content h2 {
  font-weight: 400;
  color: #ffffff;
}

.billboard-overlay {
    position: absolute;
}
.box {
  position: relative;
  width: 250px;
  display: inline-block;
}

.image {
  display: inline-block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #0d1742;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}
.overlay-price {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #253a7a;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}
.overlay-target {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #929497;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}
.overlay-planning {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #5570b3;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}

.overlay-opt {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #71c1e6;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}

.box:hover .overlay {
  height: 100%;
}
.box:hover .overlay-price {
  height: 100%;
}
.box:hover .overlay-target {
  height: 100%;
}
.box:hover .overlay-planning {
  height: 100%;
}
.box:hover .overlay-opt {
  height: 100%;
}

.box-text {
  white-space: wrap; 
  color: white;
  font-size: 16px;
  position: absolute;
  overflow: hidden;
  width: 100%;
  padding: 10px;
  text-align: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.footer-form {
    background-image: url("https://cdn2.hubspot.net/hubfs/160569/images/Form-BG.jpg")
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 400px;
}

.testimonial-quote{
    color: #ffffff;
    font-size: 1.2em;
    font-family: gotham-light;
    text-align: center;

    margin-bottom: 20px;
}
.attribution{
    color: #ffffff;
    font-size: 1.2em;
    font-family: gotham;
    text-align: center;
}
i {
    color: #404040;
    padding-bottom: 15px;
}
section {
    display: none;
}
h2.section{
    font-size: 1.2em;
    color: white;
    font-weight: 300;
    text-transform: uppercase;
    text-align: center;
}
img.logo{
    max-width: 200px;
}
p.section-headline {
    text-align: center; 
    text-transform: uppercase; 
    font-size: 24px; 
    font-weight: 500;
    color: #12367d;
}
.section-headline {
    text-align: center; 
    text-transform: uppercase; 
    font-size: 24px; 
    font-weight: 500;
    color: #12367d;
}

.success-rates {
    text-align: right;
    font-size: 22px;
    line-height: 1.1;
    font-weight: 600;
}
p.intro {
    text-align: center; 
    max-width: 850px; 
    margin: auto;
    font-size: 20px;
}
.intro-section{
    padding-top:20px;
    padding-bottom:20px;
}
h2.intro-headline{
    font-weight: 600;
    font-size: 25px;
    color: #0d285d;
    text-transform: uppercase;
    text-align: center;
}
.title-subtext{
    font-weight: 200;
    font-size: .8em;
}

.title-thin{
    font-weight: 200;
    font-size: 1.8em;
}
.title-heavy{
    font-weight: 800;
    font-size: 1.8em;
}

.block-text {
    position: absolute;
    top: 65%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    font-family: "proxima-nova", Helvetica, sans-serif;
    font-weight: 800;
    font-size: 21px;
    color: #12367d;
    text-align:center;
}

img.block-img {
  padding: 10px;
  
}

@media screen and (max-width: 600px) {
    img.block-img {
    padding-left: 15%;
    padding-right: 15%;
    padding-bottom: 10px;
}
}
p.icon{
    padding-top: 10px;
}
p.icon-grid{
    color: #ffffff;
    text-align: center;
    font-size: 1.0em;
    font-weight: 300;
    font-family: "proxima-nova",Helvetica,sans-serif;
     padding-bottom: 10px;
}
h5.icon-title{
  font-weight: 300;
  font-size: 1.7em;
  color: #8FCAE4;
  letter-spacing: 3px;
}

@media only screen and (max-width: 1960px) and (min-width: 960px) 
    {.interior-hero { 
        height: 400px;
        }
    }
@media only screen and (max-width: 959px) and (min-width: 500px)
    {.interior-hero { 
        height: 300px;
        }
    }

@media only screen and (max-width: 959px) and (min-width: 500px)
    {.interior-hero { 
        height: 300px;
        }
    }
    
        #dim {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%); 
    -o-filter: grayscale(100%); 
    transition: all 0.75s ease;
    opacity: 0.3;
}

    #dim:hover {
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    opacity: 1.0;
}

#white{
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%); 
    -o-filter: grayscale(100%); 
    }
.event-title {
    border: 1px solid #5570b3; 
    padding: 10px; 
    text-align: center; 
    color: #253B7A;
}
.video-quote {
    font-weight: 300;
    font-size: 19px;
    color: #12367d;
    padding: 11px 22px;
    margin: 0 0 22px;
    border-left: 5px solid #eee;
}