/*************************
Theme: Ceremonies inside Coventry
Version:2
Contact: webeditors@coventry.gov.uk

gold #AB986B RGB: 171,152, 107
gold text against white for 4.5:1 ratio: #86754b
dark purple #42385B RGB: 66, 56, 91

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

@import url('https://fonts.googleapis.com/css2?family=Rochester&family=Merriweather&family=Open+Sans&display=swap');
@import url('https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css');

body {
	background-image: url("https://www.ceremoniesinsidecoventry.co.uk/images/texture.png");
	color: #666;
	font-family: 'Merriweather', serif;
	font-size: 16px;
	hyphens: none;
}

/** header **/

.site-header {
	background-color: #42385B;
	border-bottom: 0.3em solid #AB986B;
}

.page-header {
	background-color: #86754b;
	font-size: 2em;
	color: white;
	padding: 0.5em;
}
 
#page-heading {
	color: white;
	font-family: 'Rochester', cursive;
}

/** Breadcrumb **/
	
.list--breadcrumb {
	color: white;
}

.list--breadcrumb a {
	color: white;
}
.list--breadcrumb a:hover {
    text-decoration-thickness: 0.1em;
}

/** footer **/

.site-footer, .nav--social-links .list__link {
	background: #2F4D51;
}
.nav--sponsor-links .list__item .sponsor__image {
    height: 100%;
    border: none;
}
	
	
/** Main content **/
.box {
 background: none; 
}

.boxed {
 background: white; 
}

/** General elements **/

h1, h2, h3, h4 {
	font-family: 'Merriweather', cursive; color: #86754B;
}

hr {
	background-color: #AB986B;
	text-align: left;
	line-height: 1em;
}

hr::before {
	content: '\002665 \002665 \002665';
	position: absolute;
	color: #AB986B;
	font-size: 1.2em;
}

a {
	color: #42385B;
}

.site-content a:active, .site-content a:hover {
	border-bottom: 0.1em solid #AB986B;
}

p {
	margin: 1em;
}

blockquote {
	background-color: rgba(66, 56, 91, 0.7);
	color: white;
	font-family: 'Merriweather', cursive;
}

blockquote p:first-child::before {
	content: '\002665 \002665 \002665';
	color: #AB986B;
	width: 0;
}

q {font-family: 'Rochester';}

cite {text-align: right}

/** links **/

input[type="button"]:focus,
input[type="submit"]:focus,
a:focus { outline: 2px dotted #42385B; }

input[type="submit"],
	input[type="reset"],
	input[type="button"],
	.button {
		background-color: #42385B;
		color: white;
		border-color: #AB986B;
	}
	
.editor ul:not([class]):not([type]) li::before, .editor ul:not([class]):not([type]) .list__item::before, .list--unordered li::before, .list--unordered .list__item::before {
    background-color: #AB986B;
}

/** Hero banner **/

.hero .hero__content.hero__content--no-search {
    background-color: rgba(66, 56, 91, 0.7);
	border: 0.2em solid #AB986B;
}

.hero .hero__content.hero__content--no-search .button, .button .button--primary {
	border-color: #AB986B;
	background-color: #42385B;
	color: white;
}

.hero .hero__content.hero__content--no-search .button:hover, .button:hover .button--primary:hover {
	border-color: #AB986B;
	background-color: rgb(171,152, 107, 0.2);
	color: white;
}

/** Images **/ 

.widget-image {
margin-bottom: 2em;
}

.image img, .image {
max-width: 100%;
border: 0.2em solid #AB986B;
border-radius: 1em 3em;
background-color: #AB986B;
}

.image.right {
			padding: 0;
}

.image__caption {
text-align: center;
background-color: #AB986B;
color: white;
border: 0.2em solid #AB986B;
border-radius: 0.2em;
}

.image__caption p, .listing__summary p {
	border-radius: 0.2em;
    background: #42385B;
    color: white;
    text-align: center;
    padding: 1em;
    border: 0.2em solid #42385B;
}

/** Buttons **/

.button.alt, .button a {
	background-color: #42385B;
	color: white;
	border-color: #AB986B;
}
 
.button:hover {
	background-color: rgba(171, 152, 107, 0.1);
}

/** Widgets **/

/** What's on and latest news **/

.listing__heading  {
	font-size: 1.5em;
	color: #42385B;
}

article, .widget-content {
	padding: 1.5em;
	border-radius: 0.375em;
	border: solid 1px rgba(210, 215, 217, 0.75);
	margin-bottom: 2em;
	background: white;
	box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 0.5);
}

/** Image and text **/

.ImageText {
background-color: white;
padding: 1em;
border: 1px solid aliceblue;
border-radius: 1em 3em;
opacity: 0.7;
margin-bottom: 2em;
box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 0.5);
}

.text { text-align: center; }

.text h2 {
	font-size: 1.5em;
	color: #42385B;
}

.text p.button { background: #42385B; }

a.text p.button:hover { background: #42385B; }

/* Action box */

div.action-box
{
background: #42385B;
text-align: center;
color: white;
border-radius: 0.2em;
padding: 0.5em;
margin-bottom: 2em;
border: 0.2em solid #AB986B;
}

div.action-box:hover
{
transition: background-color .2s ease-out;
background-color: rgba(66, 56, 91, 0.7)
}


div.action-box a h2
{
padding:0.3em;
margin:0;
font-size:1.75em;
color: white;
}

div.action-box a h3
{
font-size:1.25em;
color: white;
}

div.action-box a p
{
font-size:1em;
color: white;
}


div.action-box a:hover {
text-decoration: none;
}

.boxed > a > h2 {
border-radius: 0.2em;
background: #42385B;
color: white;
text-align: center;
}

/** YouTube **/

.divyoutube {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
}
.iframeyoutube {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}