/* FONTS */
@import url("https://nworkforce.com/librerias/css/fonts/fonts.css");

:before, :after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
html { background-color: #000; }
body { font: "DINPro", "Trebuchet MS", Helvetica, sans-serif; color: #fff; margin: 0; padding: 0; }
sup { font-size: 0.5em !important; vertical-align: super; top: -0.5px; }
hr { width: 100%; border: 1px solid #666; margin: 1.5rem auto;}
.legal { font-size: x-small; color: #666; display: block;  }
label { white-space: nowrap; }
.cursor { cursor: pointer; }
.italic { font-style: italic; }
.fpo-logo { max-height: 45px; }

.bigtitle { font-size: 280% !important; }
.bigsubtitle { font-size: 180%; }

.w60 { width: 60%; }
.w80 { width: 80%; }

.pb-less { padding-bottom: 0 !important; }
.pt-less { padding-top: 0 !important; }
.pv-less { padding-top: 0 !important; padding-bottom: 0 !important; }
.mb-less { margin-bottom: 0 !important; }
.mt-less { margin-top: 0 !important; }
.mt-10 { margin-top:10px; }
.mt-20 { margin-top:20px; }
.mt-30 { margin-top:30px; }
.mt-40 { margin-top:40px; }
.mt-60 { margin-top:60px; }
.mt-90 { margin-top:90px; }

.mt-10v { margin-top: 10vw; }

.mb-10 { margin-bottom:10px; }
.mb-20 { margin-bottom:20px; }
.mb-30 { margin-bottom:30px; }
.mb-40 { margin-bottom:40px; }
.mb-60 { margin-bottom:60px; }
.mb-90 { margin-bottom:90px; }
.mb-120 { margin-bottom:120px; }

.mb-10v { margin-bottom: 10vw; }
.mt-5v { margin-top: 5vw; }
.mb-50v { margin-bottom: 50vw; }


.mr-10p { margin-right:10%; }

.pb-10 { padding-bottom: 10px; }
.pb-60 { padding-bottom: 60px; }
.pr-10 { padding-right: 10px; }
.pl-10 { padding-left: 10px; }
.pl-50 { padding-left: 50px; }
.pt-10 { padding-top: 10px; }
.pt-60 { padding-top:60px; }

.border { border-bottom: 1px solid rgba(255, 255, 255, 0.5) !important; }
.container-m { max-width: 1300px; margin: auto; }
.notification { background-color: transparent; padding-top: 0; }
.box { background: transparent; box-shadow: unset;}
.subtitle sup { font-size: 0.5em; }

.logos { max-height: 50px; max-width: 170px; }
.logosdlss { max-height: 50px; max-width: 170px; }
.cgreen { color: #76b900 !important; }
.cwhite { color: #fff !important; }
.fgeforceb { font-family: "geforce-bold"; }
.fgeforcel { font-family: "geforce-light"; }
.fgeforcebalt { font-family: "geforce-bold-notch" !important; }
.notchL { font-family: "geforce-light-notch"; }
.notchB { font-family: "geforce-bold-notch"; }

/*.disponiblesolo .container-m .columns .column .columns .card .card-content { padding: 0; }*/

.tile .title { font-size: 219%; line-height: 100%; padding: 0 5%; margin: 0 0 1.25rem; }
.tile .subtitle { font-size: 180%; line-height: 100%; padding: 0 5%; margin: 0 0 0.25rem; text-align: unset;}
.tile .is-small { padding: 0 5% 1.5%; }

.button { font-weight: bolder; text-transform: uppercase; background-color: #76b900; border: 1px solid #76b900; color: #fff; border-radius: 0px;}
.button:visited { color: #fff; background-color: #76b900; }
.button:hover { color: #76b900; background-color: transparent; border-color: #76b900; }
.button:active, .button:focus { color: #fff; background-color: #76b900; border-color: #76b900; }

.header { background: url("../img/header.png") no-repeat center right; background-size: contain; z-index: 1; }
.rtxon { background: url("../img/rtxon.png") no-repeat top center; background-size: cover; margin-top: 5px; }
.dlss { background: url("../img/dlss.png") no-repeat top center; background-size: cover; margin-top: 5px; }
.disponiblesolo { background: url("../img/disponiblesolo.png") no-repeat top center; background-size: cover; /*margin-top: 5px;*/ }
.victoria { background: url("../img/victoria.png") no-repeat top center; background-size: cover; margin-top: 5px; }
.creatividad { background: url("../img/creatividad.png") no-repeat top center; background-size: cover; margin-top: 5px; }
.transmite { background: url("../img/transmite.png") no-repeat top center; background-size: cover; margin-top: 5px; }
.directx { background-image: url("../img/directxLogo.png"), url("../img/directx.png"); background-repeat: no-repeat; background-position: right bottom, center top; background-size: cover; margin-top: 5px; }
.altura60ba { background: url(../img/altura60.png) no-repeat bottom center; background-size: cover; margin-top: 5px;}
.raytracing { background-image: url("../img/raytracinglogos.png"), url("../img/raytracinglogos2.png"), url("../img/raytracingoff.png"), url("../img/raytracingon.png"),url("../img/raytracing.png"); background-repeat: no-repeat; background-position: left bottom, right top, left bottom, right bottom, center center; background-size: contain, contain, contain, contain, cover; margin-top: 5px; }
.altura60 {height:75vh; margin-top: -10vh;}
.bundle { background: url("../img/bundle.png") no-repeat top center; background-size: cover; margin-top: 5px; }
.beneficios { background-color: #1a1a1a; }
.beneficios .card { margin-bottom:15px; border:12px solid #1a1a1a; padding: 0px; background-color: #000;}
.beneficios .card .card-content { padding: 5% 5%; height: 90%;}

.bundle ul li { margin-left: 1em; } 
.bundle ul li::before { content: ">"; color: rgb(118, 185, 0); font-weight: bold; display: inline-block; width: 1em; margin-left: -1em; }

.card { background-color: unset; box-shadow: unset; color: unset; }
.card .card-content { color: #fff; padding-top: 0; padding-bottom: 0; font-size: 86%; }
.card .card-footer { border: unset; padding-top: 20px; }
.card .card-footer .button,
.card .card-footer .button:visited,
.card .card-footer .button:hover,
.card .card-footer .button:active,
.card .card-footer .button:focus { color: #fff; background-color: #76b900; font-weight: bolder; text-transform: uppercase; flex-grow: 0; margin: auto; border-radius: 0px; }


.shopping { padding-top: 5%; }
.shopping .tile p.is-small { width: 80%; margin: auto; }

footer { margin: 4% 16% 8%; font: 70% "DINPro"; color: rgba(255, 255, 255, 0.5); }
footer .line { margin: 0 0 4%; background: url("../img/gline.svg") center center repeat-x; height: 37px; background-size: contain; }

.modal { z-index: 999; }
/* .modal-close { position: relative; right: -334px; top: -400px; } */
.modal-content { width: 50%; }

/* MOBILE SMALL */
@media only screen and ( max-width: 320px) {
  .notification { padding: 0; }

  .header { background: url("../img/header_mobile.png") no-repeat top center; background-size: 100%; padding-top: 75vw; }
  .header .is-pulled-right { float: unset !important; }
  h3.title,
  .tile .title { font-size: 200% !important;  }
  .tile .subtitle { font-size: 140%; padding: 3% 5%; }
  .logos.rtx { display:none; }

  .rtxon { background: url("../img/rtxonm.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .creatividad { background: url("../img/creatividadm.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .victoria { background: url("../img/victoriam.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .transmite { background: url("../img/transmitem.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .altura60back { background: url("../img/altura60m.png") no-repeat top center; background-size: 100%; padding-top: 60vw;}

  /*.rtxon, .creatividad { background-size: 150%; background-position: top right; padding-top: 60vw; }
  .victoria, .transmite { background-size: 150%; background-position: top left; padding-top: 60vw; }*/

  .directx { background-image: url("../img/directxLogo.png"), url("../img/directx_mobile.png"); background-position: right top, center top; background-size:150%, 100%; padding-top: 60vw; }
  .bundle { background: url("../img/bundle_mobile.png") no-repeat top center; background-size: 150%; padding-top: 80vw; }

  .w60 { width: 100%; }
  .modal-content { width: 90%; }
  .disponiblesolo .container-m .columns .column .columns .card .card-content { padding: 2px; }
}
/* MOBILE BIG */
@media only screen and (min-width: 321px) and (max-width: 480px) {
  .notification { padding: 0; }

  .header { background: url("../img/header_mobile.png") no-repeat top center; background-size: 100%; padding-top: 75vw; }
  .header .is-pulled-right { float: unset !important; }
  h3.title,
  .tile .title { font-size: 220% !important;  }
  .tile .subtitle { font-size: 140%; padding: 3% 5%; }
  .logos.rtx { display:none; }

  .rtxon { background: url("../img/rtxonm.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .creatividad { background: url("../img/creatividadm.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .victoria { background: url("../img/victoriam.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .transmite { background: url("../img/transmitem.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .altura60back { background: url("../img/altura60m.png") no-repeat top center; background-size: 100%; padding-top: 60vw;}

  /*.rtxon, .creatividad { background-size: 150%; background-position: top right; padding-top: 60vw; }
  .victoria, .transmite { background-size: 150%; background-position: top left; padding-top: 60vw; }
  .directx { background-image: url("../img/directxLogo.png"), url("../img/directx_mobile.png"); background-position: right top, center top; background-size: 150%, 100%; padding-top: 60vw; }
  .bundle { background: url("../img/bundle_mobile.png") no-repeat top center; background-size: 150%; padding-top: 80vw; }*/

  .w60 { width: 100%; }
  .card-image { max-width: 300px; margin: auto; }
  .modal-content { width: 90%; }
  .disponiblesolo .container-m .columns .column .columns .card .card-content { padding: 2px; }
}  
/* PHABLET */
@media only screen and (min-width: 481px) and (max-width: 640px) {
  .notification { padding: 0; }

  .header { background: url("../img/header_mobile.png") no-repeat top center; background-size: 100%; padding-top: 75vw; }
  .header .is-pulled-right { float: unset !important; }
  h3.title,
  .tile .title { font-size: 250% !important;  }
  .tile .subtitle { font-size: 140%; padding: 3% 5%; }
  .logos.rtx { display:none; }

  .rtxon { background: url("../img/rtxonm.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .creatividad { background: url("../img/creatividadm.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .victoria { background: url("../img/victoriam.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .transmite { background: url("../img/transmitem.png") no-repeat top center; background-size: 100%; padding-top: 60vw; }
  .altura60back { background: url("../img/altura60m.png") no-repeat top center; background-size: 100%; padding-top: 60vw;}

  /*.rtxon, .creatividad { background-size: 150%; background-position: top right; padding-top: 60vw; }
  .victoria, .transmite { background-size: 150%; background-position: top left; padding-top: 60vw; }
  .directx { background-image: url("../img/directxLogo.png"), url("../img/directx_mobile.png"); background-position: right top, center top; background-size: 150%, 100%; padding-top: 60vw; }
  .bundle { background: url("../img/bundle_mobile.png") no-repeat top center; background-size: 150%; padding-top: 80vw; }*/

  .w60 { width: 80%; }
  .card-image { max-width: 300px; margin: auto; }
  .modal-content { width: 70%; }
} 
/* TABLET PORTRAIT */
@media only screen and (min-width: 641px) and (max-width: 720px) {
  .notification { padding: 0; }
  .header { padding-top: 40%; background-position: top center; }
  .grafica { padding-top: 35vw; }
  .shopping .tile p.is-small { width: 100%; margin: auto; }
  .shopping .card .card-image { max-width: 300px; margin: auto; }
  .modal-content { width: 70%; }
  .altura60 {height:60vh; margin-top: -15vh;}
  
} 
/* TABLET LANDSCAPE */
@media only screen and (min-width: 721px) and (max-width: 960px) {
  .notification { padding: 0; }
  .header { padding-top: 20px; background-position: top right; }
  .header .is-half-tablet { width: 50%;}
  .shopping .tile p.is-small { width: 90%; margin: auto; }
  .shopping .card .card-image { max-width: 300px; margin: auto; }
  .modal-content { width: 70%; }
  .altura60 {height:60vh; margin-top: -15vh;}
}
/* Desktop BREAKPOINT */
@media only screen and (min-width: 961px) and (max-width: 1280px) {
  .notification { padding: 0; }
  .header { background-position: top right; }
  .shopping .tile p.is-small { width: 90%; margin: auto; }
  .shopping .card .card-image { max-width: 300px; margin: auto; }
  .modal-content { width: 70%; }
}