/*
Theme Name: Finance Academy 2025
Author: Elly Cobbett
Author URI: www.designedbyelly.com
Description: A bespoke theme for Eddie Chauncy
Version: 1.2
*/


/* Fonts
font-family: "Source Sans 3", San-serif;
font-family: "Bodoni Moda", Serif;
*/


/* Colours */
:root{
 --grey: #828183;
 --green: #53b17b;
 --blue: #4f7a8e;
 --ltblue: #8fb4b7;
 --gold: #e3b57f;
 --greygreen: #6D867B;
}


/* Navigation */
.EC_NavLogo{
  width:45%;
}

@media only screen and (max-width: 768px) {
  .EC_NavLogo{
    width:70%;
  }
}

.ECnavbar{
  z-index: 1030;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(180deg, rgba(255,255,255,1) 40%, rgba(255,255,255,0) 100%) !important;
  background: -webkit-linear-gradient(180deg, rgba(255,255,255,1) 40%, rgba(255,255,255,0) 100%) !important;
  background: linear-gradient(180deg, rgba(255,255,255,1) 40%, rgba(255,255,255,0) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}

.navbar-toggler{
  border:none;
  color: transparent;
}

.navbar-toggler-icon{
  width: 2em;
  height: 2em;
}

.btn-close{
  width: 2em;
  height: 2em;
}

#main-menu{
  width: 100%;
}

.ECnavbar li{
  padding: 3%;
}

.ECnavbar .nav-link{
  font-size: 1.5em !important;
  font-family: "Source Sans 3", San-serif;
  font-weight:300 !important;
  color: var(--blue);
  padding: 2% 4%;
}

.ECnavbar .nav-link:hover{
  color: var(--gold);
  font-family: "Source Sans 3", San-serif;
  font-size: 1.1em;
  transition-delay: 0.2s;
  transition-property: color;
  transition-timing-function: linear;
  transition-duration: 1s;
}

.ECnavbar .nav-link.active{
  font-family: "Source Sans 3", San-serif;
  font-size: 1.1em;
  color: var(--gold);
}

/* Banners */
.ECBannerCopy h1{
  font-family: "Source Sans 3", San-serif;
  font-weight:100 !important;
  color: var(--grey);
  letter-spacing:2.75;
  text-align: left;
}

@media only screen and (max-width: 768px) {
  .ECBannerCopy h1{
    text-align: center !important;
  }
}


.ECBannerCopy h1 span{
  font-family: "Bodoni Moda", Serif;
  font-weight:600 !important;
  font-size:1.25em;
  font-style: italic;
}


/* Images */
.fullwidth{
  width:100%;
}

.footericon{
  width:100%;
  padding: 2% 20% 2% 20%;
}

.TherapyCircle{
  mix-blend-mode:multiply !important;
}


/* Typography */
.ServiceList ul{
  list-style: none;
}

.ServiceList li{
  display: inline;
}

.ServiceList li a{
  color: var(--gold);
}

.ServiceList li a:hover{
  color: var(--ltblue);
}

.ServiceList li:not(:last-child):after{
  content: '|';
  font-weight: 400;
  padding: 0% 2%;
}

@media only screen and (max-width:768px) {
  .ServiceList ul{
    padding-inline-start: 0;
  }

  .ServiceList li{
    display: block;
  }

  .ServiceList li:not(:last-child):after{
    display: none;
  }
}

.greentxt{
  color: var(--greygreen);
}

.bluetxt{
  color: var(--ltblue);
  font-weight: 400;
}

.goldtxt{
  color: var(--gold);
}

a{
  color: var(--ltblue);
  font-weight: 400;
}

a:hover{
  color: var(--gold);
  transition-delay: 0.2s;
  transition-property: color;
  transition-timing-function: linear;
  transition-duration: 1s;
 }


/* Blog */
.ECBlogBanner{
  min-height: 300px;
  text-align: center;
  padding: 15%;
}

@media only screen and (max-width: 768px) {
  .ECBlogBanner{
    padding: 30% 15% 20% 15%;
  }
}


.ECBlogBanner h1{
  font-family: "Source Sans 3", San-serif;
  font-size: 3em;
  font-weight: 100;
  letter-spacing: 0.1em;
}

.openquote{
  display:block;
  font-family: "Bodoni Moda", Serif;
  font-weight:600 !important;
  color: var(--greygreen);
  font-size: 20em;
  letter-spacing: -8em;
  margin: 20% 0% -17% -123%;
  line-height: 4px;
  mix-blend-mode: multiply;
}

.closequote{
  display:block;
  font-family: "Bodoni Moda", Serif;
  font-weight:600 !important;
  color: var(--greygreen);
  font-size: 20em;
  letter-spacing: -8em;
  margin: 36% 0% -25% -10%;
  line-height: 4px;
  mix-blend-mode: multiply;
}

@media only screen and (max-width: 768px) {
  .openquote{
    font-size: 5em;
    margin: 20% 0% -25% -135%;
  }

  .closequote{
    font-size: 5em;
    margin: 26% 0% -25% 0%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .openquote{
    font-size: 10em;
    margin: 20% 0% -20% -135%;
  }

  .closequote{
    font-size: 10em;
    margin: 26% -10% -25% 0%;
  }
}

.ECblogPost{
  text-align: center;
  padding: 2%;
  width: 100%;
}

.ECpostList{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  padding-left: 0px;
  flex-direction: row;
  flex-wrap: wrap;
}

@media only screen and (max-width: 768px) {
  .ECpostList{
    grid-template-columns: repeat(1, 1fr);
  }
}

.ECblogPost li{
  list-style: none;
  break-inside: avoid;
  padding: 10% 5%;
  min-height: 900px;
  }

@media only screen and (max-width: 768px) {
  .ECblogPost li{
    padding: 15% 2%;
    min-height: 500px;
  }
}

.ECblogPost img{
  border-radius: 100%;
  width: 100%;
  height: auto;
  margin-bottom: 50px;
}

.ECblogPost .posttitle{
  font-family: "Source Sans 3", San-serif;
  text-decoration: none;
  color: var(--greygreen);
}

.posttitle h1{
  padding: 0px 20px;
  font-weight:200;
  font-size: 1.75em;
  line-height: 150%;
  margin-bottom: 20px;
}

.ECblogPost .posttitle:hover{
  color: var(--gold);
  transition-duration: 0.5s;
}

.ECblogPost p{
  color: var(--grey);
  font-family: "Source Sans 3", San-serif;
  margin: 0px 50px 50px 50px;
  font-size: 1.1em;
  line-height: 200%;
}

.ECblogPostbtn{
  text-decoration: none;
  color: var(--greygreen);
  border-style: solid;
  border-color: var(--greygreen);
  border-width: 3px;
  padding: 5% 12%;
}

.ECblogPostbtn:hover{
  background-color: var(--greygreen);
  color: #FFFFFF;
  border-color: #FFFFFF;
  transition: background .3s,border .3s,border-radius .3s,box-shadow .3s,transform var(--e-transform-transition-duration,.4s);
}


.widget{
  border-style: solid;
  border-color: var(--greygreen);
  border-width: 4px;
  text-align: center;
  margin: 80px;
  padding:20px;
  display: block;
}

@media only screen and (max-width: 768px) {
  .widget{
    margin: 40px 20px;
  }
}

.ECblognav .nav-links{
  font-size: 1.5em;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 15%;
  color: var(--greygreen);
  width: 100%;
}

.ECblognav .nav-links a{
  background-color: var(--greygreen);
  color: #FFFFFF;
  font-family: "Source Sans 3", San-serif;
  padding: 2%;
  border-radius: 5px;
}


.ECblognav .nav-links a:hover{
  background-color: var(--gold);
  color: #FFFFFF;
  border-color: #FFFFFF;
  transition: background .3s,border .3s,border-radius .3s,box-shadow .3s,transform var(--e-transform-transition-duration,.4s);
}



.ECprofileCard img{
  border-radius: 100%;
  width: 80%;
  height: auto;
  margin: 0px auto 50px auto;
  overflow: hidden;
  margin: 20px 0px 20px 0px;
}

.ECprofileCard h4{
  color: var(--greygreen);
  font-family: "Source Sans 3", sans-serif;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 1em;
  letter-spacing: 0.1em;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .ECprofileCard h4{
    font-size: 2em;
  }
  .ECprofileCard p{
    font-size: 1.5em;
  }
}

.ECprofileCard p{
  color: var(--grey);
  font-family: "Source Sans 3", sans-serif;
  margin: 10px 0px;
  font-size: 1em;
}

.wp-block-search__label{
  color: var(--greygreen);
  font-family: "Source Sans 3", sans-serif;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 1em;
  letter-spacing: 0.1em;
  margin-bottom: 20px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .wp-block-search__label{
    font-size: 2em;
  }
}

.wp-block-search__button{
  text-decoration: none;
  color: var(--greygreen);
  border-style: solid;
  border-color: var(--greygreen);
  border-width: 3px;
  padding: 5% 12%;
  background-color: #FFFFFF;
}

.wp-block-search__button:hover{
  background-color: var(--greygreen);
  color: #FFFFFF;
  border-color: #FFFFFF;
  transition: background .3s,border .3s,border-radius .3s,box-shadow .3s,transform var(--e-transform-transition-duration,.4s);
}

.wp-block-categories-list::before{
  content: "Categories";
  color: var(--greygreen);
  font-family: "Source Sans 3", sans-serif;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 1em;
  letter-spacing: 0.1em;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .wp-block-categories-list::before{
    content: "Categories";
    font-size: 2em;
  }
}


.wp-block-categories-list{
  padding-left: 0;
  width: 100%;
}

.cat-item{
  list-style: none;
  width:100%;
}

.cat-item a{
  text-decoration: none;
  background-color: var(--greygreen);
  color: #FFFFFF;
  font-size: 1em;
  width: 100%;
  display: block;
  margin: 5px;
  padding: 10px 20px;
  text-transform: uppercase;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cat-item a{
    font-size: 1.5em;
  }
}

.cat-item a:hover{
  background-color: var(--greygreen);
  transition: background .3s, transform var(--e-transform-transition-duration,.4s);

}

.FeaturedPosts::before{
  content: "Featured";
  color: var(--greygreen);
  font-family: "Source Sans 3", sans-serif;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 1em;
  letter-spacing: 0.1em;
  text-align: center;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .FeaturedPosts::before{
    content: "Featured";
    font-size: 2em;
  }
}

.FeaturedPosts .wp-block-latest-posts__featured-image{
  margin-top:6%;
  width:25%;
}

@media only screen and (max-width: 768px) {
  .FeaturedPosts .wp-block-latest-posts__featured-image{
    margin-top:10%;
    width:100%;
  }
}

.FeaturedPosts img{
  border-radius: 100%;
  width: 100%;
  height: auto;
}

.FeaturedPosts .wp-block-latest-posts__post-title{
  color: var(--greygreen);
  font-family: "Source Sans 3", sans-serif;
  font-weight: 500;
  font-size: 1em;
  text-decoration: none;
  display: block;
  padding: 10px 50px 10px 10px;
  text-align: left;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .FeaturedPosts .wp-block-latest-posts__post-title{
    font-size: 2em;
    padding: 70px 50px 10px 10px;
  }
}

.FeaturedPosts .wp-block-latest-posts__post-title:hover{
  color: var(--gold);
  transition: color .3s, transform var(--e-transform-transition-duration,.4s);
}

@media only screen and (max-width: 768px) {
  .FeaturedPosts .wp-block-latest-posts__post-title{
    text-align: center;
    display: block;
    padding: 20px 10px 20px 10px;
  }
}


/* Contact */
.ECcontact{
  text-align: center;
}

.ECcontact li{
  display: inline;
  font-size: 2em;
  font-family: "Source Sans 3", sans-serif;
  line-height: 200%;
  font-weight: 300;
  margin-right: 50px;
}



@media only screen and (min-width: 769px) and (max-width: 991px) {
  .ECcontact li{
    display: block;
  }
}


@media only screen and (max-width: 768px) {
  .ECcontact li{
    display: block;
    font-size: 1.3em;
  }
}

@media only screen and (max-width: 360px) {
  .ECcontact li{
    display: block;
    font-size: 1.2em;
  }
}

.ECcontact li img{
  width: 7%;
  margin: 0px 15px;
  display: inline;
}

@media only screen and (max-width: 360px) {
  .ECcontact li img{
    width: 15%;
    margin: 10px auto;
    display: block;
  }
}

.ECcontact a{
  color: var(--greygreen);
}

.ECcontact a:hover{
  color: var(--gold);
  transition-duration: 0.5s;
}

.ECcontactForm label.wpforms-field-label{
  font-size: 2em;
  font-family: "Source Sans 3", sans-serif;
  font-weight: 300;
  color: var(--grey);
  line-height: 130% !important;

}

.ECcontactForm .wpforms-required-label{
  font-family: "Source Sans 3", sans-serif;
  font-weight: 100;
  color: var(--grey) ;
}

.ECcontactForm input{
  margin-bottom: 3% !important;
}

.DCcontactFormBTN{
  background-color: #FFFFFF !important;
  color: var(--greygreen) !important;
  font-family: "Source Sans 3", sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.3em !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border-style: solid !important;
  border-color: var(--greygreen) !important;
  border-width: 3px !important;
  padding: 3% 6% 5% 6% !important;
  float: right !important;
}

.DCcontactFormBTN:hover{
  background-color: var(--greygreen) !important;
  color: #FFFFFF !important;
  border-color: #FFFFFF !important;
}


/* Footer */
.FooterContact{
  display: flex !important;
  flex-direction:row !important;
  justify-content: center !important;
  align-items: center !important;
}

.FooterContact a h2{
  color: var(--grey) !important;
  font-family: "Source Sans 3", sans-serif !important;
  font-weight: 300 !important;
  font-size: 2rem !important;
}

.FooterContact a h2:hover{
  color: var(--gold) !important;
  font-family: "Source Sans 3", sans-serif !important;
  font-weight: 300 !important;
  transition-delay: 0.2s;
  transition-property: color;
  transition-timing-function: linear;
  transition-duration: 1s;
}

.FContactLink{
	font-size: 1.3rem !important;
    color: var(--grey) !important;
}

.PhoneIcon{
  width:50px;
  margin: 0% 4%;
}

.EmailIcon{
  width:90px;
  margin: 0% 4%;
}

@media only screen and (min-width: 300px) {		
  .PhoneIcon{
    width:40px !important;
  }

  .EmailIcon{
    width:50px !important;
  }
}

.legals, .credit{
  margin: 5% 2% !important;
}

@media screen and (max-width: 768px) {
  .legals, .credit{
    margin: 10% 2% !important;
  }

	.FooterContact a h2{
    font-size: 1.1rem !important;
  }
}

.credit p{
  color: var(--grey) !important;
}

#menu-footer-menu{
  text-align: center;
  margin: 7% 0% 4% 0%;
  padding: 0;
}

#menu-footer-menu li{
  display: inline;
  text-align: center;
  letter-spacing: 0.1em;
  padding-left: 0;
}

#menu-footer-menu li a{
    text-decoration: none;
    font-size: 1.2em;
    color: var(--gold);
    font-family: "Source Sans 3", sans-serif;
    font-weight: 400;
}

#menu-footer-menu li a:hover{
  color: var(--blue);
}


#menu-footer-menu li:not(:last-child):after{
  content: ' | ';
  font-family: "Source Sans 3", sans-serif;
  font-weight: 300;
  font-size: 1.2em;
  padding: 0% 1.5% 0% 1.5%;
  color: var(--greygreen);
}

.copyright{
  font-family: "Source Sans 3", sans-serif;
  font-weight: 400;
  font-size: 1em;
  color: var(--grey);
  text-align: center;
  margin-bottom: 3%;
}

.copyright a{
  font-weight: 700;
  text-decoration: none;
  color: var(--gold);
}

.copyright a:hover{
  color: var(--ltblue);
}

.credit{
  color: var(--gold);
  letter-spacing: 0.1em;
  text-align: center;
  margin-top: 3%;
}

.credit img{
  width:265px;
}
