/*

Theme Name: Prince's Trust
Description: Custom theme for Prince's Trust Canada.
Version: 1.0


HOW THIS THEME WORKS
====================
- Originals (unminified images, JavaScript, and Sass files) are in the /unmin folder
- Gulp takes care of the following (see gulpfile.js for details):
-- Compiles, autoprefixes and minifies Sass from /unmin/scss and sends it to core.css
-- Lints, concats and minifies JS from /unmin/js and sends it to /js/script.min.js
-- Compresses images from unmin/img and sends them to /img


HOW TO EDIT THE STYLES
======================
1. Ideal option: edit the SCSS files in unmin/scss/partials, and use gulp to compile to core.css
2. Less ideal/temporary option: add local overrides below, and add the following to the drollic_add_scripts() function in functions.php (below the core.css enqueue):
    wp_enqueue_style( 'default', get_stylesheet_uri(), array(), '1.0' ); // style.css

*/


/* Body Styles */

body {
	max-width: 1920px;
}
.js body {
    padding-top: 0;
}

.categories {
	color: #cc0033;
}

.archive h1 {
	font-size: 3rem;
}

h1.small-heading {
	font-size: 1.75rem;
}

/* Header Styles */

header nav .menu li {
        border-right: 1px solid #cc0033;
}	

#comments {
    border-top: 1px solid #cc0033;
}

.main .commentlist .comment.bypostauthor {
    background: #cc0033;
}

#respond .required {
    color: #cc0033;
}

.ie7 .hero-image-overlay>*,
.ie8 .hero-image-overlay>* {
    background: #cc0033;
}

/* Blockquote Styles */

.no-quotes p:before,
.no-quotes p:after {
	content: none;
}

/* Image Hover Effects */
.img-hover {
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}


.img-hover:hover {
	-webkit-filter: brightness(80%);
	-moz-filter: brightness(80%);
	-ms-filter: brightness(80%);
	filter: brightness(80%);
}

.black {
	color: #000000;
}



.red {
	color: #cc0033;
}

/* Governance Styles */
.bottom-margin {
	margin-bottom: 1rem !important;
}

/* Alignment Styles */

.text-center {
	text-align: center;
}

/* Link Styles */
a {
	color: #cc0033;
}

/* Footer Styles */

footer {
	background: #cc0033 !important;
}