@font-face {
  font-family: CervoNeue-Black;
  src: url(CervoNeue-BlackNeue.otf);
  src: url(CervoNeue-BlackNeue.woff);
}
@font-face {
	font-family: CervoNeue-Medium;
	src: url(CervoNeue-MediumNeue.ttf);
	src: url(CervoNeue-MediumNeue.woff);
  }

html{
  height:100%;
}
body{
height:100%;
background-color: #00aadb !important;
 margin:0;
}
.element-1{
	max-width: 153px;
	height: auto;
	position: fixed;
	top: 20px;
	left: 0;
}
.element-2{
	max-width: 153px;
	height: auto;
	position: fixed;
	top: 20px;
	right: 0;
}
.element-3{
	max-width: 183px;
	height: auto;
	position: fixed;
	bottom: 20px;
	left: 0;
} 
.logo{
	position: fixed;
    left: 50%;
    bottom: -20px;
    transform: translate(-50%, -50%);
}
.logo-dq{
	max-width: 120px;
	display: block;
 	margin: auto;
}
.frase{
  position: absolute;
  top: 40%;
  left: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.frase h2{
	margin-top: 200px;
	font-size: 55px;
	text-align: center;
	font-family: CervoNeue-Black;
	color: #fff;
	margin: 0;
}
.frase h3{
	font-size: 28px;
	text-align: center;
	font-family: CervoNeue-Medium;
	margin: 10px 0 0 0;
	color: #fff;
}
.redes{
	position: fixed;
    left: 10px;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
}

.social-icons li{
	list-style-type: none;
	padding-top: 3px;
}
.social{
	max-width: 30px;
}
@media only screen and (max-width: 1280px){
	.frase h2{
		margin-top: 200px;
		font-size: 42px;
		text-align: center;
		font-family: CervoNeue-Black;
		color: #fff;
		margin: 0;
	}
	.frase h3{
		font-size: 25px;
		text-align: center;
		font-family: CervoNeue-Medium;
		margin: 10px 0 0 0;
		color: #fff;
	}
}

@media only screen and (max-width: 991px) {

.logo-dq{
	max-width: 80px;
	display: block;
 	margin: auto;
}
.element-1{
	max-width: 80px;
	height: auto;
	position: fixed;
	top: 20px;
	left: 0;
}
.element-2{
	max-width: 110px;
	height: auto;
	position: fixed;
	top: 20px;
	right: 0;
}
.element-3{
	max-width: 113px;
	height: auto;
	position: fixed;
	bottom: 20px;
	left: 0;
} 
.redes{
	position: fixed;
    left: 10px;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
}

.frase h2{
	font-size: 30px;
	text-align: center;
	font-family: CervoNeue-Black;
	color: #fff;
	margin: 0;
	z-index: 9999;
}
.frase h3{
	font-size: 18px;
	text-align: center;
	margin: 10px 0 0 0;
	z-index: 9999;
}
}

@media only screen and (max-width: 767px) {

.logo-dq{
	max-width: 80px;
	display: block;
 	margin: auto;
}
.element-1{
	max-width: 80px;
	height: auto;
	position: fixed;
	top: 20px;
	left: 0;
}
.element-2{
	max-width: 110px;
	height: auto;
	position: fixed;
	top: 20px;
	right: 0;
}
.element-3{
	max-width: 113px;
	height: auto;
	position: fixed;
	bottom: 20px;
	left: 0;
} 
.redes{
	position: fixed;
    left: 10px;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
}

.frase h2{
	font-size: 30px;
	text-align: center;
	font-family: CervoNeue-Black;
	color: #fff;
	margin: 0;
	z-index: 9999;
}
.frase h3{
	font-size: 18px;
	text-align: center;
	margin: 10px 0 0 0;
	z-index: 9999;
}
}

@media only screen and (max-width: 576px) {

.logo-dq{
	max-width: 100px;
	display: block;
 	margin: auto;
}
.element-1{
	max-width: 80px;
	height: auto;
	position: fixed;
	top: 20px;
	left: 0;
}
.element-2{
	max-width: 110px;
	height: auto;
	position: fixed;
	top: 20px;
	right: 0;
}
.element-3{
	max-width: 113px;
	height: auto;
	position: fixed;
	bottom: 20px;
	left: 0;
} 
.redes{
	position: fixed;
    left: 10px;
    top: 25%;
    transform: translate(-50%, -50%);
    z-index: 999;
}

.frase h2{
	margin-top: 280px;
	font-size: 30px;
	text-align: center;
	font-family: CervoNeue-Black;
	color: #fff;
	margin: 0;
	z-index: 9999;
}
.frase h3{
	font-size: 18px;
	text-align: center;
	margin: 10px 0 0 0;
	z-index: 9999;
}
}