@font-face {
    font-family: 'HorrorScribbles';
    src: url('/fonts/HorrorScribbles.eot?#iefix') format('embedded-opentype'), url('/fonts/HorrorScribbles.woff') format('woff'), url('/fonts/HorrorScribbles.ttf')  format('truetype'), url('/fonts/HorrorScribbles.svg#HorrorScribbles') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GallowTreeRegular';
    src: url('/fonts/GallowTreeRegular.eot');
    src: url('/fonts/GallowTreeRegular.eot') format('embedded-opentype'),
         url('/fonts/GallowTreeRegular.woff2') format('woff2'),
         url('/fonts/GallowTreeRegular.woff') format('woff'),
         url('/fonts/GallowTreeRegular.ttf') format('truetype'),
         url('/fonts/GallowTreeRegular.svg#GallowTreeRegular') format('svg');
}
@font-face {
    font-family: 'DrukWideBold';
    src: url('/fonts/DrukWideBold.eot');
    src: url('/fonts/DrukWideBold.eot') format('embedded-opentype'),
         url('/fonts/DrukWideBold.woff2') format('woff2'),
         url('/fonts/DrukWideBold.woff') format('woff'),
         url('/fonts/DrukWideBold.ttf') format('truetype'),
         url('/fonts/DrukWideBold.svg#DrukWideBold') format('svg');
}

html {height: 101%;}
body {
    padding-top: 2.8rem;
    background: url('/images/hcuk/site-bg.png') center top repeat-y #00f8c4;
}

h1 {
    margin-bottom: 1rem;
    font-size: 1.8rem;
    font-family: 'GallowTreeRegular', Helvetica, Arial, sans-serif;
    font-weight: normal;
    color: #75F8C3;
}

h2 {
    margin-bottom: 0.2rem;
    font-size: 3rem;
    font-family: 'GallowTreeRegular', sans-serif, Helvetica, Arial;
    font-weight: 500;
    -webkit-font-smoothing: antialiased;
    color: #75F8C3;
}

.paper {
    background-color: #black;
    padding: 0;
    display: block;
    font-family: Helvetica, Arial, sans-serif;
    color: #75F8C3;
    letter-spacing: 0;
}

.header-banner {
    box-sizing: border-box;
    height: 110px;
    background-image: url('/images/hcuk/header-banner.png');
    background-position: top center;
    padding-top: 15px;
    text-align: center;
}

.footer {
    text-align: center; font-size: 0.8rem;
    color: #75F8C3; margin: 1rem; padding-bottom: 1rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-font-smoothing: antialiased;
}

.scary {
    font-size: 1.8rem;
    font-family: 'GallowTreeRegular', Helvetica, Arial, sans-serif;
    font-weight: normal;
}

