/**
 * CH01 - Resets
 * CH02 - Typography
 * CH03 - Page Structure
 * CH04 - Header & Navigation
 * CH05 - Content & Media
 * CH06 - Footer
 * CH07 - Miscellaneous
 * CH08 - Media Queries
**/

/**

 * Color Guide 

**/

/* -----------------------------------------------------------------------------
CH01 - Resets
------------------------------------------------------------------------------*/

.clearMargins {
  margin: 0;
}

/* -----------------------------------------------------------------------------
CH02 - Typography
------------------------------------------------------------------------------*/
#main .lightText,
#main .lightText body,
#main .lightText p,
#main .lightText h1,
#main .lightText h2,
#main .lightText h3,
#main .lightText h4,
#main .lightText h5,
#main .lightText h6 {
  color: #fff;
}

#main .greenText,
#main .greenText body,
#main .greenText p,
#main .greenText h1,
#main .greenText h2,
#main .greenText h3,
#main .greenText h4,
#main .greenText h5,
#main .greenText h6 {
  color: #67C04F;
}

#main p {}

#main h1 {}

#main h2 {}

#main .underline h2::after {
  content: "";
  display: block;
  width: 50px;
  height: 5px;
  background-color: #67C04F;
  margin-top: 24px;
}

#main .lightText .underline h2::after {
  background-color: #fff;
}

#main .underline.fusion-title-center h2::after {
  margin-left: auto;
  margin-right: auto;
}

#main h3 {}

#main h4 {}

#main h5 {}

#main h6 {}

#main largeText {
  font-size: 1.2em;
}

#main smallText {}
/* -----------------------------------------------------------------------------
CH03 - Page Structure
------------------------------------------------------------------------------*/

.hidden {
  display: none;
}
.pullLeft {
  float: left;
}

.pullRight {
  float: right;
}

.clearLeft {
  clear: left;
}

.halfWidth {
  width: 50%;
  padding-right: 20px
}

.alignMiddle {
	vertical-align: middle;
}

/* -----------------------------------------------------------------------------
CH04 - Header & Navigation
------------------------------------------------------------------------------*/
/* secondary menu */
.fusion-secondary-header {
  position: fixed;
  width: 100%;
  z-index: 1000;
  padding: 4px 0;
}

.fusion-secondary-header .fusion-alignleft a {
  color: #fff;
  display: inline-block;
  padding: 0px 16px;
  border-left: 1px solid #fff;
  text-transform: uppercase;
}

.fusion-secondary-header .fusion-alignleft a:hover {
  color: #67C04F;
}

.fusion-secondary-header .fusion-alignleft a:first-child{
  border-left: none;
}

.fusion-secondary-header .fusion-alignright {
  text-align: right;
  padding: 0 24px;
}

.fusion-secondary-header .fusion-alignright a {
	color: #fff;
	text-transform: uppercase;
}

.fusion-secondary-header .fusion-alignright .btn {
  width: auto;
  text-align: center;
  padding: 8px 24px;
  margin-right: 1px;
  float: none;
  color: #000;
  font-weight: 600;
  text-transform: uppercase;
}

.fusion-secondary-header .fusion-alignright .btn i {
  transform: rotateY(180deg);
  margin-right: 8px;
}

.fusion-secondary-header .fusion-alignright .greenBtn:hover {
  color: #67C04F;
}
  
.fusion-secondary-header .fusion-alignright .whiteBtn:hover {
  color: #fff;
}
  
.fusion-header {
  padding-top: 40px;
}

/* slider */
.rev_slider_wrapper h1 {
  font-size: 60px;
  line-height: 64px;
  font-weight: 400;
}

.rev_slider_wrapper h1::after {
  content: "";
  width: 70px;
  height: 5px;
  background-color: #67C04F;
  display: block;
  margin-top: 32px;
}
.rev_slider_wrapper .banner-content {
  display: block;
  width: 600px;
  white-space: normal;
}

@media (max-width: 640px) {
  .fusion-logo img {
    max-width: 150px;
  }
  .fusion-secondary-header .fusion-alignleft {
    display: flex;
    justify-content: space-between;
    padding: 5px;
  }
  .fusion-secondary-header .fusion-alignleft a {
    padding: 0;
    border: none;
    font-size: 10px;
    text-align: center;
  }
  
  .fusion-mobile-menu-design-modern.fusion-header-v3 .fusion-header {
    transform: translateY(33px);
  }
  
  .fusion-mobile-menu-icons a {
    line-height: 44px;
  }
}
/* -----------------------------------------------------------------------------
CH05 - Content & Media
------------------------------------------------------------------------------*/

.alignCenter {
	text-align: center;
}

/* ------------------- 
   CH05.1 - Buttons 
---------------------- */

.btn {
	display: inline-block;
	width: 220px;
	padding: 10px;
}

.greenBtn {
  color: #000;
  background-color: #67C04F;
  border: 1px solid #67C04F;
}

.greenBtn:hover {
  color: #67C04F;
  background-color: transparent;
  border: 1px solid #67C04F;
}

.whiteBtn {
  color: #000;
  background-color: #fff;
  border: 1px solid #fff;
}

.whiteBtn:hover {
  color: #fff;
  background-color: transparent;
  border: 1px solid #fff;
}
/* -------------------

   CH05.2 - Content Panel

---------------------- */

.contentPanel {
  background-color: rgba(0,0,0,0);
  color: #fff;
  text-align: center;
  height: 350px;
  display: flex;
  align-items:center;
  justify-content: center;
  flex-direction: column;
  transition: .4s background-color;
  cursor: pointer;
  padding: 48px 24px 24px;
  position: relative;
  overflow: hidden;
}

