/* 04/08/15 INVISI font-family: 'Roboto', Helvetica, sans-serif; font-family: 'Roboto Condensed', Helvetica, sans-serif; */ html {overflow-x: hidden;} body {font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 1.4em; color: #5e6f7f; background-color: #ffffff;} #content-maxwidth { max-width:2091px; margin:0 auto;} ::selection {background: #768ea5; color:#fff} ::-moz-selection {background: #768ea5; color:#fff} .clear { clear:both} /* Typography */ a { color: #000; font-weight: 500;} a:hover { text-decoration: none; color: #5a8e22;} /* Buttons */ .btn {border: none; color: #fff; cursor: pointer; padding: 13px 22px; display: inline-block; letter-spacing:0.35pt; text-align:center; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-family:'Roboto', Helvetica, sans-serif; font-weight:400; font-size:1.2em; border-radius:7px;} .btn:active { border:none;} /* Home page */ #topheader { height:72px; background-color:#ffffff; position: fixed; top: 0; transition: top 0.2s ease-in-out; width: 100%; z-index: 100;} #topheader.sticky { /* reduced sticky header */ display:none } .phone { margin-top:27px; color:#7f8187; font-family: 'Roboto Condensed', sans-serif; font-size:1.7em; float:left; margin-right:20px} .phone img { margin-right:10px; margin-bottom:3px; vertical-align:middle} .topsocial { float:left; margin-top:22px} .topsocial ul { margin:0; padding:0} .topsocial ul li { display:inline-block; margin:0; padding:0; list-style:none; height:32px} .topsocial ul li.gplus a { width:32px; height:32px; background:url(../images/topnav-social.gif) top left no-repeat; display:block; margin-right:12px} .topsocial ul li.gplus a:hover { background:url(../images/topnav-social.gif) bottom left no-repeat} /*.topsocial ul li.pinterest a { width:32px; height:32px; background:url(../images/topnav-social.gif) -47px 0 no-repeat;display:block; margin-right:12px} .topsocial ul li.pinterest a:hover { background:url(../images/topnav-social.gif) -47px -32px no-repeat}*/ .topsocial ul li.facebook a { width:32px; height:32px; background:url(../images/topnav-social.gif) -47px 0 no-repeat;display:block; margin-right:12px } .topsocial ul li.facebook a:hover { background:url(../images/topnav-social.gif) -47px -32px no-repeat} .topsocial ul li.youtube a { width:32px; height:32px; background:url(../images/topnav-social.gif) -93px 0 no-repeat;display:block; margin-right:12px } .topsocial ul li.youtube a:hover { background:url(../images/topnav-social.gif) -93px -32px no-repeat} .topsocial ul li.instagram a { width:32px; height:32px; background:url(../images/topnav-social.gif) -139px 0 no-repeat; display:block; margin-right:12px } .topsocial ul li.instagram a:hover { background:url(../images/topnav-social.gif) -139px -32px no-repeat} .topsocial ul li.twitter a { width:32px; height:32px; background:url(../images/topnav-social.gif) -186px 0 no-repeat; display:block; margin-right:12px } .topsocial ul li.twitter a:hover { background:url(../images/topnav-social.gif) -186px -32px no-repeat} .toplogos { float:right;} .toplogos ul { margin:0; padding:0} .toplogos ul li { display:inline-block; margin:0; padding:0; list-style:none; height:72px} /*.toplogos ul li.invisi a { width:112px; height:72px; background:url(../images/logo-top-invisigard.gif) top left no-repeat; display:block; margin-right:10px} .toplogos ul li.alspec a { width:134px; height:72px; background:url(../images/logo-top-alspec.png) top left no-repeat; display:block; margin-right:12px} .toplogos ul li.carinya a { width:128px; height:72px; background:url(../images/logo-top-carinya.gif) top left no-repeat; display:block; margin-right:6px} .toplogos ul li.kidscreen a { width:128px; height:72px; background:url(../images/logo-top-kidscreen.gif) top left no-repeat; display:block; margin-right:0}*/ #topheader .header-buttons .btn {padding: 8px 22px; font-weight:500; font-size:1.25em; border-radius:7px;} #topheader .header-buttons ul li { display:inline-block; margin-left:10px; font-size:1em} #topheader .header-buttons ul li a.login { padding-left:49px} #topheader .header-buttons ul li a.login:hover { color:#fff; background-color:#7d8390} #topheader .header-buttons .btntext { margin:-12px 0 2px 12px; color:#adb3c0; font-family: 'Roboto', Helvetica, sans-serif; font-size:1em; } #topheader .header-buttons .btntext-mob { display:none} #header { background:url(../images/bg-header.jpg) top left repeat-x; height: 184px; position: fixed; top: 72px; transition: top 0.3s ease-in-out; width: 100%; z-index: 8000; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); border-bottom:none; } #header.sticky { /* reduced sticky header */ background:url(../images/bg-header-sticky.jpg) top left repeat-x; height:135px; position: fixed; /*height: 90px;*/ width: 100%; top:0; padding:0; margin:0 } #header h1#logo img {background-image:url(../images/invisi-logo.png); background-size:330px auto; background-repeat:no-repeat; width:310px; height:110px; margin-top:5px} #header.sticky h1#logo img { height:90px; width:230px; background-image:url(../images/invisi-logo-sm.png); background-size:230px auto; background-repeat:no-repeat; } h1#logo a { display:block !important} #logo { float: none; padding: 0;} .logo-container { float:left;/* background-color:#10D1AA*/ } .header-buttons { float:right; margin:15px 10px 0 0;} .header-buttons ul { margin:0; padding:0} .header-buttons ul li { display:inline-block; margin-left:10px; font-size:1.15em} .header-buttons ul li a.register { background-color:#3e4148; text-transform:uppercase; font-weight:500 } .header-buttons ul li a.login { background:#5a8e22 url(../images/icon-login.png) 18% 50% no-repeat; text-transform:uppercase; font-weight:500; padding-left:50px} .header-buttons ul li a.register:hover { color:#3e4148; background-color:#7d8390} .header-buttons ul li a.login:hover { color:#5a8e22; background-color:#8fca50} .header-dealer-locator { float:right; margin:15px 10px 0 0;} .header-buttons .btntext { margin:0 0 10px 15px; color:#adb3c0; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.05em} .header-buttons .btntext-mob { display:none} /*#header.sticky .header-buttons .btntext { margin:0 0 5px 15px; color:#adb3c0; font-family: 'Roboto', Helvetica, sans-serif; font-size:1em} #header.sticky .header-buttons .btntext-mob { display:none}*/ /* for sticky nav #header.sticky .header-buttons { float:right; margin:10px 10px 0 0;} #header.sticky .header-buttons .btn {padding: 10px 22px; font-weight:500; font-size:1.25em; border-radius:7px;} #header.sticky .header-buttons ul li { display:inline-block; margin-left:10px; font-size:1em} #header.sticky .header-buttons ul li a.login { padding-left:49px} #header.sticky .header-buttons ul li a.login:hover { color:#5a8e22; background-color:#8fca50}*/ /* WHEN LOGGED IN */ .header-loggedin { float:right; margin:10px 10px 0 0; width:50%;} .header-loggedin .right { float:right} .header-loggedin .right p { color:#3e4148; padding:15px 0 0 0; float:left} .header-loggedin span a.logout { text-transform:uppercase; font-weight:500; padding-left:20px; margin-left:20px; color:#a2a4a8; background-color:#3e4148; float:left} .header-loggedin span a.logout:hover { color:#5a8e22; background-color:#8fca50} /* for sticky nav*/ #header.sticky .header-loggedin { float:right; margin:17px 10px 0 0; width:60%;} /* Dealer seach form in header */ .dealersearch-header {} .dealersearch-header form p { font-size:1.2em !important; padding:10px 0 15px !important; color:#808a97 !important; font-weight:500 !important; font-family: 'Roboto', Helvetica, sans-serif;} .dealersearch-header form .dl-button { font-size:1.15em !important; color:#fff !important; padding:7px 11px; background-color:#5a8e22; border:1px solid #5a8e22; border-radius:6px;} .dealersearch-header form .dl-button:hover { color:#fff !important; background-color:#7d8390; border:1px solid #7d8390;} .dealersearch-header input { margin-bottom:10px; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; font-size: 1.2em; margin-right:5px; padding:8px 10px; color:#000; background-color:#808a97; border:none } .dealersearch-header select { margin-bottom:10px; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; font-size: 1.2em; margin-right:5px; padding:5px 7px; color:#000; background-color:#808a97; border:none } .dealersearch-header-mob { display:none} /* for sticky nav*/ #header.sticky .dealersearch-header form p { font-size:1.2em !important; padding:0px 0 11px !important; color:#a6b3c4 !important; font-weight:500 !important; font-family: 'Roboto', Helvetica, sans-serif;} /* Menu */ .mtop265 { margin-top:265px;} #menu-bg { position: fixed; top: 192px; width: 100%; z-index: 9000; height:74px; transition: top 0.3s ease-in-out; } #menu-bg.sticky {/* reduced sticky header */ top:90px; height:45px} #main-menu { float: none; margin-right:0; margin-top:0; height:64px; } #main-menu ul { list-style: none; padding: 0; margin: 0; line-height: 1; } #main-menu ul li { margin: 0; padding: 0; list-style:none } #main-menu > ul { position: relative; display: block; width: 100%; z-index: 500; } #main-menu > ul > li { display: block; position: relative; float: left; margin: 0; padding: 0; } #main-menu > ul > #menu-button { display: none; } #main-menu ul ul li.level2:nth-child(n+3) ul.level3 {top: -150px; } /* classic range */ /*#main-menu ul ul.level2 li:nth-child(n+1) ul.level4 li:nth-child(n+2) ul {top: -140px; } select range */ /*#main-menu ul ul.level2 li:nth-child(3) ul.level3 li:nth-child(n+3) ul {top: -100px; }*/ /*#main-menu ul ul.level2 li:nth-child(5) ul.level3 {top: -100px } #main-menu ul ul.level2 li:nth-child(n+5) ul.level3 li ul {top: 0px;}*/ /*#main-menu ul ul.level2 li:nth-child(n+5) ul.level3 li:nth-child(n+3) ul {top: -150px; } #main-menu ul ul.level2 li:nth-child(n+6) ul.level3 li ul {top: -320px;}*/ /* for sticky nav */ #main-menu.sticky > ul > li > ul { top: 45px;} #main-menu.sticky ul li a { display: block; font-family: 'Roboto', Helvetica, sans-serif; font-weight: 400; font-size: 1.15em; line-height: 1.4em; padding:12px 15px} #main-menu ul li a { display: block; font-family: 'Roboto', Helvetica, sans-serif; font-weight: 400; font-size: 1.2em; line-height: 1.4em; } #main-menu > ul > li > a { line-height: 64px; padding: 0px 16px; color: #ffffff; text-transform: uppercase; -webkit-transition: color 0.25s ease-out; -moz-transition: color 0.25s ease-out; -ms-transition: color 0.25s ease-out; -o-transition: color 0.25s ease-out; transition: color 0.25s ease-out; } #main-menu > ul > li.has-sub > a:hover { color: #ffffff; background-color:#5a8e22 } #main-menu > ul > li > a:hover, #main-menu > ul > li.active > a { color: #ffffff; background-color:#5a8e22 } #main-menu > ul > li > a:hover, #main-menu > ul > li:hover > a { color: #ffffff; background-color:#5a8e22} /* home & search icons */ #main-menu ul li.home a { background:url(../images/nav-home.png) 50% 50% no-repeat; width:57px; height:64px; position: relative; text-indent: -9999px; display:inline-block } #main-menu ul li.home a:hover { background:#5a8e22 url(../images/nav-home.png) 50% 50% no-repeat;} #main-menu ul li.search a { background:url(../images/nav-search.png) 50% 50% no-repeat; width:52px; height:64px; text-align:-9999px } #main-menu ul li.search a:hover { background:#5a8e22 url(../images/nav-search.png) 50% 50% no-repeat; } #main-menu.sticky ul li.home a { background:url(../images/nav-home1.png) 50% 55% no-repeat; width:50px; height:45px; text-align:-9999px } #main-menu.sticky ul li.home a:hover { background:#5a8e22 url(../images/nav-home1.png) 50% 55% no-repeat;} #main-menu.sticky ul li.search a { background:url(../images/nav-search1.png) 50% 55% no-repeat; width:48px; height:45px; text-align:-9999px } #main-menu.sticky ul li.search a:hover { background:#5a8e22 url(../images/nav-search1.png) 50% 55% no-repeat; } /* search form */ #main-menu .search-form { background-color:#4d515a; display:block; height:70px; width:470px; position:relative; left:-410px; padding:10px 0 10px 17px; } #main-menu .search-form input { background-color:#656870; padding:8px; color:#fff; border:none; width:376px; height:48px; font-style:italic; font-size:1.2em; float:left } #main-menu .search-form input.btn-go { background-color:#656870; color:#fff; border:none; width:50px; height:48px; font-style: normal; font-size:1.2em; float:left; margin-left:10px } #main-menu .search-form input.btn-go:hover { background-color:#5a8e22; color:#a1c579; -webkit-transition: color 0.25s ease-out; -moz-transition: color 0.25s ease-out; -ms-transition: color 0.25s ease-out; -o-transition: color 0.25s ease-out; transition: color 0.25s ease-out;} #main-menu ul ul li a:not(:only-child):after { position: absolute; top: 20%; right: 12px; font-family: 'icomoon'; speak: none; -webkit-font-smoothing: antialiased; content: "\f105"; color: #fff; font-size: 13px;} #indicatorContainer { position: absolute; height: 12px; width: 100%; bottom: 0px; overflow: hidden; z-index: -1; } #pIndicator { position: absolute; height: 0; width: 100%; border: 12px solid transparent; border-top-color: #2b2f3a; z-index: -2; -webkit-transition: left .25s ease; -moz-transition: left .25s ease; -ms-transition: left .25s ease; -o-transition: left .25s ease; transition: left .25s ease; } #cIndicator { position: absolute; height: 0; width: 100%; border: 12px solid transparent; border-top-color: #2b2f3a; top: -12px; right: 100%; z-index: -2; } #main-menu ul ul { position: absolute; left: -9999px; top:0px; margin-top:0; opacity: 0; -webkit-transition: opacity .4s ease, top .45s ease; -moz-transition: opacity .4s ease, top .45s ease; -ms-transition: opacity .4s ease, top .45s ease; -o-transition: opacity .4s ease, top .45s ease; transition: opacity .4s ease, top .45s ease; z-index: 1000; } #main-menu ul ul ul { top: 74px; } /* for sticky nav */ #main-menu.sticky ul ul ul { top: 45px; } #main-menu ul ul li { position: relative; } #main-menu > ul > li:hover > ul { left: auto; top: 64px; opacity: 1; } /* for sticky nav */ #main-menu.sticky > ul > li:hover > ul { left: auto; top: 45px; opacity: 1; display: block;} #main-menu ul ul li:hover > ul { left: 316px; top: 0; opacity: 1; display: block;} #main-menu ul ul li a { background: #5a8e22 /*green*/; color: #ffffff; border-right: none; border-bottom: none; padding: 12px 20px; font-size: 1em; font-weight:400; -webkit-transition: all .35s ease; -moz-transition: all .35s ease; -ms-transition: all .35s ease; -o-transition: all .35s ease; transition: all .35s ease; } #main-menu ul ul li:hover > a, #main-menu ul ul li.active a { background: #71a737 /*light green*/; color: #ffffff; border-right: none; } #main-menu ul ul li.active:hover { border-right: 0;} #main-menu ul ul li:last-child > a, #main-menu ul ul li.last > a { border-bottom: none; } #main-menu ul ul li.has-sub::after { border: 4px solid ; border-left-color: #9ea2a5; right: 10px; top: 12px; -moz-transition: all .2s ease; -ms-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease; } #main-menu ul ul li.has-sub:hover::after { border-left-color: #fff; right: -5px; -webkit-transform: rotateY(180deg); -ms-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); } #main-menu ul ul li.has-sub span {position: absolute; right: 10px; font-size: 9px; top: 15px;} #main-menu ul li.level2 { width:280px; } /*#main-menu ul.level2a { width:340px; }*/ /*#main-menu ul.level3 { width:315px; left:240px !important; background-color:#64992b; display: none; }*/ #main-menu > ul > li > ul > li a img { vertical-align:middle; margin-right:15px } #main-menu ul li.level2 a { font-size:1.3em; font-weight:400; border-bottom: 1px solid #78af3c; padding-bottom:12px } /*#main-menu ul.level4 li a { font-size:1.3em; border-bottom: 1px solid #78af3c;}*/ /* flyout */ #main-menu ul.level4 { width:280px; left:280px !important; display: none;} #main-menu ul.level4 li a img { padding-bottom:10px} #main-menu ul.level4 li a { background-color:#71a737; font-size:1.1em; line-height:1.3em; display:block; padding-bottom:20px} #main-menu ul ul li.level2:nth-child(n+4) ul.level4 li {top: -220px;} /* Responsive Menu */ #dl-menu {text-align: right; padding-top: 37px; margin-right: 80px; } .dl-menuwrapper { text-align: right !important; margin-right: 80px !important; padding-top: 36px; z-index: 1000; -webkit-perspective: 1000px; perspective: 1000px; -webkit-perspective-origin: 50% 200%; perspective-origin: 50% 200%; display: none; } .dl-menuwrapper:first-child { margin-right: 100px; } .dl-menuwrapper button { background: transparent; border: none; width: 28px; height: 28px; text-indent: -900em; overflow: hidden; position: relative; cursor: pointer; outline: none; padding: 0; /*top:-125px;*/ top:-20px; right:240px /* position of white button */ } .dl-menuwrapper li.search { display:none} .dl-menuwrapper button:hover, .dl-menuwrapper button.dl-active, .dl-menuwrapper ul { background: transparent; } .dl-menuwrapper button:after { content: ''; position: absolute; width: 100%; height: 4px; background: #ffffff; border-radius: 4px; left: 0; box-shadow: 0 8px 0 #ffffff, 0 16px 0 #ffffff; /* colour of white button */ } .dl-menuwrapper ul { padding: 0; list-style: none; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .dl-menuwrapper li { position: relative; background: #fafafa; border-bottom:1px solid #EEEEEE; } .dl-menuwrapper ul li.active { background:#5a8e22} .dl-menu span.icon-angle-right.pull-right { position: absolute; right: 10px; font-size: 11px; top: 20px;} .dl-menuwrapper li a { display: block; position: relative; padding: 15px 20px; font-size: 16px; line-height: 20px; font-weight: 300; color: #3d3d3d; outline: none; } .dl-menuwrapper li a.active {background: #eeeeee;} .dl-menuwrapper li a.active:hover { border-right: 0; } .no-touch .dl-menuwrapper li a:hover { background: rgba(255,248,213,1.0); } .dl-menuwrapper li.dl-back > a { padding-left: 30px; background: rgba(0,0,0,0.2); /* back button colour */ } .dl-menuwrapper li.dl-back:after, .dl-menuwrapper li > a:not(:only-child):after { position: absolute; top: 0; line-height: 50px; font-family: 'icomoon'; speak: none; -webkit-font-smoothing: antialiased; content: "\f105"; color: #3d3d3d; font-size: 22px; /* submenu arrow */ } .dl-menuwrapper li.dl-back:after { left: 10px; color: #3d3d3d; -webkit-transform: rotate(180deg); transform: rotate(180deg); } .dl-menuwrapper li > a:after { right: 10px; color: rgba(0,0,0,0.15); } .dl-menuwrapper .dl-menu { text-align: left; margin: 5px 0 0 0; position: absolute; width: 100%; opacity: 0; display:none; -webkit-transform: translateY(10px); transform: translateY(10px); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .dl-menuwrapper .dl-menu.dl-menu-toggle { transition: all 0.3s ease; } .dl-menuwrapper .dl-menu.dl-menuopen { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); width: 100%; position: absolute; left: 45px; margin: 0; /*top: 102px; */top: -20px !important; display: block; /* drop down position */ } /*#header.sticky .dl-menuwrapper button { top:0px !important}*/ /* Hide the inner submenus */ .dl-menuwrapper li .dl-submenu { display: none; } /* When a submenu is openend, we will hide all li siblings. For that we give a class to the parent menu called "dl-subview". We also hide the submenu link. The opened submenu will get the class "dl-subviewopen". All this is done for any sub-level being entered. */ .dl-menu.dl-subview li, .dl-menu.dl-subview li.dl-subviewopen > a, .dl-menu.dl-subview li.dl-subview > a { display: none; } .dl-menu.dl-subview li.dl-subview, .dl-menu.dl-subview li.dl-subview .dl-submenu, .dl-menu.dl-subview li.dl-subviewopen, .dl-menu.dl-subview li.dl-subviewopen > .dl-submenu, .dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li { display: block; } /* Dynamically added submenu outside of the menu context */ .dl-menuwrapper > .dl-submenu { position: absolute; width: 100%; top: 102px; left: 0; margin: 0; } /* Animation classes for moving out and in */ .dl-menu.dl-animate-out-1 { -webkit-animation: MenuAnimOut1 0.1s; animation: MenuAnimOut1 0.1s;/* animation effect */ } @-webkit-keyframes MenuAnimOut1 { 0% { } 50% { -webkit-transform: translateZ(-250px) rotateY(30deg); } 75% { -webkit-transform: translateZ(-372.5px) rotateY(15deg); opacity: .5; } 100% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } } @keyframes MenuAnimOut1 { 0% { } 50% { -webkit-transform: translateZ(-250px) rotateY(30deg); transform: translateZ(-250px) rotateY(30deg); } 75% { -webkit-transform: translateZ(-372.5px) rotateY(15deg); transform: translateZ(-372.5px) rotateY(15deg); opacity: .5; } 100% { -webkit-transform: translateZ(-500px) rotateY(0deg); transform: translateZ(-500px) rotateY(0deg); opacity: 0; } } .dl-menu.dl-animate-in-1 { -webkit-animation: MenuAnimIn1 0.3s; animation: MenuAnimIn1 0.3s; } @-webkit-keyframes MenuAnimIn1 { 0% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } 20% { -webkit-transform: translateZ(-250px) rotateY(30deg); opacity: 0.5; } 100% { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1; } } @keyframes MenuAnimIn1 { 0% { -webkit-transform: translateZ(-500px) rotateY(0deg); transform: translateZ(-500px) rotateY(0deg); opacity: 0; } 20% { -webkit-transform: translateZ(-250px) rotateY(30deg); transform: translateZ(-250px) rotateY(30deg); opacity: 0.5; } 100% { -webkit-transform: translateZ(0px) rotateY(0deg); transform: translateZ(0px) rotateY(0deg); opacity: 1; } } .dl-menuwrapper > .dl-submenu.dl-animate-in-1 { -webkit-animation: SubMenuAnimIn1 0.4s ease; animation: SubMenuAnimIn1 0.4s ease; } @-webkit-keyframes SubMenuAnimIn1 { 0% { -webkit-transform: translateX(50%); opacity: 0; } 100% { -webkit-transform: translateX(0px); opacity: 1; } } @keyframes SubMenuAnimIn1 { 0% { -webkit-transform: translateX(50%); transform: translateX(50%); opacity: 0; } 100% { -webkit-transform: translateX(0px); transform: translateX(0px); opacity: 1; } } .dl-menuwrapper > .dl-submenu.dl-animate-out-1 { -webkit-animation: SubMenuAnimOut1 0.4s ease; animation: SubMenuAnimOut1 0.4s ease; } @-webkit-keyframes SubMenuAnimOut1 { 0% { -webkit-transform: translateX(0%); opacity: 1; } 100% { -webkit-transform: translateX(50%); opacity: 0; } } @keyframes SubMenuAnimOut1 { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); opacity: 1; } 100% { -webkit-transform: translateX(50%); transform: translateX(50%); opacity: 0; } } /* No JS Fallback */ .no-js .dl-menuwrapper .dl-menu { position: relative; opacity: 1; -webkit-transform: none; transform: none; } .no-js .dl-menuwrapper li .dl-submenu { display: block; } .no-js .dl-menuwrapper li.dl-back { display: none; } .no-js .dl-menuwrapper li > a:not(:only-child) { background: rgba(0,0,0,0.1); } .no-js .dl-menuwrapper li > a:not(:only-child):after { content: ''; } /* fix mobile scrolling */ .dl-menuwrapper li.dl-back > a { padding-left: 30px; background: rgba(0,0,0,0.2); text-transform:uppercase; padding-top:13px /* back button colour */ } #dl-menu{ position: fixed; top: 160px; left: 20px; z-index: 9999; width:90% } #dl-menu.sticky { top: 18px; } .dl-menuwrapper { width: auto; } .dl-menuwrapper button { top: 0px; left: 0px; float: left; } .dl-menuwrapper .dl-menu.dl-menuopen { width: auto; left: -20px; /*left:0px;*/ top: 0px !important; overflow-y: scroll; position: relative; clear: both; } /* log in popup */ .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.7); transition: opacity 500ms; visibility: hidden; opacity: 0; } .overlay:target { visibility: visible; opacity: 1; } .popup { margin: 320px auto; padding: 20px 40px; background: #5a8e22; border:3px solid #a1c579; border-radius: 0; width: 30%; position: relative; -webkit-transition: color 0.5s ease-out; -moz-transition: color 0.5s ease-out; -ms-transition: color 0.5s ease-out; -o-transition: color 0.5s ease-out; transition: color 0.5s ease-out; z-index:8000 } .popup h4 { margin-top:40px; color: #fff; font-family: 'Roboto', Helvetica, sans-serif; font-size:3.5em; text-align:center; margin-bottom:35px } .popup .close { position: absolute; top: 15px; right: 20px; -webkit-transition: color 0.5s ease-out; -moz-transition: color 0.5s ease-out; -ms-transition: color 0.5s ease-out; -o-transition: color 0.5s ease-out; transition: color 0.5s ease-out; font-size: 30px; font-weight: bold; text-decoration: none; color: #000000; } .popup .close:hover { color: #000000; } .popup .popup-content { max-height: 30%; overflow: auto; padding-bottom:40px } .popup-contain { text-align:center; padding:0 40px; background-color:#B89A9A} .popup .popup-content input { background-color:#75a640; height:45px; width:100%; text-align:center; margin-bottom:20px; border:none; float:left; padding:8px 12px; font-size:1.4em; color:#fff; font-weight:500} .popup-buttons { text-align:center} a.popup-btn1 { border: 2px solid #437210; color: #437210; cursor: pointer; padding: 15px 80px 15px 52px; display: inline-block; letter-spacing:0.35pt; text-align:center; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-family:'Roboto', Helvetica, sans-serif; font-weight:500; font-size:1.9em; border-radius:7px; background:#fff url(../images/btn-arrow.png) 75% -71px no-repeat;} a:hover.popup-btn1 { border:2px solid #fff; color:#fff; background:#437210 url(../images/btn-arrow.png) 75% -3px no-repeat; } a.popup-btn2 { border: 2px solid #75a640; color: #fff; cursor: pointer; padding: 15px 70px 15px 40px; display: inline-block; letter-spacing:0.35pt; text-align:center; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-family:'Roboto', Helvetica, sans-serif; font-weight:400; font-size:1.5em; border-radius:7px; background:#437210 url(../images/btn-arrow.png) 84% -6px no-repeat;} a:hover.popup-btn2 { border:2px solid #437210; color:#437210; background:#fff url(../images/btn-arrow.png) 84% -74px no-repeat; } p.forgot { padding:20px 0 10px 0; font-size:1.2em} p.forgot a { color:#fff; text-decoration:underline; } p.forgot a:hover { text-decoration:none} p.or { color:#9fbd7f; margin-bottom:15px; font-size:1.2em} @media screen and (max-width: 700px){ .box{ width: 70%; } .popup{ width: 70%; } } /* Slideshow */ #slideshow { margin-top:255px} #slideshow.sticky { margin-top:135px} .tp-banner li { margin:0; padding:0; list-style:none} .tp-banner-container { border-bottom:18px solid #babbbf; clear:both} .tp-leftarrow.default, .tp-rightarrow.default { z-index: 100; width: 60px; background:#fff ; opacity: 0.5; filter: alpha(opacity=50); height: 60px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; border: 2px solid #fff; color:#4d515a; text-align: center; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .tp-leftarrow.default:before, .tp-rightarrow.default:before { font-family: 'icomoon'; line-height: 55px; width: 60px; font-size: 28px; } .tp-leftarrow.default:before { content: "\f104";} .tp-rightarrow.default:before { content: "\f105";} .tp-leftarrow.default:hover, .tp-rightarrow.default:hover {background: #4d515a; border-color:#fff; color:#fff; cursor:pointer} .tp-leftarrow.default { margin-left:20px; } .tp-rightarrow.default { margin-right:30px; } .tp-caption h2 { font-family: 'Roboto', Helvetica, sans-serif; font-size: 3.1em; line-height: 1.4em; font-weight:300; color: #ffffff !important; margin:0; padding:6px 15px; text-shadow: 2px 2px 3px #2f3033; background-color:rgba(47,51,58,0.7); } .tp-caption h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.7em; line-height: 1.45em; font-weight:300; color: #ffffff !important; text-shadow: 2px 2px 3px #2f3033; letter-spacing: 0.5px; padding:6px 15px; background-color:rgba(47,51,58,0.7); } .tp-caption a.slider-button { border: 2px solid #fff; color: #fff; cursor: pointer; padding: 15px 60px 15px 28px; display: inline-block; letter-spacing:0.35pt; text-align:center; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-family:'Roboto', Helvetica, sans-serif; font-weight:400; font-size:1.5em; border-radius:7px; background:#2f333a url(../images/btn-arrow.png) 85% -6px no-repeat;} .tp-caption a:hover.slider-button { border:2px solid #4d515a; color:#4d515a; background:#ffffff url(../images/btn-arrow.png) 85% -74px no-repeat; } .tp-caption a.slider-button2 { border: 2px solid #fff; color: #fff; cursor: pointer; padding: 15px 60px 15px 28px; display: inline-block; letter-spacing:0.35pt; text-align:center; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-family:'Roboto', Helvetica, sans-serif; font-weight:400; font-size:1.5em; border-radius:7px; background:#2f333a url(../images/btn-arrow.png) 93% -6px no-repeat;} .tp-caption a:hover.slider-button2 { border:2px solid #4d515a; color:#4d515a; background:#ffffff url(../images/btn-arrow.png) 93% -74px no-repeat; } a.box { background-color:#768ea5; border:1px solid #768ea5; border-radius:5px; font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; color:#ffffff; font-size:1.3em; letter-spacing:0; line-height:32px } a.box:hover { background-color:#ffffff; border:1px solid #768ea5; color:#768ea5; } /* END slideshow */ /* home pg intro */ .intro { text-align:center; color:#2a2a2a} .intro h2 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2.6em; font-weight:300; color:#2a2a2a; margin-bottom:10px; margin-top:35px} .intro p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.3em; line-height:1.5em; font-weight:300;} /* home pg product section */ .section-products { width:100%;} .section-products-mob { display:none} #prod1 { background:#000 url(../images/product1.png) 0 0 no-repeat;} #prod2 { background:#000 url(../images/product2.png) 0 0 no-repeat;} #prod3 { background:#000 url(../images/product3.png) 0 0 no-repeat;} #prod1, #prod2, #prod3 { position: relative; display: block; min-height: 400px;} #prod1 span, #prod2 span, #prod3 span { position: absolute; display: block; min-height: 400px; opacity: 1; -webkit-transition: all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; padding:205px 40px 20px 30px; text-align:right } .section-products span h1 img { vertical-align: middle; margin-right:12px; width:30px; height:auto} #prod1Link:hover #prod1, #prod2Link:hover #prod2, #prod3Link:hover #prod3 { background-position: 0 -520px; } .section-products a span h1 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2.4em; color:#fff !important; margin-bottom:10px; text-transform: uppercase; line-height:1em } .section-products a:hover span h1 { } .section-products a span p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.4em; font-weight:300; color:#fff !important; } .section-products a:hover span p { } /* home pg brands section */ .section-brands { width:100%;} #brand1 { overflow:hidden} #brand1 a { background:#041a0d; min-height:380px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:30px 50px 0 50px; } #brand1 a:hover { background:#041a0d } #brand1 p.btn-invisi { padding: 13px 62px 15px 28px; border:2px solid #fff; background:#5a8e22 url(../images/btn-arrow.png) 90% -10px no-repeat; font-size:1.4em; font-weight:300; margin-bottom:20px} #brand1 p:hover.btn-invisi { border:2px solid #5a8e22; background:#ffffff url(../images/btn-arrow.png) 90% -77px no-repeat; color:#041a0d !important} #brand1 p.btn-invisi-mob { display:none} #brand2 { overflow:hidden} #brand2 a { background:#74aac2 url(../images/bg-brand2.jpg) top left repeat-x; min-height:380px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:30px 63px 0 63px; } #brand2 a:hover { background:#74aac2 url(../images/bg-brand2.jpg) top left repeat-x } #brand2 p.btn-carinya { padding: 13px 62px 15px 28px; border:2px solid #fff; background:#5694af url(../images/btn-arrow.png) 90% -10px no-repeat; font-size:1.4em; font-weight:300; margin-bottom:20px} #brand2 p:hover.btn-carinya { border:2px solid #44829d; background:#ffffff url(../images/btn-arrow.png) 90% -77px no-repeat; color:#44829d !important} #brand2 p.btn-carinya-mob { display:none} #brand3 { overflow:hidden} #brand3 a { background:#041a0d; min-height:380px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:30px 60px 0 60px; } #brand3 a:hover { background:#041a0d } #brand3 p.btn-invisi { padding: 13px 62px 15px 28px; border:2px solid #fff; background:#5a8e22 url(../images/btn-arrow.png) 90% -10px no-repeat; font-size:1.4em; font-weight:300; margin-bottom:20px} #brand3 p:hover.btn-invisi { border:2px solid #5a8e22; background:#ffffff url(../images/btn-arrow.png) 90% -77px no-repeat; color:#041a0d !important} #brand3 p.btn-invisi-mob { display:none} .section-brands p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.4em; font-weight:300; color:#fff !important; padding:2px 0 15px 0 } /* home pg solutions section */ .section-solutions { width:100%;} #solution-bal40 a { background:#4d515a url(../images/bg-bal40-long.png) top center no-repeat; min-height:360px; width:100%; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:68px 60px 25px 60px;} /* home pg performance */ .bg-performance { width:100%; height:850px; background-image:url(../images/bg-performance.jpg); background-size:cover; border-bottom:19px solid #babbbf; margin-bottom:20px} .performance { background: url(../images/bg-feature.png); margin-top:125px; padding:55px 40px; display:block; border:2px solid #9da2aa} .performance p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.45em; font-weight:300; color:#000; margin-bottom:15px } .performance ul { margin-left:20px; padding:0} .performance ul li { list-style-type:disc; color:#000; margin-left:15px; margin-bottom:5px; } .performance ul li a { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.45em; font-weight:300; color:#000; list-style:disc; padding:0; margin:0; text-decoration:underline} .performance ul li a:hover { text-decoration:none} .performance-title {font-family: 'Roboto', Helvetica, sans-serif; font-size:2.8em; font-weight:300; padding-bottom:12px; color:#000; margin-bottom:7px} .performance-heading { font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; font-size:1.5em; padding-bottom:10px; color:#000; margin-bottom:10px } a.btn-performance { padding: 13px 62px 15px 28px; border:2px solid #3f434c; background:#5d626d url(../images/btn-arrow.png) 88% -9px no-repeat; font-size:1.4em; font-weight:300; color:#fff; margin-top:5px} a:hover.btn-performance { border:2px solid #5d626d; background:#ffffff url(../images/btn-arrow.png) 88% -77px no-repeat; color:#000 !important} /* 3 col solution panel - not live */ #solution1, #solution2, #solution3 { overflow:hidden} #solution1 a { background:#4d515a url(../images/bg-bal40.png) top right no-repeat; min-height:390px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:68px 60px 0 60px; } #solution1 a:hover { background:#4d515a url(../images/bg-bal40.png) top right no-repeat } #solution2 a { background:#4d515a url(../images/bg-316grade.png) top right no-repeat; min-height:390px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:68px 63px 0 63px; } #solution2 a:hover { background:#4d515a url(../images/bg-316grade.png) top right no-repeat } #solution3 a { background:#4d515a url(../images/bg-15yr.png) top right no-repeat; min-height:390px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:68px 60px 0 60px; } #solution3 a:hover { background:#4d515a url(../images/bg-15yr.png) top right no-repeat } .section-solutions p.solutions { padding: 13px 62px 15px 28px; border:2px solid #fff; background:#5d626d url(../images/btn-arrow.png) 91% -10px no-repeat; font-size:1.4em; font-weight:300; margin-bottom:20px;} .section-solutions p:hover.solutions { border:2px solid #3f434c; background:#ffffff url(../images/btn-arrow.png) 91% -77px no-repeat; color:#041a0d !important} .section-solutions p.solutions-mob { display:none} .section-solutions h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2.7em; color:#fff !important; margin-bottom:10px; } .section-solutions p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.4em; font-weight:300; color:#fff !important; padding:10px 0 24px 0 } .section-solutions img { vertical-align:middle; margin:0 14px 5px 0} @media (min-width: 993px) and (max-width: 1290px) { /* small screen size fix */ #solution1 a { background:#4d515a url(../images/bg-bal40.png) top right no-repeat; min-height:450px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:68px 60px 0 60px; } #solution2 a { background:#4d515a url(../images/bg-316grade.png) top right no-repeat; min-height:450px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:68px 63px 0 63px; } #solution3 a { background:#4d515a url(../images/bg-15yr.png) top right no-repeat; min-height:450px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:68px 60px 0 60px; } .section-solutions p.solutions { padding: 13px 50px 15px 20px; border:2px solid #fff; background:#5d626d url(../images/btn-arrow.png) 93% -10px no-repeat; font-size:1.3em; font-weight:300; margin-bottom:20px;} .section-solutions p:hover.solutions { border:2px solid #3f434c; background:#ffffff url(../images/btn-arrow.png) 93% -77px no-repeat; color:#041a0d !important} } /* home pg sections */ .bg-dealers { width:100%; background-image:url(../images/bg-dealers.jpg); background-size:cover; height:675px; border-bottom:19px solid #babbbf} .dealers { background: url(../images/bg-feature.png); margin-top:125px; padding:55px 40px; display:block; border:2px solid #9da2aa} .dealers p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.45em; font-weight:300; color:#000; margin-bottom:15px } .dealers-title {font-family: 'Roboto', Helvetica, sans-serif; font-size:2.8em; font-weight:300; padding-bottom:12px; color:#000; margin-bottom:7px} .dealers-heading { font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; font-size:1.5em; line-height:1.4em; padding-bottom:10px; color:#000; margin-bottom:10px } a.btn-dealers { padding: 13px 62px 15px 28px; border:2px solid #3f434c; background:#5d626d url(../images/btn-arrow.png) 88% -9px no-repeat; font-size:1.4em; font-weight:300; color:#fff; margin-top:5px} a:hover.btn-dealers { border:2px solid #5d626d; background:#ffffff url(../images/btn-arrow.png) 88% -77px no-repeat; color:#000 !important} .bg-professionals { width:100%; background-image:url(../images/bg-professionals1.jpg); height:850px; background-size:cover; border-bottom:19px solid #babbbf;} .professionals { background: url(../images/bg-feature.png); margin-top:125px; padding:55px 40px; display:block; border:2px solid #9da2aa} .professionals p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.45em; font-weight:300; color:#000; margin-bottom:15px } .professionals-title {font-family: 'Roboto', Helvetica, sans-serif; font-size:2.6em; line-height:1.1em; font-weight:300; padding-bottom:12px; color:#000; margin-bottom:7px} .professionals-heading { font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; font-size:1.5em; padding-bottom:10px; color:#000; margin-bottom:10px } a.btn-professionals { padding: 13px 61px 15px 28px; border:2px solid #3f434c; background:#5d626d url(../images/btn-arrow.png) 90% -9px no-repeat; font-size:1.4em; font-weight:300; color:#fff; margin-top:5px} a:hover.btn-professionals { border:2px solid #5d626d; background:#ffffff url(../images/btn-arrow.png) 90% -77px no-repeat; color:#000 !important} .bg-brochure { width:100%; background-image:url(../images/bg-brochure.jpg); height:675px; background-size:cover; border-bottom:19px solid #babbbf; margin-bottom:20px} .brochure { margin-top:125px; padding:55px 20px; display:block; } .brochure p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.45em; font-weight:300; color:#fff; margin-bottom:15px } .brochure-title {font-family: 'Roboto', Helvetica, sans-serif; font-size:2.6em; line-height:1.1em; font-weight:300; padding-bottom:12px; color:#fff; margin-bottom:7px} .brochure-heading { font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; font-size:1.5em; padding-bottom:10px; color:#fff; margin-bottom:10px; } a.btn-brochure { padding: 13px 61px 15px 28px; border:2px solid #000; background:#ffffff url(../images/btn-arrow.png) 90% -77px no-repeat; font-size:1.4em; font-weight:500; color:#000; margin-top:15px} a:hover.btn-brochure { border:2px solid #3f434c; background:#5d626d url(../images/btn-arrow.png) 90% -9px no-repeat; color:#fff !important} a.btn-brochure-mob { display:none} /* home pg solutions section .section-media { width:100%;} #media1 a { background:#eeeef0 url(../images/media-connected.jpg) top left no-repeat; min-height:685px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:425px 60px 40px 60px; } #media1 a:hover { background:#eeeef0 url(../images/media-connected.jpg) top left no-repeat } #media2 a { background:#eeeef0 url(../images/media-enews.jpg) top left no-repeat; min-height:685px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:425px 63px 40px 63px; } #media2 a:hover { background:#eeeef0 url(../images/media-enews.jpg) top left no-repeat } #media3 a { background:#eeeef0 url(../images/media-youtube.jpg) top left no-repeat; min-height:685px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:425px 60px 40px 60px; } #media3 a:hover {background:#eeeef0url(../images/media-youtube.jpg) top left no-repeat; } .section-media p.btn-media-mob { display:none} .section-media p.btn-media { padding: 13px 62px 15px 28px; border:2px solid #5d626d; background:#ffffff url(../images/btn-arrow.png) 90% -76px no-repeat; font-size:1.4em; font-weight:300; color:#000 !important} .section-media p:hover.btn-media { border:2px solid #5d626d; background:#5d626d url(../images/btn-arrow.png) 90% -9px no-repeat; color:#fff !important} .section-media h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2.7em; color:#000 !important; margin-bottom:7px; } .section-media p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.4em; font-weight:300; color:#000 !important; padding:10px 0 24px 0 } .section-media img { vertical-align:middle; margin:0 14px 7px 0}*/ /* Footer */ .footer { padding-top:15px; background-color:#090a0a; padding-bottom:50px } .footer h3 {font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; font-size:2em; margin:15px 0 10px 0; color:#374e66} .footer p {color: #768ea5;} .footer-social { margin-top:22px; text-align:center} .footer-social ul { margin:0; padding:0} .footer-social ul li { display:inline-block; margin:0; padding:0; list-style:none; height:53px} .footer-social ul li.gplus a { width:53px; height:53px; background:url(../images/footer-gplus.gif) top left no-repeat; display:block; margin-right:40px} .footer-social ul li.gplus a:hover { background:url(../images/footer-gplus.gif) bottom left no-repeat} /*.footer-social ul li.pinterest a { width:53px; height:53px; background:url(../images/footer-pinterest.gif) top left no-repeat; display:block; margin-right:70px} .footer-social ul li.pinterest a:hover { background:url(../images/footer-pinterest.gif) bottom left no-repeat}*/ .footer-social ul li.youtube a { width:53px; height:53px; background:url(../images/footer-youtube.gif) top left no-repeat; display:block;margin-right:40px } .footer-social ul li.youtube a:hover { background:url(../images/footer-youtube.gif) bottom left no-repeat} .footer-social ul li.facebook a { width:53px; height:53px; background:url(../images/footer-facebook.gif) top left no-repeat; display:block; margin-right:40px } .footer-social ul li.facebook a:hover { background:url(../images/footer-facebook.gif) bottom left no-repeat} .footer-social ul li.instagram a { width:53px; height:53px; background:url(../images/footer-instagram.gif) top left no-repeat; display:block; margin-right:40px } .footer-social ul li.instagram a:hover { background:url(../images/footer-instagram.gif) bottom left no-repeat} .footer-social ul li.twitter a { width:53px; height:53px; background:url(../images/footer-twitter.gif) top left no-repeat; display:block;} .footer-social ul li.twitter a:hover { background:url(../images/footer-twitter.gif) bottom left no-repeat} ul.footer-links1 { margin-top:25px; margin-bottom:15px; padding:0; text-align:center; font-family: 'Roboto', Helvetica, sans-serif;} ul.footer-links1 li { margin:0; padding:0; font-size:1.2em; display:inline-block; letter-spacing:0.02em} ul.footer-links1 li a { padding:0 10px; color:#fff; text-decoration:none; font-weight:700; } ul.footer-links1 li a:hover { color:#5a8e22; text-decoration:none } ul.footer-links2 { margin-top:0; margin-bottom:25px; padding:0; text-align:center; font-family: 'Roboto', Helvetica, sans-serif;} ul.footer-links2 li { margin:0; padding:0; font-size:1.1em; display:inline-block; letter-spacing:0.02em} ul.footer-links2 li a { padding:0 8px; color:#fff; text-decoration:none; font-weight:400; } ul.footer-links2 li a:hover { color:#5a8e22; text-decoration:none } .address { font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; text-align:center} .address p { color:#fff; font-size:1.1em; line-height:1.5em} .address p a { color:#5a8e22; text-decoration:none} .address p a:hover {text-decoration:underline} .address p span { color:#5a8e22; font-size:1em; font-weight:500} .copyright { font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.1em; line-height:1.4em; text-align:center; padding:15px 0 10px} .copyright p { color: #000000;} .copyright .sonic a { font-family: 'Roboto', Helvetica, sans-serif; font-size: 1em; color: #969696; text-decoration:none; font-weight:300} .copyright .sonic a:hover { text-decoration:underline} .footerlinks { font-family: 'Roboto', Helvetica, sans-serif; text-align:center; padding:30px 15px 10px; color: #000000; font-weight:300; font-size: 1em;} .footerlinks ul { margin:0; padding:0} .footerlinks ul li { margin:0; padding:0} .footerlinks ul li h2 span a { font-size:1.2em; line-height:1.3em; font-weight:500; padding-bottom:4px} .footerlinks ul li h2 { font-size:1.1em; line-height:1.3em; font-weight:300; padding-bottom:6px} .footerlinks ul li h2 a { color: #000000; text-decoration:none; font-weight:300; } .footerlinks ul li h2 a:hover { text-decoration:underline } ul#footer-logos { padding: 22px 0 30px 45px; text-align: center; float:center} ul#footer-logos li { display: inline; margin-right:35px; list-style:none} /* .desktop-switch a {font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; text-transform:uppercase; font-size: 1em; color: #768ea5; line-height: 1.4em; text-decoration:none; } .desktop-switch a:hover {text-decoration:underline}*/ /* Back to top button */ #back-top { position: fixed; bottom: 60px; right: 0; background-color: rgba(62, 65, 72, 0.6); border-radius: 4px; border-bottom: none; } #back-top a { color: #ffffff; padding: 6px 11px; line-height: 34px; font-size:28px; font-weight: normal} #back-top:active { border-bottom: none;} .dealersearch-home { } .dealersearch-home form input { height:40px; padding:6px; width:370px; background-color:#9399a4; border:1px solid #3f434c; font-size:1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300 !important; border-radius:3px; color:#fff !important ; margin-bottom:8px} .dealersearch-home form .dealer-button { background-color:#5d626d; height:40px; width:110px; font-size:1.3em; color:#fff ; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300 !important; border:1px solid #3f434c; border-radius:3px} .dealersearch-home form .dealer-button:hover { background-color:#9399a4 ; } img.leftmap { float:left; margin-right:8px; vertical-align: bottom; margin-top:-5px} /* Carinya website all pages ------------------------------------------------------------------------------------------------ */ .section-forms { width:100%;} #header1 { margin-top:255px; width:100%; border-bottom:14px solid #babbbf; margin-bottom:0; background-color:#babbbf } #header1 img { width:100%; height:auto; padding-bottom:0 !important; margin:0 } /* professionals home pg specify section */ .section-specify { width:100%;} #specify1, #specify2, #specify3, #specify4 { overflow:hidden } #specify1 a { background:url(../images/specify1.jpg) top left no-repeat; min-height:260px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:45px 60px 0 60px; cursor: auto; text-decoration:none } #specify1 a:hover { background:url(../images/specify1.jpg) top left no-repeat; text-decoration:none } #specify2 a { background:url(../images/specify2.jpg) top left no-repeat; min-height:260px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:45px 60px 0 60px; cursor: auto; text-decoration:none } #specify2 a:hover { background:url(../images/specify2.jpg) top left no-repeat; text-decoration:none } #specify3 a { background:url(../images/specify3.jpg) top left no-repeat; min-height:260px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:45px 60px 0 60px; cursor: auto; text-decoration:none } #specify3 a:hover { background:url(../images/specify3.jpg) top left no-repeat; text-decoration:none } #specify4 a { background:url(../images/specify4.jpg) top left no-repeat; min-height:260px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; padding:45px 60px 0 60px; cursor: auto; text-decoration:none } #specify4 a:hover { background:url(../images/specify4.jpg) top left no-repeat; text-decoration:none } .section-specify p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.4em; font-weight:300; color:#fff !important; padding:10px 0 24px 0 } .section-specify h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2.3em; color:#fff !important; margin-bottom:10px; } /* professionals pg login form */ .section-forms { margin-bottom:30px; padding:0 0 0 0} .section-forms h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2.3em; color:#2a2a2a; margin-bottom:15px; text-align:center } .section-forms p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.5em; font-weight:300; color:#2a2a2a; padding:5px 60px 24px 60px; text-align:center } .prof-login { text-align:center; padding:10px 40px 0; } .prof-login form { text-align:center} .prof-login input { background-color:#e4e5e8; height:45px; width:70%; text-align:center; margin-bottom:20px; border:none; padding:8px 12px; font-size:1.4em; color:#32353c; font-weight:500; border:1px solid #32353c; } .prof-login-buttons { text-align:center} .prof-login-buttons a.popup-btn3 { border: 2px solid #32353c; color: #32353c; cursor: pointer; padding: 15px 70px 15px 40px; display: inline-block; letter-spacing:0.35pt; text-align:center; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-family:'Roboto', Helvetica, sans-serif; font-weight:400; font-size:1.5em; border-radius:7px; background:#babbbf url(../images/btn-arrow.png) 78% -6px no-repeat;} .prof-login-buttons a:hover.popup-btn3 { border:2px solid #32353c; color:#32353c; background:#fff url(../images/btn-arrow.png) 78% -74px no-repeat; } .prof-login-buttons a.popup-btn4 { border: 2px solid #32353c; color: #32353c; cursor: pointer; padding: 15px 70px 15px 40px; display: inline-block; letter-spacing:0.35pt; text-align:center; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-family:'Roboto', Helvetica, sans-serif; font-weight:400; font-size:1.5em; border-radius:7px; background:#babbbf url(../images/btn-arrow.png) 84% -6px no-repeat;} .prof-login-buttons a:hover.popup-btn4 { border:2px solid #32353c; color:#32353c; background:#fff url(../images/btn-arrow.png) 84% -74px no-repeat; } p.forgot { padding:20px 0 10px 0; font-size:1.1em} p.forgot a { color:#2a2a2a; text-decoration:underline; } p.forgot a:hover { text-decoration:none} /* product page subnav */ .section-productgroups { width:100%;} #productgroup1, #productgroup2, #productgroup3, #productgroup4, #productgroup5, #productgroup6, #productgroup7, #productgroup8, #productgroup9, #productgroup10 { overflow:hidden } #productgroup1 a { background:#35383f; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none; margin-bottom:20px; cursor:auto } #productgroup1 a:hover { background:#35383f; text-decoration:none } #productgroup2 a { background:url(../images/productgroup1.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none;/* margin-bottom:20px*/ } #productgroup2 a:hover { background:url(../images/productgroup1.jpg) top left no-repeat; text-decoration:none } #productgroup3 a { background:url(../images/productgroup2.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none;/* margin-bottom:20px*/ } #productgroup3 a:hover { background:url(../images/productgroup2.jpg) top left no-repeat; text-decoration:none } #productgroup4 a { background:url(../images/productgroup3.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none;/* margin-bottom:20px*/ } #productgroup4 a:hover { background:url(../images/productgroup3.jpg) top left no-repeat; text-decoration:none } #productgroup5 a { background:url(../images/productgroup4.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none; /* margin-bottom:20px*/ } #productgroup5 a:hover { background:url(../images/productgroup4.jpg) top left no-repeat; text-decoration:none } #productgroup6 a { background:url(../images/productgroup5.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none; /* margin-bottom:20px*/} #productgroup6 a:hover { background:url(../images/productgroup5.jpg) top left no-repeat; text-decoration:none } /* Select Range */ #productgroup7 a { background:#35383f; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none; margin-bottom:20px; cursor:auto } #productgroup7 a:hover { background:#35383f; text-decoration:none } #productgroup8 a { background:url(../images/productgroup8.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none; /* margin-bottom:20px*/} #productgroup8 a:hover { background:url(../images/productgroup8.jpg) top left no-repeat; text-decoration:none } #productgroup9 a { background:url(../images/productgroup9.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none; /* margin-bottom:20px*/} #productgroup9 a:hover { background:url(../images/productgroup9.jpg) top left no-repeat; text-decoration:none } #productgroup10 a { background:url(../images/productgroup10.jpg) top left no-repeat; min-height:215px; width:auto; display:block; text-align:center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; text-decoration:none; /* margin-bottom:20px*/} #productgroup10 a:hover { background:url(../images/productgroup10.jpg) top left no-repeat; text-decoration:none } /* subnav text */ .section-productgroups a span h3 { width:100%; background-color: rgba(49,52,59,0.6); display:block; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.3em; line-height:1.2em; font-weight:400; color:#fff !important; padding:12px 10px;} .section-productgroups a:hover span h3 { background-color:rgba(130,201,234,0.8) } #productgroup1 a:hover span h3, #productgroup7 a:hover span h3 { background-color:#35383f } .section-productgroups #productgroup1 a span h3, .section-productgroups #productgroup7 a span h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.5em; font-weight:400; color:#fff !important; padding-top:90px} /* breadcrumbs */ .breadcrumbs { text-align:right; width:100%; padding:15px 0 15px 0; } .breadcrumbs ul { padding:0; margin-right:50px} .breadcrumbs ul li { padding:0; margin:0; display:inline} .breadcrumbs a { color:#818181; text-decoration:none; text-align:right; padding:0 5px} .breadcrumbs a:hover { text-decoration:underline} /* product page content */ .section-productpg { padding-left:50px; padding-right:50px} .tabs { } .tabs ul { margin-bottom:20px !important; padding:0 } .tabs ul li { display:inline-block; background-color:#cdddbc; margin:0 } .tabs ul li a { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.3em; font-weight:400; color:#35383f; text-decoration:none; padding:20px 16px; display:block } .tabs ul li a:hover { color:#35383f; text-decoration:none; background-color:#79a34c; display:block} .product-content { padding-bottom:50px} .product-content img { width:auto; height:auto;} .product-content p {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em; line-height: 1.5em; font-weight:300; color: #5e6f7f; margin-bottom:18px} .fabricators-content { padding-bottom:50px} .fabricators-content img { width:auto; height:auto;} .fabricators-content p {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em; line-height: 1.5em; font-weight:300; color: #5e6f7f; margin-bottom:18px} /************ content main page titles */ .product-content h2, .fabricators-content h2, .product-range h2, .section-general h2 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2.6em; font-weight:300; color:#2a2a2a; margin-bottom:20px; } .product-content h1, .fabricators-content h1, .section-general h1 { font-family: 'Roboto', Helvetica, sans-serif; font-size:2em; font-weight:300; color:#2a2a2a; margin-bottom:28px; } .section-general h1.sm { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.8em; font-weight:300; color:#2a2a2a; margin-bottom:12px; } /************ content page subheadings */ .product-content h3, .fabricators-content h3, .section-general h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.4em; font-weight:500; color: #2a2a2a; line-height:1.4em; margin-bottom:8px } .brochure-col { margin-top:50px; } .brochures { text-align:center; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.3em; margin-bottom:30px; line-height:1.3em } .brochures img { margin-bottom:8px; width:100%; height:auto; border:1px solid #babbbf } .brochures img.noborder { margin-bottom:8px; width:100%; height:auto; border:none} .brochure-col p { font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em !important; line-height: 1.5em; font-weight:300} .brochures a:hover { color:#7d7e86} img.left { float:left; margin-right:22px} img.right { float:right; margin-left:22px} img.right1 { float:right; margin-bottom:25px} img.leftmap { float:left; margin-right:8px; vertical-align: bottom; margin-top:-5px} /*img#tablet2 { width:auto} img#tablet3 { width:auto}*/ img.imgleft { float:left; margin-right:25px; border:1px solid #babbbf;} img.imgright { float:right; margin-left:25px; border:1px solid #babbbf;} img.imgleft2 { float:left; margin-right:25px; padding-top:10px} .breakout {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.3em; line-height: 1.5em; font-weight:500; color: #75ac30; margin-bottom:18px;} /*product range page */ #content { } .section-productrange { padding-left:0px !important; padding-right:0px; width:100%; } /*.section-productrange { padding-left:50px; padding-right:0px; width:105%; margin-left:-55px;}*/ .product-range { } .product-range ul { margin-top:30px; margin-bottom:30px; padding:0; text-align:center} .product-range ul li { display:inline-block; margin-bottom:25px; padding:0; width:340px; margin-right:20px; vertical-align:top; margin-bottom:50px} .product-range ul li a { text-decoration:none} .product-range ul li a:hover, .product-range ul li a:visited { color:#000} .product-range ul li img { border:1px solid #34373e; margin-bottom:8px; width:100%; height:auto} .product-range ul li h1 { color:#34373e; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.5em; font-weight:400; line-height:1.4em; margin-bottom:10px; margin-top:3px} .product-range ul li p, .product-range p { color:#34373e; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.1em; font-weight:300; line-height:1.3em } .product-range h4 {text-align:center; margin-bottom:5px; } .center { text-align:center; font-size:1em; } .center p { margin-bottom:20px; line-height:1.4em } p.center { margin-bottom:20px} .center1 { margin:0 auto} .button-productrange { padding:12px; background-color:#babbbf; border-radius:8px; width:100%; margin-top:20px; color:#34373e; font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; font-size:1.2em; cursor: pointer } .button-productrange:hover { background-color:#5a8e22; text-decoration:none; color:#fff} .page-links { margin-right:50px; padding-top:15px; text-align:center; background-color:#edf7fc; min-height:460px; margin-bottom:20px} .page-links img { margin-bottom:0px; width:95%; height:auto; border:1px solid #babbbf} .page-links h2 {font-family: 'Roboto', Helvetica, sans-serif; font-size:1.3em; font-weight:500; margin:10px 0 5px; line-height:1.2em; color:#2a2a2a;} .page-links a { color: #5e6f7f; text-decoration:underline; font-weight:300;} .page-links a:hover { text-decoration:none;} .tabs #topten { background-color:#edf7fc; padding:15px} .tabs #topten ol { margin-top:8px; padding:0; list-style:decimal } .tabs #topten ol li { padding-bottom:12px; margin-left:25px; padding-left:5px; font-size:1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; line-height:1.3em; } .tabs ul.specs, .tabs ol.specs {margin-top:8px; padding:0; list-style: disc} .tabs ul.specs li, .tabs ol.specs li { background:none; margin-left:25px; padding-left:5px; font-size:1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; line-height:1.3em; display:list-item; margin-bottom:10px; height:auto} p strong { font-weight:500} .line { border-bottom:1px dotted #b6bec5; margin:25px 0; width:100%} .line1 { border-bottom:1px dotted #b6bec5; margin:15px 0; width:100%} .section-general {padding-left:80px; padding-right:60px; padding-bottom:30px} .section-general p {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em; line-height: 1.5em; font-weight:300; color: #5e6f7f; margin-bottom:18px} .section-general ul, .section-general ol {margin-left:45px; margin-bottom:20px } .section-general ul li {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em; line-height: 1.5em; font-weight:300; color: #5e6f7f; list-style: disc; padding-bottom:3px } .section-general ol li {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em; line-height: 1.5em; font-weight:500; color: #000; list-style: decimal; padding-bottom:3px } ol.norm {margin-left:45px; margin-bottom:20px } ol.norm li {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em; line-height: 1.5em; font-weight:300; color: #5e6f7f; list-style: decimal; padding-bottom:3px } ol.norm li a {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1em; line-height: 1.5em; font-weight:300; color: #5e6f7f; text-decoration:none} ol.norm li a:hover { color:#70badc; text-decoration:underline} ol.norm2 {margin-left:45px; margin-bottom:20px } ol.norm2 li {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.2em; line-height: 1.5em; font-weight:300; color: #5e6f7f; list-style: decimal; padding-bottom:3px } ol.norm2 li a {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1em; line-height: 1.5em; font-weight:300; color: #5e6f7f; text-decoration:underline} ol.norm2 li a:hover { color:#70badc; text-decoration:none} ul.norm {margin-left:45px; margin-bottom:20px } ul.norm li a {font-family: 'Roboto', Helvetica, sans-serif; font-size: 1em; line-height: 1.5em; font-weight:300; color: #5e6f7f; list-style: decimal; padding-bottom:3px; text-decoration: underline } ul.norm li a:hover { text-decoration: none } .float-right { float:right; margin-left:30px} .bal40-row { clear:left; border-bottom:1px dotted #b6bec5; display:block; width:90%; } .bal40-row p { float:left; width:250px; padding:15px 0; margin-bottom:0 } .bal40-row p.desc { width: 700px; } .links { padding:15px 0; border-bottom:1px dotted #ccc; width:80%; margin-bottom:15px} .links img { float:left; margin-right:30px; border:none; } .links h3 { line-height:1.3em} /* registration form */ .reg-form { background-color:none; margin-top:-40px } .reg-form td { height:55px;} .reg-form input, .reg-form select { background-color:#d7d8d9; border:1px solid #b3b4b8 !important; height:45px; border:none; padding:6px 10px; font-size:1.4em; color:#35383f; font-weight:300 !important; width:500px } .reg-form input:focus, .reg-form select:focus { background-color:#b3b4b8} .reg-form input:hover.reg-button { background-color: #b3b4b8 !important} /* my account form */ .reg-form2 { padding-top:0px; background-color:none; margin:0 auto } .reg-form2 td { height:38px; } .reg-form2 input { background-color:#c8e3f0; border:1px solid #abd0e1 !important; height:45px; border:none; padding:6px 10px; font-size:1.4em; color:#35383f; font-weight:300 !important; width:500px } .reg-form2 select { background-color:#c8e3f0; border:1px solid #abd0e1 !important; height:45px; border:none; padding:6px 10px; font-size:1.4em; color:#35383f; font-weight:300 !important; } .reg-form2 input:focus, .reg-form2 select:focus { background-color:#7bc7eb;} .reg-form2 input.reg-button { background-color: #c8e3f0 !important; width:150px} .reg-form2 input:hover.reg-button { background-color: #7bc7eb !important;} /* search results */ .sisea-result { padding-bottom:15px; border-bottom:1px dotted #ccc; margin-bottom:15px; } .sisea-result h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.4em; font-weight:500; color: #000;} .sisea-result .extract p { font-style:italic} p.sisea-results { padding:25px 0; font-size:1.5em} .sisea-paging { margin-bottom:20px} .sisea-search-form input { background-color:#91bc62; border:1px solid #5a8e22 !important; height:45px; border:none; padding:6px 10px; font-size:1.4em; color:#000; font-weight:300 !important; margin-right:4px } .sisea-search-form label {font-family: 'Roboto', Helvetica, sans-serif; font-size:1.4em; font-weight:500; color: #000; margin-right:4px} /* components of windows and doors .anatomybox { padding: 21px 0px; margin-top:10px; } .anatomybox .description { padding-left:8px } .anatomybox h2 { font-size:1.9em} .anatomybox .description h1 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.4em; color:#2a2a2a !important; margin-bottom:0px; font-weight:500; } */ /* contact us */ #contactmap { float: left; background: url('/images/map-australia1.jpg') top left no-repeat; width: 392px; height: 342px; position: relative; } #contactform { } #contactform fieldset { border: none; margin-bottom: 1em; padding: 0; } #contactform label { float: left; width: 200px; font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; } #contactform label.label-long { width:280px; margin-bottom:5px} #contactform label1 { float: left; /*width: 200px;*/ font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300;} #contactform br { clear: left; } #contactform input, #contactform select { float: left; margin-bottom:10px; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; font-size: 1.2em; margin-right:10px; padding:3px } #contactform input.check { float:left; margin-right:10px; border:1px solid #000; display:block !important; font-size:2em} #contactform legend { margin-bottom: 1em; font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:500 } #contactform .contact-thankyou { height: 310px; } #contactform textarea { width: 80%; font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300 } #contactform #contactformsubmit { color:rgba(0,0,0,1.00); font-weight:300; padding:3px} input[type="checkbox"] { -webkit-appearance: checkbox; border-radius: 0; } .con1, .con2, .con3, .con4, .con5, .con6, .con7, .con8, .con9 { position: relative; padding: 5px 0 5px 5px; width: 60px; color: #000; height: 20px; position: absolute; } .cont1, .cont2, .cont3, .cont4, .cont5, .cont6, .cont7, .cont8, .cont9 { float: left; width: 400px; line-height: 1.4em; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; font-weight:300 } .con1 { top: 30px; left: 100px; } .con2 { top: 169px; left: 320px; width: 70px; } .con3 { top: 206px; left: 300px; width: 90px; } .con4 { top: 226px; left: 287px; width: 70px; } .con5 { top: 254px; left: 250px; width: 85px; } .con6 { top: 222px; left: 140px; width: 80px; } .con7 { top: 204px; left: 35px; } .con8 { top: 95px; left: 278px; width: 80px; } .con9 { top: 70px; left: 270px; width:65px; } a.register { background-color:#3e4148; text-transform:uppercase; font-weight:500; margin-bottom:10px } a.login { background:#5a8e22 url(../images/icon-login.png) 18% 50% no-repeat; text-transform:uppercase; font-weight:500; padding-left:50px; margin-bottom:10px} a.register:hover { color:#3e4148; background-color:#7d8390} a.login:hover { color:#3e4148; background-color:#7d8390} .dealersearch { } .dealersearch form p { font-size:1.2em !important; padding-bottom:15px !important; color:#5e6f7f !important} .dealersearch form input#addsearch { font-size:1.1em !important; padding:4px 8px; color:#5e6f7f } .dealersearch form .dealerlocatorbutton { font-size:1.1em !important; padding:3px 8px; color:#000 !important} .result { padding:15px 0} .login-form {margin-top:20px;} .login-form input { margin-bottom:10px; padding:3px; font-size: 1.1em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; width: 240px;} .login-form input[type="reset"], .login-form input[type="submit"] {width: auto;} .login-form label { font-size: 1.1em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; } .login-form .submit-login {font-size: 1.1em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; padding:8px; color:#000} .login-form select { margin-bottom:10px; width: 240px; height: 33px;} .fab-login {margin-top:20px;} .fab-login input { margin-bottom:10px; padding:8px; font-size: 1.1em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; width: 240px;} .fab-login label { font-size: 1.1em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; } .fab-login .submit-login {font-size: 1.1em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; padding:8px; color:#000} /* privacy page anchor links with padding for header */ #one, #two, #three, #four, #five, #six, #seven, #eight { margin-top:-165px; padding-top:165px; font-size:1px} /*#tab-2558 {margin-top:-375px; padding-top:375px; } #tab-2557 {margin-top:-375px; padding-top:375px; }*/ @media (min-width: 992px) and (max-width: 1280px) { #tab-2558 {margin-top:-1410px; padding-top:1410px; } #tab-2557 {margin-top:-775px; padding-top:775px; } h1.sm { line-height:1.3em} h3 { line-height:1.2em; margin-bottom:8px} .section-general {padding-left:40px; padding-right:40px} } /* fabricators subnav */ .fab-subnav { } .fab-subnav ul { margin:0; padding:0} .fab-subnav ul li {margin:0; padding:0} .fab-subnav ul li a {padding:18px 10px; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; font-weight:500; display:block; border-bottom:1px dotted #ccc} .fab-subnav ul li a:hover { background-color:#d5dfed; color:#000} /* fabricators photos */ .gallery1, .gallery2, .gallery3 { width:205px; float:left; overflow:hidden; margin:0 27px 30px 0; } .gallery4 { width:205px; float:left; overflow:hidden; } h3.gap { margin-bottom:8px} .fabricators-content ol.norm li a {text-decoration:underline} .fabricators-content ol.norm li a:hover { text-decoration:none } #rev-list { margin-left:0px; display:block; color: #5e6f7f; font-weight: 300;} #rev-list p { margin-bottom:5px; color: #5e6f7f; font-weight: 300; } #rev-list p a { color: #5e6f7f; font-weight: 300; text-decoration:underline} #rev-list p a:hover { color:#70badc; text-decoration:none} .imagebox { float:left; margin-right:25px; margin-bottom:25px} .sitemap ul { margin-left:25px; } .sitemap ul li { margin:0; padding:0; list-style-type:none; font-size:1.2em; line-height:1.3em;} .sitemap ul li a { font-family: 'Roboto', Helvetica, sans-serif; font-weight:500; line-height:2em; } .sitemap ul li ul { margin-left:50px; margin-bottom:0; padding:0} .sitemap ul li > ul li a {font-weight:300; font-size:0.9em; padding:0; margin:0} .sitemap ul li > ul li > ul li a {font-weight:300; font-size:0.7em; padding:0; margin:0;} .reg-form table { margin:0 auto; } .reg-form input, .reg-form select { margin-bottom:10px; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; font-size: 1.2em; margin-right:10px; padding:3px 8px; } .reg-form .reg-button:hover { } .dealer-form { width:700px; margin:0 auto;} .dealer-form form { } .dealer-form input { margin-bottom:15px} .img-types { width:100%; height:auto} .img-thumbs { width:298px; height:auto} .border { padding:20px 30px; border:1px solid #ccc} .border h4 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.8em; font-weight:300; color:#2a2a2a; margin-bottom:8px; } #warrantytable { width: 500px; float:right; margin: 0 0 10px 40px; border: 1px solid #ccc; } #warrantytable td { padding: 7px; border: 1px solid #ccc; border-collapse: collapse; font-size:1.1em; line-height: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; } sup { font-size: 70%; vertical-align: super; } .outline { padding:15px 20px 0 20px ; border:1px solid #ccc; margin:25px 0;} .outline-box { margin:25px 0; font-family: 'Roboto', Helvetica, sans-serif; font-size: 1.3em; line-height: 1.5em; font-weight:500; color: #75ac30; margin-bottom:18px; clear:left} .outline-box img { float:left; margin-right:25px;} .rightdiv { float:right; margin:0 0 10px 35px; text-align:center; width:280px} .rightdiv2 { float:right; margin:0 0 15px 45px; text-align:left; width:330px; font-size:1.1em; line-height:1.3em; font-weight:300; font-family: 'Roboto', Helvetica, sans-serif;} .rightdiv2 img { margin-bottom:10px} .video1 { margin: 5px 30px 15px 0; float: left; width: 344px; height:auto } .leftcol { float:left; width:660px; margin-right:40px; background-color:rgba(180,180,180,1.00)} .rightcol { float:left; width:300px; } .gallery { width:205px; float:left; overflow:hidden; margin:0 27px 30px 0; } .gallery2 { width:205px; float:left; overflow:hidden; } #feature-box2 { border:1px solid #98a0a9; float:right; width:340px; padding:20px 30px 20px 25px; margin:0 0 0 30px; text-align: center; font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; font-weight:500 } /* news section */ .post { width:100%; } .blog-snippet-size { float:left; margin-right:30px; padding-bottom:10px} .post p { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; line-height:1.5em; font-weight:300; margin-bottom:8px} .post a { font-size:1.2em} .post h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; font-weight:500; color: #2a2a2a; line-height:1.4em; margin-bottom:12px } p.error { color:rgba(255,0,4,1.00) !important} .date { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.1em; margin-bottom:2px; padding:0} ul.pagination li a, ul.pagination li.control a, ul.pagination li.active a {color: #2a2a2a; } /******* Dealer locator pages ************************************/ #dealer-logo { float:left; margin-right:45px} #dealer-details { float:left; padding-top:15px; } .dealerpg { font-family: 'Roboto', Helvetica, sans-serif; font-size:1em; line-height:1.3em; margin:0} .section-general .dealerpg h1 { margin-bottom:0; padding:0; line-height:0.9em; margin-bottom:10px} .section-general .dealerpg h1 a { font-family: 'Roboto', Helvetica, sans-serif; font-size:0.6em !important; font-weight:500; color:#2a2a2a;} .section-general .dealerpg h1 a:hover { color:#5a8e22} .dealerpg h3 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.4em; line-height:1.3em; font-weight: 500; margin-bottom:10px} .dealerpg h2 { font-family: 'Roboto', Helvetica, sans-serif; font-size:1.2em; font-weight:300; line-height:1.5em; margin-bottom:18px; color: #5e6f7f;} ul.pagination a.active { color:#5a8e22} span.company a {color:#5a8e22} /* competition forms */ #compform { } #compform fieldset { border: none; margin-bottom: 1em; padding: 0; } #compform label { float: left; width: 200px; font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; } #compform label.label-long { width:280px; margin-bottom:5px} #compform label1 { float: left; /*width: 200px;*/ font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300;} #compform br { clear: left; } #compform input, #compform select { float: left; margin-bottom:10px; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300; font-size: 1.2em; margin-right:10px; padding:3px } #compform input.check { float:left; margin-right:10px; border:1px solid #000; display:block !important; font-size:2em} #compform legend { margin-bottom: 1em; font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:500 } #compform .contact-thankyou { height: 310px; } #compform textarea { width: 80%; font-size: 1.2em; font-family: 'Roboto', Helvetica, sans-serif; font-weight:300 } #compform #compformsubmit { color:rgba(0,0,0,1.00); font-weight:300; padding:3px} .comp-pic { width:100% !important} .comp-list ol li { font-weight:300 !important; color: #5e6f7f;} .comp-footerstrip { height:162px; background-color:#000000; display:block; border-top:3px solid #5d9d0c; border-bottom:3px solid #5d9d0c; text-align:center !important; padding-top:10px; width:100%} .blockright { float:right; width:350px; display:block; margin-left:25px; margin-bottom:25px; border:1px solid #5f9e12; padding:15px 20px} /* Pagination style for Blog*/ ul.pageList { list-style-type: none; } ul.pageList li { display: inline; margin-left: 10px; } ul.pageList li a.active { color: #cccccc; } /* Sidemenu style for Blog*/ .section-general ul.blogMenu { margin:0; padding:0 } .section-general ul.blogMenu li { margin:0; padding-left:40px !important; margin-bottom:10px; font-size:1.5em !important } .section-general #blogpost { background-color:#E8BDBE !important; display:block }