/*

	!COLOURS
    Grey: #444
    Body text grey: #5a6267
    Orange: #85132E
    Dark orange:
    Pink - dark: #C61166
    Pink - light: #DC1272
    Rectory Red: #85132E
http://www.farrow-ball.com/colours/paint/fcp-category/list?isSearchFilterSuffix=true&results=999&visModel=CHANNEL&filters=Hierarchy_TOP_NAVIGATION_FILTER:/TOP_NAVIGATION/wc_shop_all/wc_paint_all/wc_paint_colours!COLOUR_GROUP_FILTER_LANG_en-GB:red

*/


/*

	!GLOBAL

*/

html {
	-webkit-font-smoothing: antialiased; /* Fixes font thinning with sliders. Source: http://stackoverflow.com/questions/9049524/safari-rendering-page-fonts-thinner-with-jquery-slider-on-page */
}

body,
.pure-g [class *= "pure-u"],
.pure-g-r [class *= "pure-u"] {
	text-rendering: optimizeLegibility;
    font-family: "prenton",sans-serif;
    font-style: normal;
    font-weight: 400;
}

body {
	color: #5a6267;
	color: #555;
	font-size: 1em;
	line-height: 1.7;
	background-color: #eee;
}

#sb-site {
	background-color: #eee;
}

.wrap {
	max-width: 62.5em;
	margin: 0 auto;
	position: relative;
}

body.home main {
    padding: 0 0 4em 0;
}

main {
	background-color: #fff;
	margin: 0;
    padding: 2em 0 4em 0;
}

.inner {
	padding: 1em;
}

body.home .header-outer {
	background: transparent;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    padding: 1.5em 0;
}

.header-outer {
	background: #85132E;
    position: static;
    width: 100%;
    padding: 1.5em 0;
}

blockquote {
    color: #85132E;
    text-align: right;
    font-weight: 700;
    font-size: 1.25em;
    font-style: normal;
    line-height: 1.4;
    padding: 0.5em;
    margin: 0.5em 0 1.5em 0;
    float: right;
    width: 10em;
    border-top: solid 0.25em #85132E;
}

body.home blockquote {
    float: none;
}

.content blockquote p {
    margin: 0;   
}

article {
    margin: 0 1em 0 0;
}

.post-meta {
    margin: 0 0 1em 0;
}

.post-meta-content {
    display: table-cell;
    height: 1em;
    line-height: 1em;
}

.post-meta time {
    vertical-align: middle;
    padding-left: 1.75em;
    background: url(../img/time.svg) no-repeat center left;
}

.pure-button-custom {
    margin: 1em 0; 
}

.grey-button {
    color: #fff;
    background-color: #444;
}

a {
    color: #85132E;
    text-decoration: none;
    border-bottom: solid 1px #85132E;
}

.ruled {
    border: none;
    border-top: solid 1px #fff;   
}

.ruled-short {
    width: 9em;
}

.ruled-colour {
    border-top: solid 1px #D50069;
}

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

a.facebook {
	width: 60px;
	height: 60px;
	background: transparent url(../img/facebook.svg) no-repeat;
	display: inline-block;
	margin: 0.75em auto;
	border: none;
}

a.facebook:hover {
	border: none;
}

.large-quote {
    color: #999;
    font-family: "karmina",serif;
    font-style: italic;
    font-weight: 400;
    font-size: 1.75em;
    line-height: 1.2;
    border: none;
    padding: 0;
    text-align: center;
    margin: 2.5em auto 0.5em auto;
    width: 80%;
}

.centered {
    text-align: center;
    margin: 0 auto;
}

iframe {
    width: 100%;
    height: 26em;
}

.content {
    font-size: 1.125em;   
}

.light {
    font-weight: normal;   
}

.content p,
.content ol,
.content ul,
.content h2,
.content h3,
.content h4
.content h5 {
    margin-right: 14em;   
}

.wp-caption-text {
    padding: 0.5em;
    font-size: 0.875em;
    color: #fff;
    font-style: normal;
    background-color: #85132E;
}


/*

    !SLIDEBARS

*/

.sb-slidebar {
    background-color: #111;
}



/*

    !BANDS

*/

.band {
  padding: 2em 0;  
}

.purple-bg {
   background-color: #85132E;
}

.pink-bg {
   background-color: #9B153C;
}

.lightgrey-bg {
   background-color: #eee;
}


.darkgrey-bg {
   background-color: #2D2E30;
}

