@font-face {
    font-family: 'Neue Plak Extended';
    src: url('../font/NeuePlak-ExtendedRegular.woff2') format('woff2'),
        url('../font/NeuePlak-ExtendedRegular.woff') format('woff');
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Plak Extended Bold';
    src: url('../font/NeuePlak-ExtendedBold.woff2') format('woff2'),
        url('../font/euePlak-ExtendedBold.woff') format('woff');
    font-style: normal;
    font-display: swap;
}

* {margin:0; padding-top: 0; font-family: 'Neue Plak Extended'}
html, body {height:100%;}

a {cursor: pointer;}


h1,h2,h3,h4,h5,h6 {font-family: 'Neue Plak Extended Bold';}
h2 {padding-bottom: 200px;}
h2, h5 {line-height: 37px; font-size: 15px; font-family: 'Neue Plak Extended Bold';}
h3, h4 {padding-bottom: 16px;} 
h3 {text-transform: uppercase;}
.author {line-height: 37px; font-size: 14px; margin-bottom: 40px; display: block;margin-left: -100px;}
h6 {margin-top: 40px;line-height: 37px; font-size: 15px; font-family: 'Neue Plak Extended Bold'; margin-bottom: 20px;}

h5 a {color:#000000; font-family: 'Neue Plak Extended Bold'; text-decoration: none; margin-top: 40px; display: block; padding-bottom: 12px; transition:all 0.2s ease-in-out 0s;}
h5 a::after {content: url("../img/arrow-link.svg"); margin-left: 10px;}

b {font-family: 'Neue Plak Extended Bold'; font-weight: normal;}

p {padding-bottom: 20px;line-height: 25px; font-size: 17px;}
p a {transition:all 0.2s ease-in-out 0s; color: #000000; font-weight: bold;}
p a:hover, h5 a:hover {transition:all 0.2s ease-in-out 0s; color: #FF0099; text-decoration: underline; }


blockquote {font-family: 'Neue Plak Extended Bold'; padding-bottom: 20px;line-height: 28px; font-size: 21px; margin-top: 40px; padding-bottom: 0; margin-left: -100px;max-width: 62%;}
ul {padding-left: 0px; max-width: 200px;}



li {color:#000000; font-family: 'Neue Plak Extended'; text-decoration: none; list-style: none; }
li a {color:#000000;padding-left: 10px;display: block;}
li a:hover {color:#FFFFFF;padding-left: 10px;transition:all 0.4s ease-in-out 0s;}
li::before {
  color: #000000; 
}


.cont{position:relative; display:block; padding:0 0px; margin-bottom: 1px; cursor:pointer;}
.text{position:relative;text-decoration: none;top: 0px; }
.text::before{content: attr(data-text); position:absolute;color:#fff; line-height: 22px; width:0; overflow:hidden; transition:.6s; text-decoration: none;}
.cont::before{content:"•"; width:0%; height:100%; position:absolute; background:#FF0089; left:0;top:-2px; transition:.4s;}
.cont:hover .text::before, .cont:hover::before{width:100%; color: white} 



.logo {max-width: 190px;}


#intro {background-color: #F8F7F6; padding: 210px 40px;} 
#intro header, #intro .cover, #main-content {width: 100%; max-width: 1120px; margin: 0 auto;}
.content {padding: 140px 0px;} 


.cover {display: flex; justify-content: space-between;} 
img {width: 100%;}


 


.cover-col1 {width: 60%; padding-right: 15%;}
/*.cover-col1 p {text-align: justify;}*/
.cover-col1 img {margin-bottom: 20px;}


.cover-col2 {width: 25%; margin-top: -183px;}
.cover-col2 img {max-width: 140px; mix-blend-mode: multiply;}


.img-hover-zoom img {transition: transform .4s ease;}
.img-hover-zoom:hover img {transform: scale(1.2);}


.cover-col2 p, .cover-col2 a  {line-height: 16px; font-size: 14px;}
#main-content p {line-height: 16px; font-size: 14px; margin-bottom: 40px;}

#main-content {max-width: 1200px;}
.content {padding: 140px 40px;} 


#about ul {padding-left: 0px; max-width: 100%; margin-bottom: 60px;}
.about {padding-bottom: 80px;}
#about .cover-col2 {margin-top: 0px;}
#about h5 a {margin-top: 0;}
#about .cover-col2 ul {padding-left: 0px;max-width: 200px;}

.premios li a {display: inline-block; padding: 0;}
.premios li a:hover {transition:all 0.2s ease-in-out 0s; color: #FF0099; text-decoration: underline; }




/* responsive */


@media (min-width:980px){
.anima {
            stroke-dasharray:1118 1120;
            stroke-dashoffset:1119;
            fill:#F8F7F6;
            animation:anima_draw 5000ms ease-in 0ms forwards;
                }

@keyframes anima_draw {100%{stroke-dashoffset:0;fill:#000000;}}
@keyframes anima_fade{0%{stroke-opacity:1;}97.8021978021978%{stroke-opacity:1;}100%{stroke-opacity:0;}}
}

@media (max-width:980px){

.cover {display: block;} 
.cover-col1 {width: auto; padding-right: 0;}
.cover-col2 {width: auto; margin-top: 60px;}
blockquote {margin-left: 0px;max-width: 60%;}
.author {margin-left: 0px;}

}


@media (max-width:768px){

#intro {padding: 100px 40px;} 
.cover-col1 {width: 100%; float: none;}
.cover-col2 {width: 50%; float: none;}
h2 {padding-bottom: 100px;}
.cover-col1 img {margin-bottom: 60px;}

}


