.popular-head-to-head .image-container{display:block;width:100%;position:relative;overflow:hidden;border-top-left-radius:6px;border-top-right-radius:6px}.popular-head-to-head .image-container .image-l{display:inline-block;box-sizing:border-box;margin:0;padding:0;height:0;padding-top:34%;position:relative;width:60%;margin-left:-10%;transform:skewX(-11deg);overflow:hidden;position:relative;border-right:2px solid #fff}.popular-head-to-head .image-container .image-r{display:inline-block;width:50%;box-sizing:border-box;margin:0;padding:0;height:0;padding-top:34%;position:relative;width:60%;margin-right:-10.1%;float:right;border-left:2px solid #fff;transform:skewX(-11deg);overflow:hidden;position:relative}.popular-head-to-head .image-container:before{display:block;height:70px;width:70px;content:"";background:url(/resources/images/icons/vs-logo-alt.svg?v=2) center center no-repeat var(--brand-colour-accent);background-size:30px auto;position:absolute;top:50%;left:50%;border-radius:50%;text-align:center;margin-top:-40px;margin-left:-40px;opacity:1;transition:opacity 75ms linear;z-index:10;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0);-webkit-perspective:1000;box-shadow:0 3px 16px 0 rgb(0 0 0 / .75);-webkit-font-smoothing:subpixel-antialiased;transition:color 200ms ease-out 250ms,background 300ms ease-out 250ms,transform 500ms cubic-bezier(.68,-.55,.265,1.55)}.popular-head-to-head .image-container:after{display:block;height:70px;width:70px;content:"";background:url(/resources/images/icons/vs-logo.svg) center center no-repeat #fff;background-size:30px auto;position:absolute;top:50%;left:50%;border-radius:50%;text-align:center;margin-top:-40px;margin-left:-40px;opacity:1;transition:opacity 75ms linear;z-index:10;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0);-webkit-perspective:1000;-webkit-font-smoothing:subpixel-antialiased;transition:color 200ms ease-out 250ms,background 300ms ease-out 250ms,transform 500ms cubic-bezier(.68,-.55,.265,1.55),opacity 500ms ease-out}.popular-head-to-head .image-container:hover:before{transform:scale(1.1)}.popular-head-to-head .image-container:hover:after{transform:scale(1.1);opacity:0}.popular-head-to-head .image-container:hover{border-color:var(--brand-colour-accent)}.popular-head-to-head .image-l img{transform:skew(11deg) scale(1);transform-origin:top;left:11%;position:absolute}.popular-head-to-head .image-r img{transform:skew(11deg);left:-17%;position:absolute}.popular-head-to-head .details a span.verses{color:var(--brand-colour)}.popular-head-to-head .details a:hover{color:var(--brand-colour)}.head-to-head-intro ul{width:100%}.head-to-head-intro ul li{width:100%;margin-bottom:var(--margin-4);padding:3px 0 3px 31px;background:url(/resources/images/bulletpoint-tick-circle.svg) 0 50% no-repeat;background-size:20px}.popular-head-to-head .details a .h-bold-r{color:var(--brand-colour)}.popular-head-to-head .details a:hover .h-bold-r{color:var(--link-hover)}@media only screen and (min-width:641px){.head-to-head-intro ul li{padding:5px 0 5px 53px;background-size:auto}.popular-head-to-head .image-container:hover:before{transform:scale(1.3)}.popular-head-to-head .image-container:hover:after{transform:scale(1.3);opacity:0}}@media only screen and (min-width:641px) and (max-width:900px){.head-to-head-intro ul li{margin-bottom:15px;padding:5px 0 5px 40px;background:url(/resources/images/bulletpoint-tick-circle.svg) 0 50% no-repeat;background-size:24px}}@media only screen and (min-width:901px) and (max-width:1280px){.head-to-head-intro ul li{padding:5px 0 5px 46px;background-size:26px}}