/*
 Theme Name:   Camp Feral!
 Theme URI:    http://campferal.org/
 Description:  Feral theme based on Twenty Fifteen
 Author:       Camp Feral! - Tanuki Gokuhi
 Author URI:   http://campferal.org/
 Template:     twentythirteen
 Version:      1.0.0
 License:      Private
 License URI:  http://campferal.org/
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fifteen-feral
*/

body{
	background-color: #FFF9EB;
	/*background: url(/wp-content/uploads/2017/03/bg-2017.jpg?v=1.0) no-repeat center center fixed;*/
/* 	background: url(/wp-content/themes/feral/images/background.jpg) no-repeat center center fixed; */
	background: url(/wp-content/uploads/2022/09/691b9fbb-wooden_bg-scaled.jpg?v=1.0) repeat-y center center fixed !important;
	background-size: cover;
	hyphens:none !important;
}

body header.site-header{
	background-position: top center;
}
div.site-info{ display:none; }
div.site { border: 0; }

div#page{ background: transparent; }
div#main{ background: #FFF9EB; }
div#navbar{ border-radius: 7px 7px 0 0; }

/* Changing to EM for resposive sizing */
h1{
	font-family: Cabin Sketch, sans-serif;
	font-size: 2.5em;
	margin-bottom: 1rem;
}
h2{
	font-family: Cabin Sketch, sans-serif;
	font-size: 1.5em;
	margin-bottom: 0.5rem;
}
h3, h4, h5{
	font-family: Wendy One, sans-serif;
	font-size: 1em;
	margin-bottom: 0.5rem;
}

h4, h5{
	font-family: Poppins, sans-serif;
	font-size: 1rem;
	text-decoration: underline;
	margin-bottom: 0.5rem;
	font-weight: normal;
	font-style: italic;
}

blockquote{
	font-size: 1.25em !important;
}

p, ul{
	font-size: 1em;
	margin-bottom: 1rem;
}
li {
	margin:0;
	padding:0;
}

/* Hide page titles */
article.type-page .entry-header{
	display: none;
}

.widget{
	padding: 1rem;
}

/* Converting image galleries to flex boxes */
.gallery{
	display:flex;
	margin-bottom: 1rem;
	flex-direction:row;
	flex-wrap: wrap;
	align-items:center;
}

/* Flickr */
.slickr-flickr-gallery, .slickr-flickr-gallery ul li{
	padding:0 !important;
}
.slickr-flickr-gallery img{
	border:0 !important;
	padding: 2px !important;
}

div.home-content{
/* 	padding: 0 350px 25px 25px; */ 
	padding: 0 2.5rem 2.5rem 2.5rem; /* Changing padding to REM for resposive sizing */
}

body.home .site-main .sidebar-inner{
	max-width: 1515px;	
}

body.home .site-main .widget-area{
	margin-top: 10.85%;
/* 	padding: 0 25px 25px 25px; */
	padding: 0 2.5rem 2.5rem 2.5rem; /* Changing to REM for resposive sizing */
	width: 350px;
	border-radius: 7px 7px 7px 7px;
}

aside.widget_sidebarlogin label{
	width:100%;
	display: block;
}
aside.widget_sidebarlogin input[type='text'], aside.widget_sidebarlogin input[type='password']{
	width:100%;
}
#home-section-1, #home-section-2{
	width: 50%;
	float: left;
}
#home-section-1 h2, #home-section-2 h2{
/* 	margin: 0 0 25px 0; */
	margin: 0 0 2.5rem 0; /* Changing margins to REM for resposive sizing */
}
#home-section-1 ul{
	list-style-type: none;
	padding:0;
}
#home-section-1 ul li{
	background-image: url(/wp-content/themes/feral/images/fire.png);
	background-repeat: no-repeat;
	background-position: 0px center; 
	background-size: 37px;
/* 	margin: 15px 0; */
	margin: 1.5rem 0; /* Changing to REM for resposive sizing */
/* 	padding-left: 40px; */
	padding-left: 4rem; /* Changing to REM for resposive sizing */
/* 	line-height: 18px; */
	line-height: 1.5em; /* Changing to EM for resposive sizing */
}
#home-section-1 ul li a{
	display: block;
}
#home-section-1 ul li span{
	font-size: 0.8em;
	color: #888;
	font-style: italic;
}
#home-section-2{
/* 	background-color: rgba(247, 245, 231, 0.7); */
/* 	padding: 20px; */
	padding: 2rem; /* Changing to REM for resposive sizing */
}
.site-logo-link{
	width: 100%;
	display: block;
	text-align: center;
/* 	padding: 15px; */
	padding: 1.5rem; /* Changing to REM for resposive sizing */
}