.vvf {
    padding-left: 4em;
    background: url(../img/violin.svg) no-repeat center left;
}

.violin {
    background: #eee url(../img/violin_bg.jpg) no-repeat bottom right;
}


/*

	!TYPOGRAPHY

*/


header[role="banner"] {
	padding: 1em 0;
}

#site-description {
    font-size: 1em;
    text-transform: uppercase;
    font-style: normal;
    letter-spacing: 0.1em;
    padding-left: 1em;
}

#site-description h2 {
    color: #fff;
    font-family: "prenton-display", sans-serif;
    font-weight: 100;
    font-size: 2.35em;
    font-weight: 100;
    margin: 0;
}

#site-description h3 {
    color: #fff;
    font-size: 0.875em;
    font-family: "prenton", sans-serif;
    font-weight: 400;
    margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: #5a6267;
    line-height: 1.3;
	margin: 1.25em 0 0.5em 0;
}

h1,
h2 {
	color: #85132E;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: #85132E;
	border: none;
    text-decoration: none;
}

h1 {
	font-size: 2.5em;
    padding: 0 0 0.25em 0;
    margin: 0.75em 0 0.5em 0;
    border-bottom: solid 0.03125em #eee;
}

h2 {
	font-size: 1.75em;
}

.proposition-statement h2 {
    font-style: normal;
    color: #fff;
    margin: 0.5em 0 1em 0;
}

.index-list h2 {
    margin: 0 0 0.25em 0;   
}

h3 {
	font-size: 1.5em;
}

.violin h3 {
    margin-top: 0;   
}

.proposition-statement h3 {
    font-weight: 400;
    font-size: 1.25em;
    color: #fff;
    margin: 1em 0 0 0;
}

.news-band h3 {
    color: #fff;
    font-family: "prenton-display", sans-serif;
    font-weight: 100;
    margin: 0 0 1em 0;
    font-size: 1.5em;
	padding: 0.5em 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

h3#reply-title {
    color: #85132E;
    font-family: "prenton-display", sans-serif;
    font-weight: 100;
    margin: 0;
    font-size: 1.5em;
	padding: 0.5em 0 0 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

h4 {
	font-size: 1.25em;
}

h5, h6 {
	font-size: 1.125em;
}

.intro {
	color: #8d98a0;
	font-size: 1.4em;
	line-height: 1.4;
}

p {
	margin: 0 0 1em 0;
}

ul,
ol {
    margin: 0;
    padding: 0;
}

.content ul,
.content ol {
	margin: 0 14em 1em 1.125em;
}



/*

    !FORMS

*/

.pure-form label {
    margin: 1em 0 0.25em 0;
    font-weight: bold;
    display: block;
}

.pure-form label .required {
    font-weight: normal;
    font-style: normal;
}

.label-message {
    font-weight: normal;
    color: #888;
}

label.error,
p.error,
.error {
    color: #d72c19;
    background-color: #FFE7EF;
    margin: 0.25em 0;
    padding: 0.2em 0.4em;
    font-weight: normal;
    border-left: solid 0.25em #CD1C1F;
    display: block;
}

.instruction {
    font-weight: normal;
}

#status {
    display: none;
    margin: 0.25em 0;
    padding: 0.2em 0.4em;
    background-color: #FFFAE0;
    border-left: solid 0.25em #FFB268;
}


/*

	!IMAGES
	
*/

.gallery-item {
    text-align: center;
    margin: 0 0 2em 0;   
}

.gallery-item img {
    padding: 0.5em;
    background-color: #eee;
    border: solid 0.0625em #eee;
}

.wp-caption {
    margin: 1.5em 0;
}

.gallery-item a {
    border: none;
}

img {
	vertical-align: middle; /* Removes white space underneath */
}

.content img,
.comment-content img,
.imagegallery img,
.widget img,
.wp-bespoke-img,
.feature-image img {
    max-width: 100%; /* Fluid images for posts, comments, and widgets */
    height: auto;
}
img[class*="align"],
img[class*="wp-image-"] {
    height: auto; /* Make sure images with WordPress-added height and width >attributes are scaled correctly */
}
img.size-full {
    max-width: 100%;
    width: auto; /* Prevent stretching of full-size images with height and >>width attributes in IE8 */
}

.wp-caption {
    max-width: 100%;
}

.feature-image {
	font-size: 1em;
	margin: 0 0 1em 0;
}

