/*
 Theme Name: WebMaestra Standard
 Author: WebMaestra
URI: https://www.webmaestra.com/wordpress-theme
Description:
Tags: music teachers, music lessons, small business, responsive-design, featured-images, custom-logo
Version: 2.0
Requires at least: 5.9
Tested up to: 6.5.5
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: webmaestrastandard

 */
 
body {line-height: 1.5 !important;}



.wp-block-button a.has-small-font-size {font-size: 10pt !Important; color: #000 !important; font-weight: bold !Important; text-transform: uppercase !Important;}

.section1{background: #fff !Important; margin-bottom: 15px !Important;}

a {color: #1475b7;}


.text-right {text-align: right !important;}
.text-center {text-align: center!important;}
.text-left {text-align: left !important;}

.col-lg-4, .col-sm-4 {width: 25% !important;}



.col-lg-3, .col-sm-3 {width: 33% !important;}

.wp-block-group {
	padding: 20px; 
	margin-top: 50px !important; 
	border-radius: 25px !important;}

.testimonial { font-size: .9em !Important;  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); min-height: 300px !Important;}
.cw {border: 0px red solid !Important;  margin: 0px auto !important;  }


.innerpage .hone {background-color: #1475b7; padding-bottom: 20px !important; padding-top: 20px !Important; margin-top: 15px !important; margin-bottom: 30px !Important;}

.innerpage .hone h1 {margin-top: 0px !Important; color: #fff !important;  }



.branding {margin: 0px auto !Important; width: 100% !Important;  width: 75% !important; justify-content: space-between;  }

.navigation { font-size: 12pt !Important;  flex-direction: row;  display: flex; justify-content: flex-end; 
}


.has-small-font-size {font-size: .75rem !important;}
.has-large-font-size { font-size: 2em !important; color: #2d74b5 !important; }
.has-medium-font-size {line-height: 1 !important;   }

h1, h2 {
	
  font-weight: 400 !important;
	letter-spacing: -.02em !important; }

h1 {margin-bottom: 0px !important;}

h2 {color: #2d74b5;line-height: 1 !Important;}

h3.wp-block-accordion-heading {padding-left: 20px !Important; font-size: 1em !important; border-radius: 0px  0px 0px 0px !Important; padding-bottom: 5px !Important;margin-bottom: 0px !Important; }

.wp-block-accordion-panel  {
  padding: 20px !Important; 
  background: #fff !Important; 
  border: 1px #ccc solid !Important; 
  border-top: 0px !Important; 
  padding-top: 20px !Important; 
  margin-top: 0px !Important;}

.wp-block-group {
  border-radius: 25px;
  }



.taglinetext {
  margin-top: 20px !important; 
  line-height: 1.4; 
  margin-bottom: 20px; 
  }




/* GENERAL LAYOUT */ 

body {background-color: #fff;
	font-size: 16pt; 
	padding-top: 0px; 
	overflow-x: hidden !important;
	color: #000 !important;
	}


.pagecontent-inner {
  margin-top: 150px !Important;
  }

.hometext { 
  margin: 0px auto;  
  padding-top: 50px; 
  padding-bottom: 50px;
}


/* TOPBAR */
.topbar {
  padding: 10px; 
  background: #000; 
  color: #fff; 
  line-height: 1 !important;
  margin-bottom: 15px !important;
  }

.topbar a {font-size: 10pt; color: #fff;}
.topbar a:hover {text-decoration: underline;}


/* LISTS and QUOTES */

.pagecontent ul li {padding-left: 20px; padding-bottom: 0px !important;}
.pagecontent ul {margin-left: 20px; padding-left: 20px !important; margin-top:20px;}




/* LINKS */

.pagecontent a {text-decoration: underline !important; color: #000;}
a {color: #000 }
a:visited {color: #000 }
a:active {color: #000;}
a.wp-block-button__link {text-decoration: none !important; color: #000 !important;}

a:hover.wp-block-button__link {text-decoration: underline !important; color: #000 !important;}

.btn-primary a {color: #000 !important; text-decoration:none !Important; font-size: 12pt !Important; letter-spacing: 0em !Important;}

/* LINKS */
.pagecontent a {color: #000 !important; font-weight: 700 !important; }
.pagecontent a:hover {text-decoration: underline !important;}

/* HEADINGS */
h1 {font-weight: bold; color: #000;  }
h2 {
  font-weight: bold; 
  font-style: normal; 
  font-size:1.8em;  
  padding: 15px; 
  margin: 0px auto; 
color: #1f1f1f ;
 padding-left: 0px !important;}








/* Testimonials */

.testimonial {background-color: #fafafa !Important;}

/* THERE GOES MY HERO */
.topimage  {padding: 0px !important;}
.topimage , .topimageoverlay {width: 100% !important;  }

.topimage { 
  padding: 0px; 
  margin: 0px !important;
   width: 100%; 
   background-size: cover !important;   
   margin-top: 0px;
    background-repeat: no-repeat !important; 
    background-position: top center !important;  
    }

.topimageoverlay{
  background:  rgba(0,0,0,.6); 
  width: 100% !important; 
	margin: 0px auto;
	padding: 0px;
	
   }

.tagline {  

  
 padding: 25px; 
 margin: 0px auto;  
 border-radius: 0pt;
color: white;
text-shadow: -1px -1px 0 #000,   1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; 
background-color: rgba(255,255,255,0.1) ; 
width: 45% !important; 
border-radius: 25px !important; 
position: relative !important; 
top: 150px !Important;
}


.tagline h1 { 
  font-size: 1em;  
  color:  #fff;  
  padding-bottom: 0px; 
  text-shadow:  none !important; 
   
}

.tagline .wp-block-buttons {line-height: 1em !important; text-shadow: none !important; padding: 0px !Important;}

.tagline .wp-block-buttons a {text-decoration: none !important;}







/* BUTTONS */



.tagline .wp-block-button {font-size: 12pt !important; padding: 0px !important; text-transform: none !important; font-weight: normal !Important;}




/* BLOG */

.sidebar {font-weight: bold; padding: 10px; font-size: 12pt !important;}
.sidebar ul {padding-left: 0px !important; margin-left: 0px !important;}
.sidebar ul li {list-style-type:none; padding-left: 0px;  margin-left: 0px; padding-bottom: 0px; border-bottom: 0px #fafafa solid;}
.sidebar ul li a {padding-left: 0px; font-size: 9pt; text-transform: uppercase; color: #fff !important; padding-bottom: 0px; text-decoration: none !important; line-height: 9pt !important; }
.sidebar ul li a:hover {}

.blogtitle {  margin-bottom: 5px;}
.blogtitle h2 { padding: 10px !important; font-size: 12pt !important;}





/* FOOTER */
.footer {padding: 50px; font-size: 11pt !important;line-height: 18pt !important; background: #000;}
.footer  .fab {font-size: 24pt; color: #fff; padding-right: 15px;}
.footer a {color: #fff !important; text-decoration: none !important;}
.footer a:hover {text-decoration: underline !important;}
#menu-footer  a {color: #fff !important; }
.footer ul {list-style-type: none !important; padding-left: 0px !important; margin-left: 0px !important;}
.footer ul li {list-style-type: none !important; padding-left: 0px !important; margin-left: 0px !important;}
#menu-footer li {background: transparent !important; padding: 0px !important;text-align: left !important; margin-left: 0px !important;  }
#menu-footer li a:hover {background: transparent !important;}
#menu-footer ul {list-style-type: none !important;  margin: 0px !important; padding: 0px !important;}
#menu-footer li {list-style-type: none !important;  margin: 0px !important; padding: 0px !important;}






/* VIDEO */

.videocontainer  { color: #fff;  margin-bottom: 60px; margin-top:60px;}
.videocontainer .container {}
.video {
    position:relative;
    padding-bottom:56.25%;
    padding-top:30px;
    height:0;
    overflow:hidden;
    margin: 0px auto; margin-top: 0px;
	text-align: center;
	 
}

.video iframe, .video-container object, .video-container embed {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height: 100%;	border-radius: 0px;
	 
 
}




 a {text-decoration: underline !Important;}

.btn.btn-primary {background-color: #fff !important; border-radius: 25px !important;}
.btn.btn-primary a {text-decoration: none !important;}


/* breakpoint for web browsers */







.wp-block-group { padding: 20px; margin-top: 50px !important; border-radius: 25px !important;}

.wp-block-group h2 {}

.navbar-default .navbar-toggle {background-color: #000 !important;}
.wp-block-group {}

.is-content-justification-center  {margin: 0px auto !important; text-align: center;}

.card {border: 1px #ccc solid; margin: 0px auto;}
.card  ul { list-style-type: none !important;  margin-left: 5px; margin-bottom: 30px; margin-top: 30px;}
.card  ul li { list-style-type: none !important; font-size: 12pt !important; margin-left: 0px; padding-left: 0px; padding-bottom: 2px; line-height: 14pt;}
.card li:before{content:"\2713\0020";color: green !important;  }



img {
	max-width: 100%;
	height: auto;
}


img[width][height] {
	aspect-ratio: attr(width) / attr(height);
}



.branding {background-color: #fff !Important;}

.c {clear: both !important;}

.sitenav {  
	float: right !important;
  position: relative;
 
}


/* LOGO */

.logo {
  width: 30%; float: left !important;
  max-width: 140px; /* Limits maximum desktop width */
  aspect-ratio: 4 / 1; /* Forces strict 4:1 proportions */
  display: flex;
  align-items: center;
  justify-content: center;
}

.logo img {
  width: 100%;
  height: 100%;
  object-fit: contain; 
}






/* from customizer */

.has-x-large-font-size {}

h2.has-medium-font-size  {font-weight: bold !important;}
.has-blue-background-color {border-radius: 25px !Important;}

.tagline { box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1) !important; }

.boxshadow {box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);}

.topimageoverlay{box-shadow: 0px 5px 2px rgba(20, 117, 183, 0.4) !important; }

.topimageoverlay {background-color: background-color: rgba(20, 117, 183,0.2) !important;  }
.wp-block-accordion {width: 65% !important; margin: 0px auto !important;}


.rounded {border-radius: 35px !Important;}

wmcontent .wp-block-group {border: 0px purple solid !Important; margin-bottom: 10px !Important; border-radius: 25px !important}

.wp-block-accordion-heading {background-color:#8ed1fc !important;}


.topbar button {}

h3 a {text-decoration: none !Important; text-transform: uppercase !Important; color: #1475b7}

.red {border: 1px red solid !Important;}

.pagecontent a {text-decoration: underline !important; color: #000 !important;}
.wp-block-group a {
  Color: #000 !important;
}

h2 {text-transform: Uppercase !important; }

.navigation {position: relative; top: 10px !Important;}

.navigation li a {font-family: gidole !Important; text-transform: uppercase !important; font-size: 11pt !Important; letter-spacing: .009em !important;   color: #111111 !important;}

.taglinetext {text-transform: uppercase !Important; color: #fff !important; text-shadow: none !Important; 

}

.hone h1 {font-size: 1.2rem !important; text-transform: uppercase !important;}
h2 {color: #1475b7 !important;}


/* ---  (1280px and down) --- */
@media (max-width: 1280px) {
	.wp-block-group {width: 100% !Important; margin: 0px !important;}
	
	
	.taglinetext {font-size: 2.5rem !important;}
	.cw {padding: 0px !Important; margin: 0px auto !Important; width: 85% !important;}
}



/* NEW WEBMAESTRA NAV */
.wm_sitenav {
  position: relative;
  font-family: sans-serif;
}

.wm_sitenav *, .wm_sitenav *::before, *::after {
  box-sizing: border-box;
}

.wm_nav, .wm_nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu-checkbox {
  display: none !important;
}

.wm_nav a {
  text-decoration: none !important;
}

@media screen and (min-width: 1000px) {
  .hamburger-label {
    display: none !important;
  }

  .wm_nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  .wm_nav li {
    position: relative;
  }

  .wm_nav > li {
    display: flex;
    align-items: center;
  }

  .wm_nav a {
    display: block;
    padding: 15px 10px 15px 15px;
    color: #333333;
  }

  .desktop-arrow-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 15px 15px 15px 5px;
    font-size: 0.75rem;
    color: #666666;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease;
  }

  .menu-item-has-children.is-open > .desktop-arrow-toggle {
    transform: rotate(180deg);
  }

  .wm_nav .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #ffffff;
    min-width: 240px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 4px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    z-index: 999;
  }

  .wm_nav .sub-menu li {
    width: 100%;
  }

  .wm_nav .sub-menu a {
    padding: 12px 20px;
  }

  .wm_nav li.is-open > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
}


@media screen and (max-width: 1280px) {
	.wp-block-accordion {width: 100% !important; margin: 0px auto !important;}}

@media screen and (max-width: 999px) {
	

  .hamburger-label {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 30px;
    height: 21px;
    cursor: pointer;
    position: relative;
    z-index: 3001;
  }

  .menu-checkbox:checked + .hamburger-label {
    position: fixed;
    top: 20px;
    right: 20px;
  }

  .hamburger-label span {
    display: block;
    width: 100%;
    height: 3px;
    background-color: #333333;
    border-radius: 2px;
  }

  .wm_nav {
    position: fixed;
    top: 0;
    right: 0;
    width: max-content;
    min-width: 280px;
    max-width: 85vw;
    height: 100vh;
    background-color: #ffffff;
    padding: 80px 40px 40px 40px;
    overflow-y: auto;
    box-shadow: -5px 0 25px rgba(0,0,0,0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateX(20px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    z-index: 3000;
  }

  .menu-checkbox:checked ~ .wm_nav {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
  }

  .wm_nav li {
    width: 100%;
    position: relative;
    border-bottom: 1px solid #f0f0f0;
    white-space: nowrap;
  }

  .wm_nav a {
    display: block;
    padding: 16px 0;
    color: #333333;
    font-size: 1.2rem;
  }

  .wm_nav .sub-menu {
    display: none;
    padding-left: 20px;
    background-color: #fafdff;
  }

  .wm_nav .sub-menu li:last-child {
    border-bottom: none;
  }

  .wm_nav .menu-item-has-children > a::after {
    content: ' ▼';
    font-size: 0.65rem;
    display: inline-block;
    margin-left: 15px;
    color: #999999;
    transition: transform 0.2s ease;
  }

  .wm_nav .menu-item-has-children.is-open > a::after {
    transform: rotate(180deg);
  }

  .wm_nav li.is-open > .sub-menu {
    display: block;
  }
}




.btn-secondary a {background: #ccc !important;}

h3.has-white-color .has-text-color h.as-link-color {color: #fff !Important;}

h3 { font-family: "Roboto" !important; text-transform: uppercase !Important;}




/* --- Mobile Layout (900px and down) --- */
@media (max-width: 900px) {
	
	body {overflow-x: hidden !important; max-width: 100% !important;}
	.wp-block-group {width: 100% !Important; margin: 0px !important;}
	.footer {text-align: center !Important;}

.col-sm-4 {width: 100% !important; float: none !important; max-width: 250px !Important; clear: both !Important;}
	.row {width: 100% !important;}
	
.wp-block-button {min-width: 300px !Important;}
	
	.btn-nav {width: auto !important;}
	.topimage, .topimageoverlay {height: 350px !important;}
	.tagline {position: relative !important; top: 0px !important;}
	
	.taglinetext {font-size: 1rem !important;}
	.cw {padding: 0px !Important; margin: 0px auto !Important;}}



@media only screen and (max-width: 500px) {
	
	.wp-block-buttons > .wp-block-button.has-custom-width .wp-block-button__link {
  max-width: 300px !Important;
}
	
	.wp-block-buttons > .wp-block-button.wp-block-button__width-100 {
  flex-basis: 100%;
  width: 100%;
		max-width: 300px !Important;
}
	wmcontent .wp-block-group {
  padding: 15px !important;
  margin-top: 50px !important;
  border-radius: 25px !important; margin: 0px auto !important; width: 100% !Important; border: 0px red solid !Important;
}
	
	.hometext {text-align: left !important; border: 0px blue solid !Important; width: 100% !important; padding: 10px !important; margin: 0px auto !Important;}
	.cw {border: 0px purple solid !Important;}

  .tagline {
    font-size: 14pt !Important;
    position: relative !important;
    top: 0px !important;
  }
	.topmage, .topimageoverlay {height: 350px !Important; }
	
	.hometext {width: 95% !important;}
	.cw {padding: 0px !important; margin: 0px auto !important;}

	.testimonial {padding: 20px !Important;}

	
 h1 {font-size: 16pt !important;}
 h2 {font-size: 14pt !Important;}
	.hometext {padding: 10px !important; width: 85% !important; margin: 0px; overflow-x: hidden !Important;}

  .topimage .tagline {width: 90% !Important;}
  .tagline {font-size: 14pt !Important;}

}


@media only screen and (max-width: 768px) {

   .tagline { border-radius: 0px !Important; padding: 20px !Important; position: relative; top: 180px !Important;}
h1 {text-align: center !Important;}
}


/* Temp nav solution */

@media screen and (max-width: 999px) {
	.wm_nav {padding-top: 3px !important;}
  .wm_nav .menu-item-has-children > .sub-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    
    position: relative !important; 
    left: 0 !important;
    box-shadow: none !important;
  }

  .wm_nav .menu-item-has-children > .desktop-arrow-toggle {
    display: none !important;
  }

  .wm_nav .sub-menu > li {
    padding-left: 2px !important; 
  }
}