#theme-my-login{
	background:none !important;
}
#sidebar-login-links-left li{
	display:inline;
}
/* Home Page bellow 999vw */
@media (max-width: 999px) {

  body.home .site-main .widget-area{
	margin-top: 0;
  }
  div.home-content{
/* 	padding: 0 25px 0 25px; */
	padding: 0 2.5rem 0 2.5rem; /* Changing to REM for resposive sizing */
  }
  #home-section-1, #home-section-2{
	width: 100%;
	float: inherit;
  }
}

.acronym{
	font-size: 2em; 
	font-weight: bold;
}

@media (max-width: 767px) {
.site-header {
    background-size: inherit !important;
 }

/* Changing to EM for resposive sizing */
h1{
	font-size: 1.5em !important;
	margin-bottom:0.5rem;
}
h2{
	font-size: 1.25em !important;
	margin-bottom: 0rem;
}
	
.acronym{
	font-size: 1.25em; 
	font-weight: bold;
}
	
.widget{
	padding: 0.5rem;
}
	
/* collapse image galleries */
.gallery, .blocks-gallery-grid, .wp-block-gallery{
	flex-direction:column;
}
	
.widget .gallery figure.gallery-item, .blocks-gallery-grid .blocks-gallery-item{
	max-width: 100%;
	width: 100%;
}
	
}

/*
 * Note from Yen - 2017-04-08
 * I think we can do away with the following styles. 
 * They appear to be reated to EventPlus and we've kicked that violently to the curb. 
 *
 * We shoud spin a dev unit of WP up and test removing these configs. 
 * */
/* Edits to make the Dates fit properly inside the calendar pages displayed by the Event Macro */
.timing time.icon span {
    padding-top: 19px !important;
    letter-spacing: 0em;
}

.timing time.icon em {
    bottom: -0.1em;
}

/*This tweak will adjust the alignment of the dash character between the calendar pages displayed by the Event Macro*/
.timing .eve-sap {
    top: 20px;
}

/*This tweak adjusts how the title of the Registration is presented. Specifically, it will not allow wrapped 
text to be hyphena-
ted. */
.event-cont .eve-title h3 a:link, .event-cont .eve-title h3 a:active, .event-cont .eve-title h3 a:visited, .event-cont .eve-title h3 a:hover {
    hyphens: none;
}

/*This tweak adjusts the position of the Registration description in it's frame. Allowing it to be aligned 
with the title of the event. */
.event-cont .eve-desc {
    padding-left: 0;
}

/*On mobile devices and small screens the width of the Event Details div in registration can cause the 
prices to skew down in a row of single letters. Set the width to 602 (what it actually renders at noremally)
and set to IMPORTANT so it activates page scrolling. */
#details {
	border-style:solid;
	border-width:2px;
	border-color:#FF0000;
	padding: 0 0 15px;
	width:602px!important;
}


/*This forces the site-logo to rezie down to the width allowed by the screen. This is so that on mobile devices
smaller than the width of the logo, the image will resize to properly fit the whole top of the screen.*/
.site-logo { 
	max-width: 100%; 
}

/*Adjust the size of the widget 3 object to align and fit properly with it's brothers in the homepage screen*/
#home-section-3 {
	width: 554px; 
	text-align: center;
}

/*Makes the caption text in the front-page carousel visible and moves the control buttons to the top. */
.slideshow-slide-caption {
    height: 40px !important;
    line-height: normal !important;
}
.slideshow-controls {
	bottom : auto !important;
}

/*Following configs are collected from work in the 'Customize --> CSS' system in wordpress, building out specific 
 * prettifying changes using WordPress' built in dynamic CSS system*/

/* Make Convention Master page full sized.*/
#post-695 .entry-content{
	max-width: 1600px;
	padding: 0 160px 0 160px;
}


