img,
picture,
video,
embed {
   max-width: 100%;
}

#icon-menu, #hide{display:none;color:#844b8d}
/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block}
mark, rp, rt, ruby, summary, time {display:inline}
/* Left & Right alignment */
.left {float:left}
.right {float:right}
.wrapper {width:100%;overflow:hidden}
.wrap1{width:965px;margin-left:-5px;padding-left:5px}
.wrap{overflow:hidden;width:965px;margin-left:-5px;padding-left:35px;height:690px}
/* Global properties */
body {background:url(../images/bg_bot.gif) center 0 repeat #faf3ed;border:0;font:14px Georgia, "Times New Roman", Times, serif;color:#200;line-height:24px}
.ic, .ic a {border:0;float:right;background:#fff;color:#f00;width:50%;line-height:10px;font-size:10px;margin:-220% 0 0 0;overflow:hidden;padding:0}
.css3{border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;box-shadow:0 0 4px rgba(0, 0, 0, .4);-moz-box-shadow:0 0 4px rgba(0, 0, 0, .4);-webkit-box-shadow:0 0 4px rgba(0, 0, 0, .4);position:relative}
/* Global Structure */
.main {	margin:0 auto;	width:80%}
.body2 {background:#fff} 
/* main layout */
a {color:#304a3f;text-decoration:none;outline:none;font-weight: 700}
a:hover {text-decoration:underline}
h1 {float:left;padding:0px 0 0 36px}
h2 {font-size:41px;line-height:1.2em;color:#200000;padding:16px 0 12px 0;letter-spacing:-2px}
h2.letter_spacing {letter-spacing:-3px}
h3 {font-size:27px;color:#230000;line-height:1.2em;padding:20px 0 9px 0;letter-spacing:-1px}
h3 span {color:#ce251d}
p {padding-bottom:24px}
/* header */
header {height:100%;padding-top:10px;width:100%;overflow:hidden;margin-bottom: 20px;}
#logo {display:block;width:259px;height:94px;}
#top_nav {float:right;padding:4px 43px 30px 0;}
#top_nav li {float:;padding:3px 26px 5px 0;margin-right:25px;}
#top_nav li a {display:block;line-height:0}
#top_nav .end {padding-right:0;margin-right:0}
#menu {width:80%;float:right;padding:0 0 0 0; margin-top: -40px;margin-right: -50px;}
#menu li {float:left;padding-left:3px}
#menu li a {display:inline-block;font-size:2em;color:#ce251d;padding:0 20px;height:44px;letter-spacing:-1px}
#slogan{text-align: center;display: inline-block;margin-left: 10%;margin-top: -1%}
#slogan h3{margin-top:-1%;color:#ce251d}
#slogan p{color:#844b8d;font-size: 1.5em}
        
/* colocar bandeiras de paises*/

.google_translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
float: right;}
.google_translate:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.google_translatextra:hover img {
filter:alpha(opacity=0.30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}

        
/*=============fim bandeiras==============*/

.slider_bg {width:100%;height:590px;background:url(../images/bg_slider.gif) 0 0 no-repeat;position:relative;overflow:hidden;box-shadow:0 0 5px rgba(0, 0, 0, .4);-moz-box-shadow:0 0 5px rgba(0, 0, 0, .4);-webkit-box-shadow:0 0 5px rgba(0, 0, 0, .4);margin-bottom:35px}
.slider {top:10px;right:1%;position:absolute;z-index:1}
.slider .items {display:none}
.slider .pic {position:}
.slider .pagination {position:absolute;z-index:2;bottom:10px;}
.slider .pagination li {padding-right:3px}
.slider .pagination a {display:block;width:17px;height:17px;text-indent:-9999px;background:url(../images/buttons.png) right 0 no-repeat}

/* content */
#content {padding-bottom:50px;padding-top:3%}
#content2 {padding-bottom:31px}
#content3{margin-top: 75%}
.oficiais{padding-right:3% }
.pad_left1 {padding-left:3%}
.inforodape{width:70%}
.pad_left3{height: 1050px}
.pad_left2 {padding-left:30px}
.pad_bot1 {padding-bottom:13px;color:#4f0101}
.pad_bot2 {padding-bottom:24px}
.marg_right1 {margin-right:20px}
.box {color:#faf3ed;box-shadow:0 0 5px rgba(0, 0, 0, .4);-moz-box-shadow:0 0 5px rgba(0, 0, 0, .4);-webkit-box-shadow:0 0 5px rgba(0, 0, 0, .4)}
.box > div {background:url(../images/box_top.png) 0 top no-repeat;padding:30px;padding-top:0;overflow:hidden}
.box h2 {color:rgba(290,25,28,0.95);padding:15 0 12px 0;font-size:2.2em}
.box h2 span {color:#4f0101}
.box figure {padding-bottom:13px}
.list1 li a {font-style:italic;padding-left:12px;background:url(../images/marker_1.gif) 1px 8px no-repeat;color:#faf3ed}
.list_1 {color:#fff}
.list_1:hover {text-decoration:none}
.button1 {display:inline-block;font-size:20px;color:#faf3ed;line-height:34px;padding:0 15px;letter-spacing:-1px;background-color:#4f0101;float: right}
.button1:hover {text-decoration:none;color:#1e0000;background:#faf3ed;}
.testimonials li span {float:left;width:40px;height:40px;font-size:30px;color:#faf3ed;line-height:34px;text-align:center;background:#ce251d;margin-right:20px}
.testimonials li p {float:left;width:180px;padding-bottom:15px}
.testimonials li img {padding-top:2px}
.line1 {background:url(../images/line_vert1.gif) 285px 0 repeat-y;float: right;width:37%;margin-top: -8%}
.line11 {background:url(../images/line_vert1.gif) 285px 0 repeat-y;float: right;width:35%;margin-top: -33%;text-align:right}
.quemsomos{float: left;width: 55%}
.line2 {background:url(../images/line_vert1.gif) 615px 0 repeat-y}
.line2 img{margin-right: 2%}
.line2 img{margin-right: 2%}
.address {padding-bottom:0}
.address span {float:left;width:84px}
.oficiais li{padding-right:4%}
/* footer */
footer {height:10%;font:13px "Trebuchet MS", Arial, Helvetica, sans-serif;color:#696969;line-height:18px}
footer a {color:#ce251d;text-decoration:underline}
footer a:hover {text-decoration:none}
#link{right: 2%;bottom:2.5%;margin-left: 40%;margin-top: 1.5%;margin-right: -10%}
#link a{color: #483e3e; padding: 2%;}
.logorodape{clear: both; float:right; margin-top: -8%;margin-right:8%}
/* Tooltips */
.aToolTip {background:#ce251d;color:#fff;	margin:0;padding:2px 10px 3px;font-size:11px;position:absolute;line-height:17px}
.aToolTip .aToolTipContent {position:relative;	margin:0;padding:0}
/* forms */
#ContactForm {margin-top:-5px;width:910px}
#ContactForm span {float:left;width:111px;line-height:20px;color: #4f0101}
#ContactForm .wrapper {min-height:24px}
#ContactForm .textarea_box {min-height:170px;width:100%;overflow:hidden;padding-bottom:9px}
#ContactForm {}
#ContactForm a {margin-left:20px;float:right}
#ContactForm .input {width:399px;height:18px;background:#faf3ed;padding:1px 5px;color:#220000;font:14px Georgia, "Times New Roman", Times, serif;margin:0;float:left}
#ContactForm textarea {overflow:auto;width:789px;height:163px;background:#faf3ed;padding:1px 5px;color:#220000;font:14px Georgia, "Times New Roman", Times, serif;margin:0}
.infomodal{margin-left: 15%}


/*responsive*/
@media screen and (max-width:1024px){
    /*home*/
    #slogan{margin-top:1%;margin-bottom: 2%;width: 90%}
    #slogan h3{margin-top: -12%;font-size:1.3em;text-align: center}
    #slogan p{font-size: 1em;text-align: center}
    .imglogo{width: 20%}
    ul#menu{width: 100%}
    #menu li a{padding: 0 10px}  
    .wrapper{font-size: 0.8em}
    .oficiais img{width: 60%}
    .oficiais li{ padding-right: 0px}
    .logorodape{width: 30%;margin-right: 2%}
    .cols{width:30%;padding-bottom: 2%}
    .wrap{width: 100%;height: 100%}
    .box{margin-left: 0 auto}
    .modalconverssor{margin-top:1%}
    .infomodal{margin-left: 10%}
    .line11{margin-top: -45%}
    .line11 li{font-size: 1.5em;margin-right: -15%}
    #ContactForm { float : none;  margin: auto ;width: 100%}
    #link{margin-left: 50%;text-align: center}
    .wrap1{width: 100%}
    #banner{margin-left: -90%}
    .imgslide{width: 500px; height: 50px;margin-left:1%}
    .logorodape{margin-top: -10%} 
    textarea#mensagem{width: 500px}
}


@media screen and (max-width:800px){
     #slogan{font-size: 1.2em; text-align: center;margin-top: 13%}
   .imglogo{margin-left:45%}
    ul#menu{width: 100%}
    #menu li a{padding: 0 10px;margin-right: 1px}
     #menu{display: none;width: 100%;background-color: rgb(146, 175, 159);border-radius: 0;height: auto;clear: both;position:relative;   margin-left: -15%;}
    #menu li{width: 100%;text-align: center}  
    #menu a{display: block;border-bottom: 2px solid #fff;padding: 2% 0;}
    #menu a:last-child{border: none}
    #menu li:hover{background-color:rgba(132, 75, 141, 0.46)}
    #menu a:hover{color: #fff}
    #icon-menu{display: block;position: absolute;top: 10px;float:left;margin-left:2%;margin-top:20%} 
    .imgslide{width: 400px; height: 35px;margin-left:-1%}
    /*roteiros*/
.wrap{width: 90%;height: 80%}
    .modalconverssor{margin-top: 1%}
    .wrap img{width: 100%}
    .wrap h2{font-size: 1.5em}
    .wrap1{width: 95%;margin-left: 1.5%}
    .button1{font-size: 1em}
    .line11{margin-top:5%;width: 90%;text-align:left}
    .line11 h3{margin-right: 10%}
    .content{width: 50%}
    ul.list1.pad_bot1{margin-left: 1.5%}
     .infomodal{width: 100%;margin-right: 10%}
    .redes{width: 100%}
    #link{font-size: 0.8em;margin-top: 5%}
    .infomodal{margin-left: -8%}
    input#nome.input{width: 500px}
        input#email.input{width: 500px}
        input#assunto.input{width: 500px}
        textarea#mensagem{width: 500px}
    .logorodape{margin-top:-22%}
    .parceiros{width: 95%}
  
    
}





@media screen and (max-width:768px){
    /*header*/
    #slogan{font-size: 1.2em; text-align: center;margin-top: 13%}
   .imglogo{margin-left:45%}
    #icon-menu{margin-top: 25%}
    ul#menu{width: 100%}
    #menu{margin-right: 1px;margin-top:-3%}
    #menu li a{padding: 0 10px}
    /*end header*/
    /*home*/
    .wrapper{font-size: 0.8em}
    .oficiais img{width: 70%}
    .oficiais li{ padding-right: 0px}
    #content3 h3{padding-left: 5%}
    .logorodape{width: 30%;margin-right: 2%}
    .imgslide{width: 400px; height: 20px;margin-left:-1%}
     /* end home*/  
    #modal{margin-left: -8%;width: 100%}
    #ContactForm { float : none;  margin: auto ;width: 100%}
    /*Pagina Roteiros*/
    .wrap{width: 90%;height: 80%}
    .modalconverssor{margin-top: 1%}
    .wrap img{width: 100%}
    .wrap h2{font-size: 1.5em}
    .wrap1{width: 95%;margin-left: 1.5%}
    .main{width: 100%}
    .line11{margin-top: -45%}
    .content{width: 50%}
    ul.list1.pad_bot1{margin-left: 1.5%}
  /*modais tours*/
    .w3-content img{width: 1%}
      /* .cols{width:80%;padding-bottom: 2%;margin-left: 15%}*/
    .melhortour{width: 50%}
    .melhortour h3{font-size: 2.2em}
    .line11{width: 40%;margin-top: -53%}
    /*formulario*/
    input#nome.input{width: 600px}
        input#email.input{width: 600px}
        input#assunto.input{width: 600px}
        textarea#mensagem{width: 600px}
    .logorodape{margin-top: -10%}
    #link{font-size: 0.6em}
   

}




@media screen and (max-width:640px){
    #slogan{font-size: 1.3em}
    .box{width: 100%}
    #ContactForm { float : none;  margin: auto ;width: 100%}
    .wrap1{width:110%}
    .oficiais img{width:60%}
    .oficiais{margin-left: 5%}
    .imgslide{width: 350px; height: 30px;margin-left:-5%}
    #menu{display: none;width: 100%;background-color: rgb(146, 175, 159);border-radius: 0;height: auto;clear: both;position:relative;   margin-right: 1px;margin-top: -2.5%}
    #menu li{width: 100%;text-align: center}  
    #menu a{display: block;border-bottom: 2px solid #fff;padding: 2% 0;}
    #menu a:last-child{border: none}
    #menu li:hover{background-color:rgba(132, 75, 141, 0.46)}
    #menu a:hover{color: #fff}
    #icon-menu{display: block;position: absolute;top: 30px;float:left;margin-left:2%;margin-top:25%} 
    #link{margin-top: 2%;margin-left: -10%}
    .infomodal{margin-left: 1%;width: 100%}
    .melhortour{width: 100%;text-align: center}
    .melhortour h3{font-size: 2.2em}
    .line11{width: 80%;margin-top: 5%;text-align: center}
    .line11 h3{margin-right: 30%}
    /*.col2{text-align: center}*/ 
    .main{width:100%}
    .wrap{width:90%}
    .wrap1{width: 95%;margin-left: 2%}
    p.pad_bot1{margin-left: -10%}
    .button1{font-size: 1em}
    .redes{text-align: center}
       textarea#mensagem{width: 400px}
      .parceiros{width: 95%}
        

  


}


@media screen and (max-width:600px){
    .imgslide{width: 310px;margin-left:-2.5%}  
    .button1{font-size: 0.8em}
    #menu{margin-right: 1px;margin-top: -4%}
     .logorodape{margin-right: 4%;margin-top: -25%}
    #link{font-size: 0.8em}
       textarea#mensagem{width: 400px}
    .parceiros{width: 93%}
}



    



@media screen and (max-width:480px){
    #slogan{margin-top:13%;width: 90%}
    #slogan h3{margin-top: -12%;font-size:1.1em;text-align: center}
    #slogan p{font-size: 0.8em;text-align: center}
    .imglogo{width: 30%;margin-left:3%}
    .box{width: 80%;margin-left: 5%}
    .imgslide{width: 250px; height: 5px;margin-left:-3%}
    #ContactForm { float : none;  margin: auto ;width: 100%}
    #icon-menu{display: block;position:absolute;top: 60px;margin-left:4%;margin-top:28%}
    #menu{display: none;width: 100%;background-color: rgb(146, 175, 159);border-radius: 0;height: auto;clear: both;position:relative;margin-right: 1px;font-size: 1em;margin-top: -2.2%}   
    #content3{width: 100%;margin-left: 10%}
    #content2{text-align: center;width: 100%}
    .wrapper h2{text-align:center;margin-right: 4%}
    
  
/*roteiro*/
    .melhortour h2{margin-right: -35%;font-size: 4em}
    .line11{width: 100%;text-align: center;margin-right: -15%}
    .line11 h3{width: 80%}
    .main{width: 100%}
    p.pad_bot1{margin-left: 1%}
   .cols{width: 100%}
    .infomodal{margin-left:-21%}
    div.box h2{margin-left: 2%}
/*roteiro modais*/
    
/*quem somos*/
    .infmodal{width: 100%}
    .pad_left1 h2{margin-left: -45%}
/*rodape*/
    #link{margin-top: 5%;font-size: 0.9em;padding-right: 1px}
        .logorodape{margin-right: 4%;margin-top: -20%}
    .atender{font-size: 2.3em;color: #ce251d}
 /*contato*/
    input#nome.input{width: 280px}
        input#email.input{width: 280px}
        input#assunto.input{width: 280px}
        textarea#mensagem{width: 280px}
   .parceiros{width: 85%}
    }  


  
    @media screen and (max-width:330px){
       .imgslide{width: 170px; height: 5px;margin-left:-3%} 
        #icon-menu{margin-top: 35%} 
        #menu{margin-right: 1px;margin-top: -5%}
        #slogan{width: 80%;font-size: 1em}
         #content3 h3{padding-left: 0.8%;font-size: 2em}
          .oficiais img{width:45%}
                

        .redes{float: right;margin-right: 2%;margin-top: -75%;font-size: 0.6em}
        .linker{margin-top:-50%;font-size:1.5em}
        .logorodape{width: 45%;margin-right: 5%;margin-top: -30%}
        .pad_left1 h2{font-size: 2.3em;text-align: center}
        .pad_left3 h2{font-size: 2em}
        .quemsomos{width: 90%;text-align:center}
        .line1{width: 80%;text-align: center;margin-right: 12%}
        .box img,.modalconverssor{display: none}
        .box h2{font-size: 1.2em; text-align:center}
        .melhortour h2{font-size: 2.8em;width: 100%;margin-left: -5%}
        .melhortour h3{text-align: center;font-size: 1.8em}
        div.col2{margin-left: -5%}
        .line11 a{text-align: left}
        .atender{display: none}
         .redes{width: 90%;font-size: 0.6em;margin-left:2%;margin-top:53%}
        #ContactForm{margin-left: -3px}
        input#nome.input{width: 150px}
        input#email.input{width: 150px}
        input#assunto.input{width: 150px}
        textarea#mensagem{width: 150px}
        .parceiros{width: 65%}
   
        
   
   
    }   




