/*
 Theme Name:   Athens Running Company
 Theme URI:    http://sproutsdesigns.com
 Description:  Theme for Athens Running Company in Athens GA
 Author:       Andrew
 Author URI:   http://sproutsdesigns.com
 Template:     Divi
 Version:      1.1.5
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  divi-child
*/

/* The design calls for futura as the base font! */
body {
	font-family: "futura-pt", sans-serif;
}

/************************************************/
/************************************************/
/*       	    [HOME STYLING]                  */
/************************************************/
/************************************************/
/* Had to style the rotator text manually */
h2#js-rotating {
	color: #fff;
	font-family: "futura-pt-condensed", sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 8em;
	letter-spacing: 5px;
}
/* Our logo is an SVG so I'm restricting it to this max width */
#logo {
	width: 300px!important;
}

/* Menu styling so I don't have to go through and click a bunch of stuff */
ul#top-menu {
	font-family: "futura-pt-condensed", sans-serif;
	font-style: italic;
	font-weight: 800;
}

/* Divi doesn't have a universal circular image class so this is what I'm doing instead */
.imgCircle {
	/*width: 500px!important;
	height: 300px!important;*/
	display: block;
}

/* Can't set my tooltip to have the CSS I want so I'm doing it here */
.home .dwd-map-content h3 {
	font-family: "futura-pt-condensed",sans-serif;
	font-style: italic;
	font-weight: 800;
}

.home .dwd-map-content .infowindow {
	font-family: "futura-pt",sans-serif;
	font-style: normal;
	font-weight: 400;
}
/* owl nav settings */
.owl-prev {
	top: 50%;
    left: -40px;
	position: absolute;
	background: rgba(60,60,60,.5)!important;
}
.owl-next {
	top: 50%;
    right: -40px;
	position: absolute;
	background: rgba(60,60,60,.5)!important;
}
.owl-next:hover,
.owl-prev:hover {
	background: rgba(60,60,60,1)!important;
}
/************************************************/
/************************************************/
/*          [FIT PROCESS STYLING]               */
/************************************************/
/************************************************/
/* Have to add a background to the navbar for this page only because the top has a white bg*/
.page-id-29345 #main-header {
	background: rgba(10,10,10,0.44);
}
/* 
I was thinking about exploring a way to do a full BG as the track,
but I don't think it will work.
Instead, I'm jerry-rigging each piece to be positioned together.
@TODO: Test on multiple sizes and devices
@TODO: Disable on mobile
@TODO: Tweak mobile layout
*/
.trackSection1 img {
	position: absolute;
	top: -100px;
    left: -80px;
}
.trackSection2 img {
	position: absolute;
	top: -200px;
    left: -88px;
}

.faded {
	position: relative;
	display: inline-block;
	color: #8a888a;
  }
  .faded:after {
	content: "";
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-collapse: separate;
  }
  .faded.faded-left:after {
	box-shadow: inset 40px 0 40px -16px;
  }
.page-id-29345 a {
	color: #FFF;
}
.page-id-29345 a:hover {
	color: #d02327;
}

/************************************************/
/************************************************/
/*       	    [COMM STYLING]                  */
/************************************************/
/************************************************/
.page-id-29294 #main-header {
	background: rgba(10,10,10,0.44);
}
.event-image-dc {
	width: 300px!important;
	height: 300px!important;
	margin: auto;
	padding: 40px 20px;
}
.col-sm-4 article {
	box-shadow: 0px 2px 18px 0px rgba(0,0,0,0.3);
}
.col-sm-4 article:hover {
	box-shadow: 0px 2px 25px 0px rgba(252, 8, 8, 0.7);
}
.col-sm-4 article h3 a {
	font-family: "futura-pt-condensed",sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 30px;
	color: #d02327!important;
}

.col-sm-4 article p {
	font-size: 24px;
	font-family: "futura-pt-condensed",sans-serif;
	font-style: normal;
	font-weight: 700;
}

.page-id-29294 .entry-content table,
.page-id-29294 .wsite-multicol-col {
	border: none;
}

.page-id-29971 .wsite-multicol-col {
	padding-top: 0px!important;
}

