@charset "UTF-8"; @import url(animate.css); @import url(//fonts.googleapis.com/css?family=Quattrocento:400,700|Raleway:400,700,800); @import url(//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css); /*======================================================== Main Styles =========================================================*/ body { background: #fff; color: #3f4853; font: 400 18px/36px "Quattrocento", serif; -webkit-text-size-adjust: none; text-align: center; } img { max-width: 100%; height: auto; } h1 { font-family: 'Raleway', sans-serif; font-size: 30px; line-height: 40px; font-weight: 800; text-transform: uppercase; color: #fff; letter-spacing: 1px; } h2 { font-family: 'Raleway', sans-serif; font-size: 42px; line-height: 50px; font-weight: 700; text-transform: uppercase; position: relative; color: #fff; letter-spacing: 1px; } h2:after { content: ''; display: block; margin: 10px auto 0; width: 170px; height: 1px; background: #fff; } @media (max-width: 767px) { h2 { font-size: 35px; } } h3 { font-family: 'Raleway', sans-serif; font-size: 18px; line-height: 30px; font-weight: 700; text-transform: uppercase; position: relative; color: #343434; letter-spacing: .7px; } h3:after { content: ''; display: block; margin: 25px auto 0; width: 170px; height: 1px; background: #5d5d5d; } h4 { font-family: 'Raleway', sans-serif; font-size: 24px; line-height: 34px; font-weight: 700; letter-spacing: 1px; color: #c2410c; } h5 { font-family: 'Raleway', sans-serif; font-size: 24px; line-height: 34px; font-weight: 700; letter-spacing: 1px; } h6 { color: #c2410c; } h2 a:hover, h3 a:hover, h5 a:hover { color: #c2410c; } h4 a:hover, h6 a:hover { color: #3f4853; } p a:hover, .marked-list a:hover, .inline-list a:hover { text-decoration: underline; } p .fa, .marked-list .fa, .inline-list .fa { text-decoration: none; } time { display: block; } a { font: inherit; color: inherit; text-decoration: none; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s; } a:focus { outline: none; } a:active { background-color: transparent; } a[href^="tel:"], a[href^="callto:"] { color: inherit; text-decoration: none; } strong { font-weight: 700; } .fa { line-height: inherit; } [class*='fa-']:before { font-weight: 400; font-family: "FontAwesome"; } .page { overflow: hidden; min-height: 500px; } .lt-ie9 .page { min-width: 1200px; } /*======================================================= Main Layout =========================================================*/ h2 + * { margin-top: 20px; } * + h4 { margin-top: 20px; } h4 + * { margin-top: 13px; } * + h5 { margin-top: 30px; } h5 + * { margin-top: 10px; } * + .btn, * + .btn2 { margin-top: 45px; } * + h6 { margin-top: 10px; } .row + .row { margin-top: 25px; } h3 + * { margin-top: 50px; } /*======================================================= Components =========================================================*/ /*================== Brand ======================*/ .brand { display: inline-block; } .brand_name { overflow: hidden; } /*================== Backgrounds ======================*/ .bg1 { background: no-repeat url(../images/bg1.jpg) 0 0; background-size: cover; } .bg2 { background: no-repeat url(../images/bg2.jpg) 0 0; background-size: cover; } .bg3 { background: #c2410c; color: #fff; position: relative; overflow: hidden; } .bg3 h2, .bg3 h3, .bg3 h4, .bg3 h5, .bg3 h6 { color: #fff; } .bg3 h2:after, .bg3 h3:after, .bg3 h4:after, .bg3 h5:after, .bg3 h6:after { background: #fff; } .bg3 h2 a:hover, .bg3 h3 a:hover, .bg3 h4 a:hover, .bg3 h5 a:hover, .bg3 h6 a:hover { color: #3f4853; } .bg3 .container { position: relative; } .bg-img1 { display: none; } @media (min-width: 1540px) { .bg-img1 { display: block; position: absolute; right: 50%; margin-right: 360px; top: 0; height: 100%; } } .bg-img2 { display: none; } @media (min-width: 1540px) { .bg-img2 { display: block; position: absolute; right: 50%; margin-right: 5px; top: 0; height: 100%; } } /*================== Icons ======================*/ .fl-bigmug-line { font-size: 90px; line-height: 100px; color: #c2410c; } /*================== Buttons ======================*/ .btn, .btn2 { display: inline-block; border: 1px solid #c2410c; font-family: 'Raleway', sans-serif; font-size: 14px; line-height: 30px; font-weight: 700; text-transform: uppercase; letter-spacing: .7px; border-radius: 3px; padding: 8px 40px; color: #c2410c; text-align: center; } .btn:hover, .btn2:hover { background: #c2410c; color: #fff; } .btn:active, .btn2:active { background: #c55f02; } .btn2 { border-color: #fff; color: #fff; } .btn2:hover { background: #fff; color: #c2410c; } .btn2:active { background: #e6e6e6; } /*================== Box ======================*/ .box { border: 1px solid #a2a2a2; padding: 27px 20px 35px; font-weight: 700; line-height: 30px; } .box2 { position: relative; } .box2:before, .box2:after { display: table; content: ""; line-height: 0; } .box2:after { clear: both; } .box2_over { position: absolute; top: 0; bottom: 0; left: 0; right: 0; text-align: center; } .box2_over time { font-size: 120px; line-height: 110px; font-family: 'Raleway', sans-serif; font-weight: 700; color: rgba(255, 255, 255, 0.25); padding-bottom: 20px; } @media (max-width: 1500px) and (min-width: 980px) { .box2_over time { font-size: 75px; line-height: 70px; } } .box2_aside { float: left; margin-right: 30px; } @media (max-width: 979px) { .box2_aside { float: none; margin-bottom: 30px; margin-right: 0; } } .box2_cnt__no-flow { overflow: hidden; text-align: left; } .box3 { padding: 0 5%; } /*================== Lists ======================*/ .inline-list { text-transform: uppercase; } * + .inline-list { margin-top: 60px; } .inline-list li { display: inline-block; margin: 0 20px; } .marked-list li { position: relative; padding-left: 30px; } .marked-list li:before { content: ''; display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #fff; position: absolute; top: 13px; left: 0; } .marked-list li + li { margin-top: 12px; } .marked-list1 li { position: relative; } .marked-list1 li:before { content: ''; display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #fff; vertical-align: top; margin-top: 13px; margin-right: 20px; } .marked-list1 li + li { margin-top: 12px; } * + .marked-list1 { margin-top: 20px; } .index-list { counter-reset: li; } .index-list li { position: relative; } .index-list li:before { content: counter(li,decimal-leading-zero); counter-increment: li; display: inline-block; width: 108px; height: 108px; border-radius: 50%; background: #c2410c; border: 1px solid #fff; color: #fff; font-size: 48px; line-height: 108px; font-family: 'Raleway', sans-serif; font-weight: 700; text-align: center; margin-bottom: 30px; } .list { text-align: left; } .list li + li { margin-top: 10px; } .list .title { position: relative; overflow: hidden; padding-right: 70px; } .list .title:before, .list .title:after { display: table; content: ""; line-height: 0; } .list .title:after { clear: both; } .list .title_right { position: absolute; bottom: 0; right: 0; background: #fff; } .list .title_no-flow { overflow: hidden; background: #fff; } .list .title_text { background: #fff; } .list .title .dots { position: absolute; left: 0; bottom: 0; display: block; width: 100%; z-index: -1; } /*======================== Menu ==========================*/ .sf-menu { display: inline-block; text-align: left; } .sf-menu:before, .sf-menu:after { display: table; content: ""; line-height: 0; } .sf-menu:after { clear: both; } .sf-menu > li { position: relative; float: left; } .sf-menu > li + li { margin-left: 50px; } @media (max-width: 979px) and (min-width: 768px) { .sf-menu > li + li { margin-left: 25px; } } .sf-menu a { display: block; font-family: 'Raleway', sans-serif; font-size: 14px; line-height: 24px; color: #fff; } .sf-menu > li > a { color: #FFF; letter-spacing: .4px; } .sf-menu > li.sfHover > a, .sf-menu > li > a:hover, .sf-menu > li.active > a { color: #fec795; } .sf-menu ul { display: none; position: absolute; top: 100%; width: 150px; margin-top: 15px; margin-left: -20px; padding: 13px 15px 20px; background: #c2410c; z-index: 2; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); } .sf-menu ul > li + li { margin-top: 12px; } .sf-menu ul > li > a { color: #FFF; } .sf-menu ul > li.sfHover > a, .sf-menu ul > li > a:hover { color: #3f4853; } .sf-menu ul ul { position: absolute; top: -15px; left: 100%; width: 150px; margin-left: 10px; padding: 13px 15px 20px; z-index: 4; } .sf-menu ul ul > li > a { color: #FFF; } .sf-menu ul ul > li.sfHover > a, .sf-menu ul ul > li > a:hover { color: #3f4853; } .sf-menu > li > .sf-with-ul { position: relative; } .sf-menu > li > .sf-with-ul:before { position: absolute; left: 50%; top: 75%; margin-left: -6px; content: ""; font: 400 12px/12px "FontAwesome"; } @media (max-width: 767px) { .sf-menu { display: none; } } /*================== RD Mobile Menu =====================*/ .rd-mobilemenu { display: none; position: fixed; top: 0; left: 0; bottom: 0; z-index: 9999999; text-align: left; -moz-transition: 0.3s all ease; -o-transition: 0.3s all ease; -webkit-transition: 0.3s all ease; transition: 0.3s all ease; } .rd-mobilemenu.active { right: 0; } .rd-mobilemenu_ul { position: fixed; top: -56px; left: 0; bottom: -56px; width: 240px; padding: 132px 0 76px; color: #666; background: #FFF; font-size: 14px; line-height: 20px; overflow: auto; -webkit-box-shadow: 5px 0 5px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 0 5px 0 rgba(0, 0, 0, 0.1); box-shadow: 5px 0 5px 0 rgba(0, 0, 0, 0.1); -moz-transform: translateX(-240px); -ms-transform: translateX(-240px); -o-transform: translateX(-240px); -webkit-transform: translateX(-240px); transform: translateX(-240px); -moz-transition: 0.3s ease; -o-transition: 0.3s ease; -webkit-transition: 0.3s ease; transition: 0.3s ease; -moz-transition: 0.3s cubic-bezier(0.55, 0, 0.1, 1); -o-transition: 0.3s cubic-bezier(0.55, 0, 0.1, 1); -webkit-transition: 0.3s cubic-bezier(0.55, 0, 0.1, 1); transition: 0.3s cubic-bezier(0.55, 0, 0.1, 1); } .rd-mobilemenu.active .rd-mobilemenu_ul { -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } .rd-mobilemenu_ul a { display: block; padding: 14px 25px 16px; } .rd-mobilemenu_ul a.active { background: #f5f5f5; color: #2d2d2d; } .rd-mobilemenu_ul a:hover { background: #c2410c; color: #FFF; } .rd-mobilemenu_ul a .rd-submenu-toggle { position: absolute; top: 50%; right: 11px; margin-top: -17.5px; width: 32px; height: 32px; font: 400 10px "FontAwesome"; line-height: 32px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -moz-transition: 0.5s all ease; -o-transition: 0.5s all ease; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; z-index: 1; background: rgba(0, 0, 0, 0.1); } .rd-mobilemenu_ul a .rd-submenu-toggle:after { content: '\f078'; } .rd-mobilemenu_ul a .rd-submenu-toggle:hover { background: #FFF; color: #666; } .rd-mobilemenu_ul a.rd-with-ul { position: relative; } .rd-mobilemenu_ul a.rd-with-ul.active .rd-submenu-toggle { -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .rd-mobilemenu_ul ul a { padding-left: 40px; } .rd-mobilemenu_ul ul ul a { padding-left: 60px; } .rd-mobilemenu_ul:after { content: ''; display: block; height: 20px; } .rd-mobilepanel { display: none; position: fixed; top: 0; left: 0; right: 0; height: 56px; background: #FFF; color: #000; -webkit-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1); z-index: 99999991; } .rd-mobilepanel_title { position: fixed; top: 4px; left: 56px; right: 56px; color: #000; font-size: 24px; line-height: 48px; text-overflow: ellipsis; white-space: nowrap; text-align: left; } .rd-mobilepanel_title:after, .rd-mobilepanel_title:before { display: none; } .rd-mobilepanel_toggle { position: fixed; top: 4px; left: 8px; width: 48px; height: 48px; } .rd-mobilepanel_toggle span { position: relative; display: block; margin: auto; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .rd-mobilepanel_toggle span:after, .rd-mobilepanel_toggle span:before { content: ""; position: absolute; left: 0; top: -8px; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .rd-mobilepanel_toggle span:after { top: 8px; } .rd-mobilepanel_toggle span:after, .rd-mobilepanel_toggle span:before, .rd-mobilepanel_toggle span { width: 24px; height: 4px; background-color: #000; backface-visibility: hidden; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .rd-mobilepanel_toggle span { -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .rd-mobilepanel_toggle span:before, .rd-mobilepanel_toggle span:after { -moz-transform-origin: 1.71429px center; -ms-transform-origin: 1.71429px center; -o-transform-origin: 1.71429px center; -webkit-transform-origin: 1.71429px center; transform-origin: 1.71429px center; -moz-transform-origin: 1.71429px center; -ms-transform-origin: 1.71429px center; -o-transform-origin: 1.71429px center; -webkit-transform-origin: 1.71429px center; transform-origin: 1.71429px center; } .rd-mobilepanel_toggle.active span { -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg); } .rd-mobilepanel_toggle.active span:before, .rd-mobilepanel_toggle.active span:after { top: 0; width: 15px; } .rd-mobilepanel_toggle.active span:before { -webkit-transform: rotate3d(0, 0, 1, -40deg); transform: rotate3d(0, 0, 1, -40deg); } .rd-mobilepanel_toggle.active span:after { -webkit-transform: rotate3d(0, 0, 1, 40deg); transform: rotate3d(0, 0, 1, 40deg); } @media (max-width: 767px) { body { padding-top: 56px; } .rd-mobilemenu, .rd-mobilepanel { display: block; } } @media (max-width: 359px) { .rd-mobilepanel_title { font-size: 18px; } } /*================== Stuck menu ======================*/ .isStuck { background: rgba(248, 119, 2, 0.9); border-bottom: 1px solid #fff; z-index: 999; padding-top: 20px; padding-bottom: 10px; } @media only screen and (max-width: 979px) { .isStuck { display: none !important; } } /*================== ToTop ======================*/ .toTop { width: 50px; height: 50px; font-size: 24px; line-height: 46px; color: #fff; background: #3f4853; border-radius: 50%; -webkit-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4); box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4); position: fixed; right: 40px; bottom: 40px; display: none; overflow: hidden; text-align: center; text-decoration: none; z-index: 20; } .toTop:hover { color: #fff; background: #c2410c; text-decoration: none; } .mobile .toTop, .tablet .toTop { display: none !important; } /*================== RD Parallax ======================*/ .parallax { position: relative; overflow: hidden; } .parallax_image, .parallax_pattern { position: absolute; top: 0; left: 0; right: 0; height: 100%; background-position: center center; will-change: transform; } .parallax_image { background-repeat: no-repeat; -webkit-background-size: cover; background-size: cover; } .parallax_pattern { background-repeat: repeat; } .parallax_cnt { position: relative; color: #fff; } .parallax h2, .parallax h3, .parallax h4, .parallax h5, .parallax h6 { color: #fff; } .parallax h2:after, .parallax h3:after, .parallax h4:after, .parallax h5:after, .parallax h6:after { background: #fff; } .parallax h2 a:hover, .parallax h3 a:hover, .parallax h4 a:hover, .parallax h5 a:hover, .parallax h6 a:hover { color: #c2410c; } .parallax_1 { padding-top: 115px; padding-bottom: 80px; } .parallax_2 { padding-top: 115px; padding-bottom: 110px; } /*================== Thumbnail ======================*/ .thumb { display: block; position: relative; overflow: hidden; } .thumb img { width: 100%; height: auto; -moz-transition: 0.5s all ease; -o-transition: 0.5s all ease; -webkit-transition: 0.5s all ease; transition: 0.5s all ease; } .thumb_overlay { position: absolute; left: 0; top: 0; right: 0; bottom: 0; opacity: 0; -moz-transition: 0.3s all ease; -o-transition: 0.3s all ease; -webkit-transition: 0.3s all ease; transition: 0.3s all ease; color: #fff; background: transparent; } .thumb_overlay:before { content: ""; position: absolute; top: 50%; left: 0; right: 0; font: 400 30px "FontAwesome"; line-height: 30px; margin-top: -15px; text-align: center; } .lt-ie9 .thumb_overlay:before { display: none; } .thumb:hover .thumb_overlay { opacity: 1; background: rgba(0, 0, 0, 0.5); } .lt-ie9 .thumb:hover .thumb_overlay { background: none; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#80000000')"; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#80000000'); zoom: 1; } .lt-ie9 .thumb:hover .thumb_overlay:before { display: block; } /*======================================================== HEADER Section =========================================================*/ header { padding-top: 25px; padding-bottom: 27px; } header .brand { float: left; } header .nav { float: right; margin-top: 13px; } @media (max-width: 767px) { header { text-align: center; } header .brand, header .nav { float: none; } } .top-section { padding-top: 170px; padding-bottom: 195px; color: #fff; } .top-section h2 { color: #fff; } /*======================================================== CONTENT Section =========================================================*/ main { display: block; } .text1 { font-weight: 700; line-height: 30px; } .primary { color: #c2410c; } .circle { display: inline-block; border-radius: 50%; } .full:before, .full:after { display: table; content: ""; line-height: 0; } .full:after { clear: both; } @media (max-width: 767px) { .full { width: 420px; margin-right: auto; margin-left: auto; } } @media (max-width: 479px) { .full { width: 300px; padding: 0 15px; } } .full-item { width: 20%; float: left; } @media (min-width: 980px) { .full-item .box { border-left: 0; } .full-item:last-child .box { border-right: 0; } } @media (max-width: 979px) and (min-width: 768px) { .full-item { width: 50%; } .full-item:nth-child(2n) .box { border-right: 0; border-left: 0; } .full-item:nth-child(n+3) .box { border-top: 0; } } @media (max-width: 767px) { .full-item { width: 100%; } .full-item + .full-item { margin-top: 30px; } } .mt1, .row.mt1 { margin-top: 50px; } .mt2 { margin-top: 100px; } .mt3, .row.mt3 { margin-top: 60px; } .mt4 { margin-top: 20px; } .addr { font-size: 18px; line-height: 30px; } .addr .fa { font-size: 48px; line-height: 53px; } .addr .fa + * { margin-top: 30px; } .addr .fa-mobile { font-size: 60px; } .centered { height: 100%; display: inline-block; } .center-wrap { display: inline-block; vertical-align: middle; } .helper { display: inline-block; vertical-align: middle; height: 100%; width: 0px; } .quote img + * { margin-top: 15px; } .quote * + h5 { margin-top: 10px; } .tl { text-align: left; } .terms { padding-top: 115px; padding-bottom: 80px; } .terms p + h5 { margin-top: 40px; } .policy-link { margin-top: 35px; } /*================== Well ======================*/ .well1 { padding-top: 130px; padding-bottom: 140px; } .well2 { padding-top: 120px; } @media (max-width: 979px) { .well2 { padding-top: 80px; } } .well3 { padding-top: 120px; padding-bottom: 80px; } .well4 { padding-top: 118px; padding-bottom: 125px; } .well5 { padding-top: 115px; padding-bottom: 110px; } .well6 { padding-top: 125px; padding-bottom: 135px; } @media (max-width: 979px) { .well1, .well3, .well4, .well5, .well6 { padding-top: 80px; padding-bottom: 80px; } } /*======================================================== FOOTER Styles =========================================================*/ footer { padding-top: 80px; padding-bottom: 40px; color: #fff; } * + footer .copy { margin-top: 35px; } footer .copy span, footer .copy a { white-space: nowrap; }