/*
 Theme Name:   makeArtAboutIt
 Theme URI:    https://makeArtAboutIt.com
 Description:  WE BELIEVE THAT ART AND THE DISCUSSION OF ART MAKE THE WORLD A BETTER PLACE.
 Author:       Make Art About It Team
 Author URI:   https://makeartaboutit.com
 Template:     astra
 Version:      1.0.1
 Text Domain:  makeartaboutit
*/

#primary {
	margin-top: 1em;
}

a {
  color: inherit;
  text-decoration: none;
  background:
    linear-gradient(
      to right,
      rgba(36, 177, 231, .15),
      rgba(36, 177, 231, .01)
    ),
    linear-gradient(
      to right,
      rgba(255, 0, 0, 1),
      rgba(255, 0, 180, 1),
      rgba(0, 100, 200, 1)
  );
  background-size: 100% 3px, 0 3px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 800ms;
}

a:hover {
  background-size: 0 3px, 100% 3px;
}

.ast-separate-container #primary {
  padding: 2em 0px 2em 0px;
}

input[type="text"] {
  border: 1px solid #404040;
}

.ast-separate-container .ast-article-post, .ast-separate-container .ast-article-single {
margin: 0 auto;
padding: 0.34em 2.21em 0.34em 2.21em;
}

.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item {
  line-height: 33px;
}

/* removing extra gap between the sidebar and body */
.ast-right-sidebar #secondary {
  padding: 0px;
  }

.wp-element-caption {
	text-align:center;
}

.entry-title {
    color: #1d1d1d;
		/*font-family: neuzeit-grotesk;*/
		font-weight: 800;
    font-size: 2.4em !important;
    letter-spacing: .05em;
    text-transform: none;
		text-align: center;
		}

.wp-block-image {
	width: fit-content;
}

.site-branding {
  text-decoration: none;
}

.custom-logo-link a{
  background: none;
}

.site-logo-img {
  background: none;
}

/* Font & Typography - placed in additional CSS in front end of theme */


/* Menu */
.menu-toggle, button, .ast-button, .ast-custom-button, .button, input#submit, input[type="button"], input[type="submit"], input[type="reset"], form[CLASS*="wp-block-search__"].wp-block-search .wp-block-search__inside-wrapper .wp-block-search__button, body .wp-block-file .wp-block-file__button {
  border-color: #4e4e4e;
  background-color: #24b1e7;
}

/* SEARCH Field in Header builder */
.ast-search-menu-icon.ast-dropdown-active .search-field, .ast-dropdown-active.ast-search-menu-icon.slide-search input.search-field {
  position: relative;
  border: 0px;
  right: 100%;
}

.site-header {
  display: block;
}

input:focus::placeholder { color: transparent;}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

.uagb-heading-text {
	color: #ffffff;
	font-size: 2.25em;
	/*font-family: neuzeit-grotesk;*/
  font-weight: 400;
  font-style: oblique;
  letter-spacing: .05em;
  line-height: 1.4em;
  text-transform: capitalize;
}

body .is-layout-constrained > .alignright {
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.wp-block-social-links:not(.is-style-logos-only) .wp-social-link-facebook {
	background-color: #24b1e7 !important;
}
h3, .entry-content h3, .entry-content h3 a {
	font-size: 1.2em !important;
}

.page-title {
	text-align:center;
}

/*** The Events Calendar Plugin CSS ***/

/* Landing Page */

h2.tribe-events-widget-events-list__header-title{ /*current text reads Philly's Most Up-To Date Gallery & Event Listings */
 text-align: center;
}

.tribe-events-widget .tribe-events-widget-events-list__event-date-tag-month {
    z-index: 100;
    font-weight: 900 !important;
    padding-bottom: 2px;
    color: #000;
}
    /* This changes the time font size */
.tribe-events-widget-events-list__event-datetime-wrapper.tribe-common-b2.tribe-common-b3--min-medium {
  font-size: 1rem;
}
.tribe-events-widget-events-list__header {
  padding-left: 15px;
}
.tribe-events-widget .tribe-events-widget-events-list__event-row {
  border-bottom: 1px solid rgba(135, 135, 135, .35);
    box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.2), -2px -3px 4px rgba(250, 250, 250, .8);
    border-radius: 25px 0px 0px 25px;
    border-top: 1px solid rgba(135, 135, 135, .05);
    background-image: linear-gradient(to right, rgba(135, 135, 135, 0.12), rgba(135, 135, 135, 0));
    padding: 0px 15px 5px 0px;
}
.tribe-events-widget-events-list__event-wrapper.tribe-common-g-col {
  padding: 1px 5px 4px 30px !important;
  background-color: #ffffff;
}

.tribe-events-widget-events-list__event-header {
  padding: 2px 5px 2px 2px;
}

