/* Theme Name: Conserve Water for Kane County - V2 Theme URI: https://conservewaterforkane.org/ Author: Jackson Sky Web Design & Development Author URI: https://jacksonsky.com/ Description: This is a custom responsive theme designed and developed exclusively for Conserve Water for Kane County. Tags: one-column, two-columns, custom-menu, full-width-template Version: 2.0 */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- 1.0 Normalize 2.0 Accessibility 3.0 Alignments 4.0 Clearings 5.0 Typography 6.0 Forms 7.0 Formatting 8.0 Lists 9.0 Tables 10.0 Links 11.0 Navigation 12.0 Layout 12.1 Header 12.2 Regular Content 12.3 Content Layouts 12.4 Sidebar Content 12.5 Footer 12.6 Home Page 12.7 Interior Pages 12.8 Page Sections 12.9 Posts 12.10 MISC Universal Styles 13.0 Comments 14.0 Widgets 15.0 Media 15.1 Galleries 16.0 Media Queries 16.1 Query sm - Over 576px 16.2 Query md - Over 768px 16.3 Query lg - Over 992px 16.4 Query xl - Over 1200px 16.5 Query xxl - Over 1400px 17.0 Print --------------------------------------------------------------*/ /*-------------------------------------------------------------- 1.0 Normalize - See Stylesheet normalize.css --------------------------------------------------------------*/ /* But it is not enough now, below dont hide play button parent div */ *::-webkit-media-controls-panel { display: none!important; -webkit-appearance: none; } /* Old shadow dom for play button */ *::--webkit-media-controls-play-button { display: none!important; -webkit-appearance: none; } /* New shadow dom for play button */ /* This one works */ *::-webkit-media-controls-start-playback-button { display: none!important; -webkit-appearance: none; } /*-------------------------------------------------------------- 2.0 Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ /* Hide visually and from screen readers */ .hidden {display: none !important;} /* * Hide only visually, but have it available for screen readers: * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility */ .visuallyhidden {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;} /** Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: * https://www.drupal.org/node/897638 */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto;} /** Hide visually and from screen readers, but maintain layout */ .invisible {visibility: hidden;} /* Text meant only for screen readers. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; } .screen-reader-text:focus {background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */} /*-------------------------------------------------------------- 3.0 Alignments --------------------------------------------------------------*/ .alignleft {display: inline; float: left; margin-right: 1.5em;} .alignright {display: inline; float: right; margin-left: 1.5em;} .aligncenter {clear: both; display: block; margin-left: auto; margin-right: auto;} /*-------------------------------------------------------------- 4.0 Clearings --------------------------------------------------------------*/ /**** Clearfix update ****/ .group:before, .group:after { visibility: hidden; display: block; content: ""; clear: both; height: 0; } * html .group { zoom: 1; } /* IE6 */ *:first-child+html .group { zoom: 1; } /* IE7 */ /*-------------------------------------------------------------- 5.0 Typography --------------------------------------------------------------*/ body, button, input, select, textarea { font-family: 'Inter', Helvetica, Arial, sans-serif; font-size:16px; color:#000000; font-weight: 400; font-style:normal; line-height:1.6; letter-spacing:.025em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } h1, h2, h3, h4, h5, h6, .intro-large{font-family: 'Roboto Condensed', Helvetica, Arial, sans-serif; color:#000; line-height:1.1; margin:0; padding:0; margin-bottom:.5em; letter-spacing: .025em; font-weight: 500;} h1, .intro-large{font-size: 30px;} h2{font-size:28px;} h3{ font-size:26px;} h4{ font-size:24px; margin-bottom:.2em;} h5{ font-size: 23px; margin-bottom: .2em; text-transform: uppercase;} h6{ font-size:21px; margin-bottom: .15em;} .intro-large{line-height: 1.1;} h2.callout, .background-pattern h2{font-size:32px; } p {margin: 0 0 2em; padding: 0;} .serif{font-family: 'Inter', serif; font-size:1.5em;} #main section p:last-of-type{margin-bottom: 0;} #content{font-size: 16px;} dfn, cite, em, i {font-style: italic;} blockquote { color: #0f4e8c; font-size: 1.25rem; line-height: 1.35; overflow: hidden; margin-bottom:1.5em; font-weight: 400; } blockquote p:last-child{margin-bottom: 0;} blockquote cite { display: block; font-style: normal; font-weight: 600; margin-top: 0.5em; } address { margin: 0 0 1.5em;} pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; font-size: 0.9375rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #eee; text-decoration: none; } .big {font-size: 125%;} .light{ font-weight:300;} .normal{font-weight:400;} .semibold{font-weight:600;} .strong, strong{font-weight:700;} blockquote {quotes: "" "";} q {quotes: "“" "”" "‘" "’";} blockquote:before, blockquote:after {content: "";} :focus {outline: none;} .uppercase{text-transform: uppercase;} sup{ position: relative; top: 0; font-size: 50%; vertical-align: super; } /*-------------------------------------------------------{------- 6.0 Forms --------------------------------------------------------------*/ label { color: #676767; display: block; font-weight: 600; margin-bottom: 0.35em; } legend{color:#676767;} fieldset { margin-bottom: 1em; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea, select{ color: #000; background: #fff; background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)); border: 1px solid #bbb; display: block; padding: 0.5em; font-size:14px; width: 100%; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus { color: #222; border-color: #333; } textarea { resize: vertical; } select { border: 1px solid #bbb; max-width: 100%; } input[type="radio"], input[type="checkbox"] { margin-right: 0.5em; } input[type="radio"] + label, input[type="checkbox"] + label { font-weight: 400; } /************* Buttons **********/ button,.button, .buttonAlt, a.button, input[type="button"], input[type="submit"]{ font-family: 'Inter', sans-serif; text-transform:uppercase; background-color: #0f4e8c; border: 0; color: #fff; cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; font-weight: 500; letter-spacing: .03em; line-height: 1.2; padding: .85em 1.6em; text-shadow: none; -o-transition: all .3s linear; -moz-transition: all .3s linear; -webkit-transition: all .3s linear; transition: all .3s linear; margin-right: 10px; margin-bottom: 7px; text-decoration: none !important; text-align: center; border-radius: 9999px ; } button:hover,.button:hover, .buttonAlt:hover, a.button:hover, input[type="button"]:hover, input[type="submit"]:hover{ color:#fff; background-color:#0085c5;} button.buttonAlt, .button.buttonAlt, .buttonAlt, a.buttonAlt, a.button.alt{background:#00944d; color:#fff; } button.buttonAlt:hover, .button.buttonAlt:hover, .buttonAlt:hover, a.buttonAlt:hover, a.button.alt:hover{ background: #0085c5; color:#fff; text-decoration: none !important;} button.buttonAlt:after, .button.buttonAlt:after, .buttonAlt:after, a.buttonAlt:after, a.button.alt:after{content:none;} .trans2{-o-transition: all .2s linear; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;} /********* Placeholders **********/ /* Placeholder text color -- selectors need to be separate to work. */ ::-webkit-input-placeholder { color: #9f9f9f; font-family: 'Inter', Helvetica, Arial, sans-serif; } :-moz-placeholder { color: #9f9f9f; font-family: 'Inter', Helvetica, Arial, sans-serif; } ::-moz-placeholder { color: #9f9f9f; font-family: 'Inter', Helvetica, Arial, sans-serif; opacity: 1; /* Since FF19 lowers the opacity of the placeholder by default */ } :-ms-input-placeholder { color: #9f9f9f; font-family: 'Inter', Helvetica, Arial, sans-serif; } /******* Gravity Forms *********/ #main section p.gform_description:last-of-type{margin-bottom: 2em;} #content .gform_wrapper.gravity-theme .gfield{padding:.75em;} .container .gform_wrapper.gravity-theme .gfield_label{margin-bottom: 0;} .container .gform_wrapper.gravity-theme .gfield_label{margin-bottom: 0;} .container .gform_wrapper.gravity-theme .ginput_complex label{padding-top: 0; font-weight: 300;} .container .gform_wrapper.gravity-theme .field_description_above .gfield_description{padding-bottom:0; } .gform_wrapper.gravity-theme #gform_2 .gfield_label{font-size: 140%;} .gform_wrapper.gravity-theme #gform_2 legend{font-weight: 300 !important; line-height: 1.4; margin-bottom: .5em !important;} #gform_2 .gfield_radio{margin-bottom: 1em;} #gform_2 .gfield--input-type-html{font-size: 1.25em;} #gform_2 ol.fancy-list li, #gform_2 ul.fancy-list li{font-size: 1em;} #gform_2 ul.fancy-list{margin-left: 0;} #gform_2 ul.fancy-list li{} #gform_2 ul.fancy-list li::before{font-size: 1.25em;} #gform_2 ul.fancy-list ol.fancy-list{padding-top: .75em; padding-left: 1em;} #gform_2 ul.fancy-list ol.fancy-list li{padding-left: .5em;} #gform_2 ul.fancy-list ol.fancy-list li::before{ font-size: .85em; font-family: 'Figtree', sans-serif; } ul.fancy-list{list-style: none;} ul.fancy-list li{padding-left:1.5em; font-size: 125%; position: relative;} ul.fancy-list li::before{ content: "\f058"; /* FontAwesome Unicode */ font-family: 'Font Awesome 6 Pro'; display: inline-block; margin-left: -1.5em; width: 1.5em; position: absolute;} ol.fancy-list { margin: 0 0 2em .2em !important; counter-reset: li; list-style-type: none; } ol.fancy-list li { position: relative; padding-left: 2em ; font-size: 1.25em; font-weight: 400; line-height: 1.5; margin-bottom: 1em; } ol.fancy-list li:before { content: counter(li); counter-increment: li; height: 1.5em; width: 1.5em; border: 2px solid #0C4E97; border-radius: 50%; text-align: center; position: absolute; left: 0; color:#0C4E97; line-height: 1.3em; } /** SECTION 1 **/ /* Hide the OS/Browser checkboxes/radio buttons */ input[type=checkbox], input[type=radio] { visibility: hidden!important; margin: 0!important; width: 0!important; } /* Set Font Awesome font, size, & positioning for the checkboxes/radio buttons plus the cursor on hover */ input[type=checkbox] + label:before, input[type=checkbox] + span.woocommerce-terms-and-conditions-checkbox-text:before, input[type=radio] + label:before { visibility: visible; font-family: "FontAwesome"!important; font-size: 25px; position: relative; top: 5px; padding-right: 8px; } input[type=checkbox] + label:hover, input[type=checkbox] + span.woocommerce-terms-and-conditions-checkbox-text:hover, input[type=radio] + label:hover { cursor: pointer; } /** SECTION 2 **/ /** SECTION 1 **/ /* Hide the OS/Browser checkboxes/radio buttons */ input[type=checkbox], input[type=radio] { visibility: hidden!important; margin: 0!important; width: 0!important; display: none !important; } /* Set Font Awesome font, size, & positioning for the checkboxes/radio buttons plus the cursor on hover */ input[type=checkbox] + label:before, input[type=checkbox] + span:before, input[type=radio] + label:before { visibility: visible; font-family: "Font Awesome 6 Sharp"!important; font-size: 140%; position: relative; top: 0.1em; padding-right: 8px; } input[type=checkbox] + label:hover, input[type=checkbox] + span:hover, input[type=radio] + label:hover { cursor: pointer; } /** SECTION 2 **/ /* Set checkbox to FA icons: normal, hover, checked, & checked hover */ input[type=checkbox] + label:before, input[type=checkbox] + span:before { content: '\f096'!important; } input[type=checkbox] + label:hover:before, input[type=checkbox] + span:before { content: '\f046'; filter: alpha(opacity=20); opacity: 0.2; } input[type=checkbox]:checked + label:before, input[type=checkbox]:checked + span:before { content: '\f046'!important; } input[type=checkbox]:checked + label:hover:before, input[type=checkbox]:checked + span:hover:before, input[type=checkbox]:checked + label:before, input[type=checkbox]:checked + span:before { filter: alpha(opacity=100); opacity: 1; } /* Set radio buttons FA icons: normal, hover, checked, & checked hover */ input[type=radio] + label:before { content: '\f10c'!important; color: #BBBBBB !important; } input[type=radio] + label:hover:before { content: '\f192'!important; color: #00944d !important; } input[type=radio]:checked + label:before { content: '\f192'!important; color: #1D9AD6 !important; } input[type=radio]:checked + label:hover:before { filter: alpha(opacity=100); opacity: 1; color: #00944d !important; } /*-------------------------------------------------------------- 7.0 Formatting --------------------------------------------------------------*/ hr { background-color:#efefef; border: 0; height: 8px; margin-top: 2em; margin-bottom: 2em; opacity: 100%; } hr.short{ max-width: 90px; width: 25%; margin-left: 0; background-color:#5e94ce;} hr.alt{background-color:#f89e23;} ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } .inline-block{display: inline-block;} /*-------------------------------------------------------------- 8.0 Lists --------------------------------------------------------------*/ ul, ol { margin: 0 0 2em 2em; padding: 0;} ul {list-style: disc;} ol {list-style: decimal;} #content ul, #content ol{margin: .75em 0 2em 2em;} li{ padding-left:0; margin-bottom:.5em;} li > ul, li > ol {margin-bottom: 0; margin-left: 1.5em;} dt {font-weight: 700;} dd {margin: 0 1.5em 1.5em;} /*-------------------------------------------------------------- 9.0 Tables --------------------------------------------------------------*/ table { border-collapse: collapse; margin: 0 0 1.5em; width: 100%;} thead th { border-bottom: 2px solid #bbb; padding-bottom: 0.5em;} th { padding: 0.4em; text-align: left; } tr { border-bottom: 1px solid #eee;} td {padding: 0.4em;} th:first-child,td:first-child {padding-left: 0;} th:last-child,td:last-child {padding-right: 0;} .ml-responsive-table {padding-bottom: 30px !important;} .ml-responsive-table dd {margin-bottom: 0 !important;} .ml-table {padding: 0 10px 0 10px !important;} .ml-grid{padding:1em 2em .25em 0 !important;;} .ml-grid.ml-row-0{display: none;} .ml-value{padding-bottom: .75em !important;} /*** Pseudo Table Styles****/ .table{display:table;} .tableRow{display:table-row;} .tableCell{display:table-cell;} .tableMiddle{ vertical-align:middle;} .vert50{ height:50%;} /*-------------------------------------------------------------- 10.0 Links --------------------------------------------------------------*/ a{color:#00944d; text-decoration: none;} a:hover{color:#1d9ad6; text-decoration: underline;} #content a{text-decoration:underline; -o-transition: all .1s linear; -moz-transition: all .1s linear; -webkit-transition: all .1s linear; transition: all .1s linear;} a.alt{color:#44697d; text-decoration: none; text-transform: uppercase; font-weight: 700; font-size: 90%;} a.alt:hover{color:#44697d; text-decoration: underline;} a:active, a:focus{outline:none;} a.alt:after{font-family: 'FontAwesome'; content: '\f0a9'; padding-left: 8px; position: relative; font-size: 120%;} #content h1 a, #content h2 a, #content h3 a, #content h4 a, #content h5 a, #content h6 a{text-decoration: none;} /*-------------------------------------------------------------- 11.0 Navigation --------------------------------------------------------------*/ /********* Main Navigation ********/ /*** Mega Max Mobile****/ #mainNav #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link {font-family: 'Figtree', Helvetica, Arial, sans-serif !important; font-weight: 600 !important;} #mainNav #mega-menu-wrap-main-menu .mega-menu-toggle{padding:0 10px;} /***** Social ******/ ul.social { margin-bottom: 0; } ul.social .nav-link { padding: 8px 0; } ul.social .nav-link .fab { } ul.social a.nav-link { color: #000; text-decoration: none; } ul.social .list-inline-item:not(:last-child) { margin-right: 6.4px; } /*-------------------------------------------------------------- 12.0 Layout --------------------------------------------------------------*/ html, body { height: 100%; } html { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; } body { display: flex; flex-direction: column; background: #fff; background: rgba(255,255,255,1); } #content.site-content{flex: 1 0 auto;} #content #page-intro-section{padding-top: 59px; background-color: #efefef; background-size: cover; background-repeat: no-repeat; background-position: center center;} /*-------------------------------------------------------------- 12.1 Header --------------------------------------------------------------*/ /***** Main Header *****/ #site-header{position: fixed; background-color:rgba(239, 239, 239, 0); width: 100%; z-index: 200; border-bottom: 0 solid #efefef; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;} #site-header.shrink{border-bottom: 1px solid #efefef; background-color:rgba(239, 239, 239, 1); } #site-header .site-title{ } #site-header .site-title img{width: 100%; height: auto; max-height: 100%; max-width: 100%; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;} #site-header.shrink .site-title img{width: 75%; height: auto; max-height: 100%; max-width: 100%;} #site-header h1.site-title{margin-bottom: 0; line-height:0;} #site-header .nav-con{-moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;} #site-header.shrink .nav-con{/*margin-top: 10px !important;*/} footer .copyright{font-size: 12px;} /*-------------------------------------------------------------- 12.2 Regular Content --------------------------------------------------------------*/ /******** Page Header ********/ /*-------------------------------------------------------------- 12.3 Content Layouts --------------------------------------------------------------*/ /*-------------------------------------------------------------- 12.4 Sidebar Content --------------------------------------------------------------*/ /*-------------------------------------------------------------- 12.5 Footer --------------------------------------------------------------*/ footer.site-footer {font-size: 14px; line-height: 1.6; flex-shrink: 0;} footer .footer-info-section{background-color: #0f4e8c; color:#ffffff;} footer .footer-info-section a{color: #fff; text-decoration: underline;} footer .footer-info-section a:hover{color: #00acff; text-decoration: underline;} footer h1, footer h2, footer h3, footer h4, footer h5, footer h6{color:#fff; font-weight: 600; text-transform: uppercase;} footer h3{font-size: 21px;} footer h4{font-size: 14px; font-family: 'Inter', Helvetica, Arial, sans-serif; margin-bottom: .25em;} footer .footnote{font-size: 12px; font-style: italic;} footer ul.footer-list-links {color:#0b4e95; list-style: none; margin: 0; padding: 0;} footer ul.footer-list-links li {margin: 0; padding: 0; font-weight: 500; margin-bottom: .2em; line-height: 1.4; margin-bottom: .5em;} footer ul.footer-list-links li a{text-transform: uppercase; color:#fff;} footer ul.footer-list-links li a:hover{text-decoration: underline; color: #00acff;} footer .footer-contact{line-height: 1.85;} footer .foot-title{text-transform: uppercase; font-weight: 600; font-size: 14px; color:#011e41;} footer .footer-address{line-height: 1.5;} footer .footer-address p{margin-bottom: 1.2em;} footer .footer-social a{margin-right: .25em;} footer .footer-open h3{margin-bottom: .2em;} footer .footer-open a{text-transform: uppercase; margin-top: .2em;} footer .footer-bottom-section{font-size: 12px; color: #0e0e0e;} .language .gtranslate_wrapper{display: inline-block; padding-left: 5px;} .language .gt_selector{background-color: transparent; color:#fff; border: 1px solid #fff;} .language .gt_selector option{color:#000;} /*-------------------------------------------------------------- 12.6 Home Page --------------------------------------------------------------*/ .home #site-header{-moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;} .home #site-header.shrink{background-color:#efefef;} /**** Banner ****/ #home-banner{background-repeat: no-repeat; background-size:cover; background-position: top center; } #home-banner h1{line-height: 1.05;} /*** Banner Buttons ***/ #home-banner .carousel-indicators [data-bs-target]{ height:1em; font-size: 18px; background-color: transparent;} #home-banner .carousel-indicators .bullet-controls [data-bs-target]{text-indent: 0;} #home-banner .carousel-indicators .bullet-controls [data-bs-target]:before{ text-indent:inherit; color: #000; font-family: 'Font Awesome 6 Pro',"Font Awesome 6 Free"; content: "\f111"; /* FontAwesome Unicode */ } #home-banner .carousel-control-prev-icon, #home-banner .carousel-control-next-icon{background-image: none; text-indent: none; text-indent:0; color: #000; font-family: 'Font Awesome 6 Pro',"Font Awesome 6 Free"; height: 1em; font-size: 110%;} #home-banner .carousel-control-prev-icon:before{content: "\f053"} #home-banner .carousel-control-next-icon:before{content: "\f054"} .home .site-content{padding-top: 0 !important;} /****** Information Section ******/ .home #home-information{font-size: 18px;} .home a.info-link-box{text-decoration: none !important; line-height: 1.4;} .home a.info-link-box:hover{background-color:#efefef; color:#00944d; } .home a.info-link-box .info-text{font-size: 12px; text-transform: uppercase; font-weight: 600; text-align: center;} /****** Conserve Section *****/ .home #home-conserve{background-color:#efefef; font-size: 17px; } .home #home-conserve .home-white-box{background-color: #fff; font-weight: 600;} .home #home-conserve .white-box-image{background-repeat: no-repeat; background-size: cover; background-position: center center;} .home #home-conserve ul.white-box-items{margin: 0; padding: 0; list-style: none;} .home #home-conserve ul.white-box-items li{margin-bottom: .9em;} .home #home-conserve ul.white-box-items a{text-decoration: none; color: #0085c5;} .home #home-conserve ul.white-box-items a:hover{text-decoration: underline; color: #00944d;} /****** Event Section *****/ .home #home-event{background-color:#efefef; font-size: 18px; } .home #event-space .event-box{background: #fff; font-family: 'Inter', Helvetica, Arial, sans-serif;} .home #event-space .featured-image{background-size: cover; background-position: center center; background-repeat: no-repeat;} .home #event-space .event-box h3{font-family: 'Inter', Helvetica, Arial, sans-serif; font-size: 18px; line-height: 1.4; letter-spacing: .015em;} .home #content #event-space .event-box h3 a{color: #0085c5; border: 0; text-decoration: none;} .home #event-space .category-name{font-size: 12px; font-family: 'Inter', Helvetica, Arial, sans-serif; color: #000; text-transform: uppercase; font-weight: 500; line-height: 1.2;} .home #event-space .when, .home #event-space .where{font-family: 'Inter', Helvetica, Arial, sans-serif !important; font-size: 15px; line-height: 1.4;} .home #content #event-space .detail-link a{text-transform: uppercase; font-size: 14px; color: #00944d; text-decoration: none; font-weight: 600; } .home #content #event-space .detail-link a:hover{text-decoration: underline;} /*-------------------------------------------------------------- 12.7 Interior Pages --------------------------------------------------------------*/ /**** Padding Options****/ .v-margin-both{padding-top: 1em; padding-bottom: 1em;} .v-margin-top{padding-top: 1em; padding-bottom: 0;} .v-margin-bottom{padding-top: 0; padding-bottom: 1em;} .v-margin-none{padding-top: 0; padding-bottom: 0;} /**** 404 ****/ #searchform #s{max-width: 450px; width: 100%; margin-bottom: .8em;} /*** Search Results ***/ .search-results .smalltext p:last-of-type{margin-bottom: 0} /****** Event shortcode *****/ .home #home-event{background-color:#efefef; font-size: 18px; } #event-space .event-box{background: #EFEFEF; font-family: 'Inter', Helvetica, Arial, sans-serif;} #event-space .featured-image{background-size: cover; background-position: center center; background-repeat: no-repeat;} #event-space .event-box h3{font-family: 'Inter', Helvetica, Arial, sans-serif; font-size: 18px; line-height: 1.4; letter-spacing: .015em;} #content #event-space .event-box h3 a{color: #0085c5; border: 0; text-decoration: none;} #event-space .category-name{font-size: 12px; font-family: 'Inter', Helvetica, Arial, sans-serif; color: #000; text-transform: uppercase; font-weight: 500; line-height: 1.2;} #event-space .when, #event-space .where{font-family: 'Inter', Helvetica, Arial, sans-serif !important; font-size: 15px; line-height: 1.4;} #content #event-space .detail-link a{text-transform: uppercase; font-size: 14px; color: #00944d; text-decoration: none; font-weight: 600; } #content #event-space .detail-link a:hover{text-decoration: underline;} /***** Event Calendar Single Page *******/ #content .tribe-events-schedule h2{font-size: 28px;} #content .tribe-common .tribe-common-h5, #content .tribe-common .tribe-common-h6{font-family: 'Roboto Condensed', Helvetica, Arial, sans-serif;} #content .tribe-events-single-event-title{font-family: 'Roboto Condensed', Helvetica, Arial, sans-serif;} #content .tribe-events-back a, #content .tribe-events-back a:visited{font-family: 'Inter', Helvetica, Arial, sans-serif !important; color:#00944d;} #content .tribe-events-back a:hover{color:#1d9ad6;} #content .tribe-events-event-meta, #content .tribe-common, #content .tribe-common button{font-family: 'Inter', Helvetica, Arial, sans-serif !important;} #content .tribe-events-meta-group a, #content .tribe-common .tribe-common-c-btn-border, #content .tribe-common a.tribe-common-c-btn-border{color:#00944d;} .single-tribe_events #content .tribe-events .tribe-events-c-subscribe-dropdown__container, #content .tribe-block__events-link .tribe-events .tribe-events-c-subscribe-dropdown__container{width: 250px;} #content .tribe-common .tribe-common-c-btn-border, #content .tribe-common a.tribe-common-c-btn-border {border-color:#00944d; } .single-tribe_events #content .tribe-events-c-subscribe-dropdown__button, #content .tribe-block__events-link .tribe-events-c-subscribe-dropdown__button{width:250px;} .single-tribe_events #content .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover{background-color: #EFEFEF;} #content .tribe-common a.tribe-common-c-btn-border:hover{color:#1d9ad6;} #content .tribe-events-meta-group a:hover{color:#1d9ad6; text-decoration: underline;} #content .tribe-events-event-meta.primary, #content .tribe-events-event-meta.secondary{width:100%;} #content .tribe-events-single .tribe-events-sub-nav{font-family: 'Inter', Helvetica, Arial, sans-serif !important;} #content .tribe-events .tribe-events-c-search__button, #content .tribe-events button.tribe-events-c-search__button{background-color:#00944d !important;} #content .tribe-events .tribe-events-c-search__button:hover, #content .tribe-events button.tribe-events-c-search__button:hover{background-color:#1d9ad6 !important;} #content .tribe-events-single .tribe-events-sub-nav .tribe-events-nav-next a, #content .tribe-events-single .tribe-events-sub-nav .tribe-events-nav-previous a {color:#00944d !important;} #content .tribe-events-single .tribe-events-sub-nav .tribe-events-nav-next a:hover, #content .tribe-events-single .tribe-events-sub-nav .tribe-events-nav-previous a:hover {color:#1d9ad6 !important;} #content .tribe-events-single .tribe-events-sub-nav .tribe-events-nav-next a:after, #content .tribe-events-single .tribe-events-sub-nav .tribe-events-nav-previous a:before{display: none;} /****** Event Calendar - All event pages ****/ #content ul.tribe-events-c-view-selector__list{margin: 0;} #content .tribe-common .tribe-common-b2{font-family: 'Inter', Helvetica, Arial, sans-serif !important;} #content .tribe-events-c-nav__prev{text-transform: uppercase !important;} #content a.tribe-events-c-nav__prev {color:#00944d !important; text-decoration: none;} /*************************** Household Calculator ****************************/ .house-banner{background-color: #393738;} .house-outside-banner{background-color: #bbe5f8; background-image: url("assets/images/house/outside-background_1.png"); background-position: bottom; background-repeat: repeat-x; background-size: contain;} /**** Tooltips *****/ #house-banner-holder .info-icon a img { display:inline-block; width: 30px; max-width: 100%; height: auto; transition: filter 600ms cubic-bezier(0.33, 0.11, 0.02, 0.99), transform 600ms cubic-bezier(0.33, 0.11, 0.02, 0.99); } #house-banner-holder .info-icon a img:hover { filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.1)) drop-shadow(0 1px 6px rgba(0, 0, 0, 0.05)) drop-shadow(0 8px 8px rgba(0, 0, 0, 0.1)) drop-shadow(0 16px 16px rgba(0, 0, 0, 0.1)) drop-shadow(8px 32px 32px rgba(0, 0, 0, 0.15)) drop-shadow(8px 64px 64px rgba(0, 0, 0, 0.15)); transform: scale(1.05) translateY(-0.5rem); } #house-banner-holder .info-icon a img:active { filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.1)) drop-shadow(0 1px 6px rgba(0, 0, 0, 0.05)) drop-shadow(0 8px 8px rgba(0, 0, 0, 0.1)) drop-shadow(0 16px 16px rgba(0, 0, 0, 0.1)) drop-shadow(8px 16px 16px rgba(0, 0, 0, 0.15)) drop-shadow(8px 32px 32px rgba(0, 0, 0, 0.15)); content:url("assets/images/house/Tooltip_WaterDrop_Active-02.png"); } #house-banner-holder .house-image-holder{position: relative;} #house-banner-holder .info-icon{position: absolute; z-index: 10;} /****** HC Navigation ******/ #house-nav-holder{background-color: #efefef;} #house-nav-holder .nav-tabs{border-bottom: 0 none;} #house-nav-holder .nav-tabs a.nav-link{border:0 none; text-transform: uppercase; font-weight: 700; text-decoration: none; color:#00944d; padding: .5em 0; border-radius: 0; background-color: transparent; font-size: 9px;} #house-nav-holder .nav-tabs a.nav-link:hover{background-color: #dbdbdb;} #house-nav-holder .nav-tabs a.nav-link.active{color: #0085c5; border-bottom:5px solid #0085c5; } #house-nav-holder .nav-tabs a.nav-link i{display: block; font-size: 28px; padding-bottom: 3px;} #content #house-nav-holder ul{margin: 0;} #content #house-nav-holder li{margin: 0;} /*********** ROOMS **************/ /**** Bathroom ****/ #house-banner-holder #br-tip-1{top:45%; left: 36%;} #house-banner-holder #br-tip-2{top:47.5%; left: 65%;} #house-banner-holder #br-tip-3{top:20%; left: 4%;} #house-banner-holder #br-tip-4{top:52%; left: 2%;} /**** Kitchen ****/ #house-banner-holder #kr-tip-1{top:56%; left: 51%;} #house-banner-holder #kr-tip-2{top:47%; left: 70%;} #house-banner-holder #kr-tip-3{top:72%; left: 65.5%;} #house-banner-holder #kr-tip-4{top:30%; left: 37%;} /**** Laundry ****/ #house-banner-holder #lr-tip-1{top:35%; left: 41%;} #house-banner-holder #lr-tip-2{top:40%; left: 49%;} #house-banner-holder #lr-tip-3{top:41%; left: 12%;} #house-banner-holder #lr-tip-4{top:68%; left: 75%;} /**** Laundry ****/ #house-banner-holder #od-tip-1{top:60%; left: 69%;} #house-banner-holder #od-tip-2{top:68%; left: 89%;} #house-banner-holder #od-tip-3{top:72%; left: 18%;} #house-banner-holder #od-tip-4{top:85%; left: 41%;} /****** Question Form *******/ #content .questions h1{border-bottom: 3px solid #EFEFEF; padding-bottom: .25em; } #content .questions p.basic{font-size: 100%;} #content .questions p{ font-size: 115%;} #content .questions hr{height: 3px;} #content .questions .input-group{padding-top: .5em; padding-bottom: 2em;} #content .questions .input-group-text{ background: none !important; border: 0 none !important; border-radius: 0; font-weight: 500;} #content .questions .form-control{border-radius: 0; } #content .questions .form-control.nums{ max-width: 120px; } #content .questions .form-control:focus{box-shadow: 0 0 0 0.15rem rgba(29,154,214,.25);} #content .questions .form-check{display: flex;} #content .questions input[type="radio"] + label, #content .questions input[type="checkbox"] + label {font-weight: 500;} #content #main-results{} #content #main-results .input-group{display: block !important;} #content #main-results .starter-text{font-size: 30px; padding: 0 0 .4em;} #content #main-results .form-control{background: none; border: none; width: 100%;font-size: 80px; padding: 0; line-height: 1.1; font-weight: 700; color: #00944D;} #content #main-results .ender-text{padding: 0;} #content .questions .progress-bar{background-color: #0085C5;} /*-------------------------------------------------------------- 12.8 Page Sections --------------------------------------------------------------*/ /***** Page Intro Section ****/ #page-intro-section .intro-background{ } #page-intro-section h1.page-title, .page-title h1{ font-weight: 500; color:#000; margin-bottom: 0; line-height: 1.1; text-transform: none; letter-spacing: .005em;} #page-intro-section .intro-content-section{font-size: 16px; line-height: 1.4; color:#000;} #page-intro-section .breadcrumbs{text-transform: uppercase; font-size: 12px; font-weight: 500;} #page-intro-section .breadcrumbs a{color: #000; text-decoration: none;} #page-intro-section .breadcrumbs a:hover{color: #1d9ad6; text-decoration: underline;} /***** Accordion Section ******/ .accordion-background {background-color:#fff; font-weight: 400;} .accordion-background.background-white{background-color: #fff;} .accordion-background.background-grey{background-color: #efefef;} .accordion-background.background-pattern{background-color: #0085c5; background-image:url("assets/images/common/waves-2x.png"); background-repeat: repeat; background-size: 50%; color: #fff;} .accordion-background.background-pattern h2{color: #fff;} .accordion .card{border-radius: 0; border: 0 none; padding-bottom: 6px; background-color: transparent;} .accordion .card .card-header{padding: 0; border-bottom: 0 none; } .accordion .card h2 button.btn{font-family: 'Inter', Helvetica, Arial, sans-serif !important;} .accordion .card button.btn{border-radius: 0; margin: 0; font-size: 18px; background-color:#0f4e8c; color:#fff; font-weight: 600; padding: .75em 1.85em .75em .9em; text-transform: none; letter-spacing: .03em;} .accordion .card button.btn:hover{background-color:#073c70;} .accordion .card button.btn::after{content: '-'; position: absolute; right: .75em; top:.75em; font-weight: 700; background: none; width: auto; height: auto; transition: none;} .accordion .card button.btn.collapsed::after{content: '+';} .accordion .card .card-body{background-color: #fff; padding: 1.5rem 1.5rem;} .accordion-background.background-white .card .card-body{background-color: #efefef;} .accordion-background.background-pattern .card .card-body{background-color: #efefef; color: #000;} #content .accordion .card .card-body p:last-of-type{margin-bottom: 0;} .accordion .btn:focus{box-shadow: none;} #content .accordion .card .card-body a.button{color:#fff;} /***** Callout *****/ .callout-section .callout-button a{text-decoration: none; font-weight: 600; font-size: 14px; text-transform: uppercase;} .callout-section .callout-image{background-size: cover; background-repeat: no-repeat; background-position: center center;} /****** Light Blue Background *******/ .light-blue-background{background-color:#e8f0f8;} /***** ---- BACKGROUND OPTIONS *****/ /****** Wave Background *******/ .background-pattern{background-color: #0085c5; background-image:url("assets/images/common/waves-2x.png"); background-repeat: repeat; background-size: 50%; color: #fff;} .background-pattern h1, .background-pattern h2, .background-pattern h3, .background-pattern h4, .background-pattern h5, .background-pattern h6{color:#fff;} .background-pattern a{color: #fff;} .background-pattern a:hover{color:#000;} .background-pattern h2{margin-bottom: .2em; } .background-pattern a.button:hover{color: #fff; background-color:#093966; } /**** White Background *****/ .background-white{background-color:#fff; color: #000; } .background-white h1, .background-white h2, .background-white h3, .background-white h4, .background-white h5, .background-white h6{color: #000;} .background-white a{color:#00944d; text-decoration: none;} .background-white a:hover{color:#1d9ad6; text-decoration: underline;} .background-white a.button{color: #fff;} /**** Grey Background *****/ .background-grey{background-color:#efefef; } /**** Green Background *****/ .background-green{background-color:#00944d; color:#fff;} .background-green h1, .background-green h2, .background-green h3, .background-green h4, .background-green h5, .background-green h6{color: #fff;} .background-green a{color: #fff; text-decoration: underline;} .background-green a:hover{color: #000; text-decoration: underline;} #content .background-green ul.link-list{border-left-color:#EFEFEF;} /**** Blue Background *****/ .background-blue{background-color:#0f4e8c; color:#fff;} .background-blue h1, .background-blue h2, .background-blue h3, .background-blue h4, .background-blue h5, .background-blue h6{color: #fff;} .background-blue a{color: #efefef; text-decoration: underline;} .background-blue a:hover{color: #000; text-decoration: underline;} /****** Image Only Section *****/ .embed-image img{width: 100%; height: auto;} /****** Resource List Section *********/ #content .resource-list-item img{border: 1px solid #efefef;} .resource-list-item h5{text-transform: none;} #content .resource-list-item h5 a{text-decoration: none; } #content .resource-list-item h5 a:hover{text-decoration: underline;} /*-------------------------------------------------------------- 12.9 Posts --------------------------------------------------------------*/ #postTitle h2 a{text-decoration: none;} #postTitle h2 a:hover{text-decoration: underline;} #content-post{font-size: 18px;} #paging-bottom{width:100%; display:block; clear:both;} #paging-bottom .alignleft, #paging-bottom .alignright{ display: block; width: 32%; } #paging-bottom .alignleft a, #paging-bottom .alignright a{ display: block; width: 100%; } #paging-bottom .alignleft { float: left; } #paging-bottom .alignright { float: right; } #paging-bottom .alignleft a, #paging-bottom .alignright a { background-color: #0F4E8C; color: #fff; text-decoration: none; font-weight: 500; display: block; width: 100%; text-align: center; text-transform: uppercase; padding: 10px 0; font-size: 16px; -o-transition: all .2s linear; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear; } #paging-bottom .alignleft a:hover, #paging-bottom .alignright a:hover { background: #0085C5; } /******************* Blog Single ************************/ /********************* WordPress Styles *********************/ #postInfo {color:#9f9f9f; font-size:14px; margin:0 0 20px 0; clear: both; font-style:italic;} #paging { display: block; text-align: center; margin-top: 60px; padding-bottom: 60px; font-weight:bold; font-size:14px; text-transform:uppercase; } #paging a{text-decoration: none;} #paging a:hover{text-decoration: underline;} /*-------------------------------------------------------------- 12.10 MISC Universal Styles --------------------------------------------------------------*/ ul.fancy-list{list-style: none;} ul.fancy-list li{padding-left:1.5em; font-size: 125%; position: relative;} ul.fancy-list li::before{ content: "\f058"; /* FontAwesome Unicode */ font-family: 'Font Awesome 6 Pro'; display: inline-block; margin-left: -1.5em; width: 1.5em; position: absolute;} #content ul.link-list{list-style: none; border-left: 10px solid #00944d; margin-left: 0; padding-left: 1.5em;} #content ul.link-list li{margin-bottom: .75em;} #content ul.link-list li a{text-transform: uppercase; font-weight: 600; text-decoration: none;} #content ul.link-list li a::after{ content: "\f0a9"; /* FontAwesome Unicode */ font-family: 'Font Awesome 6 Pro'; display: inline-block; margin-left: .5em; /* width: 1.5em; position: absolute;*/} ol.fancy-list { margin: 0 0 2em .2em !important; counter-reset: li; list-style-type: none; } ol.fancy-list li { position: relative; padding-left: 2em ; font-size: 1.25em; font-weight: 400; line-height: 1.5; margin-bottom: 1em; } ol.fancy-list li:before { content: counter(li); counter-increment: li; height: 1.5em; width: 1.5em; border: 2px solid #0C4E97; border-radius: 50%; text-align: center; position: absolute; left: 0; color:#0C4E97; line-height: 1.3em; } .text-enlarged{font-size: 115%;} .text-enlarged-133{font-size: 110%;} .center{text-align: center;} .bold{font-weight: 700;} .extrabold{font-weight: 800;} .credit{color: #2d2d2d; font-weight: 700; font-size: 12px;} .smalltext{font-size: 12px;} .grey{color:#6f727b;} .centerBtn{text-align:center; display:block; width:100%;} .noPad{padding: 0;} .moreLink{text-transform: uppercase; font-weight: 800;} hr.hr-small-center{width: 90px; margin-left: auto !important; margin-right: auto !important;} .trans-2{-o-transition: all .2s linear; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; transition: all .2s linear;} .circle-center{display: flex; border: 6px solid #94a545; border-radius: 50%; width:100%; justify-content: center; align-items: center;} .circle-center:before{content:""; float: left; padding-top: 100%;} .extra-large-text{} .word-wrap { /* These are technically the same, but use both */ overflow-wrap: break-word; word-wrap: break-word; -ms-word-break: break-all; /* This is the dangerous one in WebKit, as it breaks things wherever */ word-break: break-all; /* Instead use this non-standard one: */ word-break: break-word; } /*-------------------------------------------------------------- 13 Comments --------------------------------------------------------------*/ /*-------------------------------------------------------------- 14 Widgets --------------------------------------------------------------*/ /*-------------------------------------------------------------- 15 Media --------------------------------------------------------------*/ img {vertical-align: middle; max-width:100%; height:auto;} img.size-full{width: 100%; height: auto;} img.alignleft {float:left; display:inline; margin:5px 20px 15px 0; max-width:50%; height:auto;} img.alignright {float:right; display:inline; margin:5px 0 15px 20px; max-width:50%; height:auto;} img.alignnone {margin: 0 0 10px 0; max-width:100%; height:auto;} img.aligncenter {clear: both; display: block; margin: 0 auto 10px; max-width:100%; height:auto;} .wp-caption.alignright{float:right; margin:5px 0 15px 5%; max-width:50%; height:auto;} .wp-caption.alignleft{float:left; margin:5px 5% 15px 0; max-width:50%; height:auto;} .alignright {float: right; margin: 0 0 5px 15px; display:inline;} .alignleft {float: left; margin: 0 15px 5px 0; display:inline;} .center{text-align:center;} .wp-caption.alignright img{ width:100%; height:auto;} p.wp-caption-text {margin:.5em 0 1.8em; font-size:14px; color:#5e6a71;} .wp-caption img{} .wp-caption {margin-bottom:2em; font-size:12px; color:#5e6a71; max-width: 100%;} .wp-caption p{margin-bottom:5px;} /******* Video ******/ .embed-container { position: relative; padding-bottom: 56.25%; overflow: hidden; max-width: 100%; height: auto; margin-bottom: 1.25em; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .embed-holder { position: relative; padding-bottom: 55.25%; overflow: hidden; max-width: 100%; height: auto; margin-bottom: 1.25em; } .embed-holder iframe, .embed-holder object, .embed-holder embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #content .epyt-gallery-title{font-size: 12px;} /*-------------------------------------------------------------- 15.1 Galleries --------------------------------------------------------------*/ /*-------------------------------------------------------------- 16 Media Queries --------------------------------------------------------------*/ /*-------------------------------------------------------------- 16.1 Query sm - Over 576px --------------------------------------------------------------*/ @media only screen and (min-width : 576px) { body, input, select, textarea{} button, .button, .buttonAlt, a.button, input[type="button"], input[type="submit"] {font-size:14px} /*----- Typography -------*/ #page-intro-section h1.page-title, .page-title h1{font-size: 42px;} h1, .intro-large{font-size: 32px;} h2{font-size:30px;} h3{ font-size:28px;} h4{ font-size:26px;} h5{ font-size: 24px;} h6{ font-size:22px;} h2.callout, .background-pattern h2{font-size:36px;} blockquote {font-size: 2rem;} hr{} /************* Buttons **********/ /*------ Header ---------*/ #nav-con-submenu #mega-menu-wrap-max_mega_menu_3 a.mega-menu-link{font-size: 14px !important;} /*------ Sidebar Content --------*/ /*----- Footer -----*/ /*------------ Home Page ---------*/ /**** Hero Section *****/ .home #hero-section h2{font-size: 24px; font-weight: 500; text-transform: none; line-height: 1.1; color:#0b4e95;} .home #hero-section .banner-background{background-size: 60%;} /****** Home Information Section ******/ .home #home-information{font-size: 20px;} /*----- Page Sections ------*/ /***** Intro Banner Section ****/ #page-intro-section h1.page-title, .page-title h1{line-height: 1;} #intro-banner-section button, #intro-banner-section .button, #intro-banner-section .buttonAlt, #intro-banner-section a.button{font-size: 24px;} #page-intro-section .intro-content-section{font-size: 16px;} /******* Event Single *****/ #content .tribe-events-schedule h2{font-size: 30px;} #content .tribe-events-content a{border-bottom: none; color: #00944d;} #content .tribe-events-content a:hover{color:#1d9ad6;} #content .tribe-events-content a.button{color:#fff;} .tribe-common-g-row{display: block;} /****** Accordion ******/ .accordion .card .card-body{padding: 1.75rem 1.75rem;} /***** House Calculator *****/ #house-nav-holder .nav-tabs a.nav-link{font-size: 10px;} #house-nav-holder .nav-tabs a.nav-link i{display: block; font-size: 36px; padding-bottom: 3px;} /*----- MISC ------*/ .smalltext{font-size: 14px;} .text-enlarged-133{font-size: 115%;} .text-enlarged{font-size:120%;} .extra-large-text{font-size: 50px;} #content .epyt-gallery-title{font-size: 14px;} img.alignleft {float:left; display:inline; margin:5px 20px 15px 0; max-width:60%; height:auto;} img.alignright {float:right; display:inline; margin:5px 0 15px 20px; max-width:60%; height:auto;} .wp-caption.alignright{float:right; margin:5px 0 15px 5%; max-width:60%; height:auto;} .wp-caption.alignleft{float:left; margin:5px 5% 15px 0; max-width:60%; height:auto;} } /*-------------------------------------------------------------- 16.2 Query md - Over 768px --------------------------------------------------------------*/ @media only screen and (min-width : 768px) { /*----- Typography -------*/ body, input, select, textarea{} #page-intro-section h1.page-title, .page-title h1{font-size: 54px;} h1, .intro-large{font-size: 38px;} h2{ font-size:36px;} h3{ font-size:32px;} h4{ font-size:28px;} h5{ font-size:26px;} h6{ font-size:23px;} h2.callout, .background-pattern h2{font-size:48px;} #content {} /************* Buttons **********/ button,.button, .buttonAlt, a.button, input[type="button"], input[type="submit"]{font-size: 14px;} /*--- Navigation ---*/ #site-header #mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-item-has-children > a.mega-menu-link > span.mega-indicator{display: none;} /*------ Header ---------*/ /*------ Sidebar Content --------*/ /*----- Footer -----*/ footer h3{font-size: 22px;} /*------------ Home Page ---------*/ /**** Home Navigation *****/ .home #mainNav #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link{text-shadow: 0px 0px 10px #FFFFFF;} .home #mainNav #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item.mega-toggle-on > a.mega-menu-link, .home #mainNav #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link:hover{text-shadow: none;} /**** Banner ****/ .home #site-header{background-color: transparent;} .home #home-conserve h2, .home #home-event h2{font-size: 60px;} /**** Slider Section *****/ #carouselExampleIndicators{margin-top: 0; min-height: 700px;} .home #home-banner, .home #home-banner .container{min-height: 700px;} .home .carousel-item-inside{min-height: 700px;} /****** Home Information Section ******/ .home #home-information{font-size: 21px;} /****** Conserve Section *****/ .home #home-conserve{font-size: 18px; } /*** Home Events ****/ .home #event-space .event-box h3, #event-space .event-box h3{font-size: 24px;} .home #event-space .when, .home #event-space .where, #event-space .when, #event-space .where{ font-size: 18px;} /*----- Interior Pages -------*/ /****** House hold calculator ******/ /**** Tooltips *****/ #house-banner-holder .info-icon a img { width: 40px; } /*----- Page Sections ------*/ /******* Event Single *****/ #content .tribe-events-schedule h2{font-size: 36px;} /*** One Column Calculator ***/ #content .questions h1{border-bottom: 3px solid #EFEFEF; padding-bottom: .25em; } #content .questions p{ font-size: 125%;} /*----- MISC ------*/ .extra-large-text{font-size: 60px;} .text-enlarged{font-size: 135%;} .text-enlarged-133{font-size: 133.333333%;} img.alignleft {float:left; display:inline; margin:5px 20px 15px 0; max-width:65%; height:auto;} img.alignright {float:right; display:inline; margin:5px 0 15px 20px; max-width:65%; height:auto;} .wp-caption.alignright{float:right; margin:5px 0 15px 3%; max-width:65%; height:auto;} .wp-caption.alignleft{float:left; margin:5px 3% 15px 0; max-width:65%; height:auto;} } /*-------------------------------------------------------------- 16.3 Query lg - Over 992px --------------------------------------------------------------*/ @media only screen and (min-width : 992px) { /*----- Typography -------*/ #page-intro-section h1.page-title, .page-title h1{font-size: 66px;} h1{font-size: 42px;} h2{ font-size:36px;} h3{ font-size:30px;} h4{ font-size:24px;} h5{ font-size:28px;} h6{ font-size:23px;} h2.callout, .background-pattern h2{font-size:60px;} /*------ Header ---------*/ /*-------------------------------------------------------------- 12.2 Regular Content --------------------------------------------------------------*/ #content #page-intro-section{padding-top: 102px;} /*------ Sidebar Content --------*/ /*----- Footer -----*/ footer h3{font-size: 32px;} /*------------ Home Page ---------*/ .home #home-conserve h2, .home #home-event h2{font-size: 72px;} /**** Slider Section *****/ #carouselExampleIndicators{margin-top: -5em;} /****** Home Information Section ******/ .home #home-information{font-size: 24px;} /*----- Interior Pages -------*/ /****** House hold calculator ******/ /**** Tooltips *****/ #house-banner-holder .info-icon a img { width: 45px; } #house-nav-holder .nav-tabs a.nav-link{font-size: 14px;} #house-nav-holder .nav-tabs a.nav-link i{display: inline; font-size: 14px;} /*----- Page Sections ------*/ #page-intro-section .intro-content-section{font-size: 18px;} .featured-stories h2{font-size: 40px;} /******* Event Single *****/ #content .tribe-events-schedule h2{font-size: 36px;} /**** News and Stories *****/ #main .wpra-item-grid .wpra-item--1of3{ flex-basis: 33.333333333333%;} /****** Map ********/ .btn.markers{padding-left: .5 !important; } /******** Misc ********/ .text-enlarged{font-size: 150%;} .extra-large-text{font-size: 72px;} } /*-------------------------------------------------------------- 16.4 Query xl - Over 1200px --------------------------------------------------------------*/ @media only screen and (min-width : 1200px) { /*----- Typography -------*/ #page-intro-section h1.page-title, .page-title h1{font-size: 72px;} h1{font-size: 72px;} .page-builder h1{font-size: 48px;} h2 { font-size:48px;} h3{ font-size:40px;} h4{ font-size:36px;} h5{ font-size:24px;} h6{ font-size:24px;} h2.callout, .background-pattern h2{font-size:72px;} /*------ Header ---------*/ /*------ Sidebar Content --------*/ /*----- Footer -----*/ footer h3{font-size: 36px;} /*------------ Home Page ---------*/ .home a.info-link-box .info-text{font-size: 13px;} /*----- Interior Pages -------*/ #house-nav-holder .nav-tabs a.nav-link{font-size: 16px;} #house-nav-holder .nav-tabs a.nav-link i{font-size: 16px;} /*----- Page Sections ------*/ #intro-banner-section .intro-content{font-size: 18px;} /******* Event Single *****/ #content .tribe-events-schedule h2{font-size: 28px;} } /*-------------------------------------------------------------- 16.4 Query xxl - Over 1400px --------------------------------------------------------------*/ @media only screen and (min-width : 1400px) { /*----- Typography -------*/ h1{} h2{} h3{} h4{} h5{} h6{} /*------ Header ---------*/ /*------ Sidebar Content --------*/ /*----- Footer -----*/ /*------------ Home Page ---------*/ .home a.info-link-box .info-text{font-size: 14px;} /*----- Interior Pages -------*/ /*----- Page Sections ------*/ } /*-------------------------------------------------------------- 17 Print --------------------------------------------------------------*/ /* ========================================================================== Print styles. Inlined to avoid the additional HTTP request: http://www.phpied.com/delay-loading-your-print-css/ ========================================================================== */ @media print { *, *:before, *:after, *:first-letter, *:first-line { background: transparent !important; color: #000 !important; /* Black prints faster: http://www.sanbeiji.com/archives/953 */ box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links that are fragment identifiers, * or use the `javascript:` pseudo protocol */ a[href^="#"]:after, a[href^="javascript:"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } /* * Printing Tables: * http://css-discuss.incutio.com/wiki/Printing_Tables */ thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } }