/* 
 Theme Name:     Cornwall Stairs
 Author:         Mark Bennetts Design
 Author URI:     https://markbennetts.me
 Template:       Divi
 Version:        1.0.0
 Description:   A Divi Child Theme
*/ 

/***** Home Page *****/
body.home #page-container #et-main-area #main-footer {display:none;}
body.home {height:100%;overflow:hidden;}

/***** Header *****/
#main-header {border-top: 4px solid #c75320;border-botom: 4px solid #c75320;}

@media only screen and (min-width: 981px) {
#main-header.et-fixed-header {box-shadow: 0 0 7px rgba(0, 0, 0, 0.5) !important;}
}

@media only screen and (min-width: 1100px) {
li.menu-item-783 {margin-right:2.5em;}
}

#et-top-navigation ul#top-menu li.menu-item-type-custom {padding-right:12px;}
#et-top-navigation ul#top-menu li.menu-item-type-custom i {font-size:20px;}

#cs-icons {position:relative; font-size:12px;}
.menu-item-object-custom i:hover {color:#c75320;}
#cs-icons:hover #phone-hover {display:block; left:-50px; animation-duration: 1s;}
#cs-icons:hover #email-hover {display:block; left:-200px; animation-duration: 1s; transition-delay: 1s; transition-duration: 1s;}
#phone-hover, #email-hover {display:none; position:absolute; top:-25px; white-space: nowrap;}

/***** Slider *****/
.et-pb-controllers a {width:15px;height:10px;}

.et_pb_fullwidth_slider_0 .et_pb_slide_description, .et_pb_fullwidth_slider_5 .et_pb_slide_description {position:relative;}
.et_pb_slide_0 .et_pb_slide_content, .et_pb_slide_5 .et_pb_slide_content {position:absolute;right:0px;bottom:0px;background-color:white;padding:10px;}
.et_pb_slide_0 .et_pb_slide_content p, .et_pb_slide_5 .et_pb_slide_content p {text-align:right;}

/***** Contact Page *****/
#wpcf7-f1566-p153-o1 .wpcf7-form-control-wrap input {width:100%; padding:10px;}
#wpcf7-f1566-p153-o1 .wpcf7-form-control-wrap textarea {width:100%; padding:10px; height:120px;}
#wpcf7-f1566-p153-o1 .wpcf7-submit {padding:10px; background-color:#9f9f9f; color:white; font-weight:500; font-size:18px; margin:10px 0; border:0;}
#wpcf7-f1566-p153-o1 .wpcf7-submit:hover {background-color:#c9c9c9; cursor:pointer;}

strong.contact-info {color:#c75320; font-size:16px;}


/********************/
/***** Projects *****/
/********************/

/* Heading Blocks */
div.cs-filter-container {height:auto;}

div.cs-project-all {cursor:pointer; background-color:#ddd; padding:15px;}
div.cs-project-all h4 {text-align:center;}

ul.cs-project-headings {margin-bottom:25px; width:90%; float:left;}
ul.cs-project-headings li {display:block; width:22.75%; float:left; margin-right:3%; cursor:pointer; background-color:#ddd;}
ul.cs-project-headings li div {max-height:150px;overflow:hidden;}
ul.cs-project-headings li h4 {padding:15px; height:80px;}
ul.cs-project-headings li:nth-child(4) {margin-right:0 ! important;}
ul.cs-project-headings li:not(.cs-project-selected):hover img {opacity: 0.8; transition:.3s;}
ul.cs-project-headings li:not(.cs-project-selected):hover h4{background-color:#c8c8c8; transition:.3s;}

/* Selected Filter */
ul.cs-project-headings .cs-project-selected h4 {background-color:#c75320; font-weight:600; color:white;}
div.cs-project-selected {background-color:#c75320;}
div.cs-project-selected h4 {font-weight:600; color:white;}

/* Project Blocks */
.cs-project {background-color:#ddd; padding:25px; margin-bottom:50px; border-top: 2px solid #c75320; }

/* Project Images */
ul.cs-project-gallery li {display:block; width:31%; float:left; margin:0 3.5% 25px 0;}


/***************************************************************************/


/*********************/
/***** Galleries *****/
/*********************/

/*** Top Filters ***/
.cs-filter {margin:8px 8px 8px 0; font-size:16px; font-weight:400; display:inline-block; color:#6b6b6b; cursor: pointer; background-color:#ddd; padding:15px;}
.cs-filter:not(.cs-selected):hover {background-color:#c8c8c8}
.cs-filter-divider {margin:8px 8px 8px 0; display:inline-block; font-size:16px; font-weight:400;padding:15px 0px; color:#ddd; background-color:#ddd}
.cs-selected {background-color:#c75320 ! important; font-weight:600; color:white;}

.cs-hide {display:none;}

/*** Gallery Items Top ***/
#galleries {min-height:1000px; font-size:0px;position:relative;}
#galleries article {width:23%; display:inline-block;margin:12px 2% 12px 0;}
	
#galleries article .top-display .top-image {width:100%; overflow:hidden; cursor:pointer; max-height:170px;}
#galleries article .top-display .top-image img {width:100%;}
	
#galleries .cs-open .top-display .top-image {opacity:0.5; transition-duration:0.3s;}

/*** Gallery Items Bottom Layout ***/
#galleries .bottom-info {font-size:13px; background-color:#ddd; clear:both; position:absolute; height:0; left:0; transition:height 0.3s linear; overflow:hidden; width:98%; padding-left:20px; transition:margin 0.3s linear;}
	
#galleries article .cs-select {position:absolute; top:auto; padding:20px ! important;margin:20px 0;height:700px ! important;transition:height 0.3s linear;transition:margin 0.3s linear;}
	
#galleries .bottom-info-hidden {display:none; position:relative; height:750px; width:400%; float:left;z-index: -1;}

/*** Gallery Itmes Bottom Content ***/

/* Left */
#galleries .bottom-info .flexslider {width:62%; float:left; margin:0 3% 10px 0;}

/* Right */
#galleries .bottom-info .bottom-info-right {width:35%;float:right;}
#galleries .bottom-info .bottom-info-right div {margin:0 0 10px;}
   
/* Navigation Controls */
#galleries .bottom-info .flexslider .flex-direction-nav li a {top:38%;height:75px;}
#galleries .bottom-info .flexslider .flex-direction-nav li .flex-prev::before {margin-bottom:20px;}
#galleries .bottom-info .flexslider .flex-direction-nav li .flex-next::after {margin-top:20px;}
.et_right_sidebar #main-content .container::before {display:none;}

/********************************************/
/**********   ONLY LARGE SCREENS   **********/
/********************************************/
@media only screen and (min-width: 982px) {
	
/* Projects */
div.cs-project-all {float:left; margin-right:3%; width:7%; height:230px;}
div.cs-project-all h4 {white-space: nowrap; margin-top:105px; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);}

ul.cs-project-gallery li:nth-child(3) {margin-right:0 ! important;}	
}

/********************************************/
/**********    TABLETS AND DOWN    **********/
/********************************************/

@media only screen and (max-width: 981px) {
	
	/* Mobile Menu */
	#et_mobile_nav_menu .menu-item-type-custom {width:30%; float:left; text-align:center;}
	
	/* Gallery */
	#galleries article {width:49%; margin:10px 2% 10px 0;}
	#galleries article:nth-child(2n) {margin-right:0 ! important;}
	#galleries .bottom-info-hidden {width:200%;}
	
	#galleries .bottom-info .flexslider {width:100%;}
	#galleries .bottom-info .bottom-info-right {width:100%;}
	#galleries article .cs-select {height:850px ! important;}
	#galleries .bottom-info-hidden {height:900px;}
	
	/* Projects */
	ul.cs-project-headings {width:100% ! important;}
	ul.cs-project-headings li {width:48.5%; margin-bottom:20px;}
	ul.cs-project-headings li:nth-child(2n) {margin-right:0 ! important;}	
		
	div.cs-project-all {margin-bottom:20px; width:100%;}
	ul.cs-project-gallery li {width:48%; margin-right:2%; margin-bottom:15px;}
}

/********************************************/
/**********      ONLY MOBILES      **********/
/********************************************/

@media only screen and (max-width: 600px) {
	/* Gallery */
	#galleries article {width:100%;margin:8px 0 ! important;}
	#galleries article:nth-child(2n) {margin-right:0 ! important;}
	#galleries .bottom-info-hidden {width:100%; height:700px ! important;}
	#galleries .bottom-info {width:100%;}
	#galleries article .cs-select {height:650px ! important; padding:10px ! important;}
	.cs-filter {padding:8px;}
	.cs-filter-divider {padding:8px 0;}
	
	/* Projects */	
	ul.cs-project-headings li {width:100% ! important; margin-right:0 ! important;}
	ul.cs-project-gallery li {width:100%; margin-right:0; margin-bottom:15px;}
	
	/* All Pages */
	#et-main-area #main-content .container,	#et-main-area #main-content .et_pb_row {width:90%;}

	.et_header_style_left #logo, .et_header_style_split #logo {max-width: 70%;}
	/* Slider Overlay */
	.et_pb_slide_0 .et_pb_slide_content, .et_pb_slide_5 .et_pb_slide_content {bottom:80px; opacity:0.8; padding:5px;}
	.et_pb_slide_0 .et_pb_slide_content p, .et_pb_slide_5 .et_pb_slide_content p {text-align:center; font-size:9px ! important; line-height:1.1; margin:0;}
}