/*
Theme Name: CPD
Author: Crown Point Design
Author URI: https://crownpointdesigns.com
Description: Custom theme for Crown Point Design by Christopher Vassallo
Version: 19.04.29
License: This WordPress theme is comprised of two parts: (1) The PHP code and integrated HTML are licensed under the GPL license as is WordPress itself.  You will find a copy of the license text in the same directory as this text file. Or you can read it here: http://wordpress.org/about/gpl/ (2) All other parts of the theme including, but not limited to the CSS code, images, and design are licensed according to the license purchased.
Template: dt-the7
*/

/* General Font Family Customizations - 'Brandon Grotesque' 'Museo Sans 500' 'Museo Sans 900' */
html, body, body.page, .wf-container>* {
    font: normal 18px/27px "Museo Sans 500",Helvetica,Arial,Verdana,sans-serif;
    word-spacing: normal;
    color: #f3ece9;
}
#fw-codepen-row {
    overflow: visible;
    margin-bottom: -100vh;
}
body, p {font-family:'Museo Sans 500', sans-serif; font-size: 18px;}
h1,h2,h3,h4,h5,h6 {font-family:'Brandon Grotesque', sans-serif; font-size: 22px;}
h1 {
font-weight: 900;
color: #132f46;
	font-size:3rem
  }

.page-title h1, .page-title h1 *, .page-title h1 a:hover, #page .page-title .entry-title {
	font: normal 600 3rem / 3rem "Brandon Grotesque", Helvetica, Arial, Verdana, sans-serif;
  }

h2 {
font-weight: 700;
color: #a87c4c;
font-size: 2.25rem;
line-height: 1;
letter-spacing: 0.1em;
  }

h3 {
font-weight: bold;
color: #a87c4c;
letter-spacing: 0.125em;
font-size:2rem;
  }
  
h4 {
font-weight: 900;
letter-spacing: 0.125em;
  }

  h5 {font-weight: 900; color: #a87c4c; font-size:1rem; letter-spacing: 0.125em;  }
h6 {letter-spacing: .03125em; }
p { letter-spacing: .0625em;  }
h5.learnmore, h5.learnmore a, h5.learnmore a:visited {text-transform:uppercase; letter-spacing:0.125em; font-size: 1.05rem; color:#a87c4c;}
h5.learnmore a:hover {color: #f2ece9;}
h5.learnmore i {
    font-size: 1.4rem;
    margin-right: 10px;
    top: 3px;
    position: relative;
}
h5.learnmore a span {
    font-size: 0.75em;
    position: relative;
    top: -2px;
    padding-left: 5px;
}
/* Main Menu font styling */
.main-nav > li > a {}
.main-nav > li > a:hover, .main-nav > li > a:active {}
.main-nav > li > a .menu-text {font-family:'Brandon Grotesque', sans-serif; font-weight:900; font-size: 1rem; line-height: 1; letter-spacing: .2em;}

/* home */
.home-atf h1 {font-size: 2.4rem; line-height: 1; letter-spacing: 0.1em; font-weight:700;}
.home-atf h6 {font-family:'Museo Sans 500', sans-serif; font-weight:normal; color:#A47C48; text-align:left; font-size:1.2rem; line-height:1.5rem;}

.home-atf-nav a,.home-atf-nav a:link,.home-atf-nav a:visited {font-family:'Brandon Grotesque', sans-serif; color:#A47C48 ; font-size: 1.1rem; line-height: 1.9rem; letter-spacing: .2em; text-decoration:none; font-weight:900; text-transform:uppercase; }
.home-atf-nav a:hover, .home-atf-nav a:active {color:#3B5E98; }
.home-port-title h3 {color:#A47C48; text-transform:uppercase; font-size:1.2rem; line-height:1.375rem; letter-spacing: 0.125em; }
.home-port-seemore {position:relative; bottom:0; left:0;}
#services-section {background-position: 95% 5% !important}
#atf-callout-row a {font-weight: 900; letter-spacing: 4px; font-size: 1.1rem;  text-decoration: none;color: #A47C48; transition:all;}
#atf-callout-row a:hover {color:#3B5E98; transition:all 0.25;}
#atf-callout-row a i {font-size:1.25rem; padding-right:5px;}
.home-port-seemore h5 a, .home-port-seemore h5 {text-transform: uppercase; letter-spacing: 2px; font-weight: 700;font-size: 2rem; color: #A47C48; text-decoration:none; }
.home-port-seemore h5 a i {position:relative; top:2px; padding-left:5px;}

/* Sub Pages */
body.page-template-default .page-title .wf-wrap {
    min-height: 105px;
    padding-top: 0px;
    padding-bottom: 0px;
}
.scroll-top.on {
    right: 90px;
    opacity: 1;
    z-index: 109;
    bottom: 29px;
}
/* Iframe aspect ratio auto fix css hack 2020-02 cv */
[style*="--aspect-ratio"] > :first-child {
  width: 100%;
}
[style*="--aspect-ratio"] > img {  
  height: auto;
} 
@supports (--custom:property) {
  [style*="--aspect-ratio"] {
    position: relative;
  }
  [style*="--aspect-ratio"]::before {
    content: "";
    display: block;
    padding-bottom: calc(100% / (var(--aspect-ratio)));
  }  
  [style*="--aspect-ratio"] > :first-child {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }  
}