marketing-template-mod-v2021.css

File contents

/* ---------------------------------------------------------------------------------------- FONTS */

body {font-family: "Gotham SSm A", "Gotham SSm B" !important;}

#content-body h1 {
  font-family: "Gotham SSm A", "Gotham SSm B"!important;
  font-size: 40px !important;
  font-weight: 100;
  display: block;
  line-height: 50px;
  letter-spacing: -0.02em;
}

#content-body h2 {
  font-family: "Gotham SSm A", "Gotham SSm B"!important;
  font-size: 32px !important;
  font-weight: 900;
  display: block;
  margin: 30px 0px 20px;
  line-height: 40px;
}

#content-body h3 {
  font-family: "Gotham SSm A", "Gotham SSm B"!important;
  font-size: 25px;
  margin: 30px 0px 10px;
}

#content-body p, #content-body li {
  font-size: 16px;
  letter-spacing: -0.02em;
  font-weight: 300;
  line-height: 30px;
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  #content-body h1 {font-size: 30px !important; line-height: 40px;}
  #content-body h2 {font-size: 20px !important; line-height: 30px;}
}

i, em {font-weight: 400;}

.mercury {
	font-family: "Mercury SSm A", "Mercury SSm B";
	font-style: italic;
	letter-spacing: normal;
}

/* ---------------------------------------------------------------------------------- MARKETING TEMPLATE MODS */

html,body {width: 100%;margin: 0px;padding: 0px;overflow-x: hidden; background: #fff}

#breadcrumbs, #content-wrapper::after, .static-text.span4:after, div.news.span4:after, #social-counters
{display: none !important;}

header.lower-border #lowerbar {border-bottom: 0px solid #DBDBDB;}

header.lower-grey #lowerbar {background-color: #fff; margin-bottom: 0px; margin-top: 0px}

.main-content .left-nav {
    margin: 35px 0 0 0px;
}

#core-content .main-content {
    background: transparent; /* remove gray-ish bg color */
}

#core-content {margin-top: 0px;}

#content-body {
    background: transparent /* remove gray-ish bg color */
}

#hero-rows {/* makes hero row full width */
    width: 100%;
    margin-bottom: 0px
}

.row {margin-left: 0px} /* why was there negative margins for this in the first place ? */

[class*="span"] {margin-left: 0px;} /* why was there negative margins for this in the first place ? */

div#content-wrapper.span12, div#content-wrapper.span9 { 
    border-top: 0px /* remove red top border */
}

div#content-wrapper.span9 {margin-right: 30px;} 

#core-content > div > div { /* removed red bar above right column portlet */
    border-top: 0px solid #AD0000;
}
#core-content .sidebar {
    margin:30px 0px;
}

#home-bottom-content {
    background-color: #fff;
}

div.accordion-inner p {padding: 0px;}
.accordion-inner {padding: 0px; border-top: 0px solid #e5e5e5;}

.prefooter-well-wrapper {background: transparent}

@media (max-width: 767px) {
    #core-content .sidebar {margin: 10px 0px; 20px; border-top: 1px dotted #ccc}
}

#core-content .main-content, #core-content .sidebar, #social-counters {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.sidebar .accordion-group {background-color: transparent;}

.sidebar .accordion-group .accordion-heading a {
  font-weight: bold;
  font-size: 14px;
  color: #004963 !important;
  text-transform: none;
  font-family: "Gotham SSm A", "Gotham SSm B";
}

.accordion-heading .accordion-toggle {padding: 8px 0px;}

/* ------------------------------------------------------------------------------------- HERO BANNER */

#hero-rows {margin-bottom: 30px;}

.hero {
    margin: 0px auto;
    max-width: 1920px;
    position: relative;
    background-size: cover;
    background-repeat:no-repeat;
    background-position: center center;
    z-index: 1;
    padding: 250px 0px;
    margin-bottom:0px;
    background-color: transparent;
    text-align: center;
    display: table;
    width: 100%;
}

.caption {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0px;
    background-color:rgba(0,0,0,0.2);
}

.caption-inner {
    display:table;
    margin-right: auto;
    margin-left: auto;
    height:100%;
}

.caption-content {
    display:table-cell;
    vertical-align:middle;
    text-align: center;
    padding:0px;
}

.hero h1 {
  font-size: 60px;
  font-weight: 700;
  letter-spacing: -0.04em;
  color: #fff;
  padding: 20px;
  line-height: 1em;
  text-shadow: 0px 0px 6px #000;
  background-color:rgba(0,0,0,0.0);
}

.hero p {
  font-size: 20px !important;
  font-weight: 300;
  letter-spacing: -.03em;
  line-height: 1.2em;
  color: #fff;
  padding: 10px;
  margin: 0% 0%;
  text-shadow: 0px 0px 6px #2d5179;
  background-color:rgba(0,0,0,0.0);
}

.caption.faded {
  /*background-color: rgba(255,255,255,0.6);*/
  background: linear-gradient(to bottom, rgba(255, 255, 255, .2), rgba(255, 255, 255, 1));
}
.hero h1.faded {
  color: #555;
  font-weight: 900;
  text-shadow: none;
}
.hero p.faded {
  color: #444;
  font-weight: 400 !important;
  text-shadow: none;
}

@media (max-width: 767px) {
    .hero {padding: 0px 0px 250px;}
    .hero h1 {font-size: 2.5em;}
    .hero p {font-size: 1em;}
    #core-content {padding-right:15px; padding-left:15px;}
    #body-inner {
         padding-right:15px; padding-left:10px; 
        -webkit-border-radius: 0px 0px 0px 0px;
         -moz-border-radius: 0px 0px 0px 0px;
         border-radius: 0px 0px 0px 0px;
         -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.5);
         -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.5);
         box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.5);
    }
}

