.tptpl .header{ position:fixed; z-index:3; top:0; width:100%; height:60px; background:0 0; transition:background .25s ease-in-out; } .tptpl .header .mobile-main-nav a{ font-size:0; line-height:0; display:block; width:22px; height:22px; background:0 0; position:absolute; top:22px; left:19px; } .tptpl .header .mobile-main-nav a span{ display:block; width:100%; border-top:1px solid #fff; position:absolute; top:0; left:0; } .tptpl .header .mobile-main-nav a span:after, .tptpl .header .mobile-main-nav a span:before{ content:""; display:block; width:100%; border-top:1px solid #fff; position:absolute; left:0; } .tptpl .header .mobile-main-nav a span:before{ top:7.5px; } .tptpl .header .mobile-main-nav a span:after{ top:16px; } .tptpl .always-off-top .header, .tptpl .off-top .header{ background:#fff; } .tptpl .always-off-top .header .mobile-main-nav a span, .tptpl .always-off-top .header .mobile-main-nav a span:after, .tptpl .always-off-top .header .mobile-main-nav a span:before, .tptpl .desktop-header-country-menu-button .menu a:hover span:after, .tptpl .off-top .header .mobile-main-nav a span, .tptpl .off-top .header .mobile-main-nav a span:after, .tptpl .off-top .header .mobile-main-nav a span:before{ border-color:#000; } .tptpl .header .logo, .tptpl .header .logo-off-top{ font-size:0; line-height:0; position:absolute; width:200px; transition:all .25s ease-out; } .tptpl .header .logo{ display:block; top:61px; left:36px; background:0 0 no-repeat; background-size:165px; height:102px; } .tptpl .always-off-top .header .logo, .tptpl .off-top .header .logo{ transform:translate(0,-20px); } .tptpl .off-top .header .logo{ display:none; } .tptpl .header .logo-off-top{ display:none; top:21px; left:62px; background:0 -180px no-repeat; background-size:200px; height:22px; transform:translate(0,10px); } .tptpl .off-top .header .logo-off-top{ display:block; transform:translate(0,0); } .tptpl #skip-container, .tptpl .always-off-top .header .logo, .tptpl .desktop-search, .tptpl .mega-dropdown, .tptpl nav/**/#main li a.kbc-more-link{ display:none; } .tptpl .always-off-top .header .logo-off-top{ transition:all 0s ease-out; display:block; transform:translate(0,0); } @media screen and (max-width:374px){ .tptpl .header .logo-off-top{ background-size:170px; width:170px; background-position:0 -151px ; } } .tptpl .desktop-header-country-menu-button a{ background:0 0; } .tptpl .mobile-header-country-menu-button a{ color:#fff; position:absolute; right:0; background:0 0; width:70px; top:17px; } .tptpl .desktop-header-country-menu-button a{ position:relative; color:#fff; right:0; top:-4px; width:inherit; padding:0 !important; display:table !important; margin:-3px 0 -4px !important; } .tptpl .desktop-header-country-menu-button .menu-label{ display:none; text-transform:uppercase; font-weight:500; font-size:13px; float:left; padding:7px 10px 4px 0; max-width:135px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; } .tptpl .always-off-top .desktop-header-country-menu-button a, .tptpl .always-off-top .mobile-header-country-menu-button a, .tptpl .off-top .desktop-header-country-menu-button a, .tptpl .off-top .mobile-header-country-menu-button a{ color:#000; } .tptpl .desktop-header-country-menu-button a span.country, .tptpl .mobile-header-country-menu-button a span.country{ border:1px solid; padding:3px 5px 4px; font-size:13px; margin:0 9px 0 0; float:left; font-weight:500; } .tptpl .desktop-header-country-menu-button a span.country{ padding:6px 4px 7px; } .tptpl .mobile-header-country-menu-button span.select-symbol{ width:10px; display:inline-block; margin-top:3px; } .tptpl .desktop-header-country-menu-button span.select-symbol{ width:15px; float:left; margin-top:3px; } .tptpl .desktop-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .mobile-header-country-menu-button span.select-symbol svg.svg-select{} .tptpl .always-off-top .desktop-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .always-off-top .mobile-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .off-top .desktop-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .off-top .mobile-header-country-menu-button span.select-symbol svg.svg-select{} .tptpl .desktop-header-country-menu-button .menu{ padding:30px 0 15px; font-size:13px; } .tptpl .desktop-header-country-menu-button .menu a{ background:0 0; padding:7px 20px !important; color:#000; } .tptpl .desktop-header-country-menu-button .menu a span{ position:relative; } .tptpl .desktop-header-country-menu-button .menu a span:after{ content:""; border-bottom:1px solid transparent; position:absolute; width:100%; bottom:-2px; left:0; transition:all .25s ease-in-out; } .tptpl .search-and-country-container .is-dropdown-submenu{ border:0; } @media screen and (min-width:1120px){ .tptpl #skip-container{ display:block; position:absolute; top:0; transition:transform .25s ease-in-out; width:100%; color:#000; background:#f9f9f9; font-size:0; line-height:0; z-index:1; min-height:40px; transform:translateY(-40px) ; } .tptpl .keyboard-control #skip-container{ transform:translateY(0) ; } .tptpl #skip-container a, .tptpl .header .mega-dropdown .mega-dropdown-heading{ display:inline-block; font-size:13px; font-weight:500; text-transform:uppercase; letter-spacing:.025rem ; } .tptpl #skip-container a{ text-decoration:none; color:#000; background:#f9f9f9; margin:10px; padding:10px ; } .tptpl .header{ height:95px; transition:background .25s ease-in-out,transform .25s ease-in-out ; } .tptpl .keyboard-control .header{ position:absolute; transform:translateY(40px) ; } .tptpl .header .logo{ top:41px; left:41px; background-size:200px; width:200px; height:125px ; } .tptpl .header .logo-off-top{ top:37px; left:40px ; } .tptpl .header .mega-dropdown{ display:block; font-size:0; text-align:center; margin:0 auto; width:100% ; } .tptpl .header .mega-dropdown .mega-dropdown-heading{ padding:37px 15px 39px ; } .tptpl .header .mega-dropdown .mega-dropdown-heading a{ color:#fff ; } .tptpl .keyboard-control .header .mega-dropdown .mega-dropdown-heading.has-sub-menu a{ padding-right:17px ; } .tptpl .always-off-top .header .mega-dropdown .mega-dropdown-heading a, .tptpl .header-over .desktop-header-country-menu-button a, .tptpl .header-over .header .mega-dropdown .mega-dropdown-heading a, .tptpl .header-over .mobile-header-country-menu-button a, .tptpl .keyboard-control .desktop-header-country-menu-button a, .tptpl .keyboard-control .header .mega-dropdown .mega-dropdown-heading a, .tptpl .keyboard-control .mobile-header-country-menu-button a, .tptpl .off-top .header .mega-dropdown .mega-dropdown-heading a{ color:#000 ; } .tptpl .header .mega-dropdown .mega-dropdown-heading a span{ position:relative ; } .tptpl .header .mega-dropdown .mega-dropdown-heading a span::after{ border-top:1px solid transparent ; } .tptpl .header .mega-dropdown .mega-dropdown-heading a span::after, .tptpl .header .mega-dropdown .mega-dropdown-heading.active>a span:after{ content:""; display:block; position:absolute; bottom:-8px; left:0; right:0; transition:all .25s ease-in-out ; } .tptpl .keyboard-control .header .mega-dropdown .mega-dropdown-heading a:focus span::after, .tptpl .keyboard-control .header .mega-dropdown .mega-dropdown-heading.active>a:focus span:after{ display:none ; } .tptpl .header .mega-dropdown .mega-dropdown-heading a.selected span::after, .tptpl .header .mega-dropdown .mega-dropdown-heading a:hover span::after, .tptpl .header .mega-dropdown .mega-dropdown-heading.active>a span:after{ border-top:1px solid ; } .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel{ position:absolute; top:95px; left:0; background:#fff; width:100%; overflow:hidden; height:0; z-index:1; display:none ; } .tptpl .header .mega-dropdown .mega-dropdown-heading.active .mega-dropdown-panel, .tptpl .header .mega-dropdown .mega-dropdown-heading.kbc-active .mega-dropdown-panel{ height:auto; display:block ; } .tptpl .header .mega-dropdown-panel ul{ list-style:none; margin:0 ; } .tptpl .header .mega-dropdown-panel .container{ width:100%; max-width:1100px; margin:0 auto; display:table; text-align:left; text-transform:none; font-weight:400; padding:15px 40px 46px ; } .tptpl .header .mega-dropdown-panel .container .columns{ float:left ; } .tptpl .header .mega-dropdown-panel .container .large-4.special{ width:39.999996% ; } .tptpl .header .mega-dropdown-panel .container .large-2.special{ width:20.000004% ; } .tptpl .header .mega-dropdown-panel .container .list-heading{ font-weight:500; padding:7px 14px 18px 0; display:inline-block; color:#000 ; } .tptpl .header .mega-dropdown-panel .container a.list-heading span:after{ bottom:-4px ; } .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel .container li, .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel .container li a{ padding:7px 14px 7px 0; color:#000; font-weight:400 ; } .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel .container li a span{ border-bottom:1px solid transparent; transition:border .25s ease-in-out; padding:0 0 1px ; } .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel .container li a.selected span, .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel .container li a:hover span, .tptpl .header-over .header .mobile-main-nav a span, .tptpl .header-over .mobile-main-nav a span:after, .tptpl .header-over .mobile-main-nav a span:before, .tptpl .keyboard-control .header .mobile-main-nav a span, .tptpl .keyboard-control .mobile-main-nav a span:after, .tptpl .keyboard-control .mobile-main-nav a span:before{ border-color:#000 ; } .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel .container li a span:after, .tptpl .header .mega-dropdown .mega-dropdown-heading .mega-dropdown-panel .container li a.list-heading span:after{ display:none !important; } .tptpl .desktop-dimmer{ position:fixed; background:rgba(0,0,0,.5); width:100%; height:0; top:100%; bottom:-1px; opacity:0; z-index:1 ; } .tptpl .desktop-dim .desktop-dimmer{ height:100%; top:95px; opacity:1; transition:opacity .25s ease-out ; } .tptpl .desktop-dim.top .desktop-dimmer{ top:0 ; } .tptpl .keyboard-control .desktop-dimmer{ display:none ; } .tptpl .header-over .header, .tptpl .keyboard-control .header{ background:#fff ; } .tptpl .mobile-main-nav:before{ content:""; border-top:1px solid transparent; display:block; height:1px; width:1px ; } .tptpl .header-over .header .logo, .tptpl .keyboard-control .header .logo{ transform:translate(0,-20px); display:none ; } .tptpl .header-over .header .logo-off-top, .tptpl .keyboard-control .header .logo-off-top{ display:block; transform:translate(0,0) ; } .tptpl .always-off-top .desktop-search svg.svg-mag-glass, .tptpl .header-over .desktop-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .header-over .desktop-search svg.svg-mag-glass, .tptpl .header-over .mobile-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .keyboard-control .desktop-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .keyboard-control .desktop-search svg.svg-mag-glass, .tptpl .keyboard-control .mobile-header-country-menu-button span.select-symbol svg.svg-select, .tptpl .off-top .desktop-search svg.svg-mag-glass{} .tptpl .search-and-country-container{ position:absolute; top:37px; right:30px ; } .tptpl .desktop-search{ display:block; position:relative; float:left; width:80px ; } .tptpl .desktop-search svg.svg-mag-glass{ position:absolute; width:16px; top:2px; left:-26px ; } .tptpl .desktop-search label{ font-size:0; line-height:0 ; } .tptpl .desktop-search input{ color:#fff; background:0 0; border:0; border-bottom:1px solid #fff; border-radius:0; box-shadow:none; font-size:13px; line-height:1; padding:0; margin:0; height:16px ; } .tptpl .desktop-search input[type=submit]{ position:absolute; font-size:0; width:27px; height:27px; left:-32px; top:-4px; border:0 !important; } .tptpl .always-off-top .desktop-search input, .tptpl .always-off-top .desktop-search input:focus, .tptpl .header-over .desktop-search input, .tptpl .header-over .desktop-search input:focus, .tptpl .keyboard-control .desktop-search input, .tptpl .keyboard-control .desktop-search input:focus, .tptpl .off-top .desktop-search input, .tptpl .off-top .desktop-search input:focus{ color:#000; border-color:#000 ; } .tptpl nav/**/#main a.kbc-more-link{ display:none; font-size:0 !important; line-height:0 !important; padding:0 !important; transform:translate(-14px,-8px) rotate(-45deg); width:6px; height:6px; background-size:contain; border-left:1px solid #000; border-bottom:1px solid #000 ; } .tptpl .keyboard-control a.kbc-more-link{ display:inline-block !important; } } @media screen and (min-width:1280px){ .tptpl .desktop-header-country-menu-button .menu-label{ display:block ; } } .tptpl footer{ color:#fff; background:#262323; text-align:center; padding:30px 30px 1px; } .tptpl footer ul{ margin:0 0 25px; list-style:none; font-size:13px; line-height:1; text-transform:uppercase; font-weight:500; letter-spacing:.02rem; } .tptpl footer li{ padding:3px 0 4px; } .tptpl footer a{ position:relative; color:#fff; border-bottom:1px solid transparent; transition:.25s ease-in-out; } .tptpl footer a:active, .tptpl footer a:focus, .tptpl footer a:hover{ color:#fff; border-color:#fff; } .tptpl footer ul.soc-med{ text-transform:none; font-weight:400; } .tptpl footer ul.soc-med li{ padding:8px 0 9px 20px; } .tptpl footer ul.soc-med a::before{ content:""; position:absolute; width:22px; height:15px; background-repeat:no-repeat; background-position:center; background-size:contain; left:-25px; top:0; } .tptpl footer ul.soc-med a.linkedin:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/fe37754aa8b46e4acd9b33af05010240169586b8e7175248767166f030fdd1a2"); } .tptpl footer ul.soc-med a.twitter:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/9ea3a2dc5363359a528a212dbfb22d7e2534eeadd4727c4595f553fd85af8ae4"); background-size:16px; } .tptpl footer ul.soc-med a.facebook:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/b322146f2346aba96ac1521247e31ce0b15f32f9ca43ed6fd5bcbaf46ee183c2"); } .tptpl footer ul.soc-med a.instagram:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/712f25b19b316031d80c491a97660b0bb55cb6aeb3c4fc8676e2e5d5c5abba49"); } .tptpl footer ul.soc-med a.pinterest:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/11a473186a4eb990ec01c9ba5ebf5e9be61375f2c090f5b0d85ce58ea4311298"); } .tptpl footer ul.soc-med a.youtube:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/2de42c10f63c5cf5585d776b255f733294b91209ff4823d9f618b06e03e29756"); background-size:18px; left:-27px; } .tptpl footer ul.soc-med a.glassdoor:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/3bb1ec3d88248d4c49afc820a25df2198567b61f6e97cee3b22de27ce1cbdb73"); background-size:22px; } @media screen and (min-width:1024px){ .tptpl footer{ float:left; width:100%; background:#000; padding:30px 30px 0; margin:0 0 60px ; } .tptpl footer li{ display:inline-block; padding-left:10px; padding-right:10px ; } .tptpl footer ul.soc-med li{ padding-right:30px ; } } @media screen and (min-width:1120px){ .tptpl footer{ margin:0 0 95px ; } .tptpl .keyboard-control footer{ margin:0 ; } .tptpl .footer-container{ margin:0 auto; max-width:1360px ; } } @media screen and (min-width:1440px){ .tptpl footer{ padding:38px 40px 8px ; } .tptpl footer li{ display:inline-block; padding-left:0; padding-right:15px ; } .tptpl footer ul.soc-med li{ padding:3px 0 9px 35px ; } } @keyframes shake-7{ 0%,10%,20%,30%,40%,50%,60%,70%,80%,90%{ transform:translateX(7%) ; } 15%,25%,35%,45%,5%,55%,65%,75%,85%,95%{ transform:translateX(-7%) ; } } @keyframes spin-cw-1turn{ 0%{ transform:rotate(0) ; } to{ transform:rotate(1turn) ; } } @keyframes wiggle-7deg{ 40%,50%,60%{ transform:rotate(7deg) ; } 35%,45%,55%,65%{ transform:rotate(-7deg) ; } 0%,30%,70%,to{ transform:rotate(0) ; } } .tptpl html{ font-family:sans-serif; line-height:1.15; box-sizing:border-box; font-size:100%; } .tptpl a, .tptpl body{ color:#000; } .tptpl body{ padding:0; background:#fff; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight:400; line-height:1.5; } .tptpl article, .tptpl aside, .tptpl details, .tptpl figcaption, .tptpl figure, .tptpl footer, .tptpl header, .tptpl main, .tptpl menu, .tptpl nav, .tptpl section{ display:block; } .tptpl body, .tptpl figure{ margin:0; } .tptpl hr{ box-sizing:content-box; overflow:visible; clear:both; max-width:75rem; height:0; margin:30px auto; border-top:0; border-right:0; border-bottom:1px solid #adadad; border-left:0; } .tptpl code, .tptpl kbd, .tptpl pre, .tptpl samp{ font-size:1em; } .tptpl pre, .tptpl samp{ font-family:monospace,monospace; } .tptpl a{ background-color:transparent; line-height:inherit; text-decoration:none; cursor:pointer; } .tptpl :focus{ outline-style:solid; outline-width:2px; outline-color:#000; transition:none !important; } .tptpl .top-banner :focus, .tptpl footer :focus{ outline-color:#fff; } .tptpl abbr[title]{ border-bottom:none; text-decoration:underline dotted; } .tptpl b, .tptpl small, .tptpl strong{ line-height:inherit; } .tptpl b, .tptpl strong{ font-weight:700; } .tptpl dfn{ font-style:italic; } .tptpl mark{ background-color:#ff0; color:#000; } .tptpl small{ font-size:80%; } .tptpl sub, .tptpl sup{ font-size:75%; line-height:0; position:relative; vertical-align:baseline; } .tptpl sub{ bottom:-.25em; } .tptpl sup{ top:-.5em; } .tptpl audio, .tptpl canvas, .tptpl video{ display:inline-block; } .tptpl audio:not([controls]){ display:none; height:0; } .tptpl img{ border-style:none; display:inline-block; vertical-align:middle; max-width:100%; height:auto; } .tptpl svg:not(:root){ overflow:hidden; } .tptpl button, .tptpl input, .tptpl optgroup{ font-family:sans-serif; } .tptpl input, .tptpl optgroup{ font-size:100%; } .tptpl button, .tptpl select{ font-size:100%; margin:0; } .tptpl input, .tptpl optgroup, .tptpl textarea{ line-height:1.15; margin:0; } .tptpl button, .tptpl input{ overflow:visible; } .tptpl button, .tptpl select{ text-transform:none; } .tptpl [type=reset], .tptpl html [type=button]{} .tptpl [type=checkbox], .tptpl [type=radio]{ box-sizing:border-box; padding:0; } .tptpl [type=search]{ outline-offset:2px; } .tptpl fieldset{ margin:0; padding:0; border:0; } .tptpl legend{ box-sizing:border-box; display:table; padding:0; color:inherit; white-space:normal; max-width:100%; margin-bottom:.5rem; } .tptpl progress{ display:inline-block; vertical-align:baseline; } .tptpl textarea{ min-height:50px; } .tptpl summary{ display:list-item; } .tptpl [hidden], .tptpl template{ display:none; } .tptpl .foundation-mq{ font-family:"small=0em&medium=40em&large=64em&xlarge=75em&xxlarge=90em"; } .tptpl *, .tptpl ::after, .tptpl ::before{ box-sizing:inherit; } .tptpl button, .tptpl select{ appearance:none; border-radius:3px; } .tptpl select{ box-sizing:border-box; width:100%; height:2.4375rem; margin:0 0 1rem; border:1px solid #cacaca; background-color:#fff; font-family:inherit; font-size:1rem; line-height:normal; color:#000; background-image:url("data:image/svg+xml;utf8,\3c svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'\3e \3c polygon points='0,0 32,0 16,24' style='fill: rgb%28138, 138, 138%29'\3e \3c /polygon\3e \3c /svg\3e "); background-origin:content-box; background-position:right -1rem center; background-repeat:no-repeat; background-size:9px 6px; padding:.5rem 1.5rem .5rem .5rem; transition:box-shadow .5s,border-color .25s ease-in-out; } .tptpl .map_canvas embed, .tptpl .map_canvas img, .tptpl .map_canvas object, .tptpl .mqa-display embed, .tptpl .mqa-display img, .tptpl .mqa-display object{ max-width:none !important; } .tptpl button{ padding:0; border:0; background:0 0; line-height:1; } .tptpl pre, .tptpl textarea{ overflow:auto; } .tptpl .is-visible{ display:block !important; } .tptpl .is-hidden{ display:none !important; } .tptpl blockquote, .tptpl dd, .tptpl div, .tptpl dl, .tptpl dt, .tptpl form, .tptpl li, .tptpl ol, .tptpl p, .tptpl pre, .tptpl td, .tptpl th, .tptpl ul{ margin:0; padding:0; } .tptpl p{ margin-bottom:1rem; font-size:inherit; line-height:1.6; } .tptpl em, .tptpl i{ font-style:italic; line-height:inherit; } .tptpl a:focus, .tptpl a:hover{ color:#000; } .tptpl a img{ border:0; } .tptpl dl, .tptpl ol, .tptpl ul{ margin-bottom:1rem; list-style-position:outside; line-height:1.6; } .tptpl li{ font-size:inherit; } .tptpl ul{ list-style-type:disc; } .tptpl ol, .tptpl ul{ margin-left:1.25rem; } .tptpl ol ol, .tptpl ol ul, .tptpl ul ol, .tptpl ul ul{ margin-left:1.25rem; margin-bottom:0; } .tptpl dl dt{ margin-bottom:.3rem; font-weight:700; } .tptpl blockquote{ margin:0 0 1rem; padding:.5625rem 1.25rem 0 1.1875rem; border-left:1px solid #cacaca; } .tptpl .subheader, .tptpl blockquote, .tptpl blockquote p{ line-height:1.6; color:#8a8a8a; } .tptpl cite{ display:block; font-size:.8125rem; color:#8a8a8a; } .tptpl cite:before{ content:"— "; } .tptpl abbr{ border-bottom:1px dotted #000; color:#000; cursor:help; } .tptpl code, .tptpl kbd{ background-color:#e6e6e6; font-family:Consolas,"Liberation Mono",Courier,monospace; color:#000; } .tptpl code{ padding:.125rem .3125rem .0625rem; border:1px solid #cacaca; font-weight:400; } .tptpl kbd{ margin:0; padding:.125rem .25rem 0; border-radius:3px; } .tptpl .subheader{ margin-top:.2rem; margin-bottom:.5rem; font-weight:400; line-height:1.4; } .tptpl .lead{ font-size:125%; line-height:1.6; } .tptpl .stat{ font-size:2.5rem; line-height:1; } .tptpl p+.stat{ margin-top:-1rem; } .tptpl .no-bullet{ margin-left:0; list-style:none; } .tptpl .text-left{ text-align:left; } .tptpl .text-right{ text-align:right; } .tptpl .menu.icon-top>li>a, .tptpl .text-center{ text-align:center; } .tptpl .text-justify{ text-align:justify; } @media print,screen and (min-width:40em){ .tptpl .medium-text-left{ text-align:left ; } .tptpl .medium-text-right{ text-align:right ; } .tptpl .medium-text-center{ text-align:center ; } .tptpl .medium-text-justify{ text-align:justify ; } } @media print,screen and (min-width:64em){ .tptpl .large-text-left{ text-align:left ; } .tptpl .large-text-right{ text-align:right ; } .tptpl .large-text-center{ text-align:center ; } .tptpl .large-text-justify{ text-align:justify ; } } .tptpl .show-for-print{ display:none !important; } @media print{ .tptpl *{ background:0 0 !important; box-shadow:none !important; color:#000 !important; text-shadow:none !important; } .tptpl .show-for-print{ display:block !important; } .tptpl .hide-for-print{ display:none !important; } .tptpl table.show-for-print{ display:table !important; } .tptpl thead.show-for-print{ display:table-header-group !important; } .tptpl tbody.show-for-print{ display:table-row-group !important; } .tptpl tr.show-for-print{ display:table-row !important; } .tptpl td.show-for-print, .tptpl th.show-for-print{ display:table-cell !important; } .tptpl a, .tptpl a:visited{ text-decoration:underline ; } .tptpl a[href]:after{ content:" (" attr(href) ")" ; } .tptpl .ir a:after, .tptpl a[href^="#"]:after, .tptpl a[href^="javascript:"]:after{ content:"" ; } .tptpl abbr[title]:after{ content:" (" attr(title) ")" ; } .tptpl blockquote, .tptpl pre{ border:1px solid #8a8a8a ; } .tptpl thead{ display:table-header-group ; } .tptpl blockquote, .tptpl img, .tptpl pre, .tptpl tr{ page-break-inside:avoid ; } .tptpl img{ max-width:100% !important; } @page{ margin:.5cm ; } .tptpl h2, .tptpl h3, .tptpl p{ orphans:3; widows:3 ; } .tptpl h2, .tptpl h3{ page-break-after:avoid ; } } .tptpl [type=color], .tptpl [type=date], .tptpl [type=datetime-local], .tptpl [type=datetime], .tptpl [type=email], .tptpl [type=month], .tptpl [type=number], .tptpl [type=password], .tptpl [type=search], .tptpl [type=tel], .tptpl [type=text], .tptpl [type=time], .tptpl [type=url], .tptpl [type=week], .tptpl textarea{ display:block; border:0; border-bottom:1px solid #000; border-radius:0; width:100%; height:45px; margin:0 0 1rem; padding:0; background-color:#fff; box-shadow:none; font-family:inherit; font-size:13px; font-weight:400; color:#000; transition:none; appearance:none; } .tptpl textarea{ max-width:100%; } .tptpl textarea[rows]{ height:auto; } .tptpl input::placeholder, .tptpl textarea::placeholder{ color:#cacaca; } .tptpl input:disabled, .tptpl input[readonly], .tptpl textarea:disabled, .tptpl textarea[readonly]{ cursor:not-allowed; } .tptpl [type=button], .tptpl [type=submit]{ appearance:none; border-radius:3px; } .tptpl input[type=search]{ box-sizing:border-box; } .tptpl [type=checkbox], .tptpl [type=file], .tptpl [type=radio]{ margin:0 0 1rem; } .tptpl [type=checkbox]+label, .tptpl [type=radio]+label{ display:inline-block; vertical-align:baseline; margin-left:.5rem; margin-right:1rem; margin-bottom:0; } .tptpl [type=checkbox]+label[for], .tptpl [type=radio]+label[for]{ cursor:pointer; } .tptpl label>[type=checkbox], .tptpl label>[type=radio]{ margin-right:.5rem; } .tptpl [type=file]{ width:100%; } .tptpl label{ display:block; margin:0; font-size:.875rem; font-weight:400; line-height:1.8; color:#000; } .tptpl label.middle{ margin:0 0 1rem; padding:.5625rem 0; } .tptpl .help-text{ margin-top:-.5rem; font-size:.8125rem; font-style:italic; color:#000; } .tptpl .input-group{ display:table; width:100%; margin-bottom:1rem; } .tptpl .input-group>:first-child{ border-radius:3px 0 0 3px; } .tptpl .input-group>:last-child>*{ border-radius:0 3px 3px 0; } .tptpl .input-group-button, .tptpl .input-group-button a, .tptpl .input-group-button button, .tptpl .input-group-button input, .tptpl .input-group-button label, .tptpl .input-group-field, .tptpl .input-group-label{ margin:0; white-space:nowrap; display:table-cell; vertical-align:middle; } .tptpl .input-group-label{ padding:0 1rem; border:1px solid #cacaca; background:#e6e6e6; color:#000; text-align:center; width:1%; height:100%; } .tptpl .input-group-label:first-child{ border-right:0; } .tptpl .input-group-label:last-child{ border-left:0; } .tptpl .input-group-field{ border-radius:0; height:2.5rem; } .tptpl .input-group-button{ padding-top:0; padding-bottom:0; text-align:center; width:1%; height:100%; } .tptpl .input-group-button a, .tptpl .input-group-button button, .tptpl .input-group-button input, .tptpl .input-group-button label{ height:2.5rem; padding-top:0; padding-bottom:0; font-size:1rem; } .tptpl .input-group .input-group-button{ display:table-cell; } .tptpl .fieldset{ margin:1.125rem 0; padding:1.25rem; border:1px solid #cacaca; } .tptpl .fieldset legend{ margin:0; margin-left:-.1875rem; padding:0 .1875rem; background:#fff; } @media screen and (min-width:0�){ .tptpl select{ background-image:url("https://apply.superdry.com/app/tpl/asset/e8ce01b6bcb0b7e41cf0a3cfedc5551291e99334b20680b73a9d86bf9437ebf1") ; } } .tptpl select[multiple]{ height:auto; background-image:none; } .tptpl .is-invalid-input:not(:focus){ border-color:#262637; background-color:#e8e8ea; } .tptpl .is-invalid-input:not(:focus)::placeholder{ color:#262637; } .tptpl .form-error, .tptpl .is-invalid-label{ color:#262637; } .tptpl .form-error{ display:none; margin-top:-.5rem; margin-bottom:1rem; font-size:.75rem; font-weight:700; } .tptpl .form-error.is-visible{ display:block; } .tptpl .float-left{ float:left !important; } .tptpl .float-right{ float:right !important; } .tptpl .float-center{ display:block; margin-right:auto; margin-left:auto; } .tptpl .clearfix::after, .tptpl .clearfix::before{ display:table; content:" "; } .tptpl .clearfix::after{ clear:both; } .tptpl .hide{ display:none !important; } .tptpl .invisible{ visibility:hidden; } @media screen and (max-width:39.9375em){ .tptpl .hide-for-small-only{ display:none !important; } } @media screen and (max-width:0em),screen and (min-width:40em){ .tptpl .show-for-small-only{ display:none !important; } } @media print,screen and (min-width:40em){ .tptpl .hide-for-medium{ display:none !important; } } @media screen and (max-width:39.9375em){ .tptpl .show-for-medium{ display:none !important; } } @media screen and (min-width:40em) and (max-width:63.9375em){ .tptpl .hide-for-medium-only{ display:none !important; } } @media screen and (max-width:39.9375em),screen and (min-width:64em){ .tptpl .show-for-medium-only{ display:none !important; } } @media print,screen and (min-width:64em){ .tptpl .hide-for-large{ display:none !important; } } @media screen and (max-width:63.9375em){ .tptpl .show-for-large{ display:none !important; } } @media screen and (min-width:64em) and (max-width:74.9375em){ .tptpl .hide-for-large-only{ display:none !important; } } @media screen and (max-width:63.9375em),screen and (min-width:75em){ .tptpl .show-for-large-only{ display:none !important; } } .tptpl .show-for-sr, .tptpl .show-on-focus{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); } .tptpl .show-on-focus:active, .tptpl .show-on-focus:focus{ position:static !important; width:auto; height:auto; overflow:visible; clip:auto; } .tptpl .hide-for-portrait, .tptpl .show-for-landscape{ display:block !important; } @media screen and (orientation:landscape){ .tptpl .hide-for-portrait, .tptpl .show-for-landscape{ display:block !important; } } @media screen and (orientation:portrait){ .tptpl .hide-for-portrait, .tptpl .show-for-landscape{ display:none !important; } } .tptpl .hide-for-landscape, .tptpl .show-for-portrait{ display:none !important; } @media screen and (orientation:landscape){ .tptpl .hide-for-landscape, .tptpl .show-for-portrait{ display:none !important; } } @media screen and (orientation:portrait){ .tptpl .hide-for-landscape, .tptpl .show-for-portrait{ display:block !important; } } .tptpl .button{ display:inline-block; margin:0 0 25px; padding:0 60px 0 0; border:0; border-radius:0; transition:none; font-size:20px; font-weight:400 !important; line-height:1.25; text-align:left; cursor:pointer; background-color:transparent; color:#000; position:relative; letter-spacing:.03rem; width:max-content; max-width:100%; } .tptpl .button.white{ color:#fff; } .tptpl .button::after{ content:""; position:absolute; top:2px; right:16px; left:auto; width:44px; height:22px; background:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") right center no-repeat; background-size:contain; transition:transform .25s ease-in-out !important; border:0 !important; } .tptpl .button.white.back:before, .tptpl .button.white:after{ background-image:url("https://apply.superdry.com/app/tpl/asset/e3a040bfb59d7daaedd9ef016ae0988433041e0a4783480b9969966332831a50"); } .tptpl .button.back{ padding:0 0 0 55px; } .tptpl .button.back:after{ display:none; } .tptpl .button.back:before{ content:""; position:absolute; top:2px; left:0; width:44px; height:22px; background:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") right center no-repeat; background-size:contain; transition:transform .25s ease-in-out !important; transform:rotate(180deg); } .tptpl .button:hover:after{ transform:translateX(10px); } .tptpl .button.back:hover:before{ transform:translateX(-10px) rotate(180deg); } .tptpl .button.large{ width:100%; padding:10px 65px 10px 20px; background:#f9f9f9; margin:20px 0 !important; max-width:375px; min-height:65px; display:flex; align-items:center; line-height:25px; } .tptpl .main-content .button.large{ margin:40px 0 !important; } .tptpl .button.large::after{ display:none; } .tptpl .button.large svg{ position:absolute; height:22px; top:calc(50% - 11px); right:30px; transition:all .25s ease-in-out; } @media screen and (min-width:1024px){ .tptpl .button.large{ transition:background .25s ease-in-out ; } .tptpl .button.large:hover{ color:#fff; background:#000 ; } .tptpl .button.large:hover svg{ transform:translateX(10px) ; } .tptpl .main-content .button.large{ margin:50px 0 !important; } } .tptpl .input-arrow, .tptpl .input-arrow::after{ position:relative; display:inline-block; } .tptpl .input-arrow .button{ padding-right:50px; } .tptpl .input-arrow::after{ content:""; background:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") center no-repeat; width:35px; height:25px; position:absolute; top:-1px; right:5px; transition:transform .25s ease-in-out; } @media screen and (min-width:1024px){ .tptpl .input-arrow:hover:after{ transform:translateX(10px) ; } } .tptpl .button.disabled, .tptpl .button[disabled]{ opacity:.25; cursor:not-allowed; } .tptpl .button.disabled, .tptpl .button.disabled:focus, .tptpl .button.disabled:hover, .tptpl .button[disabled], .tptpl .button[disabled]:focus, .tptpl .button[disabled]:hover{ background-color:#000; color:#fff; } .tptpl .button.dropdown::after{ width:0; height:0; border:inset .4em; content:""; border-bottom-width:0; border-top-style:solid; border-color:#fff transparent transparent; position:relative; top:.4em; display:inline-block; float:right; margin-left:1em; } .tptpl .button.arrow-only::after{ top:-.1em; float:none; margin-left:0; } .tptpl .close-button{ position:absolute; color:#8a8a8a; cursor:pointer; } .tptpl .close-button:focus, .tptpl .close-button:hover{ color:#000; } .tptpl .close-button.small{ right:.66rem; top:.33em; font-size:1.5em; line-height:1; } .tptpl .close-button, .tptpl .close-button.medium{ right:1rem; top:.5rem; font-size:2em; line-height:1; } .tptpl .button-group{ margin-bottom:1rem; font-size:0; } .tptpl .button-group::after, .tptpl .button-group::before{ display:table; content:" "; } .tptpl .button-group::after{ clear:both; } .tptpl .button-group .button{ margin:0 1px 1px 0; font-size:.9rem; } .tptpl .button-group .button:last-child{ margin-right:0; } .tptpl .button-group.tiny .button{ font-size:.6rem; } .tptpl .button-group.small .button{ font-size:.75rem; } .tptpl .button-group.large .button{ font-size:1.25rem; } .tptpl .button-group.expanded{ margin-right:-1px; } .tptpl .button-group.expanded::after, .tptpl .button-group.expanded::before, .tptpl .no-js .dropdown.menu ul, .tptpl .no-js [data-responsive-menu] ul{ display:none; } .tptpl .button-group.expanded .button:first-child:last-child, .tptpl .menu.expanded>li:first-child:last-child{ width:100%; } .tptpl .button-group.expanded .button:first-child:nth-last-child(2), .tptpl .button-group.expanded .button:first-child:nth-last-child(2):first-child:nth-last-child(2)~.button{ display:inline-block; width:calc(50% - 1px); margin-right:1px; } .tptpl .button-group.expanded .button:first-child:nth-last-child(2):first-child:nth-last-child(2)~.button:last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(2):last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(3):first-child:nth-last-child(3)~.button:last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(3):last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(4):first-child:nth-last-child(4)~.button:last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(4):last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(5):first-child:nth-last-child(5)~.button:last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(5):last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(6):first-child:nth-last-child(6)~.button:last-child, .tptpl .button-group.expanded .button:first-child:nth-last-child(6):last-child{ margin-right:-6px; } .tptpl .button-group.expanded .button:first-child:nth-last-child(3), .tptpl .button-group.expanded .button:first-child:nth-last-child(3):first-child:nth-last-child(3)~.button{ display:inline-block; width:calc(33.33333% - 1px); margin-right:1px; } .tptpl .button-group.expanded .button:first-child:nth-last-child(4), .tptpl .button-group.expanded .button:first-child:nth-last-child(4):first-child:nth-last-child(4)~.button{ display:inline-block; width:calc(25% - 1px); margin-right:1px; } .tptpl .button-group.expanded .button:first-child:nth-last-child(5), .tptpl .button-group.expanded .button:first-child:nth-last-child(5):first-child:nth-last-child(5)~.button{ display:inline-block; width:calc(20% - 1px); margin-right:1px; } .tptpl .button-group.expanded .button:first-child:nth-last-child(6), .tptpl .button-group.expanded .button:first-child:nth-last-child(6):first-child:nth-last-child(6)~.button{ display:inline-block; width:calc(16.66667% - 1px); margin-right:1px; } .tptpl .button-group.primary .button{ background-color:#000; color:#000; } .tptpl .button-group.primary .button:focus, .tptpl .button-group.primary .button:hover{ background-color:#00a36d; color:#000; } .tptpl .button-group.secondary .button{ background-color:#70727b; color:#fff; } .tptpl .button-group.secondary .button:focus, .tptpl .button-group.secondary .button:hover{ background-color:#5a5b62; color:#fff; } .tptpl .button-group.alert .button{ background-color:#262637; color:#fff; } .tptpl .button-group.alert .button:focus, .tptpl .button-group.alert .button:hover{ background-color:#1e1e2c; color:#fff; } .tptpl .button-group.success .button{ background-color:#000; color:#000; } .tptpl .button-group.success .button:focus, .tptpl .button-group.success .button:hover{ background-color:#00a36d; color:#000; } .tptpl .button-group.warning .button{ background-color:#c03; color:#fff; } .tptpl .button-group.warning .button:focus, .tptpl .button-group.warning .button:hover{ background-color:#a30029; color:#fff; } .tptpl .button-group.body-font .button, .tptpl .button-group.header .button{ background-color:#262637; color:#fff; } .tptpl .button-group.body-font .button:focus, .tptpl .button-group.body-font .button:hover, .tptpl .button-group.header .button:focus, .tptpl .button-group.header .button:hover{ background-color:#1e1e2c; color:#fff; } .tptpl .button-group.stacked .button, .tptpl .button-group.stacked-for-medium .button, .tptpl .button-group.stacked-for-small .button{ width:100%; } .tptpl .button-group.stacked .button:last-child, .tptpl .button-group.stacked-for-medium .button:last-child, .tptpl .button-group.stacked-for-small .button:last-child{ margin-bottom:0; } @media print,screen and (min-width:40em){ .tptpl .button-group.stacked-for-small .button{ width:auto; margin-bottom:0 ; } } @media print,screen and (min-width:64em){ .tptpl .button-group.stacked-for-medium .button{ width:auto; margin-bottom:0 ; } } @media screen and (max-width:39.9375em){ .tptpl .button-group.stacked-for-small.expanded{ display:block ; } .tptpl .button-group.stacked-for-small.expanded .button{ display:block; margin-right:0 ; } } .tptpl .switch{ height:2rem; position:relative; margin-bottom:1rem; font-size:.875rem; font-weight:700; color:#fff; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; } .tptpl .switch-input{ position:absolute; margin-bottom:0; opacity:0; } .tptpl .switch-paddle{ position:relative; width:4rem; height:2rem; background:#cacaca; font-weight:inherit; color:inherit; cursor:pointer; } .tptpl input+.switch-paddle{ margin:0; } .tptpl .switch-paddle, .tptpl .switch-paddle::after{ display:block; border-radius:3px; transition:all .25s ease-out; } .tptpl .switch-paddle::after{ position:absolute; top:.25rem; left:.25rem; width:1.5rem; height:1.5rem; transform:translate3d(0,0,0); background:#fff; content:""; } .tptpl input:checked~.switch-paddle{ background:#000; } .tptpl input:checked~.switch-paddle::after{ left:2.25rem; } .tptpl .switch-active, .tptpl .switch-inactive{ position:absolute; top:50%; transform:translateY(-50%); } .tptpl .switch-active{ left:8%; display:none; } .tptpl input:checked+label>.switch-active{ display:block; } .tptpl .switch-inactive{ right:15%; } .tptpl input:checked+label>.switch-inactive{ display:none; } .tptpl .switch.tiny{ height:1.5rem; } .tptpl .switch.tiny .switch-paddle{ width:3rem; height:1.5rem; font-size:.625rem; } .tptpl .switch.tiny .switch-paddle::after{ top:.25rem; left:.25rem; width:1rem; height:1rem; } .tptpl .switch.tiny input:checked~.switch-paddle::after{ left:1.75rem; } .tptpl .switch.small{ height:1.75rem; } .tptpl .switch.small .switch-paddle{ width:3.5rem; height:1.75rem; font-size:.75rem; } .tptpl .switch.small .switch-paddle::after{ top:.25rem; left:.25rem; width:1.25rem; height:1.25rem; } .tptpl .switch.small input:checked~.switch-paddle::after{ left:2rem; } .tptpl .switch.large{ height:2.5rem; } .tptpl .switch.large .switch-paddle{ width:5rem; height:2.5rem; font-size:1rem; } .tptpl .switch.large .switch-paddle::after{ top:.25rem; left:.25rem; width:2rem; height:2rem; } .tptpl .switch.large input:checked~.switch-paddle::after{ left:2.75rem; } .tptpl .menu{ margin:0; list-style-type:none; } .tptpl .menu>li, .tptpl .menu>li>a i, .tptpl .menu>li>a i+span, .tptpl .menu>li>a img, .tptpl .menu>li>a img+span, .tptpl .menu>li>a svg, .tptpl .menu>li>a svg+span{ vertical-align:middle; } .tptpl .menu>li>a{ padding:.7rem 1rem; line-height:1; } .tptpl .menu a, .tptpl .menu button, .tptpl .menu input, .tptpl .menu select{ margin-bottom:0; } .tptpl .menu>li>a i, .tptpl .menu>li>a img, .tptpl .menu>li>a svg{ margin-right:.25rem; display:inline-block; } .tptpl .menu.horizontal>li, .tptpl .menu>li{ display:table-cell; } .tptpl .menu.expanded{ display:table; width:100%; table-layout:fixed; } .tptpl .is-drilldown li, .tptpl .menu.vertical>li, .tptpl .menu>li>a{ display:block; } @media print,screen and (min-width:40em){ .tptpl .menu.medium-horizontal>li{ display:table-cell ; } .tptpl .menu.medium-expanded{ display:table; width:100%; table-layout:fixed ; } .tptpl .menu.medium-expanded>li:first-child:last-child{ width:100% ; } .tptpl .menu.medium-vertical>li{ display:block ; } } @media print,screen and (min-width:64em){ .tptpl .menu.large-horizontal>li{ display:table-cell ; } .tptpl .menu.large-expanded{ display:table; width:100%; table-layout:fixed ; } .tptpl .menu.large-expanded>li:first-child:last-child{ width:100% ; } .tptpl .menu.large-vertical>li{ display:block ; } } .tptpl .menu.simple li{ display:inline-block; vertical-align:top; line-height:1; margin-left:0; margin-right:1rem; } .tptpl .menu.simple a{ padding:0; } .tptpl .menu.simple.align-right li{ margin-right:0; margin-left:1rem; } .tptpl .menu.align-right::after, .tptpl .menu.align-right::before, .tptpl .title-bar::after, .tptpl .title-bar::before{ display:table; content:" "; } .tptpl .menu.align-right::after, .tptpl .title-bar::after{ clear:both; } .tptpl .is-dropdown-menu.vertical.align-right, .tptpl .menu.align-right>li{ float:right; } .tptpl .menu.icon-top>li>a i, .tptpl .menu.icon-top>li>a img, .tptpl .menu.icon-top>li>a svg{ display:block; margin:0 auto .25rem; } .tptpl .menu.icon-top.vertical a>span{ margin:auto; } .tptpl .menu.nested{ margin-left:1rem; } .tptpl .menu .active>a{ background:#000; color:#fff; } .tptpl .menu.menu-bordered li{ border:1px solid #e6e6e6; } .tptpl .menu.menu-bordered li:not(:first-child){ border-top:0; } .tptpl .menu.menu-hover li:hover{ background-color:#e6e6e6; } .tptpl .menu-text{ padding-top:0; padding-bottom:0; padding:.7rem 1rem; font-weight:700; line-height:1; color:inherit; } .tptpl .menu-centered{ text-align:center; } .tptpl .menu-centered>.menu{ display:inline-block; vertical-align:top; } .tptpl .is-drilldown{ position:relative; overflow:hidden; } .tptpl .is-drilldown.animate-height{ transition:height .5s; } .tptpl .is-drilldown-submenu{ position:absolute; top:0; left:100%; z-index:-1; width:100%; background:#fff; transition:transform .25s ease-in-out; } .tptpl .is-drilldown-submenu.is-active{ z-index:1; display:block; transform:translateX(-100%); } .tptpl .is-drilldown-submenu.is-closing{ transform:translateX(100%); } .tptpl .drilldown-submenu-cover-previous{ min-height:100%; } .tptpl .is-accordion-submenu-parent>a, .tptpl .is-drilldown-submenu-parent>a, .tptpl .is-dropdown-submenu-parent{ position:relative; } .tptpl .is-drilldown-submenu-parent>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-right-width:0; border-left-style:solid; border-color:transparent transparent transparent #000; position:absolute; top:50%; margin-top:-6px; right:1rem; } .tptpl .js-drilldown-back>a::before{ width:0; height:0; border:inset 6px; content:""; border-right-style:solid; border-color:transparent #000 transparent transparent; display:inline-block; vertical-align:middle; margin-right:.75rem; border-left-width:0; } .tptpl .is-accordion-submenu-parent>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-bottom-width:0; border-top-style:solid; border-color:#000 transparent transparent; position:absolute; top:50%; margin-top:-3px; right:1rem; } .tptpl .is-accordion-submenu-parent[aria-expanded=true]>a::after{ transform:rotate(180deg); transform-origin:50% 50%; } .tptpl .dropdown.menu.align-right .is-dropdown-submenu.first-sub, .tptpl .dropdown.menu>li.opens-left>.is-dropdown-submenu{ top:100%; right:0; left:auto; } .tptpl .dropdown.menu>li.opens-right>.is-dropdown-submenu{ top:100%; right:auto; left:0; } .tptpl .dropdown.menu.vertical>li .is-dropdown-submenu{ top:0; } .tptpl .dropdown.menu.vertical>li.opens-left>.is-dropdown-submenu{ right:100%; left:auto; } .tptpl .dropdown.menu.vertical>li.opens-right>.is-dropdown-submenu{ right:auto; left:100%; } .tptpl .dropdown.menu.vertical>li>a::after, .tptpl .is-dropdown-submenu .is-dropdown-submenu-parent>a::after{ right:14px; } .tptpl .dropdown.menu.vertical>li.opens-left>a::after, .tptpl .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-left-width:0; border-right-style:solid; border-color:transparent #000 transparent transparent; } .tptpl .dropdown.menu.vertical>li.opens-right>a::after, .tptpl .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-right-width:0; border-left-style:solid; border-color:transparent transparent transparent #000; } @media print,screen and (min-width:40em){ .tptpl .dropdown.menu.medium-horizontal>li.opens-left>.is-dropdown-submenu{ top:100%; right:0; left:auto ; } .tptpl .dropdown.menu.medium-horizontal>li.opens-right>.is-dropdown-submenu{ top:100%; right:auto; left:0 ; } .tptpl .dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a{ position:relative; padding-right:1.5rem ; } .tptpl .dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-bottom-width:0; border-top-style:solid; border-color:#000 transparent transparent; right:5px; margin-top:-3px ; } .tptpl .dropdown.menu.medium-vertical>li .is-dropdown-submenu{ top:0 ; } .tptpl .dropdown.menu.medium-vertical>li.opens-left>.is-dropdown-submenu{ right:100%; left:auto ; } .tptpl .dropdown.menu.medium-vertical>li.opens-right>.is-dropdown-submenu{ right:auto; left:100% ; } .tptpl .dropdown.menu.medium-vertical>li>a::after{ right:14px ; } .tptpl .dropdown.menu.medium-vertical>li.opens-left>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-left-width:0; border-right-style:solid; border-color:transparent #000 transparent transparent ; } .tptpl .dropdown.menu.medium-vertical>li.opens-right>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-right-width:0; border-left-style:solid; border-color:transparent transparent transparent #000 ; } } @media print,screen and (min-width:64em){ .tptpl .dropdown.menu.large-horizontal>li.opens-left>.is-dropdown-submenu{ top:100%; right:0; left:auto ; } .tptpl .dropdown.menu.large-horizontal>li.opens-right>.is-dropdown-submenu{ top:100%; right:auto; left:0 ; } .tptpl .dropdown.menu.large-horizontal>li.is-dropdown-submenu-parent>a{ position:relative; padding-right:1.5rem ; } .tptpl .dropdown.menu.large-horizontal>li.is-dropdown-submenu-parent>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-bottom-width:0; border-top-style:solid; border-color:#000 transparent transparent; right:5px; margin-top:-3px ; } .tptpl .dropdown.menu.large-vertical>li .is-dropdown-submenu{ top:0 ; } .tptpl .dropdown.menu.large-vertical>li.opens-left>.is-dropdown-submenu{ right:100%; left:auto ; } .tptpl .dropdown.menu.large-vertical>li.opens-right>.is-dropdown-submenu{ right:auto; left:100% ; } .tptpl .dropdown.menu.large-vertical>li>a::after{ right:14px ; } .tptpl .dropdown.menu.large-vertical>li.opens-left>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-left-width:0; border-right-style:solid; border-color:transparent #000 transparent transparent ; } .tptpl .dropdown.menu.large-vertical>li.opens-right>a::after{ display:block; width:0; height:0; border:inset 6px; content:""; border-right-width:0; border-left-style:solid; border-color:transparent transparent transparent #000 ; } } .tptpl .is-dropdown-menu.vertical{ width:100px; } .tptpl .is-dropdown-submenu-parent a::after{ position:absolute; top:50%; right:5px; margin-top:-6px; } .tptpl .is-dropdown-submenu-parent.opens-inner>.is-dropdown-submenu{ top:100%; left:auto; } .tptpl .is-dropdown-submenu-parent.opens-left>.is-dropdown-submenu{ right:100%; left:auto; } .tptpl .is-dropdown-submenu-parent.opens-right>.is-dropdown-submenu{ right:auto; left:100%; } .tptpl .is-dropdown-submenu{ position:absolute; top:0; left:100%; z-index:1; display:none; min-width:200px; border:1px solid #cacaca; background:#fff; } .tptpl .is-dropdown-submenu .is-dropdown-submenu{ margin-top:-1px; } .tptpl .is-dropdown-submenu>li{ width:100%; } .tptpl .is-dropdown-submenu.js-dropdown-active{ display:block; } .tptpl .title-bar{ padding:.5rem; background:#000; color:#fff; } .tptpl .title-bar .menu-icon{ margin-left:.25rem; margin-right:.25rem; } .tptpl .title-bar-left{ float:left; } .tptpl .title-bar-right{ float:right; text-align:right; } .tptpl .title-bar-title{ display:inline-block; vertical-align:middle; font-weight:700; } .tptpl .top-bar{ padding:.5rem; } .tptpl .top-bar::after, .tptpl .top-bar::before{ display:table; content:" "; } .tptpl .top-bar::after{ clear:both; } .tptpl .top-bar, .tptpl .top-bar ul{ background-color:#e6e6e6; } .tptpl .top-bar input{ max-width:200px; margin-right:1rem; } .tptpl .top-bar .input-group-field{ width:100%; margin-right:0; } .tptpl .top-bar input.button{ width:auto; } .tptpl .top-bar .top-bar-left, .tptpl .top-bar .top-bar-right{ width:100%; } @media print,screen and (min-width:40em){ .tptpl .top-bar .top-bar-left, .tptpl .top-bar .top-bar-right{ width:auto ; } } @media screen and (max-width:63.9375em){ .tptpl .top-bar.stacked-for-medium .top-bar-left, .tptpl .top-bar.stacked-for-medium .top-bar-right{ width:100% ; } } @media screen and (max-width:74.9375em){ .tptpl .top-bar.stacked-for-large .top-bar-left, .tptpl .top-bar.stacked-for-large .top-bar-right{ width:100% ; } } .tptpl .top-bar-title{ display:inline-block; float:left; padding:.5rem 1rem .5rem 0; } .tptpl .top-bar-title .menu-icon{ bottom:2px; } .tptpl .top-bar-left{ float:left; } .tptpl .top-bar-right{ float:right; } .tptpl .breadcrumbs{ margin:0 0 1rem; list-style:none; } .tptpl .breadcrumbs::after, .tptpl .breadcrumbs::before{ display:table; content:" "; } .tptpl .breadcrumbs::after{ clear:both; } .tptpl .breadcrumbs li{ float:left; font-size:.6875rem; color:#000; cursor:default; text-transform:uppercase; } .tptpl .breadcrumbs li:not(:last-child)::after{ position:relative; top:1px; margin:0 .75rem; opacity:1; content:"/"; color:#cacaca; } .tptpl .breadcrumbs a{ color:#000; } .tptpl .breadcrumbs a:hover{ text-decoration:underline; } .tptpl .breadcrumbs .disabled{ color:#cacaca; cursor:not-allowed; } .tptpl .pagination{ margin-left:0; margin-bottom:1rem; } .tptpl .pagination::after, .tptpl .pagination::before{ display:table; content:" "; } .tptpl .pagination::after{ clear:both; } .tptpl .pagination li{ margin-right:.0625rem; border-radius:3px; font-size:.875rem; display:none; } .tptpl .pagination li:first-child, .tptpl .pagination li:last-child{ display:inline-block; } @media print,screen and (min-width:40em){ .tptpl .pagination li{ display:inline-block ; } } .tptpl .pagination a, .tptpl .pagination button{ display:block; padding:.1875rem .625rem; border-radius:3px; color:#000; } .tptpl .pagination a:hover, .tptpl .pagination button:hover{ background:#e6e6e6; } .tptpl .pagination .current{ padding:.1875rem .625rem; background:#000; color:#fff; cursor:default; } .tptpl .pagination .disabled{ padding:.1875rem .625rem; color:#cacaca; cursor:not-allowed; } .tptpl .pagination .disabled:hover, .tptpl .tabs.simple>li>a:hover, .tptpl table tfoot tr, .tptpl table thead tr{ background:0 0; } .tptpl .pagination .ellipsis::after{ padding:.1875rem .625rem; content:"…"; color:#000; } .tptpl .pagination-previous a::before, .tptpl .pagination-previous.disabled::before{ display:inline-block; margin-right:.5rem; content:"«"; } .tptpl .pagination-next a::after, .tptpl .pagination-next.disabled::after{ display:inline-block; margin-left:.5rem; content:"»"; } .tptpl .accordion{ margin:0 0 5px !important; list-style-type:none !important; } .tptpl .accordion-title{ position:relative; display:block; border:0; color:#000; font-size:13px; line-height:20px; font-weight:500; letter-spacing:.03rem; text-transform:uppercase; padding:0 0 19px 25px; } .tptpl .accordion-title::before{ position:absolute; top:2.5px; left:0; content:""; background:url("https://apply.superdry.com/app/tpl/asset/59a470bcacd02fbc4d4dd68b554880d2d6897e834c5156429285e5b7367a1a8b") center no-repeat; background-size:16px; width:16px; height:16px; } .tptpl .is-active>.accordion-title::before{ background-image:url("https://apply.superdry.com/app/tpl/asset/5ff9330bb2d04f6fce13e5d1325720de4635fc5bf52381a9ef63d6e6320cf172"); } .tptpl .accordion-title:after{ display:none; } .tptpl .accordion-content{ display:none; padding:0 0 1px; border:0; border-bottom:0; color:#000; } .tptpl .accordion-item, .tptpl .main-content .accordion-item{ padding-left:0; } .tptpl .dropdown-pane{ position:absolute; z-index:10; display:block; width:300px; padding:1rem; visibility:hidden; border:1px solid #cacaca; border-radius:3px; background-color:#fff; font-size:1rem; } .tptpl .dropdown-pane.is-open{ visibility:visible; } .tptpl .dropdown-pane.tiny{ width:100px; } .tptpl .dropdown-pane.small{ width:200px; } .tptpl .dropdown-pane.large{ width:400px; } .tptpl .is-off-canvas-open, .tptpl body.is-reveal-open{ overflow:hidden; } .tptpl .js-off-canvas-overlay{ position:absolute; top:0; left:0; width:100%; height:100%; transition:opacity .5s ease,visibility .5s ease; background:rgba(254,254,254,.25); opacity:0; visibility:hidden; overflow:hidden; } .tptpl .js-off-canvas-overlay.is-visible{ opacity:1; visibility:visible; } .tptpl .js-off-canvas-overlay.is-closable{ cursor:pointer; } .tptpl .js-off-canvas-overlay.is-overlay-absolute{ position:absolute; } .tptpl .js-off-canvas-overlay.is-overlay-fixed{ position:fixed; } .tptpl .off-canvas-wrapper{ position:relative; overflow:hidden; } .tptpl .off-canvas, .tptpl .off-canvas-absolute{ position:fixed; z-index:1; transition:transform .5s ease; backface-visibility:hidden; background:#e6e6e6; } .tptpl .off-canvas.is-transition-overlap{ z-index:10; } .tptpl .off-canvas-absolute.is-transition-overlap.is-open, .tptpl .off-canvas.is-transition-overlap.is-open{ box-shadow:0 0 10px rgba(10,10,10,.7); } .tptpl .off-canvas.is-open{ transform:translate(0,0); } .tptpl .off-canvas-absolute{ position:absolute; } .tptpl .off-canvas-absolute.is-transition-overlap{ z-index:10; } .tptpl .off-canvas-absolute.is-open{ transform:translate(0,0); } .tptpl .position-left{ top:0; left:0; width:250px; height:100%; transform:translateX(-250px); overflow-y:auto; } .tptpl .position-left.is-open~.off-canvas-content, .tptpl .position-right{ transform:translateX(250px); } .tptpl .position-left.is-transition-push::after, .tptpl .position-right.is-transition-push::after{ position:absolute; top:0; height:100%; width:1px; box-shadow:0 0 10px rgba(10,10,10,.7); content:" "; } .tptpl .position-left.is-transition-push::after{ right:0; } .tptpl .position-bottom.is-transition-overlap.is-open~.off-canvas-content, .tptpl .position-left.is-transition-overlap.is-open~.off-canvas-content, .tptpl .position-right.is-transition-overlap.is-open~.off-canvas-content, .tptpl .position-top.is-transition-overlap.is-open~.off-canvas-content{ transform:none; } .tptpl .position-right{ top:0; right:0; width:250px; height:100%; overflow-y:auto; } .tptpl .position-right.is-open~.off-canvas-content{ transform:translateX(-250px); } .tptpl .position-right.is-transition-push::after{ left:0; } .tptpl .position-top{ top:0; left:0; width:100%; height:250px; transform:translateY(-250px); overflow-x:auto; } .tptpl .position-bottom, .tptpl .position-top.is-open~.off-canvas-content{ transform:translateY(250px); } .tptpl .position-bottom.is-transition-push::after, .tptpl .position-top.is-transition-push::after{ position:absolute; left:0; height:1px; width:100%; box-shadow:0 0 10px rgba(10,10,10,.7); content:" "; } .tptpl .position-top.is-transition-push::after{ bottom:0; } .tptpl .position-bottom{ bottom:0; left:0; width:100%; height:250px; overflow-x:auto; } .tptpl .position-bottom.is-open~.off-canvas-content{ transform:translateY(-250px); } .tptpl .position-bottom.is-transition-push::after{ top:0; } .tptpl .off-canvas-content{ transition:transform .5s ease; backface-visibility:hidden; } @media print,screen and (min-width:40em){ .tptpl .position-bottom.reveal-for-medium, .tptpl .position-left.reveal-for-medium, .tptpl .position-right.reveal-for-medium, .tptpl .position-top.reveal-for-medium{ transform:none; z-index:1 ; } .tptpl .position-left.reveal-for-medium~.off-canvas-content{ margin-left:250px ; } .tptpl .position-right.reveal-for-medium~.off-canvas-content{ margin-right:250px ; } .tptpl .position-top.reveal-for-medium~.off-canvas-content{ margin-top:250px ; } .tptpl .position-bottom.reveal-for-medium~.off-canvas-content{ margin-bottom:250px ; } } @media print,screen and (min-width:64em){ .tptpl .position-bottom.reveal-for-large, .tptpl .position-left.reveal-for-large, .tptpl .position-right.reveal-for-large, .tptpl .position-top.reveal-for-large{ transform:none; z-index:1 ; } .tptpl .position-left.reveal-for-large~.off-canvas-content{ margin-left:250px ; } .tptpl .position-right.reveal-for-large~.off-canvas-content{ margin-right:250px ; } .tptpl .position-top.reveal-for-large~.off-canvas-content{ margin-top:250px ; } .tptpl .position-bottom.reveal-for-large~.off-canvas-content{ margin-bottom:250px ; } } .tptpl .tabs{ margin:0; border:1px solid #e6e6e6; background:#fff; list-style-type:none; } .tptpl .tabs::after, .tptpl .tabs::before{ display:table; content:" "; } .tptpl .tabs::after{ clear:both; } .tptpl .tabs.vertical>li{ display:block; float:none; width:auto; } .tptpl .tabs.simple>li>a{ padding:0; } .tptpl .tabs.primary{ background:#000; } .tptpl .tabs.primary>li>a{ color:#000; } .tptpl .tabs.primary>li>a:focus, .tptpl .tabs.primary>li>a:hover{ background:#00db92; } .tptpl .tabs-title{ float:left; } .tptpl .tabs-title>a{ display:block; padding:1.25rem 1.5rem; font-size:.75rem; line-height:1; color:#000; } .tptpl .tabs-title>a:hover{ background:#fff; color:#00af75; } .tptpl .tabs-title>a:focus, .tptpl .tabs-title>a[aria-selected=true]{ background:#e6e6e6; color:#000; } .tptpl .tabs-content{ border:1px solid #e6e6e6; border-top:0; background:#fff; color:#000; transition:all .5s ease; } .tptpl .tabs-content.vertical{ border:1px solid #e6e6e6; border-left:0; } .tptpl .tabs-panel{ display:none; padding:1rem; } .tptpl .tabs-panel[aria-hidden=false]{ display:block; } .tptpl .callout{ position:relative; margin:0 0 1rem; padding:1rem; border:1px solid rgba(10,10,10,.25); border-radius:3px; background-color:#fff; } .tptpl .callout>:first-child{ margin-top:0; } .tptpl .callout>:last-child{ margin-bottom:0; } .tptpl .callout.primary{ background-color:#d1fff0; color:#000; } .tptpl .callout.secondary{ background-color:#e9eaeb; color:#000; } .tptpl .callout.alert{ background-color:#dadae5; color:#000; } .tptpl .callout.success{ background-color:#d1fff0; color:#000; } .tptpl .callout.warning{ background-color:#ffd1dd; color:#000; } .tptpl .callout.body-font, .tptpl .callout.header{ background-color:#dadae5; color:#000; } .tptpl .callout.small{ padding:.5rem; } .tptpl .callout.large{ padding:3rem; } .tptpl .card{ margin-bottom:1rem; border:1px solid #e6e6e6; border-radius:3px; background:#fff; box-shadow:none; overflow:hidden; color:#000; } .tptpl .card-divider>:last-child, .tptpl .card-section>:last-child, .tptpl .card>:last-child{ margin-bottom:0; } .tptpl .card-divider{ padding:1rem; background:#e6e6e6; } .tptpl .card-section{ padding:1rem; } .tptpl .media-object{ display:block; margin-bottom:1rem; } .tptpl .media-object img{ max-width:none; } @media screen and (max-width:39.9375em){ .tptpl .media-object.stack-for-small .media-object-section{ padding:0; padding-bottom:1rem; display:block ; } .tptpl .media-object.stack-for-small .media-object-section img{ width:100% ; } } .tptpl .media-object-section{ display:table-cell; vertical-align:top; } .tptpl .media-object-section:first-child{ padding-right:1rem; } .tptpl .media-object-section:last-child:not(:nth-child(2)){ padding-left:1rem; } .tptpl .media-object-section>:last-child{ margin-bottom:0; } .tptpl .media-object-section.middle{ vertical-align:middle; } .tptpl .media-object-section.bottom{ vertical-align:bottom; } .tptpl html.is-reveal-open, .tptpl html.is-reveal-open body{ min-height:100%; overflow:hidden; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; } .tptpl .reveal-overlay{ position:fixed; top:0; right:0; bottom:0; left:0; z-index:1005; display:none; background-color:rgba(10,10,10,.45); overflow-y:scroll; } .tptpl .reveal{ z-index:1006; backface-visibility:hidden; display:none; padding:1rem; border:1px solid #cacaca; border-radius:3px; background-color:#fff; position:relative; top:100px; margin-right:auto; margin-left:auto; overflow-y:auto; } @media print,screen and (min-width:40em){ .tptpl .reveal{ min-height:0 ; } } .tptpl .reveal .column, .tptpl .reveal .columns{ min-width:0; } .tptpl .reveal>:last-child{ margin-bottom:0; } @media print,screen and (min-width:40em){ .tptpl .reveal{ width:600px; max-width:75rem ; } .tptpl .reveal .reveal{ right:auto; left:auto; margin:0 auto ; } } .tptpl .reveal.collapse{ padding:0; } @media print,screen and (min-width:40em){ .tptpl .reveal.tiny{ width:30%; max-width:75rem ; } .tptpl .reveal.large, .tptpl .reveal.small{ width:50%; max-width:75rem ; } .tptpl .reveal.large{ width:90% ; } } .tptpl .reveal.full{ top:0; left:0; width:100%; max-width:none; height:100%; height:100vh; min-height:100vh; margin-left:0; border:0; border-radius:0; } @media screen and (max-width:39.9375em){ .tptpl .reveal{ top:0; left:0; width:100%; max-width:none; height:100%; height:100vh; min-height:100vh; margin-left:0; border:0; border-radius:0 ; } } .tptpl .reveal.without-overlay{ position:fixed; } .tptpl table{ width:100%; margin-bottom:1rem; border-radius:3px; } .tptpl table tbody, .tptpl table tfoot, .tptpl table thead{ border:1px solid #f1f1f1; background-color:#fff; } .tptpl table caption{ font-weight:700; } .tptpl table thead{ background:#f8f8f8; color:#000; } .tptpl table tfoot{ background:#f1f1f1; color:#000; } .tptpl table tfoot td, .tptpl table tfoot th, .tptpl table thead td, .tptpl table thead th{ padding:.5rem .625rem .625rem; font-weight:700; text-align:left; } .tptpl table caption, .tptpl table tbody td, .tptpl table tbody th{ padding:.5rem .625rem .625rem; } .tptpl table tbody tr:nth-child(even){ border-bottom:0; background-color:#f1f1f1; } .tptpl table.unstriped tbody{ background-color:#fff; } .tptpl table.unstriped tbody tr{ border-bottom:1px solid #f1f1f1; background-color:#fff; } @media screen and (max-width:63.9375em){ .tptpl table.stack tfoot, .tptpl table.stack thead{ display:none ; } .tptpl table.stack td, .tptpl table.stack th, .tptpl table.stack tr{ display:block ; } .tptpl table.stack td{ border-top:0 ; } } .tptpl table.scroll{ display:block; width:100%; overflow-x:auto; } .tptpl table.hover thead tr:hover{ background-color:#f3f3f3; } .tptpl table.hover tfoot tr:hover{ background-color:#ececec; } .tptpl table.hover tbody tr:hover{ background-color:#f9f9f9; } .tptpl table.hover:not(.unstriped) tr:nth-of-type(even):hover{ background-color:#ececec; } .tptpl .table-scroll{ overflow-x:auto; } .tptpl .table-scroll table{ width:auto; } .tptpl .badge{ display:inline-block; min-width:2.1em; padding:.3em; border-radius:50%; font-size:.6rem; text-align:center; background:#000; color:#fff; } .tptpl .badge.primary{ background:#000; color:#000; } .tptpl .badge.secondary{ background:#70727b; color:#fff; } .tptpl .badge.alert{ background:#262637; color:#fff; } .tptpl .badge.success, .tptpl .label{ background:#000; color:#000; } .tptpl .badge.warning{ background:#c03; color:#fff; } .tptpl .badge.body-font, .tptpl .badge.header{ background:#262637; color:#fff; } .tptpl .label{ display:inline-block; padding:.33333rem .5rem; border-radius:3px; font-size:.8rem; line-height:1; white-space:nowrap; cursor:default; color:#fff; } .tptpl .label.primary{ background:#000; color:#000; } .tptpl .label.secondary{ background:#70727b; color:#fff; } .tptpl .label.alert{ background:#262637; color:#fff; } .tptpl .label.success{ background:#000; color:#000; } .tptpl .label.warning{ background:#c03; color:#fff; } .tptpl .label.body-font, .tptpl .label.header{ background:#262637; color:#fff; } .tptpl .progress{ height:1rem; margin-bottom:1rem; border-radius:3px; background-color:#cacaca; } .tptpl .progress.primary .progress-meter{ background-color:#000; } .tptpl .progress.secondary .progress-meter{ background-color:#70727b; } .tptpl .progress.alert .progress-meter{ background-color:#262637; } .tptpl .progress-meter, .tptpl .progress.success .progress-meter{ background-color:#000; } .tptpl .progress.warning .progress-meter{ background-color:#c03; } .tptpl .progress.body-font .progress-meter, .tptpl .progress.header .progress-meter{ background-color:#262637; } .tptpl .progress-meter{ position:relative; display:block; width:0%; height:100%; border-radius:3px; } .tptpl .progress-meter-text{ top:50%; left:50%; transform:translate(-50%,-50%); position:absolute; margin:0; font-size:.75rem; font-weight:700; color:#fff; white-space:nowrap; border-radius:3px; } .tptpl .has-tip{ position:relative; display:inline-block; border-bottom:dotted 1px #8a8a8a; font-weight:700; cursor:help; } .tptpl .tooltip{ position:absolute; top:calc(100% + .6495rem); z-index:1200; max-width:10rem; padding:.75rem; border-radius:3px; background-color:#000; font-size:80%; color:#fff; } .tptpl .tooltip::before{ display:block; width:0; height:0; border:inset .75rem; content:""; border-top-width:0; border-bottom-style:solid; border-color:transparent transparent #000; position:absolute; bottom:100%; left:50%; transform:translateX(-50%); } .tptpl .tooltip.left::before, .tptpl .tooltip.right::before, .tptpl .tooltip.top::before{ display:block; width:0; height:0; border:inset .75rem; content:""; bottom:auto; } .tptpl .tooltip.top::before{ border-bottom-width:0; border-top-style:solid; border-color:#000 transparent transparent; top:100%; } .tptpl .tooltip.left::before, .tptpl .tooltip.right::before{ top:50%; transform:translateY(-50%); } .tptpl .tooltip.left::before{ border-right-width:0; border-left-style:solid; border-color:transparent transparent transparent #000; left:100%; } .tptpl .tooltip.right::before{ border-left-width:0; border-right-style:solid; border-color:transparent #000 transparent transparent; right:100%; left:auto; } .tptpl .flex-video, .tptpl .responsive-embed{ position:relative; height:0; margin-bottom:1rem; padding-bottom:75%; overflow:hidden; } .tptpl .flex-video embed, .tptpl .flex-video iframe, .tptpl .flex-video object, .tptpl .flex-video video, .tptpl .responsive-embed embed, .tptpl .responsive-embed iframe, .tptpl .responsive-embed object, .tptpl .responsive-embed video{ position:absolute; top:0; left:0; width:100%; height:100%; } .tptpl .flex-video.widescreen, .tptpl .responsive-embed.widescreen{ padding-bottom:56.25%; } .tptpl .orbit, .tptpl .orbit-container{ position:relative; } .tptpl .orbit-container{ height:0; margin:0; list-style:none; overflow:hidden; } .tptpl .orbit-slide{ width:100%; } .tptpl .orbit-slide.no-motionui.is-active{ top:0; left:0; } .tptpl .orbit-figure{ margin:0; } .tptpl .orbit-image{ width:100%; max-width:100%; margin:0; } .tptpl .orbit-caption{ position:absolute; bottom:0; width:100%; margin-bottom:0; padding:1rem; background-color:rgba(10,10,10,.5); color:#fff; } .tptpl .orbit-next, .tptpl .orbit-previous{ position:absolute; top:50%; transform:translateY(-50%); z-index:10; padding:1rem; color:#fff; } .tptpl .orbit-next:active, .tptpl .orbit-next:focus, .tptpl .orbit-next:hover, .tptpl .orbit-previous:active, .tptpl .orbit-previous:focus, .tptpl .orbit-previous:hover{ background-color:rgba(10,10,10,.5); } .tptpl .orbit-previous{ left:0; } .tptpl .orbit-next{ left:auto; right:0; } .tptpl .orbit-bullets{ position:relative; margin-top:.8rem; margin-bottom:.8rem; text-align:center; } .tptpl .orbit-bullets button{ width:1.2rem; height:1.2rem; margin:.1rem; border-radius:50%; background-color:#cacaca; } .tptpl .orbit-bullets button.is-active, .tptpl .orbit-bullets button:hover{ background-color:#8a8a8a; } .tptpl .thumbnail{ display:inline-block; max-width:100%; margin-bottom:1rem; border:solid 4px #fff; border-radius:3px; box-shadow:0 0 0 1px rgba(10,10,10,.2); line-height:0; } .tptpl a.thumbnail{ transition:box-shadow .2s ease-out; } .tptpl a.thumbnail:focus, .tptpl a.thumbnail:hover{ box-shadow:0 0 6px 1px rgba(0,204,136,.5); } .tptpl a.thumbnail image{ box-shadow:none; } .tptpl .sticky, .tptpl .sticky-container{ position:relative; } .tptpl .sticky{ z-index:0; transform:translate3d(0,0,0); } .tptpl .sticky.is-stuck{ position:fixed; z-index:5; } .tptpl .sticky.is-stuck.is-at-top{ top:0; } .tptpl .sticky.is-anchored.is-at-bottom, .tptpl .sticky.is-stuck.is-at-bottom{ bottom:0; } .tptpl .sticky.is-anchored{ position:relative; right:auto; left:auto; } .tptpl .row{ max-width:1440px; margin-right:auto; margin-left:auto; } .tptpl .row::after, .tptpl .row::before{ display:table; content:" "; } .tptpl .row::after{ clear:both; } .tptpl .row.collapse>.column, .tptpl .row.collapse>.columns{ padding-right:0; padding-left:0; } .tptpl .row .row, .tptpl .row .row.collapse{ margin-right:0; margin-left:0; } @media print,screen and (min-width:40em){ .tptpl .row .row{ margin-right:0; margin-left:0 ; } } @media print,screen and (min-width:64em){ .tptpl .row .row{ margin-right:0; margin-left:0 ; } } .tptpl .row.expanded{ max-width:none; } .tptpl .row.expanded .row{ margin-right:auto; margin-left:auto; } .tptpl .row:not(.expanded) .row{ max-width:none; } .tptpl .column, .tptpl .columns{ width:100%; float:left; padding-right:0; padding-left:0; } .tptpl .column:last-child:not(:first-child), .tptpl .columns:last-child:not(:first-child){ float:right; } .tptpl .column.end:last-child:last-child, .tptpl .end.columns:last-child:last-child{ float:left; } .tptpl .column.row.row, .tptpl .row.row.columns{ float:none; } .tptpl .row .column.row.row, .tptpl .row .row.row.columns{ margin-right:0; margin-left:0; padding-right:0; padding-left:0; } .tptpl .small-1{ width:8.33333%; } .tptpl .small-pull-1, .tptpl .small-push-1{ position:relative; left:8.33333%; } .tptpl .small-pull-1{ left:-8.33333%; } .tptpl .small-offset-0{ margin-left:0; } .tptpl .small-2{ width:16.66667%; } .tptpl .small-pull-2, .tptpl .small-push-2{ position:relative; left:16.66667%; } .tptpl .small-pull-2{ left:-16.66667%; } .tptpl .small-offset-1{ margin-left:8.33333%; } .tptpl .small-3{ width:25%; } .tptpl .small-pull-3, .tptpl .small-push-3{ position:relative; left:25%; } .tptpl .small-pull-3{ left:-25%; } .tptpl .small-offset-2{ margin-left:16.66667%; } .tptpl .small-4{ width:33.33333%; } .tptpl .small-pull-4, .tptpl .small-push-4{ position:relative; left:33.33333%; } .tptpl .small-pull-4{ left:-33.33333%; } .tptpl .small-offset-3{ margin-left:25%; } .tptpl .small-5{ width:41.66667%; } .tptpl .small-pull-5, .tptpl .small-push-5{ position:relative; left:41.66667%; } .tptpl .small-pull-5{ left:-41.66667%; } .tptpl .small-offset-4{ margin-left:33.33333%; } .tptpl .small-6{ width:50%; } .tptpl .small-pull-6, .tptpl .small-push-6{ position:relative; left:50%; } .tptpl .small-pull-6{ left:-50%; } .tptpl .small-offset-5{ margin-left:41.66667%; } .tptpl .small-7{ width:58.33333%; } .tptpl .small-pull-7, .tptpl .small-push-7{ position:relative; left:58.33333%; } .tptpl .small-pull-7{ left:-58.33333%; } .tptpl .small-offset-6{ margin-left:50%; } .tptpl .small-8{ width:66.66667%; } .tptpl .small-pull-8, .tptpl .small-push-8{ position:relative; left:66.66667%; } .tptpl .small-pull-8{ left:-66.66667%; } .tptpl .small-offset-7{ margin-left:58.33333%; } .tptpl .small-9{ width:75%; } .tptpl .small-pull-9, .tptpl .small-push-9{ position:relative; left:75%; } .tptpl .small-pull-9{ left:-75%; } .tptpl .small-offset-8{ margin-left:66.66667%; } .tptpl .small-10{ width:83.33333%; } .tptpl .small-pull-10, .tptpl .small-push-10{ position:relative; left:83.33333%; } .tptpl .small-pull-10{ left:-83.33333%; } .tptpl .small-offset-9{ margin-left:75%; } .tptpl .small-11{ width:91.66667%; } .tptpl .small-pull-11, .tptpl .small-push-11{ position:relative; left:91.66667%; } .tptpl .small-pull-11{ left:-91.66667%; } .tptpl .small-offset-10{ margin-left:83.33333%; } .tptpl .small-12{ width:100%; } .tptpl .small-offset-11{ margin-left:91.66667%; } .tptpl .small-up-1>.column, .tptpl .small-up-1>.columns{ float:left; width:100%; } .tptpl .small-up-1>.column:nth-of-type(n), .tptpl .small-up-1>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-1>.column:nth-of-type(n/**/+1), .tptpl .small-up-1>.columns:nth-of-type(n/**/+1){ clear:both; } .tptpl .small-up-1>.column:last-child, .tptpl .small-up-1>.columns:last-child{ float:left; } .tptpl .small-up-2>.column, .tptpl .small-up-2>.columns{ float:left; width:50%; } .tptpl .small-up-2>.column:nth-of-type(n), .tptpl .small-up-2>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-2>.column:nth-of-type(2n/**/+1), .tptpl .small-up-2>.columns:nth-of-type(2n/**/+1){ clear:both; } .tptpl .small-up-2>.column:last-child, .tptpl .small-up-2>.columns:last-child{ float:left; } .tptpl .small-up-3>.column, .tptpl .small-up-3>.columns{ float:left; width:33.33333%; } .tptpl .small-up-3>.column:nth-of-type(n), .tptpl .small-up-3>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-3>.column:nth-of-type(3n/**/+1), .tptpl .small-up-3>.columns:nth-of-type(3n/**/+1){ clear:both; } .tptpl .small-up-3>.column:last-child, .tptpl .small-up-3>.columns:last-child{ float:left; } .tptpl .small-up-4>.column, .tptpl .small-up-4>.columns{ float:left; width:25%; } .tptpl .small-up-4>.column:nth-of-type(n), .tptpl .small-up-4>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-4>.column:nth-of-type(4n/**/+1), .tptpl .small-up-4>.columns:nth-of-type(4n/**/+1){ clear:both; } .tptpl .small-up-4>.column:last-child, .tptpl .small-up-4>.columns:last-child{ float:left; } .tptpl .small-up-5>.column, .tptpl .small-up-5>.columns{ float:left; width:20%; } .tptpl .small-up-5>.column:nth-of-type(n), .tptpl .small-up-5>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-5>.column:nth-of-type(5n/**/+1), .tptpl .small-up-5>.columns:nth-of-type(5n/**/+1){ clear:both; } .tptpl .small-up-5>.column:last-child, .tptpl .small-up-5>.columns:last-child{ float:left; } .tptpl .small-up-6>.column, .tptpl .small-up-6>.columns{ float:left; width:16.66667%; } .tptpl .small-up-6>.column:nth-of-type(n), .tptpl .small-up-6>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-6>.column:nth-of-type(6n/**/+1), .tptpl .small-up-6>.columns:nth-of-type(6n/**/+1){ clear:both; } .tptpl .small-up-6>.column:last-child, .tptpl .small-up-6>.columns:last-child{ float:left; } .tptpl .small-up-7>.column, .tptpl .small-up-7>.columns{ float:left; width:14.28571%; } .tptpl .small-up-7>.column:nth-of-type(n), .tptpl .small-up-7>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-7>.column:nth-of-type(7n/**/+1), .tptpl .small-up-7>.columns:nth-of-type(7n/**/+1){ clear:both; } .tptpl .small-up-7>.column:last-child, .tptpl .small-up-7>.columns:last-child{ float:left; } .tptpl .small-up-8>.column, .tptpl .small-up-8>.columns{ float:left; width:12.5%; } .tptpl .small-up-8>.column:nth-of-type(n), .tptpl .small-up-8>.columns:nth-of-type(n){ clear:none; } .tptpl .small-up-8>.column:nth-of-type(8n/**/+1), .tptpl .small-up-8>.columns:nth-of-type(8n/**/+1){ clear:both; } .tptpl .small-up-8>.column:last-child, .tptpl .small-up-8>.columns:last-child{ float:left; } .tptpl .small-collapse>.column, .tptpl .small-collapse>.columns{ padding-right:0; padding-left:0; } .tptpl .expanded.row .small-collapse.row, .tptpl .small-collapse .row{ margin-right:0; margin-left:0; } .tptpl .small-uncollapse>.column, .tptpl .small-uncollapse>.columns{ padding-right:0; padding-left:0; } .tptpl .small-centered{ margin-right:auto; margin-left:auto; } .tptpl .small-centered, .tptpl .small-centered:last-child:not(:first-child){ float:none; clear:both; } .tptpl .small-pull-0, .tptpl .small-push-0, .tptpl .small-uncentered{ position:static; float:left; margin-right:0; margin-left:0; } @media print,screen and (min-width:40em){ .tptpl .medium-1{ width:8.33333% ; } .tptpl .medium-pull-1, .tptpl .medium-push-1{ position:relative; left:8.33333% ; } .tptpl .medium-pull-1{ left:-8.33333% ; } .tptpl .medium-offset-0{ margin-left:0 ; } .tptpl .medium-2{ width:16.66667% ; } .tptpl .medium-pull-2, .tptpl .medium-push-2{ position:relative; left:16.66667% ; } .tptpl .medium-pull-2{ left:-16.66667% ; } .tptpl .medium-offset-1{ margin-left:8.33333% ; } .tptpl .medium-3{ width:25% ; } .tptpl .medium-pull-3, .tptpl .medium-push-3{ position:relative; left:25% ; } .tptpl .medium-pull-3{ left:-25% ; } .tptpl .medium-offset-2{ margin-left:16.66667% ; } .tptpl .medium-4{ width:33.33333% ; } .tptpl .medium-pull-4, .tptpl .medium-push-4{ position:relative; left:33.33333% ; } .tptpl .medium-pull-4{ left:-33.33333% ; } .tptpl .medium-offset-3{ margin-left:25% ; } .tptpl .medium-5{ width:41.66667% ; } .tptpl .medium-pull-5, .tptpl .medium-push-5{ position:relative; left:41.66667% ; } .tptpl .medium-pull-5{ left:-41.66667% ; } .tptpl .medium-offset-4{ margin-left:33.33333% ; } .tptpl .medium-6{ width:50% ; } .tptpl .medium-pull-6, .tptpl .medium-push-6{ position:relative; left:50% ; } .tptpl .medium-pull-6{ left:-50% ; } .tptpl .medium-offset-5{ margin-left:41.66667% ; } .tptpl .medium-7{ width:58.33333% ; } .tptpl .medium-pull-7, .tptpl .medium-push-7{ position:relative; left:58.33333% ; } .tptpl .medium-pull-7{ left:-58.33333% ; } .tptpl .medium-offset-6{ margin-left:50% ; } .tptpl .medium-8{ width:66.66667% ; } .tptpl .medium-pull-8, .tptpl .medium-push-8{ position:relative; left:66.66667% ; } .tptpl .medium-pull-8{ left:-66.66667% ; } .tptpl .medium-offset-7{ margin-left:58.33333% ; } .tptpl .medium-9{ width:75% ; } .tptpl .medium-pull-9, .tptpl .medium-push-9{ position:relative; left:75% ; } .tptpl .medium-pull-9{ left:-75% ; } .tptpl .medium-offset-8{ margin-left:66.66667% ; } .tptpl .medium-10{ width:83.33333% ; } .tptpl .medium-pull-10, .tptpl .medium-push-10{ position:relative; left:83.33333% ; } .tptpl .medium-pull-10{ left:-83.33333% ; } .tptpl .medium-offset-9{ margin-left:75% ; } .tptpl .medium-11{ width:91.66667% ; } .tptpl .medium-pull-11, .tptpl .medium-push-11{ position:relative; left:91.66667% ; } .tptpl .medium-pull-11{ left:-91.66667% ; } .tptpl .medium-offset-10{ margin-left:83.33333% ; } .tptpl .medium-12{ width:100% ; } .tptpl .medium-offset-11{ margin-left:91.66667% ; } .tptpl .medium-up-1>.column, .tptpl .medium-up-1>.columns{ float:left; width:100% ; } .tptpl .medium-up-1>.column:nth-of-type(n), .tptpl .medium-up-1>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-1>.column:nth-of-type(n/**/+1), .tptpl .medium-up-1>.columns:nth-of-type(n/**/+1){ clear:both ; } .tptpl .medium-up-1>.column:last-child, .tptpl .medium-up-1>.columns:last-child{ float:left ; } .tptpl .medium-up-2>.column, .tptpl .medium-up-2>.columns{ float:left; width:50% ; } .tptpl .medium-up-2>.column:nth-of-type(n), .tptpl .medium-up-2>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-2>.column:nth-of-type(2n/**/+1), .tptpl .medium-up-2>.columns:nth-of-type(2n/**/+1){ clear:both ; } .tptpl .medium-up-2>.column:last-child, .tptpl .medium-up-2>.columns:last-child{ float:left ; } .tptpl .medium-up-3>.column, .tptpl .medium-up-3>.columns{ float:left; width:33.33333% ; } .tptpl .medium-up-3>.column:nth-of-type(n), .tptpl .medium-up-3>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-3>.column:nth-of-type(3n/**/+1), .tptpl .medium-up-3>.columns:nth-of-type(3n/**/+1){ clear:both ; } .tptpl .medium-up-3>.column:last-child, .tptpl .medium-up-3>.columns:last-child{ float:left ; } .tptpl .medium-up-4>.column, .tptpl .medium-up-4>.columns{ float:left; width:25% ; } .tptpl .medium-up-4>.column:nth-of-type(n), .tptpl .medium-up-4>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-4>.column:nth-of-type(4n/**/+1), .tptpl .medium-up-4>.columns:nth-of-type(4n/**/+1){ clear:both ; } .tptpl .medium-up-4>.column:last-child, .tptpl .medium-up-4>.columns:last-child{ float:left ; } .tptpl .medium-up-5>.column, .tptpl .medium-up-5>.columns{ float:left; width:20% ; } .tptpl .medium-up-5>.column:nth-of-type(n), .tptpl .medium-up-5>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-5>.column:nth-of-type(5n/**/+1), .tptpl .medium-up-5>.columns:nth-of-type(5n/**/+1){ clear:both ; } .tptpl .medium-up-5>.column:last-child, .tptpl .medium-up-5>.columns:last-child{ float:left ; } .tptpl .medium-up-6>.column, .tptpl .medium-up-6>.columns{ float:left; width:16.66667% ; } .tptpl .medium-up-6>.column:nth-of-type(n), .tptpl .medium-up-6>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-6>.column:nth-of-type(6n/**/+1), .tptpl .medium-up-6>.columns:nth-of-type(6n/**/+1){ clear:both ; } .tptpl .medium-up-6>.column:last-child, .tptpl .medium-up-6>.columns:last-child{ float:left ; } .tptpl .medium-up-7>.column, .tptpl .medium-up-7>.columns{ float:left; width:14.28571% ; } .tptpl .medium-up-7>.column:nth-of-type(n), .tptpl .medium-up-7>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-7>.column:nth-of-type(7n/**/+1), .tptpl .medium-up-7>.columns:nth-of-type(7n/**/+1){ clear:both ; } .tptpl .medium-up-7>.column:last-child, .tptpl .medium-up-7>.columns:last-child{ float:left ; } .tptpl .medium-up-8>.column, .tptpl .medium-up-8>.columns{ float:left; width:12.5% ; } .tptpl .medium-up-8>.column:nth-of-type(n), .tptpl .medium-up-8>.columns:nth-of-type(n){ clear:none ; } .tptpl .medium-up-8>.column:nth-of-type(8n/**/+1), .tptpl .medium-up-8>.columns:nth-of-type(8n/**/+1){ clear:both ; } .tptpl .medium-up-8>.column:last-child, .tptpl .medium-up-8>.columns:last-child{ float:left ; } .tptpl .medium-collapse>.column, .tptpl .medium-collapse>.columns{ padding-right:0; padding-left:0 ; } .tptpl .expanded.row .medium-collapse.row, .tptpl .medium-collapse .row{ margin-right:0; margin-left:0 ; } .tptpl .medium-uncollapse>.column, .tptpl .medium-uncollapse>.columns{ padding-right:0; padding-left:0 ; } .tptpl .medium-centered{ margin-right:auto; margin-left:auto ; } .tptpl .medium-centered, .tptpl .medium-centered:last-child:not(:first-child){ float:none; clear:both ; } .tptpl .medium-pull-0, .tptpl .medium-push-0, .tptpl .medium-uncentered{ position:static; float:left; margin-right:0; margin-left:0 ; } } @media print,screen and (min-width:64em){ .tptpl .large-1{ width:8.33333% ; } .tptpl .large-pull-1, .tptpl .large-push-1{ position:relative; left:8.33333% ; } .tptpl .large-pull-1{ left:-8.33333% ; } .tptpl .large-offset-0{ margin-left:0 ; } .tptpl .large-2{ width:16.66667% ; } .tptpl .large-pull-2, .tptpl .large-push-2{ position:relative; left:16.66667% ; } .tptpl .large-pull-2{ left:-16.66667% ; } .tptpl .large-offset-1{ margin-left:8.33333% ; } .tptpl .large-3{ width:25% ; } .tptpl .large-pull-3, .tptpl .large-push-3{ position:relative; left:25% ; } .tptpl .large-pull-3{ left:-25% ; } .tptpl .large-offset-2{ margin-left:16.66667% ; } .tptpl .large-4{ width:33.33333% ; } .tptpl .large-pull-4, .tptpl .large-push-4{ position:relative; left:33.33333% ; } .tptpl .large-pull-4{ left:-33.33333% ; } .tptpl .large-offset-3{ margin-left:25% ; } .tptpl .large-5{ width:41.66667% ; } .tptpl .large-pull-5, .tptpl .large-push-5{ position:relative; left:41.66667% ; } .tptpl .large-pull-5{ left:-41.66667% ; } .tptpl .large-offset-4{ margin-left:33.33333% ; } .tptpl .large-6{ width:50% ; } .tptpl .large-pull-6, .tptpl .large-push-6{ position:relative; left:50% ; } .tptpl .large-pull-6{ left:-50% ; } .tptpl .large-offset-5{ margin-left:41.66667% ; } .tptpl .large-7{ width:58.33333% ; } .tptpl .large-pull-7, .tptpl .large-push-7{ position:relative; left:58.33333% ; } .tptpl .large-pull-7{ left:-58.33333% ; } .tptpl .large-offset-6{ margin-left:50% ; } .tptpl .large-8{ width:66.66667% ; } .tptpl .large-pull-8, .tptpl .large-push-8{ position:relative; left:66.66667% ; } .tptpl .large-pull-8{ left:-66.66667% ; } .tptpl .large-offset-7{ margin-left:58.33333% ; } .tptpl .large-9{ width:75% ; } .tptpl .large-pull-9, .tptpl .large-push-9{ position:relative; left:75% ; } .tptpl .large-pull-9{ left:-75% ; } .tptpl .large-offset-8{ margin-left:66.66667% ; } .tptpl .large-10{ width:83.33333% ; } .tptpl .large-pull-10, .tptpl .large-push-10{ position:relative; left:83.33333% ; } .tptpl .large-pull-10{ left:-83.33333% ; } .tptpl .large-offset-9{ margin-left:75% ; } .tptpl .large-11{ width:91.66667% ; } .tptpl .large-pull-11, .tptpl .large-push-11{ position:relative; left:91.66667% ; } .tptpl .large-pull-11{ left:-91.66667% ; } .tptpl .large-offset-10{ margin-left:83.33333% ; } .tptpl .large-12{ width:100% ; } .tptpl .large-offset-11{ margin-left:91.66667% ; } .tptpl .large-up-1>.column, .tptpl .large-up-1>.columns{ float:left; width:100% ; } .tptpl .large-up-1>.column:nth-of-type(n), .tptpl .large-up-1>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-1>.column:nth-of-type(n/**/+1), .tptpl .large-up-1>.columns:nth-of-type(n/**/+1){ clear:both ; } .tptpl .large-up-1>.column:last-child, .tptpl .large-up-1>.columns:last-child{ float:left ; } .tptpl .large-up-2>.column, .tptpl .large-up-2>.columns{ float:left; width:50% ; } .tptpl .large-up-2>.column:nth-of-type(n), .tptpl .large-up-2>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-2>.column:nth-of-type(2n/**/+1), .tptpl .large-up-2>.columns:nth-of-type(2n/**/+1){ clear:both ; } .tptpl .large-up-2>.column:last-child, .tptpl .large-up-2>.columns:last-child{ float:left ; } .tptpl .large-up-3>.column, .tptpl .large-up-3>.columns{ float:left; width:33.33333% ; } .tptpl .large-up-3>.column:nth-of-type(n), .tptpl .large-up-3>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-3>.column:nth-of-type(3n/**/+1), .tptpl .large-up-3>.columns:nth-of-type(3n/**/+1){ clear:both ; } .tptpl .large-up-3>.column:last-child, .tptpl .large-up-3>.columns:last-child{ float:left ; } .tptpl .large-up-4>.column, .tptpl .large-up-4>.columns{ float:left; width:25% ; } .tptpl .large-up-4>.column:nth-of-type(n), .tptpl .large-up-4>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-4>.column:nth-of-type(4n/**/+1), .tptpl .large-up-4>.columns:nth-of-type(4n/**/+1){ clear:both ; } .tptpl .large-up-4>.column:last-child, .tptpl .large-up-4>.columns:last-child{ float:left ; } .tptpl .large-up-5>.column, .tptpl .large-up-5>.columns{ float:left; width:20% ; } .tptpl .large-up-5>.column:nth-of-type(n), .tptpl .large-up-5>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-5>.column:nth-of-type(5n/**/+1), .tptpl .large-up-5>.columns:nth-of-type(5n/**/+1){ clear:both ; } .tptpl .large-up-5>.column:last-child, .tptpl .large-up-5>.columns:last-child{ float:left ; } .tptpl .large-up-6>.column, .tptpl .large-up-6>.columns{ float:left; width:16.66667% ; } .tptpl .large-up-6>.column:nth-of-type(n), .tptpl .large-up-6>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-6>.column:nth-of-type(6n/**/+1), .tptpl .large-up-6>.columns:nth-of-type(6n/**/+1){ clear:both ; } .tptpl .large-up-6>.column:last-child, .tptpl .large-up-6>.columns:last-child{ float:left ; } .tptpl .large-up-7>.column, .tptpl .large-up-7>.columns{ float:left; width:14.28571% ; } .tptpl .large-up-7>.column:nth-of-type(n), .tptpl .large-up-7>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-7>.column:nth-of-type(7n/**/+1), .tptpl .large-up-7>.columns:nth-of-type(7n/**/+1){ clear:both ; } .tptpl .large-up-7>.column:last-child, .tptpl .large-up-7>.columns:last-child{ float:left ; } .tptpl .large-up-8>.column, .tptpl .large-up-8>.columns{ float:left; width:12.5% ; } .tptpl .large-up-8>.column:nth-of-type(n), .tptpl .large-up-8>.columns:nth-of-type(n){ clear:none ; } .tptpl .large-up-8>.column:nth-of-type(8n/**/+1), .tptpl .large-up-8>.columns:nth-of-type(8n/**/+1){ clear:both ; } .tptpl .large-up-8>.column:last-child, .tptpl .large-up-8>.columns:last-child{ float:left ; } .tptpl .large-collapse>.column, .tptpl .large-collapse>.columns{ padding-right:0; padding-left:0 ; } .tptpl .expanded.row .large-collapse.row, .tptpl .large-collapse .row{ margin-right:0; margin-left:0 ; } .tptpl .large-uncollapse>.column, .tptpl .large-uncollapse>.columns{ padding-right:0; padding-left:0 ; } .tptpl .large-centered{ margin-right:auto; margin-left:auto ; } .tptpl .large-centered, .tptpl .large-centered:last-child:not(:first-child){ float:none; clear:both ; } .tptpl .large-pull-0, .tptpl .large-push-0, .tptpl .large-uncentered{ position:static; float:left; margin-right:0; margin-left:0 ; } } .tptpl .column-block{ margin-bottom:0; } .tptpl .column-block>:last-child{ margin-bottom:0; } .tptpl .menu-icon, .tptpl .menu-icon.dark{ position:relative; display:inline-block; vertical-align:middle; width:20px; height:16px; cursor:pointer; } .tptpl .menu-icon::after{ background:#fff; box-shadow:0 7px 0 #fff,0 14px 0 #fff; } .tptpl .menu-icon:hover::after{ background:#cacaca; box-shadow:0 7px 0 #cacaca,0 14px 0 #cacaca; } .tptpl .menu-icon.dark::after, .tptpl .menu-icon::after{ position:absolute; top:0; left:0; display:block; width:100%; height:2px; content:""; } .tptpl .menu-icon.dark::after{ background:#000; box-shadow:0 7px 0 #000,0 14px 0 #000; } .tptpl .menu-icon.dark:hover::after{ background:#8a8a8a; box-shadow:0 7px 0 #8a8a8a,0 14px 0 #8a8a8a; } .tptpl .slide-in-down.mui-enter, .tptpl .slide-in-left.mui-enter{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; backface-visibility:hidden; } .tptpl .slide-in-down.mui-enter{ transform:translateY(-100%); } .tptpl .slide-in-down.mui-enter.mui-enter-active{ transform:translateY(0); } .tptpl .slide-in-left.mui-enter{ transform:translateX(-100%); } .tptpl .slide-in-left.mui-enter.mui-enter-active{ transform:translateX(0); } .tptpl .slide-in-up.mui-enter{ transform:translateY(100%); } .tptpl .slide-in-up.mui-enter.mui-enter-active{ transform:translateY(0); } .tptpl .slide-in-right.mui-enter, .tptpl .slide-in-up.mui-enter, .tptpl .slide-out-down.mui-leave{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; backface-visibility:hidden; } .tptpl .slide-in-right.mui-enter{ transform:translateX(100%); } .tptpl .slide-in-right.mui-enter.mui-enter-active{ transform:translateX(0); } .tptpl .slide-out-down.mui-leave{ transform:translateY(0); } .tptpl .slide-out-down.mui-leave.mui-leave-active{ transform:translateY(100%); } .tptpl .slide-out-right.mui-leave{ transform:translateX(0); } .tptpl .slide-out-right.mui-leave.mui-leave-active{ transform:translateX(100%); } .tptpl .slide-out-left.mui-leave, .tptpl .slide-out-right.mui-leave, .tptpl .slide-out-up.mui-leave{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; backface-visibility:hidden; } .tptpl .slide-out-up.mui-leave{ transform:translateY(0); } .tptpl .slide-out-up.mui-leave.mui-leave-active{ transform:translateY(-100%); } .tptpl .slide-out-left.mui-leave{ transform:translateX(0); } .tptpl .slide-out-left.mui-leave.mui-leave-active{ transform:translateX(-100%); } .tptpl .fade-in.mui-enter, .tptpl .fade-out.mui-leave{ transition-duration:.5s; transition-timing-function:linear; opacity:0; transition-property:opacity; } .tptpl .fade-in.mui-enter.mui-enter-active{ opacity:1; } .tptpl .fade-out.mui-leave{ opacity:1; } .tptpl .fade-out.mui-leave.mui-leave-active{ opacity:0; } .tptpl .hinge-in-from-right.mui-enter, .tptpl .hinge-in-from-top.mui-enter{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; opacity:0; } .tptpl .hinge-in-from-top.mui-enter{ transform-origin:top; } .tptpl .hinge-in-from-bottom.mui-enter.mui-enter-active, .tptpl .hinge-in-from-left.mui-enter.mui-enter-active, .tptpl .hinge-in-from-middle-x.mui-enter.mui-enter-active, .tptpl .hinge-in-from-middle-y.mui-enter.mui-enter-active, .tptpl .hinge-in-from-right.mui-enter.mui-enter-active, .tptpl .hinge-in-from-top.mui-enter.mui-enter-active{ opacity:1; } .tptpl .hinge-in-from-right.mui-enter{ transform-origin:right; } .tptpl .hinge-in-from-bottom.mui-enter{ transform-origin:bottom; } .tptpl .hinge-in-from-bottom.mui-enter, .tptpl .hinge-in-from-left.mui-enter, .tptpl .hinge-in-from-middle-x.mui-enter, .tptpl .hinge-in-from-middle-y.mui-enter{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; opacity:0; } .tptpl .hinge-in-from-left.mui-enter{ transform-origin:left; } .tptpl .hinge-in-from-middle-x.mui-enter, .tptpl .hinge-in-from-middle-y.mui-enter{ transform-origin:center; } .tptpl .hinge-in-from-middle-x.mui-enter{} .tptpl .hinge-in-from-middle-y.mui-enter{} .tptpl .hinge-out-from-bottom.mui-leave, .tptpl .hinge-out-from-right.mui-leave, .tptpl .hinge-out-from-top.mui-leave{ transition-duration:.5s; transition-timing-function:linear; transform-origin:top; transition-property:transform,opacity; opacity:1; } .tptpl .hinge-out-from-top.mui-leave.mui-leave-active{ opacity:0; } .tptpl .hinge-out-from-bottom.mui-leave, .tptpl .hinge-out-from-right.mui-leave{ transform-origin:right; } .tptpl .hinge-out-from-right.mui-leave.mui-leave-active{ opacity:0; } .tptpl .hinge-out-from-bottom.mui-leave{ transform-origin:bottom; } .tptpl .hinge-out-from-bottom.mui-leave.mui-leave-active{ opacity:0; } .tptpl .hinge-out-from-left.mui-leave{ transform-origin:left; opacity:1; } .tptpl .hinge-out-from-left.mui-leave.mui-leave-active{ opacity:0; } .tptpl .hinge-out-from-left.mui-leave, .tptpl .hinge-out-from-middle-x.mui-leave, .tptpl .hinge-out-from-middle-y.mui-leave, .tptpl .scale-in-up.mui-enter{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; } .tptpl .hinge-out-from-middle-x.mui-leave, .tptpl .hinge-out-from-middle-y.mui-leave{ transform-origin:center; opacity:1; } .tptpl .hinge-out-from-middle-x.mui-leave.mui-leave-active{ opacity:0; } .tptpl .hinge-out-from-middle-y.mui-leave.mui-leave-active{ opacity:0; } .tptpl .scale-in-up.mui-enter{ transform:scale(.5); opacity:0; } .tptpl .scale-in-down.mui-enter.mui-enter-active, .tptpl .scale-in-up.mui-enter.mui-enter-active{ transform:scale(1); opacity:1; } .tptpl .scale-in-down.mui-enter{ transform:scale(1.5); opacity:0; } .tptpl .scale-in-down.mui-enter, .tptpl .scale-out-down.mui-leave, .tptpl .scale-out-up.mui-leave, .tptpl .spin-in.mui-enter{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; } .tptpl .scale-out-down.mui-leave, .tptpl .scale-out-up.mui-leave{ transform:scale(1); opacity:1; } .tptpl .scale-out-up.mui-leave.mui-leave-active{ transform:scale(1.5); opacity:0; } .tptpl .scale-out-down.mui-leave.mui-leave-active{ transform:scale(.5); opacity:0; } .tptpl .spin-in.mui-enter{ transform:rotate(-.75turn); opacity:0; } .tptpl .spin-in.mui-enter.mui-enter-active, .tptpl .spin-out.mui-leave{ transform:rotate(0); opacity:1; } .tptpl .spin-out.mui-leave{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; } .tptpl .spin-in-ccw.mui-enter, .tptpl .spin-out.mui-leave.mui-leave-active{ transform:rotate(.75turn); opacity:0; } .tptpl .spin-in-ccw.mui-enter{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; } .tptpl .spin-in-ccw.mui-enter.mui-enter-active, .tptpl .spin-out-ccw.mui-leave{ transform:rotate(0); opacity:1; } .tptpl .spin-out-ccw.mui-leave{ transition-duration:.5s; transition-timing-function:linear; transition-property:transform,opacity; } .tptpl .spin-out-ccw.mui-leave.mui-leave-active{ transform:rotate(-.75turn); opacity:0; } .tptpl .slow{ transition-duration:750ms !important; } .tptpl .fast{ transition-duration:250ms !important; } .tptpl .linear{ transition-timing-function:linear !important; } .tptpl .ease{ transition-timing-function:ease !important; } .tptpl .ease-in{ transition-timing-function:ease-in !important; } .tptpl .ease-out{ transition-timing-function:ease-out !important; } .tptpl .ease-in-out{ transition-timing-function:ease-in-out !important; } .tptpl .bounce-in{ transition-timing-function:cubic-bezier(.485,.155,.24,1.245) !important; } .tptpl .bounce-out{ transition-timing-function:cubic-bezier(.485,.155,.515,.845) !important; } .tptpl .bounce-in-out{ transition-timing-function:cubic-bezier(.76,-.245,.24,1.245) !important; } .tptpl .short-delay{ transition-delay:.3s !important; } .tptpl .long-delay{ transition-delay:.7s !important; } .tptpl .shake{ animation-name:shake-7; } .tptpl .spin-ccw, .tptpl .spin-cw{ animation-name:spin-cw-1turn; } .tptpl .wiggle{ animation-name:wiggle-7deg; } .tptpl .shake, .tptpl .spin-ccw, .tptpl .spin-cw, .tptpl .wiggle{ animation-duration:.5s; } .tptpl .infinite{ animation-iteration-count:infinite; } .tptpl .slow{ animation-duration:750ms !important; } .tptpl .fast{ animation-duration:250ms !important; } .tptpl .linear{ animation-timing-function:linear !important; } .tptpl .ease{ animation-timing-function:ease !important; } .tptpl .ease-in{ animation-timing-function:ease-in !important; } .tptpl .ease-out{ animation-timing-function:ease-out !important; } .tptpl .ease-in-out{ animation-timing-function:ease-in-out !important; } .tptpl .bounce-in{ animation-timing-function:cubic-bezier(.485,.155,.24,1.245) !important; } .tptpl .bounce-out{ animation-timing-function:cubic-bezier(.485,.155,.515,.845) !important; } .tptpl .bounce-in-out{ animation-timing-function:cubic-bezier(.76,-.245,.24,1.245) !important; } .tptpl .short-delay{ animation-delay:.3s !important; } .tptpl .long-delay{ animation-delay:.7s !important; } .tptpl body{ padding:60px 0; } .tptpl body.home{ padding-top:0; } .tptpl body.no-job-bar{ padding-bottom:0; } .tptpl .wrapper.grey .employee-stories.more-text .text-container p .button, .tptpl body.no-job-bar footer{ margin-bottom:0; } @media screen and (min-width:1120px){ .tptpl body{ padding:95px 0 ; } } .tptpl ::placeholder{ color:#adadad; opacity:1; } .tptpl svg.svg-select{} .tptpl svg.svg-mag-glass, .tptpl svg.svg-select{} .tptpl .text-centre{ text-align:center !important; } .tptpl .is-drilldown, .tptpl body.mobile-faqs-filters-on, .tptpl body.mobile-job-search-filters-on, .tptpl body.mobile-main-nav-on, .tptpl body.mobile-map-filters-on, .tptpl body.mobile-post-filters-on, .tptpl body.mobile-story-filters-on{ overflow:hidden; } .tptpl .is-drilldown{ position:fixed; z-index:5; background:#fff; top:0; width:0; max-width:calc(100% - 58px) !important; height:100% !important; min-height:100% !important; transform:translateX(-100%); transition:transform .25s ease-in-out,width .25s ease-in-out; } .tptpl .mobile-main-nav-on .is-drilldown{ transform:translateX(0); width:calc(100% - 58px); } .tptpl .is-drilldown-submenu{ height:100%; background:#fff; overflow-x:hidden; overflow-y:scroll; } .tptpl .is-drilldown .menu>li>a{ font-size:16px; line-height:1; text-transform:uppercase; font-weight:500; padding:16px 38px 17px 19px; letter-spacing:.03rem; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .tptpl .is-drilldown .menu>li>a.selected span{ border-bottom:1px solid #000; } .tptpl .is-drilldown .menu>li.is-submenu-parent-item>a span, .tptpl .is-drilldown .menu>li.is-submenu-parent-item>a span:after{ border:0 !important; } .tptpl .is-drilldown .menu>li.is-drilldown-submenu-item:last-of-type>a{ margin-bottom:50px; } .tptpl .is-drilldown .menu>li.mobile-logo, .tptpl .mobile-country-menu-on .is-drilldown .menu>li.mobile-logo, .tptpl .mobile-country-menu-on.mobile-main-nav-on .is-drilldown .menu>li.mobile-logo{ font-size:0; line-height:0; background:url("https://apply.superdry.com/app/tpl/asset/c6eead004ad9e56fe9b551c467b358d9467f6c82ff04f35ff1c452eb52a98aa7") 0 0 no-repeat; margin:22px 20px 25px; background-size:200px; width:calc(100% - 40px); height:22px; opacity:0; transition:opacity .25s ease-in-out .15s; } .tptpl .mobile-main-nav-on .is-drilldown .menu>li.mobile-logo{ opacity:1; } .tptpl .is-drilldown .menu>li.mobile-logo>a{ font-size:0; line-height:0; width:100%; height:22px; margin:0; padding:0; } .tptpl .is-drilldown .mobile-country-menu-button a::after, .tptpl .is-drilldown-submenu-parent>a::after{ border:0; background:url("https://apply.superdry.com/app/tpl/asset/59a470bcacd02fbc4d4dd68b554880d2d6897e834c5156429285e5b7367a1a8b") center no-repeat; width:16px; height:16px; border-radius:20px; margin:0; top:calc(50% - 8px); right:20px; background-size:16px; } .tptpl .is-drilldown .mobile-search{ position:absolute; bottom:85px; left:20px; right:20px; } .tptpl .is-drilldown .mobile-search label{ font-size:0; line-height:0; } .tptpl .is-drilldown .mobile-search input{ font-size:16px; border:0; border-bottom:1px solid #000; border-radius:0; box-shadow:none; padding:10px 28px; height:50px; background:url("https://apply.superdry.com/app/tpl/asset/561ccf23bcf2883feef9cee9f4e664044b327c33b2d43ccf8a7587205d52da31") no-repeat left center; } .tptpl .is-drilldown .menu>li.is-submenu-item>a{ text-transform:none; font-weight:300; font-size:13px; line-height:1.1; padding:10px 19px; overflow:visible; white-space:normal; } .tptpl .is-drilldown .menu>li.is-submenu-item>a.selected span{ position:relative; border:0 !important; } .tptpl .is-drilldown .menu>li.is-submenu-item>a.selected span::after{ content:""; display:block; border-bottom:1px solid #000; position:absolute; bottom:-3px; width:100%; left:0; } .tptpl .is-drilldown .menu>li.is-submenu-item>a.list-heading{ font-weight:500; padding:20px; } .tptpl .is-drilldown .menu>li.is-submenu-parent-item{ position:absolute; top:0; left:50px; font-size:16px; line-height:1; text-transform:uppercase; font-weight:500; width:calc(100% - 100px); text-align:center; padding:0; } .tptpl .is-drilldown .menu>li.is-submenu-parent-item>a{ padding:24px 0 25px; font-size:16px; line-height:1; text-transform:uppercase; font-weight:500; } .tptpl .js-drilldown-back>a{ padding:22px !important; } .tptpl .js-drilldown-back>a::before{ border:0; background:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") left center no-repeat; width:33px; height:22px; transform:rotate(180deg); margin:0; } .tptpl .dimmer{ background:rgba(0,0,0,.8); position:fixed; z-index:5; width:100%; height:0; opacity:0; top:0; overflow:hidden; transition:opacity .25s ease-in-out,height 0s linear .25s; } .tptpl .mobile-faqs-filters-on .dimmer, .tptpl .mobile-job-search-filters-on .dimmer, .tptpl .mobile-main-nav-on .dimmer, .tptpl .mobile-map-filters-on .dimmer, .tptpl .mobile-post-filters-on .dimmer, .tptpl .mobile-story-filters-on .dimmer{ height:100%; opacity:1; transition:opacity .25s ease-in-out; } .tptpl .mobile-main-nav-close{ position:absolute; top:20px; right:20px; width:20px; height:20px; background:0 0; } .tptpl .mobile-main-nav-close::after, .tptpl .mobile-main-nav-close::before{ content:""; border-top:1px solid #fff; top:10px; position:absolute; height:2px; width:28px; } .tptpl .mobile-main-nav-close::before{ transform:rotate(-45deg); left:-4px; } .tptpl .mobile-main-nav-close::after{ transform:rotate(45deg); left:-5px; } .tptpl .is-drilldown .mobile-country-menu-button{ position:absolute; width:100%; bottom:12px; } .tptpl .is-drilldown .mobile-country-menu-button span.country{ border:1px solid #000; padding:6px 5px; font-size:13px; margin:-5px 9px 0 0; float:left; } .tptpl .is-drilldown .mobile-country-menu-button a::after{ content:""; position:absolute; display:block; top:calc(50% - 11px); transition:transform .25s ease-in-out; } .tptpl .mobile-country-menu-on .is-drilldown .mobile-country-menu-button a::after{ transform:rotate(45deg); } .tptpl .mobile-country-menu{ position:fixed; z-index:5; background:#fff; width:calc(100% - 58px); bottom:86px; height:0; overflow-y:scroll; left:calc(-100% + 58px); transition:all .25s ease-in-out; } .tptpl .mobile-main-nav-on .mobile-country-menu{ left:0; } .tptpl .mobile-country-menu-on .mobile-country-menu{ height:calc(100% - 85px); } .tptpl .mobile-country-menu ul{ margin:0; list-style:none; padding:12px 19px 19px; } .tptpl .mobile-country-menu li{ padding:10px 0; } .tptpl .mobile-country-menu a{ position:relative; text-transform:uppercase; font-weight:500; display:block; } .tptpl .mobile-country-menu a.selected{ font-weight:700; } .tptpl .mobile-country-menu a.selected::after{ content:""; background:url("https://apply.superdry.com/app/tpl/asset/92c88cf594228603328a2b640ea262fc266dc7a901cc5f2a9472b1452bf97b3c") 0 0 no-repeat; width:20px; height:20px; display:block; position:absolute; top:0; right:0; } .tptpl .desktop-header-country-menu-button{ display:none; } @media screen and (min-width:1120px){ .tptpl .mobile-country-menu{ display:none ; } .tptpl .header .mobile-main-nav a, .tptpl .is-drilldown, .tptpl .menu.mobile-only, .tptpl .mobile-header-country-menu-button{ display:none !important; } .tptpl .desktop-header-country-menu-button{ display:block; position:relative; float:right; margin:4px 10px 4px 40px ; } } .tptpl .mobile-job-search-bar{ position:fixed; z-index:4; left:0; bottom:0; width:100%; height:60px; background:#fff; } .tptpl .mobile-job-search-bar a{ font-size:24px; line-height:1; display:block; padding:18px 20px; position:relative; } .tptpl .mobile-job-search-bar a::after{ content:""; background:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") center no-repeat; right:16px; position:absolute; width:40px; height:22px; top:calc(50% - 11px); } .tptpl .mobile-faqs-filters, .tptpl .mobile-job-search-filters, .tptpl .mobile-map-filters, .tptpl .mobile-post-filters, .tptpl .mobile-story-filters{ position:fixed; z-index:10; top:0; right:0; width:0; height:100%; background:#fff; padding:20px 0; transform:translateX(100%); transition:transform .25s ease-in-out,width .25s ease-in-out,padding .25s ease-in-out; max-height:calc(100vh); overflow-x:hidden; overflow-y:scroll; } .tptpl .mobile-faqs-filters-on .mobile-faqs-filters, .tptpl .mobile-job-search-filters-on .mobile-job-search-filters, .tptpl .mobile-map-filters-on .mobile-map-filters, .tptpl .mobile-post-filters-on .mobile-post-filters, .tptpl .mobile-story-filters-on .mobile-story-filters{ transform:translateX(0); width:calc(100% - 58px); padding:20px; } .tptpl .mobile-faqs-filters-on .mobile-main-nav-close, .tptpl .mobile-job-search-filters-on .mobile-main-nav-close, .tptpl .mobile-map-filters-on .mobile-main-nav-close, .tptpl .mobile-post-filters-on .mobile-main-nav-close, .tptpl .mobile-story-filters-on .mobile-main-nav-close{ right:0; left:20px; } .tptpl .mobile-faqs-filters form, .tptpl .mobile-job-search-filters form, .tptpl .mobile-map-filters form, .tptpl .mobile-post-filters form, .tptpl .mobile-story-filters form{ margin:25px 0; } .tptpl .mobile-faqs-filters h2, .tptpl .mobile-job-search-filters h2, .tptpl .mobile-map-filters h2, .tptpl .mobile-post-filters h2, .tptpl .mobile-story-filters h2{ font-size:16px; font-weight:500; line-height:1.5; text-transform:uppercase; text-align:center; letter-spacing:.04rem; } .tptpl .mobile-faqs-filters ul, .tptpl .mobile-job-search-filters ul, .tptpl .mobile-map-filters ul, .tptpl .mobile-post-filters ul, .tptpl .mobile-story-filters ul{ margin:0 0 10px; } .tptpl .mobile-faqs-filters .accordion-title, .tptpl .mobile-job-search-filters .accordion-title, .tptpl .mobile-map-filters .accordion-title, .tptpl .mobile-post-filters .accordion-title, .tptpl .mobile-story-filters .accordion-title{ font-size:16px; font-weight:500; text-transform:uppercase; line-height:1; padding:16px 0; border:0; letter-spacing:.04rem; } .tptpl .accordion-title.only-item, .tptpl .custom-select label, .tptpl .custom-select select, .tptpl .custom-select-no-dim label, .tptpl .custom-select-no-dim select{ display:none; } .tptpl .mobile-faqs-filters :last-child:not(.is-active)>.accordion-title, .tptpl .mobile-faqs-filters :last-child>.accordion-content:last-child, .tptpl .mobile-job-search-filters :last-child:not(.is-active)>.accordion-title, .tptpl .mobile-job-search-filters :last-child>.accordion-content:last-child, .tptpl .mobile-map-filters :last-child:not(.is-active)>.accordion-title, .tptpl .mobile-map-filters :last-child>.accordion-content:last-child, .tptpl .mobile-post-filters :last-child:not(.is-active)>.accordion-title, .tptpl .mobile-post-filters :last-child>.accordion-content:last-child, .tptpl .mobile-story-filters :last-child:not(.is-active)>.accordion-title, .tptpl .mobile-story-filters :last-child>.accordion-content:last-child{ border:0; } .tptpl .mobile-job-search-filters .accordion-title::before{ content:""; background:#fff url("https://apply.superdry.com/app/tpl/asset/59a470bcacd02fbc4d4dd68b554880d2d6897e834c5156429285e5b7367a1a8b") center no-repeat; background-size:15px; border:1px solid #000; border-radius:20px; width:15px; height:15px; text-align:center; margin:0; font-size:15px; line-height:.7; top:calc(50% - 8px); left:auto; right:0; transition:all 0s ease-out; } .tptpl .mobile-job-search-filters .is-active>.accordion-title::before{ background-image:url("https://apply.superdry.com/app/tpl/asset/5ff9330bb2d04f6fce13e5d1325720de4635fc5bf52381a9ef63d6e6320cf172"); } .tptpl .mobile-faqs-filters .accordion-title::before, .tptpl .mobile-map-filters .accordion-title::before, .tptpl .mobile-post-filters .accordion-title::before, .tptpl .mobile-story-filters .accordion-title::before{ content:""; background:#fff center no-repeat; background-size:15px; width:15px; height:15px; text-align:center; margin:0; font-size:15px; line-height:.7; top:calc(50% - 8px); left:auto; right:0; transition:all .25s ease-out; } .tptpl .mobile-faqs-filters .is-active>.accordion-title::before, .tptpl .mobile-map-filters .is-active>.accordion-title::before, .tptpl .mobile-post-filters .is-active>.accordion-title::before, .tptpl .mobile-story-filters .is-active>.accordion-title::before{ background-image:url("https://apply.superdry.com/app/tpl/asset/92c88cf594228603328a2b640ea262fc266dc7a901cc5f2a9472b1452bf97b3c"); } .tptpl .mobile-faqs-filters .accordion-title:focus, .tptpl .mobile-faqs-filters .accordion-title:hover, .tptpl .mobile-job-search-filters .accordion-title:focus, .tptpl .mobile-job-search-filters .accordion-title:hover, .tptpl .mobile-map-filters .accordion-title:focus, .tptpl .mobile-map-filters .accordion-title:hover, .tptpl .mobile-post-filters .accordion-title:focus, .tptpl .mobile-post-filters .accordion-title:hover, .tptpl .mobile-story-filters .accordion-title:focus, .tptpl .mobile-story-filters .accordion-title:hover{ background:#fff; } .tptpl .mobile-faqs-filters .accordion-content, .tptpl .mobile-job-search-filters .accordion-content, .tptpl .mobile-map-filters .accordion-content, .tptpl .mobile-post-filters .accordion-content, .tptpl .mobile-story-filters .accordion-content{ border:0; padding:0 20px 10px; } .tptpl .accordion-content.empty{ padding:0 !important; height:0 !important; } .tptpl .mobile-faqs-filters .accordion-content .cc, .tptpl .mobile-job-search-filters .accordion-content .cc, .tptpl .mobile-map-filters .accordion-content .cc, .tptpl .mobile-post-filters .accordion-content .cc, .tptpl .mobile-story-filters .accordion-content .cc{ padding:11px 20px 11px 0; } .tptpl .mobile-faqs-filters .accordion-content .cc .checkmark, .tptpl .mobile-job-search-filters .accordion-content .cc .checkmark, .tptpl .mobile-map-filters .accordion-content .cc .checkmark, .tptpl .mobile-post-filters .accordion-content .cc .checkmark, .tptpl .mobile-story-filters .accordion-content .cc .checkmark{ top:10px; right:0; height:16px; width:16px; border:0; } .tptpl .mobile-faqs-filters .accordion-content .cc input:checked+span, .tptpl .mobile-job-search-filters .accordion-content .cc input:checked+span, .tptpl .mobile-map-filters .accordion-content .cc input:checked+span, .tptpl .mobile-post-filters .accordion-content .cc input:checked+span, .tptpl .mobile-story-filters .accordion-content .cc input:checked+span{ font-weight:500; letter-spacing:.04rem; } .tptpl .mobile-faqs-filters .accordion-content .cc input:checked~.checkmark, .tptpl .mobile-job-search-filters .accordion-content .cc input:checked~.checkmark, .tptpl .mobile-map-filters .accordion-content .cc input:checked~.checkmark, .tptpl .mobile-post-filters .accordion-content .cc input:checked~.checkmark, .tptpl .mobile-story-filters .accordion-content .cc input:checked~.checkmark{ background:url("https://apply.superdry.com/app/tpl/asset/92c88cf594228603328a2b640ea262fc266dc7a901cc5f2a9472b1452bf97b3c") center -3px no-repeat; background-size:16px; } .tptpl .mobile-job-search-filters input[type=search]{ margin:0 0 40px; } .tptpl .mobile-faqs-filters-button, .tptpl .mobile-job-search-button-in-page, .tptpl .mobile-map-filters-button, .tptpl .mobile-post-filters-button, .tptpl .mobile-story-filters-button{ border-top:1px solid #000; border-bottom:1px solid #000; display:block; text-align:center; margin:-9px 20px 40px; text-transform:uppercase; font-weight:500; font-size:13px; letter-spacing:.03rem; padding:14px 20px; } .tptpl .main-content .mobile-faqs-filters-button, .tptpl .main-content .mobile-job-search-button-in-page, .tptpl .main-content .mobile-map-filters-button, .tptpl .main-content .mobile-post-filters-button, .tptpl .main-content .mobile-story-filters-button{ margin:30px 0; } .tptpl .mobile-faqs-filters-button span, .tptpl .mobile-job-search-button-in-page span, .tptpl .mobile-map-filters-button span, .tptpl .mobile-post-filters-button span, .tptpl .mobile-story-filters-button span{ position:relative; padding:0 0 0 25px; } .tptpl .mobile-faqs-filters-button span::before, .tptpl .mobile-job-search-button-in-page span::before, .tptpl .mobile-map-filters-button span::before, .tptpl .mobile-post-filters-button span::before, .tptpl .mobile-story-filters-button span::before{ content:""; position:absolute; display:block; border:0; background:url("https://apply.superdry.com/app/tpl/asset/59a470bcacd02fbc4d4dd68b554880d2d6897e834c5156429285e5b7367a1a8b") center no-repeat; background-size:16px; width:16px; height:16px; border-radius:20px; margin:0; top:calc(50% - 8px); left:0; transition:transform .25s ease-in-out; } @media screen and (min-width:1024px){ .tptpl .mobile-faqs-filters-button, .tptpl .mobile-job-search-button-in-page, .tptpl .mobile-map-filters-button, .tptpl .mobile-post-filters-button, .tptpl .mobile-story-filters-button{ display:none ; } } @media screen and (min-width:1120px){ .tptpl .mobile-faqs-filters, .tptpl .mobile-job-search-bar, .tptpl .mobile-job-search-filters, .tptpl .mobile-map-filters, .tptpl .mobile-post-filters, .tptpl .mobile-story-filters{ display:none ; } } .tptpl .desktop-job-search-bar{ display:none; position:fixed; bottom:0; width:100%; height:96px; background:#fff; z-index:3; } @media screen and (min-width:1120px){ .tptpl .desktop-job-search-bar{ display:block ; } .tptpl .keyboard-control .desktop-job-search-bar{ position:relative ; } } .tptpl .desktop-job-search-bar .container{ margin:0 auto; width:100%; max-width:1400px; } .tptpl .desktop-job-search-bar .title{ float:left; width:180px; padding:36px 0 36px 20px; } .tptpl .desktop-job-search-bar .title p{ font-size:24px; line-height:1; letter-spacing:.02rem; margin:0; } .tptpl .desktop-job-search-bar form{ float:left; width:calc(100% - 180px); height:96px; text-align:center; } .tptpl .desktop-job-search-bar input[type=submit]{ float:right; font-size:0; width:74px; height:96px; background:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") 20px center no-repeat; background-size:34px; transition:background-position .25s ease-in-out; } .tptpl .desktop-job-search-bar input[type=submit]:hover{ background-position:30px center; } .tptpl .desktop-job-search-bar .select-container{ width:calc(100% - 74px); height:96px; display:inline-block; margin:0 auto; text-align:left; } .tptpl .desktop-job-search-bar .columns{ width:calc(20% - 5px); float:none !important; display:inline-block; vertical-align:top; } .tptpl .desktop-job-search-bar input[type=search], .tptpl .desktop-job-search-bar input[type=text]{ margin:10px 20px 0; width:calc(100% - 40px); height:53px; } .tptpl .desktop-job-search-bar ::placeholder, .tptpl .job-search-container ::placeholder{ color:#000; opacity:1; } .tptpl .desktop-job-search-bar :disabled::placeholder, .tptpl .job-search-container :disabled::placeholder{ color:#adadad; opacity:1; } .tptpl .custom-select, .tptpl .custom-select-no-dim{ position:relative; display:inline-block; vertical-align:top; width:100%; margin:0 0 24px; } @media screen and (min-width:1120px){ .tptpl .keyboard-control .custom-select label, .tptpl .keyboard-control .custom-select-no-dim label{ display:block; width:calc(100% - 5px); font-size:0 ; } .tptpl .keyboard-control .custom-select select, .tptpl .keyboard-control .custom-select-no-dim select{ display:block; width:calc(100% - 35px); font-size:13px; letter-spacing:.02rem; text-transform:uppercase; margin:11px 20px; padding:2px 0 0; height:52px; background:url("https://apply.superdry.com/app/tpl/asset/799a72eda4f52e54fa89c4c17e5fe668fb019f0b94354987c75ca8c17321c8f1") 0 0 no-repeat; background-position:right center; border:0; border-bottom:1px solid #000; border-radius:0 ; } .tptpl .keyboard-control .select-selected{ display:none ; } .tptpl .keyboard-control .custom-select select:disabled, .tptpl .keyboard-control .custom-select-no-dim select:disabled{ color:#aaa ; } } .tptpl .select-items div, .tptpl .select-selected{ display:block; cursor:pointer; user-select:none; font-size:13px; font-weight:400; } .tptpl .select-selected{ margin:11px 20px; padding:20px 15px 18px 0; line-height:1; text-align:left; background:#fff; text-transform:uppercase; letter-spacing:.02rem; border-bottom:1px solid #000; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .tptpl .select-selected::after{ position:absolute; content:""; top:34px; right:20px; width:11px; height:10px; background:url("https://apply.superdry.com/app/tpl/asset/799a72eda4f52e54fa89c4c17e5fe668fb019f0b94354987c75ca8c17321c8f1") 0 0 no-repeat; transition:all 0s ease-out; } .tptpl .select-selected.select-arrow-active::after{ transform:rotate(180deg); top:30px; } .tptpl .select-items{ position:absolute; color:#000; background-color:#fff; left:0; right:0; z-index:2; text-align:left; padding:20px 0 5px; } .tptpl .desktop-job-search-bar .select-items{ background-color:rgba(255,255,255,.95); max-height:calc(100vh - 96px); overflow-y:scroll; } .tptpl .wide-01 .select-items{ right:-160px; } .tptpl .select-items div{ color:#000; padding:0 40px 0 20px; margin:0 0 15px; line-height:1.3; text-transform:none; position:relative; } .tptpl .fancy-select-disabled{ cursor:not-allowed; color:#aaa; } .tptpl .select-selected.fancy-select-disabled::after{ cursor:not-allowed; } .tptpl .select-items{ top:100%; bottom:auto; } .tptpl .desktop-job-search-bar .select-items{ top:auto; bottom:100%; } .tptpl .select-hide, .tptpl h1 br, .tptpl h2 br, .tptpl h3 br, .tptpl h4 br, .tptpl h5 br{ display:none; } .tptpl .same-as-selected, .tptpl .select-items div:hover{ color:#000; background-color:transparent; } .tptpl .select-items div.same-as-selected{ font-weight:700; } .tptpl .select-items div.same-as-selected::after{ content:""; position:absolute; right:13px; width:20px; height:16px; background:url("https://apply.superdry.com/app/tpl/asset/92c88cf594228603328a2b640ea262fc266dc7a901cc5f2a9472b1452bf97b3c") 0 0 no-repeat; top:-4px; } .tptpl .desktop-job-search-bar .select-selected::before{ content:""; position:fixed; background:rgba(0,0,0,.5); top:calc(100% - 96px); left:0; right:0; bottom:96px; z-index:-1; cursor:default; opacity:0; transition:opacity .25s ease-in-out,top 0s ease-in-out .25s; } .tptpl .desktop-job-search-bar .select-selected.select-arrow-active::before{ top:0; opacity:1; transition:opacity .25s ease-in-out; } .tptpl .cc, .tptpl .cc input{ cursor:pointer; margin:0; } .tptpl .cc{ display:block; position:relative; padding:4px 18px 7px 28px; font-size:13px; line-height:1; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; vertical-align:top; } .tptpl .cc input{ position:absolute; opacity:0; height:0; width:0; } .tptpl .cc .checkmark{ position:absolute; top:3px; right:0; height:16px; width:16px; background:#fff; border:1px solid #132c3f; } .tptpl .cc input:checked~.checkmark{ background:#dc358b url("https://apply.superdry.com/app/tpl/asset/92c88cf594228603328a2b640ea262fc266dc7a901cc5f2a9472b1452bf97b3c") center 2px no-repeat; background-size:12px; } .tptpl .cc .checkmark:after{ content:""; position:absolute; display:none; } .tptpl .cc input:checked~.checkmark:after{ display:block; } .tptpl .top-banner .text-container p.subtitle, .tptpl h1{ font-family:martinregular,"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-transform:uppercase; } .tptpl h1{ font-size:80px; line-height:56px; margin:0 0 17px; } @media screen and (max-width:639px){ .tptpl .sustainability h1, .tptpl h1.smaller-on-small{ font-size:70px; line-height:46px ; } } .tptpl h2{ font-size:30px; line-height:38px; letter-spacing:.03rem; margin:0 0 19px; } .tptpl .job-details, .tptpl h3{ font-size:24px; line-height:30px; } .tptpl h3, .tptpl h4, .tptpl h5, .tptpl p{ letter-spacing:.03rem; } .tptpl h3, .tptpl h4{ margin:0 0 19px; } .tptpl h4{ font-size:18px; line-height:23px; } .tptpl h5, .tptpl p{ font-size:13px; line-height:20px; } .tptpl h5{ font-weight:500; text-transform:uppercase; margin:0 0 18px; } .tptpl p{ font-weight:300; margin:0 0 21px; } .tptpl #jobIndexNoJobsMessage p a, .tptpl .main-content ol a, .tptpl .main-content ol b, .tptpl .main-content ol strong, .tptpl .main-content p a, .tptpl .main-content p b, .tptpl .main-content p strong, .tptpl .main-content ul a, .tptpl .main-content ul b, .tptpl .main-content ul strong{ position:relative; font-weight:600; letter-spacing:.01rem; } .tptpl #jobIndexNoJobsMessage p a:after, .tptpl .main-content ol a:after, .tptpl .main-content p a:after, .tptpl .main-content ul a:after{ content:""; position:absolute; left:0; bottom:-1px; width:100%; border-bottom:1px solid transparent; transition:border .25s ease-in-out; } .tptpl #jobIndexNoJobsMessage p a:hover:after, .tptpl .main-content ol a:hover:after, .tptpl .main-content p a:hover:after, .tptpl .main-content ul a:hover:after{ border-color:#000; } .tptpl .job-details{ font-weight:300; margin:0 0 40px; } .tptpl .job-details span, .tptpl h1, .tptpl h2, .tptpl h3, .tptpl h4{ font-weight:400; } .tptpl .main-content dl, .tptpl .main-content ol, .tptpl .main-content ul{ list-style-type:disc; margin:0 0 30px 25px; font-size:13px; line-height:21px; font-weight:300; letter-spacing:.03rem; } .tptpl .main-content li{ padding-left:12px; } .tptpl ul.colour-bullets{ color:#adadad; } .tptpl ul.colour-bullets span{ color:#000; } .tptpl a.underline{ border-bottom:1px solid #000; transition:border-color .25s ease-in-out; } .tptpl .slick-slide.slick-loading img, .tptpl .top-banner .text-container br, .tptpl a.underline:after{ display:none; } .tptpl a.underline:hover{ border-color:transparent; } .tptpl a.cta, .tptpl span.cta{ font-size:13px; line-height:1; text-transform:uppercase; font-weight:500; letter-spacing:.03rem; border-bottom:1px solid transparent; transition:all .25s ease-in-out; } .tptpl a.cta:hover, .tptpl a:hover span.cta{ border-color:#000; } .tptpl .main-content{ padding:0 38px 30px; } .tptpl .main-content.top{ padding-top:30px; } .tptpl .red{ color:#962a00 !important; } .tptpl .green{ color:#3d4009 !important; } .tptpl .amber{ color:#d37b2e !important; } .tptpl .blue{ color:#002e40 !important; } .tptpl .grey{ color:#474744 !important; } .tptpl .main-content .button{ margin-top:20px; } @media screen and (min-width:1024px){ .tptpl .main-content{ max-width:860px; margin:0 auto; padding:0 38px 75px ; } .tptpl .main-content.top{ padding-top:75px; min-height:calc(100vh - 250px) ; } .tptpl .main-content .button{ margin-top:28px ; } .tptpl h1 br, .tptpl h2 br, .tptpl h3 br, .tptpl h4 br, .tptpl h5 br{ display:block ; } } @media screen and (min-width:1440px){ .tptpl .main-content.top{ min-height:calc(100vh - 286px) ; } } .tptpl .top-banner{ display:table; table-layout:fixed; width:100%; margin:0 0 50px; padding:0 0 40px; background-color:#474744; background-repeat:no-repeat; background-position:center; background-size:cover; } .tptpl body.home .top-banner{ padding-top:50px; } @media screen and (min-width:1120px){ .tptpl body.keyboard-control .top-banner{ margin-top:40px; transition:margin .25s ease-in-out ; } .tptpl body.home.keyboard-control .top-banner{ margin-top:135px ; } } .tptpl .top-banner.red{ background-color:#9e3a26; } .tptpl .top-banner.green{ background-color:#42481f; } .tptpl .top-banner.blue{ background-color:#093143; } .tptpl .top-banner.grey{ background-color:#474744; } .tptpl .top-banner .image-container{ width:calc(100% - 37px); margin:30px 0; } .tptpl .top-banner.sustainability .image-container{ width:calc(100% - 78px); margin:0; } .tptpl .top-banner .text-container{ margin:-55px 0 0; width:100%; padding:0 38px; overflow:hidden; } .tptpl body.home .top-banner .text-container{ margin-top:-48px; padding-right:28px; } .tptpl .top-banner .text-container h1{ color:#f0f0f0; } .tptpl .top-banner .text-container p.subtitle{ font-size:40px; line-height:28px; color:#d37b2e; margin:0; letter-spacing:0; } .tptpl .top-banner .text-container p.subtitle a{ color:#fff; transition:color .25s ease-in-out; } .tptpl .top-banner .text-container p.subtitle a:hover{ color:#d37b2e; } .tptpl .top-banner .text-container .long-copy h1, .tptpl .top-banner .text-container .long-copy p.subtitle{ font-size:40px; line-height:28px; } .tptpl .top-banner .text-container .long-copy h1{ margin:8px 0 20px; } .tptpl .top-banner .text-container .long-copy p.subtitle{ margin:0 0 20px; } .tptpl .top-banner .call-to-action-container{ padding:28px 20px 0; } @media screen and (min-width:1024px){ .tptpl .top-banner{ margin:0 0 100px; padding:0 25px ; } .tptpl body.home .top-banner{ padding-top:0 ; } .tptpl .top-banner .outer-container{ position:relative; display:table; width:100%; max-width:1200px; margin:0 auto ; } .tptpl .top-banner .text-container{ display:flex; align-items:center; margin:0; padding:0; position:absolute; top:0; height:100% ; } .tptpl body.home .top-banner .text-container{ margin:0 ; } .tptpl .top-banner .text-container br{ display:block ; } .tptpl .top-banner .text-container-2{ padding:12px 0 0 ; } .tptpl body.home .top-banner .text-container-2{ padding:10px 0 0 ; } .tptpl .top-banner .image-container, .tptpl .top-banner.sustainability .image-container{ display:table; width:100%; min-height:500px; margin:40px auto ; } .tptpl body.home .top-banner .image-container{ margin:145px auto 85px ; } .tptpl .top-banner.sustainability{ background-image:url("https://apply.superdry.com/app/tpl/asset/8475ded972984056eb9032a9213312e948c303cac4e1a2a608d016ee3bf0c4b0") ; } .tptpl .top-banner .image-container img.large{ display:block; float:right; max-width:684px ; } .tptpl body.home .top-banner .image-container img.large{ max-width:787px ; } .tptpl .top-banner .text-container h1{ font-size:150px; line-height:105px; margin:0 0 35px; max-width:690px ; } .tptpl body.home .top-banner .text-container h1{ font-size:200px; line-height:140px; margin:0 0 35px; max-width:800px; letter-spacing:.06rem ; } .tptpl .top-banner .text-container h1.smallerBannerTitle{ font-size:110px; line-height:75px ; } .tptpl .top-banner .text-container p.subtitle{ font-size:80px; line-height:56px; max-width:690px ; } .tptpl .top-banner .text-container .long-copy h1, .tptpl .top-banner .text-container .long-copy p.subtitle{ font-size:80px; line-height:56px ; } .tptpl .top-banner .text-container .long-copy h1{ margin:0 0 40px ; } .tptpl .top-banner .text-container .long-copy p.subtitle{ margin:0 ; } .tptpl .top-banner .call-to-action-container{ padding:0 15px 61px; position:absolute; bottom:0 ; } } @media screen and (min-width:1440px){ .tptpl body.home .top-banner .outer-container{ max-width:1440px ; } .tptpl body.home .top-banner .text-container-2{ padding-left:97px ; } .tptpl body.home .top-banner .image-container{ margin:145px auto 85px; padding-right:97px ; } } .tptpl .video-container{ display:table; width:100%; margin:0 0 50px; } .tptpl .slideshow-container h2, .tptpl .video-container h2{ padding:0 38px 20px; } .tptpl .videoWrapper{ position:relative; width:100%; height:0; background-color:#000; } .tptpl .videoWrapper43{ padding-top:75%; } .tptpl .videoWrapper169{ padding-top:56%; } .tptpl .videoIframe, .tptpl .videoPoster{ position:absolute; top:0; right:0; left:0; width:100%; height:100%; } .tptpl .videoIframe{ bottom:0; background-color:transparent; } .tptpl .videoPoster{ margin:0; padding:0; cursor:pointer; border:0; background-image:url("https://apply.superdry.com/app/tpl/asset/2bef2cb9cbd5a1805a1de1d38d001d53abc33afb15e590690d74fb7aa8007fe5"); background-position:50% 50%; background-size:cover; text-indent:-999em; overflow:hidden; opacity:1; transition:opacity .8s,height 0s; transition-delay:0s,0s; } .tptpl .videoPoster::before{ content:""; position:absolute; top:calc(50% - 30px); left:calc(50% - 25px); width:50px; height:60px; background:url("https://apply.superdry.com/app/tpl/asset/61b06bd0d6b35ca1b9a3fc0ba851248dd38a9d9a2ae1376a750257ef90dce274") center no-repeat; background-size:contain; } .tptpl .videoWrapperActive .videoPoster{ opacity:0; height:0; transition-delay:0s,.8s; } @media screen and (min-width:1024px){ .tptpl .slideshow-container h2, .tptpl .video-container h2{ padding:0 38px 20px; margin:0 auto 30px; max-width:860px ; } .tptpl .video-container{ margin:0 auto 100px; max-width:1024px ; } .tptpl .videoPoster::before{ top:calc(50% - 80px); left:calc(50% - 75px); width:150px; height:160px ; } } @media screen and (min-width:1120px){ .tptpl .video-container{ max-width:994px ; } } .tptpl .location-panel{ height:0; overflow:hidden; opacity:0; transition:opacity .25s ease-in-out 0s,height 0s linear .25s; } .tptpl .location-panel.unhide{ height:100%; overflow:auto; opacity:1; transition:opacity .25s ease-in-out .25s,height 0s linear 0s; } .tptpl .map-container{ margin:0 auto; max-width:1200px; } .tptpl .map-container-2{ position:relative; } .tptpl #map{ width:100%; height:600px; } .tptpl .map-container .reset-map{ width:100%; display:block; padding:36px 38px 25px; } .tptpl .map-container .overlay{ display:flex; position:absolute; top:0; left:0; width:100%; background:rgba(0,0,0,.15); z-index:1; height:0; overflow:hidden; opacity:0; transition:opacity .25s ease-in-out 0s,height 0s linear .25s; } .tptpl .map-container .overlay.unhide{ height:100%; opacity:1; transition:opacity .25s ease-in-out .25s,height 0s linear 0s; } .tptpl .map-container .overlay .overlay-panel{ display:inline-flex; flex-direction:column; align-self:center; background:#fff; max-height:600px; overflow-y:scroll; position:relative; padding:36px 38px 25px; width:100%; max-width:338px; transform:translateX(-100%); transition:transform .25s ease-in-out 0s; } .tptpl .map-container .overlay.unhide .overlay-panel{ transform:translateX(0); transition:transform .25s ease-in-out .25s; } .tptpl .map-container .overlay .overlay-panel address{ font-size:13px; line-height:20px; font-style:normal; margin:0 0 40px; } .tptpl .map-container .overlay .overlay-panel h3+address{ margin-top:-10px; } .tptpl .map-container .overlay .overlay-panel ul{ margin:0 0 10px; list-style:none; } .tptpl .map-container .overlay .overlay-panel .button{ margin:0 0 21px; line-height:1.2; } .tptpl .map-container .overlay .overlay-panel ul.extra-links{ margin:0; } .tptpl .map-container .overlay .overlay-panel ul.extra-links li{ font-size:13px; line-height:1.2; margin:0 0 25px; } .tptpl .map-container .close{ position:absolute; top:20px; right:20px; width:20px; height:20px; background:0 0; } .tptpl .map-container .close::after, .tptpl .map-container .close::before{ content:""; border-top:1px solid #000; top:10px; position:absolute; height:2px; width:28px; } .tptpl .map-container .close::before{ transform:rotate(-45deg); left:-4px; } .tptpl .map-container .close::after{ transform:rotate(45deg); left:-5px; } @media screen and (min-width:1024px){ .tptpl .map-container{ padding-top:12px ; } .tptpl .map-container .overlay .overlay-panel{ max-width:375px; padding:36px 15px 25px 22px; overflow-y:auto ; } .tptpl .map-container .reset-map{ padding-top:50px; padding-bottom:77px ; } } @media screen and (min-width:1280px){ .tptpl .map-container .reset-map{ padding-left:0; padding-right:0 ; } } .tptpl .slideshow-container{ width:100%; margin:0 0 50px; } .tptpl .featured-jobs-slider-container{ width:100%; margin:0; background:#f9f9f9; } .tptpl .featured-jobs-slider-container h2{ padding:40px 38px 21px; } .tptpl .employee-stories-slider-container{ width:100%; margin:0 0 25px; } .tptpl .employee-stories-slider-container h2{ padding:0 38px 20px; text-align:center; } .tptpl .employee-stories-slider-container h2.mbm{ margin:0 0 30px; } .tptpl .nbm{ margin-bottom:0 !important; } @media screen and (max-width:1023px){ .tptpl .nbm .employee-stories-slider-container{ margin-bottom:0 !important; } } @media screen and (min-width:1024px){ .tptpl .employee-stories-slider-container h2.mbm{ margin:0 0 80px ; } .tptpl .featured-jobs-slider-container h2{ padding:80px 38px 21px; margin:0 auto 30px; max-width:1070px ; } } @media screen and (max-width:1023px){ .tptpl .featured-jobs-slider-container.nbm-m{ margin-bottom:0 ; } } .tptpl .slider.slick-initialized{ visibility:visible !important; } .tptpl .slider{ width:auto; margin:0; } .tptpl .slider.employee-stories, .tptpl .slider.featured-jobs, .tptpl .slider.slideshow{ clear:both; } .tptpl .slick-slider{ box-sizing:border-box; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; touch-action:pan-y; } .tptpl .slick-list, .tptpl .slick-slider, .tptpl .slick-track{ position:relative; display:block; } .tptpl .slick-list{ overflow:hidden; margin:0; padding:0; } .tptpl .slick-list.dragging{ cursor:pointer; } .tptpl .slick-slider .slick-list, .tptpl .slick-slider .slick-track{ transform:translate3d(0,0,0); } .tptpl .slick-track{ top:0; left:0; margin-left:auto; margin-right:auto; } .tptpl .slick-track:after, .tptpl .slick-track:before{ display:table; content:""; } .tptpl .slick-track:after{ clear:both; } .tptpl .slick-loading .slick-track{ visibility:hidden; } .tptpl .slick-slide{ display:none; float:left; height:100%; min-height:1px; } .tptpl .job-button span, .tptpl .slick-initialized .slick-slide, .tptpl .slick-slide img{ display:block; } .tptpl .slick-slide.dragging img{} .tptpl .slick-loading .slick-slide{ visibility:hidden; } .tptpl .slick-vertical .slick-slide{ display:block; height:auto; border:1px solid transparent; } .tptpl .employee-stories.non-slick.more-text .text-container p.title br, .tptpl .key-signpost br, .tptpl .slick-arrow.slick-hidden{ display:none; } .tptpl .slick-loading .slick-list{ background:#fff center center no-repeat; } .tptpl .slick-next, .tptpl .slick-prev{ font-size:0; line-height:0; position:absolute; top:0; display:block; width:40px; height:73vw; padding:0; cursor:pointer; color:transparent; border:0; z-index:1; transition:transform .25s ease-in-out; } .tptpl .slick-next:focus, .tptpl .slick-next:hover, .tptpl .slick-prev:focus, .tptpl .slick-prev:hover{ color:transparent; background:0 0; } .tptpl .slick-prev:hover{ transform:translate(-10px); } .tptpl .slick-next:hover{ transform:translate(10px); } .tptpl .slick-next.slick-disabled:before, .tptpl .slick-prev.slick-disabled:before{ opacity:.25; } .tptpl .slick-prev{ left:16px; } .tptpl .slick-next{ right:16px; } .tptpl .slick-next:before, .tptpl .slick-prev:before{ content:""; display:block; width:40px; height:22px; background:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") 7px 0 no-repeat; background-size:32px; } .tptpl .slick-prev:before{ transform:rotate(180deg); } .tptpl .employee-stories .slick-next:before, .tptpl .employee-stories .slick-prev:before, .tptpl .slideshow .slick-next:before, .tptpl .slideshow .slick-prev:before{ background-image:url("https://apply.superdry.com/app/tpl/asset/e3a040bfb59d7daaedd9ef016ae0988433041e0a4783480b9969966332831a50"); } .tptpl .slick-next:before{ transform:rotate(0); } .tptpl .slick-dots{ position:absolute; left:calc(50% - 120px); top:calc(73vw - 42px); display:table; width:240px; padding:0; margin:0; list-style:none; text-align:center; } .tptpl .slick-dots li{ position:relative; display:table-cell; width:20px; height:20px; margin:0 5px; padding:0; cursor:pointer; } .tptpl .slick-dots li button{ font-size:0; line-height:0; display:block; width:100%; height:20px; padding:5px; cursor:pointer; color:transparent; border:0; } .tptpl .slick-dots li button::before{ position:absolute; top:10px; left:4px; right:4px; width:calc(100% - 8px); height:1px; content:""; background:rgba(0,0,0,.75); transition:all .2s ease-out; } .tptpl .slick-dots li.slick-active button:before{ background:#000; height:3px; top:9px; } .tptpl .slideshow .slick-dots li button::before{ background:rgba(255,255,255,.75); } .tptpl .slideshow .slick-dots li.slick-active button:before{ background:#fff; } .tptpl .slideshow .text-container{ padding:30px 38px 0; } .tptpl .slideshow .text-container p:last-of-type{ margin-bottom:0; } .tptpl .featured-jobs .slick-slide{ padding:0 38px; } .tptpl .featured-jobs .slick-slide h3, .tptpl .signpost h3{ margin:0 0 9px; } .tptpl .featured-jobs .slick-slide h3 span, .tptpl .signpost h3 span{ border-bottom:1px solid transparent; transition:border .25s ease-in-out; } .tptpl .featured-jobs .slick-slide p, .tptpl .signpost p{ margin:0 0 17px; } .tptpl .featured-jobs .slick-slide .job, .tptpl .featured-jobs .slick-slide .no-job{ display:block; margin:0 0 30px; } .tptpl .featured-jobs .slick-slide .job:hover h3 span, .tptpl .featured-jobs .slick-slide .job:hover span.cta{ border-bottom:1px solid #000; } .tptpl .featured-jobs .slick-slide .no-job p a{ border-bottom:1px solid #000; transition:border .25s ease-in-out; } .tptpl .featured-jobs .slick-slide .no-job p a:hover, .tptpl .post.large-post:hover .text-container span.channel{ border-color:transparent; } .tptpl .featured-jobs-slider-container .button-container{ padding:13px 38px 27px; } .tptpl .employee-stories .text-container{ padding:22px 38px 0; } .tptpl .employee-stories .text-container h3{ margin:0 0 11px; } .tptpl .employee-stories .text-container p{ padding-bottom:20px; margin:0; } .tptpl .employee-stories .text-container p.title{ font-family:martinregular,"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; font-size:40px; font-weight:400; line-height:28px; text-transform:uppercase; margin:0 0 31px; padding:0; } .tptpl .employee-stories.more-text .text-container h3{ margin:0 0 24px; } .tptpl .employee-stories.more-text .text-container p.title{ font-size:70px; line-height:48px; margin:13px 0 28px; padding:0; } .tptpl .employee-stories.non-slick.more-text .text-container ul{ list-style:none; font-size:24px; line-height:30px; letter-spacing:.03rem; margin:0 0 48px; } .tptpl .employee-stories.more-text .text-container .button{ margin:10px 0 25px; } .tptpl .employee-stories.more-text .text-container p:last-of-type{ padding-bottom:0; } .tptpl .load-more-container{ padding:5px 36px 28px; } @media screen and (min-width:1024px){ .tptpl .featured-jobs{ margin:0 auto ; } .tptpl .featured-jobs .slick-next, .tptpl .featured-jobs .slick-prev{ height:22px; top:calc(50% - 35px) ; } .tptpl .featured-jobs .slick-prev{ left:16px ; } .tptpl .featured-jobs .slick-next{ right:16px ; } .tptpl .featured-jobs .slick-slide>div{ margin:0 auto; max-width:1040px ; } .tptpl .featured-jobs .slick-slide .job, .tptpl .featured-jobs .slick-slide .no-job{ display:inline-block; width:49%; vertical-align:top; padding:0 50px; margin:2px 0 50px ; } .tptpl .featured-jobs .slick-slide .no-job{ width:100%; margin:11px 0 50px ; } .tptpl .featured-jobs-slider-container{ margin-bottom:0 ; } .tptpl .featured-jobs-slider-container .button-container{ padding:2px 38px 77px; margin:0 auto; max-width:1070px ; } .tptpl .featured-jobs-slider-container .button-container .button{ margin-right:12px ; } .tptpl .employee-stories-slider-container{ margin:0 0 65px ; } .tptpl .employee-stories .slick-next::before, .tptpl .employee-stories .slick-prev::before{ background-image:url("https://apply.superdry.com/app/tpl/asset/08a0dcb621c5e559af0a54366e314b53960e95555a8c6d1682e3a754fdd55456") ; } .tptpl .employee-stories .slick-slide>div, .tptpl .employee-stories.non-slick>div{ position:relative; margin:10px auto; max-width:1200px ; } .tptpl .employee-stories .image-container{ position:absolute; bottom:25px; top:0; width:100% ; } .tptpl .employee-stories .image-container img{ float:right; height:100% ; } .tptpl .employee-stories .slick-prev{ height:22px; left:85px; top:60px ; } .tptpl .employee-stories .slick-next{ height:22px; left:127px; top:61px ; } .tptpl .employee-stories .text-container{ position:relative; z-index:1; padding:114px 38px 50px 85px; width:700px ; } .tptpl .employee-stories .text-container h3{ margin:0 0 22px ; } .tptpl .employee-stories .text-container p.title{ font-size:70px; line-height:49px; min-height:212px ; } .tptpl .employee-stories.non-slick{ margin-top:90px ; } .tptpl .employee-stories.non-slick.ntm{ margin-top:0 ; } .tptpl .employee-stories.non-slick>div{ display:flex; margin:0 auto 100px ; } .tptpl .employee-stories.non-slick .image-container{ position:relative; display:flex; margin:auto; width:inherit; max-width:685px ; } .tptpl .employee-stories.non-slick .image-container img{ float:none; width:100% ; } .tptpl .employee-stories.non-slick .text-container{ padding:20px 38px 20px 20px; display:flex; flex-direction:column; justify-content:center; width:520px ; } .tptpl .employee-stories.non-slick .text-container h3{ margin-top:28px ; } .tptpl .employee-stories.non-slick .text-container p.title{ min-height:inherit; margin:0 0 40px; margin-left:-190px; max-width:calc(100% + 190px) ; } .tptpl .employee-stories .text-container p{ margin:0 70px 40px 0 ; } .tptpl .employee-stories.non-slick .text-container .button, .tptpl .employee-stories.non-slick .text-container h3{ margin-left:-190px; max-width:calc(100% + 190px) ; } .tptpl .employee-stories.non-slick.reverse>div, .tptpl .employee-stories.non-slick>div:nth-of-type(even){ flex-direction:row-reverse ; } .tptpl .employee-stories.non-slick.reverse>div:nth-of-type(even){ flex-direction:row ; } .tptpl .employee-stories.non-slick.reverse>div .text-container .button, .tptpl .employee-stories.non-slick.reverse>div .text-container h3, .tptpl .employee-stories.non-slick.reverse>div .text-container p.title, .tptpl .employee-stories.non-slick>div:nth-of-type(even) .text-container .button, .tptpl .employee-stories.non-slick>div:nth-of-type(even) .text-container h3, .tptpl .employee-stories.non-slick>div:nth-of-type(even) .text-container p.title{ margin-left:80px; margin-right:-190px ; } .tptpl .employee-stories.non-slick.more-text .text-container{ padding-top:0; padding-bottom:0; padding-left:35px ; } .tptpl .employee-stories.non-slick.more-text .text-container p.title, .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container p.title{ margin-bottom:48px ; } .tptpl .employee-stories.non-slick.more-text .text-container .button, .tptpl .employee-stories.non-slick.more-text .text-container h3{ margin-left:0; margin-right:0; max-width:100% ; } .tptpl .employee-stories.non-slick.more-text .text-container p.title{ margin-left:0; max-width:100%; margin-right:35px ; } .tptpl .employee-stories.non-slick.more-text .text-container p.title br{ display:block ; } .tptpl .employee-stories.non-slick.more-text .text-container p{ max-width:365px; margin:0 ; } .tptpl .employee-stories.non-slick.more-text .text-container ul{ margin:0 ; } .tptpl .employee-stories.non-slick.more-text .text-container .button{ margin-bottom:50px ; } .tptpl .employee-stories.non-slick.more-text.reverse>div .text-container .button, .tptpl .employee-stories.non-slick.more-text.reverse>div .text-container h3, .tptpl .employee-stories.non-slick.more-text.reverse>div .text-container p, .tptpl .employee-stories.non-slick.more-text.reverse>div .text-container p.title, .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container .button, .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container h3, .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container p, .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container p.title{ margin-left:0 ; } .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container p{ margin-top:0; margin-right:0; margin-bottom:0 ; } .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container p.title{ margin-right:30px ; } .tptpl .employee-stories.non-slick.more-text>div:nth-of-type(even) .text-container .button{ margin-top:10px; margin-right:0; margin-bottom:20px ; } @media screen and (min-width:1120px){ .tptpl .employee-stories.non-slick.more-text div:nth-of-type(even) .text-container, .tptpl .employee-stories.non-slick.more-text.reverse .text-container{ padding-left:105px ; } } .tptpl .load-more-container{ padding:5px 38px 75px; margin:0 auto; max-width:1076px ; } .tptpl .load-more-container.wide{ max-width:1274px ; } } @media screen and (min-width:1120px){ .tptpl .slideshow-container{ width:100%; margin:0 0 100px ; } .tptpl .slideshow .slick-slide>div{ margin:0 18px 0 19px ; } .tptpl .slideshow .slick-slide img{ max-width:inherit; width:100% ; } .tptpl .slideshow .text-container{ padding:30px 0 0 ; } .tptpl .slideshow .slick-next, .tptpl .slideshow .slick-prev{ height:calc(75vw - 544px) ; } .tptpl .slideshow .slick-prev{ left:100px ; } .tptpl .slideshow .slick-next{ right:100px ; } .tptpl .slideshow .text-container{ opacity:0; transition:opacity .25s ease-in-out ; } .tptpl .slideshow .slick-current .text-container{ opacity:1; transition:opacity .25s ease-in-out .75s ; } .tptpl .slideshow .slick-dots{ top:calc(73vw - 565px) ; } .tptpl .featured-jobs .slick-slide .job{ padding:0 15px 0 23px ; } .tptpl .featured-jobs .slick-slide .no-job{ padding:9px 15px 0 23px ; } .tptpl .featured-jobs .slick-slide .no-job p{ max-width:640px ; } } @media screen and (min-width:1200px){ .tptpl .employee-stories .text-container{ position:relative; z-index:1; padding:114px 38px 50px 105px; width:700px ; } .tptpl .employee-stories .slick-prev{ height:22px; left:calc(50% - 498px); top:60px ; } .tptpl .employee-stories .slick-next{ height:22px; left:calc(50% - 456px); top:61px ; } } @media screen and (min-width:1360px){ .tptpl .featured-jobs .slick-prev{ left:100px ; } .tptpl .featured-jobs .slick-next{ right:100px ; } } @media screen and (min-width:1800px){ .tptpl .slideshow .slick-next, .tptpl .slideshow .slick-prev{ height:calc(74vw - 997px) ; } .tptpl .slideshow .slick-dots{ top:calc(73vw - 990px) ; } } .tptpl .slider-dropdowns{ display:table; width:100%; padding:0 32px; margin:-47px 0 6px; } .tptpl .slider-dropdowns .select-selected{ margin:11px 7px; background:#f9f9f9; } .tptpl .slider-dropdowns .select-selected::after{ right:10px; } .tptpl .slider-dropdowns .select-items{ margin:-11px 7px 0; } @media screen and (min-width:1024px){ .tptpl .slider-dropdown-container{ position:relative; max-width:1070px; margin:0 auto ; } .tptpl .slider-dropdowns{ margin-top:0; max-width:440px; position:absolute; top:53px; right:0 ; } .tptpl .slider-dropdowns .select-items, .tptpl .slider-dropdowns .select-selected{ margin-left:32px ; } } .tptpl .wrapper{ padding:50px 0 0; margin:0 0 50px; } .tptpl .signpost-container.grey, .tptpl .wrapper.grey{ background-color:#f9f9f9; } @media screen and (min-width:1024px){ .tptpl .wrapper{ padding:100px 0 1px; margin:0 0 100px ; } } .tptpl .signpost-container{ width:100%; margin:0; padding:20px 20px 10px; background:#fff; } .tptpl .signpost-container.nbm{ margin-bottom:0; } .tptpl .signpost-container h2{ padding:22px 38px 21px; text-align:center; } .tptpl .signpost{ text-align:left; } .tptpl .brand-box .image-container img, .tptpl .key-signpost .image-container img, .tptpl .mission-box img, .tptpl .post img, .tptpl .signpost img{ width:100%; } .tptpl .signpost .text-container{ padding:36px 21px 40px; } .tptpl .brand-box:hover .text-container span.title span, .tptpl .key-signpost:hover .text-container span.title span, .tptpl .post:hover .text-container span.channel, .tptpl .post:hover .text-container span.fake-link, .tptpl .post:hover .text-container span.fake-tag, .tptpl .post:hover .text-container span.title span, .tptpl .signpost:hover h3 span{ border-color:#000; } @media screen and (min-width:1024px){ .tptpl .signpost-container{ margin:0; padding:60px 20px; text-align:center ; } .tptpl .signpost-container h2{ padding:22px 38px 31px ; } .tptpl .signpost{ display:inline-block; width:33%; padding:0 17px; max-width:409px; vertical-align:top ; } .tptpl .signpost:nth-of-type(3n/**/+1){ clear:both ; } } .tptpl .key-signpost-container{ display:table; width:100%; margin:0 auto; padding:0; } .tptpl .key-signpost{ width:100%; margin:0 0 50px; padding:0; overflow:hidden; } .tptpl .key-signpost, .tptpl .key-signpost .image-container{ display:block; position:relative; } .tptpl .key-signpost .image-container img.large{ display:none; } .tptpl .key-signpost .text-container{ position:absolute; display:block; background:#fff; bottom:0; width:calc(100% - 37px); padding:36px 25px 0 37px; } .tptpl .wrapper.grey .key-signpost .text-container{ background:#f9f9f9; } .tptpl .key-signpost .text-container span.title{ display:block; font-size:24px; line-height:30px; letter-spacing:.03rem; margin:0 0 7px; padding:0 5px 0 0; } .tptpl .brand-box .text-container span.title span, .tptpl .key-signpost .text-container span.title span{ display:inline; border-bottom:1px solid transparent; transition:border .25s ease-in-out; } .tptpl .key-signpost .text-container span.excerpt{ display:block; font-size:13px; line-height:20px; font-weight:300; letter-spacing:.03rem; margin:0 0 30px; } .tptpl .key-signpost .button{ margin:0 0 2px; } .tptpl .brand-box:hover .button:after, .tptpl .key-signpost:hover .button:after{ transform:translateX(10px); } .tptpl .wrapper .key-signpost-container .col.smaller{ padding:0 20px; } @media screen and (min-width:1024px){ .tptpl .key-signpost-container{ max-width:1232px; margin-bottom:50px ; } .tptpl .key-signpost-container .col{ float:left ; } .tptpl .key-signpost-container .col.smaller{ width:41.5% ; } .tptpl .wrapper .key-signpost-container .col.smaller{ padding:0 ; } .tptpl .key-signpost-container .col.larger{ width:58.5% ; } .tptpl .key-signpost{ padding:0 18px ; } .tptpl .key-signpost .image-container img.small{ display:none ; } .tptpl .key-signpost .image-container img.large, .tptpl .key-signpost br{ display:block ; } .tptpl .key-signpost .text-container{ width:calc(100% - 66px); min-height:220px; padding:37px 30px 0 18px ; } .tptpl .key-signpost .text-container.nmh{ min-height:1px ; } .tptpl .key-signpost .text-container span.title{ margin-bottom:9px ; } .tptpl .key-signpost .text-container span.excerpt{ margin:0 0 21px ; } } @media screen and (min-width:1120px){ .tptpl .key-signpost .text-container{ width:375px ; } } .tptpl .brand-box-container{ display:table; width:100%; margin:0 auto; padding:0; } .tptpl .brand-box{ width:100%; margin:0; padding:0; overflow:hidden; } .tptpl .brand-box .image-container img.large, .tptpl .brand-box br, .tptpl .mission-box img.large{ display:none; } .tptpl .brand-box, .tptpl .brand-box .image-container{ display:block; position:relative; } .tptpl .brand-box .text-container{ display:block; background:#fff; width:100%; padding:31px 37px 30px; } .tptpl .brand-box .text-container span.title{ display:block; font-size:30px; line-height:38px; letter-spacing:.03rem; margin:0 0 20px; padding:0 5px 0 0; } .tptpl .brand-box .text-container span.excerpt{ display:block; font-size:13px; line-height:20px; font-weight:300; letter-spacing:.03rem; margin:0 0 20px; } .tptpl .brand-box .button{ margin:0 0 2px; } .tptpl .logo-boxes{ float:left; width:100%; padding:0 30px 35px; } .tptpl .logo-boxes .logo-box{ position:relative; float:left; width:calc(50% - 16px); margin:0 8px 16px; } .tptpl .mission-box .text-container{ position:relative; display:block; background:#fff; width:calc(100% - 37px); margin:-50px 0 0; padding:36px 25px 28px 37px; } .tptpl .mission-box .text-container p{ color:#3d4009; font-family:martinregular,"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; font-size:40px; line-height:28px; font-weight:400; text-transform:uppercase; margin-top:21px; } @media screen and (min-width:1024px){ .tptpl .brand-box-container{ max-width:1232px; margin-top:100px ; } .tptpl .brand-box-container .col{ float:left; width:50% ; } .tptpl .brand-box{ padding:0 18px ; } .tptpl .brand-box .image-container img.small, .tptpl .mission-box img.small{ display:none ; } .tptpl .brand-box .image-container img.large, .tptpl .brand-box br, .tptpl .mission-box img.large{ display:block ; } .tptpl .brand-box .text-container{ position:absolute; display:block; bottom:0; width:calc(100% - 66px); min-height:220px; padding:37px 30px 0 18px ; } .tptpl .brand-box .text-container span.excerpt{ margin:0 0 21px ; } .tptpl .logo-boxes{ padding:0 ; } .tptpl .logo-boxes .logo-box{ width:calc(50% - 32px); margin:0 16px 21px ; } .tptpl .mission-box{ position:relative; margin:0 auto 100px; max-width:1280px ; } .tptpl .mission-box .image-container{ padding:0 40px 0 140px ; } .tptpl .mission-box .text-container{ position:absolute; bottom:-30px; background:#fff; width:calc(100% - 100px); padding-right:50px; margin:0 ; } .tptpl .mission-box .text-container p{ font-size:70px; line-height:49px; margin-bottom:0 ; } } @media screen and (min-width:1120px){ .tptpl .brand-box .text-container{ width:375px ; } .tptpl .mission-box .text-container{ max-width:620px ; } } .tptpl .logo-box-type-2-container{ font-size:0; text-align:center; padding:0 30px 25px; } .tptpl .logo-box-type-2-container .row{ margin-bottom:42px; } .tptpl .logo-box-type-2-container .row:last-of-type{ margin-bottom:15px; } .tptpl .logo-box-type-2{ display:inline-block; width:50%; padding:7px; } .tptpl .logo-box-type-2-container h2{ text-align:center; margin:0 0 34px; } @media screen and (min-width:1024px){ .tptpl .logo-box-type-2-container{ padding:0 30px 25px; margin:0 auto; max-width:1294px ; } .tptpl .logo-box-type-2-container .row{ margin-bottom:80px ; } .tptpl .logo-box-type-2-container .row:last-of-type{ margin-bottom:55px ; } .tptpl .logo-box-type-2{ width:25%; padding:18px ; } } .tptpl .story-filters{ display:none; } @media screen and (min-width:1024px){ .tptpl .story-filters-container{ font-size:0; margin-bottom:30px ; } .tptpl .story-filters-container.faqs{ margin-bottom:90px ; } .tptpl .main-content .story-filters-container.faqs{ margin:60px 0 30px ; } .tptpl .story-filters{ display:block; margin:-10px auto 40px; max-width:1360px; text-align:center ; } .tptpl .main-content .story-filters{ margin:0 -120px ; } .tptpl .story-filters a{ position:relative; font-size:13px; line-height:1; letter-spacing:.03rem; text-transform:uppercase; font-weight:500; background:#f0f0f0; border-radius:25px; padding:11px 19px; display:inline-block; margin:0 4px 10px; transition:all .25s ease-in-out ; } .tptpl .story-filters a.active, .tptpl .story-filters a:hover{ color:#fff; background:#000 ; } .tptpl .story-filters a span{ display:none ; } } @media screen and (min-width:1200px){ .tptpl .main-content .story-filters{ margin-left:-200px; margin-right:-200px ; } } @media screen and (min-width:1360px){ .tptpl .main-content .story-filters{ margin-left:-290px; margin-right:-290px ; } } .tptpl .button-grid-container{ display:table; width:100%; padding:0 38px; } .tptpl .button-grid{ margin:30px 0 40px; display:flex; width:100%; flex-wrap:wrap; } .tptpl .button-grid .button.large{ max-width:inherit; margin:10px 0 !important; } @media screen and (min-width:1024px){ .tptpl .button-grid-container{ padding:0 38px 50px ; } .tptpl .button-grid{ max-width:1240px; margin:40px auto ; } .tptpl .button-grid .button.large{ width:calc(33.333% - 38px); float:left; margin:10px 19px !important; } } .tptpl .community-posts-container{ display:table; width:100%; margin:0 auto; font-size:0; } .tptpl .community-posts-container h2{ padding:0 38px 21px; text-align:center; } .tptpl .post{ position:relative; width:100%; margin:0 0 40px; padding:0 38px; overflow:hidden; vertical-align:top; } .tptpl .community-posts-container .post{ padding:0 18px; } .tptpl .post.large-post{ padding:0; } .tptpl .post .image-container{ display:block; position:relative; } .tptpl .post.video .image-container:after{ content:""; position:absolute; top:calc(50% - 30px); left:calc(50% - 25px); width:50px; height:60px; background:url("https://apply.superdry.com/app/tpl/asset/61b06bd0d6b35ca1b9a3fc0ba851248dd38a9d9a2ae1376a750257ef90dce274") center no-repeat; background-size:contain; } .tptpl .post .text-container{ display:block; background:#fff; padding:37px 18px 0; } .tptpl .post.large-post .text-container{ position:absolute; bottom:0; width:75%; padding:32px 25px 0 38px; } .tptpl .post, .tptpl .post .text-container span{ display:inline-block; } .tptpl .post .text-container span.cta{ margin:17px 0 0; } .tptpl .post .text-container span.channel{ font-size:13px; line-height:1; text-transform:uppercase; font-weight:500; letter-spacing:.03rem; margin:0 0 13px; border-bottom:1px solid transparent; transition:border .25s ease-in-out; } .tptpl .post .text-container span.fake-link, .tptpl .post .text-container span.fake-tag, .tptpl .post .text-container span.title span{ display:inline; border-bottom:1px solid transparent; transition:border .25s ease-in-out; } .tptpl .post .text-container span.fake-link{ word-break:break-all; } .tptpl .post .text-container span.title{ display:block; font-size:24px; line-height:30px; margin:0 0 9px; } .tptpl .post .text-container span.excerpt{ display:block; font-size:13px; line-height:20px; font-weight:300; letter-spacing:.03rem; margin:0; } @media screen and (min-width:768px){ .tptpl .post img.large{ display:block ; } } @media screen and (min-width:1024px){ .tptpl .community-posts-container{ max-width:1232px ; } .tptpl .community-posts-container h2{ padding:0 38px 31px ; } .tptpl .community-posts-container .story-filters-container{ margin-bottom:40px ; } .tptpl .post{ width:25%; margin:0 0 50px; padding:0 18px ; } .tptpl .post.large-post{ width:50%; margin:0 0 44px; padding:0 18px ; } .tptpl .community-posts-container .col, .tptpl .community-posts-container .col .col{ float:left; width:50% ; } .tptpl .community-posts-container .col.larger, .tptpl .community-posts-container .col.smaller+.col{ float:left; width:58.5% ; } .tptpl .community-posts-container .col.larger+.col, .tptpl .community-posts-container .col.smaller{ float:left; width:41.5% ; } .tptpl .post.large-post .text-container{ width:375px; padding:38px 35px 0 20px ; } .tptpl .post .text-container span.cta{ margin:23px 0 0 ; } } .tptpl .job-search-filters{ display:none; } .tptpl .job-button-container{ padding:0 20px; } .tptpl .job-button, .tptpl .job-button svg{ transition:all .25s ease-in-out; } .tptpl .job-button{ display:block; position:relative; background:#f9f9f9; padding:22px 65px 18px 18px; margin:0 0 20px; } .tptpl .job-button:hover{ color:#fff; background:#000; } .tptpl .job-button span.title{ font-size:24px; line-height:30px; letter-spacing:.03rem; margin:0 0 6px; } .tptpl .job-button span.details, .tptpl .job-button span.reference{ font-size:13px; line-height:19px; font-weight:300; letter-spacing:.03rem; } .tptpl .job-button span.cta{ margin-top:22px; } .tptpl .job-button:hover span.cta{ border-color:transparent; } .tptpl .job-button svg{ position:absolute; height:22px; top:calc(50% - 10px); right:20px; } .tptpl .job-button:hover svg{ transform:translateX(10px); } .tptpl .job-button-container .load-more-container{ padding:25px 0; } @media screen and (min-width:1024px){ .tptpl .job-search-container{ margin:-45px auto 0; max-width:1000px ; } .tptpl .job-search-filters{ position:relative; display:block; float:left; width:310px; padding:0 0 0 7px ; } .tptpl #jobSearchIndexFiltersDesktop{ display:block; position:absolute; top:-120px ; } .tptpl .job-search-filters form{ padding:15px 35px 0 0 ; } .tptpl .job-search-filters .custom-select, .tptpl .job-search-filters .custom-select-no-dim{ margin:0 0 14px ; } .tptpl .job-search-filters .select-selected{ margin:0 ; } .tptpl .job-search-filters .select-selected::after{ top:23px; right:0 ; } .tptpl .job-search-filters input[type=search]{ height:52px; margin:0 0 45px ; } .tptpl .job-search-filters .select-items{ background-color:#f9f9f9 ; } .tptpl .job-button-container{ padding:0; float:right; width:684px ; } .tptpl .job-button{ padding:32px 35px ; } .tptpl .job-button span.content{ width:100%; max-width:500px ; } .tptpl .job-button span.title{ margin:0 0 9px ; } .tptpl .job-button span.details, .tptpl .job-button span.reference{ line-height:20px ; } .tptpl .job-button span.cta{ margin-top:23px ; } .tptpl .job-button svg{ top:calc(50% - 11px); right:40px ; } .tptpl .job-button-container .load-more-container{ padding:35px 0 75px ; } } .tptpl .main-content.login label{ font-size:0; line-height:0; margin:0; padding:0; } .tptpl .main-content.login h1{ margin:0 0 10px; } .tptpl .main-content.login legend{ margin:0 0 20px; font-family:martinregular,"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-transform:uppercase; font-size:45px; line-height:37px; color:#d37b2e; } .tptpl .grecaptcha-badge{ z-index:100000; } .tptpl .main-content.login .message{ color:#3d4009; line-height:1.3; margin:20px 0 18px; } .tptpl .main-content.login .message.error{ color:#962a00; } .tptpl .short .top-banner{ margin-bottom:0; } .tptpl .short .main-content{ padding-bottom:0; } @media screen and (min-width:1024px){ .tptpl .short .main-content{ min-height:calc(100vh - 900px) ; } } @media screen and (min-width:1440px){ .tptpl .short .main-content{ min-height:calc(100vh - 867px) ; } } @media screen and (max-width:1023px){ .tptpl :lang(de) .employee-stories.more-text .text-container p.title, .tptpl :lang(de) h1{ line-height:70px; overflow-wrap:break-word; word-wrap:break-word; hyphens:auto ; } .tptpl :lang(de) .top-banner .text-container p.subtitle{ line-height:32px ; } .tptpl :lang(de) .employee-stories.more-text .text-container p.title{ line-height:56px ; } } .tptpl :lang(de) h2{ overflow-wrap:break-word; word-wrap:break-word; hyphens:auto; } .tptpl :lang(de) .mission-box .text-container p{ line-height:31px; } @media screen and (min-width:1024px){ .tptpl :lang(de) .top-banner .text-container h1{ line-height:116px ; } .tptpl :lang(de) h1.smallerBannerTitle{ line-height:90px !important; } .tptpl :lang(de) body.home .top-banner .text-container h1{ font-size:184px ; } .tptpl :lang(de) .employee-stories.more-text .text-container p.title{ font-size:64px; line-height:56px; overflow-wrap:normal; word-wrap:normal; hyphens:none ; } .tptpl :lang(de) .mission-box .text-container p{ line-height:54px ; } .tptpl :lang(de) .desktop-job-search-bar .title{ padding-top:24px ; } } @media screen and (max-width:1023px){ .tptpl :lang(fr) h1{ font-size:65px ; } .tptpl :lang(fr) .top-banner .text-container p.subtitle{ line-height:32px ; } .tptpl :lang(fr) .employee-stories.more-text .text-container p.title, .tptpl :lang(fr) h1{ line-height:56px ; } } .tptpl :lang(fr) .mission-box .text-container p{ line-height:31px; } @media screen and (min-width:1024px){ .tptpl :lang(fr) .top-banner .text-container h1{ line-height:116px; max-width:950px ; } .tptpl :lang(fr) h1.smallerBannerTitle{ line-height:90px !important; } .tptpl :lang(fr) body.home .top-banner .text-container h1{ font-size:184px; max-width:680px ; } .tptpl :lang(fr) .employee-stories.more-text .text-container p.title{ font-size:64px; line-height:50px ; } .tptpl :lang(fr) .mission-box .text-container p{ line-height:54px ; } .tptpl :lang(fr) footer ul{ font-size:11px ; } .tptpl :lang(fr) .desktop-job-search-bar .title{ padding-top:25px ; } } @media screen and (max-width:1023px){ .tptpl :lang(it) h1{ line-height:61px ; } } @media screen and (min-width:1024px){ .tptpl :lang(it) .top-banner .text-container h1{ line-height:115px ; } .tptpl :lang(it) h1.smallerBannerTitle{ line-height:90px !important; } .tptpl :lang(it) .desktop-job-search-bar .title{ padding-top:25px ; } } @media screen and (max-width:1023px){ .tptpl :lang(es) h1{ line-height:62px ; } } @media screen and (min-width:1024px){ .tptpl :lang(es) .top-banner .text-container h1{ line-height:115px ; } .tptpl :lang(es) h1.smallerBannerTitle{ line-height:90px !important; } .tptpl :lang(es) .desktop-job-search-bar .title{ padding:25px 10px 36px 20px ; } } .tptpl :lang(es) .desktop-header-country-menu-button .menu-label{ max-width:150px; } @media screen and (min-width:1120px){ .tptpl :lang(es) .header .mega-dropdown .mega-dropdown-heading{ font-size:12px; padding-left:10px; padding-right:10px ; } .tptpl :lang(es) .desktop-header-country-menu-button{ margin-left:25px ; } } @media screen and (min-width:1280px){ .tptpl :lang(es) .header .mega-dropdown{ padding-right:60px ; } } @media screen and (min-width:1440px){ .tptpl :lang(es) .header .mega-dropdown .mega-dropdown-heading{ font-size:13px; padding-left:15px; padding-right:15px ; } .tptpl :lang(es) .desktop-header-country-menu-button{ margin-left:40px ; } } .tptpl :lang(nl) .mobile-header-country-menu-button a{ width:96px; } @media screen and (min-width:1120px){ .tptpl :lang(nl) .header .mega-dropdown .mega-dropdown-heading{ font-size:12px; padding-left:10px; padding-right:10px ; } .tptpl :lang(nl) .desktop-header-country-menu-button{ margin-left:25px ; } } @media screen and (min-width:1280px){ .tptpl :lang(nl) .header .mega-dropdown{ padding-right:60px ; } } @media screen and (min-width:1400px){ .tptpl :lang(nl) .header .mega-dropdown .mega-dropdown-heading{ font-size:13px; padding-left:15px; padding-right:15px ; } .tptpl :lang(nl) .desktop-header-country-menu-button{ margin-left:40px ; } } .tptpl { display: block !important; }