:root {
  --main-bg-color: #000; 
  --main-hover-color: #ffe766;
  --main-border-color: #fed800;
  --secondary-background-color: #333;
  --primary-font-color: #fff;
  --secondary-button-color: #ffd800;
}

/* Site font */
body, p, div, a, span, h1, h2, h3, h4, h5, h6, li, tr, th, label{
  font-family: Verdana, Geneva, sans-serif !important;
}

/* Background color.. */
body,/* Body */
#content{/* Site content */
  background: var(--main-bg-color);
}

/* Header - top section with logo */
#headerLogos{
  margin: 10px 10px 0;
}

/* Jaguar & Land Rover logos */
#headerSubLogos{
  float: right;
  padding-top: 12px;
  padding-right: 5px;
}

#headerSubLogos a{
  padding-right: 12px;
}

/* Header logos wrapper */
#headerItems{
  width: 100%;
}

.mobileHeader{
  padding-top: 10px;
  height: 98px;
  background: var(--main-bg-color) !important;
  border-top: none;
}

/* Hide.. */
.search.input, /* default search box */
.mobileHeader #dropMenu ul li:nth-of-type(1n+6), /* breadcrumb menu items after Order History */
.marginPadding6 ul.btnlist, /* Child show on the show page */
.liMyTicketek, /* My Ticketek label in the breakcrumb menu */
#iconSecurity, /* Footer 'digicert' icon */
#GB_window, /* Processing message overlary */
.sessionTimer /* Session timer on the home page */{
  display: none !important;
}

/* Where's My Ticket menu item (follow ig2018custom.js) */
.mobileHeader #dropMenu ul li.liTransHistory{
  display: block !important;
  background-color: transparent;
  border-bottom: none;
}

/* Entitlement password */
.entitlementPwd h2 span{
  background-color: #333;
}

/*  My Account & Order History buttons */
.liUpdateAccount{
  background-color: transparent !important; 
}

/*  Sign In button */
.mobileHeader ul li.logInOut a{
  font-size: 14px !important;
  color: var(--primary-font-color) !important;
}

/*  Breakcrumb menu items */
.mobileHeader ul li{
  margin-top: 8px;
}

/* Footer background - that contains separator '|' */
#footer ul li{
  background: none;
}

/* Titles */
#nestedContent div.title,/* Event name */
#nestedContent div.title h1, /* Event name header */
.deliveryType #eventDetailsContainer h1, /* Delivery type header */
h2, /* Choose Your Tickets*/
.pricelist td, /* Price list on delivery type section */
.pricelist div /* Price list on delivery type section */,
#eventDetailsContainer h1, /* Event details h1 */
.deliveryDetail section, /* Delivery detail section */
.deliveryDetail .heading, /* Delivery detail header */
.deliveryDetail strong, /* Delivery detail header */
.deliveryDetail .accordion .content /* Delivery detail accordion content */
.viewBasket .accordion .content, /* View basket accordion content */
.viewBasket h4, /* View basket header */
.error,  /* Error message block */
.alert, /* Alert message block */
.commonModule ul li, /* Ticketek Privacy Policy */ 
.commonModule ol li, /* Ticketek Privacy Policy */ 
#rn_answer_details h3  /* FAQs header */ {
  background-color: var(--secondary-background-color) !important;
  border: none !important;   
  color: var(--primary-font-color) !important;
}

.purchaseProgress li, /* Purchase progress bar */
.sixSteps li, /* Purchase progress bar */{ 
  background: var(--secondary-background-color) !important;
  color: var(--primary-font-color) !important;
}

.deliveryDetail .btnStandalone .cxButton{ 
  color: #555 !important;
  background-color: transparent !important;
  font-size: 16px;
}

#nestedContent .tabs div.selected, /* Selected tab */
.btnlist li:after, /* Get Tickets (arrow) button on the show page */ 
.purchaseProgress .selected, /* Purchase progress bar selected */
.sixSteps .selected, /* Purchase progress bar selected */
.purchaseProgress .passed, /* Purchase progress bar passed */
.sixSteps .passed /* Purchase progress bar passed */{
  background: var(--secondary-button-color) !important;
}

.btnlist li:after /* Get Tickets (arrow) button on the show page */ {
  content: ">";
  font-size: 20px;
  color: #555;
  text-align: center;
  padding-top: 25px;
}

#nestedContent .tabs div, /* Tabs containing GET TICKETS & EVENT DETAILS buttons */
.sixSteps li /* Purchase progress bar */{ 
  background: var(--secondary-background-color);
  color: var(--primary-font-color);
}

#uiMessages a{ 
  color: var(--secondary-background-color);
}

/* Buttons with an arrow */
.performance .btnlist li :after,
.deliveryType .btnlist li :after{
  background: url(../../images/mobile/chevron-fff.png) center no-repeat var(--secondary-button-color);
}

/* GET TICKETS & EVENT DETAILS sections */
#nestedContent .tabs div{
  border: none;
}

/* Home page tab content */
.btnlist li:first-child{
  border-top: none !important;
}

