/*
Theme Name: heartohelp
Theme URI: heartohelp.in
Author: Hear To Help
Author URI: https://wordpress.org/
Description: First theme 
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
Version: 1.0
Requires at least: 5.9
Tested up to: 8.2.0
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentythree
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Template: twentytwentythree
*/


/* Site Wide*/

.wp-site-blocks {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}



/* Social Media 

.wp-block-social-link-anchor svg {


	border-radius: 0 !important;
	transition: all 0.5s ease 0s !important;

}
.wp-block-social-link-anchor:hover svg {

	

	  border-radius: 50% !important;
}

*/


.has-featured-image  .hth-featured-image{



}



  @media only screen and (min-width: 481px) {
  
    .has-featured-image  header{
	z-index: 1;
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	margin: 0px auto;

}
  
  
    .has-featured-image h1.hth-main-site-title{
		  font-size: 4.8rem;
		  font-size: 4vw !important;
		  margin: 3rem 0px 1rem ;
		  margin: 3vw 0px 1vw !important;
		  position: relative;
		  left: -0.392rem;
		  line-height: 0.8;
		  letter-spacing: -1px;
		  font-weight: 400;
		  padding-left: 0px !important;
		  padding-right: 0px !important;
	}
	
	
    .has-featured-image 	p.hth-main-site-tagline,
        .home 	p.hth-main-site-tagline 
     {
	  font-family: "League Gothic", "Arial", "Times New Roman", "Times", serif;
	  color: #ffffff;
	  font-size: 3rem;
	  font-size: 3vw !important;
	  margin: 2rem 0px .5rem;
	  margin: 2vw 0px .5vw  !important;;
	  position: relative;
	  left: -0.392rem;
	  line-height: 0.8;
	  letter-spacing: -1px;
	  font-weight: 400;
	}
}


  @media only screen and (min-width: 0px) and (max-width: 481px) {

    .has-featured-image 	h1.hth-main-site-title{

		  font-size: 3.5rem;
		  margin: 3rem 0px 1rem;
		  position: relative;
		  left: -0.392rem;
		  line-height: 1;
		  letter-spacing: -1px;
		  font-weight: 400;
	}


    .has-featured-image 	h1.hth-main-site-title a{
		color: #EC7900 !important;
	}


    .has-featured-image 	p.hth-main-site-tagline{

	  color: #333333;
	  font-size: 2rem !important;
	  margin: 2rem 0px .5rem  !important;;
	  position: relative;
	  left: -0.392rem;
	  line-height: 1;
	  letter-spacing: -1px;
	  font-weight: 400;
	}

}






/* Slide */

@media only screen and (min-width: 481px) {
  
    .hth-slide-overlay{
	z-index: 1;
	position: absolute;
	display: block;
	top: 0px;
	left: 0px;
	right: 0px;
	margin: 0px auto;

	}
  
     .hth-slide{
	z-index: 0;
	position: relative;
	display: block;
	margin: 0px auto;
	}
 
  
    .has-featured-image h1.hth-main-site-title{
		  font-size: 4.8rem;
		  font-size: 4vw !important;
		  margin: 3rem 0px 1rem ;
		  margin: 3vw 0px 1vw !important;
		  position: relative;
		  left: -0.392rem;
		  line-height: 0.8;
		  letter-spacing: -1px;
		  font-weight: 400;
		  padding-left: 0px !important;
		  padding-right: 0px !important;
	}
	
	
    .has-featured-image 	p.hth-main-site-tagline,
        .home 	p.hth-main-site-tagline 
     {
	  font-family: "League Gothic", "Arial", "Times New Roman", "Times", serif;
	  color: #ffffff;
	  font-size: 3rem;
	  font-size: 3vw !important;
	  margin: 2rem 0px .5rem;
	  margin: 2vw 0px .5vw  !important;;
	  position: relative;
	  left: -0.392rem;
	  line-height: 0.8;
	  letter-spacing: -1px;
	  font-weight: 400;
	}
}


