@charset "utf-8";
@import url(//fonts.googleapis.com/css?family=Open+Sans);


/*-------------------------------------------------- 
/* body
/*-------------------------------------------------- */
body{
	font-family:"Open Sans", Arial, Helvetica, sans-serif;
	font-size:13px;
	line-height:1.7em;
	color:#727272;
}
	

/*-------------------------------------------------- 
/* heading
/*-------------------------------------------------- */
h1,h2,h3,h4,h5,h6{font-weight:lighter;}

h3.title{
	font-size:20px;
	font-weight:600;
	border-bottom:solid 1px #ccc;
	padding-bottom:10px;
	margin-bottom:20px;
}

h3.title-property{margin:0;}

.subheading{ display:block; margin-bottom:10px;}

.price{ font-size:20px; color:#35abd2;}
#listing .price, #featured .price, .small-list .price{ font-size:20px; color:#222;}


.btn-search{width:80%;}

/*-------------------------------------------------- 
/* logo
/*-------------------------------------------------- */
#logo{
	float:left;
}
#logo .inner{
	display:table-cell;
	vertical-align:middle;
	height:100px;
}


/*-------------------------------------------------- 
/* content
/*-------------------------------------------------- */
#content{
	background:#eee;
	padding:40px 0 40px 0;
	text-shadow: 1px 1px #fff;
}

/*-------------------------------------------------- 
/* featured property
/*-------------------------------------------------- */
#featured{
	background:url(../img/bg-blur-1.jpg) top no-repeat;
	padding:40px 0 40px 0;
}
#featured .info{background:#fff; padding:5px 10px 10px 10px;}
#featured h2{font-size:20px; margin:0; line-height:normal;}
#featured .text1{ display:block;}
#featured .info-listing{border-top:solid 1px #ccc; padding-top:5px;}
#featured .meter{  background:url(../img/icon-house.png) center left no-repeat; padding-left:25px; padding-right:5px;}
#featured .bed{ float:right; background:url(../img/icon-bed.png) center left no-repeat; padding-left:28px; padding-right:5px;}
#featured .bath{ float:right; background:url(../img/icon-bath.png) center left no-repeat; padding-left:28px; padding-right:5px;}
#featured .car{ float:right; background:url(../img/icon-car.png) center left no-repeat; padding-left:28px; padding-right:5px;}
#featured .label{position:absolute; margin:10px 0 0 10px;}
#featured .price{ display:inline-block; padding:2px 5px 2px 5px; margin:5px 0 10px 0;}
#featured .info:hover{background:#f2f2f2;}


