/* GENERAL - RESET CSS */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}textarea:focus,input[type="text"]:focus{outline: none}

/* FONTS */
@font-face{font-family:'rethink'; src:url('fonts/rethink.woff2') format('woff2'); font-weight:normal; font-style:normal;}
@font-face{font-family:'playfair'; src:url('fonts/playfair.woff2') format('woff2'); font-weight:normal; font-style:normal;}

/* GENEREAL */


html, body{display:flex; flex-direction:column; align-items:center; justify-content:space-between; font-family:'rethink'; width:100%; height:100%; background:#FFFBEF;}
html{font-size:20px; line-height:1.25;
  @media screen and (max-width:1100px) {font-size:15px;}
  @media screen and (max-width:700px) {font-size:12px;}
}

body{font-size:1rem; line-height:1.25; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
a{text-decoration:none; color:inherit; cursor:pointer;
  &:hover{text-decoration:underline;}
}
header{padding:4% 2rem;
  a{
    img{}
  }
}
main{padding:3% 2rem 8%; display:flex; flex-direction:column;
  h1{font-size:3rem; text-align:center;}
  p{font-size:1.35rem; font-weight:600; max-width:25rem; align-self:flex-end; margin:2% 0 0 0; position:relative;
    &:before{content:url('img/arrow.svg'); position:absolute; right:0; bottom:100%;
      @media screen and (max-width: 1100px) {right:-5%; transform-origin:center bottom; transform:scale(.7);}
    }
    a{white-space:nowrap; position:relative;
      &:after{content:url('img/play.svg'); position:absolute; top:100%; right:0;}
    }
  }
  span{font-family:'playfair';}
}
footer{padding:1% 2rem;
  a{font-size:1.1rem; text-decoration:underline; font-weight:600;}
}