/*@font-face {
    font-family: 'futura-pt';
    src: url('../fonts/futuran-webfont.eot');
    src: url('../fonts/futuran-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/futuran-webfont.woff') format('woff'), url('../fonts/futuran-webfont.ttf') format('truetype'), url('../fonts/futuran-webfont.svg#futura-pt') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Futura Bold';
    src: url('../fonts/Futura_Bold.woff') format('woff');
}

@font-face {
  font-family: "FuturaBT-Medium";
  src: url("../fonts/FutuMd.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
*/

* {
  margin:0px;
  padding:0px;
}

body {
  font-family: 'futura-pt';
  color:black;
  overflow-x: hidden;
  background: url('../images/content-bg.jpg');
}

h1, h2 {
  font-family: 'futura-pt-bold';
}

p, h1, h2, h3 {
  margin-bottom: 20px;
}

h2 {
  color: #df0100;
  font-size:22pt;
  text-transform: uppercase;
}

h1 {
  color: black;
  font-size: 24pt;
}

h3 {
  font-size: 13pt;
}

a {
  color: black;
}

p {
  line-height: 1.2;
}

ol {
  text-align: left !important;
  line-height: 1.4;
}

.promotion-wrap a {
  text-decoration: none;
  font-size: 12pt;
}


@media screen and (max-width: 900px) {
  .slick-arrow.right-arrow{
    font-size: 50px;
  }
  .slick-arrow.left-arrow{
    font-size: 50px;
  }
}