.page-id-29971 .wsite-content-title {
	font-family: "futura-pt-condensed",sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 30px;
	color: #d02327!important;
}
.page-id-29294 .wsite-multicol-col {
	color: #FFF
}

#slide-down {
    border: 1px solid black;
}
#slide-down-body{
    height: 40%;    
    overflow: hidden!important;
    transition:             height 500ms ease;
        -moz-transition:    height 500ms ease;
        -ms-transition:     height 500ms ease;
        -o-transition:      height 500ms ease;
        -webkit-transition: height 500ms ease;
}
.expanded {
    height: 100% !important;
}
.dollar .percent-value:before { content:'$';}
.greyscale img {
	-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
	filter: grayscale(100%);
	transition: 250ms all ease-in-out;
	-webkit-transition: 250ms all ease-in-out;
}

.greyscale img:hover {
	-webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
}

#ff-stream-1 {
	background: #FFF!important;
}

/************************************************/
/************************************************/
/*       	    [ABOUT STYLING]                  */
/************************************************/
/************************************************/

.pum-theme-29916 .pum-title, .pum-theme-enterprise-blue .pum-title {
	font-family: "futura-pt-condensed", sans-serif!important;
	color: #d02327!important;
	font-style: normal;	
	text-transform: uppercase;
	font-weight: bold;
}
.pum-theme-29916 .pum-content, .pum-theme-enterprise-blue .pum-content {
	font-size: 20px;
}
.pum-theme-29916 .pum-content, .pum-theme-enterprise-blue .pum-content h2 {
	font-family: "futura-pt-condensed", sans-serif;
	font-weight: bold;
}
/************************************************/
/************************************************/
/*       	    [EVENT STYLING]                  */
/************************************************/
/************************************************/
.page-calendar #main-header {
	background: rgba(10,10,10,0.44);
}

.page-calendar .mc-image  {
	height: 300px!important;
}





/************************************************/
/************************************************/
/*       	    [MISC STYLING]                  */
/************************************************/
/************************************************/


/* Divi call to action 1 line */
/* Laptops and desktops */
@media only screen and ( min-width: 1100px ) { 
	a.et_pb_promo_button.et_pb_button{
	float: right;
	clear:both;
	margin-top:-10%!important; /*edit as required*/
	}
	 
	.et_pb_promo_description {
	width: 75%; /* edit as required */
	clear:right;
	}
}
.entry-content table, body.et-pb-preview #main-content .container table,
.entry-content tr td, body.et-pb-preview #main-content .container tr td {
	border: none!important;
}

#timingToggle {
	border: none;
	padding: 100px!important;
}
/* style the opened mobile menu hamburger (make it an 'X') */  
div.mobile_nav.opened .mobile_menu_bar:before {
    font-family: "ETmodules";
    content: "\4d"; 
}
div.mobile_nav.opened .mobile_menu_bar:before, div.mobile_nav.closed .mobile_menu_bar:before {
    color: #d02327; 
}
.et_mobile_menu {
	border-top: 3px solid #d02327;
}
.home #top-header,
.page-id-29294 #top-header, 
.page-id-29345 #top-header,
.page-id-29641 #top-header,
.page-id-29971 #top-header {
	display:none!important;
}
.home #main-header,
.page-id-29294 #main-header,
.page-id-29345 #main-header,
.page-id-29641 #main-header, 
.page-id-29971 #main-header {
	top: 0px!important;
}
/************************************************/
/************************************************/
/*       	    [Mobile STYLING]                  */
/************************************************/
/************************************************/

/****** Menu Full-screen ******/

/* Hide submenu */
.et_mobile_menu .menu-item-has-children > a { 
	background-color: transparent; 
}
#main-header .et_mobile_menu li ul.sub-menu.hide { 
	display: none !important; 
	visibility: hidden !important;  
	transition: .7s ease-in-out;
}
#main-header .et_mobile_menu li ul.sub-menu.visible { 
	display: block !important; 
	visibility: visible !important;
 }
.et_mobile_menu .menu-item-has-children > a:after { 
	font-family: "ETmodules";
         font-size: 22px;
         font-weight: 800;
         content: "3"; 
	position: absolute; 
	right: 55px;

}

/* Font Awesome */
.fa {
    margin: 10px ;
  }