@media only screen and (min-width: 0px) and (max-width: 481px) {


    .hth-slide-overlay{
	z-index: 1;
	position: relative;
	display: block;
	top: 0px;
	left: 0px;
	right: 0px;
	margin: 0px auto;

	}
  
     .hth-slide{
	z-index: 0;
	position: relative;
	display: block;
	margin: 0px auto;
	}


     .hth-slide-overlay	h1{
		  font-size: 3.5rem;
		  margin: 3rem 0px 1rem;
		  position: relative;
		  left: -0.392rem;
		  line-height: 1;
		  letter-spacing: -1px;
		  font-weight: 400;
	}

     .hth-slide-overlay	h1.hth-main-site-title a{
		color: #EC7900 !important;
	}


    .hth-slide-overlay	p.hth-main-site-tagline{

	  color: #333333;
	  font-size: 2rem !important;
	  margin: 2rem 0px .5rem  !important;;
	  position: relative;
	  left: -0.392rem;
	  line-height: 1;
	  letter-spacing: -1px;
	  font-weight: 400;
	}

}





h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
   font-family: 'Raleway-Light', sans-serif;
   font-style: normal;
}


main sup{
   font-size:70%;
   color:#aaaaaa;
}
main sup a{
      color:#F45A1D !important;
}



main caption{
   text-align:left;

}

main .captionText{
   text-align:center;  
   margin:0 auto;
}

main blockquote {
    font-family: "Raleway",serif;
    font-weight: 700;
    font-size: 1.2rem;
    border-left: 3px solid #C02702;
    color: #555555;
    padding-left: 1rem;
    margin-left: 1rem;
    position: relative;

}

main blockquote p {
    font-family: "Raleway",serif;
    font-weight: 700;
    font-size: 1.2rem;
}

main blockquote.bold {
    border:0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    margin: 30px auto;
    max-width: 750px;
    overflow: visible;
    padding: 20px 0;
    position: relative;
    color: #94c9c6;
    font-family: "Raleway",serif;
    font-size: 2rem;
    line-height:2.3rem;
    position: relative;
    text-align: center; 
}

main blockquote.aside{
   width:9rem;
   position: absolute;
   border:0;
   border-right: 3px solid #94c9c6;
   overflow: visible;
   color: #aaa;
   font-family: "Raleway",serif;
   font-size: .8rem;
   font-weight: bold;
   line-height:1rem;
   text-align: right; 
   text-transform: uppercase;
   padding-right:2rem;
   left:-5rem;
}






.pquote {
    float: left;
    width: 100px;
    background: #ffffff23;
    font-weight: bold;
    padding: 13px;
    margin: 0 13px 13px 0;
}

.pquote blockquote {
    margin: 0; /* gets rid of the default blockquote margin */
}


.pquote p:first-letter {
    font-size: 39px;
    font-weight: bold;
}



 blockquote,  blockquote q {
    font-size: 1.5rem;
  }

 blockquote q:before {
    color: #ccc;
  }

blockquote q:after {
    color: #ccc;
  }








blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}


blockquote, blockquote p {
    font-family: 'Quadon_ExtraBoldItalic', Arial, sans-serif;
    letter-spacing: 1px;
    padding-top: auto;
    font-size: 1.5rem;
    line-height: 140%;
    color: #9ecdb2;
    margin-bottom: 0px;
    margin-top: 0px;
}




  @media only screen and (min-width: 481px) {
.home	h1.hth-main-site-title{

		  font-size: 4.8rem;
		  font-size: 4vw !important;
		  margin: 3rem 0px 1rem ;
		  margin: 3vw 0px 1vw !important;
		  position: relative;
		  left: -0.392rem;
		  line-height: 0.8;
		  letter-spacing: -1px;
		  font-weight: 400;
		  padding-left: 0px !important;
		  padding-right: 0px !important;
	}
.home		p.hth-main-site-tagline {
	  font-family: "League Gothic", "Arial", "Times New Roman", "Times", serif;
	  font-size: 3rem;
	  font-size: 3vw !important;
	  margin: 2rem 0px .5rem;
	  margin: 2vw 0px .5vw  !important;;
	  position: relative;
	  left: -0.392rem;
	  line-height: 0.8;
	  letter-spacing: -1px;
	  font-weight: 400;
	}
}


  @media only screen and (min-width: 0px) and (max-width: 481px) {
.home		h1.hth-main-site-title{

		  font-size: 3.5rem;
		  margin: 3rem 0px 1rem;
		  position: relative;
		  left: -0.392rem;
		  line-height: 1;
		  letter-spacing: -1px;
		  font-weight: 400;
	}


.home		h1.hth-main-site-title a{
		color: #EC7900 !important;
	}


.home		p.hth-main-site-tagline{

	  color: #333333;
	  font-size: 2rem !important;
	  margin: 2rem 0px .5rem  !important;;
	  position: relative;
	  left: -0.392rem;
	  line-height: 1;
	  letter-spacing: -1px;
	  font-weight: 400;
	}

}