.wp-image-circular {
   -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -o-border-radius: 100%;
  -ms-border-radius: 100%;
  border-radius: 100%;
   
}



/*

	!NAVIGATION

*/

li {
	margin: 0;
	padding: 0;
}

.pure-menu.pure-menu-open {
	border: none;
}

.menu-trigger {
	text-align: right;
    margin-right: 1.5em;
}

.outline-button a,
button.outline-button {
    display: inline-block;
    background-color: transparent;
    margin: 1.5em 0;
    padding: 0.5em 0.75em;
    color: #85132E;
    border: solid 1px #85132E;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-decoration: none;
}

.outline-button a:hover,
button.outline-button:hover {
    color: #fff;
    background-color: #85132E;
}

.g-recaptcha {
    margin: 1.5em 0 0 0;   
}

.menu-trigger a {
    color: #fff;
    background-color: transparent;
    color: #fff;
    border: solid 1px #fff;
    margin: 1em 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

body.home .menu-trigger a:hover {
    color: #fff;
    background-color: #85132E;
    border: solid 1px #85132E;
}

.menu-trigger a:hover {
    color: #fff;
    background-color: #600922;
    border: solid 1px #85132E;
}

#mobilemenu {
    display: none;
}

#mainmenu ul {
	margin: 4em 0 0 0;
    padding: 0;
}

#mainmenu li {
	display: block;
}

#mainmenu li a {
	color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.1em;
	padding: 1em 1em 1em 2em;
    display: block;
    border-bottom: solid 1px #333;
}

/* #mainmenu li.active ul.sub-menu { */
#mainmenu ul.sub-menu {
    margin: 0;
    display: block;
    position: static;
    visibility: visible;
}
#mainmenu ul.sub-menu li a {
	font-size: 80%;
    color: #fff;
	padding: 1em 1em 1em 4em;
}

#ancillarymenu li a {
	font-size: 0.875em;
}

#ancillarymenu li a:hover {
}

#mainmenu li a:hover,
#mainmenu li.active a,
#mainmenu ul.sub-menu li a:hover {
	color: #fff;
    background-color: #333;
}

ul.sidemenu {
    margin: 1em 0;
    display: block;
    position: static;
    visibility: visible;
}

ul.sidemenu a {
    text-align: left;
    font-size: 0.875em;
    white-space: normal;
}

ul.sidemenu li a {
	padding: 0.5em;
    border-bottom: solid 0.07142857142857em #eee;
}

ul.sidemenu li.active a, ul.sidemenu li a:hover {
    border-bottom: solid 0.07142857142857em #eee;
}

ul.sidemenu ul.sub-menu li a {
    padding-left: 1.5em;
    border-bottom: solid 0.08333333333333em #eee;
}



/*

	!PAGINATION
	
*/

.pagination {
	margin: 2em 0 1em 0;
}

.page-numbers {
	padding: 0.2em 0.5em;
	background-color: #eee;
	border-bottom: solid 0.0625em #888;
}

span.current {
	color: #fff;
	background-color: #333;
}



/*

	!INDEX LISTS
	
*/

.list-item {
	margin: 0 0 2.5em 0;
	line-height: 1.5;
}

.list-item h3 {
	margin-top: 0;
}

.list-item a {
	color: #5a6267;
    text-decoration: none;
    border: none;
}

.list-content {
	padding-left: 2em;
}



/*

	!FOOTER

*/

footer {
	margin: 1em 0 3em 0;
	border-top: solid 0.0625em #eee;
    text-align: center;
}

footer .organisation-address {
	color: #777;
	font-size: 0.875em;
}

footer .organisation p {
    margin: 0;
}



/*

	!HELPERS

*/

/* Hiding */
.visually-hidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
	  clear: both;
}

/* For IE 6/7 only. Include this rule to trigger hasLayout and contain floats. */
.clearfix {
	*zoom: 1;
}

.alignleft {
    float: left;   
}

.alignright {
    float: right;
    margin: 1em -14em 1em 1em;
}



/*

	!SIDEBAR 

*/

.sidebar {
}



/*

	!MODALS

*/

#search-modal {
	display: none;
	width: 60%;
}

.modal {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -o-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
}



/*

	!CAROUSELS

*/

.herotint {
	position: absolute;
    z-index: 99;
    width: 100%;
	height: 35em;
}

