/* Table of Content
==================================================
#Site Variables
#Site Styles
#UIKit Styles
#Page Styles
#Media Queries
#Font-Face */
/* #Site Variables
================================================== */
:root {
--primary: #004438;
--secondary: #b0953a;
--light: #F5F5F5;
--dark: #030F2B;
--white: #ffffff;
--text: #000;
--navigation: #ffffff;
--blue: #026ABF;
--pink: #FF6161;
--light-green: #D0FCB3;
--primary-font: 'Avenir', 'Helvetica', sans-serif;
--secondary-font: 'ACaslon Pro', 'Times New Roman', serif;
--script-font: 'Timberline', serif;
}
/* #Site Styles
================================================== */
* { outline:none; }
html, body { color:var(--text); font-size:16px; font-weight:400; font-family:var(--primary-font); line-height:1.5rem; }
.aligncenter { text-align:center; }
.alignleft { text-align:left; }
.alignright { text-align:right; }
img.aligncenter { float:none; display:block; margin:0 auto 15px; }
img.alignleft { float:left; margin-right:15px; }
img.alignright { float:right; margin-left:15px; }
.w900 { font-weight:900; }
.w800 { font-weight:800; }
.w700 { font-weight:700; }
.w600 { font-weight:600; }
.w500 { font-weight:500; }
.w400 { font-weight:400; }
.w300 { font-weight:300; }
.w200 { font-weight:200; }
.w100 { font-weight:100; }
.font6 { font-size:0.625em; }
.font7 { font-size:0.750em; }
.font8 { font-size:0.875em; }
.font10 { font-size:1.0em; }
.font12 { font-size:1.2em; }
.font15 { font-size:1.5em; }
.font18 { font-size:1.8em; }
.font20 { font-size:2.0em; }
.font25 { font-size:2.5em; }
.font30 { font-size:3.0em; }
.font35 { font-size:3.5em; }
.font40 { font-size:4.0em; }
.font45 { font-size:4.5em; }
.s1 { letter-spacing:1px; }
.s2 { letter-spacing:2px; }
.s3 { letter-spacing:3px; }
.s4 { letter-spacing:4px; }
.s5 { letter-spacing:5px; }
.s6 { letter-spacing:6px; }
.s7 { letter-spacing:7px; }
.s8 { letter-spacing:8px; }
.lh0 { line-height:1em; }
.lh1 { line-height:1.1em; }
.lh2 { line-height:1.2em; }
.lh3 { line-height:1.3em; }
.lh4 { line-height:1.4em; }
.lh5 { line-height:1.5em; }
.lh8 { line-height:1.8em; }
.lh20 { line-height:2.0em; }
.lh25 { line-height:2.5em; }
h1, h2, h3, h4, h5, .uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5 { font-family:var(--secondary-font); color:inherit; line-height:1.2em; font-weight:400; }
h1, .uk-h1 { font-size:3.500em; }
h2, .uk-h2 { font-size:3.000em; }
h3, .uk-h3 { font-size:1.25em; font-weight:600; font-family:var(--primary-font); text-transform:uppercase; }
h4, .uk-h4 { font-size:1.000em; }
h5, .uk-h5 { font-size:1.575em; }
p { line-height:1.5em; }
p.white { font-size: 1.2em; color:var(--white); }
p.white-bold { font-size: 1.3em; font-weight:600; color:var(--white); }
em { color:inherit; }
.li-text-upsize {font-size: 1.2em;}
.li-text-downsize {font-size:.9em; }
b, strong, .uk-text-bold { font-weight:800; }
a, .uk-link { }
a:hover, .uk-link:hover { color:inherit; text-decoration:none; }
.font-secondary { font-family:var(--secondary-font); }
/* #UIKit Styles
================================================== */
.uk-container-alt { padding:0 3%; }
.uk-text-light { color:var(--light) !important; }
.uk-text-dark { color:var(--dark) !important; }
.uk-text-contrast { color:var(--white) !important; }
.uk-background-primary, .uk-section-primary { background:var(--primary); color:var(--white); }
.uk-background-dark, .uk-section-dark { background:var(--dark); color:var(--white) !important; }
.uk-background-muted, .uk-section-muted { background:var(--light); }
.uk-background-blue, .uk-section-blue { background-color:var(--blue); color:var(--white); }
.uk-background-pink, .uk-section-pink { background-color:var(--pink); color:var(--white); }
.uk-background-light-green, .uk-section-light-green { background-color:var(--light-green); color:var(--primary); }
.uk-section-primary { background-color:var(--primary); }
.uk-text-primary, .uk-text-green { color:var(--primary) !important; }
.uk-button { min-width:220px; padding:7px 40px 5px; font-family:var(--primary-font); font-weight:600; letter-spacing: .15em; text-align:center; border: 2px solid transparent; border-radius: 30px; transition: background 0.3s ease-in-out, color 0.3s ease-in-out, border-color 0.3s ease-in-out; }
.uk-button-contrast { background:var(--white); color:var(--primary) !important; }
.uk-button-contrast:hover { background:var(--primary); color:var(--white) !important; border-color:var(--white); }
.uk-button-contrast.pink { color:var(--pink) !important; }
.uk-button-contrast.pink:hover { background:var(--pink); color:var(--white) !important; }
.uk-button-contrast.blue { color:var(--blue) !important; }
.uk-button-contrast.blue:hover { background:var(--blue); color:var(--white) !important; }
.uk-button-primary { background:var(--primary); color:var(--white) !important; }
.uk-button-primary:hover { background:var(--white); color:var(--primary) !important; border-color:var(--primary); }
.uk-button-primary.light-green { color:var(--light-green) !important; }
.uk-accordion>li { border-bottom:1px solid rgba(255,255,255,0.5); margin-top:15px; padding-bottom:10px; }
.uk-accordion-title { color:inherit; text-transform:uppercase; font-size:1rem; }
.uk-nav-default li a {
color: white !important;
}
.uk-nav-default li a,
.uk-nav-default .uk-nav-sub li a {
color: white !important;
}
.uk-nav-default li a:hover,
.uk-nav-default .uk-nav-sub li a:hover {
color: white !important;
}
/* #Page Styles
================================================== */
.header { padding:10px 0; }
.header .logo { max-width:200px; }
.header .uk-navbar-nav > li > a { font-family:var(--primary-font); color:var(--primary); text-decoration:none; min-height:40px; }
.header .uk-navbar-nav > li > a:hover { text-decoration: underline; }
.header .uk-navbar-dropdown-nav>li>a { color:var(--primary); font-family:var(--primary-font); font-weight:400; text-transform:uppercase; }
.header .uk-navbar-item, .header .uk-navbar-nav>li>a, .header .uk-navbar-toggle { min-height:30px; }
.hero { position:relative; z-index: 0; }
.hero::before { content: ''; position: absolute; top:0; left:0; width:100%; height:100%; background: rgb(0,0,0); background: linear-gradient(90deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);}
.hero em { display:inline-block; font-family:var(--script-font); font-size:2.25em; color:#FEDE6A; margin:-30px 0; }
.home-photo01 { width:180px; }
.home-photo02 { width:200px; bottom:-50px; z-index:1; }
.home-photo03 { width:200px; }
.home-photo04 { width:200px; bottom:-50px; z-index:1; }
/* Reviews Section Styles */
.reviews-card { background-color: rgb(82, 25, 92); color:var(--white); border-radius: 10px; }
.reviews-card-img { position:relative; margin-top:-130px; width: 240px; height: 240px; }
.reviews-card .uk-card-body { padding:20px 40px; }
.reviews-card .uk-card-footer { padding-top:0px; padding-bottom:10px; }
.price-line { display: flex; justify-content: flex-start; align-items: center; width: 100%; }
.dots { flex-grow: 1; border-bottom: 3px dotted var(--primary); margin: 0 10px; position: relative; top: 50%; transform: translateY(-50%); }
.price { margin: 0; position: relative; top: -4px; }
.rounded-image { border-radius:25px; }
.filter-nav li { position: relative; padding: 0 15px; }
.filter-nav li:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 2px; height: 18px; background-color:var(--primary); }
.read-more { text-decoration:none; font-weight:bold; font-size:1rem; color:var(--green); position:relative; display:inline-block; }
.read-more::after { content:""; display:block; width:100%; height:2px; background:currentColor; position:absolute; bottom:-2px; left:0; transform: scaleX(0); transition: transform 0.3s ease; }
.read-more:hover::after { transform: scaleX(1); }
.footer-logo { max-width:150px; }
.social-icon-footer { color:var(--white); margin-right: 10px; margin-left: -5px;}
.social-icon-footer:hover { color: #ccc; }
.address { color:var(--white); font-size: .875em; line-height:1.4; margin-top: 15px; }
.footer h3 { margin:0 0 10px; line-height: 1.1; }
.footer .uk-list { margin:0 0 30px; font-size:.875em; }
.gform_wrapper.gravity-theme input[type=color], .gform_wrapper.gravity-theme input[type=date], .gform_wrapper.gravity-theme input[type=datetime-local], .gform_wrapper.gravity-theme input[type=datetime], .gform_wrapper.gravity-theme input[type=email], .gform_wrapper.gravity-theme input[type=month], .gform_wrapper.gravity-theme input[type=number], .gform_wrapper.gravity-theme input[type=password], .gform_wrapper.gravity-theme input[type=search], .gform_wrapper.gravity-theme input[type=tel], .gform_wrapper.gravity-theme input[type=text], .gform_wrapper.gravity-theme input[type=time], .gform_wrapper.gravity-theme input[type=url], .gform_wrapper.gravity-theme input[type=week], .gform_wrapper.gravity-theme select, .gform_wrapper.gravity-theme textarea { border:1px solid #ddd; }
.gform_button { min-width:220px; padding:7px 40px 5px; font-family:var(--primary-font); font-weight:600; letter-spacing: .15em; font-size: .875rem;
line-height: 38px; text-align:center; border: 2px solid transparent; border-radius: 30px; transition: background 0.3s ease-in-out, color 0.3s ease-in-out, border-color 0.3s ease-in-out; background:var(--primary); color:var(--white); text-transform:uppercase; }
/* #Media Queries
================================================== */
@media only screen and (max-width: 1200px) {
h1 { font-size:3.25em; }
h2 { font-size:2.75em; }
.home-photo01 { width:150px; }
.home-photo02 { width:175px; bottom:-50px; z-index:1; }
.home-photo03 { width:175px; }
.home-photo04 { width:175px; bottom:-50px; z-index:1; }
}
/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
h1 { font-size:3.00em; }
h2 { font-size:2.50em; }
}
/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
h1 { font-size:2.750em; }
h2 { font-size:2.250em; }
}
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
h1 { font-size:2.25em; }
h2 { font-size:1.75em; }
.header .logo { width:150px; }
.reviews-card { margin-right: 15px; margin-left: 15px; }
}
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
.footer-logo { width:100px; }
}
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
.reviews-card { margin-top: 60px; }
.reviews-card-img { width: 180px; height: 180px; position: absolute; top: -90px; left: 50%; transform: translateX(-50%); }
.reviews-card-body { padding-top: 100px; }
}
/* Surface Duo */
@media only screen and (min-width: 540px) and (max-width: 720px) {
}
/* #Font-Face
================================================== */
/* This is the proper syntax for an @font-face file
Just create a "fonts" folder at the root,
copy your FontName into code below and remove
comment brackets */
@font-face {
font-family: 'Avenir';
src: url('../fonts/Avenir-Medium.woff2') format('woff2'),
url('../fonts/Avenir-Medium.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Avenir';
src: url('../fonts/Avenir-MediumOblique.woff2') format('woff2'),
url('../fonts/Avenir-MediumOblique.woff') format('woff');
font-weight: normal; /* Italic */
font-style: italic;
}
@font-face {
font-family: 'Avenir';
src: url('../fonts/Avenir-Heavy.woff2') format('woff2'),
url('../fonts/Avenir-Heavy.woff') format('woff');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'ACaslon Pro';
src: url('../fonts/ACaslonPro-Regular.woff2') format('woff2'),
url('../fonts/ACaslonPro-Regular.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Timberline';
src: url('../fonts/Timberline-Regular.woff2') format('woff2'),
url('../fonts/Timberline-Regular.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* @font-face {
font-family: 'FontName';
src: url('../fonts/FontName.eot');
src: url('../fonts/FontName.eot?iefix') format('eot'),
url('../fonts/FontName.woff') format('woff'),
url('../fonts/FontName.ttf') format('truetype'),
url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
font-weight: normal;
font-style: normal; }
*/