a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:after, blockquote:before, q:after, q:before { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* MEDIAQUERIES */ /* CSSGRID - VARAIBLES */ /* MIXINS */ .error-state:focus, .error-state:not([type=checkbox]) + span:focus, .error-state[type=checkbox] + span:focus:before, input:focus, textarea:focus, .error-state:active, .error-state:not([type=checkbox]) + span:active, .error-state[type=checkbox] + span:active:before, input:active, textarea:active, .error-state:hover, .error-state:not([type=checkbox]) + span:hover, .error-state[type=checkbox] + span:hover:before, input:hover, textarea:hover { box-shadow: 0 0 5px #0052a4; border-color: #0052a4; } input, input[type=radio] + span, textarea { font-size: 16px; } @media only screen and (min-width: 1180px) { input, input[type=radio] + span, textarea { font-size: 16px; } } /* Fix display in IE using HTML5 elements */ header, nav, main, footer { display: block; } .hidden { border: 0; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt0 { margin-top: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt0 { padding-top: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb0 { margin-bottom: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb0 { padding-bottom: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml0 { margin-left: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl0 { padding-left: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr0 { margin-right: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr0 { padding-right: 0px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt5 { margin-top: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt5 { padding-top: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb5 { margin-bottom: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb5 { padding-bottom: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml5 { margin-left: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl5 { padding-left: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr5 { margin-right: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr5 { padding-right: 5px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt10 { margin-top: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt10 { padding-top: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb10 { margin-bottom: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb10 { padding-bottom: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml10 { margin-left: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl10 { padding-left: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr10 { margin-right: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr10 { padding-right: 10px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt15 { margin-top: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt15 { padding-top: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb15 { margin-bottom: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb15 { padding-bottom: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml15 { margin-left: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl15 { padding-left: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr15 { margin-right: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr15 { padding-right: 15px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt20 { margin-top: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt20 { padding-top: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb20 { margin-bottom: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb20 { padding-bottom: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml20 { margin-left: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl20 { padding-left: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr20 { margin-right: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr20 { padding-right: 20px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt30 { margin-top: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt30 { padding-top: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb30 { margin-bottom: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb30 { padding-bottom: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml30 { margin-left: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl30 { padding-left: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr30 { margin-right: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr30 { padding-right: 30px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt40 { margin-top: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt40 { padding-top: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb40 { margin-bottom: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb40 { padding-bottom: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml40 { margin-left: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl40 { padding-left: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr40 { margin-right: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr40 { padding-right: 40px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt50 { margin-top: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt50 { padding-top: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb50 { margin-bottom: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb50 { padding-bottom: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml50 { margin-left: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl50 { padding-left: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr50 { margin-right: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr50 { padding-right: 50px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt60 { margin-top: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt60 { padding-top: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb60 { margin-bottom: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb60 { padding-bottom: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml60 { margin-left: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl60 { padding-left: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr60 { margin-right: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr60 { padding-right: 60px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt80 { margin-top: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt80 { padding-top: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb80 { margin-bottom: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb80 { padding-bottom: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml80 { margin-left: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl80 { padding-left: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr80 { margin-right: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr80 { padding-right: 80px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mt100 { margin-top: 100px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pt100 { padding-top: 100px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mb100 { margin-bottom: 100px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pb100 { padding-bottom: 100px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .ml100 { margin-left: 100px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pl100 { padding-left: 100px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .mr100 { margin-right: 100px !important; } /* Example code: .mt20 [margin-top: 20px] .pl60 [padding-left: 60px] .mb10 [margin-bottom: 10px] */ .pr100 { padding-right: 100px !important; } /* GRID */ .grid { display: -ms-grid; display: grid; grid-column-gap: 0.5em; grid-row: auto; /* MOBILE AND TABLET GRID 6 columns /-1--||-2--||-3--||-5--||--5--||-6--\ */ -ms-grid-columns: 4fr 0.5em 4fr 0.5em 4fr 0.5em 4fr 0.5em 4fr 0.5em 4fr; grid-template-columns: repeat(6, 4fr); /* DESKTOP GRID 12 columns /-1--||-2--||-3--||-5--||--5--||-6--||-7--||-8--||-9--||-10-||-11-||-12-\ */ } @media only screen and (min-width: 1180px) { .grid { grid-column-gap: 1em; -ms-grid-columns: 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr 1em 4fr; grid-template-columns: repeat(12, 4fr); } } .collapse.grid { grid-column-gap: 0 !important; } html { box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; color: #272727; } *, *:before, *:after { box-sizing: inherit; outline: none; } #skip { position: relative; } #skip a { display: block; position: absolute; left: -999px; top: -999px; color: #0052a4; font-size: 15px; } #skip a:focus { z-index: 1; margin: 10px; top: 0; left: 0; padding: 5px; box-shadow: 0 0 3px #0052a4; } body { overflow-y: scroll; overflow-x: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; width: 100%; grid-template-areas: "cookie cookie cookie cookie cookie cookie cookie cookie cookie cookie cookie cookie" "banner banner banner banner banner banner banner banner banner banner banner banner" "main main main main main main main main main main main main" "footer footer footer footer footer footer footer footer footer footer footer footer"; } h1, h2, h3, h4, h5, h6 { font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; margin: 0; padding: 0; color: #0052a4; } .page-title h1 { color: #fff; } h1 { font: normal 30px/35px "American Typewriter ITC W01 Md", Arial, sans-serif; } @media only screen and (min-width: 769px) { h1 { font: normal 36px/41px "American Typewriter ITC W01 Md", Arial, sans-serif; } } @media only screen and (min-width: 1180px) { h1 { font: normal 60px/65px "American Typewriter ITC W01 Md", Arial, sans-serif; } } h2 { font: normal 30px/35px "American Typewriter ITC W01 Md", Arial, sans-serif; } @media only screen and (min-width: 769px) { h2 { font: normal 36px/41px "American Typewriter ITC W01 Md", Arial, sans-serif; } } @media only screen and (min-width: 1180px) { h2 { font: normal 50px/55px "American Typewriter ITC W01 Md", Arial, sans-serif; } } p { margin: 0 0 20px 0; font-size: 16px; color: #0052a4; line-height: 24px; } .hide { border: 0; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; } span { color: #0052a4; font-size: 15px; line-height: 24px; } span .policytext { color: #0052a4; font-size: 10px; line-height: 12px; } .text-center { text-align: center; } .bold, strong, b { font-weight: 700; } sup { vertical-align: super; font-size: 70%; text-decoration: none; } a { color: #0052a4; text-decoration: underline; } a:hover { text-decoration: none; } a:visited { color: #0052a4; } a.inverted { text-decoration: none; } a.inverted:hover { text-decoration: underline; } .typewriter { color: #0052a4; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; font-size: 18px; line-height: 26px; } .text-darkblue { color: #0c3f74; } .text-primaryblue { color: #0052a4; } ul:not(.main-navigation):not(.sub-nav-links):not(.mobile-links):not(.pet-selector) { list-style-type: disc; margin-left: 15px; margin-top: 20px; } ul:not(.main-navigation):not(.sub-nav-links):not(.mobile-links):not(.pet-selector) li { padding-left: 10px; color: #0052a4; font-size: 16px; line-height: 24px; } ul:not(.main-navigation):not(.sub-nav-links):not(.mobile-links):not(.pet-selector) li:not(:last-child) { margin-bottom: 10px; } @media only screen and (max-width: 1179px) { .divider { margin-top: 40px; margin-bottom: 40px; } } .divider hr { width: 100%; min-height: 2px; background: #e5eef5; border: none; } @media only screen and (min-width: 1180px) { .divider hr { width: 2px; min-height: 220px; } } .panel.rnd-corners { border-radius: 20px; } .panel.bg-white { background: #fff; box-shadow: 0 0 3px #0052a433; } section.bg-lightblue { border-top: 2px solid #d5dee3; border-bottom: 2px solid #d5dee3; background: #f0f9fe; } section.no-brdr-t { border-top: none; } section.no-brdr-b { border-bottom: none; } .footer-content p { color: gray; font-size: 14px; line-height: 21px; } #cookie-container { padding: 1em 0 1em 0; top: 0; background: #0052a4; position: relative; z-index: 999999999; min-height: 50px; } #cookie-container #cookie-inner #cookie-text p { color: #fff; margin-bottom: 20px; line-height: 17px; font-size: 12px; } @media only screen and (min-width: 1180px) { #cookie-container #cookie-inner #cookie-text p { font-size: 16px; line-height: 21px; margin-bottom: 0; } } #cookie-container #cookie-inner #cookie-text p a { -ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; color: #fff; font-weight: bold; } #cookie-container #cookie-inner #cookie-text p a:focus { box-shadow: 0 0 5px #c3d8eb; border: 1px solid #c3d8eb; margin-left: -1px; } #cookie-container #cookie-inner #cookie-text p a:hover { text-decoration: none; } #cookie-container #cookie-inner #cookie-close.button button.inverted { height: 30px; width: 100%; border: none; } #cookie-container #cookie-inner #cookie-close.button button.inverted:hover { background: #ccdded; } #cookie-container #cookie-inner #cookie-close.button button.inverted:focus { box-shadow: 0 0 4px 0 #fff; } .button.auto-width { justify-content: initial; } .button.auto-width button { min-width: 100%; } .button-icon button { grid-column-gap: 0; grid-template-areas: ". . container container container container container container container container . ."; min-width: 100%; } .button-icon button .container { grid-area: container; grid-template-areas: "icon icon icon icon text text text text text text text text"; } .button-icon button .icon { grid-area: icon; align-self: center; } .button-icon button .text { grid-area: text; color: #fff; text-align: left; padding-left: 5px; line-height: 18px; align-self: center; } .button.button-small.button-icon button { grid-template-areas: "icon icon icon text text text text text text text text text"; } .button button { height: 50px; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; font-size: 18px; color: #fff; background: #0052a4; border: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; cursor: pointer; } .button button:hover, .button button:active, .button button:focus { background: #005fbe; box-shadow: 0 0 5px #0052a4; border: 2px solid #fff; } .button button.green { background: #3e852e; } .button button.pink { background: #dd267d; } .button button.inverted { color: #0052a4; background: #fff; border: 1px solid #0052a4; } .button button.inverted:hover, .button button.inverted:active, .button button.inverted:focus { box-shadow: 0 0 5px #0052a4; border-color: #0052a4; } .button button.no-border { border: none; } .button button.other-docs { color: #0052a4; background: none; height: auto; } .button button.other-docs:hover, .button button.other-docs:active, .button button.other-docs:focus { box-shadow: 0 0 5px #0052a4; margin-top: -2px; } @media only screen and (max-width: 768px) { .button button.other-docs { margin-bottom: 20px; } } .button button.other-docs span.arrow { top: 4px; position: relative; fill: #0052a4; } .button button.other-docs[aria-expanded="true"] span.arrow svg { -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .card-container .card-detail { border-radius: 10px; background: #fff; -webkit-box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); padding: 20px 20px 60px 20px; } .card-container .card-detail h3 { margin: 10px 0; } .card-container .card-detail p { text-align: left !important; margin: 0 !important; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; font-size: 18px; } @media only screen and (min-width: 769px) { .card-container .card-detail { padding: 40px 60px 100px 60px; } } .card-container .card-detail .info, .card-container .card-detail .note { color: #0052a4; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; font-size: 18px; line-height: 23px; } @media only screen and (min-width: 1180px) { .card-container .card-detail .info, .card-container .card-detail .note { font-size: 25px; line-height: 30px; } } .card-container .card-detail .rule { grid-area: rule; border-top: 1px solid #c3d8eb; width: 100%; } /* @error states */ .error { display: -ms-grid; display: grid; min-height: 25px; } .error-state, .error-state:not([type=checkbox]) + span, .error-state[type=checkbox] + span:before { color: #a20b42 !important; border: #a20b42 1px solid !important; background: #fff5f9 !important; } .error-state[type=checkbox] + span:after { display: none; } .error-message { color: #a20b42; padding-top: 10px; margin-bottom: 0; align-self: end; } .select .error .select-arrow:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='161 763 11 21' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23A20B42' fill='none' d='M171.16 768.892l-4.32-4.318-4.24 4.242m8.56 10l-4.32 4.318-4.24-4.242'/%3E%3C/svg%3E"); } .icon, .icon-need-help { background-repeat: no-repeat !important; height: 20px; width: auto; background-size: 100%; background-position: center center !important; display: inline-grid; align-self: center; } .icon i { font-size: 15px; display: inline-grid; margin-left: 25px; } @media only screen and (min-width: 769px) { .icon i { font-size: 20px; margin-left: 30px; } } .icon-white path { fill: #fff; } .icon-blue path { fill: #0052a4; } .icon svg { height: 19px; width: 19px; display: grid; position: relative; height: auto !important; } .icon-circle { content: ''; height: 20px; width: 20px; background: #ffcb05; border-radius: 50%; } .icon-circle svg { display: grid; align-self: center; height: .85em !important; } .icon-large { height: 30px; width: 30px; } .icon-large svg { display: grid; align-self: center; justify-self: center; height: auto !important; } @media only screen and (min-width: 1180px) { .icon-large { height: 50px; width: 50px; } } .icon-need-help { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='44' viewBox='0 0 52 44'%3E%3Cg fill='none' stroke='%230055A4' stroke-width='2' transform='translate(1 1)'%3E%3Cpath d='M40.775186,13.622285 C39.3036941,5.91337239 30.7866412,0 20.5,0 C9.17816263,0 -1.13686838e-13,7.163444 -1.13686838e-13,16 C-1.13686838e-13,20.9851812 2.92113466,25.4378609 7.50033744,28.372231 C8.41499042,28.9583441 3.16547717,37.5754168 4,38 C4.86444391,38.4398062 11.8167622,30.6820867 13,31 C15.0926436,31.5622532 18.162761,32 20.5,32'/%3E%3Cpath d='M36.5,37 C37.9940333,37 39.4313819,36.8022477 40.7747721,36.4371144 C41.7549583,36.1706998 46.1343334,41.4328343 47,41 C47.8716377,40.5641802 45.228674,34.4323214 45.9547479,33.8517817 C48.4513027,31.8556362 50,29.0751845 50,26 C50,19.9248678 43.9558441,15 36.5,15 C29.0441559,15 23,19.9248678 23,26 C23,32.0751322 29.0441559,37 36.5,37 Z'/%3E%3C/g%3E%3C/svg%3E%0A"); display: inline-block; width: 70px; height: 60px; margin-left: auto; margin-right: auto; margin-bottom: 10px; background-repeat: no-repeat; background-size: 95%; } @media only screen and (max-width: 1179px) { .logo img { height: 32px; width: 108px; position: relative; } } @media only screen and (min-width: 1180px) { .logo:before { content: ''; width: 320px; height: 320px; background: #fff; margin-top: -205px; margin-left: -65px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; position: absolute; } .logo img { position: absolute; z-index: 99; } .logo img.equine { width: 220px; margin-left: -20px; } } .logo:after { content: ""; background: #fff; position: absolute; width: 100%; height: 55px; left: 0; top: 0; z-index: -1; } @media only screen and (max-width: 1179px) { .logo:after { border-bottom: 2px solid #c3d8eb; } } label { position: relative; } .label { padding: 10px 10px 10px 0; color: #0052a4; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; font-size: 18px; line-height: 22px; word-break: break-word; align-self: start; } @media only screen and (min-width: 1180px) { .label { -ms-grid-column-align: end; justify-self: right; align-self: center; } .label.has-info { margin-bottom: 28px; } } input { height: 50px; padding: 10px; width: 100%; border: #c3d8eb 1px solid; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; /* RADIOS */ /* CHECKBOX */ } input[type=radio]:hover + span, input[type=radio]:active + span, input[type=radio]:focus + span { color: #fff; background: #0052a4; box-shadow: 0 0 5px #0052a4; border-color: #0052a4; cursor: pointer; } input[type=radio]:checked + span { color: #fff; background: #0052a4; border-color: #0052a4; cursor: pointer; } input[type=radio] + span { display: flex; justify-content: center; align-items: center; text-align: center; cursor: pointer; height: 50px; line-height: 16px; background: #fff; border: #0052a4 1px solid; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } input[type=checkbox]:hover + span:before, input[type=checkbox]:active + span:before, input[type=checkbox]:focus + span:before { color: #fff; box-shadow: 0 0 5px #0052a4; border-color: #0052a4; } input[type=checkbox]:checked + span:before { color: #fff; background: #0052a4; box-shadow: 0 0 5px #0052a4; border-color: #0052a4; } input[type=checkbox] + span { position: relative; display: block; padding-left: 3.2em; min-height: 43px; align-self: center; cursor: pointer; } input[type=checkbox] + span:before { content: ""; top: 5px; left: 0; position: absolute; width: 35px; height: 35px; display: flex; cursor: pointer; background: #fff; border: #0052a4 1px solid; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } input[type=checkbox] + span:after { content: ''; position: absolute; top: 12px; left: 12px; width: 10px; height: 15px; border: solid #fff; border-width: 0 3px 3px 0; transform: rotate(37deg); cursor: pointer; } textarea { resize: none; width: 100%; min-height: 200px; padding: 10px; font-family: Arial, sans-serif; border: #c3d8eb 1px solid; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .tooltip { position: relative; margin-bottom: 10px; } .tooltip button { width: 22px; height: 22px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; border: 1px solid #0c3f74; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; background: #fff; cursor: pointer; position: absolute; right: 0; top: -30px; } .tooltip button:active, .tooltip button:hover, .tooltip button:focus { background: #0c3f74; color: #fff; box-shadow: 0 0 5px #0052a4; } .tooltip .tooltip-bubble { display: block; background: #e5eef5; padding: 20px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; font-size: 14px; line-height: 21px; color: #0c3f74; } .sub-nav ul li a { font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; text-decoration: none; font-size: 15px; color: #0052a4; display: inline-block; line-height: 18px; } .sub-nav ul li a:hover { color: #4a4a4a; } .sub-nav ul li a:visited { color: #0052a4; } .sub-nav ul li a.active { border-bottom: 3px solid #ffcb05; } .sub-nav ul li a:focus { box-shadow: 0 0 3px #0052a4; } @media only screen and (min-width: 769px) { .sub-nav ul li a { font-size: 20px; } } .sub-nav ul.sub-nav-links { display: inline-flex; } .sub-nav ul.sub-nav-links a span.dt { font-size: 20px; line-height: 18px; } .sub-nav ul.sub-nav-links a span.dt:hover { color: #4a4a4a; } .sub-nav ul.sub-nav-links span.icon-chat img, .sub-nav ul.sub-nav-links span.icon-phone img { height: 20px; width: 20px; vertical-align: top; } .sub-nav ul.sub-nav-links a span.dt { display: none; } @media only screen and (max-width: 376px) { .sub-nav ul.sub-nav-links span.icon-chat img, .sub-nav ul.sub-nav-links span.icon-phone img { display: none; } } @media only screen and (min-width: 769px) { .sub-nav ul.sub-nav-links a span.mb { display: none; } .sub-nav ul.sub-nav-links a span.dt { display: inherit; } } .main-nav:before { content: ""; background: #0052a4; position: absolute; width: 100%; height: 60px; left: 0; z-index: -1; } .main-nav ul li a { font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; text-decoration: none; font-size: 26px; color: #fff; } .main-nav ul li a:hover { color: #cccccc; } .main-nav ul li a.active { border-bottom: 5px solid #ffcb05; } .download-wrapper { padding-top: 15px; } .download-wrapper .download-header .policy { font-size: 15px; padding: 10px 0px 10px 0px; } @media only screen and (min-width: 769px) { .download-wrapper .download-header { padding-bottom: 0px; } .download-wrapper .download-header .policy { font-size: 20px; } } .download-wrapper .download-header .docHeader { color: #fff; padding: 10px 15px 10px 15px; border-radius: 5px; background-color: #0052a4; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; font-size: 20px; line-height: 25px; } @media only screen and (min-width: 1180px) { .download-wrapper .download-header .docHeader { font-size: 30px; line-height: 35px; } } .download-wrapper .download-sort { padding: 15px 25px 0px 25px; } .download-wrapper .download-sort .sortdoc { display: none; } .download-wrapper .download-sort .sortdate { display: none; } @media only screen and (min-width: 769px) { .download-wrapper .download-sort { padding: 15px 25px 15px 25px; } .download-wrapper .download-sort .sortdoc, .download-wrapper .download-sort .sortdate { display: inherit; font-size: 16px; color: #0052a4; } .download-wrapper .download-sort .sortdoc.select-arrows:after { right: 45px; top: 3px; } .download-wrapper .download-sort .sortdate .select-arrows:after { content: ""; left: 5px; top: 5px; } .download-wrapper .download-sort .select-arrows { position: relative; } .download-wrapper .download-sort .select-arrows:after { content: ""; position: absolute; z-index: 1; width: 10px; height: 20px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='161 763 11 21' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%230055A4' fill='none' d='M171.16 768.892l-4.32-4.318-4.24 4.242m8.56 10l-4.32 4.318-4.24-4.242'/%3E%3C/svg%3E"); pointer-events: none; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .download-wrapper .download-sort .sortdoc.select-arrows:after { left: 80px; } .download-wrapper .download-sort .sortdate .select-arrows:after { top: 0px; } } .download-wrapper .download-container { background: #fff; padding: 10px; align-items: flex-start; margin-bottom: 15px; font-family: Arial, sans-serif; border-radius: 5px; border: 1px solid #c3d8eb; -webkit-box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); } @media only screen and (min-width: 769px) { .download-wrapper .download-container { padding: 25px; } .download-wrapper .download-container .title, .download-wrapper .download-container .date, .download-wrapper .download-container a { font-size: 20px; line-height: 20px; } } .download-wrapper .download-container.unread { font-weight: bold; } .download-wrapper .download-container .icon.document { grid-area: doc; display: -ms-grid; justify-self: start; } .download-wrapper .download-container .title { grid-area: title; display: -ms-grid; } .download-wrapper .download-container .date { grid-area: date; display: -ms-grid; justify-self: start; } .download-wrapper .download-container .date-mb { grid-area: dateMb; display: -ms-grid; align-self: flex-end; } @media only screen and (min-width: 769px) { .download-wrapper .download-container .date-mb { display: none; } } .download-wrapper .download-container a { text-decoration: none; padding: 5px; } .download-wrapper .download-container a:hover { text-decoration: underline; } .download-wrapper .download-container a:focus { box-shadow: 0 0 3px #0052a4; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .download-wrapper .download-container a { padding: 0px; } .download-wrapper .download-container a .icon i { margin-left: 10px; } } #cookie-container { grid-area: cookie; display: grid; display: -ms-grid; grid-template-areas: "inner inner inner inner inner inner"; } @media only screen and (max-width: 1179px) { #cookie-container { padding-left: 5%; padding-right: 5%; } } @media screen and (max-width: 1179px) and (min-width: 1024px) { #cookie-container { padding-left: 5% !important; padding-right: 5% !important; padding: 1em 0 0 0; } } @media only screen and (min-width: 1180px) { #cookie-container { grid-template-areas: ". inner inner inner inner inner inner inner inner inner inner ."; } } #cookie-container #cookie-inner { grid-area: inner; display: grid; display: -ms-grid; grid-template-areas: "text text text text text text" "close close close close close close"; } @media screen and (max-width: 1179px) and (min-width: 768px) { #cookie-container #cookie-inner { grid-template-areas: "text text text text text close"; } } @media only screen and (min-width: 1180px) { #cookie-container #cookie-inner { grid-template-areas: "text text text text text text text text text text close close"; } } #cookie-container #cookie-inner #cookie-text { grid-area: text; } #cookie-container #cookie-inner #cookie-close.button { grid-area: close; } .card { display: -ms-grid; display: grid; grid-template-areas: "signin signin signin signin signin signin"; } @media screen and (max-width: 1179px) and (min-width: 768px) { .card { grid-template-areas: ". signin signin signin signin ."; } } @media only screen and (min-width: 1180px) { .card { grid-template-areas: ". signin signin signin signin signin signin signin signin signin signin ."; } } .card .card-container { display: -ms-inline-flexbox; display: grid; grid-area: signin; grid-template-areas: "card card card card card card"; } @media screen and (max-width: 1179px) and (min-width: 768px) { .card .card-container { grid-template-areas: ". card card card card ."; } } @media screen and (max-width: 1440px) and (min-width: 1180px) { .card .card-container { grid-template-areas: ". . . card card card card card card . . ."; } } @media screen and (min-width: 1441px) { .card .card-container { grid-template-areas: ". . . . card card card card . . . ."; } } /* HEADER AREA */ header.animal, header.equine { grid-area: banner; align-items: center; grid-column-gap: 0em !important; position: relative; } @media only screen and (max-width: 1179px) { header.animal, header.equine { padding-left: 5%; padding-right: 5%; } } @media only screen and (max-width: 1179px) { header.animal, header.equine { grid-template-areas: "logo logo subnav subnav subnav subnav" ". title title title title ."; } } @media only screen and (min-width: 1180px) { header.animal, header.equine { grid-template-areas: ". . . . subnav subnav subnav subnav subnav subnav subnav ." ". logo logo . . . . . . . . ." ". . . . . mainnav mainnav mainnav mainnav mainnav mainnav ." ". . . title title title title title title . . ."; } } @media only screen and (min-width: 1921px) and (max-width: 2559px) { header.animal, header.equine { grid-template-areas: ". . . . subnav subnav subnav subnav subnav . . ." ". . . logo logo . . . . . . ." ". . . . . mainnav mainnav mainnav mainnav . . ." ". . title title title title title title title title . ."; } } @media only screen and (max-width: 768px) { header.animal:before { background: url("../../assets/images/m-dog-terrier-banner.jpg") no-repeat; } } @media screen and (min-width: 768px) { header.animal:before { background: url("../../assets/images/dog-terrier-banner.jpg") no-repeat; } } @media only screen and (max-width: 768px) { header.equine:before { background: url("../../assets/images/m-equine-banner.jpg") no-repeat; } } @media screen and (min-width: 768px) { header.equine:before { background: url("../../assets/images/equine-banner.jpg") no-repeat; } } header.animal:before, header.equine:before { content: ''; border-radius: 0 0 250vh 250vh/0 0 55vh 55vh; height: 320px; width: 110%; margin-left: -5%; position: absolute; z-index: -1; } @media only screen and (max-width: 1179px) { header.animal:before, header.equine:before { height: 200px; } } @media only screen and (min-width: 1921px) and (max-width: 2559px) { header.animal:before, header.equine:before { margin-left: 15%; border-radius: 0 0 220vh 220vh/0 0 65vh 65vh; width: 70%; } } header.animal:before { background-position-y: 25px; } @media screen and (max-width: 320px) { header.animal:before { background-position-x: -70px; } } @media screen and (max-width: 375px) { header.animal:before { background-position-x: -30px; } } @media screen and (max-width: 475px) { header.animal:before { background-position-x: -5px; } } @media screen and (max-width: 767px) and (min-width: 476px) { header.animal:before { background-size: 100%, 100%; background-position-x: 40px; background-position-y: 0px; } } @media screen and (min-width: 768px) { header.animal:before { background-size: 100%, 100%; background-position-x: 35px; background-position-y: 0px; } } @media screen and (min-width: 1024px) { header.animal:before { background-position-y: -15px; } } @media screen and (min-width: 1920px) { header.animal:before { background-position-y: -60px; } } @media screen and (min-width: 2560px) { header.animal:before { background-position-y: -190px; } } header.equine:before { background-position-y: 25px; } @media screen and (max-width: 320px) { header.equine:before { background-position-x: -70px; } } @media screen and (max-width: 375px) { header.equine:before { background-position-x: -30px; } } @media screen and (max-width: 475px) { header.equine:before { background-position-x: -5px; } } @media screen and (max-width: 768px) and (min-width: 476px) { header.equine:before { background-size: 100%, 100%; background-position-x: 40px; background-position-y: -25px; } } @media screen and (min-width: 769px) { header.equine:before { background-size: 100%, 100%; background-position-x: 35px; background-position-y: -35px; } } @media screen and (min-width: 1024px) { header.equine:before { background-position-y: -60px; } } @media screen and (min-width: 1920px) { header.equine:before { background-position-y: -90px; } } @media screen and (min-width: 2560px) { header.equine:before { background-position-y: -235px; } } /* LOGO AREA */ .logo { grid-area: logo; grid-template-areas: "logo logo . . . ."; } @media only screen and (max-width: 1179px) { .logo { grid-area: logo; padding-top: 10px; padding-bottom: 10px; } .logo img { align-self: center; justify-self: start; } } /* HEADER AREA */ header.animal, header.equine { grid-area: banner; align-items: center; grid-column-gap: 0em !important; position: relative; } @media only screen and (max-width: 1179px) { header.animal, header.equine { padding-left: 5%; padding-right: 5%; } } @media only screen and (max-width: 1179px) { header.animal, header.equine { grid-template-areas: "logo logo subnav subnav subnav subnav" ". title title title title ."; } } @media only screen and (min-width: 1180px) { header.animal, header.equine { grid-template-areas: ". . . . subnav subnav subnav subnav subnav subnav subnav ." ". logo logo . . . . . . . . ." ". . . . . mainnav mainnav mainnav mainnav mainnav mainnav ." ". . . title title title title title title . . ."; } } @media only screen and (min-width: 1921px) and (max-width: 2559px) { header.animal, header.equine { grid-template-areas: ". . . . subnav subnav subnav subnav subnav . . ." ". . . logo logo . . . . . . ." ". . . . . mainnav mainnav mainnav mainnav . . ." ". . title title title title title title title title . ."; } } @media only screen and (max-width: 768px) { header.animal:before { background: url("../../assets/images/m-dog-terrier-banner.jpg") no-repeat; } } @media screen and (min-width: 768px) { header.animal:before { background: url("../../assets/images/dog-terrier-banner.jpg") no-repeat; } } @media only screen and (max-width: 768px) { header.equine:before { background: url("../../assets/images/m-equine-banner.jpg") no-repeat; } } @media screen and (min-width: 768px) { header.equine:before { background: url("../../assets/images/equine-banner.jpg") no-repeat; } } header.animal:before, header.equine:before { content: ''; border-radius: 0 0 250vh 250vh/0 0 55vh 55vh; height: 320px; width: 110%; margin-left: -5%; position: absolute; z-index: -1; } @media only screen and (max-width: 1179px) { header.animal:before, header.equine:before { height: 200px; } } @media only screen and (min-width: 1921px) and (max-width: 2559px) { header.animal:before, header.equine:before { margin-left: 15%; border-radius: 0 0 220vh 220vh/0 0 65vh 65vh; width: 70%; } } header.animal:before { background-position-y: 25px; } @media screen and (max-width: 320px) { header.animal:before { background-position-x: -70px; } } @media screen and (max-width: 375px) { header.animal:before { background-position-x: -30px; } } @media screen and (max-width: 475px) { header.animal:before { background-position-x: -5px; } } @media screen and (max-width: 767px) and (min-width: 476px) { header.animal:before { background-size: 100%, 100%; background-position-x: 40px; background-position-y: 0px; } } @media screen and (min-width: 768px) { header.animal:before { background-size: 100%, 100%; background-position-x: 35px; background-position-y: 0px; } } @media screen and (min-width: 1024px) { header.animal:before { background-position-y: -15px; } } @media screen and (min-width: 1920px) { header.animal:before { background-position-y: -60px; } } @media screen and (min-width: 2560px) { header.animal:before { background-position-y: -190px; } } header.equine:before { background-position-y: 25px; } @media screen and (max-width: 320px) { header.equine:before { background-position-x: -70px; } } @media screen and (max-width: 375px) { header.equine:before { background-position-x: -30px; } } @media screen and (max-width: 475px) { header.equine:before { background-position-x: -5px; } } @media screen and (max-width: 768px) and (min-width: 476px) { header.equine:before { background-size: 100%, 100%; background-position-x: 40px; background-position-y: -25px; } } @media screen and (min-width: 769px) { header.equine:before { background-size: 100%, 100%; background-position-x: 35px; background-position-y: -35px; } } @media screen and (min-width: 1024px) { header.equine:before { background-position-y: -60px; } } @media screen and (min-width: 1920px) { header.equine:before { background-position-y: -90px; } } @media screen and (min-width: 2560px) { header.equine:before { background-position-y: -235px; } } .sub-nav { grid-area: subnav; justify-self: end; } .sub-nav ul li:not(:last-child) { margin-right: 20px; } @media only screen and (min-width: 1180px) { .sub-nav ul { height: 50px; } .sub-nav ul li { display: inline-block; height: 100%; } .sub-nav ul li:not(:last-child) { margin-right: 40px; } .sub-nav ul li a { height: 100%; padding-top: 15px; } } .main-nav { grid-area: mainnav; align-content: center; } @media only screen and (max-width: 1179px) { .main-nav:before, .main-nav ul { display: none; } } @media only screen and (min-width: 1180px) { .main-nav ul { height: 60px; } .main-nav ul li { display: inline-flex; height: 100%; } .main-nav ul li:not(:last-child) { margin-right: 40px; } .main-nav ul li a { padding-top: 17px; } } .page-title { grid-area: title; height: 150px; display: inline-flex; justify-content: center; } .page-title h1 { align-self: center; text-align: center; } @media only screen and (min-width: 1180px) { .page-title { height: 220px; } } section.extra-help { padding-bottom: 70px; grid-template-areas: "help help help help help help"; } @media only screen and (max-width: 1179px) { section.extra-help { padding-left: 5%; padding-right: 5%; } } @media only screen and (min-width: 1180px) { section.extra-help { grid-template-areas: ". help help help help help help help help help help ."; } } @media only screen and (min-width: 1921px) and (max-width: 2559px) { section.extra-help { grid-template-areas: ". . help help help help help help help help . ."; } } section.extra-help .help { grid-area: help; text-align: center; font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; color: #0052a4; } section.extra-help .help .help-header { padding: 5px 0px 15px 0px; font-size: 25px; } @media only screen and (min-width: 1180px) { section.extra-help .help .help-header { font-size: 30px; } } /* MAIN AREA */ main { grid-area: main; grid-template-areas: "content content content content content content"; } @media only screen and (min-width: 769px) { main { grid-template-areas: ". content content content content ."; } } @media only screen and (min-width: 1180px) { main { grid-template-areas: ". content content content content content content content content content content ."; } } main.fixed { position: relative; overflow: hidden; visibility: hidden; z-index: -1; height: 40vh; } main.fixed + footer { border: none; } main.fixed + footer .footer-content { visibility: hidden; } footer { grid-area: footer; grid-template-areas: "content content content content content content"; border-top: 2px solid #c3d8eb; padding-top: 40px; background: #fff; } @media only screen and (max-width: 1179px) { footer { padding-left: 5%; padding-right: 5%; } } @media only screen and (min-width: 1180px) { footer { border-top: 4px solid #c3d8eb; grid-template-areas: ". content content content content content content content content content content ."; } } @media only screen and (min-width: 1921px) and (max-width: 2559px) { footer { grid-template-areas: ". . content content content content content content content content . ."; } } @media only screen and (max-width: 1179px) { footer { position: absolute; z-index: -2; } } footer .footer-content { grid-area: content; } footer .footer-content a { font-family: "American Typewriter ITC W01 Md", Arial, sans-serif; font-size: 20px; line-height: 25px; } footer .footer-content a:focus { box-shadow: 0 0 3px #0052a4; } @media only screen and (min-width: 769px) { footer .footer-content a { font-size: 22px; line-height: 27px; } } footer .footer-content .arrow { color: #0052a4; font-size: 20px; line-height: 25px; } @media only screen and (min-width: 769px) { footer .footer-content .arrow { font-size: 22px; line-height: 27px; } } footer .footer-content p.first { margin-top: 10px; } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body #cookie-container { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media screen and (-ms-high-contrast: active) and (max-width: 1179px) and (min-width: 1024px), screen and (-ms-high-contrast: none) and (max-width: 1179px) and (min-width: 1024px) { body #cookie-container { padding-bottom: 1em; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body #cookie-container { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body #cookie-container #cookie-inner { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body #cookie-container #cookie-inner { -ms-grid-row: 2; -ms-grid-column: 3; -ms-grid-column-span: 20; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body #cookie-container #cookie-inner #cookie-text { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body #cookie-container #cookie-inner #cookie-text { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 18; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body #cookie-container #cookie-inner #cookie-close { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body #cookie-container #cookie-inner #cookie-close { -ms-grid-row: 1; -ms-grid-column: 21; -ms-grid-column-span: 3; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { body header { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 23; } body header .sub-nav { -ms-grid-column-align: end; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body header .sub-nav { padding-top: 15px; -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body header .sub-nav { -ms-grid-row: 1; -ms-grid-column: 8; -ms-grid-column-span: 14; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body header .logo { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body header .logo { -ms-grid-row: 2; -ms-grid-column: 3; -ms-grid-column-span: 5; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { body header .main-nav { -ms-grid-row: 3; -ms-grid-column: 13; -ms-grid-column-span: 9; -ms-grid-column-align: end; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body header .page-title { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body header .page-title { -ms-grid-row: 4; -ms-grid-column: 6; -ms-grid-column-span: 13; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { body main { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card { -ms-grid-row: 1; -ms-grid-column: 9; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-container { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-container { -ms-grid-row: 1; -ms-grid-column: 9; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form { -ms-grid-row: 1; -ms-grid-column: 9; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .title { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; margin-bottom: 20px; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .title { -ms-grid-row: 1; -ms-grid-column: 9; -ms-grid-column-span: 8; margin-bottom: 40px; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .info { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 12; margin-bottom: 20px; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .info { -ms-grid-row: 2; -ms-grid-column: 9; -ms-grid-column-span: 8; margin-bottom: 40px; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .postcode { -ms-grid-row: 3; -ms-grid-column: 1; -ms-grid-column-span: 12; margin-bottom: 20px; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .postcode { -ms-grid-row: 3; -ms-grid-column: 9; -ms-grid-column-span: 8; margin-bottom: 40px; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .error { -ms-grid-row: 5; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .error { -ms-grid-row: 5; -ms-grid-column: 9; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .button { -ms-grid-row: 6; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .button { -ms-grid-row: 6; -ms-grid-column: 9; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .button button { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; margin-bottom: 20px; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .button button { -ms-grid-row: 1; -ms-grid-column: 6; -ms-grid-column-span: 12; margin-bottom: 40px; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .rule { -ms-grid-row: 7; -ms-grid-column: 1; -ms-grid-column-span: 12; margin-bottom: 20px; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .rule { -ms-grid-row: 7; -ms-grid-column: 9; -ms-grid-column-span: 8; margin-bottom: 40px; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.login .card .card-detail form .note { -ms-grid-row: 8; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.login .card .card-detail form .note { -ms-grid-row: 8; -ms-grid-column: 9; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper { -ms-grid-row: 1; -ms-grid-column: 4; -ms-grid-column-span: 16; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-header { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-header { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-header .policy { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-header .policy { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-header .docHeader { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 12; margin-bottom: 15px; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-header .docHeader { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-sort { display: none; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-sort { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-sort .sortdoc { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 15; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-sort .sortdate { -ms-grid-row: 1; -ms-grid-column: 16; -ms-grid-column-span: 18; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-container { -ms-grid-row: 3; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-container { -ms-grid-row: 3; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-container .icon.document { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 1; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-container .icon.document { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 1; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-container .title { -ms-grid-row: 1; -ms-grid-column: 2; -ms-grid-column-span: 6; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-container .title { -ms-grid-row: 1; -ms-grid-column: 2; -ms-grid-column-span: 13; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-container .date-mb { -ms-grid-row: 3; -ms-grid-column: 2; -ms-grid-column-span: 4; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-container .date-mb { display: none !important; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-container .date { -ms-grid-row: 4; -ms-grid-column: 2; -ms-grid-column-span: 2; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-container .date { -ms-grid-row: 1; -ms-grid-column: 16; -ms-grid-column-span: 2; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .download-container a { -ms-grid-row: 4; -ms-grid-column: 9; -ms-grid-column-span: 3; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .download-container a { -ms-grid-row: 1; -ms-grid-column: 21; -ms-grid-column-span: 3; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .button { -ms-grid-row: 6; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .button { -ms-grid-row: 6; -ms-grid-column: 9; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.policy-documents .download-wrapper .button button { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.policy-documents .download-wrapper .button button { -ms-grid-row: 1; -ms-grid-column: 6; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (max-width: 1179px), only screen and (-ms-high-contrast: none) and (max-width: 1179px) { body main section.extra-help .help { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 12; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body main section.extra-help .help { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { body footer { -ms-grid-row: 3; -ms-grid-column: 1; -ms-grid-column-span: 23; } } @media only screen and (-ms-high-contrast: active) and (max-width: 768px), only screen and (-ms-high-contrast: none) and (max-width: 768px) { body footer .footer-content { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 11; } } @media only screen and (-ms-high-contrast: active) and (min-width: 769px), only screen and (-ms-high-contrast: none) and (min-width: 769px) { body footer .footer-content { -ms-grid-row: 1; -ms-grid-column: 3; -ms-grid-column-span: 8; } } @media only screen and (-ms-high-contrast: active) and (min-width: 1180px), only screen and (-ms-high-contrast: none) and (min-width: 1180px) { body footer .footer-content { -ms-grid-row: 1; -ms-grid-column: 4; -ms-grid-column-span: 17; } } #main-content { grid-area: content; } #main-content section.policy-documents { grid-template-areas: "download download download download download download"; position: relative; background-image: linear-gradient(#fff, #f0f9fe); padding-bottom: 100px; } @media only screen and (max-width: 1179px) { #main-content section.policy-documents { padding-left: 5%; padding-right: 5%; } } @media only screen and (min-width: 1180px) { #main-content section.policy-documents { grid-template-areas: ". download download download download download download download download download download ."; padding-bottom: 160px; } } @media only screen and (min-width: 1921px) and (max-width: 2559px) { #main-content section.policy-documents { grid-template-areas: ". . download download download download download download download download . ."; } } @media only screen and (min-width: 769px) { #main-content section.policy-documents { padding-bottom: 180px; } } #main-content section.policy-documents:after { content: ""; height: 100px; width: 110%; border-radius: 400% 400% 0 0/620% 620% 0 0; background: white; position: absolute; left: -5%; bottom: 0; } #main-content section.policy-documents .download-wrapper { grid-area: download; } #main-content section.policy-documents .download-wrapper .download-header { grid-column-gap: 0px; grid-template-areas: "policy policy policy policy policy policy" "docHeader docHeader docHeader docHeader docHeader docHeader"; } @media only screen and (min-width: 1180px) { #main-content section.policy-documents .download-wrapper .download-header { grid-template-areas: "policy policy policy policy policy policy policy policy policy policy policy policy" "docHeader docHeader docHeader docHeader docHeader docHeader docHeader docHeader docHeader docHeader docHeader docHeader"; } } #main-content section.policy-documents .download-wrapper .download-header .policy { grid-area: policy; display: inline-flex; justify-content: center; } #main-content section.policy-documents .download-wrapper .download-header .docHeader { grid-area: docHeader; display: inline-flex; } @media only screen and (min-width: 769px) { #main-content section.policy-documents .download-wrapper .download-sort { grid-template-areas: "sortdoc sortdoc . . . . . sortdate sortdate sortdate . ."; grid-template-columns: 45px 90px repeat(10, 4fr); align-items: center; grid-column-gap: 0px; } #main-content section.policy-documents .download-wrapper .download-sort .sortdoc { grid-area: sortdoc; } #main-content section.policy-documents .download-wrapper .download-sort .sortdate { grid-area: sortdate; display: -ms-grid; display: grid; grid-template-areas: "text arrows"; justify-content: center; } #main-content section.policy-documents .download-wrapper .download-sort .sortdate .sorttext { grid-area: text; } } #main-content section.policy-documents .download-wrapper .download-container { grid-template-areas: "doc title title title title title" ". dateMb dateMb . . ." ". date date . download download"; grid-column-gap: 0px; grid-template-columns: 45px repeat(5, 4fr); grid-template-rows: auto 30px auto; } @media only screen and (min-width: 769px) { #main-content section.policy-documents .download-wrapper .download-container { grid-template-areas: "doc title title title title title title . date . download download"; grid-template-columns: 45px 90px repeat(10, 4fr); align-items: center; grid-template-rows: 10px; } } #main-content section.policy-documents .download-wrapper .download-container .icon.document { grid-area: doc; display: -ms-grid; justify-self: start; } #main-content section.policy-documents .download-wrapper .download-container .title { grid-area: title; display: -ms-grid; } #main-content section.policy-documents .download-wrapper .download-container .date { grid-area: date; display: -ms-grid; justify-self: start; } #main-content section.policy-documents .download-wrapper .download-container .date-mb { grid-area: dateMb; display: -ms-grid; align-self: flex-end !important; } @media only screen and (min-width: 769px) { #main-content section.policy-documents .download-wrapper .download-container .date { justify-self: center; } } #main-content section.policy-documents .download-wrapper .download-container a { grid-area: download; display: -ms-grid; justify-self: end; } #main-content section.policy-documents .download-wrapper .button { grid-template-areas: "odocs odocs odocs odocs odocs odocs"; } @media only screen and (min-width: 769px) { #main-content section.policy-documents .download-wrapper .button { grid-template-areas: ". odocs odocs odocs odocs ."; } } @media only screen and (min-width: 1180px) { #main-content section.policy-documents .download-wrapper .button { grid-template-areas: ". . . . odocs odocs odocs odocs . . . ."; } } #main-content section.policy-documents .download-wrapper .button button.other-docs { grid-area: odocs; } #main-content { grid-area: content; } #main-content section.login { position: relative; background-image: linear-gradient(#fff, #f0f9fe); padding: 20px 0px 40px 0px; } @media only screen and (max-width: 1179px) { #main-content section.login { padding-left: 5%; padding-right: 5%; } } @media only screen and (min-width: 1180px) { #main-content section.login { padding: 60px 0px 90px 0px; } } #main-content section.login .card .card-container .card-detail { display: -ms-grid; display: grid; grid-area: card; grid-template-areas: "form form form form form form"; } @media only screen and (min-width: 1180px) { #main-content section.login .card .card-container .card-detail { grid-template-areas: "form form form form form form form form form form form form"; } } #main-content section.login .card .card-container .card-detail form { display: -ms-grid; display: grid; grid-area: form; grid-row-gap: 20px; grid-template-areas: "title title title title title title" "info info info info info info" "postcode postcode postcode postcode postcode postcode" "button button button button button button" "rule rule rule rule rule rule" "note note note note note note"; } @media only screen and (min-width: 1180px) { #main-content section.login .card .card-container .card-detail form { grid-row-gap: 40px; } } #main-content section.login .card .card-container .card-detail form .title { grid-area: title; } #main-content section.login .card .card-container .card-detail form .info { grid-area: info; } #main-content section.login .card .card-container .card-detail form .postcode { grid-area: postcode; } #main-content section.login .card .card-container .card-detail form .tooltip { grid-area: tooltip; } #main-content section.login .card .card-container .card-detail form .button { grid-area: button; display: inline-grid; grid-template-areas: "login login login login login login"; } @media only screen and (min-width: 769px) { #main-content section.login .card .card-container .card-detail form .button { grid-template-areas: ". login login login login ."; } } @media only screen and (min-width: 1180px) { #main-content section.login .card .card-container .card-detail form .button { grid-template-areas: ". . . login login login login login login . . ."; } } #main-content section.login .card .card-container .card-detail form .button button { grid-area: login; } #main-content section.login .card .card-container .card-detail form .note { grid-area: note; }