/* Login form */
.loginForm section,
#primaryContainer section{
  background-color: var(--secondary-background-color) !important;
}

/* Login form header */
.loginForm h1{
  margin-left: 12px;
}

/* UI COMPONENTS */
.performance, /* GET TICKETS tab */
.performance .btnlist li, /* GET TICKETS tab */
.performance .btnlist li a, /* GET TICKETS tab */
.performance .btnlist span, /* GET TICKETS tab */
#nestedContent .showInfo, /* EVENT DETAILS tab */
#nestedContent .showInfo p, /* EVENT DETAILS tab */
#nestedContent .showInfo strong, /* EVENT DETAILS tab */
#eventDetailsContainer, /* EVENT DETAILS container */
#eventDetailsContainer p,  /* EVENT DETAILS container */
.seatarea li.selected, /* SEAT AREA selected button */
#mapFooter, /* SEAT MAP footer */
.priceTypes section, /* Price Type area section */
.priceTypes section p, /* Price Type area section */
.priceTypes section strong, /* Price Type area section */
.priceTypes div, /* Price Type */
.deliveryType section, /* Delivery type section */
.deliveryType strong, /* Delivery type section */
.deliveryType p, /* Delivery type section */
.deliveryType span, /* Delivery type section */
.deliveryType .btnlist li a /* Delivery types button */,
.deliveryType .btnlist li /* Delivery types button */,
.deliveryDetail .accordion, /* Delivery detail accordion */
.viewBasket .accordion, /* Delivery detail accordion */
.viewBasket p, /* View basket p */
.viewBasket div, /* View basket div */
.viewBasket section, /* View basket section */
.viewBasket strong, /* View basket strong */
.payment .accordion, /* Payment accordion */
.payment p, /* Payment p */
.payment div, /* Payment div */
.payment section, /* Payment section */
.payment strong /* Payment strong */,
section{ 
  background: var(--secondary-background-color) !important;
  background-color: var(--secondary-background-color) !important;
  color: var(--primary-font-color) !important;
}

/* View basket common module */
.viewBasket .commonModule{
  padding-top: 10px;
  padding-bottom: 10px;
}

input, /* Input field */
select, /* Drop down menu */
.transText, /* Order History top section*/
.uiTransMainTable .transDetailsTable, /* Order History table */
.uiTransMainTable .transDetailsTable span,/* Order History table */ 
.transHistoryPaging, /* Pagination on Order History page */
.transHistoryPaging span, /* Pagination on Order History*/
.transHistoryPaging div, /* Pagination on Order History */
.transHistoryPaging select, /* Order History pagination drop dowmn */
button.action /* Action button */{
  border: none !important;
  background-color: var(--secondary-button-color) !important;
  background: var(--secondary-button-color) !important;
  color: var(--primary-font-color) !important;
}

input,
select{
  color: #000 !important;
}

/* Primary font color */
#primaryContainer section label, /* Section label */
.seatarea li .title .pcat-name, /* Seat Area name */
.seatarea li>.price, /* Seat Area price */
.loginForm a.action2, /* Login form action button */
span, /* Delivery detail span */
p, /* Delivery detail p */
strong /* Delivery detail strong */,
div, /* Delivery detail div */
em, /* Delivery detail em */
label, /* View basket label */
span, /* View basket label */
h4, /* h4 */
h1 /* h1 */{ 
  color: var(--primary-font-color) !important;
}

/* Order history table row header */
.uiTransMainTable .transDetailsTable tbody>tr:first-child{
  background: var(--secondary-background-color);
}

.actDetails input.action, /* Input */
a.action, /* a Link */
input.action, /* Action button */
.uiTransMainTable .seatMapSVG /* Order History page sections */,
a.globalButton,/* Button on Order History page */
span.globalButton,/* All global buttons */
.priceTypes .submitSection input,
#uiMessages{
  color: var(--main-bg-color) !important;
  background: var(--secondary-button-color) !important;
  border: none !important;
}

/* Mobile Ticket button image */
.mobileTicket img{
  content:url("http://m-tickets.invictusgames2018.org/images/iconOpenNewWindowBlack.png");
}

/* Print At Home button image */
.printAtHome img{
  content:url("http://m-tickets.invictusgames2018.org/images/iconDownloadBlack.png");
}

/* Price Type UI components */
.pricetable2>div,
#nestedContent section section#runningTimes.accordion, 
#nestedContent section section.accordion {
  border: none !important;
  border-top: 1px solid #dadada !important;
  background-color: transparent !important;
}

/* Credit card type section on View basket page */
.creditCardTypes .radiolist ul{
  display: grid;
}

/* Credit card type list on View basket page */
.creditCardTypes .radiolist ul li{
  display: flex;
  width: 100%;
  margin-top: 5px;
  margin-bottom: 5px;
}

/* Credit card type label */
.viewBasket .radiolist label{
  padding-top: 4px;
}

/* Payment page sub total section */
.payment #subTotal{
  border-top: none;
}