@media screen and (max-width: 980px) {
  .et_header_style_centered #main-header {
    position: fixed;
  }
  .et_header_style_centered #main-header .mobile_nav {
    background-color: transparent;
  }
  .mobile_nav.closed .select_page {
    display: none;
  }
  .et-fixed-header#main-header {
    background-color: transparent !important;
  }
}
.et_mobile_menu {
  top: 0;
  left: 0;
  position: fixed;
  z-index: 9998;
  overflow: scroll !important;
  background-color: rgba(10, 10, 10, 0.9) !important;
  margin-left: -30px;
  padding: 25% 0;
  height: 100%;
  width: calc( 100% + 60px);
  border-top: none;
}
.et_mobile_menu li a {
  text-align: center;
  font-size: 1.55em;
  border: 0;
  padding: 5% 0;
  text-transform: uppercase;
  letter-spacing: 6px;
}

.mobile_nav ul#mobile_menu .current_page_item > a {
  color: #d02327;
  background-color: rgba(255,255,255, 0.1);
}
.mobile_nav ul#mobile_menu li ul li a {
  font-size: 1.05em !important;
  margin: auto;
  padding-top: 0.2em;
}
.et_mobile_menu li a:hover {
  color: #999;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.mobile_nav.opened .mobile_menu_bar:before {
  content: "\4d";
  color: #fff;
}
span.mobile_menu_bar {
  z-index: 9999;
}
/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {
	
  }
   
  /*** Responsive Styles Standard Desktop Only ***/
  @media all and (min-width: 1100px) and (max-width: 1405px) {
   
  }
   
  /*** Responsive Styles Tablet And Below ***/
  @media all and (max-width: 980px) {
	#main-header {
		position: fixed!important;
	}
   	/* Re-enable the secondary header for smartphones */
	.home #top-header,
	.page-id-29294 #top-header, 
	.page-id-29345 #top-header,
	.page-id-29641 #top-header,
	.page-id-29971 #top-header {
		display:block!important;
	}
	/* We displaced the navbar earlier in order to compensate for no secondary nav; this is reverting that change */
	.home #main-header,
	.page-id-29294 #main-header,
	.page-id-29345 #main-header,
	.page-id-29641 #main-header, 
	.page-id-29971 #main-header {
		top: 30px!important;
	}
	.page-id-29294 #main-header {
		margin-top:30px;
	}
	#main-header.et-fixed-header {
		background-color: rgba(10,10,10,0.44)!important;
		top: 0px!important; /* Stick nav to top*/
	}
	/*Products home button styling*/
	body .page-29641 #page-container .et_pb_fullwidth_header_0 .et_pb_button_one.et_pb_button {
		border-color: #ffffff;
		border-radius: 2px;
		font-size: 16px;
		font-weight: 700!important;
		text-transform: uppercase!important;
		padding-left: 0.7em;
		padding-right: 1.6em;
	}
	/* #runathens section icon sizes */
	.wp-image-30086,
	.wp-image-30088,
	.wp-image-30090 {
		width: 25px!important;
	}
	.runAthens {
	position: absolute;
	bottom: 20px!important;
	right: 20px!important;
	}
  }
   
  /*** Responsive Styles Tablet Only ***/
  @media all and (min-width: 768px) and (max-width: 980px) {
   /* We displaced the navbar earlier in order to compensate for no secondary nav; this is reverting that change */
	.home #main-header,
	.page-id-29294 #main-header,
	.page-id-29345 #main-header,
	.page-id-29641 #main-header, 
	.page-id-29971 #main-header {
		top: 30px!important;
	}
	#main-header.et-fixed-header {
		background-color: rgba(10,10,10,0.44)!important;
		top: 0px!important; /* Stick nav to top*/
	}
	.home .et_pb_column.et_pb_column_1_3.et_pb_column_2 {
		margin-left: 0px;
	}
		/* fix the ARC in our name image */
		.home .et_pb_module.et_pb_image.et_pb_image_1.et_always_center_on_mobile {
			padding: 20px;
			margin-left: 0!important;
		}
	/* Snap into your run phone image */
	.home .et_pb_column.et_pb_column_2_3.et_pb_column_4 {
		margin-left: 0!important;
		padding: 20px;
	}
	.post-29345 h1.et_pb_module_header {
		font-size: 4em!important;
	}
	.post-29294 .et_pb_text.et_pb_module.et_pb_bg_layout_light.et_pb_text_align_left.et_pb_text_4 h1 {
	font-size: 40px;
	}
	/*hide phone email on mobile*/
	.footerRight {
		display:none;
	}
  }
   
  /*** Responsive Styles Smartphone Only ***/
  @media all and (max-width: 767px) {


	/* Inline secondary menu */
	#et-info, #et-secondary-menu {
		display: inline-flex;
		float: none;
		text-align: center;
	}
	#et-info-phone {
		float: left;
		width: 50%;
	}
	#top-header a {
		width:50%;
	}
	/* Reduce Main header text size */
	.home .et_pb_fullwidth_header_0 .header-content h1 {
		font-size: 5em;
	}
	h2#js-rotating {
		font-size: 5em;
	}
	/* Fix first row margin */
	.home .et_pb_column.et_pb_column_1_3.et_pb_column_2 {
		margin-left: 0px;
	}
		/* Also add padding for the text  */
		.home .et_pb_text.et_pb_module.et_pb_bg_layout_dark.et_pb_text_align_left.homeAthensSection.et_pb_text_1 {
			padding-right: 20px;
		}
		/* fix the ARC in our name image */
		.home .et_pb_module.et_pb_image.et_pb_image_1.et_always_center_on_mobile {
			padding: 20px;
			margin-left: 0!important;
		}
	/* Snap into your run phone image */
	.home .et_pb_column.et_pb_column_2_3.et_pb_column_4 {
		margin-left: 0!important;
		padding: 20px;
	}
	.post-29345 h1.et_pb_module_header {
		font-size: 4em!important;
	}
	.post-29294 .et_pb_text.et_pb_module.et_pb_bg_layout_light.et_pb_text_align_left.et_pb_text_4 h1 {
	font-size: 40px;
	}
	/*hide phone email on mobile*/
	.footerRight {
		display:none;
	}
  }
   
  /*** Responsive Styles Smartphone Portrait ***/
  @media all and (max-width: 600px) {
	.home .et_pb_column .et_pb_map, .home .et_pb_fullwidth_section .et_pb_map {
		height: 300px;
	}
	.page-id-29345 .et_pb_column_25 {

		right: 50px;
	
	} 	
  }
  
