html, body
{
  margin: 0px auto;
  height: 100%;
}


/* Default Navbar */
@media only screen and (max-width:620px) {
  /* For mobile phones: */
  .menu, .main, .right {
    width:100%;
  }
}
@media screen and (max-width: 980px) {
#contenedor-imagen{
  width:100px;
  height: auto;
}

#contenedor-imagen img{
  width:100%;
  height: auto;
}
}
.navbar
{
  background-color:#fff;
  box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
  width:100%;
  font-size: 16px;
  padding: 1px 2px 0px 4px;
}

.single-page .navbar { z-index: 10; position: fixed; }
.single-page .navbar-collapse { flex-grow: unset; }

.navbar ul { padding: 0; margin-bottom: 11px; }
.navbar ul li.language a
{
  border-left: solid 1px #000;
  border-right: solid 1px #000;
  padding-right: 10px;
  padding-left: 10px;
}
.navbar ul li.language a:first-child { border-left: none; }
.navbar ul li.language a:last-child { border-right: none; }

.navbar .non-collapse { margin: auto; }
.navbar .non-collapse ul li:first-child { margin-left: 10px; }
.navbar .non-collapse ul li:last-child { margin-right: -12px; }
.navbar .non-collapse ul.navbar-nav { display: block; }

.navbar ul.right { margin-right: 0px; margin-left: auto; }
.navbar ul li.right { margin-right: 0px; margin-left: auto; }
.navbar li { padding: 2px 3px; font-size: 14px; margin-top: 11px; margin-right: 8px; height: 26px; display: inline-block; }
.navbar li a { font-weight: 700; color: #000; }
.navbar li a:hover { text-decoration: none; border-bottom: solid 3px #f11; }

.navbar-brand { position: static; top: 0; }
.navbar-brand img { margin: 2px 5px; height: 36px;  }

@media (min-width: 768px)
{
  .navbar li { padding: 0px 25px; font-size: 16px; margin-right: 0px }
}

@media (max-width: 767px)
{
  .navbar ul li.language a:first-child { margin-left: -10px; }
  .navbar li { font-size: 13px };
}

@media(max-width: 371px)
{
  .navbar #buy_product_nav { display:none; }
  .navbar #topup_nav { display:none; }
}





.userspace { overflow: hidden; }
.top-navbar .userspace
{
  padding-top: 50px;
  position: relative;
  min-height: 100%;
}

.single-page .userspace
{
  padding-top: 50px;
  min-height: 100%;
}



section { display: flex; overflow: hidden;  }
.top-navbar section {  min-height: 100%; width: 100%; }
.single-page section { position: relative; border-top: solid 50px #fff; background: #f3f3f3; }
.single-page section:first-child { border-top: none; }
section .card { min-height: 350px; border: none; margin-top: 20px; background-color: #fafafa;}

section h1 { text-align: center; margin: 20px 0px 10px; font-size: 45px; font-weight: 700; }

@media (max-width: 575px)
{
  section h1 { margin: 15px 0px 5px; font-size: 35px; }
}
@media (max-width: 360px)
{
  section h1 { margin: 10px 0px 5px; font-size: 26px; }
}



/* Default Footer */

.footer
{
  padding: 15px 15px 30px;
  background-color: #222;
  color: #eee;
  box-shadow: 0px 0px 4px rgba(0,0,0,0.2);
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
}




.top-navbar .footer
{
  height: 220px;
  width: 100%;
  /* top: 100%; */
}
.footer img.find-us { max-width: 80px; vertical-align: baseline; }
.footer .find-us p { display: inline-block; }

.footer .brand { padding: 0px 10px; }
.footer .address-column { padding: 0px 10px; }




/* subscriptions SECTION */

section.subscriptions { padding-bottom: 20px; }
section.subscriptions .row.top { display: block; width: 100%; margin: 0; }
section.subscriptions .boxes { display: flex; }
section.subscriptions .subscription-box
{
  background-color: #fff;
  margin: 10px 10px 20px;
  padding: 10px 0px;
  box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
  max-width: 90%;
}
section.subscriptions .subscription-box h1 { font-size: 22px; margin: 4px 0px; }
section.subscriptions .subscription-box h2 { font-size: 14px; margin: 14px 0px 2px; text-align: center; }
section.subscriptions .subscription-box h3 { font-size: 12px; margin: 4px 0px 4px; text-align: center; }

section.subscriptions .subscription-box img
{
  width: 90%;
  margin: 12px 8px 8px;
  max-width: 320px;
  display: block;
}

section.subscriptions .subscription-box .pie-box { display: inline-block; font-size: 12px; margin: 0px 0px 8px 0px; }
section.subscriptions .subscription-box .pie-box p { margin-top: -9px; height: 38px; overflow: hidden; }
section.subscriptions .subscription-box .pie-box .pie { width: 120px; height: 130px; display: inline-block; }

@media (max-width: 360px)
{
  section.subscriptions .subscription-box h3 { font-size: 9px; }
}



/* wizard-pane used by topup, login and more */
section .wizard-pane { border-left: solid 1px #e4e4e4; }
section .wizard-pane form { text-align: center; }
section .wizard-pane .col-1 .fa { font-size: 40px; padding-top: 8px; }
/* section .wizard-pane .form-group input { margin: 0px 0px 5px 0px; } */
/* section .wizard-pane .form-group:first-child input { margin: 0px 0px 15px 0px; } */
section .wizard-pane .info.row { display: table; margin: 0; padding: 15px 0px 5px; vertical-align: middle; width: 100%;}
section .wizard-pane .info.row>p { display:table-cell; text-align: left; font-size: 16px; padding: 10px 5px 5px 5px; vertical-align: middle; }
section .wizard-pane .info.row .icon { display:table-cell; text-align: left; font-size: 50px; padding: 6px 10px 0px; vertical-align: middle; width: 60px;}
section .wizard-pane form>button { margin: 30px; }
section .wizard-pane .form-control { font-size: 15px; }
section .wizard-pane .show_input_number { text-align: center; font-size: 28px; color: rgba(0,0,0,0); font-weight: 400;}
section .wizard-pane .show_input_number .highlight { font-size: 34px; font-weight: 700; }
section .wizard-pane .btn-next { margin-top: 50px; }
section .wizard-pane .btn-lg { margin-top: 20px; margin-bottom: 20px; }
section .wizard-pane input,select,label
{
  color: #000;
  font-family: "Segoe UI", "Open Sans", Verdana, Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 600;
}

section .wizard-pane .form-group label,.form-group .control-label { text-align: right; padding: 5px 0px 0px 5px; }
section .wizard-pane .form-group #btn_file {padding-top: 10px;}
section .wizard-pane .form-group .doc-option{padding-top: 5px;}
section .wizard-pane .info.row #completed_details_txt
{
  font-size: 16px;
  padding: 40px 10px 5px 10px;
  vertical-align: middle;
  border: 0px;
  font-weight: 400;
  width:90%;
  resize: none;
}
section .wizard-pane .id_card img {max-width: 320px; width: 100%; padding-bottom: 20px;}
section .wizard-pane .form-group .number
{
  background-color: #faf9f9;
  padding: 20px;
  border: 1px solid #e6e6e6;
  border-radius: 6px;
  margin: 10px auto;
}

@media (max-width: 575px)
{
  section .wizard-pane .form-group label{ text-align: left; }
  section .wizard-pane .form-group .control-label, .doc-option {text-align: left; padding-bottom: 10px;}
  .form-group #btn_file, .sm-gap {padding-top: 10px;}
  section .wizard-pane .info.row #completed_details_txt { padding: 20px 5px 5px 5px; }
}
@media (max-width: 360px)
{
  section .wizard-pane .info.row>p { font-size: 15px; }
}

.form-group #btn_file .btn-file input[type="file"]
{
  position: absolute;
  /*top: 0;*/
  right: 0;
  /*min-width: 100%;*/
  /*min-height: 100%;*/
  font-size: 999px;
  /*text-align: right;*/
  /*filter: alpha(opacity=0);*/
  opacity: 0;
  /*outline: none;*/
  /*background: white;*/
  cursor: inherit;
  /*display: block;*/
}

/* known-splash splash section */
section.unknown-splash { min-height: 700px; }
.single-page section.unknown-splash { margin-top: 0px; min-height: 600px; }


section.known-splash { min-height: 700px; background-color: #fff}
.single-page section.known-splash { margin-top: 0px; min-height: 550px; }
@media(min-width: 600px) { .single-page section.known-splash { min-height: 700px; } }
@media(min-width: 900px) { .single-page section.known-splash { min-height: 800px; } }
@media(min-width: 1100px) { .single-page section.known-splash { min-height: 1000px; } }

section.known-splash .subscription-box
{
  background-color: rgba(255,255,255,0.6);
  height: auto;
  width: auto;
  padding: 10px;
  border-radius: 10px;
  margin: 0 auto;
  margin-top: 25px;
  max-width: 500px;
}
section.known-splash .subscription-box h2 { color: #000; text-shadow: none; font-size: 20px; margin: 0px 0px 10px 5px; }
section.known-splash .subscription-box h1 { color: #000; text-shadow: none; font-size: 28px; text-align: center; margin: 80px 0px; }
section.known-splash .subscription-box img { width: 240px; margin: 5px; display: block; }

section.known-splash .subscription-box .subscription_usage .panel-pie { height: 60px; width: 60px; }
section.known-splash .pie { height: 45px; }
section.known-splash .subscription-box .subscription_usage .service { max-height: 260px; padding-top: 5px; }
section.known-splash .subscription-box .subscription_usage { display: flex; }
section.known-splash .subscription-box .panel-pie .pie-info {  text-align: center; font-size: 9px;}
section.known-splash .subscription-box .bundle_description {padding-top: 5px}

section.known-splash .account-box
{
  background-color: rgba(255,255,255,0.6);
  height: auto;
  width: auto;
  max-width: 450px;
  padding: 10px;
  border-radius: 0px;
  margin: 0 auto;
  margin-top: 100px;
  border:  1px ridge silver;
}
section.known-splash .account-box h3
{
  color: #fff;
  font-size: 34px;
  font-weight: 600;
  text-shadow:  0px 0px 5px rgba(0,0,0,0.9);
}

@media(max-width: 767px)
{
 section.known-splash .account-box h3 {font-size: 30px; }
 section.known-splash .account-box {max-width: 350px; margin-top: 25px;}
}




/* logged-in splash section */
section.logged-in-splash { min-height: 270px; }
section.logged-in-splash h1 a { text-decoration: none; color: #000; }
section.logged-in-splash .background
{
  overflow: hidden;
  z-index: 0;
  height: 100%;
  width: 100%;
  position: absolute;
  background: url('/vno/logged_in_splash_bg.jpg') center center / cover no-repeat;
}
section.logged-in-splash h1
{
  text-align:center;
  color: #fff;
  text-shadow: 0px 0px 5px rgba(0,0,0,0.9);
  margin: 15px 0px;
  padding:0;
}

section.logged-in-splash h2
{
  text-align:left;
  color: #fff;
  font-size: 23px;
  font-weight: 600;
  text-shadow: 0px 0px 5px rgba(0,0,0,0.9);
  margin: 10px 0px;
  padding:0;
}
section.logged-in-splash .account-data { margin: 110px 20px 0px 20px; }

@media(min-width: 768px)
{
  section.logged-in-splash h1 { font-size: 50px; }
  section.logged-in-splash h2 { font-size: 35px; }
  section.logged-in-splash .account-data{ margin-top: 135px; margin-left:20px; }
  section.logged-in-splash { min-height: 400px; }
}
@media (max-width: 360px)
{
  section.logged-in-splash h2 { font-size: 16px; }
  section.logged-in-splash .account-data { margin: 130px 10px 0px 10px; }
}




/* account overview section */
section .wizard-pane h3.balance
{
  background-color: #3030a0;
  color: #fff;
  font-size: 40px;
  border-radius: 10px;
  display: inline-block;
  margin: 0px;
  padding: 5px 20px 10px;
}
section.overview .wizard-pane .info.row { margin: 5px 0px 0px; }

/* login section */
section.login { min-height: 450px; }
.top-navbar section.login { height: 100%; position: absolute; }


/* topup section */
section.topup { min-height: 600px; }
.top-navbar section.topup { height: 100%; }

.payment-box
{
  background-color: #fff;
  padding: 10px;
  margin: 10px -5px 20px;
  box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
}
section .wizard-pane .payment-box .form-group label { padding: 5px 0px 0px 15px; }
.payment-box img.top { margin: 25px; }
.payment-box .header { padding-bottom: 5px; border-bottom: solid 1px #ddd; }
.payment-box img.product-visual
{
  max-width: 320px;
  margin: 15px 15px 25px;
  display:block;
  box-shadow: 0 0 2px 1px rgba(0,0,0,0.2);
}
.payment-box img.voucher_cards { width: 100%; padding-bottom: 15px; }
.payment #payment_img img {max-width: 320px; width: 100%; padding: 20px;}
.payment #paypal_form #btn_paypal_purchase img {max-width: 145px; width: 100%; padding: 10px;}
.topup_creditcard .payment {padding-left: 0px; padding-right: 0px; }
.payment-box .payment-type {padding-top: 15px;}
.info-form {padding-top: 10px; padding-left: 5px}
section.topup .summary-number { font-size: 40px; font-weight: 700;}
section.topup .summary-amount
{
  display: inline-block;
  background-color: #337AB7;
  color: #fff;
  padding: 14px 28px;
  border-radius: 10px;
  font-size: 40px;
  font-weight: 700;
}



/* offers section */
section.offers .product-box
{
  background-color: #fff;
  padding: 20px 10px;
  margin: 10px 10px 20px;
  box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
}
section.offers .product-box .header { padding-bottom: 5px; border-bottom: solid 1px #ddd; }
section.offers .product-box h3 { text-align: center; margin: 20px 0px 0px;}
section.offers .product-box .product-type { text-align: center; }
section.offers .payment-box .pin-field { width: 400px; }
section.offers .product-box .product-type img
{
  margin: 20px 5px;
  max-width: 90%;
  cursor:pointer;
}
@media (max-width: 360px)
{
  .product-box h3 { font-size: 16px; }
}



/* prices section */
section.prices table
{
  margin: 0px 0px;
  background-color: #fff;
  box-shadow: 0 0 2px 2px rgba(0,0,0,0.2);
  border-radius: 8px;
  width: 90%;
}

section.prices table.prices_images
{
  margin: 0px 0px;
  background-color: unset;
  box-shadow: unset;
  border-radius: unset;
  width: 90%;
}

section.prices table .title { min-width: 138px; }
section.prices table th { text-align: unset; }
section.prices .img-short-code { width: 230px; }
@media(max-width: 405px)
{
  section.prices table { font-size: 15px; }
  section.prices table .title { min-width: 110px; }
}
@media(min-width: 768px) { section.prices table { margin: 0px 20px; }}
@media(max-width: 767px) { section.prices table td { padding: 5px; margin: 0px 20px; }}


/* shortcodes section */

section.shortcodes table
{
  margin: 0px 0px;
  background-color: #fff;
  box-shadow: 0 0 2px 2px rgba(0,0,0,0.2);
  border-radius: 8px;
  width: 90%;
}

section.shortcodes table .title { min-width: 138px; }
section.shortcodes .img-short-code { width: 230px; }
@media(max-width: 405px)
{
  section.shortcodes .img-short-code { width: 175px;}
  section.shortcodes table { font-size: 15px; }
  section.shortcodes table .title { min-width: 110px; }
}
@media(min-width: 768px) { section.shortcodes table { margin: 0px 20px; }}
@media(max-width: 767px) { section.shortcodes table td { padding: 5px; margin: 0px 20px; }}




/*ACCOUNT_INFO SECTION*/
section.account_info .wizard-pane .edit-btn { padding-bottom: 10px;}
section.account_info .wizard-pane .statement-btn {padding-bottom: 15px}
section.account_info .account-box .header { padding-bottom: 5px; border-bottom: solid 1px #ddd; }
section.account_info .account-box
{
  background-color: #fff;
  padding: 20px 10px;
  margin: 10px 10px 20px;
  box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
}
section.account_info .account-box #change_pass_form {padding: 5px}
section.account_info .details, section.account_info .details .row .input-group {padding: 10px;}




/* Self activation */
section.activation .select {color: #0f6e00; font-size: 1.5rem;}

section.activation .msisdn_option { margin: 15px auto; }
section.activation #new_number button { margin:10px; }
section.activation #own_number { margin-top: 30px; }
section.activation table td,th { text-align: center; }
section.activation table td { cursor:pointer; }
section.activation #btn_activate { margin: 40px; }

section.activation label, .input-group { margin-bottom: 13px; }
@media(max-width: 575px)
{
  section.activation label { margin-bottom: 5px; margin-top: 10px;}
  section.activation .input-group { margin-bottom: 5px; }
}
section.activation p { text-align: left; margin-top: 12px; }
section.activation .wizard-pane .form-group { margin-bottom: 5px; }
section.activation .temporary_number { margin-top: 26px; }
section.activation .activation-box
{
  background-color: #fff;
  padding: 30px 25px;
  margin: 10px -5px 20px;
  box-shadow: 0 0 4px 5px rgba(0,0,0,0.1);
  margin-left: 30px;
  float: right;
}

section.activation #verify_account div h4 { margin:10px; text-align: center; }

/* bootstrap restyling for mobile */
.btn { box-shadow: 0 0 2px 2px rgba(0,0,0,0.10); }

.spinner {z-index:100; font-size: 80px; position: absolute; left:45%;top: 35%}




/*Splashbutton page*/

.button-splash-page .userspace
{
  /*padding-top: 48px;*/
  position: relative;
  min-height: 100%;
}

.button-splash-page section { position: relative; border-top: solid 10px #fff; }
.button-splash-page section:first-child { border-top: none; }

section.button-splash #splashbuttons
{
  /*background-color: #fff;*/
  padding: 30px 25px;
  margin: 10px -5px 20px;
  height: auto;
  max-width: 450px;
  box-shadow: 0 0 4px 5px rgba(0,0,0,0.1);
  float: right;
}

@media(min-width: 768px) {
  section.button-splash #splashbuttons{margin-left: 40px;}
}

 /*font-size: 45px; text-shadow: 0px 0px 5px rgba(0,0,0,0.9);color: #fff;*/
section.button-splash #splashbuttons.one {background: url('/vno/topup_other_face.jpg') center center; }
section.button-splash #splashbuttons #offers_splash{font-size: 45px; color: #fff; text-shadow: 0px 0px 5px rgba(0,0,0,0.9)}
section.button-splash #splashbuttons.two {background: url('/vno/happy_man.jpg') center center;}
section.button-splash #splashbuttons #topup_splash{font-size: 45px; color: #fff; text-shadow: 0px 0px 5px rgba(0,0,0,0.9)}
section.button-splash #splashbuttons.three {background: url('/vno/subsciption_splash.jpg') center center;}
section.button-splash #splashbuttons #subs_splash{font-size: 45px; color: #fff; text-shadow: 0px 0px 5px rgba(0,0,0,0.9)}



/* Half donut for usage */

.chart-usage
{
  position: relative;
  width: 140px;
  height: 70px;
  overflow: hidden;
  margin: 20px auto 5px auto;
  padding-left: 0px;
}
.chart-usage::before,.chart-usage::after {  position: absolute; }

.chart-usage::before {
  content: '';
  width: inherit;
  height: inherit;
  border: 35px solid rgba(211,211,211,.3);
  border-bottom: none;
  border-top-left-radius: 100px;
  border-top-right-radius: 100px;
}

.chart-usage::after {
  left: 50%;
  bottom: 0px;
  transform: translateX(-50%);
  font-size: 16px;
  font-weight: 500;
  color: #000909;
}

.chart-usage li
{
  position: absolute;
  top: 100%;
  left: 0;
  width: inherit;
  height: inherit;
  border: 35px solid;
  border-top: none;
  border-bottom-left-radius: 100px;
  border-bottom-right-radius: 100px;
  transform-origin: 50% 0;
  animation-fill-mode: forwards;
  animation-timing-function: linear;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  color: transparent;
}

.chart-usage span
{
  position: absolute;
  font-size: .95rem;
  backface-visibility: hidden;
  animation: fade-in .4s linear forwards;
}

.chart-usage.service .usage:nth-child(1) { z-index: 2; }


@media(max-width: 570px)
{
  .chart-usage { width: 75px; height: 38px; margin-top: 0px; }
  .chart-usage::before { border: 20px solid rgba(211,211,211,.3); border-bottom: none; }
  .chart-usage::after { font-size: 13px; }
  .chart-usage li { border: 20px solid; border-top: none; }
}


/*PAYG*/

section.pay_as_you_go { min-height: 300px; }
section.pay_as_you_go .service-payg { margin-top: 25px; margin-bottom: 25px; }
section.pay_as_you_go .service-payg p { margin: 2px auto 2px 37% }
section.pay_as_you_go .service-payg p .badge
{
  font-size: 100%;
  font-weight: 600;
  color: white;
  margin-right: 5px;
  width: 58px;
}
section.pay_as_you_go .service-payg #data_info .badge { background-color: orange; }
section.pay_as_you_go .service-payg #voice_info .badge { background-color: red; }
section.pay_as_you_go .service-payg #sms_info .badge { background-color: green; }
section.pay_as_you_go label.balance_remaining { font-size: 20px; margin-bottom:20px; }
section.pay_as_you_go .row{ margin: 0px; }
section.pay_as_you_go .payg_visual { padding-top: 50px; }

.service-payg .chart-usage
{
  width: 300px;
  height: 150px;
  margin-bottom:10px;
  list-style-type: none;
}
.service-payg .chart-usage::before
{
  border: 45px solid rgba(211,211,211,.3);
  border-bottom: none;
  border-top-left-radius: 150px;
  border-top-right-radius: 150px;
}
.service-payg .chart-usage li
{
  border: 45px solid;
  border-top: none;
  border-bottom-left-radius: 150px;
  border-bottom-right-radius: 150px;
  color: #000;
}

.service-payg .chart-usage li:nth-child(1) { z-index: 3; }
.service-payg .chart-usage li:nth-child(2) { z-index: 2; }
.service-payg .chart-usage li:nth-child(3) { z-index: 1; }


@media(max-width: 1210px) { .service-payg .chart-usage { width: 240px; height: 120px; } }
@media(max-width: 1080px)
{
  .payg_visual center img { width:160px; padding-top: 20px;}
}
@media(max-width: 470px)
{
  section.pay_as_you_go .service-payg p { margin-left: 18%; }
  .service-payg .chart-usage { width: 240px; height: 120px; }
  #button_payg_usage { padding:0px;}
  #button_payg_usage button{ margin: 0px 5px 20px 5px;}

}




.iti__flag {background-image: url("build/img/flags.png");}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .iti__flag {background-image: url("build/img/flags@2x.png");}
}


@font-face{
  
   
  src:url(font/Gotham-Book.ttf);
  font-family:Gotham;
}


////


@font-face {
    font-family: 'Gotham';
    font-style: normal;
    font-weight: 400;
    src: local('Gotham'), url('font/GothamBook.woff') format('woff');
}
@font-face {
    font-family: 'Gotham';
    font-style: italic;
    font-weight: 400;
    src: local('Gotham'), url('font/GothamBookItalic.woff') format('woff');
}
@font-face {
    font-family: 'Gotham';
    font-style: normal;
    font-weight: 300;
    src: local('Gotham'), url('font/GothamLight.woff') format('woff');
}
@font-face {
    font-family: 'Gotham';
    font-style: italic;
    font-weight: 300;
    src: local('Gotham'), url('font/GothamLightItalic.woff') format('woff');
}

@font-face {
    font-family: 'Gotham';
    font-style: italic;
    font-weight: 500;
    src: local('Gotham'), url('font/GothamMediumItalic.woff') format('woff');
}
@font-face {
    font-family: 'Gotham';
    font-style: italic;
    font-weight: 700;
    src: local('Gotham'), url('font/GothamBoldItalic.woff') format('woff');
}
@font-face {
    font-family: 'Gotham Black';
    font-style: normal;
    font-weight: 500;
    src: local('Gotham Black'), url('font/Gotham-Black.woff') format('woff');
}
@font-face {
    font-family: 'Gotham Light';
    font-style: normal;
    font-weight: 500;
    src: local('Gotham Light'), url('font/Gotham-Light.woff') format('woff');
}
@font-face {
    font-family: 'Gotham Thin';
    font-style: normal;
    font-weight: 500;
    src: local('Gotham Thin'), url('font/Gotham-Thin.woff') format('woff');
}
@font-face {
    font-family: 'Gotham XLight';
    font-style: normal;
    font-weight: 500;
    src: local('Gotham XLight'), url('font/Gotham-XLight.woff') format('woff');
}
@font-face {
    font-family: 'Gotham Book';
    font-style: italic;
    font-weight: 500;
    src: local('Gotham Book'), url('font/Gotham-BookItalic.woff') format('woff');
}
@font-face {
    font-family: 'Gotham Thin';
    font-style: italic;
    font-weight: 500;
    src: local('Gotham Thin'), url('font/Gotham-ThinItalic.woff') format('woff');
}
@font-face {
    font-family: 'Gotham Ultra';
    font-style: italic;
    font-weight: 500;
    src: local('Gotham Ultra'), url('font/Gotham-UltraItalic.woff') format('woff');
}
@font-face {
    font-family: 'Gotham XLight';
    font-style: italic;
    font-weight: 500;
    src: local('Gotham XLight'), url('font/Gotham-XLightItalic.woff') format('woff');
}