@media (min-width: 1100px) {

  .container {
    width: 1100px;
    margin:0 auto;
    position: relative;
  }

  #header {
    height: 100px;
    background: url('../images/header-bg.jpg') repeat-x;
    position: relative;
  }

  #logo {
    position: absolute;
    z-index: 1000;
    top:20px;
  }

  #nav {
    float: right;
    width:900px;
    text-align: right;
    margin-top: 40px;
  }

  #nav a {
    color: white;
    text-transform: uppercase;
    font-size: 12pt;
    text-decoration: none;
    padding:0px 40px;
  }

  #nav a:hover {
    color: black;
  }

  #login {
    background: black;
    display: inline-block;
    border-radius: 5px;
    padding:10px 46px !important;
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-size: 12pt;
    text-decoration: none;
    cursor: pointer;
  }

  #login:hover {
    color: #cdcdcd !important;
  }

  .slider {
    width:100%;
  }

  .slides {
    width:100%;
    background-position: top center;
    background-size: cover;
  }

  .slick-slide img {
    width:100%;
    height: auto;
    display: block;
  }

  .slick-arrow.left-arrow{
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 40px;
    z-index: 1;
    color: white;
  }

  .slick-arrow.right-arrow{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 40px;
    z-index: 1;
    color: white;
  }

  .slick-arrow.left-arrow:hover, .slick-arrow.right-arrow:hover{
    cursor: pointer;
  }

  #content {
    background: url('../images/content-bg.jpg');
    padding:40px 0px;
    color: black;
    text-align: center;
  }

  .left {
    float: left;
    width: 33%;
    margin-right: 14%;
    margin-top: 40px;
    margin-left: 10%;
  }

  .right {
    float: left;
    width: 33%;
    margin-top: 40px;
  }

  #marquee {
    font-size: 14pt;
    text-transform: uppercase;
    text-align: center;
    margin-top: 40px;
  }

  #marquee p {
    display: inline-block;
    margin:0px 20px !important;
  }

  #footer {
    padding:20px 0px;
    margin-top: 40px;
    font-size: 12pt;
    margin-bottom: 40px;
  }

  #footer-left {
    float: left;
    width:500px;
  }

  #footer-right {
    float: right;
    width:500px;
  }

  #footer-right a {
    text-transform: uppercase;
    text-decoration: none;
    color: black;
    padding:0px 30px;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    width: 220px;
    border-radius: 5px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 3;
    right: 0px;
  }

  .show {
    display: block;
  }

  #login-form {
    color: #fff;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    position: absolute;
    background-color: #f1f1f1;
    width: 151px;
    border-radius: 5px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 3;
    right: 0px;
  }

  #login-form form {
    margin: 0;
    border: 0;
    outline: 0;
    padding: 10px;
    text-align: left !important;
    font-size: 13pt;
    color: black;
  }

  #login-form .logged-in-btn{
    text-align: center;
    font-weight: bold;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-size: 17px;
  }

  #login-form .logged-in-btn:hover{
    background-color: #ddd;
    border-radius: 3px;
  }

  input[type="text"], input[type="password"] {
    padding:3px;
    border:solid #cdcdcd 1px 3px;
    margin-bottom: 10px;
    font-family: 'futura-pt';
    width:90%;
  }

  button {
    border: 1px solid #7D99CA;
    border-radius: 3px;
    font-family: 'futura-pt';
    padding: 10px;
    text-decoration: none;
    display: inline-block;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #8A181A;
    background-image: linear-gradient(to bottom, #8A181A, #EA1C24);
    width: 100%;
    font-size: 17px;
  }

  #mobile-nav, #mobile-links {
    display: none;
  }

  #desktop-nav {
    display: inline-block;
    margin-right: 100px;
  }

  #levels {
    background-image: url('../images/levels-bg.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    padding-bottom: 150px;
    background-size: cover;
    margin-bottom: 40px;
  }

  .level-title {
    float: left;
    width:300px;
    margin-left: 250px;
    text-align: right;
    margin-right: 20px;
  }

  .level-details {
    float: left;
    width:320px;
    font-size: 12pt;
    text-align: left !important;
    line-height: 1.2;
  }

  .level-title img {
    height: 80px;
    width: auto;
    padding-top: 12px;
  }

  .large-text {
    font-size: 14pt;
    font-family: 'futura-pt-bold';
  }

  .align-left {
    text-align: left !important;
  }

  .small-container {
    width:900px;
    margin:0 auto;
  }

  #form-input {
    margin-top: 3px;
    float: left;
    width: 50% !important;
    margin-right: 0 !important;
    margin-bottom: 10px;
  }

  #form-input .field {
    margin: 0 0 0 10px;
    font-size: 16px;
    width: 250px;
    padding: 6px 6px;
    border-radius: 5px;
    border: 1px solid #333;
    display: inline-block;
  }


  #loc-list {
    margin: auto;
    margin-top: 20px;
    height: 570px;
    overflow: auto;
  }

  #loc-list ul {
    display: block;
    clear: left;
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left !important;
  }

  #loc-list li {
    display: block;
    clear: left;
    float: left;
    margin: 6px 10px 6px 0;
    cursor: pointer;
    background: rgba(254, 254, 254, 0) !important;
  }

  #loc-list .list-label {
    float: left;
    margin: 10px 0 0 6px;
    padding: 2px 3px;
    width: 17px;
    text-align: center;
    background: #451400;
    font-weight: bold;
    display: none;
  }

  #loc-list .list-details {
    float: left;
    margin-left: 6px;
  }

  #loc-list .list-content {
    padding: 10px 10px 10px 0px;
    color: #fff;
    line-height: 16px;
    font-size: 18px;
    color: black;
  }

  #map-container .loc-name {
    color: #C0151B;
    font-family: 'futura-pt-bold';
    padding-bottom: 4px;
  }

  .loc-addr, .loc-addr2, .loc-addr3 {
    padding-bottom: 3px;
  }

  #map-container {
    clear: left;
    margin:27px auto;
    width: 950px;
    padding: 0px 10px 10px 10px;
  }

  #map {
    width: 950px;
    height: 530px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
  }

  #marquee {
    width: 976px;
    height: 58px;
    margin: 0px auto;
  }

  #marquee ul {
    margin: 20px 0 0 10px;
    width: 956px;
    overflow: hidden;
  }

  #marquee li {
    display: inline-block;
    padding: 0 60px;
  }

  @-webkit-keyframes marqueeAnimation-5543449  { 100%  {margin-left:-3203px}}
  @-webkit-keyframes marqueeAnimation-55434490  { 100%  {margin-left:-3203px}}

}



