@font-face {
	font-family: 'AvertaBlack';
	src: url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-black-webfont.woff2") format("woff2"), 
		url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-black-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: 'AvertaBold';
	src: url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-bold-webfont.woff2") format("woff2"), 
		url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-bold-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-weight: normal;
}

@font-face {
  font-family: 'AvertaSemiBold';
  src: url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-semibold-webfont.woff2") format("woff2"),
       url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-semibold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
	font-family: 'AvertaRegular';
	src: url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-regular-webfont.woff2") format("woff2"), 
		url("https://s3.eu-west-1.amazonaws.com/prd273.tm-intl-pci.mfol.prod1.eu-west-1.tmaws-static-pages/media/tmeu/spain/feature/fonts/averta/averta-regular-webfont.woff") format("woff");
	font-style: normal;
	font-weight: normal;
}


/*
This CSS resource incorporates links to font software which is
the valuable copyrighted property of WebType LLC, The Font Bureau
and/or their suppliers. You may not
attempt to copy, install, redistribute, convert, modify or reverse
engineer this font software. Please contact WebType with any
questions: http://www.webtype.com
*/

html {
    background-color: #121212;
}

.frame {
	width: 100% !important;
}

#mainContent {
	padding: 0 !important;
}

#mainContent .staticpage img{
	max-width: 100%;
}

.staticpage {
	max-width: 100%;
	background-color: #121212;
	color: #FFFFFF;
}

.staticpage * {
	box-sizing: border-box !important;
	/*line-height: 1.4em;*/
	font-family: 'AvertaRegular', sans-serif;
	font-size: 100%;
	max-width: 100%;
}

.staticpage iframe {
    width: calc(100vw - 30px);
    max-width: none;
    margin-left: calc(50% - 50vw + 15px);
}

.staticpage .container {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 20px;
	background: none;
}

.staticpage .row{
	margin-right: 0;
  margin-left: 0;
}

.staticpage h1,
.staticpage h2,
.staticpage h3,
.staticpage h4,
.staticpage h5,
.staticpage h6,
.staticpage b {
	font-family: 'AvertaBold', sans-serif;
}

/*
.staticpage h1,
.staticpage h2,
.staticpage h3,
.staticpage h4,
.staticpage h5,
.staticpage h6{
	padding-left: 0;
	padding-right: 0;
}
*/

.staticpage p {
	margin: 0 0 20px 0;
	padding: 0;
	font-size: 16px;
	line-height: 20px;
}

.staticpage a{
	text-decoration: underline;
	color: #024ddf;
}

.staticpage a:hover, .staticpage a:focus, .staticpage a:active{
	text-decoration: none;
	color: #023EB2;
}

.staticpage .module-header {
	width: 100%;
	overflow: hidden;
	background: #121212;
	color: #ffff;
	text-align: center;
}

.staticpage .module-header p.intro{
	margin: 50px 0 0;
	padding: 0;
	font-size: 22px;
	line-height: 24px;
	font-family: 'AvertaRegular', sans-serif;
}

.staticpage .module-header h1 {
	margin: 0 0 60px 0;
	padding: 0;
	color: #ffff;
	text-transform: uppercase;
	font-size: 32px;
}

.staticpage .module-header h1 span {
	position: relative;
	z-index: 1;
	font-family: 'AvertaBlack', sans-serif;
	font-size: 42px;
	line-height: 46px;
}

.staticpage .module-header .awards-logo{
	margin: 0 0 50px 0;
	text-align: center;
}

.staticpage .module-header .awards-logo .glitch {
  position: relative;
	margin: 0 auto;
	max-width: 150px;
}

.staticpage .module-header .awards-logo img{
		max-width: 150px;
}

.line:not(:first-child) {
  position: absolute;
  top: 0;
  left: 0;
}

.line:nth-child(2) {
  -webkit-animation: glitch1 3000ms -600ms linear infinite, glitch2 500ms -611ms linear infinite;
          animation: glitch1 3000ms -600ms linear infinite, glitch2 500ms -611ms linear infinite;
}


.staticpage .module-voting{
	padding-top: 50px;
	padding-bottom: 50px;
	padding-left: 0;
	padding-right: 0;
}

.staticpage .module-voting p.big{
	font-size: 20px;
	line-height: 26px;
}

.staticpage .module-voting .voting-form{
	padding: 30px 0;
}



/* MEDIA QUERIES HERE */

@media (min-width: 576px) {

	.staticpage .module-voting {
		padding-left: 20px;
		padding-right: 20px;
	}

}

/* Medium devices (tablets, 768px and up)*/

@media (min-width: 768px) {

	.staticpage .module-header {
		text-align: left;
	}

	.staticpage .module-header p.intro{
		margin: 120px 0 0;
	}

	.staticpage .module-header h1 span{
		font-size: 48px;
		line-height: 52px;
	}

	.staticpage .module-header .awards-logo{
		margin: 50px 0 50px 0;
	}

	.staticpage .module-voting{
		padding-top: 60px;
		padding-bottom: 80px;
	}

	.staticpage .module-header .awards-logo .glitch {
		margin: 0 0 0 auto;
	}

}


/* Large devices (desktops, 992px and up)*/

@media (min-width: 992px) {

	.staticpage .module-header p.intro{
		font-size: 24px;
        line-height: 26px;
	}

	.staticpage .module-header h1 span{
        font-size: 80px;
		line-height: 69px;
	}

	.staticpage .module-header .awards-logo{
		margin: 60px 0;
	}

	.staticpage .module-voting{
		padding-top: 60px;
		padding-bottom: 100px;
	}

}


/* Extra large devices (large desktops, 1200px and up)*/

@media (min-width: 1200px) {
	.staticpage .container {
		max-width: 970px;
		padding-left: 30px;
		padding-right: 30px;
	}
}




/*Animations*/

@-webkit-keyframes glitch1 {
  0% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 110%, 0 110%);
            clip-path: polygon(0 100%, 100% 100%, 100% 110%, 0 110%);
  }
  100% {
    -webkit-clip-path: polygon(0 -10%, 100% -10%, 100% 0%, 0 0);
            clip-path: polygon(0 -10%, 100% -10%, 100% 0%, 0 0);
  }
}

@keyframes glitch1 {
  0% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 110%, 0 110%);
            clip-path: polygon(0 100%, 100% 100%, 100% 110%, 0 110%);
  }
  100% {
    -webkit-clip-path: polygon(0 -10%, 100% -10%, 100% 0%, 0 0);
            clip-path: polygon(0 -10%, 100% -10%, 100% 0%, 0 0);
  }
}


@-webkit-keyframes glitch2 {
	0% {transform: translateX(0);}
  85% {transform: translateX(0px);}
  90% {transform: translateX(-10px);}
  95% {transform: translateX(5px);}
  100% {transform: translateX(0);}
}
@keyframes glitch2 {
  0% {transform: translateX(0);}
  85% {transform: translateX(0px);}
  90% {transform: translateX(-10px);}
  95% {transform: translateX(5px);}
  100% {transform: translateX(0);}
}