/*-------------------------------------------------- 
/* listing property
/*-------------------------------------------------- */
#listing .info{background:#fff; padding:10px 15px 10px 15px;\
-webkit-box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.1);
-moz-box-shadow:    1px 1px 1px rgba(50, 50, 50, 0.1);
box-shadow:         1px 1px 1px rgba(50, 50, 50, 0.1);
}
#listing h2{font-size:20px; margin:0; line-height:normal;}
#listing .text1{ padding-bottom:5px; }
#listing .info-listing{border-top:solid 1px #ccc; display:block; margin-top:10px;}
#listing .meter{  background:url(../img/icon-house.png) center left no-repeat; padding-left:25px; padding-right:5px;}
#listing .bed{ float:right; background:url(../img/icon-bed.png) center left no-repeat; padding-left:28px; padding-right:5px;}
#listing .bath{ float:right; background:url(../img/icon-bath.png) center left no-repeat; padding-left:28px; padding-right:5px;}
#listing .car{ float:right; background:url(../img/icon-car.png) center left no-repeat; padding-left:28px; padding-right:5px;}
#listing .label{position:absolute; margin:10px 0 0 10px;}
#listing .item img{width:100%; height:auto;}
#listing .text2{padding:5px 0 5px 0; margin-top:5px; border-top:solid 1px #ccc;}
#listing .item{margin-bottom:30px;}
#listing .price{ display:inline-block;  padding:2px 5px 2px 0px;}
#listing .info:hover{background:#f2f2f2;}
/*-------------------------------------------------- 
/* featured property
/*-------------------------------------------------- */
.specs-property .text1{ display:block;  padding-bottom:5px; margin-bottom:5px;}
.specs-property .meter{  display:block; background:url(../img/icon-house.png) center left no-repeat; padding-left:28px; padding-right:5px;}
.info-property {  display:block;padding-right:5px;}
.specs-property .bed{  display:block; background:url(../img/icon-bed.png) center left no-repeat; padding-left:28px; padding-right:5px;}
.specs-property .bath{  display:block; background:url(../img/icon-bath.png) center left no-repeat; padding-left:28px; padding-right:5px;}
.specs-property .car{  display:block; background:url(../img/icon-car.png) center left no-repeat; padding-left:28px; padding-right:5px;}
.specs-property span{border-bottom:solid 1px #ddd; padding-bottom:5px; margin-bottom:5px;}
.specs-property .description{margin-top:20px;}


#features{background:#222; padding:40px 0 40px 0; color:#fff;}

/*-------------------------------------------------- 
/* small-list property
/*-------------------------------------------------- */
.small-list{ background:#fff; height:128px; margin-bottom:20px;
-webkit-box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.1);
-moz-box-shadow:    1px 1px 1px rgba(50, 50, 50, 0.1);
box-shadow:         1px 1px 1px rgba(50, 50, 50, 0.1);
}
.small-list img{position:absolute;}
.small-list h2{font-size:16px; margin:0; line-height:normal;}
.small-list .info{ padding:10px; padding-left:185px;}
.small-list .arrow{ float:right; margin-top:100px; background:url(../img/small-arrow-right.png) center no-repeat; width:30px; height:16px; display:block;}
.small-list .label{position:absolute; z-index:100; margin:10px 0 0 10px;}
.small-list span{display:block;}
.small-list .price{display:inline-block; font-size:16px; margin:44px 0 2px 0;}
.small-list:hover{background:#f2f2f2;}


/*-------------------------------------------------- 
/* search property
/*-------------------------------------------------- */
#search{
	background:#404040;
	padding:40px 0 40px 0;
}

#search span{ color:#fff; font-size:18px; padding-top:5px;}
#search select{ border: solid 1px #fff;}
.span2 select{width:100%;}
/*-------------------------------------------------- 
/* menu, navigation
/*-------------------------------------------------- */
#mainmenu {
  color:#333;
  font-weight:400;
  font-size:14px;
  letter-spacing:0px;
  float:right;
  height:60px;
  margin-top:25px;
}

#mainmenu ul {
  float:right;
  margin:0px 0px;
  padding:0px 0px;
  height:30px;
}

#mainmenu li {
  margin:0px 0px;
  padding:0px 0px;
  float:left;
  display:inline;
  list-style:none;
  position:relative;
}

#mainmenu a {
  display:block;
  padding:8px 17px 8px 17px;
  line-height:30px;
  text-decoration:none;
  color:#fff;
}

#mainmenu a:hover{
	color:#fff;
}

#mainmenu li li {
	font-size:14px;
}

#mainmenu li li a{
	padding:5px 15px 5px 15px;
	background:#000;
	border-top:none;
}

#mainmenu li li a:hover {
	color:#fff;
 	background:#000;
}

#mainmenu li li a:hover{
	border-top:none;
}

#mainmenu li li a:hover {
  background:#000;
}

#mainmenu li ul {
  width:170px;
  height:auto;
  position:absolute;
  top:100%;
  left:0px;
  z-index:10;
  display:none;
}

#mainmenu li li {
  display:block;
  float:none;
}

#mainmenu li:hover > ul {
  display:block;
}

#mainmenu li ul ul {
  left:100%;
  top:0px;
}

#mainmenu li:hover a {
	color:#fff;
	background:#000;
}

#mainmenu select {padding:10px; height:36px; font-size:14px; border:none; background:#000; color:#fff;}
#mainmenu select option{padding:10px;}

.selectnav{display:none;}

/*-------------------------------------------------- 
/* footer
/*-------------------------------------------------- */
footer{
/* 	background: url(/assets/img/saopedro_02.jpg);
 	background-repeat: no-repeat;
  background-size: cover; */
  
	color:#fff;
/* 	padding:0px 0 20px 0; */

}
footer h3{font-size:20px;}

/* .footer_ba{
	  background-color: rgba(64 64 64 / 58%);
    height: 25vh;
} */