@media only screen and (min-width:1024px) {
  main p {
      font-size: 1.5rem;
      line-height: 1.7;
      font-family: "Fanwood Text";
      font-weight: normal;
      color: #333;
      margin-top:1rem;
      margin-bottom: 1rem;
   }
}

@media only screen and (min-width:0px) and (max-width : 1024px) {
   main p {
      font-size: 1.3rem;
      line-height: 1.7;
      font-family: "Fanwood Text";
      font-weight: normal;
      color: #333;
      margin-top:1rem;
      margin-bottom: 1rem;

   }
}

a {
   color:#336699;
   text-decoration: none; 
}

a:hover{ 
   text-decoration: underline; 
}




body.home .wp-site-blocks{

      padding-top: 0px !important;
      padding-bottom:0px !important;

}


.hth-margin-top-zero{

	margin-top:0px !important;
	margin-block-start: 0 !important;

}

/* --------------------------- CAPTIONS ---------------------------*/

figcaption {
	text-align:left !important;
	max-width: 864px;
	margin:0 auto !important; /* important */
}


figcaption::before {
  border-bottom: .0625rem solid #ff8000;
  content: "";
  display: inline-block;
  margin: 0 1.25rem 0 0;
  top: .625rem;
  vertical-align: middle;
  width: 1.25rem;
}

@media only screen and (min-width:758px) {
	figcaption:before {
	  width:2.5rem
	 }
}

span.photo-credit::before {
    content: " ";
    display: inline;
   
}
.photo-credit {
  background-image: url("http://heartohelp.in/wp-content/themes/heartohelp/assets/images/icons/camera2.svg");
  background-repeat: no-repeat;
  padding-left: 1.2rem;
  background-size: 1rem 1rem;
  display: inline;
  line-height: 120%;
  height: 1.1rem;
  color: #000000;
  background-position: 0% 50%;
  font-family:  var(--wp--preset--font-family--montserrat-regular);
  text-transform: uppercase;
  font-size: 0.7rem;
}



 /* --------------------------- FOOTER ---------------------------*/



/* Footer */

footer {
	background-color: var(--wp--custom--footer--background);
}


  @media only screen and (min-width: 481px) {
	h1.hth-footer-main-site-title{
	          position: relative !important;
                  display: block;
		  font-size: 4.8rem;
		  font-size: var(--wp--preset--font-size--xx-large) !important;

		  letter-spacing: -1px;
		  font-weight: 400;
		  padding-left: 0px !important;
		  padding-right: 0px !important;
	}
	p.hth-footer-main-site-tagline {
		  font-family: "League Gothic", "Arial", "Times New Roman", "Times", serif;
		  font-size: 3rem;
		  font-size: 3vw !important;
		  margin: 2rem 0px .5rem;
		  margin: 2vw 0px .5vw  !important;;
		  position: relative;
		  left: -0.392rem;
		  line-height: 0.8;
		  letter-spacing: -1px;
		  font-weight: 400;
	}
}


  @media only screen and (min-width: 0px) and (max-width: 481px) {
	h1.hth-footer-main-site-title{

		  font-size: 3.5rem;
		  position: relative;
		  left: -0.392rem;
		  line-height: 1;
		  letter-spacing: -1px;
		  font-weight: 400;
	}


	h1.hth-footer-main-site-title a{
		color: #EC7900 !important;
	}


	p.hth-footer-main-site-tagline{

		  color: #333333;
		  font-size: 2rem !important;
		  margin: 2rem 0px .5rem  !important;;
		  position: relative;
		  left: -0.392rem;
		  line-height: 1;
		  letter-spacing: -1px;
		  font-weight: 400;
	}

}









   .heartohelp-logo{
        height:100px;
	 
	width:100px;
    
      transition: all 0.5s ease 0s; 
   }

   .heartohelp-logo:hover, .heartohelp-logo:focus{
	      fill: #861517 !important;
	      color: #861517 !important;

  }

.footer_tagline {
	   font-family: "League Gothic", "Arial", "Times New Roman", "Times", serif;
	   font-size: 3rem;
	   font-size: clamp(2.25rem, 4vw, 2.75rem);
	   margin: 2rem 0px .5rem;

	   position: relative;

	   line-height: 0.8;
	   letter-spacing: -1px;
	   font-weight: 400;
}


