/*
Theme Name: dstudio21
Theme URI:  http://dstudio21.com
Description: Test WordPress theme starter pack for faster design and development.
Author: dstudio21
Author URI: http://dstudio21.com
Version: 0.1
Tags: dstudio21
*/



/*----- Reset default browser CSS ---------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Lobster&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400&family=Pathway+Gothic+One&display=swap');

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, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {border:0; font-family:inherit; font-size:100%; font-style:inherit; font-weight:inherit; margin:0; outline:0; padding:0; vertical-align:baseline;}
:focus {/* remember to define focus styles! */outline:0;}
body {line-height: 1;}
ol, ul {list-style: none;}
table {/* tables still need 'cellspacing="0"' in the markup */border-collapse:separate; border-spacing:0;}
caption, th, td {font-weight:normal; text-align:left;}
blockquote:before, blockquote:after,
q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:0;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display:block;}


/*----- Structure ---------------------------------------*/
body {background: url(img/bg.png) no-repeat center top fixed; 
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.img/bg.png', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/bg.png', sizingMethod='scale')";
color:#2f241d; 
font-family: 'Montserrat', arial, sans-serif; 
font-weight: 400;
font-size:16px; 
line-height:22px; 
text-align:center;
}
a:link, a:active, a:visited {color:#2f241d;  cursor:pointer; font-weight:600; text-decoration:none;}
a:hover {text-decoration:underline;}


#closed{
background:url(img/closed.png) no-repeat left top;
height:300px;
margin:140px auto 0;
width:900px;

position:absolute;
left:50%;
top:50%;
margin:-100px 0 0 -450px;
}


.center {width:980px; margin:0 auto;}
#boxes {background: url(img/boxes.png) no-repeat 142px 0px; width:779px; height:1491px; margin:160px auto 0px; position: relative;}
#sold-out {background: url(img/sold-out.png) no-repeat 142px 0px; width:779px; height:625px; margin:160px auto 0px; position: relative;}
.hours {left:159px; height:245px; padding:0px 10px; position:absolute; top:335px; width:270px;}
.sign {left:159px; height:300px; position:absolute; top:660px; width:510px;}
#header {position:fixed; top:0px; left:0px; width:100%; height:100px; z-index:500; background:url(img/clouds.png) no-repeat center;}
#home {background:url(img/home.jpg) no-repeat center; width:100%; height:700px;}
#trees {background:url(img/trees.jpg) no-repeat center; width:100%; height:700px;}
#family {background:url(img/family.jpg) no-repeat center; width:100%; height:700px;}
#farm {background:url(img/farm.jpg) no-repeat center; width:100%; height:700px;}
#contact {background:url(img/contact.jpg) no-repeat center; width:100%; height:700px;}


#container {width:978px; min-height:660px; margin:62px auto 40px auto; text-align:center;}
#content {margin:0px; overflow:hidden; border:0px solid blue;}
#content img {max-width:100%;}
#footer {clear:both; width:100%; min-height:60px; padding:5px 0px; background:#797574; font-size:12px; line-height:14px;}
#logo_container {float:left; margin:0px 0px 8px 0px; border:0px solid yellow;}
#logo {z-index:100;}


/*----- Fonts ---------------*/
h1 {font: 60px/50px 'Lobster', cursive; padding:0 0 10px;}
h2 {font: 40px/52px 'Pathway Gothic One', sans-serif;}
h3 {font: bold 22px/40px 'Montserrat', arial, sans-serif;}
.white {color:#fff;}
.left {text-align: left; padding:0 0 0 100px;}
p {padding:0 0 20px 0;}
b, strong {font-weight:bold; font-family:'Trade Gothic W01 Roman', arial, sans-serif;}
i {font-weight:900;}



/*----- Menu ---------------*/
/*Main Menu*/
.nav {float:right; list-style:none; background:url(img/menu.png) no-repeat; width:543px; height:80px; padding:20px 0 0 0; z-index:1000; border:0px solid red;}
.nav li {display:inline; text-transform:lowercase; font-size:18px; line-height:24px; text-shadow:0px 0px 1px #f5f5f5; margin:30px 0px 0 0px; padding:0px 10px; border-left:1px dotted #e5e5e5;}
.nav li a {color:#e5e5e5; }
.nav li a:hover, .nav li.current-menu-item a {color:#85bbab;}

/*Copy*/
.copy-left {float:left; width:470px; height:508px; margin:160px 20px 0 20px; text-align:left;}
.copy-right {float:right; width:470px; height:px; margin:160px 20px 0 0; text-align:left;}






/*----- Slideshow ---------------*/
.center-slide {width:1000px; margin:0 auto; overflow:visible; border:1px solid red;}


#slides {width:100%; margin:0px auto; padding:100px 0 0 0; text-align:center; border:1px solid red;}
/*Slides container: Important:Set the width of your slides container, Set to display none, prevents content flash*/
.slides_container {display:none; width:100%; margin:0px auto; text-align:center; z-index:10;}
/*Each slide: Important: Set the width of your slides, If height not specified height will be set by the slide content, Set to display block*/
.slides_container div { margin:0px auto; width:1500px; height:500px; text-align:center; z-index:10;}
.slides_container div img {text-align:center; z-index:10;}

.slide {margin:0px auto; width:100%;}


/*--- Info Menu ---*/
.pagination {margin:0px auto; width:100%; height:30px; padding:0px; list-style:none; background:url(img/menu-background.png) repeat; textz-index:500;}
.pagination li {display:inline; text-align:center; font-size:14px; font-weight:bold; margin:0 6px;}
.pagination li a { width:100%; height:40px; padding:6px 0 0 0; margin:0px; color:#22368c;}
.pagination li a:hover, .pagination .current a {color:#fff;}























/*----- Footer ---------------*/




/* for 768px - Tablets */
@media screen and (max-width: 768px) {
	
	.center {width:652px; border:0px solid blue;}
	/*Home Page*/
	.team, .share {width:33.33%;}
	.tagline, .project_copy {width:66.67%;}
	.tagline p, .project_copy p {margin:8px 0px 0 10px;}
	.events {display:none;}
	.column, .column_two {width:50%;}
	.column-events {display:none;}
	
	.body_img {marign:0 0 20px 0;}
	.body_img, .body_copy {width:100%; min-height:100%; padding:0px;}
	
	#contact_menu li.fax, #contact_small {display:none;}
}


/* for 480px or less - Mobiles */
@media screen and (max-width: 480px) {
	
	#container,.center {width:320px; border:0px solid red;}
	#main_menu {display:none;}
	#mobile_menu {display:block;}
	/*Home Page*/
	.team, .share {width:100%;}
	.tagline, .project_copy {width:100%;}
	.tagline p, .project_copy p {margin:10px 0px;}
	.column, .column_two, .column-events {display:block; width:100%; padding:0px;}
	
	#footer {min-height:180px;}
	.footer_right, .footer_left {clear:both; text-align:center; width:100%;}
	#footer_menu {padding:20px 60px 0 0;}
	#contact_menu {padding:20px 0px; margin:15px 0; border-top:0px solid #5b5756;}
	#contact_menu li {float:left; display:block;}
	#contact_menu li.fax, #footer_small {display:none;}
	#contact_menu li.fax, #contact_small {display:block; float:left;}
	
	.body_img, .body_copy {width:100%; padding:0px;}
	
	
}