/*-------------------------------------------------- 
/* subfooter
/*-------------------------------------------------- */
/* .subfooter{
	margin:0px 0 -20px 0;
	background-color: rgba(64 64 64 / 58%);
	padding:20px 0 20px 0;
}
.subfooter ul{
	margin:0;
	padding:0;
}
.subfooter li{
	display:inline;
	padding:0 10px 0 0;
} */
.subfooter a{color:#fff;}

/*-------------------------------------------------- 
/* list news
/*-------------------------------------------------- */
.list-news{padding:0; margin:0;list-style: none;}
.list-news img{position:absolute;height: 39px;}
.list-news .text{ padding-left:83px;}
.list-news li{list-style:none; min-height:60px; margin-bottom:20px;}

/*-------------------------------------------------- 
/* toTop
/*-------------------------------------------------- */
#toTop { z-index:1555; display:none;text-decoration:none;position:fixed;bottom:10px;right:10px;overflow:hidden;width:51px;height:51px;border:none;text-indent:-999px;	background:url(../img/ui.totop.png) no-repeat left top;}
#toTopHover {background:url(../img/ui.totop.png) no-repeat left -51px;width:51px;height:51px;display:block;overflow:hidden;float:left;}
#toTop:active, #toTop:focus {outline:none;}


/*-------------------------------------------------- 
/* twitter
/*-------------------------------------------------- */
#twitter {margin:0; padding:0;}
#twitter li{ list-style:none; padding-left:50px; background:url(../img/twitter-bird.png) top left no-repeat; padding-bottom:10px; min-height:60px;}
#twitter a{color:#fff; text-decoration:underline;}


/*-------------------------------------------------- 
/* agent-details
/*-------------------------------------------------- */
.agent-details h5{ font-weight:bold; margin-bottom:0;}
.agent-details{padding:10px; background:#eee; min-height:100px;}
.agent-details img{position:absolute;}
.agent-details .info{ padding-left:120px;}
.agent-details span{ display:block;}


/*-------------------------------------------------- 
/* widget
/*-------------------------------------------------- */
.widget{margin-bottom:40px;}
.widget h4.title{ padding-bottom:10px;}
.widget ul{list-style:none; margin:0;}
.widget_category li { border-bottom:solid 1px #eee; padding-bottom:7px; margin-bottom:5px;}
.widget_recent_post li { padding-left:20px; background:url(../images/list-arrow.png) left 2px no-repeat; border-bottom:solid 1px #ddd; padding-bottom:7px; margin-bottom:5px;}
.widget_recent_post li a{color:#555;}
.widget .comments li { padding-left:20px; background:url(../images/list-arrow.png) left 2px no-repeat; border-bottom:solid 1px #ddd; padding-bottom:7px; margin-bottom:5px;}
.widget_tags li{display:inline-block; margin-right:0px; margin-bottom:13px;}
.widget_tags li a{ color:#fff; text-shadow:none; border-radius:2px; margin-bottom:5px; -moz-border-radius:2px; -webkit-border-radius:2px; background:#333; padding:5px 8px 5px 8px;}
.widget_tags li a:hover{background:#ccc; }

/*-------------------------------------------------- 
/* map
/*-------------------------------------------------- */
.map{margin-top:40px;}
.map iframe{width:100%; height:320px; border:solid 1px #ccc; padding:2px; background:#fff;}

#map-container iframe{width:100%; height:360px;}


/*-------------------------------------------------- 
/* label
/*-------------------------------------------------- */
.label{font-size:14px; text-shadow:none;}
.rent{ background:#F90; color:#fff; padding:5px 10px 5px 10px;}
.sale{ background:#000; color:#d1ae6c; padding:5px 10px 5px 10px;}

blockquote{
	font-size:24px;
	font-style:italic;
	line-height:1.5em;
	font-weight:300;
	border-left:solid 2px #404040;
}


/*-------------------------------------------------- 
/* related-property
/*-------------------------------------------------- */
.related-property{margin-top:40px; padding-top:40px; border-top:solid 1px #ccc;}


/*-------------------------------------------------- 
/* blog */
/*-------------------------------------------------- */
.blog-list{ margin-top:-10px; margin:0; padding:0;}
.blog-list li{margin-bottom:20px; list-style:none;  background:url(../images/dotwhite50.png);  line-height:1.7em; padding-bottom:40px;}
.blog-header .by{display:inline-block; float:left;  background:url(../images/icon-user.png) left center no-repeat; padding-left:24px;}
.blog-header .cat{ display:inline-block; float:left; background:url(../images/icon-folder.png) left center no-repeat; padding-left:24px;}
.blog-header .news-date{ display:inline-block; float:left; background:url(../images/icon-folder.png) left center no-repeat; padding-left:24px;}
/* blog list */
.blog-list li{margin-bottom:40px;}
.blog-list .info{position:absolute; width:60px; }
.blog-list .date{ text-shadow:none; background:#6A9A37; text-shadow:none; color:#fff; text-align:center; padding:10px 0 10px 0;}
.blog-list .date h4{color:#fff; font-size:30px;}
.blog-list a.readmore{ display:block; width:60px; height:40px; background:url(../images/arrow-2.png) right center no-repeat #555;}
.blog-list a.readmore:hover{ background:url(../images/arrow-2.png) left center no-repeat #E1704B;}
.blog-list .preview{padding-left:80px; line-height:1.6em;}
.blog-list .meta-info{margin:10px 0 0 80px; font-size:13px; padding:5px 0 5px 0; border-top:dotted 1px #ccc; border-bottom:dotted 1px #ccc;}
.blog-list .meta-info span{ padding:0 10px 0 10px; color:#ccc;}
.blog-list .preview img{padding-bottom:10px; width:100%;}
.blog-list .callbacks_container{margin-bottom:-35px;}

/*-------------------------------------------------- 
/* blog single */
/*-------------------------------------------------- */
.blog-read{ margin-top:-10px; margin:0; padding:0;}
.blog-read{margin-bottom:20px; list-style:none;  background:url(../images/dotwhite50.png);  line-height:1.7em; padding-bottom:40px;}
.blog-header .by{display:inline-block; float:left;  background:url(../images/icon-user.png) left center no-repeat; padding-left:24px;}
.blog-header .cat{ display:inline-block; float:left; background:url(../images/icon-folder.png) left center no-repeat; padding-left:24px;}
.blog-header .news-date{ display:inline-block; float:left; background:url(../images/icon-folder.png) left center no-repeat; padding-left:24px;}
/* blog list */
.blog-read {margin-bottom:40px;}
.blog-read .info{position:absolute; width:60px; }
.blog-read .date{ text-shadow:none; background:#6A9A37;color:#fff; text-align:center; padding:5px 0 5px 0;}
.blog-read .date h4{color:#fff; font-size:30px;}
.blog-read a.readmore{ display:block; width:60px; height:40px; background:url(../images/arrow-2.png) right center no-repeat #555;}
.blog-read a.readmore:hover{ background:url(../images/arrow-2.png) left center no-repeat #E1704B;}
.blog-read .preview{padding-left:80px; line-height:1.6em;}
.blog-read .meta-info{margin:10px 0 0 80px; font-size:13px; padding:5px 0 5px 0; border-top:dotted 1px #ddd; border-bottom:dotted 1px #ddd;}
.blog-read .meta-info span{ padding:0 10px 0 10px; color:#ccc;}
.blog-read .preview img{padding-bottom:10px; width:100%;}
.blog-read .callbacks_container{margin-bottom:-35px;}



/* blog comment */
#blog-comment{ margin-left:70px;}
#blog-comment h5{margin-bottom:10px;}
#blog-comment ul, #blog-comment li{list-style:none; margin-left:-30px; padding-left:0;}
#blog-comment li{min-height:70px; padding-bottom:10px; margin-bottom:10px; padding-bottom:20px; border-bottom: solid 1px #eee;}
#blog-comment li .avatar{position:absolute; margin-top:5px; width:60px; height:60px;}
#blog-comment .comment{ margin-left:85px; }
#blog-comment li{min-height:70px; font-size:14px; line-height:1.6em; }
#blog-comment li li{ margin-left:55px; padding-bottom:0px; margin-top:20px; padding-top:10px; border-top: solid 1px #eee; border-bottom:none;}
#blog-comment li li .avatar{position:absolute; }
#blog-comment li li .comment{ }
.comment-info {margin-left:85px; margin-bottom:5px;}
.comment-info span{}
.comment-info .c_name{ display:block; font-weight:700; color:#555;}
.comment-info .c_reply{  padding-left:20px; margin-left:20px; border-left:solid 1px #ddd; font-size:12px;}
.comment-info .c_date{  font-size:12px;}

/* comment form */
#commentform label{ display:block;}
#commentform input{width:290px;}
#commentform input:focus{border:solid 1px #999; background:#fff;}
#commentform textarea{width:97%; padding:5px; height:150px;}
#commentform textarea:focus{border:solid 1px #999; background:#fff;}
#commentform input.btn{ width:auto;}

#slider{
	background:url(../img/bg-blur-1.jpg) center;
	padding:40px 0 40px 0;
}
#slider img{
	width:98%;
	padding:1%;
	background:#fff;
}
.slider-info{ 
	position:absolute;  z-index:10; bottom:40px; font-size:20px; padding:20px; margin-left:40px;
}
.slider-info h1{background:#fff; display:inline-block; padding:10px 20px 10px 20px; letter-spacing:-2px;}
.slider-info .text1{background:#333; color:#fff; padding:10px 20px 10px 20px; font-size:14px;}

/*-------------------------------------------------- 
/* contact */
/*-------------------------------------------------- */
.error { width:280px; background:#FCD8DC; padding:2px 10px 2px 10px; display: none;color:#C03; font-size:12px;}
.success { display: none; padding:2px 10px 2px 10px; background:#E5EAD4; color:#555; width:280px;  font-size:12px;}
.error img { vertical-align:top; }
.full{ width:98%;}

.page-not-found { display:block; padding:100px 0 100px 0; text-align:center; font-size:20px;}
.page-not-found h1{ font-size:160px; margin-bottom:60px; font-weight:bold; color:#ccc;}

.blue{ background:#3bb6df; padding:15px;}
.red{ background:#F36; padding:15px;}
.orange{ background:#F90; padding:15px;}
.green{ background:#3C0; padding:15px;}

#gallery .item{
	text-align:center;
	margin-bottom:30px;
	background:#f5f5f5;
	padding-bottom:15px;
	font-size:12px;
}
#gallery .item h4{
	font-size:16px;
	margin-bottom:0;
}

/* -------------------------------------------------- 
	isotope
/* -------------------------------------------------- */
.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

#filters{padding:0; margin:0; margin-bottom:20px;}
#filters li{display:inline-block; margin-right:3px;  margin-bottom:20px; }
#filters a{color:#fff; padding:5px 10px 5px 10px; color:#555; border:solid 1px #ddd; text-decoration:none;}
#filters a:hover{ border:solid 1px #96C277;}
#filters a.selected{ background:#96C277; border:solid 1px #96C277; color:#FFF;}

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

#flickr-photo-stream img{ width:50px; height:auto; margin:0 12px 12px 0; float:left;}
#flickr-photo-stream a img {border:solid 2px #fff;}
#flickr-photo-stream a:hover img {border:solid 2px #96C277;}

#call-to-action{
	background:url(../img/bg-blur-2.jpg) bottom center;
	padding:40px 0 40px 0;
}
.call-to-action{
	padding:20px 0 15px 0;
}
.call-to-action h3{margin-top:0;}

.social-icons img{margin:0 5px 5px 0;}
footer .social-icons img{margin:0 0;}


@media (max-width: 767px) {
	#logo{margin:0 auto; width:100%; text-align:center;}
	#logo .inner{ display:block; width:100%; height:auto; margin:20px 0 20px 0;}
	#slider{background:none; padding:0;}
  	#search input,#search select{width:100%; margin-bottom:10px;}
	#mainmenu{display:none;}
	.selectnav{display:block; margin:0 auto; margin-bottom:20px;}
	#featured .item{width:270px; margin:0 auto; margin-bottom:20px;}
	#featured{background-position:top;}
}

@media (min-width: 768px) and (max-width: 979px) {
	.small-list img{position:inherit; width:100%;}
	.small-list {height:auto;}
	.small-list .info{height:auto;  padding:10px  20px 10px 20px;}
	#featured .car,#featured .bath{display:none;}
}

@media (max-width: 979px) {
  #search input{width:16%;}
  footer,#search{padding:40px;}
  .subfooter{padding:20px;}
}

@media (min-width: 980px) {
  #search input{width:19%;}
}

.test-column{
	background:#ddd;
	color:#fff;
	text-align:center;
	padding:20px 0 20px 0;
	margin-bottom:30px;
}

.centeredImg {
	object-fit: none;
    object-position: center;
    height: 20vh;
    background-color: rgba(255, 255, 255, 1.0);
    width: 270px;
}

.centeredImgv2 {
	object-fit: none;
    object-position: center;
    height: 20vh;
    background-color: rgba(255, 255, 255, 1.0);
    width: 170px;
    height: 128px;
}

.centeredImgv3 {
	/* object-fit: none; */
   	object-position: center;
    background-color: rgba(255, 255, 255, 1.0);
    height:278px!important;
}

.zoondiv {
	transition: all .4s ease-in-out;
}

.zoondiv:hover {
	transform: scale(1.02);
}

.titleLst{
	font-size: 2.2em;
	text-shadow: 1px 1px 2px rgba(66,55,53,0.38);
}

.textanz{
	height: 80px;
}

.hoverzoom {
  position: relative;
  overflow: hidden;
}
.hoverzoom > img {
  width: 100%; 
  -webkit-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
  -moz-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
  -ms-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
  -o-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
  transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
  -webkit-transform: scale(1.2) rotateZ(0deg);
  -moz-transform: scale(1.2) rotateZ(0deg);
  -ms-transform: scale(1.2) rotateZ(0deg);
  -o-transform: scale(1.2) rotateZ(0deg);
  transform: scale(1.2) rotateZ(0deg);
}

.espaco10{
	    padding: 10px;
}

.sombra {
-webkit-box-shadow: 0px 0px 6px 1px rgba(191,191,191,0.43); 
box-shadow: 0px 0px 6px 1px rgba(191,191,191,0.43);
}
.fundocinz{
	background-image: url(/assets/img/fabric-plaid.png)!important;
    background-repeat: repeat!important;
    background-size: 102px 78px!important;
}

.whatsapp-fixo {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
}




/* botão hambúrguer */
.menu-toggle {
  font-size: 28px;
  color: #fff;
  cursor: pointer;
  display: none; /* só mostra no mobile */
}

/* menu desktop */
#mainmenu {
  display: flex;
  gap: 15px;
  list-style: none;
}
#mainmenu li {
  position: relative;
}
#mainmenu li ul {
  display: none;
  position: absolute;
  background: #111;
  padding: 10px;
  list-style: none;
}
#mainmenu li:hover ul {
  display: block;
}

/* menu off-canvas escondido por padrão */
#offcanvas-menu {
  position: fixed;
  top: 0;
  left: -250px;
  width: 250px;
  height: 100%;
  background: #000;
  color: #fff;
  padding: 20px;
  transition: left 0.3s ease;
  z-index: 1000;
  display: none; /* só mobile */
}
#offcanvas-menu ul {
  list-style: none;
  padding: 0;
}
#offcanvas-menu li {
  margin: 15px 0;
}
#offcanvas-menu a {
  color: #fff;
  text-decoration: none;
}
#offcanvas-menu.open {
  left: 0;
}
#offcanvas-menu .close-btn {
  font-size: 22px;
  cursor: pointer;
  display: block;
  text-align: right;
  margin-bottom: 20px;
}

/* submenus off-canvas */
#offcanvas-menu ul ul {
  display: none;
  margin-left: 15px;
}
#offcanvas-menu li.open > ul {
  display: block;
}

/* --- MOBILE --- */


nav select,
#menu select {
  display: none !important;
}

/* Desktop */
@media (min-width: 769px) {
  .menu-toggle { display: none; }   /* botão hambúrguer some */
  #offcanvas-menu { display: none; }/* menu lateral some */
  #mainmenu { display: flex; }      /* mostra menu horizontal */
}

/* Mobile */
@media (max-width: 768px) {
  .menu-toggle { display: block; }  /* mostra hambúrguer */
  #offcanvas-menu { display: block; }/* ativa menu lateral */
  #mainmenu { display: none; }      /* esconde menu horizontal */
}