/*
Theme Name: Heard Museum
Author: HMG Creative    
Author URI: https://hmgcreative.com 
Description: Heard Museum Wordpress Theme
Version: 1.0

-------------------------------------------------------------- */
/* Reset
-------------------------------------------------------------- */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  font: inherit;
  font-size: 100%;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
section {
  display: block;
}
html {
  margin: 0;
  padding: 0;
  font-size: 62.5%;
  /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */

  -webkit-text-size-adjust: 100%;
  /* Prevents iOS text size adjust after orientation change, without disabling user zoom */

  -ms-text-size-adjust: 100%;
  /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
  
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}
code,
kbd,
tt,
var {
  font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}
abbr,
acronym {
  border-bottom: 1px dotted #666;
  cursor: help;
}
mark,
ins {
  background: #fff9c0;
  text-decoration: none;
}
sup,
sub {
  font-size: 75%;
  height: 0;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  bottom: 1ex;
}
sub {
  top: .5ex;
}
small {
  font-size: 75%;
}
big {
  font-size: 125%;
}
figure {
  margin: 0;
}
table {
  margin: 0 0 1.5em;
  width: 100%;
}
th {
  font-weight: bold;
}
button,
input,
select,
textarea {
  font-size: 100%;
  /* Corrects font size not being inherited in all browsers */

  margin: 0;
  /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */

  vertical-align: baseline;
  vertical-align: middle;
  /* Improves appearance and consistency in all browsers */

}
button,
input {
  line-height: normal;
  /* Addresses FF3/4 setting line-height using !important in the UA stylesheet */

  overflow: visible;
  /* Corrects inner spacing displayed oddly in IE6/7 */

}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  border: none;
  border-radius: 10px;
  background: #ccc;
  color: rgba(0, 0, 0, 0.8);
  cursor: pointer;
  /* Improves usability and consistency of cursor style between image-type 'input' and others */

  -webkit-appearance: button;
  /* Corrects inability to style clickable 'input' types in iOS */

  font-size: 12px;
  font-size: 1.4rem;
  line-height: 1;
  padding: 1.12em 1.5em 1em;
}
button:hover,
html input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
  -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.5);
  -moz-box-shadow: 0 0 3px rgba(0,0,0,0.5);
  box-shadow: 0 0 3px rgba(0,0,0,0.5);
}
button:focus,
html input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
html input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
  -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.5);
  -moz-box-shadow: 0 0 3px rgba(0,0,0,0.5);
  box-shadow: 0 0 3px rgba(0,0,0,0.5);
}
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* Addresses box sizing set to content-box in IE8/9 */

  padding: 0;
  /* Addresses excess padding in IE8/9 */

}
input[type="search"] {
  -webkit-appearance: textfield;
  /* Addresses appearance set to searchfield in S5, Chrome */

  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */

  box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration {
  /* Corrects inner padding displayed oddly in S5, Chrome on OSX */

  -webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */

  border: 0;
  padding: 0;
}
input[type=text],
input[type=email],
textarea {
  color: #888888;
  border: 1px solid #dddddd;
  border-radius: 5px;
}
input[type=text]:focus,
input[type=email]:focus,
textarea:focus {
  color: #101010;
}
input[type=text],
input[type=email] {
  padding: 3px;
}
textarea {
  overflow: auto;
  /* Removes default vertical scrollbar in IE6/7/8/9 */

  padding: 10px;
  vertical-align: top;
  /* Improves readability and alignment in all browsers */

  width: 98%;
}

img {
    pointer-events: none;
}

/* ================================ Elementor Fixes ================================ */

/* Overrides default breakpoint for column reversal in tablet and mobile view */ 

@media (max-width: 1299px) and (min-width: 768px){
  .elementor-reverse-tablet>.elementor-container>.elementor-row>:first-child {
      -webkit-box-ordinal-group: 11 !important;
      -ms-flex-order: 10 !important;
      order: 10 !important;
  }
}

/* Creates default collapsed accordion by hiding first item */ 

.accordion-closed .elementor-accordion .elementor-accordion-item:first-child {
    display: none !important;
}


/* fixes overlap in gallery lightbox */ 
.swiper-container header{
	!important;
	width: 50% !important;   
}
 
/* removed blue outline from mobile gallery arrows */ 

.elementor-swiper-button {
  outline: none !important;
  border: none !important; 
}

/* ================================ Custom Styles ================================ */

body{
  overflow-x: hidden;	
}

strong{
  font-weight: 700 !important; 
}

/*
@media screen and (max-width: 1350px){
    .elementor-row{
        padding-left: 25px;
        padding-right: 25px;
    }
	
	.elementor-row .elementor-inner-section .elementor-row{
		padding-left: 0px;
		padding-right: 0px;
	}
}

*/

ul>li{
	list-style-type: disc;
	margin-left: 2em;
        line-height: 1.5em;
        margin-bottom: 0.5em; 
}

ul li li:first-child{
        margin-top: 0.5em !important;
}

em{
  font-style: italic; 
}

@media only screen and (min-width: 767px){
  .two-col-list{
    column-count: 2; 
  }
	
  .three-col-list{
    column-count: 3; 
  }
}


.uael-post__bg-wrap{
  border-radius: 10px;
  box-shadow: 0px 3px  50px rgba(0,0,0,0.2);
  position: relative;  
}


.uael-post__thumbnail{
  border-radius: 10px 10px 0px 0px; 
}


.uael-post__complete-box-overlay{
  border: solid 1px var(--e-global-color-5c0c4b2);
  width: 96% !important;
  height: 96% !important;
  margin: 2% !important;
  border-radius: 5px;    
  z-index: 1;
}

.upcoming-events p{
  color: var(--e-global-color-607d158);
  font-size: 22px !important;
  margin-bottom: 30px;   
}

/* moves chevron on menu slightly left */
.uael-submenu-icon-arrow .uael-nav-menu .parent-has-child .sub-arrow i::before {
  position: relative;
  left: -5px;
  top: 2px;     
}


/* ===============================================
 * Forms
 * =============================================== */ 

.form-wrapper{
  position: relative;

}

.form-wrapper::before{
  position: absolute;
  content: " "; 
  background-color: var(--e-global-color-secondary) !important;
  top: -50px; 
  left: 0px;
  height: 150px;
  width: 15px;  
  z-index: 1; 
  border-radius: 8px 0px 0px 0px;    
}

.form-plant-pattern{
  z-index: 1; 
}

@media only screen and (min-width: 767px) {

.form-plant-pattern::after{
  position: absolute; 
  content: url("https://dev.hmgcreative.com/heard/wp-content/uploads/2020/11/plant_002.png");
  right: -175px;
  top: 40px; 
  z-index: -1;
}
	
}


/* Wufoo Form Styling */ 

.wufoo {
	font-family: "Futura PT";
}

.wufoo .section {
  font-size: 24px !important; 
}


.wufoo ul li{
  list-style: none !important;
  font-size: 20px;
  margin: 10px 0px; 
}

.wufoo li {
  width: 100%;
  box-sizing: border-box;  
}


.wufoo li.focused{
  background: none !important; 
}



#logo{
  display: none;
}
/*
.wufoo #header{
  display: none; 
}
*/

