/********************************************
*	Table of Contents
*	1. Reset Browser Styles: Overrides the default browser styles to start with a clean slate
*	2. Grid Styles: 12 column grid system, please make sure selectivizr v1.0.2 is added to the scripts for ie8 compatibility
*	3. Main Styles: Main text and body styles
*	4. Layout Styles: Custom global branding styles for the header, navigation, content and footer
*	5. Form Styles: Styling forms and associated elements
*	6. Page Specific Styles: Styles that are specific to a certain page or group of pages
*	7. Animations
*	8. IE Styles
********************************************/

/******************************************** 
1. Reset Browser 
********************************************/
body {
  overflow-x: hidden;
  font-size: 0.825em;
}
.portrait-only, .tablet-portrait-only {
  display: block !important;
}
.landscape-only, .desktop-only {
  display: none !important;
}
.tablet-full-width > .col {
  display: block;
  float: none;
  min-height: auto !important;
  width: auto;
}

#business-directory #sidebar {
	padding-top: 95px;
}

/******************************************** 
2. Grid Styles
********************************************/
.gutters > .col {
	margin-left: 4%;
}
ul.gutters {
	margin-left: -4%;
}
ul.gutters > li.col:first-child {
	margin-left: 4%;
}
ul.gutters > li.col {
	margin-bottom: 4%;
}
.grid-1 { width: 8.33333333333%; }
.grid-1-5 { width: 12.49999997%; }
.grid-2 { width: 16.6666666667%; }
.grid-3 { width: 25%; }
.grid-4 { width: 33.3333333333%; }
.grid-5 { width: 41.6666666667%; }
.grid-6 { width: 50%; }
.grid-7 { width: 58.3333333333%; }
.grid-8 { width: 66.6666666667%; }
.grid-9 { width: 75%; }
.grid-10 { width: 83.3333333333%; }
.grid-11 { width: 91.6666666667%; }
.grid-12 { width: 100%; }

.prefix-1 { margin-left: 8.33333333333%; }
.prefix-2 { margin-left: 16.6666666667%; }
.prefix-3 { margin-left: 25%; }
.prefix-4 { margin-left: 33.3333333333%; }
.prefix-5 { margin-left: 41.6666666667%; }
.prefix-6 { margin-left: 50%; }
.prefix-7 { margin-left: 58.3333333333%; }
.prefix-8 { margin-left: 66.6666666667%; }
.prefix-9 { margin-left: 75%; }
.prefix-10 { margin-left: 83.3333333333%; }
.prefix-11 { margin-left: 91.6666666667%; }
.prefix-12 { margin-left: 100%; }

.suffix-1 { margin-right: 8.33333333333%; }
.suffix-2 { margin-right: 16.6666666667%; }
.suffix-3 { margin-right: 25%; }
.suffix-4 { margin-right: 33.3333333333%; }
.suffix-5 { margin-right: 41.6666666667%; }
.suffix-6 { margin-right: 50%; }
.suffix-7 { margin-right: 58.3333333333%; }
.suffix-8 { margin-right: 66.6666666667%; }
.suffix-9 { margin-right: 75%; }
.suffix-10 { margin-right: 83.3333333333%; }
.suffix-11 { margin-right: 91.6666666667%; }
.suffix-12 { margin-right: 100%; }

.gutters .grid-1 { width: 4.666%; }
.gutters .grid-1-5 { width: 8.49999997%; }
.gutters .grid-2 { width: 13.33%; }
.gutters .grid-3 { width: 22%; }
.gutters .grid-4 { width: 30.66%; }
.gutters .grid-5 { width: 39.33%; }
.gutters .grid-6 { width: 48.0%; }
.gutters .grid-7 { width: 56.66%; }
.gutters .grid-8 { width: 65.33%; }
.gutters .grid-9 { width: 74%; }
.gutters .grid-10 { width: 82.66%; }
.gutters .grid-11 { width: 91.33%; }
.gutters .grid-12 { width: 100%; }

.gutters .prefix-1 { margin-left: 8.666% ; }
.gutters .prefix-2 { margin-left: 17.33%; }
.gutters .prefix-3 { margin-left: 26%; }
.gutters .prefix-4 { margin-left: 34.66%; }
.gutters .prefix-5 { margin-left: 43.33%; }
.gutters .prefix-6 { margin-left: 52.0%; }
.gutters .prefix-7 { margin-left: 60.66%; }
.gutters .prefix-8 { margin-left: 69.33%; }
.gutters .prefix-9 { margin-left: 78.0%; }
.gutters .prefix-10 { margin-left: 86.66%; }
.gutters .prefix-11 { margin-left: 95.33%; }
.gutters .prefix-12 { margin-left: 100%; }