.hashtag span {
  position: relative;
  display: block;
  width: 100%;
  margin: 0 auto;
  color: #78879a;
  font-size: 2rem;
  font-family: "Fanwood Text", "Georgia", "Times New Roman", "Times", serif;
  padding-top: 1rem;
  padding-bottom: 1rem;
  transition: all 0.5s ease 0s;
}


 ul.orange-arrows {
   list-style: none;
}

.orange-arrows  li {
   line-height: 1.8rem;
}

 ul.orange-arrows  li::before {
    position: relative;
    content: "\02794";
    color: #c24700;
    float: left;
    margin: 0rem 0 0 -1rem;
    width: 1em;
    font-size: .8rem;
    font-family: 'Raleway';
    font-weight: normal;
}




.hth-icon-whatsapp, .hth-icon-email, .hth-icon-phone, .hth-icon-patreon, .hth-icon-paypal-donate{
      fill:#2c2c2c !important;
      width:auto !important;
      max-width:100% !important;
      height:42px;
      width:181px;
      

     
}




.icon-container:hover #hth-icon-whatsapp-bg, .icon-container:hover #hth-icon-phone-bg,.icon-container:hover #hth-icon-email-bg,.icon-container:hover #hth-icon-patreon-bg, .icon-container:hover #hth-icon-paypal-donate-bg{

	fill:#25D366 !important;

}


.wp-block-outermost-icon-block a:hover {
  transform: none;
}



.icon-container:hover  #hth-icon-patreon-path1, .icon-container:hover  #hth-icon-patreon-path2{
      fill: #FF424D !important;
      color: #f3f3f3 !important;

 }
.icon-container:hover  .hth-icon-paypal-donate-dark-blue, .icon-container:hover  #hth-icon-paypal-donate-path5, .icon-container:hover  #hth-icon-paypal-donate-path6{
      fill: #253b80 !important;
      color: #f3f3f3 !important;

 }
 
 .icon-container:hover  .hth-icon-paypal-donate-light-blue, .icon-container:hover  #hth-icon-paypal-donate-path4{
      fill: #179bd7 !important;
      color: #f3f3f3 !important;

 }


#hth-forthewellbeing-border{

}

.icon-container:hover #hth-forthewellbeing-border{


	stroke: #ce6710 !important;
	
 }

#header-shape-gradient {
  --color-stop: #346571;
  --color-bot: #ce6710;
}





#hth-icons-star-body{
	fill:#f5ac2b !important;
}


	

#hth-icons-star-bg{
	fill:#34666b;
	fill-opacity:1;
	stroke:#241c1c;
	stroke-width:2.264;
	stroke-dasharray:none;
	stroke-opacity:1;
	transition: all 1s ease .5s;

}
.icon-container:hover #hth-icons-star-body{



	
 }

.icon-container:hover .hth-icons-star-bg{

	fill:url(#hth-icons-star-gradient) !important;
	
 }
 
 
 .hth-icons-plant{
 
 
 	transition: all 1s ease .5s;
 }
 
 
 
 
 
#hth-icons-plant-top{
	transition: all 1s ease .1s;
}

.icon-container:hover #hth-icons-plant-top{

	
	transform: scale(1.2)  translate(-4rem, -6rem) ;


}



 /* --------------------------- MENU TRIGGER ---------------------------*/


	/* Apply to body tag when a modal window is opened */
	   .fixedPosition{
		   overflow: hidden;
	    }

 /* BEYOND MOBILE PORTRAIT */