/************************************************/
/************************************************/
/*       	    [FOOT STYLING]                  */
/************************************************/
/************************************************/


/* Let's get the footer looking right  */
.footerCopyHeader {
	font-family: "futura-pt-condensed", sans-serif;
	font-style: normal;	
	text-transform: uppercase;
	font-style: italic; 
	color: #888585;
	font-weight: bold;
}
.footerCopyHeader a {
	color: #999899;
}
/* fix event logo sizing and spacing */
#grid-29902 img.tg-item-image {
	width: 150px;
    margin: 50px auto;
}
  .footerRight {
	float: right;
  }
  .footerRight h3 {
	  color: #8c8c8c!important;
  }

/************************************************/
/************************************************/
/*             [EVENT STYLING]                  */
/************************************************/
/************************************************/

/* Single events */
.incsub_event-template-default #main-header {
	background: rgba(10,10,10,0.44);
}

/************************************************/
/************************************************/
/*             [TABLE STYLING]                  */
/************************************************/
/************************************************/

/*Label styling for the top menu to make it easy to read*/
.page-id-29971 .wpdt-c .btn-default {
	color: #FFF;
}

.page-id-29971 .wpdt-c .form-control:focus {
	color: #FFF;
}

.page-id-29971 .wpDataTablesWrapper table.wpDataTable > thead > tr > th {
	background-color: #3c3c3c;
	border:none;
	padding: 17px 10px;
	font-family: "futura-pt-condensed", sans-serif;
	text-transform: uppercase;
	font-style: italic;
	font-size: 25px;
}
.page-id-29971 tbody tr {
	font-size: 18px;
}

.page-id-29971 button.DTTT_button, div.DTTT_button, a.DTTT_button {
	color: #FFF;
}