.gutters .prefix-1:first-child { margin-left: 6.666%; }
.gutters .prefix-2:first-child { margin-left: 15.33%; }
.gutters .prefix-3:first-child { margin-left: 24%; }
.gutters .prefix-4:first-child { margin-left: 32.66%; }
.gutters .prefix-5:first-child { margin-left: 41.33%; }
.gutters .prefix-6:first-child { margin-left: 50.0%; }
.gutters .prefix-7:first-child { margin-left: 58.66%; }
.gutters .prefix-8:first-child { margin-left: 67.33%; }
.gutters .prefix-9:first-child { margin-left: 76%; }
.gutters .prefix-10:first-child { margin-left: 84.66%; }
.gutters .prefix-11:first-child { margin-left: 93.33%; }
.gutters .prefix-12:first-child { margin-left: 100%; }

.gutters .suffix-1 { margin-right: 6.666%; }
.gutters .suffix-2 { margin-right: 15.33%; }
.gutters .suffix-3 { margin-right: 24%; }
.gutters .suffix-4 { margin-right: 32.66%; }
.gutters .suffix-5 { margin-right: 41.33%; }
.gutters .suffix-6 { margin-right: 50.0%; }
.gutters .suffix-7 { margin-right: 58.66%; }
.gutters .suffix-8 { margin-right: 67.33%; }
.gutters .suffix-9 { margin-right: 76%; }
.gutters .suffix-10 { margin-right: 84.66%; }
.gutters .suffix-11 { margin-right: 93.33%; }
.gutters .suffix-12 { margin-right: 100%; }

.flex-row {
	display: block;
}
.flex-row > .col {
	margin-left: 0;
}

/******************************************** 
3. Main Styles
********************************************/


/******************************************** 
4. Layout Styles
********************************************/
/* 4.1: Containers */
.content {
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
}

/* 4.2: Header */

.col.head-logo.grid-4 {
	width: 100%;
	clear: both;
	text-align: center;
	margin-bottom: 20px;
}
.col.head-deadline.grid-3 {
	width: 230px;
	float: left;
}
.col.head-social.grid-2 {
	width: 115px;
}
.col.head-contact.grid-3 {
	width: 325px;
	float: right;
}

#sidebar {
	margin-top: 30px;
}

/* 4.3: Footer */

/* 4.4: Navigation */
.menu-toggle {
  background-image: url("../img/menu-mobile-toggle.png");
  background-position: center center;
  background-repeat: no-repeat;
  cursor: pointer;
  display: block;
  height: 40px;
  position: absolute;
  right: 20px;
  text-indent: -9999em;
  width: 40px;
	-moz-transition: all 0.5s ease 0.3s;
	-webkit-transition: all 0.5s ease 0.3s;
	transition: all 0.5s ease 0.3s;
	border:none;
	background-color: transparent;
}
/*.menu-open .menu-toggle {
  right: 250px;
}*/
#container {
	-moz-transition: margin-left 0.5s ease 0.3s;
	-webkit-transition: margin-left 0.5s ease 0.3s;
	transition: margin-left 0.5s ease 0.3s;
	margin-left: 0px;
}
.menu-open #container {
	margin-left: -250px;
}
#navigation {
  height: 40px;
}
#navigation .menu {
  background-color: #454545;
  height: 100%;
  position: fixed;
  right: -250px;
  top: 0;
  width: 250px;
	-moz-transition: all 0.5s ease 0.3s;
	-webkit-transition: all 0.5s ease 0.3s;
	transition: all 0.5s ease 0.3s;
}
.menu-open #navigation .menu {
  right: 0px;
}
#navigation ul {
  float: none;
  position: static;
  width: 100%;
}
#navigation li {
  margin: 0;
  padding: 0;
  width: 100%;
}
#navigation li:hover {
	background-color: rgba(255,255,255,0.1);
}
#navigation li.has-children::after {
	border-bottom: 4px solid transparent;
	border-left: 5px solid #fff;
	border-top: 4px solid transparent;
	content: " ";
	height: 0px;
	position: absolute;
	right: 10px;
	top: 24px;
	width: 0;
	/* margin-top: -4px; */
}
#navigation li.has-children.browsing::after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid #fff;
  top: 15px;
}
#navigation a {
  border-bottom: 1px dashed #777;
  display: block;
  color: #ffffff;
  padding-left: 12px;
  padding-right: 12px;
  width: 100%;
}
#navigation ul ul {
  background-color: transparent;
  border: medium none;
  margin: 0;
  padding: 0;
  position: static;
  width: 100%;
  display: none;
}
#navigation ul li:hover > ul {
  display: none;
}
#navigation ul li.browsing > ul {
  display: block !important;
}
#navigation ul ul li {
  border-bottom: none;
  padding-right: 0px;
}
#navigation ul ul li:hover {
  background-color: transparent;
}
#navigation ul ul li a {
  border-bottom: none;
  font-size: 1em;
  opacity: 0.7;
}
#navigation li.active, #navigation li:hover {
	background-color: inherit;
}

/* 4.5: Page Content */

.overlay-text {
	padding:30px;
}
.overlay-text h1 {
	font-size:23px;
}

.cta-box-1 {
	margin-bottom: 20px;
}
.cta-box-2 {
	margin-bottom: 20px;	
}
.cta-box-3 {

}

