/*
Theme Name:     Generate SqurlGurl
Theme URI:      https://squrlgurl.com
Description:    Child theme for GeneratePress
Author:         Michelle Lightner
Author URI:     https://squrlgurl.com
Template:       generatepress
Version:        1.0
*/

/* Import parent theme styles */
@import url("../generatepress/style.css");
@media (min-width: 1025px) {
	.treehouse-wrapper {
		max-width: 1100px;
		margin: 0 auto;
	}
}
@media (max-width: 1024px) {
  ul.desktop-tv-list li div.tv-stand,
  ul.desktop-tv-list li div.details {

  }
}


@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 768px) 
  and (orientation: portrait) {



ul.mobile-tv-list li .details.second { width: 360px !important; float: left; position: relative; margin-top: -10px !important; }
ul.mobile-tv-list li p.content { color: #4D2508; float: right !important; position: relative; width: 330px; margin-top: -110px; }


ul.mobile-tv-list li { padding: 0 20px !important; }
ul.mobile-tv-list li div.tv-show { background-size: 320px auto !important; background-repeat: no-repeat; background-position-x: 15px; background-position-y: 37px; float: left; width: auto; position: relative; }

ul.mobile-tv-list li div.tv-show img { width: 100% !important; }
ul.mobile-tv-list li div.tv-stand img.squrl-run { position: absolute !important; top: 0; margin-left: 344px; }

 
ul.mobile-tv-list li div.tv-stand { float: left; width: 450px; background-image: url('./img/pine-tree.png'); background-repeat: no-repeat; background-position-x: 345px !important; background-position-y: 0; position: relative; }
  ul.desktop-tv-list li div.tv-stand img.squrl-run { position: absolute; left: 335px; margin-top: 100px; transform: scaleX(-1); }
  
  
ul.mobile-tv-list li .details { width: 100%; margin: 40px 0 20px 0 !important; padding: 8px 12px; background: #1e0d03;
	  box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
	  border-top: 1px solid #4D2508; 
	  border-radius: 10px 10px 10px 10px;
	  -webkit-border-radius: 10px 10px 10px 10px;
	  -moz-border-radius: 10px 10px 10px 10px;
  }
  
  								}



body { background-color: #261305; color: #6d482c; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* Remove all padding and margins from major containers  */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.clear::after {
  content: "";
  display: table;
  clear: both;
}
.site,
.site-header,
.site-content,
.site-footer,
.container,
.inside-article,
.inside-header,
.inside-footer,
.inside-navigation,
.widget-area,
.grid-container {
	padding: 0 !important;
	margin: 0 !important;
	max-width: 100% !important;
	width: 100% !important;
	box-sizing: border-box;
}


img.shadow {
filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.9));
}


.treehouse-wrapper {
  width: 100%;
  max-width: 900px;
  padding: 0 10px;
}
.site-content,
.content-area {
  width: 100%;
  display: flex;
  justify-content: center;
}




/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*		TV-LIST: UNIVERSAL 		*/
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */




ul.tv-list { margin: 0; list-style: none; }
ul.tv-list li div.tv-stand div.tv-show { background-size: 310px auto; background-repeat: no-repeat; background-position-x: 15px; background-position-y: 37px; float: left; width: auto; position: relative; }