@media only screen and (min-width:481px)  {

	/*  Menu trigger div*/  
	  .hth-menu-trigger {
	      position: fixed; 
	      display: table;
	      top: 0rem;
	      right: 0rem;
	      height: 3.75rem !important;
	      width: 3.75rem !important;
	      background-color:transparent;
	      z-index:5;
	   }
	  .hth-menu-trigger a {

	      height: 3.75rem !important;
	      width: 3.75rem !important;
	      background-color:transparent;
	      z-index:5;
	   }

	/*  toggle-button*/
	   .hth-menu-trigger  .toggle-button {
	      display: table-cell;
	      vertical-align: middle;
	      -webkit-transition: all .5s cubic-bezier(.7,0,.3,1);
	      -moz-transition: all .5s cubic-bezier(.7,0,.3,1);
	      -o-transition: all .5s cubic-bezier(.7,0,.3,1);
	      transition: all .5s cubic-bezier(.7,0,.3,1);
	   }

	   .hth-menu-trigger  .logo, .hth-menu-trigger  .logo::after, .hth-menu-trigger  .logo::before, .hth-menu-trigger  .toggle-button {
	      position: relative;
	      padding-top: 0rem;
	      margin-top: 0rem;
	      display: table-cell !important;
	      vertical-align: middle !important;
	   }  

	   /* toggle-button on hover */

	   .hth-menu-trigger .toggle-button.toggle:hover .lines::after {
	      display: table-cell !important;
	      vertical-align: middle !important;
	    -webkit-transform: translateY(0)rotate(45deg);
	    -moz-transform: translateY(0)rotate(45deg);
	    -o-transform: translateY(0)rotate(45deg);
	    -ms-transform: translateY(0)rotate(45deg);
	    transform: translateY(0)rotate(45deg);
	   }
	   
	   .hth-menu-trigger .toggle-button:hover .lines::after {
	      -webkit-transform: translateY(2px)rotate(0);
	      -moz-transform: translateY(2px)rotate(0);
	      -o-transform: translateY(2px)rotate(0);
	      -ms-transform: translateY(2px)rotate(0);
	      transform: translateY(2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::after {
	      -webkit-transform: translateY(0)rotate(45deg);
	      -moz-transform: translateY(0)rotate(45deg);
	      -o-transform: translateY(0)rotate(45deg);
	      -ms-transform: translateY(0)rotate(45deg);
	      transform: translateY(0)rotate(45deg);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::after,.hth-menu-trigger .toggle-button.toggle .lines::before {
	      top: 0;
	   }

	   .hth-menu-trigger .toggle-button .lines::after {
	      top: 10px;
	   }

	   .hth-menu-trigger  .toggle-button .lines::after, .hth-menu-trigger  .toggle-button .lines::before {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: absolute;
	      width: 2.125rem;
	      height: 2.125rem;
	      height: 3px;
	      background-color: #ff8000;
	      display: block;
	      content: '';
	   }

	   .hth-menu-trigger .toggle-button.toggle:hover .lines::before {
	      -webkit-transform: translateY(0)rotate(-45deg);
	      -moz-transform: translateY(0)rotate(-45deg);
	      -o-transform: translateY(0)rotate(-45deg);
	      -ms-transform: translateY(0)rotate(-45deg);
	      transform: translateY(0)rotate(-45deg);
	   }

	   .hth-menu-trigger .toggle-button:hover .lines::before {
	      -webkit-transform: translateY(-2px)rotate(0);
	      -moz-transform: translateY(-2px)rotate(0);
	      -o-transform: translateY(-2px)rotate(0);
	      -ms-transform: translateY(-2px)rotate(0);
	      transform: translateY(-2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::before {
	      -webkit-transform: translateY(0)rotate(-45deg);
	      -moz-transform: translateY(0)rotate(-45deg);
	      -o-transform: translateY(0)rotate(-45deg);
	      -ms-transform: translateY(0)rotate(-45deg);
	      transform: translateY(0)rotate(-45deg);
	   }

	   /* lines in menu button */

	   .hth-menu-trigger  .toggle-button .lines::before {
	      top: -10px;
	   }


	   .hth-menu-trigger  .toggle-button .lines::after {
	      top: 0px
	   }

	   .hth-menu-trigger  .toggle-button .lines::after, .hth-menu-trigger  .toggle-button .lines::before {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: absolute;
	      width: 2.125rem;
	      height: 2.125rem;
	      height: 3px;
	      background-color: #fff;
	      display: block;
	      content: '';
	   }

	   .hth-menu-trigger  .toggle-button .lines::before {
	      top: -10px;
	   }

	   .hth-menu-trigger .toggle-button .lines, .hth-menu-trigger .toggle-button .lines::after, .hth-menu-trigger .toggle-button .lines::before {
	      -webkit-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -moz-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -o-transition: all .3s cubic-bezier(.7,0,.3,1);
	   }

	/*  lines in menu button: hover */

	   .hth-menu-trigger  .toggle-button.toggle:hover .lines::after {
	      -webkit-transform: translateY(0)rotate(45deg);
	      -moz-transform: translateY(0)rotate(45deg);
	      -o-transform: translateY(0)rotate(45deg);
	      -ms-transform: translateY(0)rotate(45deg);
	      transform: translateY(0)rotate(45deg);
	   }

	   .hth-menu-trigger   .toggle-button:hover .lines::after {
	      -webkit-transform: translateY(2px)rotate(0);
	      -moz-transform: translateY(2px)rotate(0);
	      -o-transform: translateY(2px)rotate(0);
	      -ms-transform: translateY(2px)rotate(0);
	      transform: translateY(2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::after {
	      -webkit-transform: translateY(0)rotate(45deg);
	      -moz-transform: translateY(0)rotate(45deg);
	      -o-transform: translateY(0)rotate(45deg);
	      -ms-transform: translateY(0)rotate(45deg);
	      transform: translateY(0)rotate(45deg);
	   }

	   .hth-menu-trigger  .toggle-button.toggle .lines::after, .hth-menu-trigger  .toggle-button.toggle .lines::before {
	      top: 0;
	   }

	   .hth-menu-trigger  .toggle-button .lines::after {
	      top: 10px;
	   }

	   .hth-menu-trigger  .toggle-button .lines::after, .hth-menu-trigger  .toggle-button .lines::before {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: absolute;
	      width: 2.125rem;
	      height: 2.125rem;
	      height: 3px;
	      background-color: #ff8000;
	      display: block;
	      content: '';
	   }


	   .hth-menu-trigger  .toggle-button:hover .lines::before {
	      -webkit-transform: translateY(-2px)rotate(0);
	      -moz-transform: translateY(-2px)rotate(0);
	      -o-transform: translateY(-2px)rotate(0);
	      -ms-transform: translateY(-2px)rotate(0);
	      transform: translateY(-2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::before {
	      -webkit-transform: translateY(0)rotate(-45deg);
	      -moz-transform: translateY(0)rotate(-45deg);
	      -o-transform: translateY(0)rotate(-45deg);
	      -ms-transform: translateY(0)rotate(-45deg);
	      transform: translateY(0)rotate(-45deg);
	   }

	   .hth-menu-trigger  .toggle-button .lines::before {
	      top: -10px;
	   }


	   .hth-menu-trigger  .toggle-button.toggle .lines {
	      background-color: transparent;  
	   }

	   .hth-menu-trigger .toggle-button .lines, .hth-menu-trigger .toggle-button .lines::after, .hth-menu-trigger .toggle-button .lines::before {
	      -webkit-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -moz-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -o-transition: all .3s cubic-bezier(.7,0,.3,1);
	   }

	   .hth-menu-trigger .toggle-button .lines {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: relative;   
	      height: 3px;
	      background-color: #ff8000;
	      display: block;
	      margin: 0 auto;
	      vertical-align: middle;
	      width: 2.125rem;
	   }

}

 /* Mobile Portrait*/
@media only screen and (min-width:0px) and (max-width:481px)  {


	/*  Menu trigger div*/  
	  .hth-menu-trigger {
	      position: fixed; 
	      display: table;
	      top: 0rem;
	      right: 0rem;
	      height: 3.75rem;
	      width: 3.75rem;
	      background-color:transparent;
	      z-index:5;
	   }

	  .hth-menu-trigger a {

	      height: 3.75rem !important;
	      width: 3.75rem !important;
	      background-color:transparent;
	      z-index:5;
	   }

	/*  toggle-button*/
	   .hth-menu-trigger  .toggle-button {
	      display: table-cell;
	      vertical-align: middle;
	      -webkit-transition: all .5s cubic-bezier(.7,0,.3,1);
	      -moz-transition: all .5s cubic-bezier(.7,0,.3,1);
	      -o-transition: all .5s cubic-bezier(.7,0,.3,1);
	      transition: all .5s cubic-bezier(.7,0,.3,1);
	   }

	   .hth-menu-trigger  .logo, .hth-menu-trigger  .logo::after, .hth-menu-trigger  .logo::before, .hth-menu-trigger  .toggle-button {
	      position: relative;
	      padding-top: 0rem;
	      margin-top: 0rem;
	      display: table-cell !important;
	      vertical-align: middle !important;
	   }  

	   /* toggle-button on hover */

	   .hth-menu-trigger .toggle-button.toggle:hover .lines::after {
	      display: table-cell !important;
	      vertical-align: middle !important;
	    -webkit-transform: translateY(0)rotate(45deg);
	    -moz-transform: translateY(0)rotate(45deg);
	    -o-transform: translateY(0)rotate(45deg);
	    -ms-transform: translateY(0)rotate(45deg);
	    transform: translateY(0)rotate(45deg);
	   }
	   
	   .hth-menu-trigger .toggle-button:hover .lines::after {
	      -webkit-transform: translateY(2px)rotate(0);
	      -moz-transform: translateY(2px)rotate(0);
	      -o-transform: translateY(2px)rotate(0);
	      -ms-transform: translateY(2px)rotate(0);
	      transform: translateY(2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::after {
	      -webkit-transform: translateY(0)rotate(45deg);
	      -moz-transform: translateY(0)rotate(45deg);
	      -o-transform: translateY(0)rotate(45deg);
	      -ms-transform: translateY(0)rotate(45deg);
	      transform: translateY(0)rotate(45deg);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::after,.hth-menu-trigger .toggle-button.toggle .lines::before {
	      top: 0;
	   }

	   .hth-menu-trigger .toggle-button .lines::after {
	      top: 10px;
	   }

	   .hth-menu-trigger  .toggle-button .lines::after, .hth-menu-trigger  .toggle-button .lines::before {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: absolute;
	      width: 2.125rem;
	      height: 2.125rem;
	      height: 3px;
	      background-color: #ff8000;
	      display: block;
	      content: '';
	   }

	   .hth-menu-trigger .toggle-button.toggle:hover .lines::before {
	      -webkit-transform: translateY(0)rotate(-45deg);
	      -moz-transform: translateY(0)rotate(-45deg);
	      -o-transform: translateY(0)rotate(-45deg);
	      -ms-transform: translateY(0)rotate(-45deg);
	      transform: translateY(0)rotate(-45deg);
	   }

	   .hth-menu-trigger .toggle-button:hover .lines::before {
	      -webkit-transform: translateY(-2px)rotate(0);
	      -moz-transform: translateY(-2px)rotate(0);
	      -o-transform: translateY(-2px)rotate(0);
	      -ms-transform: translateY(-2px)rotate(0);
	      transform: translateY(-2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::before {
	      -webkit-transform: translateY(0)rotate(-45deg);
	      -moz-transform: translateY(0)rotate(-45deg);
	      -o-transform: translateY(0)rotate(-45deg);
	      -ms-transform: translateY(0)rotate(-45deg);
	      transform: translateY(0)rotate(-45deg);
	   }

	   /* lines in menu button */

	   .hth-menu-trigger  .toggle-button .lines::before {
	      top: -10px;
	   }


	   .hth-menu-trigger  .toggle-button .lines::after {
	      top: 0px
	   }

	   .hth-menu-trigger  .toggle-button .lines::after, .hth-menu-trigger  .toggle-button .lines::before {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: absolute;
	      width: 2.125rem;
	      height: 2.125rem;
	      height: 3px;
	      background-color: #fff;
	      display: block;
	      content: '';
	   }

	   .hth-menu-trigger  .toggle-button .lines::before {
	      top: -10px;
	   }

	   .hth-menu-trigger .toggle-button .lines, .hth-menu-trigger .toggle-button .lines::after, .hth-menu-trigger .toggle-button .lines::before {
	      -webkit-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -moz-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -o-transition: all .3s cubic-bezier(.7,0,.3,1);
	   }

	/*  lines in menu button: hover */

	   .hth-menu-trigger  .toggle-button.toggle:hover .lines::after {
	      -webkit-transform: translateY(0)rotate(45deg);
	      -moz-transform: translateY(0)rotate(45deg);
	      -o-transform: translateY(0)rotate(45deg);
	      -ms-transform: translateY(0)rotate(45deg);
	      transform: translateY(0)rotate(45deg);
	   }

	   .hth-menu-trigger   .toggle-button:hover .lines::after {
	      -webkit-transform: translateY(2px)rotate(0);
	      -moz-transform: translateY(2px)rotate(0);
	      -o-transform: translateY(2px)rotate(0);
	      -ms-transform: translateY(2px)rotate(0);
	      transform: translateY(2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::after {
	      -webkit-transform: translateY(0)rotate(45deg);
	      -moz-transform: translateY(0)rotate(45deg);
	      -o-transform: translateY(0)rotate(45deg);
	      -ms-transform: translateY(0)rotate(45deg);
	      transform: translateY(0)rotate(45deg);
	   }

	   .hth-menu-trigger  .toggle-button.toggle .lines::after, .hth-menu-trigger  .toggle-button.toggle .lines::before {
	      top: 0;
	   }

	   .hth-menu-trigger  .toggle-button .lines::after {
	      top: 10px;
	   }

	   .hth-menu-trigger  .toggle-button .lines::after, .hth-menu-trigger  .toggle-button .lines::before {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: absolute;
	      width: 2.125rem;
	      height: 2.125rem;
	      height: 3px;
	      background-color: #ff8000;
	      display: block;
	      content: '';
	   }


	   .hth-menu-trigger  .toggle-button:hover .lines::before {
	      -webkit-transform: translateY(-2px)rotate(0);
	      -moz-transform: translateY(-2px)rotate(0);
	      -o-transform: translateY(-2px)rotate(0);
	      -ms-transform: translateY(-2px)rotate(0);
	      transform: translateY(-2px)rotate(0);
	   }

	   .hth-menu-trigger .toggle-button.toggle .lines::before {
	      -webkit-transform: translateY(0)rotate(-45deg);
	      -moz-transform: translateY(0)rotate(-45deg);
	      -o-transform: translateY(0)rotate(-45deg);
	      -ms-transform: translateY(0)rotate(-45deg);
	      transform: translateY(0)rotate(-45deg);
	   }

	   .hth-menu-trigger  .toggle-button .lines::before {
	      top: -10px;
	   }


	   .hth-menu-trigger  .toggle-button.toggle .lines {
	      background-color: transparent;  
	   }

	   .hth-menu-trigger .toggle-button .lines, .hth-menu-trigger .toggle-button .lines::after, .hth-menu-trigger .toggle-button .lines::before {
	      -webkit-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -moz-transition: all .3s cubic-bezier(.7,0,.3,1);
	      -o-transition: all .3s cubic-bezier(.7,0,.3,1);
	   }

	   .hth-menu-trigger .toggle-button .lines {
	      transition: all .3s cubic-bezier(.7,0,.3,1);
	      position: relative;   
	      height: 3px;
	      background-color: #ff8000;
	      display: block;
	      margin: 0 auto;
	      vertical-align: middle;
	      width: 2.125rem;
	   }

}
 /* --------------------------- MENU CONTENT ---------------------------*/


 
 


  @media only screen and (min-width: 481px) {
  
 	   .hth-menu-content {
	      z-index: 4;
	      position: absolute;
	      right: 0px;
	      top: 0px;
	      clear: both;   
	      overflow: scroll !important; 
	      overflow-y: scroll !important;
	      -webkit-overflow-scrolling: touch;
	      height: 100%; /* Important for scroll */
	      width: 100%;
	      height:  100vh;
	      background: rgba(250,250,250,.9);
	      padding: 0px;
	      margin: 0px;  
	      padding-top: 0rem;
	    }
  

}


  @media only screen and (min-width: 0px) and (max-width: 481px) {
	   .hth-menu-content {
	      z-index: 4;
	      position: absolute;
	      right: 0px;
	      top: 0px;
	      clear: both;   
	      overflow: scroll !important; 
	      overflow-y: scroll !important;
	      -webkit-overflow-scrolling: touch;
	      height: 100%; /* Important for scroll */
	      width: 100%;
	      height:  100vh;
	      background: rgba(250,250,250,.9);
	      padding: 0px;
	      margin: 0px;  
	      padding-top: 3.75rem;
	    }

}






 
 
 

.hth-menu-h2{
	border-bottom:1px solid  #EC7900 !important;
}



.hth-menu-content a:hover{
	text-decoration-style: dashed;
	color:#EC7900;
	
}

.hth-menu-search input {
	color:#EC7900;
	  font-style: italic;
}



.hth-menu-search input::placeholder {
  display:block;
  color: #EC7900;

  font-style: italic;
}






.hth-menu-search input:focus{
 
	border: 0; 


 outline: 2px solid #666666; 
}
.hth-menu-search .wp-block-search__button:hover{

color:#ffffff !important;
background-color: #333333 !important;

}



/* Social Media */



.icon-twitter svg{

      border-radius:0 !important;
      transition: all 0.5s ease 0s !important; 
    }

.icon-twitter:hover svg{
      fill: #00ACEE !important;
      color: #f3f3f3 !important;
      border-radius:50% !important; 
 }
 
 
.icon-instagram svg{

      border-radius:0 !important;
      transition: all 0.5s ease 0s !important; 
    }

.icon-instagram:hover svg{
      fill: #E1306C !important;
      color: #f3f3f3 !important;
      border-radius:50% !important; 
 }
 
.icon-youtube svg{

      border-radius:0 !important;
      transition: all 0.5s ease 0s !important; 
    }

.icon-youtube:hover svg{
      fill: #FF0000 !important;
      color: #f3f3f3 !important;
      border-radius:50% !important; 
 }
 
 .icon-patreon svg{

      border-radius:0 !important;
      transition: all 0.5s ease 0s !important; 
    }

.icon-patreon:hover svg{
      fill: #FF424D !important;
      color: #f3f3f3 !important;

 }