#portada-t {
width: 100%;
height: 690px;
overflow: hidden;
}

#portada-t #image-tj {
width: 100%;
height: 500px;
background-image: url(../assets/img/backgroun-flou.jpg);
background-size: 1700px;
background-repeat: no-repeat;
position: relative;
background-position: center;
top: 00px;
}

#portada-t #image-tj #logo-flou {
position: relative;
float: right;
width: 310px;
top: 13%;
right: 14%;
}

#portada-t p {
width: 100%;
text-align: center;
font-family: 'PantonRegular';
font-size: 23px;
font-weight: 500;
position: relative;
top: 20px;
}

#cont-rosa {
width: 100%;
height: 450px;
overflow: hidden;
padding: 0;
background-image: url(../assets/img/background-rosa.png);
}

#cont-rosa .cont-gener {
width: 1300px;
height: 90%;
position: relative;
margin: 0 auto;
top: 13px;
}

#cont-rosa .cont-gener .porta-text {
width: 60%;
float: left;
height: 100%;
}

#cont-rosa .cont-gener .porta-text h2 {
color: #fff600;
Font-family: 'PantonRegular';
}

#cont-rosa .cont-gener .porta-text P {
color: white;
Font-family: 'PantonRegular';
font-size: 20px;
text-align: justify;
width: 98%;
top: 70px;
position: relative;
}

#cont-rosa .cont-gener .porta-img {
width: 40%;
position:  relative;
float: left;
height: 90%;
top: 20px;
}

/************************* media queries ***********************/
@media screen and (min-width: 1800px){
#portada-t #image-tj {
width: 100%;
height: 500px;
background-image: url(../assets/img/backgroun-flou.jpg);
background-position: center;
background-size: 1900px;
background-repeat: repeat;
position: relative;
top: 00px;
}
}


@media screen and (max-width: 1300px) {
#cont-rosa .cont-gener {
width: 100%;
}
    
}
    
@media screen and (max-width: 1080px) {
#portada-t #image-tj {
width: 100%;
height: 430px;
background-image: url(../assets/img/backgroun-flou.jpg);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
position: relative;
top: 00px;
}

#portada-t #image-tj #logo-flou {
float: right;
width: 220px;
top: 25%;
right: 10%;
}

#portada-t p {
width: 100%;
font-size: 23px;
font-weight: 500;
top: 30px;
position: relative;
}
    
#cont-rosa {
width: 100%;
height: 450px;
overflow: hidden;
padding: 0;
background-image: url(../assets/img/background-rosa.png);
}

#cont-rosa .cont-gener {
height: 90%;
position: relative;
top: 13px;
}

#cont-rosa .cont-gener .porta-text {
width: 60%;
float: left;
height: 100%;
}

#cont-rosa .cont-gener .porta-text h2 {
font-size: 25px;
width: 90%;
}

#cont-rosa .cont-gener .porta-text P {
text-align: justify;
width: 90%;
margin: 0 auto;
font-size: 18px;
top: 70px;
position: relative;
}

#cont-rosa .cont-gener .porta-img {
width: 40%;
top: 20px;
}
    
    #cont-rosa .cont-gener .porta-img img {
    width: 90%;
    }

} 
@media screen and (max-width: 720px) {
    
#portada-t {
width: 100%;
height: 500px;
overflow: hidden;
}

#portada-t #image-tj {
width: 100%;
height: 300px;
background-image: url(../assets/img/backgroun-flou.jpg);
background-size: 1000px;
background-position: center top;
background-repeat: no-repeat;
position: relative;
top: 00px;
}

#portada-t #image-tj #logo-flou {
float: right;
width: 190px;
top: 15%;
right: 10%;
}

#portada-t p {
width: 100%;
font-size: 16px;
font-weight: 500;
top: 30px;
position: relative;
}
    
#cont-rosa {
width: 100%;
height: 600px;
overflow: hidden;
padding: 0;
background-image: url(../assets/img/background-rosa.png);
background-position: center;
background-size: cover;
}

#cont-rosa .cont-gener {
height: 95%;
position: relative;
top: 13px;
}

#cont-rosa .cont-gener .porta-text {
width: 100%;
float: none;
height: auto;
}

#cont-rosa .cont-gener .porta-text h2 {
font-size: 24px;
width: 90%;
text-align: center;

}

#cont-rosa .cont-gener .porta-text P {
text-align: justify;
width: 90%;
margin: 0 auto;
font-size: 16px;
top: 30px;
position: relative;
}

#cont-rosa .cont-gener .porta-img {
width: 100%;
top: 50px;
text-align: center;
float: none;
}
    
#cont-rosa .cont-gener .porta-img img {
    position: relative;
    top: 30px;
    width: 60%;
    }

}  

@media screen and (max-width: 420px) {
    
#portada-t {
width: 100%;
height: 500px;
overflow: hidden;
}

#portada-t #image-tj {
width: 100%;
height: 300px;
background-image: url(../assets/img/backgroun-flou.jpg);
background-size: 900px;
background-position: center top;
background-repeat: no-repeat;
position: relative;
top: 00px;
}

#portada-t #image-tj #logo-flou {
float: right;
width: 140px;
top: 25%;
right: 10%;
}

#portada-t p {
width: 100%;
font-size: 15px;
font-weight: 500;
top: 10px;
position: relative;
}
    
#cont-rosa {
width: 100%;
height: 600px;
overflow: hidden;
padding: 0;
background-image: url(../assets/img/background-rosa.png);
background-position: center;
background-size: cover;
}

#cont-rosa .cont-gener {
height: 95%;
position: relative;
top: 13px;
}

#cont-rosa .cont-gener .porta-text {
width: 100%;
float: none;
height: auto;
}

#cont-rosa .cont-gener .porta-text h2 {
font-size: 20px;
width: 90%;
text-align: center;

}

#cont-rosa .cont-gener .porta-text P {
text-align: justify;
width: 90%;
margin: 0 auto;
font-size: 14px;
top: 30px;
position: relative;
}

#cont-rosa .cont-gener .porta-img {
width: 100%;
top: 50px;
text-align: center;
float: none;
}
    
#cont-rosa .cont-gener .porta-img img {
    position: relative;
    top: 0px;
    width: 100%;
    }

}   
    
    
    
    