body{
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
}

@font-face {
font-family: 'Optima';
font-style: normal;
font-weight: normal;
src: local('Optima'), url('../fonts/OPTIMA.woff') format('woff');
}


@font-face {
font-family: 'Optima Italic';
font-style: normal;
font-weight: normal;
src: local('Optima Italic'), url('../fonts/Optima_Italic.woff') format('woff');
}


@font-face {
font-family: 'Optima Medium';
font-style: normal;
font-weight: normal;
src: local('Optima Medium'), url('../fonts/OptimaMedium.woff') format('woff');
}

@font-face {
    font-family: 'sublima';
    src: url('../fonts/sublima-light-webfont.woff2') format('woff2'),
         url('../fonts/sublima-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
font-family: 'Optima Bold';
font-style: normal;
font-weight: normal;
src: local('Optima Bold'), url('../fonts/OPTIMA_B.woff') format('woff');
}

@font-face {
    font-family: 'neue-light';
    src: url('../fonts/NeueHaasUnicaPro-Light.woff2') format('woff2'),
        url('../fonts/NeueHaasUnicaPro-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'neue-ultralight';
    src: url('../fonts/NeueHaasUnicaPro-UltraLight.woff2') format('woff2'),
        url('../fonts/NeueHaasUnicaPro-UltraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'neue-bold';
    src: url('../fonts/NeueHaasUnicaPro-Bold.woff2') format('woff2'),
        url('../fonts/NeueHaasUnicaPro-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'px-ligthita';
    src: url('../fonts/PxGrotesk-LightIta.woff2') format('woff2'),
        url('../fonts/PxGrotesk-LightIta.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'px-light';
    src: url('../fonts/PxGrotesk-Light.woff2') format('woff2'),
        url('../fonts/PxGrotesk-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'px-regular';
    src: url('../fonts/PxGrotesk-Regular.woff2') format('woff2'),
        url('../fonts/PxGrotesk-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


a:hover{
  text-decoration: none;
}
.cursor{
  cursor: pointer;
}
.btn, input[type="button"],
input[type="reset"],
input[type="submit"]{
  transition: linear 200ms;
}
.btn:hover, input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover{
  color: initial;
  opacity: 0.8;
}
.btn.bg-azul:hover{
  color: white;
}
.bg-amarillo, .bx-wrapper .bx-pager.bx-default-pager a , .ui-slider-bg, .woocommerce-form-login__submit{
  background-color: #ffff01;
  background: linear-gradient(to right, #f2fe57 0%, #b4fe53 100%);
  color:white;
}
.bg-azul, .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus{
  background-color: #0100cc !important;
  color:white;
}
.bg-gris{
  background-color: #5f5f5f;
}
.bg-grisclaro{
  background-color: #bbb9ba;
}
.hover{
  transition: 100ms linear;
}
.hover:hover{
  cursor: pointer;
  opacity: 0.7;
}
.bg-blanco{
  background-color: white;
}
.bg-negro{
  background-color: black;
  /*background-color: #242424;*/
}
.color-amarillo{
  color: #ffff01;
}
.color-azul{
  color: #0100cc;
}
.color-blanco{
  color: white !important;
}
.color-gris{
  color: #5f5f5f;
}
.color-grisclaro{
  color: #bbb9ba;
}
.font-g{
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
}
.font-gbold{
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
}
.font-gm{
  font-family: 'gm', sans-serif;
}
.font-sublima{
  font-family: 'sublima', sans-serif;
}
.font-poppins{
  font-family: 'Poppins', sans-serif;
}
.font-px{
  font-family: 'px-light', sans-serif;
}
.font-neue{
  font-family: 'neue-light', sans-serif;
}

.line2{
  line-height: 1.2;
}
.line3{
  line-height: 1.3;
}
.line4{
  line-height: 1.4;
}
.line5{
  line-height: 1.5;
}



.underline-amarillo{
  text-decoration: underline;
  text-decoration-color: #ffff01;
}
.underline-azul{
  text-decoration: underline;
  text-decoration-color: #0100cc;
}
.border-azul{
  border: thin solid #0100cc;
}
.input-azul{
  border: thin solid #0100cc;
  border-radius: 0px;
  width: 100%;
}
.strong{
  font-weight: bold;
}
.h7{
  font-size: 0.8rem;
  margin-bottom: 0.4rem;
}
.h8{
  font-size: 0.6rem;
  margin-bottom: 0.3rem;
}
.shadow{
  -webkit-box-shadow: -1px 0px 28px -11px rgba(0,0,0,0.75);
  -moz-box-shadow: -1px 0px 28px -11px rgba(0,0,0,0.75);
  box-shadow: -1px 0px 28px -11px rgba(0,0,0,0.75);
}
.fixcode{
  position: fixed;
  top:0;
}
.tooltip-inner, .ui-tooltip{
	color: white;
	background-color: #0100cc;
}
.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before{
	border-bottom-color: #0100cc;
}


.titulo-grande{
  font-size: 100px;
}
.vertical-center{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}




/* margin */
.m0{
  margin: 0;
}
.m10{
  margin: 10px;
}
.m20{
  margin: 20px;
}
.m30{
  margin: 30px;
}
.m40{
  margin: 40px;
}
.m50{
  margin: 50px;
}

.mtop10{
  margin-top: 10px;
}
.mtop20{
  margin-top: 20px;
}
.mtop30{
  margin-top: 30px;
}
.mtop40{
  margin-top: 40px;
}
.mtop50{
  margin-top: 50px;
}

.mright10{
  margin-right: 10px;
}
.mright20{
  margin-right: 20px;
}
.mright30{
  margin-right: 30px;
}
.mright40{
  margin-right: 40px;
}
.mright50{
  margin-right: 50px;
}

.mbottom5{
  margin-bottom: 5px;
}
.mbottom10{
  margin-bottom: 10px;
}
.mbottom20{
  margin-bottom: 20px;
}
.mbottom30{
  margin-bottom: 30px;
}
.mbottom40{
  margin-bottom: 40px;
}
.mbottom50{
  margin-bottom: 50px;
}

.mleft10{
  margin-left: 10px;
}
.mleft20{
  margin-left: 20px;
}
.mleft30{
  margin-left: 30px;
}
.mleft40{
  margin-left: 40px;
}
.mleft50{
  margin-left: 50px;
}

/* padding */
.p0{
  padding: 0;
}
.p5{
  padding: 5px;
}
.p10{
  padding: 10px;
}
.p20{
  padding: 20px;
}
.p30{
  padding: 30px;
}
.p40{
  padding: 40px;
}
.p50{
  padding: 50px;
}

.ptop5{
  padding-top: 5px;
}
.ptop10{
  padding-top: 10px;
}
.ptop20{
  padding-top: 20px;
}
.ptop30{
  padding-top: 30px;
}
.ptop40{
  padding-top: 40px;
}
.ptop50{
  padding-top: 50px;
}

.pright5{
  padding-top: 5px;
}
.pright10{
  padding-right: 10px;
}
.pright20{
  padding-right: 20px;
}
.pright30{
  padding-right: 30px;
}
.pright40{
  padding-right: 40px;
}
.pright50{
  padding-right: 50px;
}

.pbottom5{
  padding-bottom: 5px;
}
.pbottom10{
  padding-bottom: 10px;
}
.pbottom20{
  padding-bottom: 20px;
}
.pbottom30{
  padding-bottom: 30px;
}
.pbottom40{
  padding-bottom: 40px;
}
.pbottom50{
  padding-bottom: 50px;
}

.pleft5{
  padding-left: 5px;
}
.pleft10{
  padding-left: 10px;
}
.pleft20{
  padding-left: 20px;
}
.pleft30{
  padding-left: 30px;
}
.pleft40{
  padding-left: 40px;
}
.pleft50{
  padding-left: 50px;
}

.btn{
  padding-left: 20px;
  padding-right: 20px;
}

.container{
  max-width: 1280px;
}