/* -- Location Pages -- */

.desktop #mainContent { padding-top:30px; }

/* Active Sidenav Item */
.area-CustomerServiceArea #sideBox ul li a[href*="store-locations"] { font-weight:800; }

/* Custom */
@media(min-width:1280px){
  .margin-left-30-max  { margin-left:30px; }
  .margin-right-30-max { margin-right:30px; }
}

.page-title-bar { border-bottom:2px solid #e5e5e5; margin:0 0 30px; padding:15px 0; }
.store-location-city  { font:300 36px/1em 'Montserrat'; text-transform:uppercase; letter-spacing:0.25em; border-right:1px solid #ccc; margin:0 30px 0 0; padding:0 30px 0 0; }
.store-location-city.show-city-only { border-right:none; margin-right:0; padding-right:0; }
.store-location-title { font:300 3.2em/1em 'Cormorant'; font-style:italic; }

#section-store-info #social-icons.list-inline > li { padding-left:5px; padding-right:5px; }
#section-store-info #social-icons i { font-size:35px; color:#333; }
#section-store-info #social-icons i:hover, #section-store-info #social-icons i:active, #section-store-info #social-icons i:focus { color:#707070; }
#store-hours p { margin:0; }

#design-services-list { display:flex; width:100%; flex-wrap:wrap; margin:0; padding:0; }
#design-services-list li { flex:1; line-height:.8em; border-right:1px solid #ccc; position:relative;  padding-bottom:30px; }
#design-services-list li:last-child { border-right:none; }
#design-services-list li strong { display:inline-block; margin:0 0 3px; line-height:1em; }
#design-services-list i  { font-size:30px; color:#696969; }
#design-services-list li span.input-field { margin-top:auto; position:absolute; bottom:10px; left:0; width:100%; }
#design-services-list li input[type="radio"] { margin-right:0!important; }

/* Panel Custom */
#section-page-bottom .panel .panel-inner { min-height:350px; }
#section-careers .panel p + p { text-align:left; }
@media(min-width:768px){
  #section-careers .panel p + p { margin:10% 0 0!important; }
}

/* Fixes - Spacing Utilities in template messing up layout */
#design-services-title span,
#careers-title span { margin-left:0!important; margin-right:0!important; }


/* Events */

/* Show-Hide events section when events active */
#events-header,
#events-row { display:none; }

.desktop .event-item-content { padding-top:8px; }

/* Monetate Events - Change Monetate Wrapper to style like bootstrap grid - as item is inserted into grid flow */
.desktop #events-row > [id^="monetate_selector"] { float:left; position: relative; min-height: 1px; padding-left: 15px;  padding-right: 15px; width:50%;  }

.title-border-middle { display:block; position:relative; }
.title-border-middle span { background:#fff; padding:0 10px; display:inline-block; z-index:1000; position:relative; }
.title-border-middle::after { content:''; position:absolute; left:0; right:0; top:calc(50% + 3px); height:1px; z-index:0; background: #e5e5e5; }

/* Bottom Border */
.desktop #events-row { margin-bottom: 40px!important;  float: left;  padding-bottom: 5px; position: relative; }
.desktop #events-row::after {  border-bottom: 1px solid #e5e5e5;  content: ''; position: absolute; bottom: 0;  left: 15px; display: block;  width: calc(100% - 30px); }

/* -- Events - Mobile -- */
.mobile .title-border-middle::after { background: #fff!important; }
.mobile #events-header { text-align:center; }

/* Borders */
.mobile #events-header h3 { border-top: 1px solid #e5e5e5; padding-top: 15px; }
.mobile #events-row { position: relative;  margin-bottom: 30px!important; }
.mobile #events-row::after {  border-bottom: 1px solid #ccc;  content: ''; position: absolute; bottom: 0;  left: 15px; display: block;  width: calc(100% - 30px); }

/* Events Content */
.mobile .event-item { margin: 0 12px 24px; }
.mobile .event-item-content { padding:6px 12px 0; }
.mobile .event-item-title { font-size:1.25em!important;  margin:20px 0 10px!important; font-weight:300; }
.mobile .event-item-date { font-size:1.6em!important; margin:12px 0 6px!important; }
.mobile .event-item-time  { margin-bottom: 18px!important; }
.mobile .event-item-copy {}




/* Tablet */
@media(max-width:1028px){
  .wrapper>[id="sideBox"] { display:none; }
  .wrapper>[id="sideBox"] ~ main[id="mainContent"] { width:100%; } 
  #section-page-bottom .panel .panel-inner { min-height:370px; }
}
@media(max-width:804px){
  #section-page-bottom .panel .panel-inner { min-height:400px; }
}



/* -- Design Services Section -- */
#store-location-page-template.is-coming-soon #section-design-services {}
/* Store Page - Coming Soon Styles */

#store-location-page-template.is-coming-soon #section-design-services #section-design-services { display:none; }

#store-location-page-template.is-coming-soon #section-careers { width:100%!important; }
#store-location-page-template.is-coming-soon #section-careers > .panel.panel-box {}
#store-location-page-template.is-coming-soon #section-careers > .panel.panel-box:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
#store-location-page-template.is-coming-soon #section-page-bottom .panel .panel-inner { min-height: auto; float: right; width: 50%; }
#store-location-page-template.is-coming-soon #section-careers > .panel.panel-box > img.panel-box-image { width: 45%; margin:0 5% 0 0; float: left; }
#store-location-page-template.is-coming-soon #section-careers a#careers-link { width: 100%; margin: 30px 0 0 0; }
#store-location-page-template.is-coming-soon #section-careers h2#careers-title { margin-bottom: 5px!important; }
#store-location-page-template.is-coming-soon #section-careers h2#careers-title span { margin-left:0!important; margin-right:0!important; }
#store-location-page-template.is-coming-soon #section-careers .panel p + p { margin:0!important; }

@media (max-width: 1080px){
  #store-location-page-template.is-coming-soon #section-careers a#careers-link { margin: 30px 0 0; }
}
@media (max-width: 768px){
  #store-location-page-template.is-coming-soon #section-careers a#careers-link { margin: 30px 0 15px; }
}

@media (min-width: 768px){
  #store-location-page-template.is-coming-soon #section-careers .panel p + p { margin:0!important; }
}

/* Mobile 
.small #store-location-page-template.is-coming-soon .store-location-city { font-size: 1.7em; }
*/




/* Mobile */
.screen-xs #app-main .m-framework hr { border:none; border-top:1px solid #dfdbd8; }
.screen-xs #categoryHeader { display:none; }

.screen-xs .page-title-bar { margin-left:15px; margin-right:15px; width:calc(100% - 30px)!important; }
.screen-xs .store-location-city { font-size:2em; font-style:normal; text-transform: uppercase; margin:0 0 10px; padding:0; border:none; }
.screen-xs .store-location-title { font-size:2.1em; }

.screen-xs #store-directions-button { margin-left:0!important; margin-right:0!important; }
.screen-xs #section-store-info .row [class*="col-"]:first-child { margin-bottom:30px; }
.screen-xs #store-about-text { margin:0 15px; }
.screen-xs #store-about-text p { font-size:.9em; }

.screen-xs #section-page-bottom .panel .panel-inner { min-height:auto; }
.screen-xs #section-design-services .panel-box p:first-child { margin:24px 0!important; }
.screen-xs #section-design-services h3 { font-size:.9em; line-height:1.3em; font-weight:800; }
.screen-xs .panel-box h2 { padding-top:0!important; }
.screen-xs .panel-box h2 span:nth-child(1) {}
.screen-xs .panel-box p { font-size:.9em; }
.screen-xs .panel-box .pw-button,
.screen-xs .panel-box .c-button { width:auto!important; /*display:block;*/ margin-top:30px; }

.screen-xs #design-services-list { margin:15px -15px 0!important; width:calc(100% + 30px); }
.screen-xs #section-careers .panel-inner p:nth-child(2) { margin:0 15px; }
.screen-xs #section-careers .panel-inner p:nth-child(3) { text-align:left; font-size:.75em; line-height:1.5em; margin:25px 10px 5px!important; }
.screen-xs #section-store-video > .row { margin:0 auto; }
.screen-xs #section-store-video h2 span:nth-child(2) { font-size:.7em; }

/* Mobile */
.screen-xs #store-location-page-template.is-coming-soon #section-careers > .panel.panel-box > img.panel-box-image { width:100%; }
.screen-xs #store-location-page-template.is-coming-soon #section-page-bottom .panel .panel-inner { width:100%; }



/* Loding Styles */
#store-location-page #store-image img { width:100%; height:auto; margin:auto; opacity:.5; /* Spinner Loader -> */ background:rgba(0,0,0,0.05) url('https://www.ballarddesigns.com/wcsstore/images/BallardDesigns/loaders/loader_spinner.gif') no-repeat center center; 
}
#store-location-page.page-loaded #store-image img { min-height:auto!important; background:transparent none!important; opacity:1; transition:opacity 0.1s; }

#store-info-heading,
#store-info-address,
#store-about-text { position:relative; overflow:hidden; background:rgba(0,0,0,.03); max-width:100%; background:#f6f7f8; min-height:100px; }
#store-info-heading:after,
#store-info-address:after,
#store-about-text:after { content: ""; display: block; width: 1px; height: 100%; background: rgba(0, 0, 0, 0.05); box-shadow: 0 0 100px 75px rgba(0, 0, 0, 0.05); -webkit-animation: 1.5s linear infinite background-shimmer; animation: 1.5s linear infinite background-shimmer; }

#store-location-page.page-loaded #store-info-heading,
#store-location-page.page-loaded #store-info-address,
#store-location-page.page-loaded #store-about-text { background-color:transparent; min-height:auto; }
#store-location-page.page-loaded #store-info-heading:after,
#store-location-page.page-loaded #store-info-address:after,
#store-location-page.page-loaded #store-about-text:after  { display:none; }

@-webkit-keyframes background-shimmer {
    0% {
        -webkit-transform: translateX(50000%);
        transform: translateX(50000%);
    }
    to {
        -webkit-transform: translateX(-50000%);
        transform: translateX(-50000%);
    }
}
@keyframes background-shimmer {
    0% {
        -webkit-transform: translateX(50000%);
        transform: translateX(50000%);
    }
    to {
        -webkit-transform: translateX(-50000%);
        transform: translateX(-50000%);
    }
}


@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes fade-in {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}