/* EVENTS FEED RESTYLE */

#events {
  text-align: left;
  padding: 40px 0px 30px;
  background-color: #fff
}

#core-content #content-body h2.white {
  color: #fff; 
  margin-bottom: 10px !important;
  font-weight: 
}
#events h2 {color: #5b6f7b !important}

#lw { /* EVENTS CONTAINER */
  max-width: 1170px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px
}

body.marketing #lw li.lwe  { /* ITEM */
  width: 27.9%;
  float: left;
  margin-left: 15px;
  background-color: #eee!important;
  padding: 25px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

body.marketing #lw li.lwe:nth-child(1) {margin-left: 0px;}

.localist_widget_container a.lw_event_item_image img {
  visibility: visible;
  width: 45px;
}

body.marketing .lwi {
    
  display: none;
  border-radius: 0%;
  border: 0px
}

body.marketing span.lwn0 {
    float: left;
    width: 36px;
    padding: 5px;
    margin: 0px 10px 5px 0px;
    background-color: #00788a;
    color: #fff !important;
    font-weight: bold;
    font-size: 16px !important;
    line-height: 20px;
    height: 36px;
    overflow: hidden;
}

.lwi0  {display: none}

#lw li.lwe:hover {background-color: #000 !important}

#lwe div.lwn a:hover {
  text-decoration: none
}

body.marketing.secondary-page div.lwn a {
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 300;
  font-size: 22px !important;
  line-height: 26px !important;
  color: #ad0000 !important
}

body.marketing.secondary-page div.lwn a:hover {color: #000 !important}

div.lwd, div.lwl {
   
  padding-top: 5px;
    
  color: #666;
    
  font-size: 14px;
    
  line-height: 1.5;
    
  overflow: hidden;

}

span.lwl0 {font-size: 12px}

@media (min-width: 940px) and (max-width: 1199px) {
  div#lw {width: 940px}
  body.marketing #lw li.lwe {width: 270px;}
}

@media (min-width: 768px) and (max-width: 939px) {
  #events {margin-left: 0px;}
  div#lw {width: 768px}
  body.marketing #lw li.lwe {width: 210px;}
}

@media (max-width: 767px) {
  #events {margin-left: 0px}
  body.marketing #lw li.lwe {width:100%; float: none; margin: 0px 0px 20px 0px; padding: 10px; box-sizing: border-box;}
}

p.more {text-align: right}

/* ---------------------------------------------------------------------------------- INDEX TABLE */

/*remember to set image size to "large" */

.table tr td:first-child {
  width: 250px; 
  padding: 30px 30px 30px 0px;
}

.table td {
  padding: 30px 0px 10px;
  border-top: none
}

.table tr {
  border-bottom: 1px solid #ddd;
}

.table tr:last-child {
  border-bottom: none;
}

.table img {margin-top: 10px}

.table td h2,
.table td h3, 
.table td h4 {margin: 0px 0px 10px !important}

@media (max-width: 500px) {
  .table td {display: block; padding: 0px 0px 20px}
  .table tr td:first-child {width: 100%; padding-bottom: 10px}
  .table tr:last-child {border-bottom: none;}
}

/* FIX IE10+ IMAGE SIZE ISSUE */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  table.table img {width: 135px}
}

/* ------------------------------------------------------------------------------ Buttons */

 a.button {
    color: #333;
    background-color: #fdb913;
    border-radius: 50px; 
    height: 50px;
    padding: 15px 30px 15px 30px;
    text-align: center;
    font-size: 18px;
    line-height: 38px;
    font-weight: 300;
    letter-spacing: -0.01em;;
    white-space: nowrap;
    cursor: pointer; 
    margin: 0px;
    text-shadow: none;
}

a.button:hover {
    color: #666;
    background-color: #fff; 
    text-decoration: none !important;
    border: 1px solid #eee
}

#prefooter a.button {background-color: #fdb913; color: #333}
#prefooter a.button:hover {background-color: #fff;}

/* ------------------------------------------------------------------------------ Content Body Accordions */

.accordion-group {
  margin-bottom: 20px;
  border: 0
}

#content-body .accordion-heading {
  padding: 15px;
  background-color: #eee;
  line-height: 30px;
  font-size: 20px !important;
  font-weight: 900;
}

.accordion-inner {
    background-color: #eee;
    padding: 20px;
    border-bottom: 10px solid #ccc;
}

.accordion-heading a:hover {
    text-decoration: none;
}


/* ------------------------------------------------------------------------------ Prefooter*/

#prefooter_wrapper {
  box-shadow: none;
  padding: 60px 0px
}

#prefooter-rows {
  width: 100%;
}

#prefooter.light {
    background: transparent;
}

#prefooter.light a {
  background-color: transparent;
}

#prefooter i, #prefooter em {
    margin-left: 0px;
    padding-right: 4px;
    opacity: 1;
}

.prefooter-header i, .prefooter-header em {
    margin-right: 5px;
    padding-right: 0px;
    opacity: .5;
}

#prefooter_wrapper .row-fluid .prefooter-header {
    margin-bottom: 10px;
    font-weight: 700;
    color: #999;
}

#prefooter p {
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  max-width: 1170px;
}

@media (max-width: 767px) {
    #prefooter > div {padding: 60px 15px;}
}