@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');
/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/******************************
* Reset
******************************/
*{
 border: 0px;
 margin: 0px;
 padding: 0px;
}
body{
 font-family: 'Open Sans', sans-serif;
}
img {
 max-width: 100%;
}
a, a:hover {
 text-decoration: none;
 color: inherit;
}

/******************************
* Jumbotron
******************************/

/******************************
* header
******************************/
.cont-h {
 border-bottom: 1px solid #000000;
 margin-bottom: 15px;
 padding: 15px;
 color: #353535;
 text-align: center;
}
.logo {
 position: relative;
 margin: auto;
 max-width: 550px;
 padding: 0 50px;
}

.face, .inst {
 position: absolute;
 margin: auto;
 width: 23px;
 height: 23px;
}
.face {
 top: 50%;
 bottom: 50%;
 left: 0;
}
.inst {
 top: 50%;
 bottom: 50%;
 right: 0;
}

.icon {
 display: block;
 width: 23px;
 height: 23px;
}
.fb {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/fb-nyx-mx.png") center;
 background-size: cover;
}
.inst {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/inst-nyx-mx.png") center;
 background-size: cover;
}



/******************************
* contenido
******************************/
.m-b  {
 margin-bottom: 15px;
}
.registro {
 background: url("http://image.mail.nyxcosmetics.mx/lib/fe8313727c6c0d7a77/m/1/fondonegronyx.jpg") center;
 background-size: cover;
 width: 100%;
 padding: 120px 15px;
 text-align: center;
 overflow: hidden;
 position: relative;
}
.r-t{
 color: #fff;
 margin-bottom: 50px;
}
.r-t h3{
 font-weight: bold;
 font-size: 27px;
 margin: 0;
}
.r-t span{
 color: #fff;
 font-size: 21px;
 font-weight: 300;
}
.nyx {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/back-dva-mx.jpg") center;
 background-size: cover;
 width: 100%;
 padding: 100px 20px;
}
.n-t {
 margin-bottom: 10px;
}
.aper {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/back-tri-mx.jpg") center;
 background-size: cover;
 width: 100%;
 padding: 45px 15px;
}
.contenido {
 max-width: 50%;
 color: #fff;
 text-align: center;
}
.t-1 {
 font-size: 24px;
 font-weight: bold;
 margin: 0 0 25px;
}
.suc {
 display: inline-block;
 background: #d2057a;
 padding: 5px 10px;
 text-transform: uppercase;
 margin: 0 0 25px;
}
.fecha {
 color: #d2057a;
 font-weight: 800;
 font-size: 40px;
 margin: 0 0 25px;
}
.contenido img {
 margin: 0 0 25px;
}
.redes{
 margin: 0 0 25px;
}
.icon-aper {
 display: inline-block;
 width: 34px;
 height: 30px;
 margin: 0 15px;
 overflow: hidden;
 text-indent: -999px;
 background-size: contain;
}
.fb-aper {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/aper-fb-nyx-mx.png") center no-repeat;
}
.ins-aper {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/aper-ins-nyx-mx.png") center no-repeat;
}
.tw-aper {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/aper-tw-nyx-mx.png") center no-repeat;
}
.mail {
 font-size: 18px;
}


.formulario {
 max-width: 400px;
 margin: auto;
}
.campo { 
 margin-bottom: 25px;
}
.cumple { 
 margin-bottom: 35px;
}
.cumple input.bd{
 width: 23.666%;
 float: left;
}
.bd {
 /*width: 25%;*/
 float: left;
 display: block;
 padding: 8px 10px;
 color: #fff;
 font-weight: 100;
 text-align: left;
}
input[type="text"]{
    background: transparent;
    display: inline-block;
    width: 100%;
    padding:8px;
    color: #fff;
    font-weight: 100;
    border-bottom: 1px solid #d2057a;
}
input[type="text"]:focus { 
    outline: none;
}
input::-webkit-input-placeholder {
  color: #fff;
  opacity: .6;
}
.boton {
 padding: 5px  20px;
 background: #d2057a;
 color: #fff;
}


/******************************
* jorosho
******************************/
.jorosho {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/jorosho-nyx-mx.jpg") center;
 background-size: cover;
 width: 100%;
 padding: 200px 15px;
 text-align: center;
}
.jorosho .r-t {
 margin: 0;
}
.jorosho .r-t h3{
 font-weight: bold;
 font-size: 70px;
 margin: 0;
 color: #d2057a;
}
.jorosho .r-t span{
 color: #d2057a;
 font-size: 37px;
 font-weight: bold;
}

/******************************
* Plojo
******************************/
.plojo {
 background: url("http://image.news.redken.com/lib/fe8313727c6c0d7a77/m/1/plojo-mx.jpg") center;
 background-size: cover;
 width: 100%;
 padding: 200px 15px;
 text-align: center;
}
.plojo .r-t {
 margin: 0;
}
.plojo .r-t h3{
 font-weight: bold;
 font-size: 37px;
 margin: 0;
}



/******************************
* footer
******************************/

.t-f {
 border-top: 1px solid #000000;
 padding: 15px;
 color: #353535;
 text-align: center;
}
.t-f span{
 color: #818181;
}



/******************************
* MOBILE
******************************/

@media (max-width: 479px) {

.contenido {
    max-width: 70%;
}
.fecha {
    font-size: 30px;
}
.bd {
    width: 100%;
}
.cumple input.bd {
    width: 33.33%;
    float: left;
}
.r-t h3 {
    font-size: 17px;
}
.r-t span {
    font-size: 14px;
}

.t-1 {
    font-size: 17px;
}
.fecha {
    font-size: 22px;
}
.icon-aper {
    width: 28px;
    height: 24px;
    margin: 0 5px;
    background-size: contain;ver;
}
.mail {
    font-size: 14px;
}


.jorosho .r-t h3 {
    font-size: 55px;
}
.jorosho .r-t span {
    font-size: 29px;
}

.plojo .r-t h3 {
    font-size: 28px;
}

.plojo, .jorosho {
    padding: 140px 15px;
}


@media (min-width: 480px) and (max-width: 767px) {


}

@media (max-width: 767px) {

}

@media (min-width: 768px) and (max-width: 991px) {


}

@media (min-width: 992px) and (max-width: 1199px) {


}


