/*

Theme Name: CCR 2025	
Author: Charlie Hussey
Author URI: http://classic-channel-regatta.eu
Description: Custom theme loosely based on WP Minimal   
	Using w3.css 
Version: 1.0.0
Text Domain: classicchannelregatta;

/* -------------------------------------------------------------- */




body 
{
	margin: 0;
	padding: 0;
	background: #f0f0f0;
	font: normal 1em Catamaran, Arial, Sans-Serif;
    text-align: left;
}


/* colour palette generated by W3schools ---------------------------------------- */

.w3-theme-l5 {color:#000 !important; background-color:#f3f9fc !important}
.w3-theme-l4 {color:#000 !important; background-color:#d8edf6 !important}
.w3-theme-l3 {color:#000 !important; background-color:#b0daee !important}
.w3-theme-l2 {color:#000 !important; background-color:#89c8e5 !important}
.w3-theme-l1 {color:#fff !important; background-color:#62b6dc !important}
.w3-theme-d1 {color:#fff !important; background-color:#2c96c7 !important}
.w3-theme-d2 {color:#fff !important; background-color:#2785b1 !important}
.w3-theme-d3 {color:#fff !important; background-color:#22759b !important}
.w3-theme-d4 {color:#fff !important; background-color:#1d6485 !important}
.w3-theme-d5 {color:#fff !important; background-color:#18536f !important}
.w3-highlight {color:#fff !important; background-color:DarkOrange !important} 

.w3-theme-light {color:#000 !important; background-color:#f3f9fc !important}
.w3-theme-dark {color:#fff !important; background-color:#18536f !important}
.w3-theme-action {color:#fff !important; background-color:#18536f !important}

.w3-theme {color:#fff !important; background-color:#3ca5d4 !important}
.w3-text-theme {color:#3ca5d4 !important}
.w3-border-theme {border-color:#3ca5d4 !important}

.w3-hover-theme:hover {color:#fff !important; background-color:DarkOrange !important}
.w3-hover-text-theme:hover {color:DarkOrange !important}
.w3-hover-border-theme:hover {border-color:DarkOrange !important}

/* Links */

a:link { color: #1d6485; text-decoration: none;}

a:visited { color: #2785b1; text-decoration: none; }

a:hover, a:active { color: #ffffff; background-color: DarkOrange;}

h3 a:link { color: #3f4f5c; text-decoration: none; }

h3 a:visited { color: #3f4f5c; text-decoration: none; }

h3 a:hover, a:active { color: #FFFFFF; }

/* Typography */

h1, h2, h3, h4, h5, h6 { font-weight: 300; margin: 0.5em 0; padding: 0; color: #22759b}

h1 { font-size: 3em; font-weight: 400;}



h3 {   /* section headers */
	font-size: 1.3em; 
	color: white;
	background-color: #22759b;
	margin: 0; 
	line-height: 2;
}

h2 {   /* section headers */
	font-size: 1.6em; 
	color: white;
	font-weight: 400;
	background-color: #22759b;
	margin: 0; 
	line-height: 2.5;
	padding-left: 1em;
}

h4 {  /* small section headers */
	font-size: 1em; 
	color: white;
	background-color: #22759b;
	margin: 0; 
	line-height: 2;
	padding-left: 0.5em;
}

h5 { font-size: 0.9em}

h6 { font-size: 0.8em}


ul { line-height: 1.5em; font-size: 1.2em; color: black; }


blockquote
{
	color: #2c96c7 ;
	background-color: #eeeeee;
	border: 1px solid #cfcfcf;
	padding: 5px 10px; 
	margin: 10px 10px;
}




em { font-style: italic; }

strong { font-weight: bold; }

del { text-decoration: line-through; color: #555555; font-size: 11px; }

ins { text-decoration: none; color: #679b3c; }

p {
	font-family: Catamaran, Verdana, Sans Serif;
	font-size: 1.2em; 
}

div {
	margin: 0;
}

/* Structure  ---------------------------------------------------------------------------- */

#container
{
	width: 980px;
	margin: 0 auto;
}

#header
{
	padding: 0px 0;
    margin-bottom: 10px;	
}


#wrapper
{
	margin: 0;
	padding: 0;
	clear: both;
	float: left;
	width: 800px;
        background: #ffffff;
        border-left: solid #dde0e1 2px;
        border-right: solid #dde0e1 2px;
        border-bottom: solid #dde0e1 2px;
}



#sidebar-wrapper
{
        display: inline;
        margin-left: 5px;
        margin-top: 25px;
        margin-bottom: 25px;
	width: 180px;
	float: left;
        background-color: #F3F2F2;
	border: solid #E6E4E4 1px;
}

#sidebar
{
	float: left;
	width: 150px;
	padding: 15px;
        color: #5b5c5c;
	font-size: 9pt;
	text-align: left;
}

#white {
       background-color: white;
       width: 800px;
       height: 15px;
}
#footer
{
	clear: both;
	float: left;
	width: 100%;
	margin: 0px 0;
	color: #555555;
	padding: 10px 0;
        text-align: center;
}


/* Header */

#header h1 {color: #191a1a; font-weight: bold; margin-bottom: 10px; }

#header h1 a {width:750px; height: 200px; background: transparent url() center center no-repeat; }

#header h1 a:link,
#header h1 a:visited
{
	color: #333333;
}

#header h1 a:hover,
#header h1 a:active
{
	color: #000000;
	background-color: transparent;
}

#header h1 span {color:#5b5c5c;}




/* gray out disabled menu items by adding CSS class in menu  and set link to # */

li.grayed a {
		color: #b0b0b0 !important;
}

.logo {
	padding: 1em;
}

div.masthead {
	height: 9em;
	display: grid;
	place-items: center;
 
}

a.site-title {
	text-transform: uppercase;
	font-size: 2.5em;
	color: white;
	font-style: bold;
	text-decoration: none;
}

p.strapline {
	text-transform: none;
	font-size: 1.5em;
	color: white;
	font-style: italic;
	margin-block-start: 0;
	margin-block-end: 0;
	line-height: 2em;
}

p.ccr-ports {
	text-transform: uppercase;
	font-size: 1.5em;
	color: white;
	font-style: bold;
	margin-block-start: 0;
	margin-block-end: 0;
	line-height: 1.5em;
}



.social {
	margin-top: 10px;
}

.social-icon {
	padding: 0px 3px;
}
.flag {
	padding: 0px 3px;
}

.cmplz-contact-address  {	display: none }
.cmplz-contact-telephone { display: none }
.cmplz-contact-country { display: none }


@media (max-width: 1024px) {

    a.site-title {
		font-size: 2em;
	}
	p.ccr-ports {
		font-size: 1.1em;
	}
	p.strapline {
		font-size: 1.1em;
	}

}
@media (max-width: 768px) {

    a.site-title {
		font-size: 1.5em;
	}
	p.ccr-ports {
		font-size: 0.8em;
	}
	p.strapline {
		font-size: 0.8em;
	}
}

@media (max-width: 600x) {

    a.site-title {
		font-size: 1.5em;
	}


}

.page {
	background-color: clear;
}


.ccr-navbar {
	padding: 0px;
	border-bottom: 1px solid white; 
}


.centre-container {   /* for the masthead logo */
    display: grid;
    place-items: center ;
	height: 10em;
    
}

.right-container {   /* for the masthead flags */
    display: grid;
    place-items: center  ;
	height: 10em;
    
}

@media (max-width: 600px) {

.centre-container {
    display: grid;
    place-items: center;
	height: 8em;  
}

.right-container {
    display: grid;
    place-items: right;
	height: 8em;
    
}
}

.ccr-outer-frame {
	padding: 0;
	margin:0;
}

.ccr-masthead {   /* full width band */
	border-bottom: 1px solid white; 
	background-color: #3ca5d4;
}


.ccr-content-wrapper {
	max-width: 1200px;
	margin: auto;
	padding: 0;
	box-sizing: border-box;
}


.display-card {
	box-sizing: border-box;
	background-color: #ffffff;
	border-width: thin;
	border-style: solid;
	border-color: #101010;
	margin: 1em !important;  
}

.display-boxed {
	box-sizing: border-box;
	background-color: #ffffff;
	border-color: #101010;
	border-width: thin;
	border-style: solid;
	margin-left: 1em !important; 
	margin-right: 1em !important;
}

.ccr-boat-div {
	background-color: #ffffff;
	border-width: thin;
	border-style: solid;
	width: 202px;
	height: 250px;
	margin: 1em !important;
}



.ccr-boat {
	box-sizing: border-box;
	object-fit: contain;

	max-width: 200px;
	max-height: 200px;
	width: 200px;
}


div p, h3 {
	padding: 0 1em 0 1em;
}


@media only screen and (max-width: 600px) {

	.ccr-content-wrapper {
		padding: 0.5em;
	}

	.display-card {
		margin: 0.5em !important;  /* override gutenberg mess */
	}

	div p, h3 {
		padding: 0 0.5em 0 0.5em;
	}

}


.ccr-fullwidth {
	margin: 0 ;
	padding: 0 ;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

.hero-image {
	height: 20em;
	width: 100%;
	object-fit: cover;
	border-bottom: 1px solid white; 

}

/* mailchimp archive listings */

.display_archive {font-family: Catamaran,verdana; font-size: 1.2em; }
.campaign {line-height: 1.5em; margin: 1em;}
.campaign a { color: #3ca5d4;}
.campaign a:hover {color:#fff !important; background-color: DarkOrange !important}

a.btn {
    display: inline-block;
    background: #18536f;
    height: 40px;
    line-height: 40px;
    color: #fff;
    padding: 0 16px;
	border: 1px solid #000000; 

    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
}

a.btn:hover {
    text-decoration: none;
    background: DarkOrange;
}

/* footer styles for silver, copper and bronze partners */


footer {
    padding: 0;
    text-align: center;
}

footer .block-partner {
    margin-bottom: 20px;
}

footer .partners {
/*    background: #60a1c5; */
    padding: 26px 15px 0;
}


footer .partners ul {
    text-align: center;
}

footer .partners ul li {
    display: inline-block;
    max-width: 215px;
    margin: 0;
    border: 0 !important;
    padding: 10px 10px !important;
}

footer .partners .silver-partner ul li {
    max-width: 180px;
}
footer .partners .copper-partner ul li {
    max-width: 140px;
}

footer .partners .bronze-partner ul li {
	vertical-align: text-top;
}

footer .partners .bronze-partner ul li p a {
    color: #227596;
	font-size: 0.7em;
}