.wufoo #header h2{
  font-size: 45px !important;
  text-align: center;
  font-family: "masqualero", Sans-serif;
  font-weight: 800 !important;
  margin-bottom: 20px; 
}

.wufoo #header {
  font-size: 18px !important;
  font-family: "Futura PT";
  text-align: center;	
}

.wufoo label.desc{
  color: #2F2E28 !important;
  font-family: "Futura PT", sans-serif !important;
  font-size: 18px !important   
}

.wufoo .field{
  padding: 15px 10px;
  background: #F2F2F2;
  border: solid 1px #BAB2AA !important; 
  border: none;    
}

.wufoo select{
	 width: 100%;
}

.wufoo input{
  box-sizing: border-box; 
}

.wufoo .buttons input{
  background-color: #BE401B;
  font-family: "Futura PT", sans-serif !important;
  text-transform: uppercase;
  font-size: 18px; 
  letter-spacing: 3px; 
  color: #f7f7f7;
  padding: 15px 40px;
  border-radius: 5px; 
}

.wufoo button{
  font-family: "Futura PT", sans-serif !important;
  color: #BE401B !important;
}

.wufoo button:hover{
  opacity: 0.5; 
  box-shadow: none !important; 
}


.wufoo .radix{
  display: none !important; 
}

.wufoo .cents{
  margin-left: 20px; 
}

