*{margin:0; padding:0;}

.clear{ clear: both;}

#lista{ }
#lista h1{ font-family: 'Open Sans', sans-serif; font-weight: bold; font-size: 26px; letter-spacing: -1px; color:#666;}
#lista ul{ list-style: none;}
#lista ul li{ border-bottom: 1px solid #f6f6f6; padding: 10px;}

#box2{max-width:800px; background-color: #FFF; height: auto; margin: 0 auto; margin-top: 50px; border-radius:5px; -moz-border-radius:5px; -o-border-radius:5px; -ms-border-radius:5px; -webkit-border-radius:5px; background-repeat: no-repeat; background-position: top; background-size:contain; box-shadow: 1px 1px 1px #000; margin-bottom: 50px; padding: 20px;}

#box{max-width:1200px; background-color: #FFF; height: auto; margin: 0 auto; margin-top: 50px; border-radius:5px; -moz-border-radius:5px; -o-border-radius:5px; -ms-border-radius:5px; -webkit-border-radius:5px; background-repeat: no-repeat; background-position: top; background-size:contain; box-shadow: 1px 1px 1px #000; margin-bottom: 50px; padding: 20px;}

header{ width: 100%; height: 450px; position: relative; margin-bottom: 20px;}

#left{ height: auto; background-color: #f5f5f5; width: 550px; float: left; padding: 20px;}

#left ul{ list-style: none; text-align: center;}
#left ul li{ display: inline-block; padding: 10px; margin:10px 5px 0 5px; border-radius:3px; border-bottom: 2px solid #87C04F;}
#left ul li a{ color: #FFF;}
#left ul li a:hover{ text-decoration: none;}
#left h1{font-family: 'Open Sans', sans-serif; font-weight: bold; font-size: 30px; letter-spacing: -1px; text-align: center;}

#right{ height:auto; width: 550px; float:right; padding: 20px;}
#right h1{font-family: 'Open Sans', sans-serif; font-weight: bold; font-size: 26px; letter-spacing: -1px; text-align: center; color: #FFF; text-shadow:1px 1px 1px #000; margin-bottom: 20px;}

#right #form{ width: 90%; margin: 0 auto;}
#right #form label{ margin: 0; color: #FFF;}

small{ color: #FFF;}

.copy{ color: #FFF; padding-bottom: 20px; font-size:12px;}
.copy a{ color: #FFF;}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


#sucesso{ width: 700px; background-color: #FFF; padding: 20px; height: auto; margin:0 auto; margin-top: 50px; border-radius: 5px;}
#sucesso h1{ text-transform: uppercase; font-weight: normal; font-size: 24px; text-align: center;}
#sucesso h2{ text-transform: uppercase; font-weight: bold; font-size: 20px; text-align: center; color: #666;}


/* Tablet  */
@media only screen 
and (min-width : 960px) 
and (max-width : 1200px){
    
 #box{ max-width:inherit; width: 90%;}
 #right{ width: 400px;}   
}

@media only screen 
and (min-width : 768px) 
and (max-width : 1024px){
   
 header{ height: 350px;}   
 #box{ max-width:inherit; width: 90%;}
 #right{ width: 45%;}
 #left{ width: 50%;} 

}


@media only screen 
and (min-width : 568px) 
and (max-width : 768px){
   
 header{ height: 350px;}   
 #box{ max-width:inherit; width: 90%;}
 #right{ width: 45%;}
 #left{ width: 50%;} 

}

/* Celular  */
@media only screen 
and (min-width : 320px) 
and (max-width : 568px){
     #etiqueta{display: none;}
     header{height: 100px;}   
     #box{max-width:inherit; width: 90%;}
     #right{width: 100%; float: inherit;}
     #left{width: 100%; float: inherit; margin-bottom: 20px;}    

}