#wrapper .contentPanel h2 {
  color: #fff;
  text-align: center;
  font-weight: 400;
  font-size: 24px;
}

.contentPanel h2::after {
  content: "";
  display: block;
  width: 0px;
  height: 4px;
  background-color: #000;
  margin: 8px auto;
  transition: .4s width;
}

.contentPanel p {
  max-height: 0;
  opacity: 0;
  overflow:hidden;
  margin: 0;
  transition: .8s .2s max-height, .4s .2s opacity;
}

.contentPanel .btn {
    color: #67c04f;
    background-color: #3d3d3d;
    width: 100%;
    display: block;
    position: absolute;
    left: 0;
    bottom: -50px;
    transition: .4s .2s bottom, 4s background-color;
}

.contentPanel:hover {
  background-color: #67C04F;
}

#wrapper .contentPanel:hover h2 {
  color: #000;
  font-weight: 600 !important;
}

.contentPanel:hover h2::after {
  width: 75px;
}

.contentPanel:hover p {
  color: #000;
  margin-bottom: 24px;
  max-height: 250px;
  opacity: 1;
}

.contentPanel:hover .contentPanel-content {
  flex-grow: 1;
}

.contentPanel:hover .btn {
  bottom: 0;
}

.contentPanel:hover .btn:hover {
  background-color: rgba(0,0,0,.8);
}

@media (max-width: 640px) {  
  .contentPanels {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .contentPanel {
    height: auto;
  } 
  
}
/* brand icon */
.brandIcon {
  background-color: #fff;
  width: calc(calc(100% - 32px) / 8);
  display: block;
  float: left;
  margin: 2px;
  cursor: pointer;
  transition: .4s transform;
}

.home #AccreditedRepairers .brandIcon{
  width: calc(calc(100% - 32px) / 8);
}

.brandIcon:hover {
    transform: scale(1.1);
    position: relative;
    z-index: 2;
    box-shadow: 0 0 1px 1px rgba(0,0,0,.2);
}

@media (max-width: 640px) {
  #AccreditedRepairers .fusion-column-wrapper {
    padding: 0 !important;
  }
  
  #AccreditedRepairers .logoContainers .fusion-column-wrapper{
    display: flex;
  }
}
/* --------------------------------
   Process Panel
--------------------------------*/
#our_repair_process {
	transform: translateY(-198px);
	margin-bottom: -198px;
}

.processPanel-wrapper {
  background-color: #fff;
  border: 1px solid #ededed;
  transition: .4s transform, .4s box-shadow;
}

.processPanel-wrapper:hover {
  transform: scale(1.05);
  box-shadow: 0 0 3px 2px rgba(0,0,0,.2);
  z-index: 2;
}

.processPanel {
  height: 100%;
  position: relative;
  z-index: 1;
  cursor: pointer;
  padding: 64px 32px;
}

.processPanel p {
  margin-bottom: 0;
}

.processPanel h3 {
  color: #67C04F;
  font-weight: 600;
}
.processPanel-number {
  font-size: 96px;
  line-height: 96px;
  font-weight: 600;
  color: #E5E5E5;
}

/* -----------------------
   Our Brands
-------------------------*/
#our_brands {
    max-width: 1800px;
    margin: auto;
}

#our_brands .brandLogo .fusion-imageframe:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  transition: .4s opacity;
}

#our_brands .brandLogo:hover .fusion-imageframe:nth-child(2) {
  opacity: 0;
}

/* newsletter signup */
#wrapper #newsletter_signup {
  padding: 96px;
}

#wrapper #newsletter_signup h2 {
    font-size: 48px;
    line-height: 54px;
    font-weight: 400;
}

/* -----------------------
  STORE LOCATOR
-------------------------*/
.store_modal_title {
  margin-top: 24px;
}

.store_locator_visit_website,
.store_locator_call_now,
.store_locator_get_direction {
  background-color: #72bf44;
  margin-top: 6px;
  color: #fff;
  text-align: center;
  border-radius: 2px;
}

.store_locator_visit_website:hover,
.store_locator_call_now:hover,
.store_locator_get_direction:hover {
  background-color: #236826;
}

.store_locator_visit_website .fa-globe:before {
  content: "\f005";
}

.store_locator_result_list_description {
  display: none;
}

/* ---------- SINGLE STORE PAGE --------------------- */
.single-stores #content {
  padding-top: 180px;
}

.single-stores .single-navigation {
  display: none;
}

.single-stores #wrapper #main .post h1.fusion-post-title {
  font-size: 60px;
  line-height: 64px;
  font-weight: 400;
  color: #000;
}

.single-stores .wordpress-store-locator-store-in,
.single-stores .store_locator_single_categories,
.single-stores .store_locator_single_filter,
.single-stores .fusion-sharing-box,
.single-stores .about-author {
  display: none;
}

.single-stores .fusion-meta-info-wrapper {
  display: none;
}

.single-stores .fusion-meta-info {
  padding: 0;
  border: none;
}

.single-stores .store_locator_single_filter~p strong {
  font-size: 32px;
  line-height: 36px;
  font-weight: 700;
  color: #000000;
  display: block;
  margin-bottom: 1.1em;
}

.single-stores .store_locator_single_contact_store a.store_locator_contact_store_button {
  display: none;
}

.single-stores .store_locator_single_contact a:last-child {
  display: none;
}
/* -----------------------------------------------------------------------------
CH06 - Footer
------------------------------------------------------------------------------*/
footer .textwidget {
  font-size: 14px;
  line-height: 1.5em;
}

footer .footer-logo {
  text-align: center;
}

footer .footer-logo .fusion-logo {
    float: none;
    margin-bottom: 48px;
}
/* -----------------------------------------------------------------------------
CH07 - Miscellaneous
------------------------------------------------------------------------------*/