.wufoo p.error {
  font-size: 18px;
  margin: 10px 0px !important; 
  font-weight: 300;  
}

/* wufoo payment step */

.wufoo .invoice{
  margin-bottom: 50px; 
}
.wufoo.leftLabel .desc{
  width: 100%;
  margin-bottom: 25px;  
}

.wufoo #ccSection{
  background: #f4f4f4;
  margin-left: -14px; 
  margin-right: -14px;
  padding: 50px 15px;   
}

.wufoo #ccSection .field{
  background: #fff; 
}

.wufoo #ccSection div, .wufoo #billSection div{
  width: 100%; 
}


/* ===============================================
 * Footer
 * =============================================== */ 

.footer-cta{
  position: relative; 
}

/* Query below adds twig graphics on desktop */

@media only screen and (min-width: 767px) {
	.footer-cta::before{
	  content: url("https://dev.hmgcreative.com/heard/wp-content/uploads/2020/11/Twig-1.png");
	  position: absolute;
	  top: -50px;
	  left: -40px;
	  width: 250px !important;    
	}


	.footer-cta::after{
	  content: url("https://dev.hmgcreative.com/heard/wp-content/uploads/2020/11/Twig-1.png");
	  position: absolute;
	  bottom: -70px;
	  right: -40px;
	  width: 250px !important; 
	  transform: scaleX(-1);
	  z-index: 1   	
	}
}	


	

.footer a{
  color: var(--e-global-color-468f917) !important;
}

.footer a:hover{
  color: var(--e-global-color-47c7666)!important;
}

.bottom-bar a{
  color: var(--e-global-color-468f917) !important;
}

.bottom-bar a:hover{
  color: var(--e-global-color-47c7666)!important;
}


/* ===============================================
 * Patterns
 * =============================================== */ 




/* Tree Ring Pattern for Buttons */ 

.tree-ring{
  background: url("https://dev.hmgcreative.com/heard/wp-content/uploads/2020/11/tree-ring-background-pattern-01.svg");
  background-size: 600px; 
}

/* 
.tree-ring:hover{
  background-size: 500px; 
}
*/

.uael-nav-menu__layout-horizontal .uael-nav-menu .sub-menu, .uael-submenu-open-hover .uael-layout-vertical .uael-nav-menu .sub-menu {transition: none !important}

.elementor-nav-menu--main .elementor-nav-menu a {
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}

.uael-nav-menu .menu-item a:after, .uael-nav-menu .menu-item a:before {transition:none !important}

/* Plant frames for internal pages */ 
@media only screen and (min-width: 767px) {
	.pattern-02{
	  position: relative; 
	}

	.pattern-02::before{
	  content: url("https://dev.hmgcreative.com/heard/wp-content/uploads/2021/01/plant_003-1.png");
	  position: absolute;
	  left: -60px;
	  bottom: -90px;
	  z-index: 1;
	}

	.pattern-02::after{
	  content: url("https://dev.hmgcreative.com/heard/wp-content/uploads/2021/01/plant_003-1.png");
	  position: absolute;
	  right: -60px;
	  bottom: -90px;
	  z-index: 1;
      transform: scaleX(-1);   	
	}
}


/* ===============================================
 * Buttons
 * =============================================== */ 

/* Creates tree-ring overlay */ 

.elementor-button{
  background: url("https://dev.hmgcreative.com/heard/wp-content/uploads/2020/11/tree-ring-background-pattern-01.svg");
  background-size: 600px; 
}


.elementor-button:hover{
  background-size: 590px; 
}


/* ===============================================
 * UI ELEMENTS
 * =============================================== */ 

/* Quick link bar styling on homepage */ 

