@font-face{font-family:'SF';src:url('/font/SF-Pro-Display-Semibold.otf');}
html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:Montserrat,Avenir,"Avenir Next",Trebuchet,Verdana,sans-serif;font-size:14px;font-style:normal;font-weight:400;min-height:100%;-webkit-tap-highlight-color:transparent}
body{background-color:#f2f2f2!important;color:#262b3a;line-height:1.6rem;margin:0;padding:0;-moz-osx-font-smoothing:grayscale}
.btn{background-image:none;border-radius:30px;border-style:solid;border-width:1px;cursor:pointer;display:inline-block;font-family:Montserrat,Avenir,"Avenir Next",Trebuchet,Verdana,sans-serif;font-size:1rem;font-weight:700;line-height:1.6rem;margin-bottom:0;padding:.65rem 2.2rem .55rem;text-align:center;text-decoration:none;-webkit-transition:background-color .2s ease-out,background .2s ease-out,color .2s ease-out,border .2s ease-out;transition:background-color .2s ease-out,background .2s ease-out,color .2s ease-out,border .2s ease-out}
.btn:focus,.btn:hover{outline:0;text-decoration:none}
.btn:active{outline:0;background-image:none}
.btn.disabled,.btn[disabled],.btn[readonly],fieldset[disabled] .btn{cursor:not-allowed!important;opacity:1;pointer-events:none}
a.btn.disabled,fieldset[disabled] a.btn{pointer-events:none}
.btn--sm{font-size:.618rem;padding:.1rem .6rem 0}
.btn--default{background-color:#294ace;border-color:#294ace;color:#fff}
.btn--default:focus,.btn--default:hover{background-color:#213ba3;border-color:#213ba3}
.btn--default:active{background-color:#182b79;border-color:#182b79}
.btn--secondary,.btn--secondary:visited{background-color:#69f0ae;border-color:#69f0ae;color:#262b3a}
.btn--secondary:focus,.btn--secondary:hover,.btn--secondary:visited:focus,.btn--secondary:visited:hover{background-color:#3beb95;border-color:#3beb95}
.btn--secondary:active,.btn--secondary:visited:active{background-color:#16dd7c;border-color:#16dd7c}
.container--lg{margin-left:auto;margin-right:auto;max-width:1600px;padding:0 30px;position:relative}
.container{margin-left:auto;margin-right:auto;max-width:900px;width:90%}
header .container--lg{display:flex;justify-content:space-between}
h1,h2,h3,h4,h5,h6{font-family:'SF',"Source Serif Pro",Georgia,Times,serif;font-weight:700;line-height:1;margin-top:0;margin-bottom:.8rem;text-rendering:optimizeLegibility;}
.align--center{text-align:center}
.logo{width:100%}
p{font-size:1rem}
.border--bottom{border-bottom-color:#abb2c9;border-bottom-style:solid;border-bottom-width:1px}
.bg--dark-gray{background-color:#262b3a;padding:40px}
.cta-image{max-height:100px}
.text--white{color:#fff}
.bold{font-weight:700}
.form-control{background-image:none;border:1px solid transparent;border-radius:7px;color:#262b3a;display:block;font-family:Montserrat,Avenir,"Avenir Next",Trebuchet,Verdana,sans-serif;font-size:1rem;line-height:1.6rem;max-width:100%;padding:.65rem .8rem .55rem;width:100%;outline:none;box-sizing:border-box}
.inline-block{display:inline-block}
header{background:#fff;padding:25px 0;border-bottom:1px solid #c1c7da;margin-bottom:40px}
.container-logo{width:320px;display:inline-block}
h1{padding:25px;font-size:43px}
.games-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:auto;grid-row-gap:20px;grid-column-gap:20px;padding:20px 0 50px}
.game-square{background:#fff;padding:15px;display:flex;flex-direction:column}
.game-square img{max-width:100%;}
.game-square h3{font-size:21px;padding:15px 0;text-align:left;line-height:19px}
.price{color:#ce1616;display:flex;font-size:17px}
.price .strikethrough{color:#929191;text-decoration:line-through;padding-right:7px}
.game-square h3{flex:1}
.large-text{font-size:21px}
footer{padding:50px 0}
.about{display:flex;flex-wrap:wrap;margin: 40px 0 20px;}
.about-block{display:flex;align-items:center;flex:1;padding-right:65px}
.about-block img{width:90px}
.about-block p{text-align:left;padding-left:30px;font-size:22px}
.container-nav{display:inline-block}
.nav{display:flex;border-left:1px solid #c1c7da}
a.nav-item{padding:70px 50px;text-decoration:none;color:#000;font-size:17px;border-right:1px solid #c1c7da}
a.nav-item:hover{cursor:pointer;background:#f3f3f3}
.container-nav{margin:-25px 0}
.container-basket{margin:-25px 0;padding:0 25px;height:162px;display:flex;flex-direction:column;top:0;justify-content:center;border-right:1px solid #c1c7da;border-left:1px solid #c1c7da}
table#basket-table{padding:0 25px;border-spacing:0;width: 100% !important;}
table#basket-table th,table#basket-table tr td{border:1px solid #c1c7da;padding:10px;text-align:left;font-size:17px}
table#basket-table th{background:#272b3a;color:#fff}
table#basket-table tr td h3{margin:0}
.checkout-form{padding:25px;width:700px;box-sizing:border-box}
.checkout-form label{font-size:16px;margin:0 0 10px;display:block}
.checkout-form .form-row{margin-bottom:35px}
.StripeElement{background:#fff;flex:1;margin-right:10px}
.card-container{display:flex}
.StripeElement:first-of-type{flex:2}
div#card-errors{color:#eb1c26;padding:15px 0 0}
.summary {font-weight: normal;font-size: 14px;font-family: Montserrat,Avenir,"Avenir Next",Trebuchet,Verdana,sans-serif;}
blockquote {border-left: 3px solid #343458;margin: 0 15px;padding: 20px;}
blockquote small {display: block;font-size: 13px;font-style: italic;color: grey;margin-bottom: -6px;}
p.order-welcome{margin:0 25px;font-size:16px}
.order{background:#fff;margin:25px 25px 40px;width:600px;border:2px solid #272b3a;padding:25px}
.order-header{display:flex;justify-content:space-between;min-height: 45px;}
.order-number{font-size:29px}
.order-date{position:absolute;margin-top:-18px;color:grey;font-style:italic}
.order #basket-table{padding:20px 0 0}
.order #basket-table *{font-size:16px;line-height:14px}
.container-basket .large-message{display:none;}
.container-basket.large-basket .large-message{display:block;}
.container-basket.large-basket .price{display:none;}
.container-basket.large-basket .small-message{display:none;}
.container-basket.large-basket {margin: 0 0 40px;background: white;border: 2px solid #c1c7da;}
.game-navigation {display: flex; justify-content: space-between;margin: 30px 0;}
.explanation {position: absolute;background: #272b3a;color: white;width: 250px;padding: 15px;margin: -51px 0 0 296px;}
.explanation a { color: inherit;}
.explanation:before {content: " ";position: absolute;width: 0;height: 0;border: 10px solid transparent;border-right-color: #272b3a;margin: 7px -20px;left: 0;}
h1 + h2 {margin-top: -20px;margin-bottom: 25px;}
.imgs {display: flex;height: 400px;padding-right: 200px;}
.imgs img { height: 100%; margin-right: 100px;}
.deals {display: flex;margin: 50px 0 0;justify-content: space-between; cursor: pointer;}
.deal-box {width: 450px;background: #e0ded8;text-align: left;display: flex;flex-wrap: wrap;border: 2px solid #000000;}
.deal-box img {width: 100%;max-height: 200px;}
.deal-title {font-size: 23px;font-weight: bold;padding: 30px 20px;width: 100%;}
a.view-all-games {margin-bottom: 50px;display: block;margin-top: 50px;background: #69f0ae;padding: 30px 0;font-size: 16px;color: black;text-decoration: none;font-weight: bold;}
a.view-all-games:hover {background: #ddd;}

@media only screen and (max-width: 600px) {
.container-basket{margin:0;border:none;padding:0}
.container-nav{margin:0}
.games-grid{grid-template-columns:repeat(1,1fr)}
.container--lg{width:auto;max-width:initial;padding: 0 20px;}
header .container--lg{flex-direction:column}
a.nav-item{padding:0;border:none;margin-bottom:15px}
.nav{flex-direction:column;border:none}
.container-logo {width: auto;}
.about-block {padding-right: 0;}
.checkout-form {width: auto;}
table#basket-table * {font-size: 14px !important;}
.card-container{flex-direction:column;}
.StripeElement{height:40px; margin-bottom:10px}
.imgs {flex-direction: column;padding: 0;height: auto;}
.imgs img {margin: 0;height: auto;margin-bottom: 25px;}
}