@media screen and (max-width : 1099px){

  .container {
    width:100%;
  }

  #header {
    height: 80px;
    background: url('../images/header-bg.jpg') repeat-x;
    position: relative;
  }

  #content img, .wp-image-4548 {
    max-width: 90%;
    height: auto;
  }

  .member-bingo-container {
    margin:0 auto;
    width:90%;
  }


  .member-bingo-container table td {
    width:7.7%;
    height: auto;
  }

  .member-bingo-container table td img {
    width:100%;
    max-width: 53px;
    height: auto;
  }

  #logo {
    position: absolute;
    z-index: 1000;
    top:10px;
    left:10px;
    width:100px;
    height: auto;
  }

  #desktop-nav {
    display: none;
  }

  #nav {
    /*float: right;
    width:900px;*/
    text-align: right;
    /*margin-top: 20px;*/
  }

  #nav a {
    color: white;
    text-transform: uppercase;
    font-size: 12pt;
    text-decoration: none;
    padding:0px 40px;
  }

  #nav a:hover {
    color: black;
  }

  #login {
    background: black;
    display: inline-block;
    border-radius: 5px;
    padding:10px 40px !important;
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-size: 12pt;
    text-decoration: none;
    cursor: pointer;
  }

  #login:hover {
    color: #cdcdcd !important;
  }

  #login-form .logged-in-btn{
    text-align: center;
    font-weight: bold;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-size: 18px;
  }

  #login-form .logged-in-btn:hover{
    background-color: #ddd;
    border-radius: 3px;
  }
  .slider {
    width:100%;
  }

  .slides {
    width:100%;
    background-position: top center;
    background-size: cover;
  }

  .slick-slide img {
    width:100%;
    height: auto;
    display: block;
  }

  .slick-arrow.left-arrow{
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    z-index: 1;
    color: white;
  }

  .slick-arrow.right-arrow{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    z-index: 1;
    color: white;
  }

  .slick-arrow.left-arrow:hover, .slick-arrow.right-arrow:hover{
    cursor: pointer;
  }

  #content {
    background: url('../images/content-bg.jpg');
    padding:40px 5%;
    color: black;
    text-align: center;
  }

  .left {
    margin-top: 40px;
  }

  .right {
    margin-top: 40px;
  }

  .left img, .right img {
    width: 100px;
    height: auto;
  }

  #marquee {
    font-size: 13pt;
    text-transform: uppercase;
    text-align: center;
    margin-top: 40px;
  }

  #marquee p {
    display: inline-block;
    margin:0px 20px !important;
  }

  #footer {
    padding:20px 0px;
    margin-top: 40px;
    font-size: 11pt;
    text-align: center;
  }

  #footer-left {
    margin-bottom: 20px;
  }

  #footer-right {

  }

  #footer-right a {
    text-transform: uppercase;
    text-decoration: none;
    color: black;
    padding:0px 10px;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    width: 220px;
    border-radius: 5px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 3;
    right: 0px;
  }

  .show {
    display: block;
  }

  #login-form {
    color: #fff;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    position: absolute;
    background-color: #f1f1f1;
    width: 220px;
    border-radius: 5px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 3;
    right: 0px;
  }



  #login-form form {
    margin: 0;
    border: 0;
    outline: 0;
    padding: 10px;
    text-align: left !important;
    font-size: 12pt;
    color: black;
  }

  input[type="text"], input[type="password"] {
    padding:3px;
    border:solid #cdcdcd 1px 3px;
    margin-bottom: 10px;
    font-family: 'futura-pt';
    width:90%;
  }

  button {
    border: 1px solid #7D99CA;
    border-radius: 3px;
    font-family: 'futura-pt';
    padding: 10px;
    text-decoration: none;
    display: inline-block;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #8A181A;
    background-image: linear-gradient(to bottom, #8A181A, #EA1C24);
    width: 100%;
    font-size: 18px;
  }

  #login {
    margin-right: 10px;
  }

  #mobile-nav {
    display: inline-block;
    margin-top: 20px;
    margin-right: 10px;
    font-size: 16pt;
    padding:10px;
  }

  #mobile-links {
    display: none;
    background: black;
    position: absolute;
    top:80px;
    width:100%;
    z-index: 10;
  }

  #mobile-links a {
    color: white;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 18px;
    display: block;
    text-align: center !important;
  }

  #mobile-nav a.icon {
    display: inline-block;
    color: black !important;
    text-align: right;
    padding:0px 10px !important;
  }

  #levels {
    margin-bottom: 40px;
    text-align: center;
  }

  .level-title {
    margin-bottom: 20px;
  }

  .level-details {
    margin-bottom: 20px;
  }

  .level-title img {
    height: 60px !important;
    width: auto;
    max-width: 60% !important;
  }

  .large-text {
    font-size: 14pt;
    font-family: 'futura-pt-bold';
  }

  .align-left {

  }

  .small-container {

  }


  #form-input {
    margin-bottom: 5px;
  }

  #form-input .field {
    margin: 0 0 0 10px;
    font-size: 16px;
    width: 80%;
    padding: 6px 6px;
    border-radius: 5px;
    border: 1px solid #333;
    display: inline-block;
  }


  #loc-list {
    margin: auto;
    margin-top: 20px;
    height: 485px;
    overflow: auto;
  }

  #loc-list ul {
    display: block;
    clear: left;
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left !important;
  }

  #loc-list li {
    display: block;
    clear: left;
    float: left;
    margin: 6px 10px 6px 0;
    cursor: pointer;
    background: rgba(254, 254, 254, 0) !important;
  }

  #loc-list .list-label {
    float: left;
    margin: 10px 0 0 6px;
    padding: 2px 3px;
    width: 17px;
    text-align: center;
    background: #451400;
    font-weight: bold;
    display: none;
  }

  #loc-list .list-details {
    float: left;
    margin-left: 6px;
  }

  #loc-list .list-content {
    padding: 10px 10px 10px 0px;
    color: #fff;
    line-height: 16px;
    font-size: 17px;
    color: black;
  }

  #map-container .loc-name {
    color: #C0151B;
    font-family: 'futura-pt-bold';
    padding-bottom: 4px;
  }

  .loc-addr, .loc-addr2, .loc-addr3 {
    padding-bottom: 3px;
  }

  #map-container {
    clear: left;
    margin: 27px auto;
    width: 100%;
    padding: 0px 10px 10px 10px;
  }

  #map {
    width: 100%;
    height: 230px;
    margin: auto;
    position: relative;
    overflow: hidden;
  }

  #marquee {
    width: 90%;
    height: 58px;
    margin: 0px auto;
  }

  #marquee ul {
    margin: 20px 0 0 10px;
    width: 100%;
    overflow: hidden;
  }

  #marquee li {
    display: inline-block;
    padding: 0 20px;
  }

  @-webkit-keyframes marqueeAnimation-5543449  { 100%  {margin-left:-3203px}}
  @-webkit-keyframes marqueeAnimation-55434490  { 100%  {margin-left:-3203px}}

}