.quick-links-bar{
  border: 10px solid transparent;
  border-image: url(https://dev.hmgcreative.com/heard/wp-content/uploads/2020/11/border-distressed-yellow.svg) 5 stretch;
  border-image-outset: 10px;
}

/* Link Styling for Page Sub Menus */ 

.page-sub-menu a {
    color: #fff !important;
}

.page-sub-menu a:hover{
    opacity: 0.8 !important;
}

.page-sub-menu{ 
  border: 15px solid transparent;
  border-image: url(https://dev.hmgcreative.com/heard/wp-content/uploads/2020/11/border-distressed-green.svg) 10 stretch;
  border-image-outset: 10px;
}


/* ===============================================
 * CUSTOM SEARCH AND FILTER EVENT FEEDS
 * =============================================== */ 


/* Creates field grid */

.searchandfilter > ul > li {
  display: inline-block;
  vertical-align: top;
  font-size: 24px;
  padding: 10px;  
}

.searchandfilter .sf-field-search{
  width: 70%;
}

.searchandfilter .sf-field-taxonomy-event_type{
  width: 30%;
}

.searchandfilter .sf-field-taxonomy-event_type select{
  width: 100% !important;
  color: #fff !important;
  background-color: var(--e-global-color-84d21c6);  
  width: 100% !important; 
}

.searchandfilter label{
  width: 100% !important;
}

/* Styles the fields */

.searchandfilter select{
  padding: 15px;
  outline: none;
  border: none;
  background: var(--e-global-color-468f917);
  color: var(--e-global-color-607d158);
  font-family: "Futura PT";
  -moz-appearance:none; /* Firefox */
  -webkit-appearance:none; /* Safari and Chrome */
  appearance:none;
  background-image: url("data:image/svg+xml;utf8,<svg fill='white' height='32' viewBox='0 0 24 24' width='32' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position-x: 95%;
  background-position-y: 50%;   
}

.searchandfilter input{
  padding: 15px;
  border-radius: 0px;
  outline: none;
  background: var(--e-global-color-468f917);
  font-family: "Futura PT";
  width: 100%;      
}

.searchandfilter input::placeholder{
  font-style: italic; 
}

/* makes field grid responsive */ 

@media only screen and (max-width: 900px) {
  .searchandfilter{
    width: 100%;
    max-width: 500px;  
    margin: auto;    
  }

  .searchandfilter .sf-field-taxonomy-event_type{
    width: 100%;
  }

  .searchandfilter .sf-field-search{
    width: 100%;
  }
}


/* Styles Results */ 

.hmg-row{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

.hmg-col-4{
  display: flex;
  flex-direction: column;
  flex-basis: 33.33%;
  padding: 10px; 
}

@media only screen and (max-width: 900px) {
	.hmg-col-4{
	  flex-basis: 100%;
	}
}

.hmg-post-card{
  position: relative;    
  background: var(--e-global-color-468f917);
  border-radius: 15px;
  box-shadow: 0px 10px 20px rgba(0,0,0,0.16);
  margin-top: 10px;
  margin-bottom: 10px;
  outline: 1px solid var(--e-global-color-a054f36);
  outline-offset: -10px;
}



/*
.hmg-post-card .elementor-button::before{
  position: absolute; 
  border: solid 1px var(--e-global-color-5c0c4b2); 
  content: " ";
  top: 10px;
  bottom: 10px;
  left: 10px;
  right: 10px;
  border-radius: 9px;   
}
*/


.hmg-post-card-image{
  background-color: var(--e-global-color-5c0c4b2);
  height: 200px;
  background-size: cover;
  background-position: center;
  border-radius: 15px 15px 0px 0px;
   
}

.hmg-post-card-content{
  padding: 30px;    
}

.hmg-post-card h3 a{
  color: var(--e-global-color-c2ffc5d);
  font-size: 28px;
  font-weight: bold;   
}

.hmg-post-card-event-date{
  font-size: 22px;
  display: block;
  margin-top: 10px;  
  color: var(--e-global-color-607d158);   
}

.hmg-post-card-event-time{
  font-size: 22px;
  display: block;
  margin-bottom: 20px !important;
  color: var(--e-global-color-607d158);     
}

@media only screen and (max-width: 900px) {
    
    .hmg-post-card{
      width: 400px;
      margin: 10px auto;
    }

}

@media only screen and (max-width: 500px){
.hmg-post-card {
    width: 100%!important;
    margin: 10px auto;
}
}