.tribe-events-event-image {
  overflow: hidden;
  padding-bottom: 0px;
    float: left;
    border: 1px solid #333;
    border-radius: 5px;
    margin-left: 15px;
    box-shadow: 2px 1px 9px rgba(0, 0, 0, 0.9);
}

 /* Date in upper left hand corner */
 .tribe-common--breakpoint-xsmall.tribe-events-widget .tribe-events-widget-events-list__event-date-tag-month {
  border-right: 1px solid rgba(135, 135, 135, .15);
  background-color: rgba(135, 135, 135, .15);
  color: #000;
  border-radius: 15px 0px 0px 0px;
}

span.tribe-events-widget-events-list__event-date-tag-daynum.tribe-common-h2.tribe-common-h4--min-medium {
  border-bottom: 1px solid rgba(135, 135, 135, .15);
  border-right: 1px solid rgba(135, 135, 135, .15);
  background-color: rgba(135, 135, 135, .15);
  color: #000;
  box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.2), -2px -3px 4px rgba(250, 250, 250, .8);
}
  /* End Date */

  .tribe-events-widget-events-list__view-more-link.tribe-common-anchor-thin { /* This is the "view calendar " */
    text-align: center;
    width: fit-content;
    margin: 0 auto;
    display: block;
  }
/* End Landing Page */

/* Closing Page */
.closing-event-header-title, .single-day-event-header-title {
  font-size: 2em;
  padding: 5px 0px 0px 0px;
  margin: 0 auto;
  text-align: center;
  font-style: oblique;
}

.closing-event-title {
    font-size: 1.65em;
    padding: 2px 0px 1px 2px;
    margin: 0 auto;
    text-align: center;
}
.closing-event-header-h2, .single-day-event-header-h2 {
  font-size: 1.25em;
  padding: 5px 0px 0px 0px;
  margin: 0 auto;
  text-align: center;
  font-style: oblique;
}

.closing-event {
  border-bottom: 1px solid rgba(135, 135, 135, .35);
  box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.2), -2px -3px 4px rgba(250, 250, 250, .8),-1px 1px 2px rgba(0,0,0,.3);
  border-radius: 25px 0px 0px 25px;
  border-top: 1px solid rgba(135, 135, 135, .05);
  background-image: linear-gradient(to right, rgba(135, 135, 135, 0.12), rgba(135, 135, 135, 0));
  padding-bottom: 0px;
  margin: 3px 1px 15px 2px;
}

.closing-tribe-events-widget-venue-details {
  display: block;
  font-weight: 600;
  color: #24b1e7;
  text-transform: uppercase;
  text-align: center;
  /* border-style: dashed; */
  border-bottom: 1px black;
  margin-top: 10px;
}

.closing-event-dates {
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    padding-top: 7px;
}
.closing-event-thumbnail {
  overflow: hidden;
  padding: 0px 0px 10px 10px;
  margin: 0 auto;
  display: table;
}

/* End Closing Page */

/* One Day Only Page */
.single-day-event-header-title, .single-day-event-header-title {
  font-size: 2em;
  padding: 5px 0px 0px 0px;
  margin: 0 auto;
  text-align: center;
  font-style: oblique;
}

.single-day-event-title {
    font-size: 1.65em;
    padding: 2px 0px 1px 2px;
    margin: 0 auto;
    text-align: center;
}

.single-day-event {
  border-bottom: 1px solid rgba(135, 135, 135, .35);
  box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.2), -2px -3px 4px rgba(250, 250, 250, .8),-1px 1px 2px rgba(0,0,0,.3);
  border-radius: 25px 0px 0px 25px;
  border-top: 1px solid rgba(135, 135, 135, .05);
  background-image: linear-gradient(to right, rgba(135, 135, 135, 0.12), rgba(135, 135, 135, 0));
  padding-bottom: 0px;
  margin: 3px 1px 15px 2px;
}

.single-day-tribe-events-widget-venue-details {
  display: block;
  font-weight: 600;
  color: #24b1e7;
  text-transform: uppercase;
  text-align: center;
  /* border-style: dashed; */
  border-bottom: 1px black;
  margin-top: 10px;
}

.single-day-event-dates {
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    padding-top: 7px;
}

.single-day-event-thumbnail {
  overflow: hidden;
  padding: 0px 0px 10px 10px;
}
/* End One Day Only Page */

.single-tribe_events .tribe-events-single-event-title {
    text-align: center !important;
    font-size: 3rem;
    text-transform: uppercase;
    display: flex;
    margin: 0 auto;
    width: fit-content;
}
.tribe-event-date-start {
  
}

.tribe-events-schedule {
  display: block;
  text-align: center;
  margin: 0 auto;
  padding: 0px 0px 5px 0px;
}

