/* Artfully masterminded by ZURB  */

/* -------------------------------------------------- 
   Table of Contents
-----------------------------------------------------

:: Type Ref
:: Color Ref
:: Shared Styles
:: Grid
:: Header
:: Footer
:: Main

*/
/* -----------------------------------------
:: Type Ref
----------------------------------------- */

/* -----------------------------------------
:: Color Ref
----------------------------------------- */

/* -----------------------------------------
:: Shared Styles
----------------------------------------- */

body {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
}
/* 
 * If you adjust heading sizes, do it for both the small break point (above) and "Medium and Up" (below) 
 * Font sizes for the small break point should be smaller
 */

@media print, screen and (min-width: 40em) { /* Medium and Up */
    
}

/* 
 * Link Colors
 */
a, .breadcrumbs a {color: rgb(148, 34, 34);}
a:hover, a:focus {color: rgb(148, 34, 34);}

.button {background: rgb(148, 34, 34); font-weight: 700}
.button:hover, .button:focus {background: rgb(148, 34, 34);}

.button.hollow {border-color: rgb(148, 34, 34); color: rgb(148, 34, 34);}
.button.hollow:hover, .button.hollow:focus {border-color: rgb(148, 34, 34); color: rgb(148, 34, 34);}

/* -----------------------------------------
:: Grid
----------------------------------------- */

.site-header .grid-container,
.site-footer .grid-container {max-width: 73rem;} /* 1200px - header and footer width - edit to match client's existing site */

/* -----------------------------------------
:: Header
----------------------------------------- */

/* Centers nav bar vertically */
.site-header > .grid-container > .grid-x { -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}

.site-header {background: rgb(251, 243, 234); padding:10px 0;}
.site-header #site-navigation {padding-top: 35px;}
.site-header #site-navigation ul li a {color: rgb(95, 67, 82); font-weight: 600; text-transform: none}
.site-header #site-navigation ul li.current-menu-item a {text-decoration: none; color: rgb(148, 34, 34)}

.site-header-logo img {width:140px;}

@media screen and (max-width: 39.99875em) { /* Small Only */
	.site-header-logo img {max-width:50%;} /* Reduces mobile header logo */
}


/* Black mobile menu toggle - Add if using a white or light color header background */
#menu-mobile-toggle {background: url(../img/iconfinder_menu_309053.svg) no-repeat;} 

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