.memberstatus-container .member-h11 {
    padding-top: 40px;
    font-size: 26px;
}

.memberstatus-container .member-h12 {
    padding-top: 15px;
    font-size: 26px;
}

.memberstatus-container .member-h11,
.memberstatus-container .member-h12 {
    text-align: center;
    font-weight: normal;
    font-size: 26px;
    font-family: 'futura-pt';
}

.memberstatus-container .member-h13 {
    padding-top: 20px;
    font-size: 28px;
    text-align: center;
    color: #EB1C24;
    font-family: futura-pt-bold;
}

.member-h15, .member-h14 {
  font-size: 13pt;
  margin-bottom: 5px;
  padding-top:30px;
  font-family: futura-pt-bold;
}

.memberstatus-container .member-promo-sub-header {
    text-align: center;
}

.memberstatus-container .member-level-container {
    padding: 20px 0px;
    text-align: center;
}

.memberstatus-container .member-level-container img{
    max-height: 70px !important;
}
@media screen and (max-width: 900px) {
    .memberstatus-container .member-level-container img{
        max-height: 50px !important;
    }
}



  .memberstatus-container .member-level-progress-container {
      text-align: center;
      font-size: 16px;
      max-width:1100px;
      width:100%;
      margin:0 auto;
  }

  .memberstatus-container .bar {
      margin: 30px auto;
      max-width:894px;
      width:95%;
      height: 32px;
      background: #000;
      border: #8D8D8D 4px solid;
      border-radius: 3px;
  }