/*Unify the padding, margins and smoothed edges of all Site Builder elements*/
.panel-row-style  {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
}
.panel-grid-cell {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
}
.rounded-edges {
    border-top-left-radius: 7px !important;
    border-top-right-radius: 7px !important;
    border-bottom-right-radius: 7px !important;
    border-bottom-left-radius: 7px !important;
}
.widget-square-shape {
	border-radius: initial;
}
.widget-flat-bottom {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.widget-flat-top {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
}
.widget-flat-top-right {
    border-top-left-radius: 7px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
}
.widget-flat-top-left {
    border-top-left-radius: 0px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
}
.widget-flat-bottom-right {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 7px;
}
.widget-flat-bottom-left {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 0px;
}
.widget-round-top-right {
    border-top-left-radius: 0px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.widget-round-top-left {
    border-top-left-radius: 7px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.widget-round-bottom-right {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 0px;
}
.widget-round-bottom-left {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 7px;
}
.widget-round-left-side {
    border-top-left-radius: 7px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 7px;
}
.widget-round-right-side {
    border-top-left-radius: 0px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 0px;
}
.widget_sow-hero{
	border-radius: 7px 7px 7px 7px;
}
.widget {
	border-radius: inherit;
	/* padding: 1rem !important;  Changing parent theme padding to REM for resposive sizing */
	hyphens:none !important;
}

div.widget {
	background-color:transparent !important;
}

aside.widget{
	background-color:#F7E6C3 !important;
}

footer.site-footer{
	background-color:#F7E6C3 !important;
}

ul.sub-menu .current-menu-item > a, ul.sub-menu .current_page_item > a{
	color: #F7E6C3 !important;
}


/*Make Site Builder images rounded at
the corners*/
.so-widget-image, li.sow-slider-image.sow-slider-image-cover.cycle-slide.cycle-slide-active {
	border-radius: 7px 7px 7px 7px;
}
/*every image rounded except for the Front Page headder.
 * Only round the bottom. */
#home_headder > div > div > ul > li.sow-slider-image.sow-slider-image-cover.cycle-slide.cycle-slide-active{
	border-radius: 0 0 7px 7px;
}

/*Begin Fluid Layout Styles: 
Each of these different blocks will fire 
based on the size of the clients screen, 
making the site more usable on mobile devices with variable sizes.
 
The following screen ranges are handled: 

1600px to 1200px
1200px to 960px
960px to 600px
600px to 480px
480px to 320px
*/

/*Reflow site layout for smaller displayes*/
/*Also remove the Footer and sidebar for tablet and Cellphone display sizes.*/
@media screen and (max-width: 380px) {
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		width: 320px;
		padding: 0 0;
	}

	/*Remove footer and sidebar for these small screen resolutions. */
	.site-footer, .sidebar-container{
		display: none;
	}
	/*Now expand the view space to take up the available space left by the sidebar.*/
	div.home-content, .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
		padding: 0 0 ;
	}

	html, .widget {
		font-size: 100%;
	}
}
/*Also remove the Footer and sidebar for tablet and Cellphone display sizes.*/
@media screen and (max-width: 480px) and (min-width: 380px) {
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 380px;
		width: 320px;
		padding: 0 5px;
	}
	
	/* Decreasing the padding for siteorigin widgets	 */
	.widget{
		padding: 0.5em;
	}

	/*Remove footer and sidebar for these small screen resolutions. */
	.site-footer, .sidebar-container{
		display: none;
	}
	/*Now expand the view space to take up the available space left by the sidebar.*/
	div.home-content, .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
		padding: 0 5px;
	}

	html, .widget {
		font-size: 100%;
	}
}

/*Reflow site layout for smaller displayes*/
/*Also remove the Footer and sidebar for tablet and Cellphone display sizes.*/
@media screen and (max-width: 620px) and (min-width: 480px) {
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 480px;
		min-width: 380px;
		padding: 0 30px;
	}

	/*Remove footer and sidebar for these small screen resolutions. */
	.site-footer, .sidebar-container{
		display: none;
	}
	/*Now expand the view space to take up the available space left by the sidebar.*/
	div.home-content, .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
		padding: 0 30px;
	}

	html, .widget {
		font-size: 100%;
	}
}

/*Reflow site layout for smaller displayes*/
/*Also remove the Footer and sidebar for tablet and Cellphone display sizes.*/
@media screen and (max-width: 740px) and (min-width: 620px) {
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 620px;
		min-width: 500px;
		padding: 0 60px;
	}

	/*Remove footer and sidebar for these small screen resolutions. */
	.site-footer, .sidebar-container{
		display: none;
	}
	/*Now expand the view space to take up the available space left by the sidebar.*/
	div.home-content, .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
		padding: 0 60px;
	}

	html, .widget {
		font-size: 100%;
	}
}

