body { font-family: 'Raleway',helvetica,arial,sans-serif;}

#topbar { width: 100%; background: #000; height: 40px; }
.topnav {
  overflow: hidden;
  background-color: #231f20;
font-family: Montserrat, sans-serif;	
}



/* Add a black background color to the top navigation */
.topnav {
  background-color: #231f20;
  overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 7px 12px;
  text-decoration: none;
  font-size: 11px;
}

/* Change the color of links on hover */
.topnav a:hover {
  background-color: #231f20;
  color: #1B9ED9;
}

/* Add an active class to highlight the current page */
.topnav a.active {
  background-color: #4CAF50;
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.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: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

/* 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: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}






.tagline { font-size: 10px; color: #737172; margin-top: 1em; }
.fullwidth-container2 { padding: 0px; }
.fullwidth-container { padding: 40px; }
.center { text-align: center; }
.white { color: #fff; }
.uppercase { text-transform: uppercase; }
.large-text { font-size: 24px; }
.hero-tagline { margin-top: 40px; }
.hero-tagline h3 { font-size: 22px; }

h1, h2, h3, h4, h5 { line-height: 1.3; margin: 0.5em 0; }
h1 { font-size: 58px; }
h2 { font-size: 44px; }
h3 { font-size: 36px; }
h4 { font-size: 28px; }
h4 { font-size: 22px; }

img { max-width: 100%; }

section { padding: 60px 0; }
section2 { padding: 0px 0; }
section#freedom-intro { padding-bottom: 0; }
section#freedom-plans { padding-top: 0; }
section#nudge { position: absolute; top: 50px; right: 20px; max-width: 540px; border: 1px solid #737172; color: #737172; font-size: 12px; padding: 1em; text-align: center; background: rgba(255,255,255,0.3); }
section#nudge .button { border-color: #737172; color: #737172; margin: 0 5px; }
section#nudge .button.standout, section#nudge .button:hover { background-color: #737172; color: #fff; }
section#nudge .button.standout:hover { color: #737172; background: transparent; }
section#nudge p:last-child { margin-bottom: 0; }

#logo .fullwidth-container { padding-top: 15px; padding-bottom: 15px; }

main.months-36 { background: #BE2E8C url(../images/Homepage-Background-36.png) no-repeat top center; }
main.months-48 { background: #5966C8 url(../images/Homepage-Background-48.png) no-repeat top center; }
main.months-60 { background: #5D8B2B url(../images/Homepage-Background-60.png) no-repeat top center; }

.tm { font-size: 0.8em; vertical-align: top; }
.button { border: 1px solid #fff; color: #fff; padding: 0.5em 1em; display: inline-block; }
.button:hover { background: #fff; color: #000; text-decoration: none; }
.button.standout { background: #fff; color: #000; }
.button.standout:hover { background: transparent; color: #fff; }

.nav-tabs { border-bottom: none; justify-content: center; margin: 40px 0 20px 0; }
.nav-tabs .nav-before, .nav-tabs .nav-after { flex-grow: 1; border: 4px solid transparent; border-bottom: 4px solid #fff; padding: 0.8em 1.8em; font-size: 20px; }
.nav-tabs .nav-before { border-right-width: 0; }
.nav-tabs .nav-after { border-left-width: 0; }
.nav-tabs .nav-link { background: rgba(255,255,255,0.3); color: #fff; font-weight: bold; padding: 1em 2em; font-size: 20px; text-transform: uppercase; border-width: 4px; border-color: #fff; border-radius: 0; border-bottom-width: 4px; }
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { background: transparent; color: #fff; border-color: #fff; border-bottom-color: transparent; }
.nav-tabs .nav-link { border-left-width: 0px; }
.nav-tabs .nav-link.first { border-left-width: 4px; }

.freedom-plan-box { border: 8px solid #fff; width: 32%; margin: 40px 0.8%; color: #fff; display: inline-block; font-size: 20px; }
.freedom-plan-box .title-image { padding-top: 40px; }
.freedom-plan-box .plan-wrap { padding: 0 30px; }
.freedom-plan-box.first { margin-left: 0; }
.freedom-plan-box.last { margin-right: 0; }
.freedom-plan-box .prints-info { margin: 20px 0 10px 0; }
.freedom-plan-box p { margin: 5px 0; }
.freedom-plan-box .highlights { background: #fff; font-weight: bold; font-size: 20px; margin: 20px 0 0 0; }
.freedom-plan-box .highlights .total { padding: 15px; }
.freedom-plan-box .highlights .price { padding: 20px; }
.freedom-plan-box .highlights .price .amount { font-weight: 900; font-size: 90px; line-height: 1; }
.freedom-plan-box .highlights .price .per { font-size: 24px; font-weight: normal; margin-top: -5px; margin-left: 15px; }
.freedom-plan-box .plan-details ul { padding-left: 0; padding-top: 20px; }
.freedom-plan-box .plan-details ul > li { margin: 1em 0; list-style: none; }
.freedom-plan-box .plan-details ul > li:before { content: "\00B7"; font-weight: bold; display: inline-block; padding-right: 0.5em; }
.freedom-plan-box .go-over { background: #fff; font-weight: 700; padding: 20px 10px; font-size: 20px; letter-spacing: -1px; }
.freedom-plan-box .discover-more { padding: 35px 30px 35px 30px; }
.freedom-plan-box .discover-more .button { border: 1px solid #fff; font-weight: 600; font-size: 20px; background: transparent; color: #fff; padding: 0.5em; display: block; }
.freedom-plan-box .discover-more .button:hover { background: transparent !important; text-decoration: none; }
.freedom-plan-box .expand-details { border-top: 8px solid #fff; }
.freedom-plan-box .expand-details a { color: #fff; display: block; font-size: 18px; margin: 0 30px; padding: 15px 0; position: relative; }
.freedom-plan-box .expand-details a img.dropdown { position: absolute; right: 0; top: 23px; }
.freedom-plan-box.expanded .expand-details { display: none; }

.freedom-plan-box.recommended { color: #000; border: 0; border-bottom: 8px solid #fff; }
.freedom-plan-box.recommended .title-image { padding-top: 5px; }
.freedom-plan-box.recommended .plan-wrap { background: #fff; border-left: 8px solid #fff; border-right: 8px solid #fff; overflow: hidden; }
.freedom-plan-box.recommended .recommended-heading { color: #fff; font-weight: bold; font-size: 14px; padding: 0.5em; }
.freedom-plan-box.recommended .highlights { color: #fff !important; }
.freedom-plan-box.recommended .highlights .total { border-bottom: 2px solid #fff !important; }
.freedom-plan-box.recommended .go-over { color: #fff !important; margin: 0; }
.freedom-plan-box.recommended .discover-more { border-left: 8px solid #fff; border-right: 8px solid #fff; background: #fff; }
.freedom-plan-box.recommended .expand-details { border-left: 8px solid #fff; border-right: 8px solid #fff; }

.freedom-plan-box.recommended.expanded .discover-more { background: transparent; }

.months-36 .freedom-plan-box .highlights { color: #E2345A; }
.months-36 .freedom-plan-box .highlights .total { border-bottom: 2px solid #E2345A; }
.months-36 .freedom-plan-box .go-over { color: #BE2E8C; }
.months-36 .freedom-plan-box .discover-more .button, .months-36 .freedom-plan-box.recommended .recommended-heading, .months-36 .freedom-plan-box.recommended .highlights, .months-36 .freedom-plan-box.recommended .go-over { background: #BE2E8C; }
.months-36 .freedom-plan-box.recommended .discover-more .button:hover { background: #E2345A !important; }
.months-36 .freedom-plan-box.recommended { border-top: 8px solid #BE2E8C; }
.months-36 .lets-talk input[type="submit"] { border: 1px solid #E2345A; color: #E2345A; }
.months-36 .lets-talk input[type="submit"]:hover { background: #E2345A; color: #fff; }
.months-36 form select.custom-select, form select.custom-select option.months-36 { color: #E2345A; border-color: #E2345A; }

.months-48 .freedom-plan-box .highlights { color: #008ED2; }
.months-48 .freedom-plan-box .highlights .total { border-bottom: 2px solid #008ED2; }
.months-48 .freedom-plan-box .go-over { color: #5966C8; }
.months-48 .freedom-plan-box .discover-more .button, .months-48 .freedom-plan-box.recommended .recommended-heading, .months-48 .freedom-plan-box.recommended .highlights, .months-48 .freedom-plan-box.recommended .go-over { background: #5966C8; }
.months-48 .freedom-plan-box.recommended .discover-more .button:hover { background: #008ED2 !important; }
.months-48 .freedom-plan-box.recommended { border-top: 8px solid #5966C8; }
.months-48 .lets-talk input[type="submit"] { border: 1px solid #5966C8; color: #5966C8; }
.months-48 .lets-talk input[type="submit"]:hover { background: #5966C8; color: #fff; }
.months-48 form select.custom-select, form select.custom-select option.months-48 { color: #5966C8; border-color: #5966C8; }

.months-60 .freedom-plan-box .highlights { color: #89A42C; }
.months-60 .freedom-plan-box .highlights .total { border-bottom: 2px solid #89A42C; }
.months-60 .freedom-plan-box .go-over { color: #5D8B2B; }
.months-60 .freedom-plan-box .discover-more .button, .months-60 .freedom-plan-box.recommended .recommended-heading, .months-60 .freedom-plan-box.recommended .highlights, .months-60 .freedom-plan-box.recommended .go-over { background: #5D8B2B; }
.months-60 .freedom-plan-box.recommended .discover-more .button:hover { background: #89A42C !important; }
.months-60 .freedom-plan-box.recommended { border-top: 8px solid #5D8B2B; }
.months-60 .lets-talk input[type="submit"] { border: 1px solid #5D8B2B; color: #5D8B2B; }
.months-60 .lets-talk input[type="submit"]:hover { background: #5D8B2B; color: #fff; }
.months-60 form select.custom-select, form select.custom-select option.months-60 { color: #5D8B2B; border-color: #5D8B2B; }

.lets-talk { background: #fff; padding: 80px 40px; text-align: center; }
.about-us { background: #fff; padding: 80px 40px; padding-left: 25%; padding-right: 25%; text-align: left; }
.lets-talk form { max-width: 1080px; auto; }
.lets-talk form .form-row { margin: 10px 0; }
.lets-talk input[type="submit"] { background: #fff; color: #000; font-weight: bold; font-size: 20px; padding: 0.5em; width: 40%; margin: 20px auto; }
.lets-talk .form-check { text-align: left; color: #495057; }

form input.form-control, form textarea.form-control, form select.custom-select { border: 1px solid #BCBCBC; font-size: 18px; padding: 0.5em; border-radius: 0; height: auto; }

.form-success .thanks-subheading { margin: 0; font-weight: 700; line-height: 1; letter-spacing: -1px; }
.form-success hr { border-top: 1px solid #fff; margin-top: 80px; }

.plan-feature.col-sm { padding-left: 4%; padding-right: 4%; }

.card { background: transparent; border: 1px solid #fff !important; }
.card .card-header { background: rgba(244,244,244,0.2); border-bottom: 1px solid #fff; }
.card .card-header .mb-0 { margin: 0; font-size: 24px; font-weight: bold; }
.card .card-header .dropdown { position: absolute; top: 25px; right: 20px; }
.card .card-body { background: rgba(255,255,255,0.8); }
.card .card-body ul li { margin: 1em 0; }

footer { background: #000; padding: 40px 0; }
footer hr { border-top: 1px solid #fff; margin-top: 20px; }

@media (min-width: 1200px)
{
	.container { max-width: 1400px; }
}

@media (max-width: 1024px)
{
	.freedom-plan-box { width: 31%; }
	.freedom-plan-box .highlights .price .amount { font-size: 70px; }
}

@media (max-width: 768px)
{
	h1 { font-size: 44px; }
	h2 { font-size: 36px; }
	h3 { font-size: 28px; }
	h4 { font-size: 22px; }
	
	
	section { padding: 40px 0; }
	section2 { padding: 40px 0; }
	
	.hero-image, .hero-tagline { padding-top: 0; margin-top: 0; }
	
	.nav-tabs .nav-link { font-size: 18px; padding: 0.5em 1em; }
	.nav-tabs .nav-before, .nav-tabs .nav-after { padding: 0; }
	
	.freedom-plan-box .plan-wrap { padding: 20px 10px 0 10px; }
	.freedom-plan-box .highlights .total { padding: 10px; }
	.freedom-plan-box .highlights .price .amount { font-size: 55px; }
	.freedom-plan-box .highlights .price .per { font-size: 20px; margin-top: 0; }
}

@media (max-width: 480px)
{
	.nav-tabs .nav-link { border-left-width: 4px; }
	.nav-tabs .nav-before, .nav-tabs .nav-after { display: none; }
	
	.freedom-plan-box { width: 100%; }
	.freedom-plan-box .highlights .price .amount { font-size: 70px; }
	
	.plan-feature.col-sm { padding: 5%; }
	
	.form-row { flex-direction: column; }
	.form-row > .col { padding-bottom: 5px; }
}
