.desktoponly {display: none;}

/*redirect div*/
.redirectBox { display:none; position: absolute; top: 0px; font-size:16px; z-index: 99999999; background-color: #ffffff; text-align:center; width: 100%; color: #666666; padding-top: 10px;}
.redirectBox.redirectActive {display:block;}
.redirectBox h4 { font-size:26px; font-weight:normal; color:#0a4b5e;}
.redirectBox>div { padding:0px !important; height:auto; width:auto;}
.redirectBox p { padding:10px 12%; font-size:16px;}
.redirectBox .redirect-link {padding:15px 15px; background-color: #115173; font-size:19px; display:block; color:#ffffff; margin-bottom: 10px;}
.redirectActive span { position: absolute; right: 15px; top: 5px; font-size: 30px; padding:10px; border: 1px solid #999; background-color: #eeeeee; cursor: pointer; }

.dinning-offer *, .dinning-offer *:after, .dinning-offer *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.dinning-offer .row {
  /*margin-left: -10px;
  margin-right: -10px;*/
  overflow: auto;
  height: auto;
  min-width: inherit;
}

.dinning-offer .row:after, .dinning-offer .row:before {
  content: "";
  display: table;
  clear: both;
}

.dinning-offer [class*='col-'] {
  float: left;
  min-height: 1px;
  padding: 0;
  margin: 0;
  /*padding-left: 10px;
  padding-right: 10px;*/
}

.dinning-offer .col-1 {
  width: 8.333333%;
}

.dinning-offer .col-2 {
  width: 16.666667%;
}

.dinning-offer .col-3 {
  width: 25%;
}

.dinning-offer .col-4 {
  width: 33.333333%;
}

.dinning-offer .col-5 {
  width: 41.666667%;
}

.dinning-offer .col-6 {
  width: 50%;
}

.dinning-offer .col-7 {
  width: 58.333333%;
}

.dinning-offer .col-8 {
  width: 66.666667%;
}

.dinning-offer .col-9 {
  width: 75%;
}

.dinning-offer .col-10 {
  width: 83.333333%;
}

.dinning-offer .col-11 {
  width: 91.666667%;
}

.dinning-offer .col-12 {
  width: 100%;
}

.offer-item {
  border-bottom: 1px dotted #a0a0a0;
}

.offer-item p {
  margin-bottom: 15px;
  color: #333333;
  line-height: 16px;
}

.offer-item p.valid {
  margin-top: 0;
}

.offer-item .image {
  border-right: 1px dotted #a0a0a0;
  padding: 0 20px 0 0;
  margin: 20px 0 15px;
  overflow: hidden;
}

.offer-item .content {
  padding: 20px 20px 15px 10px;
}

.offer-item .desc {
  color: #333333;
  line-height: 16px;
}

/*.offer-item img {
  max-width: 100%;
}*/
.offer-item .title {
  color: #3399cc;
  display: block;
  margin-bottom: 15px;
}
.offer-item ul.list2 {
  background: none;
  border: 0;
  margin: 0 0 15px 0;
  padding: 0 0 0 5px;
}
.offer-item ul.list2 li {
  padding: 0 0 0 10px;
  font-weight: normal;
  margin-bottom: 5px;
  /*background: url("/uae/data/images/sprite_image.png") no-repeat 0 -2708px;*/
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 16px;
  color: #555555;
}
.disclaimer {
  padding: 25px 0;
  overflow: visible;
  height: auto;
}
.disclaimer h2 {
  color: #05589d;
  font-size: 11px;
  margin-bottom: 10px;
  margin-top: 0;
  float: right;
    margin-right: 22px;
}

.disclaimer ol {
  padding-left: 13px;
}
.disclaimer p, .disclaimer ol {
  margin-bottom: 15px;
}
.disclaimer p, .disclaimer ol li {
  color: #666666 !important;
  font-size: 11px;
}
.disclaimer ol, .disclaimer p {
  margin-bottom: 15px;
  margin-top: 0;
}

.dinning-offer footer {
  margin: 0px 28px 0 29px;
  padding: 16px 0 10px 0;
}

/* banner content */
.columns .level-ban-content h3 {
  text-align: left;
}
.premier-page.level-4 .citi-gold-select-banner {
  width: 100%;
  box-sizing: border-box;
  padding: 20px;
}
.premier-page.level-4 .citi-gold-select-banner .banner-content {
  width: 100%;
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
}

.premier-page.level-4 .citi-gold-select-banner .banner-content h1, .premier-page.level-4 .citi-gold-select-banner .banner-content p, .premier-page.level-4 .citi-gold-select-banner .banner-content .btn {
  font-weight: bold;
  position: static;
  font-weight: 100;
  padding-left: 0;
}

.premier-page.level-4 .citi-gold-select-banner .banner-content h1 {
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 1px;
  width: 100% !important;
}

.premier-page.level-4 .citi-gold-select-banner .banner-content p {
  font-size: 15px;
  font-weight: 100;
  width: 100% !important;
  margin-bottom: 25px;
}

.premier-page.level-4 .citi-gold-select-banner .banner-content .btn {
  background: url('/uae/data/images/level-4/line-green.jpg') 0 0 repeat-x;
  font-size: 15px;
  text-transform: uppercase;
  border-radius: 5px 5px 5px 5px;
  padding: 10px 25px;
  letter-spacing: 1px;
  display: inline-block;
  font-family: 'interstateplregular';
  text-decoration: none;
  color: rgba(0,0,0,0.2);
}

.premier-page.level-4 .citi-gold-select-banner .banner-content .btn:before {
  color: #fff;
  content: attr(data-hover);
  position: absolute;
  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  -moz-transition: -moz-transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s;
}

.premier-page.level-4 .citi-gold-select-banner .banner-content .btn:hover:before, .premier-page.level-4 .citi-gold-select-banner .banner-content .btn:focus:before {
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  transform: scale(0.9);
  opacity: 0;
}

/** pump it section start **/
.mainPump{float: left; margin: 20px 0 0;font-family: interstateplregular; width:100%;}
.pumpIt{float:left; width:100%; height:376px; background:#056CAE url(/uae/data/images/loans/background.png) bottom left no-repeat;background-size: contain;}
 .pumpIt .contentLeft, .pumpIt .contentRyt{float:left; box-sizing:border-box;}
 .pumpIt .contentLeft{width:58%;}
 .pumpIt .contentRyt{width:42%;}
 .pumpIt h2, .pumpIt h4, .pumpMsg h2, .pumpMsg h3{float:left; width:100%; text-align:center; margin:75px 0 15px !important; color:#fff;font-size:32px; line-height:40px;font-family: interstateplregular; padding:0 25px; box-sizing:border-box;}
 .pumpIt h4{margin:0 0 15px !important;font-size:24px;}
 .pumpMsg h2{margin:10px 0 15px !important; }
.pumpIt .btn_count, .pumpMsg .btn_apply_now{margin:20px auto; color:#fff;font-size:18px; display:table; border-radius:6px; font-family: interstateplregular;-o-user-select: none; -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */}
 .pumpIt .btn_count{line-height:55px;background:#CC6017; cursor:pointer;width: 150px;height: 55px; padding-left: 35px;}
  .pumpIt .btn_count:hover, .pumpIt .btn_count:focus, .pumpIt .btn_count:visited {text-decoration:none;}
 .pumpIt .btn_count i{float:left;background: url(/uae/data/images/loans/thumble.png) no-repeat; width:38px; height:23px; margin: 15px 10px 0 0;}
 .pumpIt .contentRyt{padding:20px 20px 0 0;}
  .pumpIt .contentRyt .timer_progress{float:right;}
 .pumpIt .contentRyt .clockTimer{float:right; background:url(/uae/data/images/loans/stopwatch.png) no-repeat; color: #05589D;font-size:18px; text-align:center; width:54px; height:66px; line-height: 79px; font-weight: bold; transition:0.3s ease-in-out;font-family: interstateplregular;}
.pumpPerson{float: left;margin: 43px 0 0 0;}
.pumpProgress{float: right;margin:8px 17px 0 0;background:url(/uae/data/images/loans/counter.png) no-repeat; width:18px; height:233px;}
.progressFillBg{float: left;margin:6px 0 0 5px;background:white; width:8px; height:220px; -webkit-transform-origin: 4px 50%;
    -webkit-transform: rotate(180deg);
    -moz-transform-origin: 4px 50%;
    -moz-transform: rotate(180deg);
    -ms-transform-origin: 4px 50%;
    -ms-transform: rotate(180deg);
    transform-origin: 4px 50%;
    transform: rotate(180deg);}
.progressFillOverlay{background:url(/uae/data/images/loans/counter-inner.png) no-repeat; border-radius:10px;width:8px; height:0; float:left; transition:0.3s ease-in-out;}
.pumpMsg{display:none;float:left; width:100%;height:376px; background:#056CAE; position: relative;}
.pumpMsg .pumpFadePerson{float: right;margin: 61px 110px 0 0;width:178px; height: 270px;background: url("/uae/data/images/loans/spirit.png") 0 0 no-repeat;  right:0; position:absolute; z-index:1; opacity: 0.1; fliter:alpha(opacity=10);}
.pumpMsg .pumpInnerTxt{text-align:center; position: relative; z-index: 99;float:left;width: 100%;}
.pumpMsg h3{ font-size:24px;margin:0 0 20px !important; line-height:28px;}
.pumpMsg p{font-size: 18px; color: white; margin: 0 0 20px !important; float: left; text-align: center; width: 100%;}
.pumpMsg .btn_apply_now{text-align:center; line-height:45px;background:#CC6017; cursor:pointer; width:160px; height:45px; text-decoration:none;}
.pumpPerson {float:left;width:178px;height: 270px;background: url("/uae/data/images/loans/spirit.png");}
.pumpResult{float: left; padding: 20px;width: 100%; box-sizing: border-box;}
.pumpClickCount{float: left;background:url(/uae/data/images/loans/score-board.png) no-repeat;width:52px; height:41px; color: #fff;font-family: interstateplregular; font-size: 37px; letter-spacing:7.5px;}
.btn_reply{float: right;}
.pumpClickScore{font-size: 37px;padding:0 0 0 2px; float: left; line-height:42px;}
/********** Pump it section end ************/

/** MODAL WINDOW **/

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    margin: auto;
    padding: 25px;
    width: 80%;
    max-width: 350px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.7s
}

.modal-content h3 {
  color: #05589D;
  font-weight: bold;
  margin-bottom: 15px;
}

/* HTML5 Boilerplate radio-one hidden styles */
.modal-content [type="radio"] {
  border: 0;
  height: 1px; margin: -1px;
  padding: 0;
  position: absolute;
  width: 1px;
}

/* One radio button per line */
.modal-content label {
  display: block;
  cursor: pointer;  /*hand view when on hover*/
  /*line-height: 2.5;*/
  font-size: 1.5em;
}

/* the basic, unchecked style */
.modal-content [type="radio"] + span:before {
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.25em;
  border-radius: 1em;           /*hard border*/
  border: 0.125em solid #fff;
  box-shadow: 0 0 0 0.10em #05589D;   /*light shadow*/
  margin-left: 3px;
  transition: 0.5s ease all;    /*animation here*/
}

/* the checked style using the :checked pseudo class */
.modal-content [type="radio"]:checked + span:before {
  background: #05589D;
  box-shadow: 0 0 0 0.20em #05589D;
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:5%; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:50%; opacity:1}
}

/* The Close Button */
.modal-content .close {
    color: #000;
    margin-top: 5px;
    margin-right: 5px;
    float: right;
    font-size: 28px;
    font-weight: bold;
    text-decoration: none;
}

.modal-content .close:hover,
.modal-content .close:focus, .myBtn {
    cursor: pointer;
}

@media screen and (min-width:768px) {
  .mobileonly {display: none;}
  .desktoponly {display: block;}

  .premier-page.level-4 .citi-gold-select-banner {
  	padding: 0;
  }
  .premier-page.level-4 .citi-gold-select-banner .banner-content {
    position: absolute;
    /*top: 50px;*/
    top: 50%;
    transform: translateY(-50%);
    width: 40%;
    left: 20px;
  }
  .premier-page.level-4 .citi-gold-select-banner .banner-content h1, .premier-page.level-4 .citi-gold-select-banner .banner-content p, .premier-page.level-4 .citi-gold-select-banner .banner-content .btn {
    color: #fff !important;
  }
   .premier-page.level-4 .citi-gold-select-banner.dark .banner-content h1, .premier-page.level-4 .citi-gold-select-banner.dark .banner-content p {
    color: #1d4872 !important;
  }
}