ul.tv-list li:last-child { margin-bottom: 0; }
ul.tv-list li { padding: 6px; margin-bottom: 20px;
	background: linear-gradient(to top, #170b02, #2D1404, #170b02);
	box-shadow: 0 0 0px 2px rgba(0, 0, 0, 0.6);
	border-bottom: 1px solid #4D2508; 
	border-top: 1px solid #4D2508;
	border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
}

ul.tv-list li div.details h3, ul.tv-list li div.details h4, ul.tv-list li div.details h5 { margin: 0; padding: 0; }
ul.tv-list li div.details h3 { color: #88FB60; border-bottom: 1px solid #000; padding-bottom: 8px; }
ul.tv-list li div.details h4 a { color: #F87F2D; font-size: 20px; padding-top: 4px; display: block; text-decoration: none; border-top: 1px solid #381905; }
ul.tv-list li div.details h5 { margin: 0; padding: 0; }

ul.tv-list li div.details.second p { color: #88FB60; margin: 0; padding: 0; }
ul.tv-list li div.details.second a { color: #F87F2D; text-decoration: none; }







/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*		TV-LIST: MOBILE 		*/
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */




ul.mobile-tv-list li {  }

ul.mobile-tv-list li .details.first { margin-top: -25px; }

ul.mobile-tv-list li .details.second a { display: inline; }
ul.mobile-tv-list li .details.second a.purchase { text-align: center; display: block; text-decoration: none; color: #89FB60; 
margin: 8px 0;
padding: 6px;
background: #183519;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #2E5F11; 
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}

ul.mobile-tv-list li div.tv-stand { 
background-image: url('./img/pine-tree.png'); background-repeat: no-repeat; 
background-position-x: 230px; background-position-y: 0;
filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.9));
}

ul.mobile-tv-list li div.tv-stand img.squrl-run { position: relative; margin-top: 90px; }

ul.mobile-tv-list li div.tv-stand div.tv-show { 
background-size: 200px auto; 
background-repeat: no-repeat; 
background-position-x: 12px; 
background-position-y: 30px; 
float: left; width: auto; position: relative; 
}

ul.mobile-tv-list li div.tv-stand div.tv-show img { width: 233px;  }

ul.mobile-tv-list li .details { padding: 8px 12px; margin: 6px; background: #1e0d03;
	box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
	border-top: 1px solid #4D2508; 
	border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
}


ul.mobile-tv-list li p.content { padding: 8px 12px 18px 12px; margin: 0; }
ul.mobile-tv-list li .details.second img#tree { margin-top: -30px; position: absolute; right: 20px; width: 80px; }

ul.mobile-tv-list li div.details.second p.length, ul.tv-list li div.details.second p.category { 
text-shadow: 0 1px 0 #000; background: #170b02; color: #88FB60; padding: 6px; margin: 0 70px 4px 0; font-weight: normal; font-size: 14px;
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}




/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*		TV-LIST: DESKTOP 		*/
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */




ul.desktop-tv-list {  }

ul.desktop-tv-list li { padding: 20px; }
ul.desktop-tv-list li p.edit-link a { text-align: center; display: block; text-decoration: none; color: #89FB60;
	margin-bottom: 12px;
	padding: 6px;
	background: #183519;
	box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
	border-top: 1px solid #2E5F11; 
	border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
 }

ul.desktop-tv-list li div.tv-stand { float: left; width: 440px; background-image: url('./img/pine-tree.png'); background-repeat: no-repeat; background-position-x: 345px;background-position-y: 0; position: relative; 
filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.9));
}
ul.desktop-tv-list li div.tv-stand img.squrl-run { position: absolute; left: 335px; margin-top: 100px; transform: scaleX(-1); }


ul.desktop-tv-list li .details.second a { display: inline; }
ul.desktop-tv-list li .details.second { width: 350px; float: left; position: relative; margin-top: -10px; margin-bottom: 20px; }
ul.desktop-tv-list li .details.second img#tree { position: absolute; margin-left: 335px; margin-top: -50px; }  
ul.desktop-tv-list li .details.second img.squrl-run { position: absolute; margin-top: -90px; margin-left: 430px; }

ul.desktop-tv-list li p.content a { text-align: center; display: block; text-decoration: none; color: #89FB60; position: absolute; bottom: 0; width: 360px; 
margin-bottom: 12px;
padding: 6px;
background: #183519;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #2E5F11; 
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}

ul.desktop-tv-list li p.content { color: #6d482c; font-weight: bold; line-height: 30px; font-size: 14px; float: right !important; position: relative; width: 390px; height: 223px; overflow: hidden; 
margin-top: 20px; 
padding: 8px 12px 60px 12px; 
background: #1e0d03;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #4D2508; 
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
 }



ul.desktop-tv-list li .details { width: 100%; 
	margin-top: 20px; 
	padding: 8px 12px; 
	background: #1e0d03;
	box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
	border-top: 1px solid #4D2508; 
	border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
}





/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*	UNIVERSAL : TV SHOW SINGLE PAGE 		*/
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */


div.tv-show-info div.guide a { text-decoration: none; color: #89FB60;  }
div.tv-show-info div.guide p.edit a { text-align: center; display: block; text-decoration: none; color: #89FB60; 
margin-bottom: 12px;
padding: 6px;
background: #183519;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #2E5F11; 
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}

div.tv-show-info div.guide { color: #703c1d; 
padding: 8px 12px 60px 220px; 
background: #1e0d03;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #4D2508; 
border-radius: 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0; }


div.tv-show-info.desktop div.guide.two {  margin: 20px 200px 0 0; }

div.tv-show-info div.guide.two { color: #081108; font-weight: bold; text-shadow: 0 1px 0 #183219;
padding: 12px; 
background: #102311;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #2E5F11; 
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
margin: 70px 0 0 0;
}

div.tv-show-info div.guide.two p.date, div.tv-show-info div.guide.two p.category, div.tv-show-info div.guide.two p.length { text-shadow: 0 1px 0 #000; background: #081108; color: #183219; padding: 6px; margin: 6px; font-weight: normal; font-size: 15px;
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
border-bottom: 1px solid #183219;
}






/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*	MOBILE : TV SHOW SINGLE PAGE 		*/
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */




div.tv-show-info.mobile div.guide { color: #703c1d; 
padding: 8px 12px 60px 12px; 
background: #1e0d03;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #4D2508; 
border-radius: 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0; }


div.tv-show-info.mobile div.nature { position: absolute;  }



div.tv-show-info.mobile div.nature img.squrl { position: relative; margin-left: -70px; margin-bottom: -30px; }
	
div.tv-show-info.mobile div.guide.two p.date, div.tv-show-info.mobile div.guide.two p.length { 
margin: 6px 0 6px 100px
}

div.tv-show-info.mobile div.guide.two { color: #081108; font-weight: bold; text-shadow: 0 1px 0 #183219;
padding: 12px; 
background: #102311;
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.6);
border-top: 1px solid #2E5F11; 
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
margin: 70px 0 0 0;
}
	
div.tv-show-info div.guide p, div.tv-show-info div.guide h1 { margin: 0; padding: 0; }
div.tv-show-info div.guide p { }
div.tv-show-info div.guide h1 { }


div.tv-show-info .theater video { margin: -40px 0 0 0; border-radius: 20px 20px 20px 20px;
-webkit-border-radius: 20px 20px 20px 20px;
-moz-border-radius: 20px 20px 20px 20px; }


div.tv-show-info .how-does-it-work { margin: 25px 0 25px 0; padding: 10px 40px 20px 30px; background-color: #110802; border-radius: 20px 20px 20px 20px;
-webkit-border-radius: 20px 20px 20px 20px;
-moz-border-radius: 20px 20px 20px 20px; }
div.tv-show-info .how-does-it-work { color: #7c451f; }
div.tv-show-info .how-does-it-work h1 { color: #F87F2D; }
div.tv-show-info .how-does-it-work ul li { margin-left: 15px; list-style-type: decimal; color: #88FB60; }



/*------------------------------------*\
	UNIVERSAL: CONTACT FORM
\*------------------------------------*/
div.tv-show-info img.form-tree { position: absolute; left: 325px; margin-top: -15px; }
div.tv-show-info img.form-squrl { position: absolute; left: 400px; margin-top: 210px; }

div.tv-show-info form.wpcf7-form { margin: 25px 0 25px 0; padding: 10px 40px 0 30px; background-color: #110802; border-radius: 20px 20px 20px 20px;
-webkit-border-radius: 20px 20px 20px 20px;
-moz-border-radius: 20px 20px 20px 20px; }

div.tv-show-info form.wpcf7-form label { display: block; color: #88FB60; font-size: 18px; line-height: 32px; font-weight: normal !important; }
div.tv-show-info form.wpcf7-form input#contact-username { width: 380px; background: #251104; padding: 10px 6px; border: 1px solid #7c451f; color: #7c451f; }
div.tv-show-info form.wpcf7-form input[type=text] { width: 502px; background: #251104; padding: 10px 6px; border: 1px solid #7c451f; color: #7c451f; }
div.tv-show-info form.wpcf7-form input[type=text], div.tv-show-info.desktop form.wpcf7-form input[type=email], form.wpcf7-form select { font-size: 16px !important; }
div.tv-show-info form.wpcf7-form select { font-size: 16px !important; background: #110802; border: 1px solid #7c451f; color: #7c451f; padding: 10px 6px; }
div.tv-show-info form.wpcf7-form input[type=submit] { text-align: center; width: 200px; border: none; color: #F87F2D; font-size: 18px; margin-top: 15px; padding: 10px; background: #341804; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; box-shadow: 0px 0px 4px 3px rgba(0,0,0,1);
-webkit-box-shadow: 0px 0px 4px 3px rgba(0,0,0,1);
-moz-box-shadow: 0px 0px 4px 3px rgba(0,0,0,1);
background: #341804;
background: repeating-linear-gradient(90deg,#341804 0%, #4e2407 20%);
background: -webkit-repeating-linear-gradient(90deg,#341804 0%, #4e2407 20%);
background: -moz-repeating-linear-gradient(90deg,#341804 0%, #4e2407 20%); }

.wpcf7-not-valid-tip { position: absolute; margin-left: -23px; margin-top: -38px; color: #F87F2D; width: 25px; text-align: center; }
.wpcf7 form.invalid .wpcf7-response-output { display: none; }
.wpcf7 form.sent .wpcf7-response-output { margin: 0 !important; padding: 0 0 30px 0 !important; border: none !important; text-align: center; font-size: 22px; color: #88FB60; }






div.site-footer footer div { background-color: #170a02; color: #7c451f; padding: 12px; }
div.site-footer footer div a { text-decoration: none; color: #88FB60; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*		PAGINATION 		*/
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * */
div.pagination { 
color: #85F35D; 
}
div.pagination ul { 
float: right; 
margin: 0; 
padding: 0;
list-style: none;
}
div.pagination ul li { 
float: left; 
width: auto;
margin: 0 4px; 
padding: 0;
}
div.pagination ul li a {
display: block;
padding: 8px 14px;
text-decoration: none;
border-radius: 8px;
color: #85F35D;
box-shadow: 0 2px 5px #000;
background-color: #351704;
border: 1px solid #351704; 
font-size: 12px;
transition: background-color 0.3s ease;
}
div.pagination ul li a:hover {
background-color: #1B0A00;
border: 1px solid #351704;
}
div.pagination ul li .current {
box-shadow: 0 2px 5px #000;
border: 1px dashed #351704;
background-color: #1B0A00;
color: #85F35D;
font-weight: bold;
font-size: 10px;
display: block;
padding: 8px 14px;
text-decoration: none;
border-radius: 8px;
}