.memberstatus-container .progress {
    background: #350088;
    background: -moz-linear-gradient(left, #350088 0%, #3549C8 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #350088), color-stop(100%, #3549C8));
    background: -webkit-linear-gradient(left, #350088 0%, #3549C8 100%);
    background: -o-linear-gradient(left, #350088 0%, #3549C8 100%);
    background: -ms-linear-gradient(left, #350088 0%, #3549C8 100%);
    background: linear-gradient(to right, #350088 0%, #3549C8 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#350088', endColorstr='#3549C8', GradientType=1);
    height: 100%;
    float: left;
}

.memberstatus-container .fancy_bg {
    padding: 5px;
}

.memberstatus-container .percent {
    display: block;
    width: 10%;
    float: right;
    color: white;
    font-size: 18px;
    border-left: 2px solid #898989;
    height: 100%;
    line-height: 31px;
}

.memberstatus-container .member-row:after {
    content: "";
    display: table;
    clear: both;
}

.memberstatus-container .member-column {
    text-align: center;
    float: left;
    width: 25%;
}




@media screen and (max-width: 900px) {
    .memberstatus-container .member-row{
        margin: auto;
    }
    .memberstatus-container .member-column {
        float: none;
        margin-bottom: 30px;
        width: initial;
    }
    .memberstatus-container .member-column #location_container{
        color: black;
    }
}


.memberstatus-container .member-column .member-column-inner {
    margin: auto;
    margin-bottom: 10px;
    height: 45px;
    width: 165px;
    background-image: linear-gradient(#EA1C24, #8C181A);
    border: white solid 3px;
    border-radius: 3px;
    line-height: 22px;
    color: white;
    font-weight: bold;
    font-size: 18px;
}

.memberstatus-container .member-column select {
    height: 26px;
    width: 171px;
}

.memberstatus-container .member-bingo-container {
    text-align: center;
    /*color: #fff;*/
    padding-top: 30px;
}

.memberstatus-container .member-bingo-container a {
    color: #EB1C24;
    font-weight: bold;
}

.memberstatus-container .member-bingo-card-info-2 {}

.memberstatus-container .member-primary-bingo-card-container table,
.memberstatus-container .member-secondary-bingo-card-container table {
    margin: auto;
    max-width: 100%;
}
.memberstatus-container .member-primary-bingo-card-container table td,
.memberstatus-container .member-secondary-bingo-card-container table td {
    border-collapse: collapse;
    border-right: 3px solid #FDD109;
    border-top: 3px solid #FDD109;
    border-bottom: 3px solid #FDD109;
}
.memberstatus-container .member-primary-bingo-card-container table tr td:first-child,
.memberstatus-container .member-secondary-bingo-card-container table tr td:first-child {
    border-left: 3px solid #FDD109;
}

.member-promotions-container {
    text-align: center;
}

.promotion-wrap {
    display: inline-block;
    padding: 0px 10px;
    color: white;
    /*max-width: 180px;*/
    max-width: 125px;
}

.promotion-wrap h1{
    padding-top: 0px;
    padding-bottom: 8px;
    /*font-family: futura-pt-bold;*/
    font-size: 16px;
    font-family: 'futura-pt';
    font-weight: 600;
}

.promotion-wrap img {
    max-width: 100px !important;
    height: auto !important;
}

/* START Login Error Popup Styling */
.popup {
    display: none;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    max-width: 400px;
    width: 100%;
    padding: 20px;
    z-index: 1000;
}

.popup-content {
    text-align: center;
}

.popup-header {
    font-size: 24px;
    margin-bottom: 10px;
    color: #333;
}

.popup-close {
    display: inline-block;
    padding: 10px 20px;
    margin-top: 15px;
    background-color: #007BFF;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.popup-close:hover {
    background-color: #0056b3;
}

.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
}

@media(max-width: 980px) {
  .popup {
    max-width: 340px;
  }
}
/* END Login Error Popup Styling */