.site-footer {background: rgba(182, 102, 19, 0.93); color: #fff;}
.site-footer-logo {display: inline-block; background: rgb(251, 243, 234); border-radius: 50%; margin-bottom: 2rem;}
.site-footer-logo img {width:140px;}
.site-footer a {color: #fff;}
.site-footer a:hover {text-decoration: underline;}
.footer-sep {color: rgba(255,255,255,.5)}


/* -----------------------------------------
:: Main
----------------------------------------- */

/* Find Mouldings By */
#element_moulding-tax-filter-wrap {background: rgb(148, 34, 34);}
#element_moulding-tax-filter-wrap span.filter-label-top {color: #fff; }

/*
 * main Stock Mouldings page
 */
body.page-id-16423 #main {background: rgb(251, 244, 235);}
body.page-id-16423 #all-moulding-types,
body.page-id-16423 #moulding-insp-gallery {background: #fff; }

/*body.page-id-16423 #popular-moulding-types .popular-moulding-type a {color: rgba(50, 47, 47, 1); font-weight: 700;}
body.page-id-16423 #popular-moulding-types .popular-moulding-type a:hover {color: rgb(148, 34, 34);}*/

body.page-id-16423 #all-moulding-types h2 {color: rgb(56, 47, 48);}
body.page-id-16423 #all-moulding-types ul li a {color: rgba(50, 47, 47, 1);}
body.page-id-16423 #all-moulding-types ul li a span {color: rgba(50, 47, 47, .6);}
body.page-id-16423 #all-moulding-types ul li a:hover {text-decoration: none; color: rgb(148, 34, 34);}

body.page-id-16423 #moulding-insp-gallery h2 {color: rgb(56, 47, 48);}
body.page-id-16423 #moulding-insp-gallery a {color: #000;}

/*
 * main Stock Mouldings page - BANNER
 */
#banner-mouldings-home {position: relative;}
#banner-mouldings-home img {width: 100%;}
#banner-mouldings-home .text {
	color: #fff; 
	background:rgba(0,0,0,.5); 
	padding: 30px 50px; 
	display: inline-block; 
	/*border: solid 1px #fff;*/
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#banner-mouldings-home .text h1 {color: #fff; line-height: 1.1; margin: 0; font-size: 3rem;}
#banner-mouldings-home .text h1 span {display: block;}
#banner-mouldings-home .text h1 .word-1 {margin: 0 0 2px 0; letter-spacing:2px;}
#banner-mouldings-home .text h1 .word-2 {text-transform: uppercase; font-size: 50%; letter-spacing: 3px; }
#banner-mouldings-home .text h1 .word-2::before {content: "\2014";}
#banner-mouldings-home .text h1 .word-2::after {content: "\2014";}

@media screen and (min-width: 40em) and (max-width: 63.99875em) { /* Medium Only */
	#banner-mouldings-home .text {padding: 20px 30px;}
	#banner-mouldings-home .text h1 {font-size: 2.25rem;}
}
@media screen and (max-width: 39.99875em) { /* Small Only */
	#banner-mouldings-home .text {padding: 15px 30px;}
	#banner-mouldings-home .text h1 {font-size: 1.5rem;}
}

 /**
 * Moulding Filters
 */
#yhdm-moulding_wrap #yhdm-moulding-type-filters {border-top-color:rgba(0,0,0,.125); border-bottom-color: rgba(0,0,0,.125); }
#element_moulding-tax-filter-wrap .select2-container,
#element_moulding-tax-filter-wrap .select2-drop,
#element_moulding-tax-filter-wrap .select2-search,
#element_moulding-tax-filter-wrap .select2-search input {width:100%; border-radius: 0;}
.select2-container .select2-choice {
    padding: 5px 0 5px 8px;
	height: 36px;
    overflow: hidden;
	border-radius: 0; 
	background: #fff;
	border-color: #fff;
}
body.ie9 .select2-container .select2-choice {color:#000;}
.select2-container .select2-choice .select2-arrow {border-left: none; background-image: none; background:none; top: 5px;}
.select2-dropdown-open .select2-choice {background:#fff; color:#000;}
.select2-container .select2-choice:first-child { font-weight: 700; font-size:15px;}
.select2-dropdown-open .select2-choice .select2-arrow {background: none; border-left: none;filter: none; }
.select2-container .select2-choice .select2-arrow b { background-image:url(../img/select2.png); }
.select2-container-active .select2-choice,
.select2-container-active .select2-choices {border: 1px solid #fff; }

#element_moulding-tax-filter-wrap .select2-container-active .select2-choice,
#element_moulding-tax-filter-wrap .select2-container-active .select2-choices,
#yhdm-moulding-type-filters .select2-container-active .select2-choice,
#yhdm-moulding-type-filters .select2-container-active .select2-choices {border: 1px solid #fff; }

#select2-drop {background: #fff; font-size: 1rem;}
#select2-drop.select2-drop-active {border: 1px solid #fff; border-top: none;border-radius: 0;}
#select2-drop .select2-input { border-color: #ddd;}
.select2-container .select2-choice {background: #fff;}
#select2-drop .select2-results .select2-highlighted {background: rgb(251, 243, 234); color: #000;}

#yhdm-moulding-type-filters .select2-container .select2-choice {background-color: #fff;}

/*
 * Single Moulding
*/
#yhdm-moulding_wrap.yhdm-moulding_single-profile .yhdm-primary .element_full-image {background: rgba(251, 243, 234, .5);}
#yhdm-moulding_wrap.yhdm-moulding_single-profile .yhdm-secondary .element_wishlist {background: rgba(251, 243, 234, .5); }

