/* Reset ================================================================================= */ @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } * { margin: 0; padding: 0; } body { font: 15px/20px 'Oswald light', Arial, Helvetica, sans-serif; color: #575a5d; } body.noscroll { overflow: hidden; height: 100%; } img { vertical-align:top; max-width: 100%; height: auto; border: 0; max-width: 100%; } table img { max-width: none; } a { color: #1a3b88; } a:hover {} /* Headings */ h1,h2,h3,h4,h5,h6 { margin: 0 0 .5em; color: #3d3d3d; font-weight: bold; } h1,h2 { font-size: 25px; font-weight: normal; } h1 { margin: 0 0 20px; } h3 { font-size: 23px; font-weight: normal; } h4, h5, h6 { font-size: 15px; font-weight: bold; } /* Forms */ form { display:inline; } fieldset { border: 0; margin: 0; padding: 0; } legend { display:none; } /* Table */ table { empty-cells:show; border-collapse: collapse; width: 100%; margin: 0 0 1.5em; } caption,th,td { vertical-align:top; } /* Content */ p { margin: 0 0 20px; } dl { margin: 0 0 1.5em; } dl dt { margin: 0; font-weight: bold; } dl dd { margin: 0; } strong {} address { } cite {} q, blockquote { quotes:none; background: #f6f6f6; padding: 20px; margin: 0 0 1.5em; } q:before, q:after { content:''; } small { font-size: .85em; } big { font-size: 1.15em; } /*sup { vertical-align:top; }*/ /* Lists */ ul,ol { list-style:none; } /* Tools */ .hidden { display:block !important; width:0 !important; height:0 !important; overflow:hidden !important; } .nobr { white-space:nowrap !important; } .wrap { white-space:normal !important; } .a-left { text-align: left; } .a-center { text-align: center; } .a-right { text-align: right; } .v-top { vertical-align:top; } .v-middle { vertical-align:middle; } .f-left, .left { float:left !important; } .f-right, .right { float:right !important; } .f-none { float:none !important; } .f-fix { float:left; width:100%; } .no-display { display:none; } .no-margin { margin:0 !important; } .no-padding { padding:0 !important; } .no-bg { background:none !important; } /* ======================================================================================= */ /* Layout ================================================================================ */ .wrapper {} .page { margin: 0 auto; min-width: 1000px; } .page-print {} .page-empty {} .page-popup {} .main-container { margin: 35px auto 55px; } .main { width: 984px; margin: 0 auto; } .col2-left-layout .main, .col2-right-layout .main { position: relative; background: #fff; margin: 0 auto; width: 984px; } /*.col2-left-layout .main:before, .col2-right-layout .main:before { z-index: 1; position: absolute; left: 0; top: 0; content: ""; display: block; width: 20%; height: 100%; background: #f5f5f5; } .col2-right-layout .main:before { left: auto; right: 0; }*/ .sidebar { background: #f5f5f5; } /* Base Columns */ .col-left { position: relative; z-index: 1; float:left; width: 20%; } .col-main { float:right; width: 80%; } .col-right { float:right; width: 20%; } /* 1 Column Layout */ .col1-layout .col-main { float:none; width:auto; } .col1-layout .main { width: 984px; padding: 45px; margin: 0 auto; background: #fff; } .col1-layout .main:before { display: none; } /* 2 Columns Layout */ .col2-left-layout .col-main { float:right; } .col2-right-layout .col-main {} /* 3 Columns Layout */ /* .col3-layout .col-main { width:540px; } .col3-layout .col-wrapper { float:left; width:760px; } .col3-layout .col-wrapper .col-main { float:right; } */ /* Content Columns */ .col2-set .col-1 { float:left; width:48.5%; } .col2-set .col-2 { float:right; width:48.5%; } .col2-set .col-narrow { width:32%; } .col2-set .col-wide { width:65%; } .col3-set .col-1 { float:left; width:32%; } .col3-set .col-2 { float:left; width:32%; margin: 0 2%; } .col3-set .col-3 { float:right; width:32%; } .col4-set .col-1 { float:left; width:23.5%; } .col4-set .col-2 { float:left; width:23.5%; margin: 0 0 0 2%; } .col4-set .col-3 { float:left; width:23.5%; margin: 0 2%; } .col4-set .col-4 { float:right; width:23.5%; } /* ======================================================================================= */ /* Global Styles ========================================================================= */ /* Form Elements */ input,select,textarea,button { vertical-align:middle; } input.input-text,select,textarea { font: 14px/20px 'Droid Sans', Arial, Helvetica, sans-serif; color: #878787; font-style: italic; } input.input-text,textarea { border: 1px solid #a4a5a7; box-shadow: inset 0 0 5px rgba(87,90,93,0.15); padding: 9px 0; border-radius: 2px; } select { border: 1px solid #A4A5A7; height: 38px; line-height: 38px; padding: 8px 0; /* FF */ } .multiselect[multiple] { height: auto; } select option {} select.multiselect option {} select.multiselect option:last-child {} textarea { overflow:auto; } input.radio {} input.checkbox {} input.qty { width:2.5em !important; text-align: center; } button.button::-moz-focus-inner { padding:0; border:0; } /* FF Fix */ button.button, a.button { -webkit-border-fit:lines; } /* <- Safari & Google Chrome Fix */ button.button, a.button { overflow:visible; width:auto; cursor:pointer; border: 0; padding: 0; margin: 0; background: transparent; } button.button span, a.button span { display: inline-block; white-space:nowrap; } button.button > span, a.button > span { padding: 0 35px; height: 48px; line-height: 48px; background: #1a3b88; color: #FFF; font-size: 18px; border-radius: 2px; } button.button, a.button { } button.disabled, button[disabled] { color: #aaa; cursor: default; } a.button { display: inline-block; text-decoration: none; } button.btn-checkout { font-size: 16px; } button.btn-checkout > span { height: 30px; line-height: 30px; } button.btn-checkout.no-checkout {} .opc .buttons-set .please-wait { display: none !important; } .opc .buttons-set button.button, button.btn-cart, button.btn-proceed-checkout, button.btn-checkout { position: relative; overflow: hidden; } .opc .buttons-set button.button > span, button.btn-cart > span, button.btn-proceed-checkout > span, button.btn-checkout > span { -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .opc .buttons-set button.button:after, button.btn-cart:after, button.btn-proceed-checkout:after, button.btn-cart:after { content: ''; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/opc-ajax-loader.gif) no-repeat center; display: block; position: absolute; left: 0; top: 0; height: 100%; width: 100%; line-height: 24px; visibility: hidden; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } .opc .buttons-set.disabled button.button > span, button[disabled].btn-cart > span, button[disabled].btn-proceed-checkout > span, button[disabled].btn-cart > span { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); } .opc .buttons-set.disabled button.button:after, button[disabled].btn-cart:after, button[disabled].btn-proceed-checkout:after, button[disabled].btn-cart:after { visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } button.btn-cart > span { padding: 0; width: 100%; } button.btn-cart > span:before { content: ""; display: inline-block; vertical-align: middle; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -530px -100px; width: 20px; height: 20px; margin: -6px 17px auto auto; } p.control input.checkbox, p.control input.radio {} /* Form Highlight */ input.input-text:focus,select:focus,textarea:focus {} /*.highlight {}*/ /* Form lists */ /* Grouped fields */ .form-list > li { margin: 0 0 1em; } .form-list label { float:left; position:relative; z-index:0; margin: 0 0 .15em; } .form-list label.required { } .form-list label.required em { color: orange; display: inline-block; float: right; margin-left: 5px; } .form-list li.control label { float:none; vertical-align: middle; } .form-list li.control input.radio, .form-list li.control input.checkbox { margin-right: 6px; } .form-list li.control .input-box { clear:none; display:inline; width:auto; padding: 0; } /*.form-list li.fields {}*/ .form-list .input-box { display:block; clear:both; padding-right: 12px; } .form-list li.control, .form-list li.wide, .form-list li.fields, .form-list li.wide, .form-list li.field { margin-bottom: .75em; } .form-list .fields .field { float:right; width:49%; margin: 0; } .form-list .fields .field:first-child { float: left; } .form-list input.input-text { width:100%; text-indent: 15px; } .form-list textarea { width:90%; padding: 5%; height:10em; } .form-list select { width:100%; } .form-list .input-range input.input-text { width:74px; } .field-with-loader { position: relative; } .field-with-loader > img { position: absolute; right: -33px; top: 12px; } .form-list-narrow li {} .form-list-narrow li .input-box {} .form-list-narrow li.wide .input-box { width:260px; } .form-list-narrow li.wide input.input-text, .form-list-narrow li.wide textarea { width:254px } .form-list-narrow li.wide select { width:260px; } /* Customer */ .form-list .customer-name-prefix .input-box, .form-list .customer-name-suffix .input-box, .form-list .customer-name-prefix-suffix .input-box, .form-list .customer-name-prefix-middlename .input-box, .form-list .customer-name-middlename-suffix .input-box, .form-list .customer-name-prefix-middlename-suffix .input-box { width:auto; } .form-list .name-prefix { width:65px; } .form-list .name-prefix select { width:55px; } .form-list .name-prefix input.input-text { width:49px; } .form-list .name-suffix { width:65px; } .form-list .name-suffix select { width:55px; } .form-list .name-suffix input.input-text { width:49px; } .form-list .customer-dob .dob-day, .form-list .customer-dob .dob-month { float:left; width:60px; } .form-list .customer-dob .dob-year { float:left; width:140px; } .buttons-set { clear:both; } .buttons-set p.required { } .buttons-set .back-link { float:left; } .buttons-set button.button { float:right; } .buttons-set-order {} .buttons-set-order .please-wait {} .fieldset {} .fieldset .legend { position:relative; } /* Form Validation */ .validation-advice { clear:both; color: red; font-size: 12px; margin: 0.5em 0 0; } .validation-failed { color: red; } .validation-passed { color: green; } p.required { display: none; } /* Expiration date and CVV number validation fix */ .v-fix { float:left; } .v-fix .validation-advice { display:block; width:12em; position:relative; } /* Global Messages */ .success { color:#3d6611; font-weight:bold; } .error { color:#df280a; font-weight:bold; } .notice { color:#e26703; font-weight:bold; } .messages, .messages ul { list-style:none !important; margin:0 !important; padding:0 !important; } .messages { width:100%; overflow:hidden; margin-bottom: 1.5em !important; } .messages li { margin:0 !important; } .messages li li { margin:0 !important; } .error-msg, .success-msg, .note-msg, .notice-msg { padding: 10px !important; font-weight:bold !important; border-radius: 4px; color: #fff !important; } .error-msg { background-color:#f16048; } .success-msg { background-color:#446423; } .note-msg, .notice-msg { background-color:#fcd344; } #messages_product_view { width: 954px; background: #fff; margin: 0 auto; padding: 15px; } #messages_product_view .messages { margin-bottom: 0 !important; } /* BreadCrumbs */ .breadcrumbs-wrapper { width: 984px; margin: 0 auto; } .breadcrumbs { width: 984px; margin: 0 auto; overflow: hidden; text-transform: lowercase; } .breadcrumbs ul, .breadcrumbs-wrapper .mct_prevnext { background: #f5f5f5; padding: 9px 20px; font-style: italic; float: left; font-size: 12px; } .breadcrumbs li { display:inline; color: #3d3d3d; } .breadcrumbs li strong { font-style: italic; font-weight: normal !important; color: #000; } .breadcrumbs a { color: #575a5d; font-style: italic; text-decoration: none; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs li > span { display: inline; display: inline-block; vertical-align: middle; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) 0 -280px; width: 5px; height: 9px; margin: auto 10px; } .breadcrumbs span { text-decoration: underline; } .breadcrumbs-wrapper .breadcrumbs { float: left; width: auto; } .breadcrumbs-wrapper .mct_prevnext a { padding: 0; } .breadcrumbs-wrapper .mct_prevnext .counter { padding: 2px 25px; } .breadcrumbs-wrapper .mct_prevnext { float: right; margin: 0; font-size: 13px; line-height: 15px; } /* prev / next */ /* Page Heading */ .page-title { } .page-title .separator {} .page-title .link-rss { float:right; } .title-buttons { text-align: right; line-height: 25px; } .title-buttons h1, .title-buttons h2, .title-buttons h3, .title-buttons h4, .title-buttons h5, .title-buttons h6 { float:left; font-size: 1.6em; } .subtitle, .sub-title { clear:both; } /* Pager */ .pager { margin: 0 0 25px; } .pager p { margin: 0; } .pager .amount { float:left; } .pager .limiter { float:right; } .pager .limiter label { vertical-align:baseline; } .pager .limiter select { vertical-align:baseline; } .pager .pages {} .pager .pages ol { display:inline; } .pager .pages li { display:inline; } .pager .pages .current {} .toolbar > .amount { float: left; font-style: italic; font-size: 16px; color: #000; margin-top: 10px; margin-left: 2%; } /* Sorter */ .sorter {} .sorter p { margin: 0; } .sorter .view-mode { display: none; } .sorter .sort-by { float:right; } .sorter .sort-by label { vertical-align:baseline; } .sorter .sort-by select { vertical-align:baseline; border: 1px solid #babbbb; border-width: 2px 1px; color: #000; width: 216px; font-style: normal; } .sorter .link-feed {} /* Toolbar */ .toolbar { background: #d6d6d6; padding: 10px; } .toolbar .pager { float: left; } .toolbar .sorter { float: right; } .toolbar .pager > *, .toolbar .sorter > * { float: none; display: inline; } .toolbar .sorter .view-mode { display: none; } .toolbar .pager > * { margin-left: 15px; } .toolbar .sorter > * { margin-right: 15px; } .toolbar-bottom {} /* Data Table */ .data-table { width:100%; } .data-table .odd {} .data-table .even { background: #f6f6f6; } .data-table td.last, .data-table th.last {} .data-table tr.last th {} .data-table tr.last td {} .data-table tr.last td.last { padding-right: 35px; } .data-table th, .data-table td { padding: 5px; border: 1px solid #CCC; } .data-table thead th { white-space:nowrap; vertical-align:middle; text-align: left; background: #ccc; } .data-table thead th.wrap { white-space:normal; } .data-table thead th a, .data-table thead th a:hover {} .data-table thead th {} .data-table thead th .tax-flag { white-space:nowrap; } .data-table tfoot {} .data-table tfoot tr.first td {} .data-table tfoot tr {} .data-table tfoot td { text-align: left;} .data-table tfoot strong {} .data-table tbody th, .data-table tbody td { vertical-align: middle; text-align: left; } /* Bundle products tables */ .data-table tbody.odd tr {} .data-table tbody.even tr {} .data-table tbody td .option-label {} .data-table tbody td .option-value {} /* Generic Info Box */ .info-box {} .info-box h2 {} .info-table th {} .info-table td {} /* Class: std - styles for admin-controlled content */ .std ul { list-style:disc outside; margin: 0 0 1.5em 2em; } .std ol { list-style:decimal outside; margin: 0 0 1.5em 2em; } .std ul ul { list-style-type:circle; } .std b, .std strong { font-weight: bold; } .std i, .std em { font-style: italic; } .std iframe { max-width: 100%; } .std ul.products-grid { margin: 2% 0; list-style-type: none; } .std ul.products-grid .add-to-links { list-style-type: none; } .std table td { padding: 10px; } /* Misc */ .links li { display:inline; } .links li.first {} .links li.last {} .link-compare {} .link-print { /* */ } .link-rss { white-space:nowrap; } .btn-remove, .btn-previous, .btn-remove2, .btn-edit { display:block; width:11px; height:11px; font-size:0; line-height:0; background:url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/btn_edit.gif) 0 0 no-repeat; text-indent:-999em; overflow:hidden; } .btn-remove { background:url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/btn_remove.gif) 0 0 no-repeat; } .btn-previous { background:url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/btn_previous.gif) 0 0 no-repeat; } .btn-remove2 { width: 17px; height: 18px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -230px -280px; } .btn-edit { background:url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/btn_edit.gif) 0 0 no-repeat; } .cards-list dt {} .cards-list .offset {} .separator {} .divider { clear:both; display:block; height:1px; overflow:hidden; } /* Global site notices */ .global-site-notice {} .global-site-notice .notice-inner { width:860px; } .global-site-notice .notice-inner p {} .global-site-notice .notice-inner .actions {} /* Cookie Notice */ .notice-cookie {} /* Noscript Notice */ .noscript {} /* Demo Notice */ .demo-notice {} .demo-notice .notice-inner { width:auto; } .demo-notice .notice-inner p {} /* ======================================================================================= */ /* Header ================================================================================ */ .logo { float:left; } .header-container { background: #fff; color: #1a3b88; } .header { padding: 11px 0 19px; width: 984px; margin: 0 auto; font-size: 14px; } .header .branding { width: 208px; height: 65px; float: left; overflow: hidden; margin-right: 15px; } .header .logo { float: none; display: block; margin-bottom: 0; } .header .quick-access { float: right; width: 750px; padding-top: 18px; position: relative; } .header .quick-access .links, .header .quick-access .links li { float: left; margin-right: 5px; margin-top: 2px; } .header .welcome-msg { margin: 0; } .header .to-shop-btn { background: #1a3b88; border-radius: 2px; color: #fff; float: right; font-size: 14px; text-decoration: none; padding: 0 15px; line-height: 35px; margin-left: 8px; position: absolute; right: 0; } #block-ge_toplinks { float: right; padding-top: 9px; width: 700px } #block-ge_toplinks li { display: inline; } #block-ge_toplinks li a { text-decoration: none; } #block-ge_toplinks li a:hover { text-decoration: underline; } #block-ge_toplinks li:before { content: "."; display: inline-block; vertical-align: top; color: #878787; margin-top: -8px; padding-left: 10px; margin-right: 15px; font-size: 30px; } #block-ge_toplinks li:first-child:before { display: none; } #block-ge_toplinks li:last-child:before { content: ""; } .phone-icon:before { content: ""; display: inline-block; vertical-align: middle; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -85px -1px; width: 7px; height: 18px; margin: -2px 10px auto auto; } .form-search .search-autocomplete { z-index: 999; left: 0 !important; top: 45px !important; display: block !important; } .form-search .search-autocomplete ul { box-shadow: 0 2px 3px rgba(87, 91, 93, 0.8); } .form-search .search-autocomplete li { cursor: pointer; text-align: left; background: #fff; padding: 10px 15px; border-bottom: 1px solid #e9e9e9; } .form-search .search-autocomplete li:hover { background: #ff7900; color: #fff; border-bottom: 1px solid #ff7900; } .form-search .search-autocomplete li .amount { float:right; } .form-search .search-autocomplete li.first { border-top: 1px solid #e9e9e9; } .form-search .search-autocomplete li.odd { } .form-search .search-autocomplete li.selected { } .form-search .search-autocomplete li.last { border-radius: 0 0 4px 4px; } .header .form-language { clear:both; } .header .form-language label { vertical-align:middle; } .header .form-language select {} .header .form-language select.flags option {} .header .links { margin: 0 0 .5em; } .header .links li {} .header .links a {} .header-container .top-container { clear:both; } .header-container .top-container a {} .header .subtotal { float: right; padding: 0 10px; line-height: 30px; border: 2px solid #575B5D; border-left: 0; border-radius: 2px; } /********** < Navigation */ .nav-container { } #nav {} /* All Levels */ /* Style consistent throughout all nav levels */ #nav li { position:relative; } #nav li.over { z-index:998; } #nav a, #nav a:hover { display:block; } #nav span { display:block; cursor:pointer; white-space:nowrap; } #nav li ul span {white-space:normal; } #nav ul li.parent a {} #nav ul li.parent li a {} /* 0 Level */ #nav > li:first-child { margin: 0; } #nav > li { float:left; margin: 0 30px; padding: 21px; } #nav li.active a {} #nav a { float:left; color: #000; font-size: 19px; line-height: 15px; text-decoration: none; } #nav li.over a, #nav a:hover { text-decoration: underline } /* 1st Level */ #nav ul li, #nav ul li.active { float:none; } #nav ul li.last {} #nav ul a, #nav ul a:hover { float:none; } #nav ul li a {} /* 2nd Level */ #nav ul, #nav div { width:15em; display: none; position: absolute; top: 100%; left: 0; } #nav div ul { position:static; width:auto; } /* 3rd+ Level */ #nav ul ul, #nav ul div { top:5px; } #nav ul li a {} #nav ul li a:hover {} #nav ul li a, #nav ul li a:hover {} #nav ul span, #nav ul li.last li span {} /* Show menu */ #nav li ul.shown-sub, #nav li div.shown-sub { display: block; z-index:999; } #nav li .shown-sub ul.shown-sub, #nav li .shown-sub li div.shown-sub { left:100px; } /********** Navigation > */ /* ======================================================================================= */ /* Sidebar =============================================================================== */ .block {} .block .block-title { font-size: 17px } .block .block-title strong { display:block; font-weight: normal; } .block .block-title strong span {} .block .block-title a {} .block .block-subtitle { margin: 0; font-size: 25px; } .block .block-content {} .block .block-content li.item {} .block .block-content .product-name {} .block .btn-remove, .block .btn-edit { float:right; } .block .actions {} .block .actions a { float:left; } .block .actions button.button { float:right; } .block .empty {} .block li.odd {} .block li.even {} /* Mini Blocks */ .block-tags, .block-login {} .block-cart .block-title strong, .block-subscribe .block-title strong, .block-login .block-title strong {} /* Block: Layered Navigation */ .block-layered-nav { color: #000; } .block-layered-nav .block-title { background: #000; color: #fff; padding: 20px 35px 20px 12px; border-top: 1px solid #a9a9a9; position: relative; } .block-layered-nav .block-subtitle { padding-top: 14px !important; padding-bottom: 14px !important; } .block-layered-nav .block-title:after { content: ""; position: absolute; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -110px -280px; width: 19px; height: 12px; top: 25px; right: 12px; } .block-layered-nav .block-content { padding: 18px 19px; } .block-layered-nav dt { margin-top: 1.5em; color: #000; } .block-layered-nav dd {} .block-layered-nav dd.last {} .block-layered-nav .currently {} .block-layered-nav .currently .block-subtitle { font-size: 15px; font-weight: bold; color: #000; padding: 0 !important } .block-layered-nav .currently li { position:relative; z-index:1; padding: 6px 0; } .block-layered-nav .currently .label { display:inline-block; vertical-align:top; } .block-layered-nav .currently .value { display:inline-block; vertical-align:top; } .block-layered-nav .currently .btn-previous, .block-layered-nav .currently .btn-remove { position:absolute; right:4px; top:9px; } .block-layered-nav .currently .btn-previous { right:17px; } .block-layered-nav .currently + .actions { margin-bottom: 1.4em; } .block-layered-nav .actions {} .block-layered-nav .actions a { float:none; } .block-layered-nav.etalage-nav .block-content { padding-top: 0; } .block-related .item.first td.last { background: none; } .limit-message { display: none; z-index: 150; position: absolute; left: 35px; top: 0; background: #f2f2f2; border-radius: 3px; padding: 15px; width: 300px; line-height: 20px; } .limit-message:before { position: absolute; left: -10px; top: 12px; display: block; content: ""; border: 10px solid transparent; border-left: none; border-right-color: #f2f2f2; } .limit-message.show { display: block; } .button.disable > span { background: #f2f2f2; } .page-popup .link-print {} /* Block: Subscribe */ .block-subscribe .block-content { background: #f1f1f2; padding: 25px 20px; border-radius: 3px; overflow: hidden; position: relative; } .block-subscribe .block-title, .block-subscribe label { display: none; } .block-subscribe input.input-text { float: left; width: 355px; line-height: 28px; height: 28px; margin-right: 10px; padding-left: 10px; padding-right: 10px; } .block-subscribe .actions { float: left; } .block-subscribe .actions button.button { float:none; } .block-subscribe .actions button.button > span { padding-left: 50px; padding-right: 50px; } .block-subscribe .validation-advice { position: absolute; top: 69px; } /* Block: Banner */ .block-banner {} .block-banner .block-content {} /* ======================================================================================= */ /* Product View ========================================================================== */ /* Rating */ .no-rating {} .ratings {} .ratings strong { float:left; } .ratings .rating-links {} .ratings .rating-links .separator {} .ratings dt {} .ratings dd {} .rating-box { width:69px; height:13px; overflow:hidden; } .rating-box .rating { float:left; height:13px; } .ratings .rating-box { float:left; } .ratings .amount {} .ratings-table th, .ratings-table td {} .ratings-table th {} /* Email to a Friend */ .email-friend {} /* Send a Friend */ .send-friend .form-list { width:615px; overflow:hidden; } .send-friend .form-list li {} .send-friend .form-list li p {} .send-friend .form-list .field { width:315px; } .send-friend .form-list .input-box { width:300px; } .send-friend .form-list input.input-text, .send-friend .form-list textarea { width:294px; } .send-friend .form-list li.wide .input-box { width:612px; } .send-friend .form-list li.wide textarea { width:609px; } .send-friend .buttons-set .limit { float:right; } /* ======================================================================================= */ /* Advanced Search */ .advanced-search > .legend { background: #d6d6d6; padding: 2% 3%; color: #000; font-size: 16px; font-style: italic; margin-bottom: 24px; } .advanced-search .form-list { width: 68%; margin: 0 3%; } .advanced-search .form-list label { float: none; display: block; width:160px; } .advanced-search .form-list .input-box { float: none; clear: none; } .advanced-search .form-list .input-range { float:left; clear:none; } .advanced-search-amount { padding: 0 3%; } .advanced-search-summary { padding: 0 3%; } .advanced-search-summary ul { } .advanced-search-summary li { margin-bottom: 5px; } .advanced-search-summary strong {} .advanced-search-summary p { margin-top: 20px; } /* CMS Home Page */ .cms-home .subtitle {} .cms-index-index .subtitle {} /* Sitemap */ .page-sitemap .links {} .page-sitemap .links a { position:relative; } .page-sitemap .links a:hover {} .page-sitemap .sitemap {} .page-sitemap .sitemap a {} .page-sitemap .sitemap li {} .page-sitemap .sitemap li.level-0 {} .page-sitemap .sitemap li.level-0 a {} /* RSS */ .rss-title h1 {} .rss-table .link-rss { display:block; } /* ======================================================================================= */ /* Options Tool Tip */ .item-options dt {} .item-options dd {} .truncated { cursor:help; } .truncated a.dots { cursor:help; } .truncated a.details { cursor:help; } .truncated .truncated_full_value { position:relative; z-index:999; } .truncated .truncated_full_value .item-options { position:absolute; top:-99999em; left:-99999em; z-index:999; width:250px; } .truncated .truncated_full_value .item-options > p {} .truncated .show .item-options { top:-20px; left:50%; } .col-left .truncated .show .item-options { left:15px; top:7px; } .col-right .truncated .show .item-options { left:-240px; top:7px; } /* ======================================================================================= */ .please-wait { float:right; } .please-wait img { vertical-align:middle; } .cvv-what-is-this { cursor:help; } /* Tooltip */ .tool-tip { position:absolute; z-index:9999; } .tool-tip .btn-close {} .tool-tip .btn-close a { display:block; width:15px; height:15px; overflow:hidden; } .tool-tip .tool-tip-content {} /* Centinel */ .centinel {} .centinel .authentication {} .centinel .authentication iframe { width:99%; height:400px; } .opc .centinel {} /* Generic Info Set */ .info-set {} .info-set h2 {} .info-set h3, .info-set h4 {} .info-set h2 a, .info-set h3 a, .info-set h4 a {} .info-set h2.legend { position:relative; } .info-set h3.legend {} .info-set .divider { position:relative; } .info-set .box {} .info-set .box h2 {} .info-set .data-table .product-name {} .info-set .data-table .product-name a {} .info-set .data-table .item-options {} /********** Common Checkout Styles > */ @-webkit-keyframes rotate { 0% { -webkit-transform:rotate(0); } 0% { -webkit-transform:rotate(-360deg); } } @-moz-keyframes rotate { 0% { -moz-transform:rotate(0); } 0% { -moz-transform:rotate(-360deg); } } @keyframes rotate { 0% { transform:rotate(0); } 0% { transform:rotate(-360deg); } } /* Remember Me Popup ===================================================================== */ @-webkit-keyframes overlayIn { 0% { opacity: 0; visibility: hidden; } 50%, 100% { opacity: .28; visibility: visible; } } @keyframes overlayIn { 0% { opacity: 0; visibility: hidden; } 50%, 100% { opacity: .28; visibility: visible; } } @-webkit-keyframes overlayOut { 0%, 50% { opacity: .28; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } @keyframes overlayOut { 0%, 50% { opacity: .28; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } .popup-block.active { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } .popup-block { -webkit-animation-duration: .75s; animation-duration: .75s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } .window-overlay.active { -webkit-animation-name: overlayIn; animation-name: overlayIn; } .window-overlay { -webkit-animation-duration: .75s; animation-duration: .75s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: overlayOut; animation-name: overlayOut; } /* Popup Dialog Block */ .window-overlay { position:absolute; top:0; left:0; min-height:100%; background:#000; opacity:0.5; width:100%; z-index:990; visibility: hidden; } .window-overlay.active { visibility: visible; } .popup-block { left:50%; top:10%; margin: 0 0 0 -250px; width:500px; max-height: 80%; overflow: auto; text-align:left; background: #FFF; box-shadow:0 0 6px #000; z-index:1000; position:fixed; display: block; visibility: hidden; } .popup-block.active { visibility: visible; } .popup-block .block-title { background: #F6F6F6; border-bottom:1px solid #CFCFCF; padding: 0 31px 0 10px; overflow: hidden; height: 50px; line-height: 50px; position: relative; } .popup-block .btn-close { cursor:pointer; position: absolute; top: 50%; right: 10px; display:block; width:11px; height:11px; font-size:0; line-height:0; background:url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/btn_remove.gif) 0 0 no-repeat; text-indent:-999em; overflow:hidden; margin: -6px 0 0; } .popup-block .block-title strong { font-size:1.2em; font-weight:normal; } .popup-block .block-content { padding: 10px; font-size:12px; } .popup-block .block-content .form-list label { width:180px; } .popup-block .block-content .form-list .input-text { width:230px; } .popup-block .block-content .form-list .control .input-box { margin-left:195px; } .popup-block .block-content .form-buttons { width:auto; padding-left:188px; padding-top:10px; } .popup-block .block-content .form-buttons .button { float:left; } .popup-block.loading .block-content * { text-align:left; text-indent:-99999em; overflow:hidden; position:relative; margin-left:-9999em; } .popup-block.loading .block-content:before { content:''; display:block; background:url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/opc-ajax-loader.gif) no-repeat 0 50%; position:absolute; z-index:99; top:50%; left:50%; line-height:16px; padding:16px; text-indent:0!important; } .remember-me label { float:none; } .remember-me-popup { left:50%; top:50%; position:absolute; width:400px; -moz-box-shadow:0 0 6px #ccc; -webkit-box-shadow:0 0 6px #ccc; -box-shadow:0 0 6px #ccc; z-index:1000; } .remember-me-popup h3 {} .remember-me-popup .remember-me-popup-head { position:relative; } .remember-me-popup .remember-me-popup-head .remember-me-popup-close { display:block; position:absolute; top:7px; right:7px; height:15px; width:15px; } .remember-me-popup .remember-me-popup-body {} .remember-me-popup .remember-me-popup-body a { display:inline-block; height:19px; white-space:nowrap; } /* Remember Me Popup ===================================================================== */ /* Order Print Pages */ .page-print .print-head {} .page-print .print-head .logo { float:left; } .page-print .print-head address { float:left; } .page-print h1 {} .page-print h2, .page-print h3 {} .page-print h2.h2 {} .page-print .order-date {} .page-print .col2-set {} /* Price Rewrites */ .page-print .gift-message-link { display:none; } .page-print .price-excl-tax, .page-print .price-incl-tax { display:block; white-space:nowrap; } .page-print .cart-price, .page-print .price-excl-tax .label, .page-print .price-incl-tax .label, .page-print .price-excl-tax .price, .page-print .price-incl-tax .price { display:inline; } /* ======================================================================================= */ /* Footer ================================================================================ */ .footer-container { } .footer .store-switcher { display:inline; } .footer .store-switcher label { vertical-align:middle; } .footer .store-switcher select { vertical-align:middle; } .footer a { color: #fff; } .footer a:hover {} .footer .bugs {} .footer .bugs a {} .footer .bugs a:hover {} .footer address { margin: 0; } .footer address a {} .footer address a:hover {} .footer ul { display: inline; } .footer ul.links { display:block; } .footer li { } .footer li.last {} .footer-container .bottom-container {} /* ======================================================================================= */ /* Clears ================================================================================ */ .clearer:after, .header-container:after, .header-container .top-container:after, .header:after, .header .quick-access:after, #nav:after, .navigation-wrapper:after, .main:after, .footer:after, .footer-container .bottom-container:after, .col-main:after, .col2-set:after, .col3-set:after, .col3-layout .product-options-bottom .price-box:after, .col4-set:after, .search-autocomplete li:after, .block .block-content:after, .block .actions:after, .block li.item:after, .block-poll li:after, .block-layered-nav .currently li:after, .page-title:after, .products-grid:after, .products-list li.item:after, .box-account .box-head:after, .dashboard .box .box-title:after, .box-reviews li.item:after, .box-tags li.item:after, .pager:after, .sorter:after, .ratings:after, .add-to-box:after, .add-to-cart:after, .product-essential:after, .product-collateral:after, .product-view .product-img-box .more-views ul:after, .product-view .box-tags .form-add:after, .product-view .product-shop .short-description:after, .product-view .box-description:after, .product-options .options-list li:after, .product-options-bottom:after, .product-review:after, .toolbar:after, .cart:after, .cart-collaterals:after, .cart .crosssell li.item:after, .opc .step-title:after, .checkout-progress:after, .multiple-checkout .place-order:after, .group-select li:after, .form-list li:after, .form-list .field:after, .buttons-set:after, .page-print .print-head:after, .advanced-search-summary:after, .gift-messages-form .item:after, .send-friend .form-list li p:after, .col-left:after, .navigation-wrapper:after { display:block; content:"."; clear:both; height:0; overflow:hidden; } .cms-page-wrapper:after, .products-grid .actions:after { display:block; content:"."; clear:both; height:0; overflow:hidden; color: rgba(255,255,255,0); } /* ======================================================================================= */ /** custom **/ /* blue heading */ .service h2, .service h3, .service h4, .order-history .block-title, .popup-block .block-title, .kbase-main-search h2, .accordion dt.active, .web-form .fieldset h2, .blue-heading { position: relative; padding: 10px 15px; margin: 0; color: #fff; font-size: 16px; font-weight: normal; background: #14518d; } .service h2:after, .service h3:after, .service h4:after, .popup-block .block-title:after, .kbase-main-search h2:after, .kbase-category dt.active:after, .accordion dt.active:after, .web-form .fieldset h2:after, .blue-heading:after { position: absolute; left: 50px; bottom: -7px; content: ""; display: block; border: 7px solid #14518d; border-left-color: transparent; border-right-color: transparent; border-bottom: none; } .blue-heading { display: block; } /* gray background */ .service > div, .account-login .registered-users { background: #f1f1f2; } /* black button white border */ .switcher-language, .switcher-login .switch-wrapper > span, .header .quick-access .links a { position: relative; float: left; height: 31px; padding: 0 10px; line-height: 31px; color: #878787; border: 2px solid #c3c3c3; border-radius: 2px; background: none transparent; z-index: 20; } /* language switch */ .switcher-language { padding: 0; min-width: 0; margin: 15px 0 0; z-index: 40; float: right; } .switcher-language label { display: none; } .switcher-language .switch-wrapper { cursor: pointer; background: #fff; } .switcher-language .switcher-holder .switcher { padding: 0 35px 0 10px; } .switcher-language .switcher-holder .switcher:after { display: block; content: ""; position: absolute; top: 50%; right: 10px; margin-top: -4px; visibility: visible; overflow: hidden; display: inline-block; text-indent: -10000px; font-size: 0; color: transparent; width: 12px; height: 8px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -320px -280px; } .switcher-language li.current { cursor: default; } #popId-languageSelect { background: #fff; padding: 0 10px; border: 2px solid #c3c3c3; border-top: none; border-radius: 0 0 2px 2px; margin: 0 -2px; } #popId-languageSelect li { border-top: 1px solid #575b5d; } #popId-languageSelect li:first-child { border: none; } #popId-languageSelect .current { display: none; } #popId-languageSelect a { color: #878787; text-decoration: none; } #popId-languageSelect a:hover { text-decoration: underline; } /* login switch */ .switcher-login { position: relative; float: right; z-index: 4; } .switcher-login .switch-wrapper > span, .header .quick-access .links a { float: none; display: inline-block; cursor: pointer; padding: 0 15px; min-width: 50px; text-decoration: none; margin: 0 0 0 2px; } #popId-loginSelect { z-index: 3; right: 0; top: 59px; position: absolute; padding: 15px; background: #000; min-width: 450px; border-radius: 0 0 3px 3px; box-shadow: 0 2px 3px rgba(87, 91, 93, 0.8); } .header .quick-access .links a { margin: 0 0 5px 1px; } #popId-loginSelect .form-list { margin: 0 0 25px; } #popId-loginSelect .form-list label { min-width: 120px; max-width: inherit; line-height: 35px; } #popId-loginSelect .form-list .input-box { margin-left: 150px; clear: none; } #popId-loginSelect .buttons-set a { line-height: 45px; } #popId-loginSelect .buttons-set a + a { margin-left: 15px; } .header .quick-access .links { margin: 0; } .header .quick-access .links.account { float: right; } #block-footer_social .button > span { padding: 5px 15px; height: 24px; line-height: 24px; font-size: 15px; } /* bullets */ /* orange arrow right */ #block-corporate_footer_menu li, .postWrapper .post .aw-blog-read-more, .post-navigation .next { position: relative; margin: 0 0 10px; padding: 0; } #block-corporate_footer_menu li a { padding-left: 10px; } #block-corporate_footer_menu a:before, .cms-no-route .cms-page-content .std ul a:before { position: absolute; left: 0; top: 6px; display: block; content: ""; vertical-align: middle; width: 3px; height: 8px; margin: 0 5px 0 0; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -102px -2px; } #block-corporate_footer_menu a, .cms-no-route .cms-page-content .std ul a { text-decoration: none; } .cms-no-route .cms-page-content .std ul a:hover { text-decoration: underline; } /* orange check */ .account-login .new-users .block-cms li { position: relative; padding: 0 0 0 20px; } .account-login .new-users .block-cms li:before { position: absolute; top: 4px; left: 0; display: inline-block; content: ""; width: 13px; height: 11px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -20px -280px; } /* widget */ .home-wrapper > .widget, .home-wrapper > .widget-static-block-wrapper > .widget { background: #fff; padding: 35px 0; } .col-main .widget { display: block; } .home-wrapper > .widget-static-block-wrapper > .widget > .widget-static-block-content, .cms-index-index .carousel > .block-cms, .banners { background: #fff; padding: 20px 0; } .banners p { margin: 0; } .home-wrapper .banners { padding: 3px 0; } .selection-icon:before { content: ""; display: inline-block; vertical-align: middle; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -522px -49px; width: 24px; height: 23px; margin-right: 12px; } .needhelp-icon:before { content: ""; display: inline-block; vertical-align: middle; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -470px -50px; width: 32px; height: 32px; margin-right: 12px; } .pull-left { float: left; } .pull-right { float: right; } /* social media */ #follow-us { width: auto; padding: 0; } #follow-us.row strong { display: inline-block; vertical-align: middle; font-weight: normal !important; } #follow-us.list li { margin: 0 0 15px 0; } #follow-us.row ul { display: inline-block; width: 70%; vertical-align: middle; } #follow-us.list a:before, #follow-us.row a { display: inline-block; content: ""; vertical-align: middle; width: 37px; height: 37px; margin: 0 15px 0 0; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat 0 -140px; } #follow-us.row li { display: inline; } #follow-us.row a { overflow: hidden; text-indent: -10000px; font-size: 0; color: transparent; margin: 5px 7px; } #follow-us.row .fb a, #follow-us.list .fb a:before { background-position: -250px -140px; } #follow-us.row .tw a, #follow-us.list .tw a:before { background-position: -350px -140px; } #follow-us.row .yt a, #follow-us.list .yt a:before { background-position: -300px -140px; } #follow-us.row .gp a, #follow-us.list .gp a:before { background-position: -100px -140px; } #follow-us.row .pi a, #follow-us.list .pi a:before { background-position: -150px -140px; } #follow-us.row .li a, #follow-us.list .li a:before { background-position: -200px -140px; } #follow-us.row .fr a, #follow-us.list .fr a:before { background-position: 0 -140px; } #follow-us.row .vi a, #follow-us.list .vi a:before { background-position: -50px -140px; } /* wysiwyg styles */ .heading-icon:before, .heading2-icon:before, .heading3-icon:before { display: inline-block; content: ""; width: 25px; height: 25px; margin: 0 10px 0 0; vertical-align: middle; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat 0 0; } .icon-1:before { background-position: -460px -100px; } .icon-2:before { background-position: -420px -100px; } .icon-3:before { background-position: -530px -100px; } .icon-4:before { background-position: -370px -100px; } .icon-5:before { background-position: -330px -100px; } .icon-6:before { background-position: -290px -100px; } .icon-7:before { background-position: -70px -100px; } .icon-8:before { background-position: -250px -100px; } .icon-9:before { background-position: -210px -100px; } .icon-10:before { background-position: -500px -100px; } .icon-11:before { background-position: -180px -100px; } .heading2-icon:before { width: 26px; height: 26px; } .icon-12:before { background-position: -430px -50px; } .icon-13:before { background-position: -390px -50px; } .icon-14:before { background-position: -350px -50px; } .icon-15:before { background-position: -310px -50px; } .icon-18:before { background-position: -522px -50px; } .heading3-icon:before { width: 28px; height: 26px; margin: 0 2% 0 0; } .icon-16:before { background-position: -40px -220px; } .icon-17:before { background-position: 0 -220px; } .cms-bg { position: relative; } .cms-bg h3 { font-size: 3em; line-height: 1em } .cms-bg > * { z-index: 1; position: relative; } .cms-bg > img:first-child { position: absolute; z-index: 0; width: 100%; height: 100%; } .cms-bg > * img { width: auto !important; } .spotlight-colset { padding: 4%; color: #fff; } .spotlight-colset a.button > span { padding: 0 10%; } .spotlight-colset > div ul { margin: 0; } .spotlight-colset > div li { list-style: none; display: inline-block; vertical-align: middle; margin-top: 15px; } .spotlight-colset .col-1 { width: 32%; min-height: 0 !important; } .spotlight-colset div p { font-size: 1.5em; line-height: 1.5em; } .spotlight-colset div p:last-child { margin-bottom: 0; } .spotlight-colset .col-2 { width: 63%; min-height: 0 !important; } /* organge head */ .account-create h1:before, .dashboard h1:before, .customer-account-edit .page-title h1:before, .customer-address-form .legend:before, .dashboard .box-recent .box-head:before, .sales-order-history h1:before { width: 26px; height: 27px; background-position: -160px -50px; } /* white document */ .account-create .fieldset h2:before, #checkout-step-billing h3:before, #checkout-step-shipping h3:before { width: 17px; height: 22px; margin: 0 15px 0 0; background-position: -70px -100px; } /* white head */ .dashboard .col2-set .box-title:before, .account-create .fieldset + .fieldset h2:before, .customer-address-form .fieldset .legend:before { width: 22px; height: 21px; background-position: -420px -100px; } /* white e-mail */ .dashboard .col2-set > div + div .box-title:before, .order-info-box + .order-info-box .col-1 h2:before, .customer-address-index .addresses-primary h3:before { vertical-align: middle; width: 23px; height: 15px; background-position: -100px -100px; } /* white shipping */ .dashboard .col2-set + .col2-set .box-title:before, .customer-address-form .fieldset + .fieldset .legend:before, .order-info-box h2:before, .customer-address-index .addresses-primary .item + .item h3:before, #checkout-step-shipping_method h3:before { width: 25px; height: 23px; background-position: -30px -100px; } /* white order history */ .dashboard .box-recent .box-head:before, .order-history .block-title:before, .order-details .table-caption:before, .customer-address-index .addresses-additional h2:before { vertical-align: top; width: 23px; height: 16px; background-position: -140px -100px; } /* usps */ ul.usps { list-style: none; margin: 0 0 25px; } ul.usps li { color: #575a5d; font-style: italic; margin: 0 0 15px; } ul.usps li:before { vertical-align: middle; background-position: -80px -280px; width: 11px; height: 10px; } /* side bar */ .sidebar h2 { background: #1a3b88; padding: 19px; font-size: 16px; font-weight: normal; color: #fff; margin-bottom: 0; } .block-title { background: #1a3b88; padding: 19px; font-size: 16px; font-weight: normal; color: #fff; } .sidebar .block-layered-nav ul { padding: 0 25px; } .sidebar .block-layered-nav li { border-bottom: 0; } .sidebar .block-layered-nav li a { padding: 0; display: inline; border-bottom: 0; } .catalog-category-view .sidebar li { padding: 10px 5px; border-bottom: 1px solid #d3d3d4; } .catalog-category-view .sidebar li a { color: #000; text-decoration: none; } .catalog-category-view .mb-mana-catalog-leftnav li { border-bottom: 0; } .sidebar ul { padding: 0 15px; margin: 0; } .sidebar li a { color: #3d3d3d; text-decoration: none; border-bottom: 2px solid #d3d3d4; display: block; padding: 10px 5px; } .sidebar li a:hover { text-decoration: underline; } .sidebar .active, .sidebar .current { color: #1a3b88; font-weight: bold; } .sidebar .current strong { font-weight: normal; } .sidebar .block-account .current { padding: 10px 5px; border-bottom: 2px solid #E2E2E2; } /* header */ .navigation-wrapper { position: relative; z-index: 3; background: #1a3b88; box-shadow: 0 2px 3px #464646; } .navigation-content { width: 984px; margin: 0 auto; } .navigation-content ul { list-style: none; margin: 0; } .navigation-content > ul { position: relative; z-index: 100; } .navigation-content > ul > li { float: left; } .navigation-content > ul > li > a { display: inline-block; font-size: 17px; color: #fff; text-decoration: none; padding: 0 20px; height: 60px; line-height: 60px; border-left: 2px solid transparent; border-right: 2px solid transparent; height: 60px; } .navigation-content > ul > li:hover > a, .navigation-content > ul > li > a.active { color: #1a3b88; background-color: #fff; } .navigation-content > ul > li:first-child > a { margin-left: -25px; } .navigation-content > ul > li.has-submenu:hover > a { z-index: 2; position: relative; margin-top: -2px; top: 2px; color: #C7C7C7; border-left-color: #cbcec9; border-right-color: #cbcec9; border-bottom: 2px solid #fff; } .navigation-content > ul > li > div { display: none; z-index: 1; position: absolute; left: 0; top: 60px; background: #fff; color: #000; width: 96%; padding: 2%; border: 2px solid #cbcec9; } .navigation-content > ul > li:hover > div { display: block; } .navigation-content > ul > li > div strong { display: block; font-size: 25px; font-weight: normal; margin: 0 0 20px; } .navigation-content > ul > li > div li a { display: block; padding: 10px 15px; border-bottom: 1px solid #e6e6e6; color: #000; text-decoration: none; } .navigation-content > ul > li > div li a.active, .navigation-content > ul > li > div li a:hover { background: #C7C7C7; border-bottom-color: #C7C7C7; color: #fff; } .navigation-content > ul > li > div li:first-child a.active, .navigation-content > ul > li > div li:first-child a:hover { border-top-color: #C7C7C7; } .navigation-content > ul > li > div li:first-child a { border-top: 1px solid #e6e6e6; } #search_mini_form { position: relative; float: right; padding: 10px 0; } #search_mini_form label { display: none; } #search_mini_form .input-text { width: 170px; padding: 6px 22px 6px 15px; border: 2px solid #f0f0f0; box-shadow: none; font-style: normal; background: #fafafb; background: -moz-linear-gradient(top, #fafafb 0%, #ffffff 50%, #fafafb 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fafafb), color-stop(50%,#ffffff), color-stop(100%,#fafafb)); background: -webkit-linear-gradient(top, #fafafb 0%,#ffffff 50%,#fafafb 100%); background: -o-linear-gradient(top, #fafafb 0%,#ffffff 50%,#fafafb 100%); background: -ms-linear-gradient(top, #fafafb 0%,#ffffff 50%,#fafafb 100%); background: linear-gradient(to bottom, #fafafb 0%,#ffffff 50%,#fafafb 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafb', endColorstr='#fafafb',GradientType=0 ); } #search_mini_form button { position: absolute; right: 10px; top: 50%; margin-top: -7.5px; } #search_mini_form button > span { overflow: hidden; text-indent: -10000px; font-size: 0; color: transparent; width: 16px; height: 17px; padding: 0; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -58px 0; } #search_mini_form .advanced-search-link { display: none; } .cms-page-wrapper { background: #fff; } .cms-page-content { overflow: hidden; padding: 4% 5% 4.5%; color: #575a5d; } #block-corporate_become_dealer { background-size: cover; } #block-corporate_become_dealer h2, #block-corporate_become_dealer h3 { font-size: 23px; padding-bottom: 30px; color: #fff; } #block-corporate_become_dealer .block-content { padding: 50px 0 30px; width: 984px; margin: 0 auto; color: #fff; } #block-corporate_become_dealer .button { margin-top: 7px; } #block-corporate_become_dealer .button span { background: #fff; color: #1A3B88; } #block-corporate_brands h2:first-child, #block-corporate_brands h3:first-child { font-size: 23px; background: #fff; padding: 0 20px; } #block-corporate_brands .block-content { width: 984px; margin: 0 auto; padding: 50px 0; } #block-corporate_brands .col4-set > div { text-align: center; float: none; display: inline-block; vertical-align: middle; width: 23.15%; } #block-corporate_brands .col4-set > div > p { margin: 50px 0 0; } #block-corporate_brands .col4-set > div > p:first-child { margin-top: 0; } #block-corporate_brands .col4-set > div > p img { vertical-align: middle; } .bg-line { text-align: center; border-top: 1px solid #c3c3c3; margin-top: 10px; display: block; padding-bottom: 50px; } .bg-line h2, .bg-line h3 { top: -0.5em; display: inline; position: relative; } #block-corporate_info_blocks .block-content { width: 984px; margin: 50px auto 30px; } #block-corporate_info_blocks .block-content h2 { margin: 35px auto 30px; } /* footer */ .footer { color: #fff; background: #1a3b88; } .footer-container-wrapper { overflow: hidden; text-align: left; padding: 0 0 30px; margin: 0 0 20px; border-bottom: 2px solid #8d9dc4; } .footer-top-wrapper { background: #fff; color: #1a3b88; border-bottom: 1px solid #5c73aa; } .footer-top-wrapper .block { width: 984px; margin: 0 auto; padding: 15px 0 1px; color: #1a3b88; } .footer-top-wrapper .block .col3-set .col-1, .footer-top-wrapper .block .col3-set .col-3 { width: 25%; min-height: 0 !important; float: none; display: inline-block; vertical-align: middle; } .footer-top-wrapper .block .col3-set .col-2 { width: 44%; font-size: 12px; min-height: 0 !important; float: none; display: inline-block; vertical-align: middle; } .footer-top-wrapper .block .col3-set .col-2 h2, .footer-top-wrapper .block .col3-set .col-2 h3 { font-size: 23px; margin-bottom: 8px; color: #1a3b88; } .footer-top-wrapper .block .col3-set .col-2 .button { float: right; margin-top: 17px } .footer-top-wrapper .block .col3-set .col-2 .button > span { height: 35px; line-height: 35px; font-size: 12px; font-weight: bold; padding: 0 20px; } .footer-bottom-wrapper { width: 984px; margin: 0 auto; text-align: center; } .footer-bottom-wrapper .footer-bottom { border-bottom: 2px solid #7689b8; text-align: left; padding-top: 30px; } #block-corporate_footer_address { width: 25%; float: left; font-size: 13px; line-height: 28px; } #block-corporate_footer_address strong { font-size: 15px; font-weight: normal; text-transform: uppercase; } #block-corporate_footer_menu { overflow: hidden; margin: 0 0 20px; } #block-corporate_footer_menu .col2-set .col-1 { width: 30%; } #block-corporate_footer_menu .col2-set .col-2 { width: 65%; } #block-corporate_footer_menu strong, #block-corporate_footer_menu h2 { color: #f5f5f5; font-size: 21px; font-weight: normal; margin-bottom: 20px; } #block-corporate_footer_menu .widget-latest li { padding: 0 !important; } #block-corporate_footer_menu a:hover { text-decoration: underline; } .footer-bottom-links { padding: 20px 0; } .footer-bottom-links > ul, .footer-bottom-links > ul li, .footer-bottom-links address { display: inline; } .footer-bottom-links > ul li { margin: 0 20px 0 0; } .footer-bottom-links > ul li a, .footer-bottom-links > address { font-style: normal; font-size: 14px; color: #d3d3d4; text-decoration: none; } .footer-bottom-links > ul li a:hover { text-decoration: underline; } .footer-bottom-links > ul li:after { position: relative; top: -2px; display: inline-block; content: ""; vertical-align: middle; width: 6px; height: 6px; margin: 0 0 0 25px; border-radius: 6px; background: #fff; } /* CMS */ .cms-page-view .col1-layout .main { padding: 0; } /* home */ .cms-index-index .main-container { margin: 0 auto; } .cms-index-index .col1-layout .main { background: none; width: 100%; margin: 0; padding: 0; } .cms-index-index .cms-page-wrapper { padding: 35px 0; background: #f5f5f5; } .cms-index-index .cms-page-content { width: 984px; padding: 0 6px; margin: 0 auto; } .cms-index-index .cms-page-content .std h1, .cms-compose .cms-page-content .std h1, .cms-index-index .cms-page-content .std h2, .cms-compose .cms-page-content .std h2, .cms-index-index .cms-page-content .std h3, .cms-compose .cms-page-content .std h3 { -o-column-span: 3; -webkit-column-span: 3; -moz-column-span: 3; -ms-column-span: 3; column-span: 3; } .cms-index-index .cms-page-content .std, .cms-compose .cms-page-content .std { -o-column-count:3; -ms-column-count:3; -webkit-column-count:3; /* Chrome, Safari, Opera */ -moz-column-count:3; /* Firefox */ column-count:3; -o-column-gap:5em; -ms-column-gap:5em; -webkit-column-gap:5em; /* Chrome, Safari, Opera */ -moz-column-gap:3em; /* Firefox */ column-gap:3em; } .cms-index-index .cms-page-content .std p, .cms-compose .cms-page-content .std p { line-height: 25px; } /* product detail */ .catalog-product-view .main { width: 100%; padding: 0; margin: 0; background: none; } /* ibanners home */ .cms-index-index .carousel { overflow: hidden; position: relative; padding: 50px 0 0; } .cms-index-index .carousel > div { z-index: 2; position: relative; } #ibanners-home { /*z-index: 1; position: absolute; top: 0; left: 0; */ } /* slogan */ #block-home_slogan h1 { font-weight: normal; font-size: 24px; color: #000; text-shadow: 1px 1px 1px #fff; } #block-home_slogan { padding-bottom: 140px; } /* top blocks */ #block-home_blocks { margin-bottom: 150px; font-size: 14px; } #block-home_blocks h2 { font-size: 25px; } #block-home_blocks .col4-set { padding: 0 3%; } #block-home_blocks .col4-set > div { float:left; background: #000; color: #fff; padding: 2% 2% 0.6%; width:20.25%; } #block-home_blocks .col4-set .col-2 { margin: 0 0 0 1%; } #block-home_blocks .col4-set .col-3 { margin: 0 1%; } #block-home_blocks .col4-set .col-4 { float:right; } #block-home_blocks p { margin: 0 0 10px; color: #d6d6d6; } #widget-static-block-home_blocks h2 { font-weight: normal; font-size: 16px; } /* information blocks */ #widget-static-block-home_information_blocks { z-index: 3; overflow: hidden; position: relative; top: -25px; margin-bottom: -27px; padding-top: 25px; } #widget-static-block-home_information_blocks .widget { padding: 15px 0; } #widget-static-block-home_information_blocks .widget-static-block-content:before { position: absolute; left: 50%; top: 0; margin-left: -10492px; display: block; content: ""; width: 984px; height: 25px; border: 10000px solid #fff; border-top: 0; border-bottom: 0; } #widget-static-block-home_information_blocks .col3-set > div { position: relative; width: 28.5%; padding: 0 1.75%; } #widget-static-block-home_information_blocks .col3-set > div p { color: #575a5d; } #widget-static-block-home_information_blocks .col-1:before, #widget-static-block-home_information_blocks .col-2:before, #widget-static-block-home_information_blocks .col-3:before, #widget-static-block-home_information_blocks .col-1:after, #widget-static-block-home_information_blocks .col-2:after, #widget-static-block-home_information_blocks .col-3:after { position: absolute; top: -40px; left: 0; margin-left: -45px; content: ""; display: block; border: 26px solid #fff; width: 50%; border-right: 26px solid transparent; border-top: 0; } #widget-static-block-home_information_blocks .col-1:after, #widget-static-block-home_information_blocks .col-2:after, #widget-static-block-home_information_blocks .col-3:after { left: auto; right: 0; margin-right: -45px; border-right-color: #fff; border-left-color: transparent; border-top: 0; } #widget-static-block-home_information_blocks h2 { font-size: 21px; color: #000; margin: 0 0 25px; } #widget-static-block-home_information_blocks img { margin: 0 0 5px; } #widget-static-block-home_slogan .widgets .widget-static-block-content { font-size: 15px; line-height: 22px; } /* testimonials */ #widget-static-block-home_testimonial_and_compose .widget { background-position:2000px top; } #widget-static-block-home_testimonial_and_compose #widget-static-block-compose > div { background: none !important; padding: 0; min-height: inherit; } #widget-static-block-home_testimonial_and_compose h2, #widget-static-block-compose h2 { color: #000; font-weight: normal; margin-bottom: 1em; } #widget-static-block-home_testimonial_and_compose .col2-set > div { width:43%; padding-top: 45px; } #widget-static-block-home_testimonial_and_compose .col2-set .col-2 { float: left; margin: 0 0 0 8%; width: 32%; padding: 45px 0 0 0; } #widget-static-block-home_testimonial_and_compose .col-1 { line-height: 22px; } #widget-static-block-home_testimonial_and_compose .col-1 strong, .cms-testimonials .cms-page-content strong { font-weight: normal; color: #14518d; } #widget-static-block-home_testimonial_and_compose .col-1 img, .cms-testimonials .cms-page-content img { margin: -5px 25px 0 0; } #widget-static-block-home_testimonial_and_compose > .widget { padding: 0; min-height: 507px; } #widget-static-block-compose .widget { padding: 40px 54% 50px 5.2%; background-position: right -10px; min-height: 340px; } #widget-static-block-compose .widget .std ul { margin-right: 5px; } /* story gallagher */ #widget-static-block-home_gallagher_story { background: #000 url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/story_bg.png) repeat-x 0 0; } #widget-static-block-home_gallagher_story .widget { color: #fff; padding: 0; background-position: center top; background-color: transparent; margin: 0 auto; } #widget-static-block-home_gallagher_story .widget-static-block-content { min-height: 219px; padding: 44px 46% 44px 0; font-size: 16px; width: auto; } #widget-static-block-home_gallagher_story .widget-static-block-content h2 { font-size: 42px; font-weight: normal; margin-bottom: 30px; } #widget-static-block-home_gallagher_story .widget-static-block-content p { color: #d3d3d4; line-height: 21px; } /* customer-service */ .cms-customer-service .cms-page-content .col2-set ul, .cms-customer-service .cms-page-content .col3-set ul, .cms-customer-service .cms-page-content .col4-set ul { list-style: none; padding: 30px 0 20px; margin: 0 0 0 20px; } .cms-customer-service .cms-page-content .col3-set .col-1, .cms-customer-service .cms-page-content .col3-set .col-3 { width: 30.33%; } .cms-customer-service .cms-page-content .col3-set .col-2 { width: 30.33%; margin: 0 4.5%; } .cms-customer-service .cms-page-content .col3-set { margin-bottom: 4.35%; } .cms-customer-service .cms-page-content .col2-set li, .cms-customer-service .cms-page-content .col3-set li, .cms-customer-service .cms-page-content .col4-set li { position: relative; margin: 0 0 10px; padding: 0 0 0 10px; } .cms-customer-service .cms-page-content .col2-set li:before, .cms-customer-service .cms-page-content .col3-set li:before, .cms-customer-service .cms-page-content .col4-set li:before { position: absolute; top: 5px; left: 0; content: ""; display: block; width: 4px; height: 8px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -350px -280px; } .cms-customer-service .cms-page-content .col2-set a, .cms-customer-service .cms-page-content .col3-set a, .cms-customer-service .cms-page-content .col4-set a { color: #333; text-decoration: none; } .cms-customer-service .cms-page-content .col2-set a:hover, .cms-customer-service .cms-page-content .col3-set a:hover, .cms-customer-service .cms-page-content .col4-set a:hover { text-decoration: underline; } .cms-customer-service .seo-block { padding: 0; } .cms-customer-service .seo-block .col2-set { color: #575a5d; } /* 404 */ .cms-no-route .cms-page-content .std ul { list-style: none; margin-left: 0; } .cms-no-route .cms-page-content .std li { position: relative;padding: 0 0 0 9px; margin: 0 0 5px; } .cms-no-route .cms-page-content .std p, .cms-no-route .cms-page-content .std h1 { margin: 0 0 30px; } /* compose */ .help-text-columns .col-1 { background: #fff; width: 71%; padding: 1.6% 2% 1.6% 3%; } .help-text-columns .col-2 { background: #000; width: 19.4%; padding: 1.6% 3% 1.6% 1.6%; min-height: 165px; line-height: 30px; color: #fff; } .help-text-columns .col-2 .help-text { color: #fff; line-height: 27px; } .help-text-columns .col-2 .help-text:before { display: none; } .help-text-columns .col-2 .help-text em { display: block; font-size: 25px; font-style: normal; margin: 5px 0 20px; } .help-text-columns .col-2 .help-text em:before { position: relative; top: -5px; float: left; } .help-text-columns .col-2 .help-text strong { display: block; } .cms-compose .cms-page-wrapper, #block-compose_blocks { background: #f5f5f5; } #block-compose_blocks { padding: 3.2% 3.2% 6.4% 3.2%; } #block-compose_blocks .col3-set > div { width:28.1%; padding: 30px 1.7% 20px; background: #ffffff; border: 1px solid #d8d8d9; } #block-compose_blocks h3 { font-size: 19px; margin: 0 0 30px; } #block-compose_blocks .button { display: inline; } #block-compose_blocks .button > span { min-width: 67.7%; padding: 0; } /* account */ .box-recent, .order-history { background: #f1f1f2; padding: 0 0 40px; margin: 0 0 25px; } #my-orders-table .price { display: block; text-align: right; } .box-recent em, .order-history em { font-style: normal; } #my-orders-table thead th, #my-orders-table tbody td { padding: 1.2% 3%; border: none; border-bottom: 1px solid #d7d7d8; background: #f1f1f2; } #my-orders-table tbody td.last a:first-child { line-height: 25px; } #my-orders-table thead th { padding: 30px 5px 15px; color: #575a5d; font-weight: normal; } #my-orders-table tbody td { padding: 15px 5px;} #my-orders-table thead th.first, #my-orders-table tbody td.first { padding-left: 15px; } #my-orders-table thead th.last, #my-orders-table tbody td.last { padding-right: 15px; } #my-orders-table h3 { font-size: 15px; margin: 0; } table#my-orders-table tfoot tr:first-child td { padding-top: 15px; } #my-orders-table tfoot tr td { border: none; padding-left: 0; } #my-orders-table tfoot tr td:first-child { padding: 5px 0 5px 60%; } #my-orders-table tfoot strong { display: block; border-top: 1px solid #d7d7d8; padding-top: 10px; } /* checkout */ .popup-block .block-title { overflow: visible; height: auto; line-height: 20px; } .popup-block .block-content { padding: 20px; } /* blog */ .blog-index-list .col-main { padding: 25px 0 85px 0; } .blog-index-list .col-main > div > h1 { padding: 0 5%; } .menu-categories h5 { display: none; } .blog-cat-view .content-wrapper { padding: 0; } .blog-index-list h1 { color: #000; } .postWrapper { clear: both; margin: 0 0 15px; min-height: 236px; } .postWrapper.odd { background: #f5f5f5; } .postWrapper .post-image { float: left; width: 39%; } .postWrapper .post { color: #000; padding: 3.5% 2.5% 3.5% 41.5%; } .postWrapper .post h2 { font-size: 25px; line-height: 29px; } .postWrapper .post h2 a { color: #000; text-decoration: none; } .postWrapper .post h3 { color: #575A5D; font-size: 15px; } .postWrapper .post p { margin: 0 0 15px; } .blog-post-view .postWrapper { padding: 2.5% 5%; color: #000; margin-bottom: 0; } .blog-post-view .postTitle { margin: 0 0 30px; } .blog-post-view .postTitle h3 { font-size: 15px; color: #666464; } .blog-post-view .postContent { overflow: hidden; margin: 10px 0 20px; } .blog-post-view #share { overflow: hidden; } .blog-post-view #share strong { display: none; } .blog-post-view #share li { float: left; margin: 0 5px 10px 0; } .post-navigation { padding: 2.5% 0 0; margin: 0 5%; } .post-navigation .prev { float: left; } .post-navigation .next { float: right; } .postWrapper + .post-navigation { padding-bottom: 5%; border-top: 1px solid #e5e5e5; } .post-navigation a { position: relative; } .post-navigation .prev { padding: 0 0 0 15px; } .post-navigation .next { padding: 0 15px 0 0; } .post-navigation .prev:before, .post-navigation .next:after { position: absolute; top: 50%; margin-top: -4px; display: block; content: ""; width: 3px; height: 7px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat 0 0; } .post-navigation .prev:before { left: 0; background-position: -113px -1px; } .post-navigation .next:after { right: 0; background-position: -123px -1px; } .seo-block, #block-blog_seo_text { padding: 8% 5% 6%; } .seo-block h2 { margin-bottom: 30px; } /* kb */ .kbase-wrapper, .kbase { color: #000; padding: 2.5% 5%; } .kbase-wrapper .kbase { padding: 0; } .kbase-block, .kbase-main-category .kbase-list > li { margin: 0 0 30px; } .kbase ol, .accordion { counter-reset: question; } .kbase ol li, .accordion dt { padding: 10px 30px; background: #f1f1f2; margin: 0 0 1px; border-radius: 2px; } .kbase ol li:before, .kbase-category dt a:before { counter-increment: question; content: counter(question); margin: 0 30px 0 0; } .kbase-main-category h2 a, .kbase li a, .accordion dt a { text-decoration: none; color: #000; } .kbase-main-category h2 a:hover, .kbase ol a { text-decoration: underline; } .kbase ol a:hover { text-decoration: none; } .kbase-main-search, .accordion dd { border: 1px solid #14518d; border-radius: 2px; } .kbase-main-search .kbase-block-content { padding: 2.5% 19%; } .kbase-main-search .kbase-block-content label { display: none; } .kbase-main-search .kbase-block-content .input-box { width: 75%; float: left; margin-right: 0; } .kbase-main-search .button > span { padding: 7px 25px; height: 26px; line-height: 26px; } .accordion dt { cursor: pointer; } .accordion dt p { margin: 0; } .accordion dd { color: #000; max-height: 0; padding: 0; opacity: 0; transition: max-height .75s ease, opacity 0s ease, padding 0s ease; border-radius: 0 0 2px 2px; margin: 0 0 1px; overflow-y: hidden; } .accordion dt.active { margin: 0; padding: 10px 30px; } .accordion dt.active a { font-size: 18px; color: #fff; } .accordion dt.active + dd { max-height: 500px; opacity: 1; padding: 2.5%; } .kbase-article-date, .kbase-article-author, .kbase-article-category, .kbase-article-tag { display: none; } .content-wrapper { padding: 3% 4% 4.5%; } .service h2, .service h3, .service h4, .order-history .block-title, .popup-block .block-title, .kbase-main-search h2, .accordion dt.active, .web-form .fieldset h2, .blue-heading { background-color: #1a3b88; } /* web form */ .web-form + p { display: none; } .web-form .fieldset { background: #f1f1f2; margin: 0 0 25px; } .web-form .fieldset .form-list { width: 96.6%; padding: 3.4% 1.7%; margin: 0; } .web-form .form-list textarea { width: 96.7%; padding: 1% 1.5%; } .web-form .form-list li.control { position: relative; padding-left: 20px; } /*.web-form .form-list li.control input { position: absolute; top: 5px; left: 0; }*/ .hide { display: none; } /* dealer locator */ #widget-static-block-locate_dealer { color: #fff; background: #14518d; } #widget-static-block-locate_dealer .widget { background: #14518d; } #widget-static-block-locate_dealer h2, #block-dealers_search h2 { color: #fff; margin: 0 0 30px; } #block-dealers_search { color: #fff; } #widget-static-block-locate_dealer > .widget-static-block { background-position: center left; background-size: cover; } #widget-static-block-locate_dealer .widget-static-block-content { line-height: 26px; min-height: 285px; padding: 50px 0 40px 0; min-width: 0; margin-left: 0; } #block-dealers_search .input-box, #widget-static-block-locate_dealer .input-box { float: left; width: 43.8%; margin-right: 12px; } #block-dealers_search .input-box input, #widget-static-block-locate_dealer .input-box input { padding: 13px 0; } #block-dealers_search .button, #widget-static-block-locate_dealer .button { float: left; } #block-dealers_search.button > span, #widget-static-block-locate_dealer .button > span span { padding: 0 20px; } #widget-static-block-locate_dealer .button > span { padding: 0; } #block-dealers_search { line-height: 26px; padding: 3.5% 31.5% 0 4.8%; background-color: #14518d; background-position: center left; background-size: cover; /* url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/deaker_bg_depth.png) no-repeat 100% 0;*/ } /*.dealers-wrapper #block-locate_dealer { background-image: none !important; padding: 3.5% 4.8% 0; }*/ #mct-retailstore-form label { display: none; } #widget-static-block-locate_dealer ul.form-list { list-style: none; margin-left: 0; } #mct-retailstore-form ul, #mct-retailstore-form li { list-style: none !important; margin: 0; display: inline; } #mct-retailstore-form li:after { display: none; } #mct-retailstore-form .buttons-set { clear: none; display: inline; } #mct-retailstore-form-current { display: none; } #mct-retailstore-search { margin: 15px 0; } .mct-retailstore-list { padding: 0 25px; } .mct-retailstore-list li { position: relative; clear: both; padding: 20px 0 0; border-top: 1px solid #c9d4da; } .mct-retailstore-list li img { max-width: 125px; } .mct-retailstore-list li span { float: right; width: 60%; } .mct-retailstore-list li:first-child { border: none; } .mct-retailstore-list li input { display: none; } .mct-retailstore-list li em { float: right; color: #575a5d; } .mct-retailstore-list li.active:after { position: absolute; right: -25px; top: 20px; display: inline-block; content: ""; width: 13px; height: 12px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -50px -280px; } .dealers-wrapper #mct-retailstore-map { width: 100%; height: 325px; } .dealers-wrapper #mct-retailstore-geolocate { float: left; clear: both; display: inline; width: auto; height: auto; margin: 20px 0 20px 0; } .dealers-wrapper #mct-retailstore-geolocate span { display: inline; padding: 0; height: 0; line-height: 16px; font-size: 15px; text-decoration: underline; color: #ff7900; background: none; } .dealers-wrapper #mct-retailstore-geolocate span:hover { text-decoration: none; } .dealers-wrapper > ul { padding: 2%; } .store-image { margin-bottom: 3%; } .cms-home #mct-retailstore-geolocate { display: none; } .dealers-list { color: #000; } .dealers-list > li { overflow: hidden; position: relative; padding: 3% 25px 2.1% 0; line-height: 23px; } .dealers-list > li img { float: left; max-width: 215px; } .dealers-list > li span.counter { position: absolute; left: 25px; top: 0; display: block; text-align: center; font-size: 13px; line-height: 40px; width: 31px; height: 42px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -120px -220px; } .dealers-list .dealer-content { position: relative; margin-left: 225px; padding-left: 65px; } .dealers-list li.even { background: #f5f5f5; } .dealers-list h2 { margin-bottom: 25px; } .dealers-list h2 a { text-decoration: none; } .dealers-list h2 a:hover { text-decoration: underline; } .dealers-list a { color: #000; } .dealers-list a:hover { text-decoration: none; } .dealers-list address { font-style: normal; } .dealers-list dt { float: left; font-weight: normal; } .dealers-list dd { padding: 0 0 0 54%; } .dealers-list .col3-set > div { position: relative; line-height: 25px; } .dealers-list .col3-set .col-1 { width: 21.89%; margin-right: 8.87%; } .dealers-list .col3-set .col-2 { width: 28.99%; margin-right: 10.65%; margin-left: 0; } .dealers-list .col3-set .col-3 { width: 29%; margin: 0; } .dealers-list .col3-set .col-3 dl { margin-bottom: 65px; } .dealers-list .dealer-usps { font-style: italic; color: #575a5d; margin: 0; } .dealers-list .dealer-usps li { position: relative; padding: 10px 0 0 35px; margin: 0 0 10px; } .dealers-list .dealer-usps li:before { position: absolute; left: 0; top: 10px; } .mapsLabel { color: #000; font-size: 13px; } .gm-style-iw h2 { font-size: 1.2em; white-space: nowrap } .purple-block { background: #6e7cb4; } .blue-block { background: #1a3b88; } .dealer-locator { padding: 25px 35px 1px; } .dealer-locator h2 { color: #fff; margin: 0 0 30px; font-size: 26px; } .dealer-locator #mct-retailstore-geolocate span, .dealer-locator p { color: white; } .dealer-locator button.button > span { background-color: #ff7900; } .dealer-locator .form-list .input-box { display: inline-block; min-width: 73%; } .dealer-locator .form-list input.input-text { padding: 13px 0; } .web-form li > div { position: relative; } .web-form li .input-box ul { padding: 0 !important; margin: 0; } /* .web-form li .control { display: inline; } */ .web-form li .control label { opacity: 1; position: static; color: #575A5D; border: none; display: inline; height: auto; padding: 0; background: none; } .web-form li .control label:before, .web-form li .control label:after, .web-form li .control:after { display: none; } .web-form li .control input { display: inline-block; vertical-align: middle; } .web-form .input-box { position: relative; } .web-form .input-box em { color: #1a3b88; position: absolute; right: 0; top: 0; } /* contact */ .contact-wrapper .col2-set { color: #3d3d3d; } .contact-wrapper .col2-set .col-1 .cms-bg { padding-top: 5px; } .contact-wrapper .col2-set .col-2 .cms-bg { padding-bottom: 5px; } .contact-wrapper .cms-bg { background: #F1F1F2; padding: 20px; margin: 0 0 40px; } .contact-wrapper .web-form textarea { height: 322px; } .contact-wrapper address { font-style: normal; padding: 0 35px; margin: 0 0 35px; } .contact-wrapper address h2 { font-weight: normal; margin: 0 0 25px; } .contact-wrapper address p { line-height: 27px; } .contact-wrapper .web-form .button { float: none; } .contact-wrapper .web-form .button > span { width: 250px; } /* Ajax scrolling */ .if-scroll-loader { margin-top: 20px; } .if-scroll-loader img { width: 50px; } #isToTop { right: 20px; z-index: 200; background: #000; border-radius: 4px; padding: 10px; } #isToTop a { color: #fff; text-decoration: none; } /* Media queries */ @media screen and (max-width: 1580px) { #widget-static-block-home_testimonial_and_compose .widget { background-position: 1140px top; } } @media screen and (min-width: 1580px) { #widget-static-block-home_testimonial_and_compose .widget { background-position: right top; } } @media screen and (min-width: 1280px) { .page { margin: 0 auto; } #block-ge_toplinks { width: auto; margin-bottom: 0; float: left; } .header .to-shop-btn { position: static; right: 0; float: right; } .switcher-language { margin-top: 0; } .header .quick-access { width: 900px; position: static; } .header .quick-access .links { } .header .quick-access .links, .header .quick-access .links li { display: inline; float: none; margin-right: 0; margin-top: 0; } .footer-top-wrapper .block, .footer-bottom-wrapper, .main, .col2-left-layout .main, .col2-right-layout .main, .header, .navigation-content, .breadcrumbs, .home-wrapper > .widget-static-block-wrapper > .widget > .widget-static-block-content, .cms-index-index .cms-page-content, .cms-index-index .carousel > .block-cms, .cms-page-view .col1-layout .main, .breadcrumbs-wrapper, #block-corporate_brands .block-content, #block-corporate_info_blocks .block-content { width: 1236px; } #block-corporate_become_dealer .block-content { width: 1236px; padding-bottom: 50px; } .sorter .sort-by select { width: 269px; } .spotlight-colset {} .switcher-language { min-width: 158px; } #search_mini_form .input-text { width: 299px; } .navigation-content > ul > li > a { padding: 0 32px; } } #search_autocomplete { display: block !important; } #hi-cookie-box a { color: #fff; } #hi-eu-opt-in .opt-in-splash.unconfirmed { background-position: 0 -197px; } /** * Magento * * NOTICE OF LICENSE * * This source file is subject to the Academic Free License (AFL 3.0) * that is bundled with this package in the file LICENSE_AFL.txt. * It is also available through the world-wide-web at this URL: * http://opensource.org/licenses/afl-3.0.php * If you did not receive a copy of the license and are unable to * obtain it through the world-wide-web, please send an email * to license@magentocommerce.com so we can send you a copy immediately. * * DISCLAIMER * * Do not edit or add to this file if you wish to upgrade Magento to newer * versions in the future. If you wish to customize Magento for your * needs please refer to http://www.magentocommerce.com for more information. * * @category design * @package base_default * @copyright Copyright (c) 2013 Magento Inc. (http://www.magentocommerce.com) * @license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0) */ /* Widgets =============================================================================== */ .widget { display:inline; } .widget .mini-products-images-list { } /* Widget: Catalog New Proructs List */ .widget-new-products { display:block; } /* Widget: Recently Viewed Proructs */ .widget-viewed { display:block; } /* Widget: Recently Compared Proructs */ .widget-compared { display:block;} /* Widget: CMS Static Block */ .widget-static-block {} /* Widgets: Links Common Styles */ .top-container .widget a { padding:0 0 0 7px; } .bottom-container .widget a { padding:0 3px; } /* Widget: Catalog Product Link */ .widget-product-link-inline { display:inline; } /* Widget: Catalog Category Link */ .widget-category-link-inline { display:inline; } /* Widget: CMS Page Link */ .widget-cms-link-inline { display:inline; } /* ======================================================================================= */ /* css file is not used */ /** * MageWorx * * NOTICE OF LICENSE * * This source file is subject to the MageWorx EULA that is bundled with * this package in the file LICENSE.txt. * It is also available through the world-wide-web at this URL: * http://www.mageworx.com/LICENSE-1.0.html * * If you did not receive a copy of the license and are unable to * obtain it through the world-wide-web, please send an email * to license@mageworx.com so we can send you a copy immediately. * * DISCLAIMER * * Do not edit or add to this file if you wish to upgrade the extension * to newer versions in the future. If you wish to customize the extension * for your needs please refer to http://www.mageworx.com/ for more information * or send an email to sales@mageworx.com * * @category skin_default * @package MageWorx_Downloads * @copyright Copyright (c) 2009 MageWorx (http://www.mageworx.com/) * @license http://www.mageworx.com/LICENSE-1.0.html */ /** * Downloads extension * * @category skin_default * @package MageWorx_Downloads * @author MageWorx Dev Team */ .downloads-links-block { margin-top: 4px; margin-bottom: 7px; border: solid 1px #DFDFDF; padding: 7px; } .downloads-links-block .head { padding-bottom: 4px; } .downloads-item .item-icon, .downloads-item .item-link, .downloads-item .item-info { display: inline-block; } .downloads-links-block .downloads-item .item-icon { width: 20px; height: 16px; padding-top: 3px; } .downloads-links-block .downloads-item .item-description { padding-left: 25px; } .downloads-links-block .category-title { font-weight: bold; } .downloads-links-block .category-files { padding: 0 0 10px 10px; } .downloads-links-block .access-notice { padding-top: 3px; } .downloads-links-block span { padding-left: 5px; color: #EF5E2C; font-style: italic; } #downloads_video_overlay { cursor: pointer; opacity: 0.8; display: block; position: fixed; bottom:0; right: 0; background: #000000; width: 100%; height: 100%; z-index: 1000; } #downloads_video_popup { z-index: 1001; width: 600px; height: auto; position: fixed; } #downloads_video_popup .popup-cont { background: #ffffff; border-radius: 8px; padding: 13px 0; } #downloads_video_popup .spinner { display: none; background: url(https://www.gallaghereurope.com/skin/frontend/base/default/images/mageworx/downloads/spinner.gif) no-repeat center center; height: 70px; } #downloads_video_popup .spin { display: block !important; } #downloads_video_popup .close-button { background: transparent url(https://www.gallaghereurope.com/skin/frontend/base/default/images/mageworx/downloads/close-button.png) 0 0 no-repeat; position: absolute; width: 32px; height: 32px; cursor: pointer; position: absolute; top: -15px; left: 585px; } @charset "UTF-8"; /*! Animate.css - http://daneden.me/animate Licensed under the MIT license Copyright (c) 2013 Daniel Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; visibility: visible; } 25%, 75% { opacity: 0; visibility: hidden; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; visibility: visible; } 25%, 75% { opacity: 0; visibility: hidden; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pulse { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% { -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% { -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% { -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% { -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% { -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% { -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } } @keyframes shake { 0%, 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); transform: translateX(0%); } } @keyframes wobble { 0% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; visibility: visible; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; visibility: visible; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; visibility: visible; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; visibility: visible; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; visibility: visible; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; visibility: visible; -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); transform: scale(.3); } } @keyframes bounceOut { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; visibility: visible; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; visibility: visible; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; visibility: hidden; } 100% { opacity: 1; visibility: visible; } } @keyframes fadeIn { 0% { opacity: 0; visibility: hidden; } 100% { opacity: 1; visibility: visible; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { 0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } @keyframes fadeOut { 0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(20px); transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-20px); transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(20px); transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; -ms-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; visibility: hidden; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; visibility: visible; } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; visibility: hidden; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; visibility: visible; } } .flipInX { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; visibility: hidden; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; visibility: visible; } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; visibility: hidden; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); -ms-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); -ms-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; visibility: visible; } } .flipInY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; visibility: hidden; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; visibility: hidden; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; visibility: hidden; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; visibility: hidden; } } .flipOutY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; visibility: hidden; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; visibility: visible; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; visibility: visible; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; visibility: hidden; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; visibility: visible; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; visibility: visible; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; visibility: hidden; } } @keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; visibility: visible; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; visibility: hidden; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; visibility: hidden; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; visibility: hidden; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; visibility: hidden; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; visibility: visible; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; visibility: hidden; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes slideInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } @-webkit-keyframes slideInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes slideOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; visibility: visible; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; visibility: hidden; } } @keyframes hinge { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; visibility: visible; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; visibility: hidden; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; visibility: hidden; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; visibility: visible; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; visibility: visible; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; visibility: hidden; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; visibility: visible; } } @keyframes zoomIn { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; visibility: visible; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInDown { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(-2000px); -ms-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(60px); -ms-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(48px); transform: scale(.475) translateX(48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInLeft { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(-2000px); -ms-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(48px); -ms-transform: scale(.475) translateX(48px); transform: scale(.475) translateX(48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(-48px); transform: scale(.475) translateX(-48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInRight { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(2000px); -ms-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(-48px); -ms-transform: scale(.475) translateX(-48px); transform: scale(.475) translateX(-48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInUp { 0% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(2000px); -ms-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(-60px); -ms-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { 0% { opacity: 1; visibility: visible; -webkit-transform: scale(1); transform: scale(1); } 50% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); transform: scale(.3); } 100% { opacity: 0; visibility: hidden; } } @keyframes zoomOut { 0% { opacity: 1; visibility: visible; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { opacity: 0; visibility: hidden; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 100% { opacity: 0; visibility: hidden; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-transform-origin: center bottom; transform-origin: center bottom; } } @keyframes zoomOutDown { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(-60px); -ms-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(2000px); -ms-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(42px); transform: scale(.475) translateX(42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(42px); -ms-transform: scale(.475) translateX(42px); transform: scale(.475) translateX(42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(-2000px); -ms-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(-42px); transform: scale(.475) translateX(-42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateX(-42px); -ms-transform: scale(.475) translateX(-42px); transform: scale(.475) translateX(-42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateX(2000px); -ms-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-transform-origin: center top; transform-origin: center top; } } @keyframes zoomOutUp { 40% { opacity: 1; visibility: visible; -webkit-transform: scale(.475) translateY(60px); -ms-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; visibility: hidden; -webkit-transform: scale(.1) translateY(-2000px); -ms-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } body.no-bg-img { background-image: none; } #ibanners-corporate_home-wrapper { position: relative; z-index: 2; } #ibanners-corporate_home { margin: 0 auto; max-width: 1920px; width: auto; } .ibanners.animated ul { height: 0; padding-bottom: 38.75%; overflow: hidden; position: relative; } .ibanners.animated ul li { position: relative; top: 0; left: 0; height: 100%; width: 100%; } .ibanners.animated ul li > a, .ibanners.animated ul li img { display: block; } .ibanners.static { overflow: hidden; width: 100%; } .ibanners.static ul { height: 1%; overflow: hidden; width: 10000px; } .ibanners.static ul li { float: left; } .ibanners .banner-text { width: 100%; position: absolute; z-index: 1; padding-top: 30px; left: 0; right: 0; top: 17%; } .ibanners .banner-text h3 { color: #fff; font-size: 38px; padding-bottom: 24px; margin: 0 auto; width: 986px; text-shadow: 2px 2px #2B2B2B; } .ibanners .banner-text .html { color: #fff; font-size: 19px; line-height: 27px; margin: 0 auto; width: 986px; margin: 0 auto; text-shadow: 2px 2px #2B2B2B; } .ibanners .banner-text .html .button { line-height: 50px; padding: 0 50px; text-shadow: none; background: #fff; border-radius: 2px; } .ibanners .banner a { position: relative; } #ibanners-corporate_home-wrapper .controls { position: absolute; width: 100%; bottom: 5%; text-align: center; z-index: 50; } #ibanners-corporate_home-wrapper .controls .control-prev { display: inline-block; } #ibanners-corporate_home-wrapper .controls .control-next { display: inline-block; margin-left: 8px; } #ibanners-corporate_home-wrapper .controls .control-prev a { display: inline-block; vertical-align: middle; height: 80px; width: 80px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -132px 0; } #ibanners-corporate_home-wrapper .controls .control-next a { display: inline-block; vertical-align: middle; height: 80px; width: 80px; background: url(https://www.gallaghereurope.com/skin/frontend/gallagher/corporate/images/sprite.png) no-repeat -212px 0; } .banner-bullet-controls { margin: 0 auto; width: 986px; } .banner-bullet-controls .bullet { display: inline-block; vertical-align: middle; width: 184px; height: 116px; line-height: 116px; margin-left: 8px; position: relative; background-size: cover; border: 2px solid #000; border-radius: 2px; overflow: hidden; } .banner-bullet-controls .bullet:before { content: ""; background-color: rgba(0,0,0,0.3); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#000, endColorstr=#000)"; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .banner-bullet-controls .bullet:first-child { margin-right: 0; } .banner-bullet-controls .bullet-title { color: #fff; font-size: 16px; text-shadow: 2px 2px #2B2B2B; display: inline-block; line-height: 30px; vertical-align: middle; padding: 10px 30px; z-index: 50; position: relative; } .banner-bullet-controls .bullet img { position: absolute; top: 0; left: 0; z-index: 20; } .banner-bullet-controls .bullet.active { border: 5px solid #fff; width: 174px; height: 106px; line-height: 106px; box-shadow: 0px 0px 15px #0E0E0E; } .banner-bullet-controls .bullet.active:before { display: none; } .banner-bullet-controls .bullet.active .bullet-title { padding: 10px 20px; } /* Media queries */ @media screen and (min-width: 1150px) { #ibanners-corporate_home-wrapper .controls { bottom: 10%; } } @media screen and (min-width: 1280px) { .ibanners .banner-text h3, .ibanners .banner-text .html { width: 1036px; } .ibanners .banner-text { padding-top: 57px; } .banner-bullet-controls { width: 1236px; } .banner-bullet-controls .bullet { width: 244px; height: 146px; line-height: 146px; margin-left: 12px; } .banner-bullet-controls .bullet.active { width: 234px; height: 136px; line-height: 136px; } .banner-bullet-controls .bullet-title { font-size: 23px; } .banner-bullet-controls .bullet.active .bullet-title { padding: 10px 20px; } #ibanners-corporate_home-wrapper .controls { bottom: 14%; } #ibanners-corporate_home-wrapper .controls .control-next { margin-left: 12px; } } @media screen and (min-width: 1400px) { #ibanners-corporate_home-wrapper .controls { bottom: 17%; } }