.bg1 { background-image: url(../images/DESAFIO_01_2880.jpg) }
.bg2 { background-image: url(../images/DESAFIO_02_2880.jpg) }
.bg3 { background-image: url(../images/DESAFIO_03_2880.jpg) }
.bg4 { background-image: url(../images/DESAFIO_04_2880.jpg) }
.bg5 { background-image: url(../images/DESAFIO_05_2880.jpg) }


@media all and (max-width: 1680px),
	   all and (max-device-width: 1680px) { 

  .bg1 { background-image: url(../images/DESAFIO_01_1680.jpg) }
  .bg2 { background-image: url(../images/DESAFIO_02_1680.jpg) }
  .bg3 { background-image: url(../images/DESAFIO_03_1680.jpg) }
  .bg4 { background-image: url(../images/DESAFIO_04_1680.jpg) }
  .bg5 { background-image: url(../images/DESAFIO_05_1680.jpg) }
}

@media all and (max-width: 1440px),
	   all and (max-device-width: 1440px) {

	_body { background-image: url(../images/DESAFIO_01_1440.jpg) }	   
  .bg1 { background-image: url(../images/DESAFIO_01_1440.jpg) }
  .bg2 { background-image: url(../images/DESAFIO_02_1440.jpg) }
  .bg3 { background-image: url(../images/DESAFIO_03_1440.jpg) }
  .bg4 { background-image: url(../images/DESAFIO_04_1440.jpg) }
  .bg5 { background-image: url(../images/DESAFIO_05_1440.jpg) }
}

@media all and (max-width: 1439px),
	   all and (max-device-width: 1439px) {
		   
  .bg1 { background-image: url(../images/DESAFIO_01_1024.jpg) }
  .bg2 { background-image: url(../images/DESAFIO_02_1024.jpg) }
  .bg3 { background-image: url(../images/DESAFIO_03_1024.jpg) }
  .bg4 { background-image: url(../images/DESAFIO_04_1024.jpg) }
  .bg5 { background-image: url(../images/DESAFIO_05_1024.jpg) }
		   
	#bottom { height: 320px }
	
	#social {
		margin: 40px auto 30px;
		text-align: center;
		height: 35px;
		float: none;
	}
  #social .info{
    padding: 0;
  }
	
	#countdown {
		margin: 0 auto;
		text-align: center;
		float: none;
	}
	
	#social > div,
	#countdown > div {
		display: inline-block;
	}
	
	#countdown > div > div > p.label { 
		margin-top: 135px; 
		opacity: 1;
	}

}

@media all and (max-width: 768px),
	   all and (max-device-width: 768px) {
		  
	_body { background-image: url(../images/DESAFIO_01_768.jpg) }
  .bg1 { background-image: url(../images/DESAFIO_01_768.jpg) }
  .bg2 { background-image: url(../images/DESAFIO_02_768.jpg) }
  .bg3 { background-image: url(../images/DESAFIO_03_768.jpg) }
  .bg4 { background-image: url(../images/DESAFIO_04_768.jpg) }
  .bg5 { background-image: url(../images/DESAFIO_05_768.jpg) }

}

@media all and (max-width: 660px),
	   all and (max-device-width: 660px) {
	
	header { top: 5% }
	
	header > h3 {
		text-indent: 0;
		text-align: center;
		font-style: normal;
		font-weight: 600;
	}
	
	/*#bottom { height: 200px }*/
  #bottom { height: 87px }
	
	#social {
		font-size: 1.1em;
		margin: 0px auto 30px;
	}
	
	#social > div > ul {
		margin: 10px 0;
		display: block;
		float: none;
	}
	
	#social > div > span {
		margin: 5px 0;
		float: none;
		display: block;
	}
	
	#social > div > span:first-child {
		margin-top: 10px;
	}
	
	#countdown {
    display: none;
		font: 400 4em 'Rambla';
	}
	
  #countdown > div > div#days > p.label,
  #countdown > div > div > p.label{
    width: 70px;
    padding: 7px 0;
    text-align: center;
  }
 
  #countdown > div > div > div{
    width: 35px;
  }
  #countdown > div > div > p.label{
    margin-top: 80px;
  }
	#feedback {
		position: absolute;
		padding: 20px 0;
		width: 100%;
	}
	
	#feedback h2,
	#feedback .descr,
	#feedback .body {
		padding: 0 20px;
	}
	
	#feedback h2 {
		font-size: 1.2em
	}
	
	#feedback > .descr {
		font-size: .85em;
	}	
	
	#feedback > .body { 
		height: 35px;
		overflow: hidden; 
	}

	
	#feedback > .close {
		margin-top: -35px;
		margin-right: 10px;	
	}
	
	#feedback form > div.inp {
		width: 100%;
		text-align: center;
		float: none;
	}
	
	#feedback form > div.btn {
		margin-top: 5px;
		width: 100%;
		float: none;
		text-align: center;
	}
	
	#feedback form button {
		margin: 0;
		float: none;
	}
	
	span.email-no {
		position: absolute;
		margin-top: -23px;
		right: 30px;
		white-space: nowrap;
	}
	
	#feedback .feedback-arr {
		left: 50%;
		margin-left: -25px;
	}
}
@media all and (max-width: 550px),
	   all and (max-device-width: 550px) {
  header{
    left: 0;
    width:100%;
  }
  header h1 div{
    width: 100%;
    background-size: 100%;
    background-position: center center;
  }
  header h2{
    width: 100%;
    margin-left: 0;
    display:block;
  }
  header h3{
    margin-left: 0;
    width:100%;
        display:block;
  }
  #pattern{
    top: 0
  }
  #bottom{
  bottom: 19%;
    height:100px;
  }
}

/* Alto */
@media all and (max-height: 780px) and (min-width: 661px) {
  header{
    top: 0%;
    left: 5%;
  }
  #social{
    margin: 15px auto;
  }
  
  #bottom{
    height: 250px;
    bottom: 14%;
  }
  #countdown{

  }
  #countdown > div > div > div {

  }
}