/***********************************************/ /* CSS @imports must be at the top of the file */ /* Add them above this section */ /***********************************************/ @import url("https://use.typekit.net/oew6vlf.css"); /****************************************/ /* HubSpot Style Boilerplate */ /****************************************/ /* These includes are optional, but helpful. */ /* Images */ img { max-width: 100%; border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom; /* Suppress the space beneath the baseline */ } /* Videos */ video { max-width: 100%; height: auto; } /* Embed Container (iFrame, Object, Embed) */ .hs-responsive-embed { position: relative; height: auto; overflow: hidden; padding-top: 0; padding-left: 0; padding-right: 0; } .hs-responsive-embed iframe, .hs-responsive-embed object, .hs-responsive-embed embed { width: 100%; height: 100%; border: 0; } .hs-responsive-embed, .hs-responsive-embed.hs-responsive-embed-youtube, .hs-responsive-embed.hs-responsive-embed-wistia, .hs-responsive-embed.hs-responsive-embed-vimeo { padding-bottom: 2%; } .hs-responsive-embed.hs-responsive-embed-instagram { padding-bottom: 116.01%; } .hs-responsive-embed.hs-responsive-embed-pinterest { height: auto; overflow: visible; padding: 0; } .hs-responsive-embed.hs-responsive-embed-pinterest iframe { position: static; width: auto; height: auto; } iframe[src^="http://www.slideshare.net/slideshow/embed_code/"] { width: 100%; max-width: 100%; } @media (max-width: 568px) { iframe { max-width: 100%; } } /* Forms */ textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], select { padding: 6px; display: inline-block; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Menus */ .hs-menu-wrapper ul { padding: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: inline-block; margin-bottom: 20px; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { display: inline-block; padding: 10px 20px; white-space: nowrap; max-width: 140px; overflow: hidden; text-overflow: ellipsis; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; left: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { display: block; white-space: nowrap; width: 140px; overflow: hidden; text-overflow: ellipsis; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li.hs-item-has-children ul.hs-menu-children-wrapper { left: 180px; top: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } .row-fluid-wrapper:last-child .hs-menu-wrapper.hs-menu-flow-horizontal > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch { position: relative; margin-bottom: 20px; min-height: 7em; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children { position: static; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: none; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: inline-block; padding: 10px 20px; white-space: nowrap; max-width: 140px; width: auto; overflow: hidden; text-overflow: ellipsis; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-vertical { width: 100%; } .hs-menu-wrapper.hs-menu-flow-vertical ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-vertical li a { display: block; white-space: nowrap; width: 140px; overflow: hidden; text-overflow: ellipsis; } .hs-menu-wrapper.hs-menu-flow-vertical > ul { margin-bottom: 20px; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-menu-depth-1 > a { width: auto; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li a { padding: 10px 20px; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; top: 0; left: 180px; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li a { min-width: 140px; width: auto; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul { max-width: 100%; overflow: hidden; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: none; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li.hs-item-has-children > ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; position: static; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-2 > a { padding-left: 4em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-3 > a { padding-left: 6em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-4 > a { padding-left: 8em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-5 > a { padding-left: 140px; } .hs-menu-wrapper.hs-menu-not-show-active-branch li.hs-menu-depth-1 ul { box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); } @media (max-width: 568px) { .hs-menu-wrapper, .hs-menu-wrapper * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; } .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a, .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: block; max-width: 100%; width: 100%; } } .hs-menu-wrapper.hs-menu-flow-vertical.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-horizontal.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: visible; opacity: 1; } /* Space Module */ .widget-type-space { visibility: hidden; } /* Blog Author Section */ .hs-author-listing-header { margin: 0 0 .75em 0; } .hs-author-social-links { display: inline-block; } .hs-author-social-links a.hs-author-social-link { width: 24px; height: 24px; border-width: 0px; border: 0px; line-height: 24px; background-size: 24px 24px; background-repeat: no-repeat; display: inline-block; text-indent: -99999px; } .hs-author-social-links a.hs-author-social-link.hs-social-facebook { background-image: url("//static.hubspot.com/final/img/common/icons/social/facebook-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-linkedin { background-image: url("//static.hubspot.com/final/img/common/icons/social/linkedin-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-twitter { background-image: url("//static.hubspot.com/final/img/common/icons/social/twitter-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-google-plus { background-image: url("//static.hubspot.com/final/img/common/icons/social/googleplus-24x24.png"); } /* * jQuery FlexSlider v2.0 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the GPLv2 license. * http://www.gnu.org/licenses/gpl-2.0.html * * Contributing author: Tyler Smith (@mbmufffin) */ /* Wrapper */ .hs_cos_wrapper_type_image_slider { display: block; overflow: hidden } /* Browser Resets */ .hs_cos_flex-container a:active, .hs_cos_flex-slider a:active, .hs_cos_flex-container a:focus, .hs_cos_flex-slider a:focus {outline: none;} .hs_cos_flex-slides, .hs_cos_flex-control-nav, .hs_cos_flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .hs_cos_flex-slider {margin: 0; padding: 0;} .hs_cos_flex-slider .hs_cos_flex-slides > li {display: none; -webkit-backface-visibility: hidden; position: relative;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .hs_cos_flex-slider .hs_cos_flex-slides img {width: 100%; display: block; border-radius: 0px;} .hs_cos_flex-pauseplay span {text-transform: capitalize;} /* Clearfix for the .hs_cos_flex-slides element */ .hs_cos_flex-slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .hs_cos_flex-slides {display: block;} * html .hs_cos_flex-slides {height: 1%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ /* FlexSlider Default Theme *********************************/ .hs_cos_flex-slider {margin: 0 0 60px; background: #fff; border: 0; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; zoom: 1;} .hs_cos_flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;} .loading .hs_cos_flex-viewport {max-height: 300px;} .hs_cos_flex-slider .hs_cos_flex-slides {zoom: 1;} .carousel li {margin-right: 5px} /* Direction Nav */ .hs_cos_flex-direction-nav {*height: 0;} .hs_cos_flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(//static.hsappstatic.net/content_shared_assets/static-1.3935/img/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;} .hs_cos_flex-direction-nav .hs_cos_flex-next {background-position: 100% 0; right: -36px; } .hs_cos_flex-direction-nav .hs_cos_flex-prev {left: -36px;} .hs_cos_flex-slider:hover .hs_cos_flex-next {opacity: 0.8; right: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-prev {opacity: 0.8; left: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-next:hover, .hs_cos_flex-slider:hover .hs_cos_flex-prev:hover {opacity: 1;} .hs_cos_flex-direction-nav .hs_cos_flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;} /* Direction Nav for the Thumbnail Carousel */ .hs_cos_flex_thumbnavs-direction-nav { margin: 0px; padding: 0px; list-style: none; } .hs_cos_flex_thumbnavs-direction-nav {*height: 0;} .hs_cos_flex_thumbnavs-direction-nav a {width: 30px; height: 140px; margin: -60px 0 0; display: block; background: url(//static.hsappstatic.net/content_shared_assets/static-1.3935/img/bg_direction_nav.png) no-repeat 0 40%; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 1; -webkit-transition: all .3s ease;} .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-next {background-position: 100% 40%; right: 0px; } .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-prev {left: 0px;} .hs-cos-flex-slider-control-panel img { cursor: pointer; } .hs-cos-flex-slider-control-panel img:hover { opacity:.8; } .hs-cos-flex-slider-control-panel { margin-top: -30px; } /* Control Nav */ .hs_cos_flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;} .hs_cos_flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .hs_cos_flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);} .hs_cos_flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); } .hs_cos_flex-control-paging li a.hs_cos_flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; } .hs_cos_flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;} .hs_cos_flex-control-thumbs li {width: 25%; float: left; margin: 0;} .hs_cos_flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;} .hs_cos_flex-control-thumbs img:hover {opacity: 1;} .hs_cos_flex-control-thumbs .hs_cos_flex-active {opacity: 1; cursor: default;} @media screen and (max-width: 860px) { .hs_cos_flex-direction-nav .hs_cos_flex-prev {opacity: 1; left: 0;} .hs_cos_flex-direction-nav .hs_cos_flex-next {opacity: 1; right: 0;} } .hs_cos_flex-slider .caption { background-color: rgba(0,0,0,0.5); position: absolute; font-size: 2em; line-height: 1.1em; color: white; padding: 0px 5% 0px 5%; width: 100%; bottom: 0; text-align: center; } .hs_cos_flex-slider .superimpose .caption { color: white; font-size: 3em; line-height: 1.1em; position: absolute; padding: 0px 5% 0px 5%; width: 90%; top: 40%; text-align: center; background-color: transparent; } @media all and (max-width: 400px) { .hs_cos_flex-slider .superimpose .caption { background-color: black; position: static; font-size: 2em; line-height: 1.1em; color: white; width: 90%; padding: 0px 5% 0px 5%; top: 40%; text-align: center; } /* beat recaptcha into being responsive, !importants and specificity are necessary */ #recaptcha_area table#recaptcha_table {width: 300px !important;} #recaptcha_area table#recaptcha_table .recaptcha_r1_c1 {width: 300px !important;} #recaptcha_area table#recaptcha_table .recaptcha_r4_c4 { width: 67px !important;} #recaptcha_area table#recaptcha_table #recaptcha_image {width:280px !important;} } .hs_cos_flex-slider h1, .hs_cos_flex-slider h2, .hs_cos_flex-slider h3, .hs_cos_flex-slider h4, .hs_cos_flex-slider h5, .hs_cos_flex-slider h6, .hs_cos_flex-slider p { color: white; } /* Thumbnail only version of the gallery */ .hs-gallery-thumbnails li { display: inline-block; margin: 0px; padding: 0px; margin-right:-4px; } .hs-gallery-thumbnails.fixed-height li img { max-height: 150px; margin: 0px; padding: 0px; border-width: 0px; } /* responsive pre elements */ pre { overflow-x: auto; } /* responsive pre tables */ table pre { white-space: pre-wrap; } /* adding minimal spacing for blog comments */ .comment { margin: 10px 0 10px 0; } /* make sure lines with no whitespace don't interefere with layout */ .hs_cos_wrapper_type_rich_text, .hs_cos_wrapper_type_text, .hs_cos_wrapper_type_header, .hs_cos_wrapper_type_section_header, .hs_cos_wrapper_type_raw_html, .hs_cos_wrapper_type_raw_jinja, .hs_cos_wrapper_type_page_footer { word-wrap: break-word; } /* HTML 5 Reset */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } /* Support migrations from wordpress */ .wp-float-left { float: left; margin: 0 20px 20px 0; } .wp-float-right { float: right; margin: 0 0 20px 20px; } /* Responsive Google Maps */ #map_canvas img, .google-maps img { max-width: none; } /* line height fix for reCaptcha theme */ #recaptcha_table td {line-height: 0;} .recaptchatable #recaptcha_response_field {min-height: 0;line-height: 12px;} /*****************************************/ /* Start your style declarations here */ /*****************************************/ html, body { margin: 0 auto; } body { font-size: 18px; font-weight: 300; line-height: 1.65; color: #8f8f93; font-family: "museo-slab",serif; } h1,h2, h3, h4, h5, h6 { color: #084674; /* dark blue color */ font-family: "alternate-gothic-no-2-d",sans-serif !important; line-height: 1.35; font-weight: 400 !important; text-transform: uppercase; margin: 0 0 10px 0; } h1 { font-size: 3.5em; } h2 { font-size: 3em; } h3 { font-size: 2.5em; } h4 { font-size: 2.25em; } h5 { font-size: 2em; } h6 { font-size: 1.75em; } strong { font-weight: 500; color: #666668; } img { max-width: 100%; } ul { list-style-type: disc; } input submit { } /* Links * ========================================================================== */ a { color: #084674; text-decoration: none; } a:hover { } .fa:hover { color: #8f8f93; } /* Transitions * ========================================================================== */ a, button, input:focus, input[type="button"], input[type="reset"], input[type="submit"], textarea:focus, .button, .button:after, .button:before, .portfolio-entry-index { -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } /* Grid | Columns -------------------------------------------------------------------------- */ @media only screen and (min-width: 800px) { .grid, [class*="grid-"], .equal-heights > * { display: flex; flex-wrap: wrap; } .grid > *, [class*="grid-"] > * { align-self: stretch; } .equal-heights > * > * { align-self: stretch; flex-grow: 1; width: 100%; } .five-sixths, .four-sixths, .four-fifths, .one-fifth, .one-fourth, .footer-widgets .widget-area, .one-half, .one-sixth, .one-third, .three-fourths, .three-fifths, .three-sixths, .two-fourths, .two-fifths, .two-sixths, .two-thirds { float: left; margin-left: 3.448275862069%; } .one-half, .three-sixths, .two-fourths { width: 48.275862068966%; } .one-third, .two-sixths, .footer-widgets .widget-area { width: 31.034482758621%; } .four-sixths, .two-thirds { width: 65.51724137931%; } .one-fourth { width: 22.413793103448%; } .three-fourths { width: 74.137931034483%; } .one-fifth { width: 17.241379310345%; } .two-fifths { width: 37.931034482759%; } .three-fifths { width: 58.620689655172%; } .four-fifths { width: 79.310344827586%; } .one-sixth { width: 13.793103448276%; } .five-sixths { width: 82.758620689655%; } .first, .footer-widgets .widget-area:first-child { clear: both; margin-left: 0; } .only { float: none; margin: 0 auto; } } /* BEGIN ... * Internal Page Headers ========================================================================================= */ /* Internal Headers Product Pages */ /* PRODUCTS PAGE ========================================= */ .hs-content-name-products .hero-image-seating { background: url('https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/Gym%20Lake%20Central.jpg') center ; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* OUTDOOR SEATING PAGE ========================================= */ .hs-content-name-outdoor-seating .hero-image-products { /*background: url('https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/CCath%20Feature-1.jpg') center;*/ /* background: url('https://www.toadvine.com/hubfs/Outdoor%20Seating.jpg');*/ background: url('https://www.toadvine.com/hubfs/Outdoor%20seating%20hero.jpg') center; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* INDOOR SEATING PAGE ========================================= */ .hs-content-name-indoor-seating .hero-image-seating { /*background: url('https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/Trine%20Main%20View-1.jpg') center ;*/ background: url('https://www.toadvine.com/hubfs/Indoor%20Seating%20Hero-1.jpg') center; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* GYM EQUIPMENT PAGE ========================================= */ .hs-content-name-gym-equipment .hero-image-products { /*background: url('https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/Warren%20Co%20Parks%20Web%203-1.jpg') center ;*/ background: url('https://www.toadvine.com/hubfs/Gym%20Equipment.jpg') center; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* SCOREBOARDS PAGE ========================================= */ .hs-content-name-scoreboards .hero-image-seating { /*background: url('https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/Nevco%20Website.jpg') top center;*/ background: url('https://www.toadvine.com/hubfs/Scoreboards.jpg') center; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* SERVICES PAGE ========================================= */ .hs-content-name-services .hero-image-seating { background: url('https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/Gym%20Union%20College.jpg') center ; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* OUTDOOR EQUIPMENT PAGE ========================================= */ .hs-content-name-outdoor-equipment .hero-image-seating { /*background: url(https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/Outdoor%20Equipment%201.jpg) center ;*/ background: url('https://www.toadvine.com/hubfs/Outdoor%20Equipment-1.jpg') center; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* ... END * Internal Headers Product Pages ========================================================================================= */ .hero-image-products { background: url('//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/new_images/Allen_County_High_School_Gymnasium.jpg') center top; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } .hero-image-indoor-equipment { background: url('//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/new_images/Hillsboro_Elementary_2.jpg') center ; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } .hero-image-outdoor-equipment { background: url('//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/new_images/1_1.jpg') center ; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } .hero-image-scoreboards { background: url('//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/images/scoreboard_header_image.jpg') center no-repeat; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } .hero-image-maintenance { background: url('//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/new_images/Metcalfe_County_Primary_Center_1.jpg') center no-repeat; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } /* Header */ .header-wrapper { background: #fff; padding: 0 0 10px 0; box-shadow: 0 0 10px #555; border-bottom: 1px solid #777; position: relative; } .custom-header { max-width: 1200px; margin: 0 auto !important; float: none !important; padding: 0 20px; } .custom-logo { margin-top: -36px; } .custom-logo img { max-width: 215px; } .courtesty-links { } ul.courtesy-nav { width: 95%; float: right; text-align: right; text-transform: uppercase; font-size: 14px !important; } .courtesy-nav li { list-style-type: none; display: inline-block; margin: 0 20px; } .courtesy-nav li.phone { margin: 0 20px 0 0; } .courtesy-nav a { color: #747474; font-weight: 900; letter-spacing: 1px; } .courtesy-nav li.phone a { color: #084674 !important; font-size: 18px; font-weight: normal !important; } .courtesy-nav a:hover { border-bottom: 3px solid #747474; border-top: 3px solid #747474; } .custom-menu-primary { text-align: right; font-size: 15px !important; letter-spacing: 1px; text-transform: uppercase; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; list-style-type: none; margin-top: 15px !important; } .hs-content-name-home-2017-development .header-wrapper { padding: 0; } .custom-menu-primary > ul li a { overflow: hidden; font-weight: 900 !important; text-decoration: none; text-overflow: ellipsis; } .custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { font-weight: 900 !important; max-width: 200px !important; text-align: left; } .custom-menu-primary .hs-menu-depth-1 > .hs-menu-children-wrapper { display: flex; } .custom-menu-primary .hs-menu-depth-1:nth-of-type(3) > .hs-menu-children-wrapper { display: block !important; } .custom-menu-primary .hs-menu-item.hs-menu-depth-1 > a:hover, .hs-menu-item .hs-menu-depth-1 .active .active-branch { background-color:#084674 !important; color: #fff !important; text-shadow: 0px 2px 3px #555 !important; } @media only screen and (min-width: 767px) { .custom-menu-primary .hs-menu-depth-1 > ul.hs-menu-children-wrapper { background: rgba(8, 70 ,116, .9); left: -300px !important; top: 45px !important; margin-top: 14px; font-family: "alternate-gothic-no-2-d",sans-serif; } .custom-menu-primary .hs-menu-depth-1:nth-of-type(3) > .hs-menu-children-wrapper { left: 0 !important; } .custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal.no-flyouts > ul li.hs-menu-item.hs-menu-depth-1 ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; } .custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal.no-flyouts > ul li.hs-menu-item.hs-menu-depth-1:hover ul.hs-menu-children-wrapper { visibility: visible; opacity: 1; } .custom-menu-primary .hs-menu-children-wrapper a { color: #fff !important; } .custom-menu-primary .hs-menu-children-wrapper { left: 0 !important; top: initial !important; } .custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { overflow: visible; max-width: 100%; width: auto !important; } .custom-menu-primary .hs-menu-item.hs-menu-depth-3 a { text-align: left !important; padding: 2px 25px !important; } .custom-menu-primary li.hs-menu-depth-2 > a { border-bottom: 1px solid #fff; font-size: 20px; padding: 30px 25px 10px !important; } .custom-menu-primary li.hs-menu-depth-2 .hs-menu-children-wrapper { margin: 20px 0 50px; } .custom-menu-primary .hs-menu-depth-2 > ul.hs-menu-children-wrapper { position: relative !important; } } .scripts-box { height: 0 !important; margin-top: -28px !important; } /* Home Page */ .hero-wrapper { background: url('https://14855.fs1.hubspotusercontent-na1.net/hubfs/14855/images/hero-rev-4.jpg') no-repeat; background-size: cover; background-position: center center; } .hero-wrapper .flex { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; text-align: center; max-width: 80%; margin: 0 auto; } .hero-wrapper .flex span { background: rgba(0,0,0,.6); padding: 5px 50px; font-size: 20px; } .hero-wrapper .flex i { font-size: 14px; } .hero { margin: 0 auto !important; float: none !important; max-width: 1000px; padding: 14% 0; } .hero-text { font-family: "alternate-gothic-no-2-d",sans-serif; text-transform: uppercase; color: #fff; } .hero-text span.hero-headline { font-size: 60px; font-weight: 400; letter-spacing: 0; text-align: center; background: rgba(0,0,0,.6); padding: 15px 50px; line-height: 1; display: block; float: none; margin-bottom: 5px; } .hero-text span.hero-sub-headline { display: inline-block; padding: 5px 40px 3px; background: rgba(0,0,0,.5); font-size: 20px; margin-right: 20px; } .hero-text a { display: inline-block; background: #084674; color: #fff; padding: 5px 40px 3px; border: 1px solid #fff; } .hero-text a:hover { background: #fff; color: #084674; border: 1px solid #fff; } .hero-cta { text-align: center; max-width: 800px; float:none; margin: 0 auto; display: block; } .cta-gallery { -webkit-transition: all 300ms ease-out; -moz-transition: all 300ms ease-out; -o-transition: all 300ms ease-out; -ms-transition: all 300ms ease-out; transition: all 300ms ease-out; padding: 20px; text-align:center; } @media screen and (max-width: 767px) { .hero-wrapper .flex > * { width: 100%; padding-right: 0; padding-left: 0; margin: 0 0 10px; } } /*Homepage 2024*/ .hero-2024 .splide__slide, .hero-2024 .splide__slide--image, .hero-2024 .splide__slide--image_caption__wrapper{ width:100%; height:700px; } .hero-2024 .splide__slide--image{ opacity:.5; } .hero-2024 .splide__slide--image_caption__wrapper{ background:black; } .hero-wrapper.hide{ display:none; } .maintenance-wrapper.need-equip.hero-cta-2024{ margin-top:-450px; position:relative; z-index:3; padding:2rem; background:none; } .span12.widget-span.widget-type-cell.hero-cta-wrapper-2024{ display:flex; align-items:center; justify-content:center; } .maintenance-wrapper.need-equip.hero-cta-2024 .cta-learn-more{ text-align:center; } .maintenance-wrapper.need-equip.hero-cta-2024 h2{ font-size:38px; } /* Maintenance CTA on Homepage ======================================================================================= */ .hs-content-name-home-2017-development .row-fluid-wrapper.row-depth-1.row-number-6 .row-fluid, .hs-content-name-home-2017-development .row-fluid-wrapper.row-depth-1.row-number-7 > .row-fluid { display: flex; align-items: center; flex-wrap: wrap; } .maintenance-wrapper { background-color: #084674; padding: 0; } .maintenance-wrapper.need-equip h2 { font-size: 24px; } .maintenance { margin: 0 auto !important; float: none !important; max-width: 1200px; } .maintenance-text h2 { color: #fff; margin: 17px 0 !important; padding: 0 !important; text-align: right; text-transform: uppercase; letter-spacing: 2px; line-height: 1; } .maintenance-wrapper .cta-learn-more { padding: 10px 30px; text-align: left; } .maintenance-wrapper .cta-learn-more span { font-family: "alternate-gothic-no-2-d",sans-serif !important; text-shadow: none; line-height: 1 !important; font-weight: 400 !important; } .maintenance-wrapper .cta-learn-more .cta_button:hover span { color: #084674 !important; } .maintenance-button .button { margin: 20px 0 0 0; color: #084674; background: #fff; text-transform: uppercase; text-align: center; max-width: 130px; height: auto; box-shadow: 1px 2px 2px #555555; padding: 5px; } .maintenance-button .button a { font-size: 18px; } .maintenance-button .button:hover { background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)); background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)); background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)); -webkit-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2); box-shadow: 1px 2px 2px; } .cta-maintenance { padding: 15px; } @media screen and (max-width: 767px) { .maintenance-wrapper .cta-learn-more { padding: 0; margin: 0 auto; width: 70%; text-align: center !important; } .maintenance-wrapper .cta-learn-more .cta_button { width: 100%; margin-bottom: 50px; padding-left: 0 !important; padding-right: 0 !important; } } /* Services Listing on Homepage ======================================================================================= */ .services-wrapper { margin: 0 auto; padding: 30px 0; background: rgba(255,255,255,1); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); } .services { margin: 0 auto !important; float: none !important; max-width: 1200px; } .services img { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .service-listing-wrapper h2, .service-listing-wrapper p { text-align: center; text-transform: uppercase; } .service-listing-wrapper h2 { margin-bottom: 0 !important; line-height: 1 !important; font-size: 27px; text-align: center; text-transform: uppercase; } .service-listing-wrapper p { margin-top: 10px !important; text-align: center; text-transform: uppercase; font-family: "museo-slab",serif; letter-spacing: 1px; padding-bottom: 10px; } /* Homepage Custom CTAs ======================================================================================= */ .custom-cta-wrapper { padding: 40px 0; } .custom-cta { padding: 10px 20px; text-align: center; } .sidebar-custom-cta { max-width: 90%; margin: 0 auto !important; float: none !important; text-align: center; padding: 30px 0; } .circle-image { text-align: center; } .circle-image img { border-radius: 50%; border: 3px solid #084674; -webkit-box-shadow: 0 0 10px #8f8f93; box-shadow: 0 0 10px #8f8f93; z-index: 2; position: relative; max-width: 70px; float: none !important; margin: 0 auto !important; } .circle-image img:hover { transition: opacity 0.3s ease, transform 0.3s ease; -moz-transition: opacity 0.3s ease, -moz-transform 0.3s ease ; -webkit-transition: opacity 0.3s ease , -webkit-transform 0.3s ease; transform: translateY(-10px); -moz-transform: translateY(-10px); -webkit-transform: translateY(-10px); } .cta-background img { margin-top: -50px; z-index: 1; position: relative; -webkit-box-shadow: 0 0 10px #8f8f93; box-shadow: 0 0 10px #8f8f93; } .cta-headline h5 { color: #fff; text-align: center; text-transform: uppercase; font-size: 13px; margin: 0 auto; margin-top: -23px; z-index: 3; position: relative; } /* Homepage Newsletter SignUp ======================================================================================= */ .newsletter-wrapper { background-color: #ccc; display: none !important; } .newsletter { max-width: 1200px margin 0 auto !important; float: none !important; } .newsletter-text h4 { text-transform: uppercase; color: #000 !important; text-align: center; font-size: 16px; font-weight: 600; letter-spacing: 1px; float:right; padding-top: 5px; } .newsletter-form .hs_email { width: 35% !important; float: left; } .newsletter-form .hs_submit { max-width: 35% !important; float: left; margin: 0 20px; } .newsletter-form .hs_submit .hs-button { max-width: 100%; height: 32px; margin: 0; font-size: 13px; padding: 6px 0 !important; } .newsletter-form .hs_submit .hs-button:hover { cursor: pointer !important; } .newsletter-form .hs-form-required { display: none !important; } .newsletter-box .submit-button:hover { background-color: #165f95; -webkit-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2); } /* Homepage Hero 2 (Work Gallery) ======================================================================================= */ .hero-wrapper-2 { /*background-image: url('https://www.toadvine.com/hubfs/ourwork-bg.jpg');*/ background-image: url('https://www.toadvine.com/hubfs/Home-page-portfolio.jpg'); background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: center center; padding: 15% 0; } .hero-2 { max-width: 1200px; margin: 0 auto !important; float: none !important; padding: 3em 1em; } .hero-2 .span4.widget-span.widget-type-raw_html { text-align: center; } .hero-2 .more-link { text-align: center; color: #fff; border: 1px solid #fff; padding: 5px 30px; transition: .3s ease all; font-family: "alternate-gothic-no-2-d",sans-serif; } .hero-2 .more-link:hover { background: #fff; color: #084674; transition: .3s ease all; } .hero-text-2 h1 { font-size: 64px; color: #fff; font-weight: 600; text-transform: uppercase; text-align: center; text-shadow: 5px 5px 10px #222; } .view-all-button h2 { text-align:center; border: 3px solid #fff; padding: 10px; text-transform: uppercase; line-height: 1em; color: #fff; text-shadow: 2px 2px 10px #222; } .view-all-button h2:hover { background-color: #fff; color:#084674; } /* Why Toadvine Section ======================================================================================= */ .why-toadvine { padding: 5% 0; text-align: center; background: url(https://www.toadvine.com/hubfs/whytoadvine-bg.jpg) no-repeat center center; background-size: cover; } .why-toadvine > .row-fluid-wrapper { max-width: 900px; margin: 0 auto; } .why-toadvine .questions-cntr { padding: 50px 0; } .questions-cntr h4 { text-align: center; } .why-toadvine p, .about-team p { font-size: 16px; } .why-toadvine p { color: #084674; text-align: center; font-size: 19px; } .why-toadvine h4 { margin: 0 0 10px; line-height: 1; font-size: 32px; } /* Homepage About Team Section ======================================================================================= */ .about-team-wrapper { padding: 50px 0; background: rgba(255,255,255,1); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); } .about-team { max-width: 1200px; margin: 0 auto !important; float: none !important; text-align: center; } .about-team .cell-wrapper.layout-widget-wrapper { max-width: 650px; margin: 0 auto; } .about-team .row-fluid-wrapper.row-depth-2.row-number-1 { max-width: 800px; margin: 0 auto; } .about-team .read-more-cntr { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding: 50px 0 30px; } .why-toadvine .more-link, .about-team .read-more-cntr .more-link { font-family: "alternate-gothic-no-2-d",sans-serif; border: 1px solid #084674; text-align: center; padding: 5px 30px; letter-spacing: 3px; transition: .3s ease all; line-height: 1; } .why-toadvine .more-link:hover, .about-team .read-more-cntr .more-link:hover { background: #084674; color: #fff; transition: .3s ease all; } .why-toadvine .more-link { text-align: center; display: block; width: 25%; margin: 0 auto; float: none; } .about-team-left { padding: 0 10px; } .about-image { padding-top: 20px; } .about-text h1 { text-align: center; color: #084674; } .about-text p { color: #084674; font-family: "museo-slab",serif; } .read-more-link a { color: #084674; } .read-more-link a:hover { color: #333; border-bottom: 1px dotted #000; } .team-text h1 { padding-top: 30px; color: #084674; } .team-text p { color: #8f8f93; font-family: "museo-slab",serif; } .team-home { text-align: center; font-size: 15px; color: #8f8f93; } .team-home h3 { font-size: 34px; margin-bottom: 0 !important; text-transform: uppercase; margin-top: 10px; } .team-home h5 { font-size: 24px; color: #8f8f93; margin: 0 !important; } .team h3, .team h5 { text-align: center; text-transform: uppercase; } .team-home .fa { font-size: 24px; font-weight: normal !important; } .team-home a { font-weight: normal !important; } .team-home img { margin: 20px 0 0 0; width: 200px; height: 200px; border-radius: 50%; } @media screen and (max-width: 767px) { .about-team .read-more-cntr > *{ width: 100%; margin-bottom: 10px; } } /* Homepage Social Section ======================================================================================= */ .social-media-wrapper { background-color: #1b4670; padding: 12px 0; } .social-media { margin: 0 auto !important; float: none !important; max-width: 1200px; text-align: center; } .social-icons { text-align: center; } .social-icons .fa { color: #1b4670; background-color: #fff; margin: 20px 20px; position: center; cursor: pointer; width: 50px; height: 50px; border-radius: 25px; font-size: 25px; font-weight: normal; line-height: 2em; -moz-border-radius:25px; -webkit-border-radius:25px; -webkit-transition: all ease 0.3s; -moz-transition: all ease 0.3s; -o-transition: all ease 0.3s; -ms-transition: all ease 0.3s; transition: all ease 0.3s; } .social-icons .fa:hover { box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.8); -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg); -ms-transform:rotate(360deg); transform: rotate(360deg); } /* Contact Section ======================================================================================= */ .contact-footer-wrapper { padding: 10px 0; background: #eee; } .contact { max-width: 1200px; margin: 0 auto !important; float: none !important; padding: 0 20px; } .contact-text { padding: 30px 0; } .contact-text p { padding-right: 15px; } .contact-footer-wrapper h2 { color: #084674; text-transform: uppercase; } .contact-form { padding-bottom: 3em; } .contact-form .hs-form-field label { color: #8f8f93; font-size: 14px; } .contact-form textarea { height: 110px; } .hs_submit .hs-button { margin-top: 30px; width: 160px; height: 50px; background: #fff; color: #000; border: 2px solid #7f7f7f; text-transform: uppercase; font-family: "museo-slab",serif; cursor: pointer; } .installation-image2 { background:url('//cdn2.hubspot.net/hub/14855/file-2616174086-jpg/images/stock-photo-electrician-peeling-off-insulation-from-wires-closeup-on-hands-and-pliers-118429402.jpg') no-repeat; width: 305px; height: 180px; border: 3px solid #8f8f93; } .lockers-image { background:url('//14855.fs1.hubspotusercontent-na1.net/hub/14855/file-2634659371-png/lockers_image.png') no-repeat; width: 305px; height: 180px; border: 3px solid #8f8f93; } .portable-bleachers-image { background:url('//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/bleacher.png'); background-repeat:no-repeat; width: 305px; height: 180px; border: 3px solid #8f8f93; } .portable-bleachers-image:hover .overlay { opacity: 0.7; } .seating-image .overlay, .scoreboards-image .overlay, .gym-image .overlay, .maintenance-image .overlay, .outdoor-image .overlay, .track-image .overlay, .installation-image2 .overlay, .lockers-image .overlay, .track-image .overlay, .installation-image2 .overlay, .portable-bleachers-image .overlay{ background-color:#084674; margin-top: -19px; opacity:0; width:305px; height:180px; opacity:0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .seating-image:hover .overlay { opacity: 0.7; } .scoreboards-image:hover .overlay { opacity:0.7; } .gym-image:hover .overlay { opacity:0.7; } .maintenance-image:hover .overlay { opacity:0.7; } .outdoor-image:hover .overlay { opacity:0.7; } .track-image:hover .overlay { opacity:0.7; } .installation-image2:hover .overlay { opacity:0.7; } .lockers-image:hover .overlay { opacity:0.7; } .caption { color: #fff; -webkit-transition: all 300ms ease-out; -moz-transition: all 300ms ease-out; -o-transition: all 300ms ease-out; -ms-transition: all 300ms ease-out; transition: all 300ms ease-out; } .overlay .simple-caption h3 a { display: block; } .simple-caption h3 a { text-align: center; color: #fff; padding-top: 80px; font-size: 40px; } /* Internal Pages & Landing Pages ======================================================================================= */ .page-wrapper { background: #fff; } .page-content-full-width { max-width: 1200px; margin: 0 auto !important; float: none !important; padding: 0 20px; } .page-content { max-width: 1200px; margin: 0 auto !important; float: none !important; padding: 40px 20px; background: none !important; } .page-header { font-family: "alternate-gothic-no-2-d",sans-serif; line-height: 1.2em; } .page-subheader { max-width: 1200px; margin: 0 auto !important; float: none !important; } .cta_button { font-size: 24px; background-color: #fff; } .cta_button2 { font-size: 24px; } .image-slider { max-width: 600px; height:400px; } .page-header h1 { line-height: 130%; color: #084674; text-align: center; padding-top:10px; margin-bottom: 30px; } .blog-header h1 { line-height: 130%; color: #084674; text-align: center; margin-bottom: 30px !important; border-bottom: 1px dashed #084674 ; } .page-header h3 { text-align:center; padding: 0 50px; margin-bottom: 30px; } .main-content-wrapper .page-header h1 { } .main-content-wrapper { margin-bottom: 20px; } .left-sidebar { margin-top: 50px; margin-bottom: 20px; background-color: #eee; padding: 30px 20px; max-width: 100%; } .left-sidebar h3 { } .left-sidebar-header h2 { } .left-content { text-align: left; } .left-content li a { } .left-content li a:hover { border-bottom: 1px solid #787878; } .left-main-content-wrapper .left-page-header h1 { padding-left: 50px; } .left-main-content-wrapper { padding: 0px 0 20px 0; border-right: 2px dotted #084674; padding-right: 20px; background: rgba(255,255,255,1); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); } .left-main-content { color: #5a5656; } .right-sidebar { padding: 20px; border-left: 2px dotted #084674; background-color: #084674; box-shadow: 0 0 8px rgba(0, 0, 0, .8); -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); color: #fff; } .right-sidebar-form, .left-sidebar-form { color: #fff; } .right-sidebar-form p, .right-sidebar-form a { color: #fff !important; } .right-sidebar-form a { font-weight: bold; } .right-sidebar-form a:hover { text-decoration: underline; } .right-sidebar .right-sidebar-header h2, .right-sidebar .right-sidebar-header h1, .right-sidebar h3 { color: #fff; font-size: 24px; line-height: 135%; text-align: center; } .right-sidebar-internal .right-sidebar-header h2 { line-height: 1.2em; text-align: center; } .right-sidebar-header h3 { color: #fff; text-align:center; } .right-sidebar-header h4 { color: #fff; text-align:center; } .hs-input label, .hs-form-field { margin-bottom: 20px; } .hs_submit .hs-button:hover { color: #084674; background: #f2f4f4; } field .hs-form-field .hs-field-desc { list-style-type: none; } body form.hs-form .hs-form-field ul.inputs-list { list-style: none; } .hs-button { background-color: #084674; border: 2px solid #fff; color: #fff; padding: 10px; margin: 10px; font-size: 14px; } .right-sidebar h2, .right-sidebar img { text-align: center; } .right-sidebar-form .hs-button:hover, .left-sidebar-form .hs-button:hover { background: rgba(226,226,226,1); background: -moz-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(226,226,226,1)), color-stop(50%, rgba(219,219,219,1)), color-stop(51%, rgba(209,209,209,1)), color-stop(100%, rgba(254,254,254,1))); background: -webkit-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%); background: -o-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%); background: -ms-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%); background: linear-gradient(to bottom, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe', GradientType=0 ); color:#084674; } .right-sidebar-content li a { color:#fff; } .right-sidebar-content li a:hover { text-decoration: underline; } .right-main-content-wrapper { padding: 20px 40px 20px 40px; background: rgba(255,255,255,1); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); } /* Before & After landing page */ .landing-page-form { margin-left: 50px; margin: 50px; max-width: 250px; background-color: #084674; border-right: 2px dotted #084674; box-shadow: 0 0 8px rgba(0, 0, 0, .8); -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); } .wrapper { max-width: 1140px; margin: 0 auto; float: none; } .footer-copyright-landing-page p { text-align: center; color: #000; } .footer-copyright-landing-page img { margin-bottom: 8px; margin-left: 10px; margin-right: 10px; } /* Products Page */ .products-wrapper { margin: auto 0; overflow:hidden; background: #fff; padding: 10px 80px 10px 80px; background: rgba(255,255,255,1); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); border: 0; border-bottom: 1px dashed #8f8f93; } .image-slider { margin: 0 auto !important; float: none !important; height: 500px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } .hr { border: 0; border-bottom: 1px dashed #8f8f93; } /* Maintenance & services page */ .hero-image-maintenance { background:url('//cdn2.hubspot.net/hub/14855/file-2632901970-png/images/vine_and_branch_logo.png'); background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; margin-top: 200px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; max-width: 100%; } .blurb { color: #fff; text-align: center; font-size: 14px; padding: 10px 15px; background-color: #084674; text-transform: uppercase; margin-bottom: 50px; max-width: 55%; margin: 0 auto !important; float: none !important; } .maintenance-form { padding: 20px; background-color: #084674; box-shadow: 0 0 8px rgba(0, 0, 0, .8); -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); margin-left: -10px; color: #fff; } .services .maintenance-form { margin: 4em 0 0 0; } .maintenance-form .form-title { color: #fff; text-align: center; } /*Installation Page */ .contact-info { float:left; } .job-installations { float:left; } .installation-image { width: 350px; float:left; border: 3px solid #8f8f93; } .job-installations h2 { color: #084674; float:left; } .hero-image-installation h1 { font-size: 44px; color: #fff; text-shadow: 1px 1px 1px #333; text-transform: uppercase; text-align: center; line-height: 400px; background: url('//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/new_images/photo_2.jpg') center no-repeat; background-repeat: no-repeat; margin: 0 auto !important; float: none !important; height: 400px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } /* Email Template */ .email-main-content-wrapper { background: rgba(255,255,255,1); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); } /* Work Gallery Page & Internal Gallery pages */ .page-wrapper-gallery { background-color: #fff; } .gallery-title h3 { padding-bottom: 5px; border-bottom: 1px solid #084674; } .gallery-wrapper { margin: auto 0; background: #fff; padding: 10px 80px 10px 80px; } .gallery-image { margin: 0 auto; padding: 8px; } .gallery-page-header { text-align:center; font-size: 24px; } /* Lightbox styles */ .grid-item { display: inline-block; padding: 15px; margin:0 auto; } .grid-item img { width: 100%; height: 100%; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25); } /* input[type="checkbox"] { display: none; } */ .lightbox { width: 100%; position: fixed; top: 0; left: 0; min-height: 100%; z-index: 1; overflow: auto; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: -webkit-transform .75s ease-out; transition: transform .75s ease-out; } .lightbox img { position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-width: 96%; max-height: 96%; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25); } input[type="checkbox"]:checked + .lightbox { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } input[type="checkbox"]:checked ~ .grid { opacity: .125; } @media screen and (max-width: 767px) { .grid-item { width: 85%; } } @media screen and (max-width: 480px) { .grid-item { width: 100%; } } .overlay:hover { opacity: .7; } .overlay { background-color:#084674; margin-top: -19px; opacity:0; width:305px; height:180px; opacity:0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } /* maintenance page */ .maintenance-sidebar-header h2 { text-align: center; color: #fff; margin: 20px; line-height: 1.5em; } .right-sidebar-maintenance-form { margin-top: -20px; } /* About us Page */ .about-links li { list-style-type: square; } .about-links ul li a { font-size: 16px; } .about-links ul li a:hover { text-decoration: underline; } .hr-about { max-width: 400px; border: 0; border-bottom: 1px dashed #8f8f93; margin-left: 10px !important; margin-top: -30px; } /* Team Page */ /* 404 Error Page */ a.hs-button .primary { margin-top: 50px !important; } /* Blog */ .hs-blog-social-share .hs-blog-social-share-list { display: block; float: none; list-style: outside none none; margin: 0 auto; width: 400px; } .hs-blog-social-share { padding: 60px 0; } .blog-sidebar { padding: 20px 30px; margin-top: 50px; margin-bottom: 20px; background-color: #084674; box-shadow: 0 0 8px rgba(0, 0, 0, .8); -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); } .blog-sidebar h3 { color: #fff; border-bottom: 1px dashed #8f8f93; } .post-header h2 { color: #084674; line-height: 1.2em; } .post-body img { margin: 10px; } .blog-comments { padding: 20px; margin: 20px; background-color: #084674; box-shadow: 0 0 8px rgba(0, 0, 0, .8); -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); margin-left: -10px; max-width: 450px; } .blog-headline h2 { color: #fff; line-height: 1.2em; } .comment-headline { color: #fff; padding: 5px; margin: 10px; } .about-blog p { color: #fff; } .right-sidebar .about-blog h2 { color: #fff; } .right-sidebar .about-blog ul li { color: #fff; } .hr-sidebar { border: 0; border-bottom: 1px dashed #8f8f93; max-width: 350px; margin-top: -30px; } .hr-sidebar-2 { border: 0; border-bottom: 1px dashed #8f8f93; max-width: 350px; margin-top: -60px; } .block h3, .block ul li a { color: #fff; } .block ul li a:hover { text-decoration: underline; color: #fff; } /* Back to top button */ .cd-top { display: inline-block; height: 40px; width: 40px; position: fixed; bottom: 40px; right: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); /* image replacement properties */ overflow: hidden; text-indent: 100%; white-space: nowrap; background: #084674 url(//14855.fs1.hubspotusercontent-na1.net/hubfs/14855/cd-top-arrow.svg) no-repeat center 50%; visibility: hidden; opacity: 0; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; } .cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; } .cd-top.cd-is-visible { /* the button becomes visible */ visibility: visible; opacity: 1; } /* Portfolio ======================================================================================== */ /* Index */ .hs-blog-listing.hs-blog-name-portfolio .portfolio-header-wrapper { background: #084674; text-align: center; padding: 50px; margin-top: -30px; margin-bottom: 50px; } .hs-blog-listing.hs-blog-name-portfolio .page-header h1 { line-height: 1.2em; color: #fff; margin: 0; } .hs-blog-listing .page-wrapper { background: #fff; } .hs-blog-listing.hs-blog-name-portfolio .post-item { width: 30.5%; clear: none; margin: 0 1% 40px 1%; float: left; display: block; } .blog-pagination { clear: both; } .portfolio-entry-index { min-height: 300px; background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; box-shadow:inset 0px 0px 200px 40px #06375b; -webkit-filter: grayscale(70%); filter: grayscale(80%); } .portfolio-entry-index:hover{ -webkit-filter: grayscale(0%); filter: grayscale(0%); box-shadow:inset 0px 0px 100px #06375b; } .portfolio-entry-index h2 { color: #fff; font-size: 2em; line-height: 1.1; text-align: center; padding: 30% 30px 0 30px; text-shadow: 0 0 2px #222; } .hs-blog-post .portfolio-header-wrapper, .hs-blog-post .products-wrapper{ display: none; } .hs-blog-post .page-wrapper { background: #fff; } .hs-blog-post.hs-blog-name-portfolio .post-header { background-size: cover !important; background-position: center center !important; padding: 11% 0 9%; margin-top: -30px; box-shadow:inset 0px 0px 200px 40px #000000; position: relative; overflow: hidden; } .hs-blog-post.hs-blog-name-portfolio .post-header h2 { line-height: 1.2em; text-align: center; } .hs-blog-post.hs-blog-name-portfolio .post-header h2 a { color: #fff !important; } a.next-post { position: absolute; right: 0; top: 0; background: rgba(0,0,0,.3); padding: 11.5% 20px; color: #fff; font-size: 30px; } a.next-post:hover, a.previous-post:hover, .hs-blog-post.hs-blog-name-portfolio .post-header .fa:hover { background: rgba(0,0,0,.8); color: #fff !important; } a.previous-post { position: absolute; left: 0; top: 0; background: rgba(0,0,0,.3); padding: 11.5% 20px; color: #fff; font-size: 30px; } .hs-blog-post.hs-blog-name-portfolio .post-body { clear: both; padding: 50px 0; display: block; overflow: auto; } h4.facility-name { font-size: 49px; letter-spacing: -1px; border-bottom: 1px solid #ebebeb; } span.location, span.completion-date { font-size: 28px; letter-spacing: -.5px; font-family: "alternate-gothic-no-2-d",sans-serif; color: #084674; text-transform: uppercase; } span.location { margin-right: 15px; padding-right: 15px; border-right: 2px solid #084674; } .details-column { background: #eee; color: #084674; padding: 30px; margin-top: 25px; } .details-column ul { margin-top: 0 !important; } .details-column h4 { font-size: 28px; margin: 0; letter-spacing: -.5px; } .details-column p { margin-top: 0; font-size: 15px; line-height: 1.35; } .two-thirds.gallery { width: 60%; } .details-column h4, .details-column h2, .details-column h3, .details-column p, .details-column ul, .details-column li { color: #084674; } .hs-blog-post .categories { clear: both; margin-top: 40px; display: none; } .hs-blog-listing .blog-pagination { clear: both; display: block; float: none; margin: 60px auto 20px; overflow: auto; width: 90%; } .hs-blog-listing .blog-pagination .all-posts-link { display: none; } .hs-blog-listing .blog-pagination .next-posts-link { float:right; font-family: "alternate-gothic-no-2-d",sans-serif; font-size: 32px; position: relative; padding-right: 30px; } .hs-blog-listing .blog-pagination .next-posts-link:after { position: absolute; content: "\f101"; font-family: FontAwesome; right: 0; top: -3px; } .fb_iframe_widget iframe { top: -8px !important; } /* Resources Page */ .hs-content-name-resources .row-fluid-wrapper.row-depth-1.row-number-7 { -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.45); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.45); box-shadow: 0 0 5px rgba(0, 0, 0, 0.45); margin-top:30px; } .resource-nav { display: flex; justify-content: space-between; margin: 0 auto; padding: 0 5px; background: #084674; border: 1px solid #084674; border-bottom: 0; } .resource-nav > a { cursor: pointer; margin: 5px 0 0; color: #fff; text-align: center; width: 100%; padding: 5px 0 10px; transition: .3s ease all; } .right-sidebar h2 { color: #fff; font-size: 25px; } .flex.slick-slider { padding: 0 30px; } .flex.slick-slider .slick-prev { left: -7px; } .flex.slick-slider .slick-next { right: -7px; } .flex.slick-slider strong { font-weight: 700; color: #fff; } .nav-toggled { background: #fff; color: #084674 !important; } .resource-nav > a:hover { background: #fff; color: #084674; transition: .3s ease all; } .resources-listing { display: none; padding: 5%; } .resources-listing-cntr { border: 1px solid #084674; border-top: 0; } .resources-listing.active { display: block; } #toadvine > *, #manufacturers > div, #manufacturers > div > div > * { padding-left: 5%; } /* Footer */ .top-footer-wrapper { background-color: #084674; padding: 40px 0; color: #fff; } .top-footer, .middle-footer, .bottom-footer { max-width: 1200px; margin: 0 auto !important; float: none !important; padding: 0 10px; } .top-footer h2 { color: #fff; line-height: 130% !important; font-size: 28px !important; text-transform: uppercase; letter-spacing: -1px; } .top-footer a { color: #fff; } .footer-column-1, .footer-column-2, .footer-column-3, .footer-column-4 { padding-bottom: 10px; text-align: center; } .top-footer ul { list-style-type: none !important; padding-left: 0 !important; } .top-footer ul li a { text-align: left; color: #fff; transition: all ease-in-out .3s; } .top-footer li a:hover { border-bottom: 1px solid #fff; } .middle-footer-wrapper { background-color: #ccc !important; } .footer-copyright { padding: 30px 0 0 0; color: #000; } .footer-copyright p { font-size: 11px !important; letter-spacing: 1px; text-transform: uppercase; } .footer-copyright img { margin-bottom: 10px; margin-left: 5px; margin-right: 5px; } .footer-site-nav, .footer-column-4 p { display:inline-block; text-align: center; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; } .footer-site-nav ul { text-decoration: none; -webkit-transition: all 0.7s ease; transition: all 0.7s ease; } .footer-site-nav li { margin: 12px 0; display: block; } .footer-single-text { color: #fff; font-size: 12px; text-transform: uppercase; text-align: center; letter-spacing: 1px; } .footer-single-text a { color: #fff; } .footer-single-text a:hover { text-decoration: underline; } .footer-contact { text-align: center; font-weight: 700; line-height: 1.3; margin-bottom: 60px; } span.phone { font-size: 30px !important; display: block; } .social-footer { text-align: center; font-size: 24px; line-height: 1; display: block; width: 100%; float: none; clear: both; margin-bottom: 30px; } .social-footer a { color: #084674; } .social-footer .fa { background: #fff; border-radius: 50%; margin: 0 5px; width: 40px; height: 40px; line-height: 40px; } .footer-single-text-global { color: #8f8f93; font-size: 10px; text-transform: uppercase; text-align: center; padding-top: 10px; margin-top: -10px; } .supplier-logos p { margin: 0 !important; } .supplier-logos img { max-width: 60% !important; margin: 0 auto !important; float: none !important; } /* Mobile Styles ================================================================================ */ @media only screen and (max-width: 1100px) { .header-phone { font-size: 18px; } .header-contact-link { padding: 8px 12px 6px 12px; text-align: right; font-size: 13px; } .social-header { margin-top: 10px; font-size: 14px; width: 30% !important; } .social-header a { margin-right: 4px; } .custom-menu-primary { font-size: 13px; letter-spacing: .5px; } .custom-menu-primary > ul li a { padding: 6px 13px; } } @media only screen and (max-width: 1000px) { .maintenance-text h2 { font-size: 1.5em; letter-spacing: 1px; margin-top: 25px; } a#cta_button_14855_29aa7cc6-92a8-4009-88d1-e89b261573f6 { font-size: 12px !important; } .services .maintenance-form { margin: 2em 0 0 0; } .custom-cta-wrapper-group1, .custom-cta-wrapper-group2 { width: 90% !important; margin: 0 auto !important; float: none !important; } .custom-cta-wrapper-group1 { padding-bottom: 20px; } .custom-cta-wrapper-group1 .custom-cta, .custom-cta-wrapper-group2 .custom-cta { float: left !important; } .service-listing-wrapper h2 { line-height: 125% !important; font-size: 1.35em; } .service-listing-wrapper p { margin-top: 6px !important; letter-spacing: 1px; padding-bottom: 6px; font-size: .85em; } /* .team-home img { margin: 8px !important; width: 55px !important; height: 55px !important; box-shadow: 0 0 4px rgba(0, 0, 0, .8); } .team-home h3 { font-size: 13px; margin-bottom: 1px !important; } .team-home h5 { font-size: 10px; } */ .about-team-left, .about-team-right { width: 70% !important; float: none !important; margin: 0 auto !important; } .about-image { max-width: 60% !important; float: none !important; margin 0 auto !important; text-align: center !important; } } @media only screen and (max-width: 767px) { body { margin:0 auto; } .header-wrapper { background:none !important; } .page-header { font-size: 18px; } .page-header h3 { font-size: 14px; margin: 0 auto; float:none; } .right-main-content img { display:none; } .about-image img { display:none; } .products-row-1 h2 { text-align:center; margin-top: -20px; } .products-wrapper h2 { margin-left: 150px; } .left-main-content-wrapper { line-height: 1.5em; } .hero-text h1 { font-size: 28px; padding: 0 10px; } .custom-logo { width: 100% !important; float:none !important; text-align:center !important; margin-top: 0 !important; } .custom-logo img { width: 80%; } .header-contact { width: 100%; float:none; } .custom-header .header-phone { width:100% !important; margin-top:0 !important; margin-bottom: 10px; } .hero-text h1 { line-height: 1.2em; } .hero-small-text { text-align: center; color: #fff; margin-bottom: 10px; } .hero-small-text p { text-align: center; font-size: 16px; padding: 5px 20px; border: 1px solid #084674; color: #084674; background-color: #fff; text-transform: uppercase; letter-spacing: 2px; font-weight: 400; } .maintenance-text h2 { font-size: 20px; text-align: center; } .cta-learn-more { text-align: center; } .hero .cta-contact { text-align:center; } .hero .cta-learn-more { text-align:center; } .newsletter-text h4 { text-align: center; float:none; } .custom-cta { padding: 20px 50px; text-align: center; } .hero-text-2 h1 { font-size: 44px; line-height: 135%; padding-top: 40px; } .service-listing-wrapper h2 { font-size: 1.5em; margin-bottom: 0; } .service-listing-wrapper p { font-size: .85em; line-height: .95em; } .social-media-wrapper { float:right; display:inline-block; } .social-header { display:none; } .header-contact-link { display:none; } .services .maintenance-form { margin: 0 !important; padding:0; } .footer-wrapper { text-align:center !important; } } @media only screen and (max-width: 400px) { .hs-form { margin-left: 15%; } .products-wrapper h2 { margin-left: -60px; } .main-content-wrapper .left-main-content img { display:none !important; } .main-content-wrapper .page-header { font-size: 14px; } .main-content-wrapper .left-main-content { width: 100%; } span h3 a { text-align:center !important; font-size: 16px; } .footer-menu li a { text-align:center; } .footer-states p { text-align:center; } .hero-text-2 h1 { line-height: 1.2em; } .contact-text h1 { width: 150px; } .contact-text p { display:none; } .left-main-content img { display:none; } .right-sidebar-internal { display:none !important; border:none; } .right-sidebar { width: 400px; } .social-header { display:none; } .header-contact-link { } .install-image { display:none !important; } .social-icons .fa { color: #1b4670; background-color: #fff; margin: 10px 10px; position: center; cursor: pointer; width: 40px; height: 40px; border-radius: 25px; font-size: 20px; font-weight: normal; line-height: 2em; -moz-border-radius:25px; -webkit-border-radius:25px; -webkit-transition: all ease 0.3s; -moz-transition: all ease 0.3s; -o-transition: all ease 0.3s; -ms-transition: all ease 0.3s; transition: all ease 0.3s; } .footer-wrapper { text-align:center; } .footer-menu li { width:100% !important; float:none !important; } .footer-menu ul li:after { content: "" !important; } } /****************************************************************************/ /* This is the default custom CSS file that is included in every template. */ /* It can be edited, but it cannot be renamed or deleted. */ /****************************************************************************/ /* ========================================================================== Mobile Menu - Hubspot Standard Toggle Menu ========================================================================== */ /** * Special Note * * When the menu is open, a class of .mobile-open is applied to the body. You can * use this for custom styling on any element when the menu is in the open position. */ @media (min-width: 768px){ a.mobile-trigger, a.child-trigger { display: none !important; /* Hide button on Desktop */ } } @media (max-width: 767px){ /* Variables ========================================================================== */ /* Set Mobile Menu Background Color */ /* Set Link Color */ /* Set Link Hover Color */ /* Menu Reset - Remove styling from desktop version of custom-menu-primary */ /* Place any additional CSS you want removed from the mobile menu in this reset */ .custom-menu-primary, .custom-menu-primary *{ display: block; float: none; position: static; top: auto; right: auto; left: auto; bottom: auto; padding: 0px; margin: 0px; background-image: none; background-color: transparent; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; max-width: none; width: 100%; height: auto; line-height: 1; font-weight: normal; text-decoration: none; text-indent: 0px; text-align: left; color: #fff; } /* Toggle Button ========================================================================== */ a.mobile-trigger { display: inline-block !important; /* Hide button on Desktop */ cursor: pointer; /* Mouse pointer type on hover */ position: absolute; /*******************************************/ top:0px; /* Position Button */ right: 10px; /*******************************************/ width: 32px; /* Button width */ height: 22px; /* Button height */ background-color:#084674; z-index: 99999999999; /* Z-index to keep button on top of other layers */ -webkit-transition: background-color 0.2s linear; /* Button color transition effect */ font-size: 16px; font-weight: normal; text-align: left; text-transform: uppercase; -webkit-transition:color .2s ease-in; -moz-transition:color .2s ease-in; transition:color .2s ease-in; border-radius:none !important; } a.mobile-trigger:hover { text-decoration: none; /* Removes link text underline on button */ color: #fff; } a.mobile-trigger span{ display: inline; } a.mobile-trigger span:before{ position: absolute; content:""; } a.mobile-trigger span:after{ position: relative; right: 2px; content:""; opacity: 0; transition: opacity .4s ease-in-out; -moz-transition: opacity .4s ease-in-out; -webkit-transition: opacity .4s ease-in-out; } /* Change button when menu is open */ .mobile-open a.mobile-trigger{ -webkit-transition:background-color 0.2s linear; /* Button color transition effect */ -moz-transition:background-color 0.2s linear; /* Button color transition effect */ transition:background-color 0.2s linear; /* Button color transition effect */ } .mobile-open a.mobile-trigger span:after{ opacity: 1; } /* Toggle Button Icon & Animations ========================================================================== */ a.mobile-trigger i { text-align:left; display: inline; position: relative; margin-left: 8px; top: -5px; -webkit-transition-duration: 0s; -webkit-transition-delay: .2s; -moz-transition-duration: 0s; -moz-transition-delay: .2s; transition-duration: 0s; transition-delay: .2s; } a.mobile-trigger i:before, a.mobile-trigger i:after { position: absolute; } a.mobile-trigger i, a.mobile-trigger i:before, a.mobile-trigger i:after { width: 15px; /* Icon line width */ height: 2px; /* Icon line height */ background-color: #fff; /* Icon color */ display: inline-block; } a.mobile-trigger i:before { margin-top: -6px; /* Position top line */ -webkit-transition-property: margin, -webkit-transform; -webkit-transition-duration: .2s; -webkit-transition-delay: .2s, 0; } a.mobile-trigger i:after { margin-top: 6px; /* Position bottom line */ -webkit-transition-property: margin, -webkit-transform; -webkit-transition-duration: .2s; -webkit-transition-delay: .2s, 0; } .mobile-open a.mobile-trigger i { background-color: #fff; -webkit-transition-delay: .2s; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); } .mobile-open a.mobile-trigger i:before { margin-top: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition-delay: 0, .2s; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); } .mobile-open a.mobile-trigger i:after { background-color: #a1a1a1; margin-top: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition-delay: 0, .2s; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); } /* Child Toggle Button ========================================================================== */ a.child-trigger { display: block !important; /* Hide button on Desktop */ cursor: pointer; /* Mouse pointer type on hover */ position: absolute; top: 0px; right: 0px; width: 55px !important; /* Button width */ min-width: 55px !important; height: 45px !important; /* Button height */ padding: 0 !important; border-left: 1px dotted rgba(255, 255, 255, .20); } a.child-trigger:hover { text-decoration: none; background-color: #fff; } /* Child Toggle Button Icon & Animations ========================================================================== */ a.child-trigger span { position: relative; top: 50%; /* Centers icon inside button */ margin: 0 auto !important; -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } a.child-trigger span:after { position: absolute; } a.child-trigger span, a.child-trigger span:after { width: 10px; /* Icon line width */ height: 1px; /* Icon line height */ background-color: #fff; /* Icon color */ display: block; } a.child-trigger span:after { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } a.child-trigger.child-open span:after { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } a.child-trigger.child-open span { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } /* Menu Styles on Mobile Devices ========================================================================== */ /* Hide menu on mobile */ .custom-menu-primary.js-enabled .hs-menu-flow-horizontal, .custom-menu-primary.js-enabled .hs-menu-children-wrapper{ display: none; } /* Make child lists appear below parent items */ .custom-menu-primary ul.hs-menu-children-wrapper { visibility: visible !important; opacity: 1 !important; position: static !important; display: none; } /* Mobile Menu Styles */ .custom-menu-primary.js-enabled .hs-menu-flow-horizontal{ position: absolute; /**************************************************************/ top: 0; /* Positions the menu to drop from the very top of the screen */ left: 0px; /**************************************************************/ width: 100%; -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.65); -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.65); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.65); } .custom-menu-primary .hs-menu-flow-horizontal{ padding: 40px 0 0 0; /* Padding to add room for close button */ background-color: #084674; /* Menu background color set off global mobile-menuColor variable */ width: 100%; /* Full screen width */ z-index: 8888; } /* Level 1 Menu List Styles */ .custom-menu-primary .hs-menu-flow-horizontal > ul > li{ position: relative; } .custom-menu-primary .hs-menu-flow-horizontal > ul > li a{ font-size: 22px; /* Font size of top level list items */ line-height: 45px; overflow: visible; } /* Level 1 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-flow-horizontal ul li{ border-top: 1px dotted rgba(255, 255, 255, .35); /* Adds transparent dark highlights to top of top level list items */ } .custom-menu-primary .hs-menu-flow-horizontal ul li a{ padding: 0 10px; } .custom-menu-primary .hs-menu-flow-horizontal ul li a:hover{ color: #fff; /* link hover color set by global mobile-aColorHover variable */ } /* Level 2 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-flow-horizontal > ul ul li{ background-color: rgba(255, 255, 255, .08); } .custom-menu-primary .hs-menu-flow-horizontal > ul ul li a{ text-indent: 10px; /* Indent Child lists */ font-size: 16px; /* Font size of child lists */ } /* Level 3 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-flow-horizontal > ul ul ul li a{ text-indent: 30px; /* Indent Child lists */ } .custom-menu-primary .hs-menu-flow-horizontal > ul ul ul ul li a{ text-indent: 50px; /* Indent Child lists */ } }