h1.tribe-events-single-event-title::before {
  content: url('https://www.artblogconnect.org/wp-content/uploads/2023/08/decorative-flourish-line-art-e1692217812381.png');
  padding-right: 10px;
}

h1.tribe-events-single-event-title::after {
  content: url('https://www.artblogconnect.org/wp-content/uploads/2023/08/decorative-flourish-line-art-e1692217812381.png');
  padding-right: 10px;
  -webkit-transform: scaleX(-1)!important;
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  transform: scaleX(-1);
}

  /* effective on /events/ page */
  .tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-row>.tribe-common-g-col {
    border-bottom: 1px solid rgba(135, 135, 135, .35);
    box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.2), -2px -3px 4px rgba(250, 250, 250, .8);
    border-radius: 25px 0px 0px 25px;
    border-top: 1px solid rgba(135, 135, 135, .05);
    background-image: linear-gradient(to right, rgba(135, 135, 135, 0.12), rgba(135, 135, 135, 0));
  }

  /* date column in desktop */
  .tribe-events-calendar-list__event-date-tag .tribe-common-g-col {
    border-radius: 25px 0px 0px 25px;
  }
  .tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-row {
    margin: var(--tec-spacer-1);
    padding: 2px 0px 0px 5px;
  }

  .tribe-events-c-small-cta__price::before {
    content: "Price of the event is ";
}

.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__month-separator+.tribe-events-calendar-list__event-row {
  margin-top: var(--tec-spacer-1);
}
/* end /events/ page */

  .tribe-events-widget, .tribe-events-widget-events-list__events {
  }
  .tribe-events-widget-events-list {
    margin: 0 auto;
    display: table;
  }
  .tribe-compatibility-container {
    margin: auto;
    display: table;
  }

  .tribe-events-calendar-list__event-wrapper {
    border: 1px solid #000;
  }

  /* Remove United States from displaying in address on front-end */
  .tribe-events-meta-group dd.location span.tribe-country-name {
    position: absolute;
    top: -10000px;
    visibility: hidden;
  }
  .single-tribe_events .tribe-country-name {
    display: none;
}

  /* Single Event */
    /* RdR added venue to the top of the single event 3/6/24 */
   
    .venue-header {
      text-align: center;
    }

    .venue-header-name {
      color: #24b1e7;
      font-size: 1.3rem;
    }

    .venue-header-title-address {
      font-size: 1rem;
      padding-bottom: 15px;
    }

    .single-event-featured-image{
    background: none;
    margin: auto;
    display: flex;
    justify-content: center;
    }

    /* Removed Category from displaying */
    .tribe-events-event-categories-label, .tribe-events-event-categories{
      display: none;
    }

  /*Home Featured Events */
.home-featured-events .entry-title {
    font-size: 24px;
    font-weight: 700;
    padding: 0;
    margin-bottom: 10px;
    text-align: left;
  }
  
  .home-featured-events .widget-title {
    font-weight:400;
  }
  
  .home-featured-events .entry {
    border: none;
    margin-bottom: 20px;
    padding: 0 0 4px;
  }
  
  .home-featured-events .wrap {
    background-color: rgba(255, 255, 255, 0.5);
    border:none;
    padding: 20px 10px;
  }
  
  .home-featured-events .widget {
    float: none;
    font-size: 15px;
    width:100%;
  }
  
  .home-featured-events .tribe-mini-calendar-event {
    display:inline-block;
    width: 22%;
    margin-right: 3%;
    float: left;
    border:none;
  }
  
  .home-featured-events .tribe-events-widget-link {
    clear: both;
    text-align: right;
    padding-top: 12px;
    border-top: 1px solid #dedede;
  }
  
  .home-featured-events .list-info h2 {
    font-size:20px;
    font-weight: 700;
  }
  
  .entry-image.attachment-tribe_events {
    margin: 10px 0 0;
    width: 100%;
  }
  
  .featured-content a.alignnone {
    margin-bottom: 10px;
    width: 100%;
  }
  
  .tribe-mini-calendar-event .list-info h2,
  .tribe-mini-calendar-event .list-info h2 a {	
    font-family: 'Open Sans Condensed,' 'Lato', Helvetica, sans-serif;
    font-size : 18px;
    font-weight:bold;
    line-height:24px;
    margin-top: 0;
    margin-bottom: 10px;
    padding:0;
  }

  .tribe-events-widget-venue-details {
    display: block;
    font-weight: 600;
    color: #24b1e7;
    text-transform: uppercase;
  }

  /* Venue Styling */
  .tribe-venue {
    font-size: 18px;
  }
  .tribe-events-address-label {
    color: var(--tec-color-text-primary);
    font-size: var(--tec-font-size-2);
    font-weight: var(--tec-font-weight-bold);
    margin-top: var(--tec-spacer-4);
    letter-spacing: 1px;
  }
  .tribe-venue-hours-days .tribe-venue-days-days{
    padding: 2px;
  }
  .event-date-time {
    margin-top: 8px;
    color: #666;
}

.event-date {
    font-weight: bold;
}

.event-time {
    margin-left: 8px;
}
    /* End Venue Styling */

/* Submit Form Styling**/
.submit-event-title{
 text-align: center;
}
 .site-content .ast-container {
  display: block;
}
#submit_event_form {
  width: 500px;
  list-style: none;
  padding: 10px 12px 5px 1px;
  border: 0px solid #000;
  box-shadow:
  0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12),
  0 0px 5px rgba(0, 0, 0, 0.2);
  margin: auto;
}

/*this is the UL */
.submit-event-form {
  list-style: none;
  margin: 0 0 0 1.5em;
}  

/* this is the LI */
.submit-event-form-list {
  padding: 4px 1px 4px 1px;
}
input[type=text]:focus, input[type=tel]:focus, input[type=url]:focus, input[type=email]:focus{
  border: 2px solid #24b1e7;
}
input[type=text], input[type=tel], input[type=url], input[type=email]{
  padding-top: 5px;
  margin-top: 5px;
}

label {
  width: 143px;
  display: inline-block;
}

input[type=url]{
  width:350px;
}

#event_description{
  width: 350px;
}

/* CSS for the form elements */
.submit-event-form {
  list-style: none;
  padding: 0;
}

.submit-event-form-list {
  margin-bottom: 10px;
}

/* Featured image label SPECIFIC changes */
label.event-featured-image-label {
  width: 185px;
}

i.size-italics {
  font-size: .8rem;
}

/* END Featured image label SPECIFIC changes */

/* CSS for new venue elements */
#new_venue_fields {
  margin: 10px 1px 2px -30px;
}

select#venue_select {
  max-width: 16em;
}

/* CSS for the submit button */
.submit-event-button {
  margin: 5px 1px 0px 10px;
  padding: 10px 0px 1rem 0px;
  margin: auto;
  text-align: -webkit-center;
}
.action-button {
  display: block;
  margin-top: 10px;
  background-color: #007bff;
  color: #fff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 16px;
}

.action-button:hover {
  background-color: #24b1e7;
}

/* Add styles for error handling */
.error {
  border-color: red; /* Add red border for fields with errors */
}

.error-message {
  color: red; /* Set error message text color to red */
  font-size: 14px; /* Customize error message font size */
  margin-top: 5px; /* Add some space between the field and the error message */
  display: block; /* Ensure the error message is displayed as a block element */
}

/* Loading style */
.loading-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 9999;
}

.loading-message {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 24px;
  border: 2px solid #ccc;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border-top-color: #24b1e7;
  border-left-color: #24b1e7;
  animation: spin 1s infinite ease-in;
}

@keyframes spin {
  0% {
      transform: rotate(0deg);
  }
  100% {
      transform: rotate(360deg);
  }
}

/* venue page */
.venue-page {
  width: 100%;
}

.venue-page-title {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 20px;
}

.venue-page-event-title {
  padding-bottom: 10px;
}


/* Feature What We Do Cards Styling */
.feature-cards .page-content {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  padding: .5rem;
  max-width: 1200px;
  margin: 0 auto;
}

.card {
  position: relative;
  height: 400px;
  width: 320px;
  background: linear-gradient(45deg, #667eea 0%, #764ba2 100%);
  border-radius: 20px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
  transform: translateY(-10px);
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
}

.card:nth-child(2) {
  background: linear-gradient(45deg, #f093fb 0%, #f5576c 100%);
}

.card:nth-child(3) {
  background: linear-gradient(45deg, #4facfe 0%, #00f2fe 100%);
}

.card .card-content {
  position: absolute;
  bottom: 0;
  top: 25px;
  left: 0;
  right: 0;
  padding: 2rem;
  color: white;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.6));
}

.card .title {
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 1rem;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
  text-align: center;
}

.card .copy {
  font-size: 1.1rem;
  line-height: 1.6;
  margin-bottom: 1.5rem;
  opacity: 0.9;
}

.card .btn {
  background: rgba(255, 255, 255, 0.2);
  color: white;
  border: 2px solid white;
  padding: 0.8rem 2rem;
  border-radius: 50px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  backdrop-filter: blur(10px);
  margin: 50px;
}

.card .btn:hover {
  background: white;
  color: #333;
  transform: scale(1.05);
}

.card-link {
  background: none;
}

/* Responsive Design */
@media (max-width: 768px) {
  .page-content {
    grid-template-columns: 1fr;
    padding: 1rem;
    gap: 1.5rem;
  }
  
  .card {
    height: 350px;
  }
}