.home-latest-mag {
	width: 49% !important;
}
.home-latest-mag-text {
	width: 49% !important;
	padding-right: 30px;
}

.home-event-title {
	width: 100% !important;
}
.home-latest-event-image {
	width: 39% !important;
}
.home-latest-event-text {
	width: 59% !important;	
}
.col.grid-1-5.footer-magazine {
	width: 25%;
}

/******************************************** 
5. Form Styles
********************************************/


/******************************************** 
6. Page Specific Styles
********************************************/

  #directory-names ul {
      display: none;
  }
  #directory-names select {
      display: inline-block;
  }

.selectdiv {
  position: relative;
  float: left;
  width: 100%;
}

#event-search .button {
	width: 100%;
	margin-top: 10px;
	margin-left: 0;
	background-image: none;
	text-indent: 0;
	border-radius: 3px;
}

.business-listing .image {
	width: 140px;
	background-color: #FFF;
	padding: 30px 20px;
	float: left;
	margin-right: 25px;
	text-align: center;
}
.business-listing-text {
	float: left;
	width: 300px !important;
}
.sub-footer-mags .grid-2 {
	width: 200px !important;
}
#sub-footer .grid-6 {
	text-align: center;
	width: 100%;
	margin: 30px 0;
}
#sub-footer .grid-6 h3 {
	padding: 10px 14%;
	margin-top: 0px;
}
#sub-footer .sub-footer-mags {
	position: unset;
	left: 0px;
	clear: both;
	width: 600px;
	margin-left: auto;
	margin-right: auto;
}
#sub-footer {
	height: auto;
	margin-bottom: 0px;
	padding-bottom: 30px;
}

.quote {
	background-color: #f4f4f4;
	padding: 0px 20px 20px 20px;
	margin-top: 40px;
	width: 100%;
	display: block;
	clear: both;
	margin-right: 0;
	border-bottom: 2px solid #4eaac5;
}

#offers-box li.cta-box {
	padding: 0px;
	margin: 0 0 15px 0 !important;
	display: inline-flex;
	clear: both;
	width: 100%;
}
#offers-box li.cta-box {
	width: 100% !important;
}
#offers-box li.cta-box:last-of-type {
	margin-bottom:0px !important;
}

#offers-box .cta-box {
	float: none;
	width: 100%;
	margin-left: 0 !important;
}

.advertise-boxes .grid-4 h4 a {
	font-size: 14px;
}

.local-walks .image {
	width:100%;
}
.entry.local-walk {
	margin-bottom: 20px;
}

    .slider {
      width: 180px; height: auto;
    }
        .slider > ul > li {
          width: 180px; height: auto;
        }

/* Our Magazines */

.our-magazines-section .grid-2 {
	width: 40%;
}
.our-magazines-section h4 {
	font-weight: normal;
	font-size: 15px;
	padding-bottom: 5px;
}
.our-magazines-section h5 {
	font-size: 13px;
	color: #555;
}
.our-magazines-section .grid-4 .col:first-child {
	margin-left: 16px;
}
#magazines .our-magazines-section li.col {
	margin-left: 17px;
}


/******************************************** 
7. Scroll Animations
********************************************/
.st-hide, .st-top-to-bottom, .st-bottom-to-top, .st-left-to-right, .st-right-to-left, .st-fade, .st-load {
	opacity: 1 !important;
	left: auto !important;
	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	-webkit-transition: none !important;
	-moz-transition: none !important;
	transition: none !important;
}

#page-advertise .grid-12 {
	margin-bottom: 0px;
}
#page-advertise .advertise-cta h3 {
	font-size: 18px;
}
#page-advertise .advertise-cta a.button {
	background-color: #f29a1c;
	font-size: 14px;
}
#page-advertise .col.grid-3.align-center a {
	color: #333 !important;
	font-size: 15px;
}
#benefits .row > .col {
	width: 48.0%;
}

#footer-social-media ul a li.li-twitter, #footer-social-media ul a li.li-facebook {
	padding-left: 40px;
	background-size: 24px;
	height: auto;
	min-height: 24px;
}
#footer p.ico-telephone {
	font-size: 18px;
	background-size: 16px;
	padding-left: 24px;
}
#footer p, #footer li a {
	font-size: 0.95em;
}
#footer-social-media span {
	font-size: 1.1em;
	padding-top: 0.2em;
	display: inline-block;
}
#footer-social-media ul a li.li-twitter, #footer-social-media ul {
	margin-bottom: 0;
	padding-bottom: 0;
}


#latest-magazines {
	justify-content: center;
}
#latest-magazines > .latest-issue {
	flex-basis: 33%;
	max-width: 33%;
	margin-bottom: 36px;
}
.areas-covered > .default.cell-tab-2 {
	flex: 0 0 calc(50% - 12px);
	max-width: calc(50% - 12px);
}

.advertising-rates {
	flex-wrap: wrap;
}
.advertising-rates__table {
	flex-basis: 100%;
}