.content-break {width: 90%; height: 17px; margin: 15px auto; display: none;}
.container {max-width: 1100px; color: #75F8C3; margin-top: 1.5rem;}

.bg-dark {
    background-color: black!important;
}
.navbar-toggler {
    cursor: pointer;
}
.navbar-dark .navbar-toggler-icon {
    background-image: none;
}
.navbar-dark .navbar-toggler {
    background-image: url('/images/hcuk/navbars.gif');
    background-size: cover;
    border-color: black;
    border: 0;
}
.nav-logo {
    height: 2rem;
}

.navbar-dark .nav-link {
    color: #FFFFFF;
    font-family: 'DrukWideBold', Helvetica, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 0.5rem 0.5rem;
    -webkit-font-smoothing: antialiased;
}

.navbar-expand-md .navbar-nav .nav-link {
    padding: 0.5rem 0.5rem;
}

.navbar-dark .navbar-nav .nav-link {text-decoration: none; color: #CCCCCC;}
.navbar-dark .navbar-nav .nav-link:hover {color: #75F8C3; cursor: pointer;}

.navbar-dark .navbar-nav .active {color: #fccc0c;}

.nav-item {
    padding-right: 2rem;
}

.navbar-nav:first-child {
    padding-left: 2rem;
}

.ext-title {display: none;}

.ticket-details {list-style-position: outside; list-style-type: disc; padding: 0; display: block; margin: 0 0 0 40px;}
.ticket-details li {display: list-item; text-align: left; padding: 0; float: none; width: 95%;}
.ticket-container {border: 2px solid black; background-color: #EEEEEE; margin-bottom: 1.5rem;}
.ticket-description {padding: 10px; background-color: #EEEEEE; display: inline-block; display: block; color: black;}

.ticket-add {font-weight: bold; font-size: 1.3rem; color: #EEEEEE; background-color: black; padding: 10px; border: 0; text-align: left;}
.ticket-add input[type='text'] {font-weight: normal; font-size: 1.3rem; width: 15%; border-radius: 10px; padding: 2px 5px; text-align: center;}
.ticket-add input[type='submit'] {font-weight: normal; font-size: 1.3rem; border-radius: 10px; padding: 2px 10px; text-align: center; float: right;}
.ticket-add a:hover {cursor: pointer;}
.ticket-add a .fa-plus-circle {color: green;}
.ticket-add a .fa-minus-circle {color: red;}
.ticket-add a .fa-cart-plus {font-size: 2.2rem; }
.ticket-add .submit {color: #EEEEEE; float: right; font-size: 1.3rem;}

.ticket-section .description-text {padding: 0 15px; font-size: 0.9rem;}
.ticket-section .terms-text {padding: 0 15px; font-size: 0.9rem;}

.qty {font-weight: normal; font-size: 1.4rem; font-weight: bold; width: 3rem; border: 0; border-radius: 6px; padding: 2px 10px; text-align: center; display: inline-block; margin-right: 0.5rem;}
.discount {font-weight: normal; font-size: 1.4rem; font-weight: bold; border: 0; border-radius: 6px; padding: 2px 10px; text-align: center; display: inline-block; margin-right: 0.5rem;}
.fa.fa-caret-up.qty_arrow, .fa.fa-caret-down.qty_arrow {text-decoration: none; font-size: 2.6em; line-height: 0em; vertical-align: middle; color: #75F8C3;}
.fa.fa-caret-up.qty_arrow_white, .fa.fa-caret-down.qty_arrow_white {text-decoration: none; font-size: 2.6rem; line-height: 0em; vertical-align: middle; color: #75F8C3;}
.fa.fa-caret-up.qty_arrow:hover, .fa.fa-caret-down.qty_arrow:hover {color: #CC3948; cursor: pointer;}
.fa.fa-caret-up.qty_arrow_white:hover, .fa.fa-caret-down.qty_arrow_white:hover {color: #CC3948; cursor: pointer;}

.basket {width: 100%; margin: 25px 0; color: #75F8C3;}
.basket table {width: 100%;}
.basket tr {}
.basket th {text-align: left; padding: 10px 20px; background-color: #CC3948; color: #75F8C3; font-size: 1.5rem;}
.basket td {text-align: left; padding: 15px 20px; border-bottom: 1px solid #CC3948; color: #75F8C3; font-family: Helvetica, Arial, sans-serif; letter-spacing: 1px; }
.basket .creditcards {border-bottom: 0;}

a {text-decoration: none; color: #75F8C3; font-weight: bold;}
a:hover {color: #CC3948; cursor: pointer; text-decoration: underline;}

.basket .btn {
    display: inline-block;
    min-width: 110px;
    margin: 15px auto;
    padding: 10px 15px 12px;
    font: 700 1em 'Open Sans', sans-serif;
    border-radius: 3px;
    box-shadow: inset 0 -1px 0 1px rgba(0, 0, 0, 0.1), inset 0 -10px 20px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    font-weight: bold;
}
.basket .btn.pri {
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.basket .set.blue .btn.pri {
    background: #59d;
}
.basket .set.blue .btn.pri:hover {
    background: #48c;
}
.basket .btn.pri.ico {
    position: relative;
    padding-left: 40px;
    text-align: left;
}
.basket .btn.pri.ico:before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 30px;
    padding: 10px 0 12px;
    font-family: fontawesome;
    text-align: center;
    border-radius: 3px 0 0 3px;
    background: rgba(0, 0, 0, 0.15);
}
.basket .set.blue .btn.pri.ico:before {
    content: "\f021";
}

.mobile-basket {border-top: 1px solid #CC3948; box-sizing: border-box;}
.mobile-basket h4 {font-size: 1rem;}
.mobile-basket p {margin: 0;}
.mobile-basket .media {border-bottom: 1px solid #CC3948; padding: 0.5rem; margin: 0;}
.mobile-basket .col-sm-2 {padding: 0;}
.mobile-basket .stripe {padding: 0;}

/* Stripe & general payment Styles Begin Here */
.pay-parent {width: 60%; margin: 0 auto; text-align: center; padding: 20px; border-radius: 8px 8px; border: 1px solid #CC3948; background-color: #0d2d00;}
.pay-parent label {display: block; text-align: left; font-weight: bold; margin: 0;}
.pay-detailslement {background-color: white; padding: 0.5rem 1rem; border-radius: 5px 5px; width: 100%; margin-bottom: 1rem;}
.pay-cardelement {background-color: white; padding: 15px; border-radius: 8px 8px;}
.pay-carderrors {color: red; width: 60%; margin: 10px 0; font-size: 14pt;}
.pay-button {padding: 10px 20px; background-color: #59d; color: white; font-weight: bold; border-radius: 8px 8px;}
.pay-button:hover {cursor: pointer; background-color: #48c; color: #75F8C3;}
.pay-stripelogo {display: block; margin: 10px auto;}
/* Stripe & general payment Styles End */

.btnIcon {color: white;}
.btnIcon:hover {color: #DD3333; cursor: pointer;}

@media (max-width: 992px) {
    .ticket-container {width: 75%; margin: 0 auto;}
    .pay-parent {width: 100%;}
    .paper {padding: 0;}
}

@media (max-width: 768px) {
    .ticket-container {width: 100%; margin: 1rem auto;}
    .desktop-basket {display: none;}
    .mobile-basket {display: block;}
    .paper {padding: 0;}
}
@media (min-width: 768px) {
    h1 {font-size: 3.2rem;}
    .nav-link {
        font-size: 1rem;
        font-weight: bold;
    }
    .ext-title {display: inline;}
    .content-break {display: block;}

    .desktop-basket {display: block;}
    .mobile-basket {display: none;}
}