/*Reflow site layout for smaller displayes*/
/*Also remove the Footer and sidebar for tablet and Cellphone display sizes.*/
@media screen and (max-width: 860px) and (min-width: 740px) {
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 740px;
		min-width: 620px;
		padding: 0 60px;
	}

	/*Remove footer and sidebar for these small screen resolutions. */
	.site-footer, .sidebar-container{
		display: none;
	}
	/*Now expand the view space to take up the available space left by the sidebar.*/
	div.home-content, .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
		padding: 0 60px;
	}

	html, .widget  {
		font-size: 100%;
	}
}

/*Reflow site layout for smaller displayes*/
/*Also remove the Footer and sidebar for tablet and Cellphone display sizes.*/
@media screen and (max-width: 980px) and (min-width: 860px) {
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 860px;
		min-width: 740px;
		padding: 0 60px;
	}

	/*Remove footer and sidebar for these small screen resolutions. */
	.site-footer, .sidebar-container{
		display: none;
	}
	/*Now expand the view space to take up the available space left by the sidebar.*/
	div.home-content, .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
		padding: 0 60px;
	}

	html, .widget  {
		font-size: 100%;
	}
}

/*Reflow site layout for smaller displayes*/
/*Also remove the Footer and sidebar for tablet and Cellphone display sizes.*/
@media screen and (max-width: 1100px) and (min-width: 980px) {
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 980px;
		min-width: 860px;
		padding: 0 60px;
	}

	/*Remove footer and sidebar for these small screen resolutions. */
	.site-footer, .sidebar-container{
		display: none;
	}
	/*Now expand the view space to take up the available space left by the sidebar.*/
	div.home-content, .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
		padding: 0 60px;
	}

	html, .widget  {
		font-size: 100%;
	}
}

@media screen and (max-width: 1220px) and (min-width: 1100px) {
/* Make Wide Templates actually Wide */
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 1100px;
		min-width: 980px;
		padding: 0 60px;
	}

	html, .widget  {
		font-size: 110%;
	}

	/*Reposition side-bar widgets to line up with home-content div's height */
	body.home .site-main .widget-area{
		margin-top: 16%;
	}
}

@media screen and (max-width: 1340px) and (min-width: 1220px) {
/* Make Wide Templates actually Wide */
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 1220px;
		min-width: 1100px;
		padding: 0 60px;
	}

	html, .widget  {
		font-size: 115%;
	}

	/*Reposition side-bar widgets to line up with home-content div's height */
	body.home .site-main .widget-area{
		margin-top: 40%;
	}
}

@media screen and (max-width: 1600px) and (min-width: 1340px) {
/* Make Wide Templates actually Wide */
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 1340px;
		min-width: 1200px;
		padding: 0 70px;
	}

	html , .widget {
		font-size: 120%;
	}

	/*Reposition side-bar widgets to line up with home-content div's height */
	body.home .site-main .widget-area{
		margin-top: 12.85%;
	}
}

@media screen and (min-width: 1600px) {
/* Make Wide Templates actually Wide */
	body, .page-template-wide-page, body.page-template-wide-page .entry-header, body.page-template-wide-page .entry-content, body.page-template-wide-page .entry-summary, body.page-template-wide-page .entry-meta {
		margin: 0 auto;
		max-width: 1600px;
		min-width: 1440px;
		padding: 0 80px;
	}

	p, html, .widget {
		font-size: 120%;
	}
}


/*Manage Footer Positions
This will set three very specific panes within the foot into a horizontal alignment.*/
/*
#nav_menu-8.widget = Auth page
#sow-social-media-buttons-2.widget = Social Media
#nav_menu-7.widget = Important Info
*/
.sidebar .site-footer .widget-area, .sidebar .site-footer .widget-area.masonry {
	padding: 3px 0px 3px 0px;
	max-width: 100%;
	width: 100%;
	margin: auto 2%;
	left: 0px;
	top: 0px;
	display: inline-block;
	float: none;
	vertical-align: top;
}
#nav_menu-7 {
	left: 0% !important;
	top: 0 !important;
	width: 25% !important;
}
#sow-social-media-buttons-4 {
	left: 33% !important;
	top: 0 !important;
	width: 50% !important;
}
#nav_menu-8 {
	left: 75% !important;
	top: 0 !important;
	width: 20% !important;
	margin: auto 5%;
}

/*Make the footer narrower instead of the fuckoff big size it seems to want to default to.*/
.sidebar .site-footer .widget-area.masonry {
	height: 150px !important;
}
.site-footer .sidebar-container {
	border-radius: 0 0 7px 7px;
}

footer div#secondary{
	background-color: #F7E6C3 !important;
}

footer h3.widget-title{
	color:#382400 !important;
}

footer aside.widget{
	background-color:transparent !important;
}