Checkout CSS
From Shopify Wiki
You can change the style of Shopify’s checkout system by uploading a checkout.css or checkout.css.liquid file to your theme’s asset folder. This CSS style sheet will target the checkout page so you can change visual properties like the background color and font-sizes. Remember to use the asset_url tag for your images faster CDN updates and to adds HTTPS to the image.
Checkout.css
/* MAKE SURE you name your file checkout.css.liquid to use liquid filters */ Here is an example file to get you started
/* Undo background and gradient */
body, #main, #container, #header, #footer {
background: #fff !important;
}
/* Undo overview background and borders */
#main #overview {
background: #fff;
border: none;
}
#main #overview > * {
border: none;
}
#main #thumbs div {
border: none;
}
/* Insert your own logo (upload separately) */
#logo {
height: 65px;
background: url({{ 'logo-checkout.png' | asset_url | replace: 'http://','https://' }}) center no-repeat;
}
#header > h1{
text-align:center;
}
/* Hide the name of the store because we got this nifty logo now */
#header > h1 span.title {
display:none;
}
Mobile Themes
For mobile themes, you can overwrite the default checkout CSS by creating a file called "checkout.mobile.css" or "checkout.mobile.css.liquid".