.herotint:after {
    content:'';
    position:absolute;
    left:0; top:0;
    width:100%; height:100%;
    display:inline-block;
    background: -moz-linear-gradient(bottom, rgba(0,0,0,0) 50%, rgba(0,0,0,0.75) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left bottom, left top, color-stop(50%,rgba(0,0,0,0.75)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(bottom, rgba(0,0,0,0) 50%,rgba(0,0,0,0.75) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(bottom, rgba(0,0,0,0) 50%,rgba(0,0,0,0.75) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(bottom, rgba(0,0,0,0) 50%,rgba(0,0,0,0.75) 100%); /* IE10+ */
    background: linear-gradient(to top, rgba(0,0,0,0) 50%,rgba(0,0,0,0.75) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}

.hero {
	width: 100%;
	height: 35em;
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	text-align: center;
	color: #fff;
	position: relative;
}

body.home .hero {
    margin-top: 0;
}

.carousel-content {
	text-align: left;
	position: absolute;
	top: 21em;
	left: -3em;
	z-index: 50;
	display: none;
}

.carousel-content h2 {
	font-size: 2em;
	margin: 0;
	line-height: 1.2;
}

.carousel-content p {
	font-size: 1.5em;
	margin: 0;
	line-height: 1.5;
}

.carousel-content h2 span {
	color: #fff;
	background: #1ebeb5;
	padding: 0.2em 0.4em;
}

.carousel-summary {
	color: #fff;
	background: #1ebeb5;
	padding: 0.2em 0.4em;
	width: 100%;
}



/*

	!SLATES

*/

.slate {
	padding: 0 0.5em;
}

.slate .excerpt {
	font-weight: normal;
	font-size: 1em;
	line-height: 1.5;
	padding: 0.5em 0;
}

/*
.slate a {
	color: #85132E;
    text-decoration: none;
}
*/

.slate h2 a {
	color: #85132E;
}

.slate h2,
.violin h2,
.news-band h2 {
    color: #85132E;
    font-family: "prenton-display", sans-serif;
    font-weight: 100;
    margin: 0;
    font-size: 2.25em;
	padding: 0 0 0.125em 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.news-band h2 {
    color: #fff;   
}

.slate h3 {
    color: #fff;
    font-family: "prenton", sans-serif;
    font-weight: 400;
    margin: 0;
    font-size: 1.25em;
	padding: 0;
    text-transform: none;
    letter-spacing: normal;
}

/* Two horizontal boxes */
.slate-twos {
	margin: 3em 0;
}

.slate-twos .background-image {
	font-size: 1em;
	height: 22em;
}

.slate-twos a p {
    color: #666;   
}

/* Three horizontal boxes */
.slate-threes {
	margin: 3em 0;
}

.slate-threes .background-image {
	font-size: 1em;
	height: 16em;
}

/* Four horizontal boxes */
.slate-fours .slate {
	padding: 0 0 1em 0;
	margin: 2em 0 0.5em 0;
    border-bottom: solid 1px #666;
}

.slate-fours .slate p {
	margin: 0;
}

.slate-fours .background-image {
	font-size: 1em;
	height: 8em;
}

.slate-fours .news-excerpt {
	color: #ccc;
}


/*

    !COMMENTS

*/

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

.comments-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.comments-list li {
    margin: 0 0 1em 0;
    border-bottom: solid 1px #ccc;
}

.comment-body h4 {
    margin: 0;
}

.comment-body {
    font-size: 0.875em;   
}

.comment-author {
    font-weight: bold; 
}

.comment-date {
    font-weight: normal; 
}

/*

    !MEDIA QUERIES

*/

@media screen and (min-width: 87.5em) {
    
    body.home .hero {
        height: 42em;   
    }
    
}

@media screen and (max-width: 47.9em) {

    .content p,
    .content ol,
    .content ul,
    .content h2,
    .content h3,
    .content h4
    .content h5 {
        margin-right: 0;   
    }
    
    blockquote {
       float: none;
        width: 100%;
        text-align: left;
        padding-left: 0;
        padding-right: 0;
    }
    
    #site-description h2 {
        font-size: 1.35em;
    }

    #site-description h3 {
        font-size: 0.625em;
   }

    .menu-trigger a {
        font-size: 0.875em;
        margin: 0.5em 0;
    }
    
    .rimma-portrait {
        display: none;   
    }
    
    .violin {
        background-image: none;   
    }

    .no-img {
        display: none;   
    }
    
    .list-content {
        padding-left: 0;   
    }
    
    .alignright {
        margin: 1em 1em 1em 1em;
    }

}