/*
Theme Name: USAPL NWFL
Theme URI: https://jsmcorp.com/
Author: Jump Start Marketing, Inc.
Author URI: https://jsmcorp.com
Description: This theme was developed for USAPL NWFL and provides custom functionality and design for their needs. 
Version: 0.1

*/

.wp-block-image {width: 100%; height: auto;}
.table-details {float: none !important; width: 100% !important; max-width: 100%; margin-left:0!important;}

.card img {max-width: 300px !important;}

body {font-size: 18px;}
h2 {font-size: 2.2rem;}

.jsm-phone {text-decoration:none;}


#returntop {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #085435;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
  border: solid 2px #fff;
}

#returntop:hover {
  background-color: #999;
}

.subtitle {color: #e48220; font-size: 1rem; margin-bottom: 30px;}
.btn-send {background-color: #72B443 !important;} 
ul.sitemap li a {text-decoration:none;color:#000;}
ul.sitemap li a:hover {text-decoration:underline;}

.imageratio {display:block; width: auto; height: auto; max-width: 500px;}
.image-caption {font-style:oblique; font-size: 1rem; text-align: center; margin: 5px;}

/* header */ 
.topheader .col {text-align: center;}
.topheader .col-last {text-align: right;}
.logo {max-height: 120px;}


/*
ul#menu-adventures {
    background-color: #000000b0;
    padding: 8px;
}*/
/*
#navbarSupportedContent {
    position: relative;
    bottom: 50px;
}
*/

/*.nav-link {color: #fff; font-size: 1.4rem; text-transform: uppercase; font-weight: 500;}
.nav-link:hover {color: #e48220;}
.headerlinks a, .footerlinks a, .menu-item {color: #fff;text-decoration: none; margin-left: 15px;}
.headerlinks a:hover, .footerlinks a:hover {text-decoration: underline;}
*/
.nav-link {color: #000000;}
.headerlinks a, .footerlinks a, .menu-item {color: #fff;text-decoration: none; margin-left: 15px;}
.header {background-color:#fff; color:#000; border-bottom: solid 2px #fff;}


nav.navbar.navbar-expand-lg.navbar-light.bg-light {
    margin-top: 20px;
}

a#navbarDropdown:hover, a.nav-link:hover, a.dropdown-item:hover {
    background-color: #000000;
    color:#000000;
}

.cta-link {
    background-color: #a8e1e4;
    color:#000;
} 



.header3 { 
    background-color: #3f0e3f;
    background-image:url('assets/images/bg-header3.webp');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;   
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
    height: 140px;  
    border-bottom: solid 3px #00CECE;
} 

.nav-item {padding-left: 20px; padding-right: 20px;}

/*.headerlinks div a {padding: 5px 10px;}*/

/* footer */
.footer-main {background-color: #3f0e3f;color:#fff;min-height: 150px;}
.footer-main h4 {font-size: 1.2rem; color: #a8e1e4;}
.footer-main ul {margin-left: 0;}
.footer-main li {font-size: 1rem;}
.footer-main a {color: #fff; text-decoration: none;}
.footer-main a:hover {color: #a8e1e4; text-decoration: underline;}
.footer-sub {background-color: #000;color:#fff;min-height: 50px; text-align: left;}
 

a.free-quote-button {background-color: red; color: #fff;}
a.free-quote-button:hover {background-color: red; color: #fff; border: solid 1px #333;}
a.but-request-free-quote-large {background-color: #00CECE;color:#3f0e3f; font-size: 2rem;}
a.but-request-free-quote-large:hover {background-color: #00CECE;color:#3f0e3f; border: solid 1px #333;}

 



.website-main h1, .website-main p { color: #fff;font-family: "Lobster",Sans-serif;font-weight: 300;text-shadow: 0px 0px 12px #000;}
.website-main h2 {color: #ccc;}
.website-removal-video {border: solid 5px #000;}

div.marketing-news {border: solid 2px #e48220; background-color:#fff;}
div.marketing-news h3, div.marketing-news p {text-align: left;}
div.marketing-news .row {border-bottom: dashed 1px #036;}
div.marketing-news .row:last-child {border-bottom: none;}


.news-info2 {
	background-image:url('/wp-content/uploads/2024/01/bg-engine-auto-mechanic.webp');	
	background-color: #000;
	color:#fff; 
	border-top: solid 2px #ccc; 
	border-bottom: solid 2px #ccc;
	background-attachment:fixed;
}

.news-container figure.wp-block-image {
    float: none;
    width: 100%;
    height: auto;
}
.news-container figure.wp-block-image img {
    float: none;
    width: max-content;
    height: auto;
}

.news-info2 a.btn-dark {color:#fff;}
div.news-info2 h2 {color: #ffbd00;}
.jsm-cats {text-align: center;}
.jsm-cats a {color: #ccc;}
.jsm-cats a:hover {color:#fff;}
.auto-repair-article {background-color: #fff; color:#000; border-radius: 6px; padding-bottom: 10px; border: solid 3px #ffbd00;}
.auto-repair-article h4, .auto-repair-article p {color:#000;margin: 15px; padding: 0 10px;}
.wp-post-image {
    width: 100%;
    height: 20vw;
    object-fit: cover;
    object-position: center;
}
.sidebar-cats {margin-top: 50px; border:solid 1px #000; padding-bottom: 20px; }
.sidebar-cats h3 {background-color: #000;color:#fff;padding: 4px 8px;}
.sidebar-cats a {font-size: 24px; color: #333;margin: 8px 10px 8px 15px;}
.sidebar-cats a:hover {color:#000; }

span.required {color: #ffbd00; font-weight:bold; margin-left: 5px;}


.breadcrumb-item {font-size: 1rem;}
.breadcrumb-item a {color: #036;text-decoration: none; font-style:oblique;}
.breadcrumb-item a:hover {color: #036;text-decoration: underline;}
li.breadcrumb-item:first-child a{font-weight: bold;}


.marketing-news-image img {max-width:300px;max-height:200px; border: solid 2px #036;}
.news-info {background-color: #d00202;color:#fff; border-top: solid 2px #ccc; border-bottom: solid 2px #ccc;}

.section1 { 
    background-color: #036;
    background-image:url('assets/images/accounting-desk.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;   
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
    height: 200px; /*382px;*/ 
} 

.header2 { 
    background-color: #000;
    background-image:url('assets/images/accounting-desk.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;   
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
    min-height: 600px; /*382px;*/
}

.header-interior { 
    background-color: #000;
    background-image:url('https://adventuresunlimited.com/wp-content/uploads/2018/12/canoe-shot-banner-1.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;   
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
    min-height: 200px; /*382px;*/
}

.section-video{ 
    background-color: #036;    
    background-image:url('assets/images/pensacola-bay-bluffs.webp');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;   
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
    /*height: 420px;  */ 
} 

.marketing-benefits {background-color:#e4822017;}

.black-curve{
background-image:url('assets/images/black-curve-land.webp'); 
    background-position: center top;
    background-repeat: repeat-x;
    background-size: cover;
    height: 40px;
    margin-top: -37px;
}
.section2 { 
    background-color: #3f0e3f;
    color:#fff;
    min-height: 130px;
    border-top: solid 3px #00CECE;
    border-bottom: solid 3px #00CECE; 
} 
.section2 p, .section2 h2 {color:#fff;}
.cta-ar {
    background-image:url('assets/images/cta-ar2.webp');
    background-position: center right;
    background-repeat: no-repeat;        
    background-size: cover;
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
}
.cta-2 { 
    background-color: #000;
    min-height: 130px;
    border-top: solid 2px #e48220;
    border-bottom: solid 2px #e48220;
} 
.cta-2 p {color:red;}
.cta-2 h2 {color: #fff;}
.cta-button, .cta-button:hover {background-color: red;color:#fff;}
.cta-button:hover {background-color:#e60000;}

.website-description { 
    min-height: 300px;
}

.services {    
    
    background-image:url('assets/images/bg-money.webp');
    background-position: center center;
    background-repeat: no-repeat;        
    background-size: cover;   
}

.services-row {border: solid 1px #ccc;}

.jsm-tabs {
    background-color: #000;
    color:#fff;
    min-height: 150px;
    padding-bottom: 60px;
          
}

.jsm-sliders .btn {background-color: #00CECE;color:#3f0e3f;}

/*

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}
*/
.jsm-fr {width: 50% !important; float: right;}
.wp-block-image {
    /*width: 100% !important;*/
    float: right;
    margin-left: 40px;
    margin-bottom: 40px;
}
figure img {
    width: 100%;
    height: auto;
}


.container.content-box {
    padding-top: 30px;
}

.faq-container{
    background-color: #00336621;
    color:#fff;
    background-image:url('/wp-content/uploads/2023/06/bg-underwater.webp');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;  
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
}
.faq-online-marketing .accordion {width: 70%; background-color: #212529d1;}
.faq-online-marketing .panel {width: 70%;border: solid 1px #ccc;}


 

#website-service-questions {max-width: 700px;margin-left:auto;margin-right:auto;}
 
.website-service-cta h3 {text-align: center;}
.website-service-cta p {text-align: center;}
 
.website-services p a {color: #333; text-decoration: none; font-weight:500;font-style:oblique;}
.website-services p a:hover {text-decoration:underline;} 

.services h2, .services p, .services img, .services h3 {text-align: center;margin-left:auto;margin-right:auto;}


div.marketing-service div.card {background-color: #3f0e3f24;}
div.marketing-service div.card:hover {background-color: #e4822017;}
div.marketing-service {background-color:#fff;}

.marketing-service .card-body h3 {font-size: 1.3rem;}

/*
#carouselExampleControls {min-height: 400px; max-width: 90%; margin: auto;}
.carousel-item {color: #000; min-height: 355px;}
#carouselExampleIndicators {max-width: 80%;margin-left:auto;margin-right:auto;}
.carousel-control-next-icon, .carousel-control-prev-icon {background-color: #036;}
.carousel-control-prev {left: -110px;}
.carousel-control-next {right: -110px;}
*/

.service-locations {
    background-image:url('assets/images/bg-white-websites.webp');
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    background-color: #fff;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;    

}
.service-locations .card {background-color: #000;color: #fff;padding: 25px;border: solid 2px #fff;}
.card-body h3 {font-size: 1.5rem;}
.card-text a {text-decoration: none;color:inherit;} 


ul.inlinelist li {
    float: left; padding-right: 20px; margin-right: 20px;
}

img.article {margin-left:auto;margin-right:auto;}
.article-categories .card-body h3, .article-categories .card-body p {text-align:center;}
.article-details h2, .article-details h3, .article-details h4 {margin-top: 20px;margin-bottom: 20px;}

.article-details a {color: inherit;text-decoration:none;}

.divider {background-image: url('websites-icon.jpg');background-repeat: repeat-x;width: 100%;height: 17px;}

.featured-image {float: right;}
.featured-image-left {float: left;}

.interior-title-section {
    background-image:url('bg-interior-title-section.webp'); 
    background-color: #72B443;
    background-position: right;
    background-repeat: no-repeat;
    background-size: contain; 
}

.featured-image-service {text-align: center;}
.featured-image-service p {clear:both;font-size: 1rem;text-align: center;}

.anchor-right a {float: right; font-size: 1rem; text-decoration: none;color: #000;}
.anchor-right a:hover {text-decoration:underline;}

.online-marketing-video {border: solid 2px #fff;}

/* ********************************* */
.accordion {
  background-color: red;
  color: #fff;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 1.1rem;
  transition: 0.4s; 
}
.accordion:after {
  /*content: '\002B';*/
  color: #fff;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #fff;
    background-color: red;
    border-bottom:solid 1px red;;
}
div#myTabContent {
    border-left: solid 1px #fff;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
}

.panel {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  background-color: white;
  color:#000;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}
.panel p {margin: 30px 40px;}
.panel ul {margin: 10px 40px 40px 40px;}
.panel ul li {margin: 0 0 30px 10px;}

.card-text {text-align: center;}

.nav-link:hover {
    color: #fff;
    background-color: #333333;
}

.tab-details {width: 60%;}


.card.mb-3.news-info {
    background-color: #fff;
    color: #000 !important;
    text-align: left;
}


div.marketing-service div.card {background-color: #3f0e3f24;}
div.marketing-service div.card:hover {background-color: #00cece1a;}


.carousel-caption {
    bottom: 4rem; 
    width: 40%;
}

/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  /*bottom: 3rem;*/
  z-index: 10;
}

/* Declare heights because of positioning of img element */
#sliders .carousel-item {
  height: 30rem;
}

.slider-container{
    background-color: #000000;
    color:#000000;
    background-image:url('assets/images/bg-engine.webp');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;  
    transition: background 0.3s, border-radius 0.3s, opacity 0.5s;
    min-height: 550px;
}

/* jsm-cards-1 - start */
.jsm-cards-1 {
    background-image:url('assets/images/[bg-image-cards-1]');
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    background-color: #fff;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;    
}
.jsm-cards-1 h4.card-title {font-size: 32px; color:#fff;text-transform: uppercase;text-shadow: 1px 1px #ccc;text-align:center;}

.jsm-cards-1 .jsm-bottom-left {position:absolute;bottom:0;left:10px;}
.jsm-opa {opacity:0.5;}
/* jsm-card - end */



/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
/* rtl:begin:ignore */
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}
/* rtl:end:ignore */



/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
/* rtl:begin:remove */
.featurette-heading {
  letter-spacing: -.05rem;
}


.about {
       
      background-position: center bottom; 
      background-repeat: no-repeat; 
      background-size: cover;
      color:#fff;
	  background-color: #272362;
  }
.about div div .website-information img {margin: 10px;}
.about img {border: solid 1px #fff;}

.contact {
	 
	background-position: center top; 
	background-repeat: no-repeat; 
	background-size: cover;color:#fff; 
	background-color:#272362;
}

.slider-info h1 {
    font-size: 62px;
    font-family: 'Lobster'; 
    font-weight: 500;
}
.slider-info h1 span {
	color:#cccccc, red;  
	background: -webkit-linear-gradient(#cccccc, red);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.slider-info p {
    font-size: 22px;
    font-family: 'Roboto';
}


/*@media only screen and (max-width: 600px) {*/
@media only screen and (max-width: 992px) {
	
	img.wp-block-cover__image-background.wp-image-27 {
    	width: 100%;
    	height: auto;
	}	
	
  .container {width: 100%;}  
  
	.slider-info {top: 5px !important;}
	
  .header3 {height: auto}
  
  button.accordion-button {background-color: #000 !important; color: #fff !important; }  
  
  .tab-content>.tab-pane {
    display: block;
    opacity: 1;
  }  
  
  .carousel-caption {
    bottom: 2rem;
    width: 75%;
    }
  
    
  .online-marketing-video, .featured-image-service, .website-service-locations, .accordion, .panel, .website-information, .website-image {width: 100%; text-align: center;}
  .navbar-toggler {margin-left:auto;margin-right:auto;margin-bottom:15px;}
  .nav-item {text-align: center; border-top: solid 1px #ccc;border-bottom:solid 1px #ccc;}
  .nav-item:last-child {border:none; margin-top:15px;}
  .mobile {display:none;}
  .mobile100 {width: 100%;text-align:center;}
  img.logo {max-height: 200px;}
  .col-last {clear:both;}
  .interior-title-section {background-position: right bottom; background-size: cover;}
  .footer-main h4, .marketing-service-links, ul.inlinelist li {text-align:left;}
  .footer-sub .footer-info {margin-bottom: 15px;}
  
  .section1 {background-image: none; background-color:#3f71a4; height:auto;}
  
  #section3 {
      background-image:url('https://www.northwestfloridaelectric.com/wp-content/uploads/2023/12/bg-image-1-1.webp');
      background-position: center bottom; 
      background-repeat: no-repeat; 
      background-size: cover;
      color:#fff;
  }
  .section3 div div .website-information img {margin: 10px;}
  
  .website-video-box {padding:0 !important;}
  .footer-info img {width: 100%;}
  .card {padding: 5px; margin: 5px;}
 
.topphrase,div.headerlinks .col, .website-services-include .col-4, .marketing-news-image img, .col-4, .col-5, .col-6, .col-7  {width: 100% ;margin-left:auto;margin-right:auto;text-align:center !important;}

  .navbar-brand {width: 100%;}
  
  .navbar-toggler {background-color:#ccc;}
  
  .reviews-website {margin-left:auto;margin-right:auto;width:100%;}
  .reviews-website p {text-align: center;}
  
  .m-col {width: 100%; padding: 15px;}
  
  .card-text a {text-align:center;}
  
  .m-col a img, .m-col img, .reviews, .imageratio {max-width: 300px !important;}
  
  .col-6, .faq-online-marketing .accordion,.faq-online-marketing .panel {width: 100%;}
  #free-estimate img.imageratio {display:none;}
  
  .cta-2 { 
      text-align: center;
  }   
  
  .cta-2 .p-5 {
    padding: 2rem!important;
  }
  
.cta-ar {
    background-image: none; 
    width:100%;
    text-align:center;
}
.col-4.text-center.p-5 {
    width: 100%;
} 


.navbar-toggler {
    background-color: #095938;
}

nav.navbar.navbar-expand-lg.navbar-light.bg-light {
    background-color: initial !important;
}

	a.navbar-brand img {
    width: 100% !important;
    height: auto !important;}
	.col-4, .col-5, .col-6, .col-7 {width:100% !important;text-align:center !important;}
	.imageratio {max-width: none !important; margin-bottom: 20px;}
	img {max-width: 100% !important;}
 
}