@charset "utf-8";

/*quem somos*/
.quem-somos-content {
    margin: 33px 0 44px;
    position: relative;
}

.quem-somos-page-destaque {padding: 0 0px 0 0px;height: 100%;overflow: hidden;mask-image: url(images/mask.png);mask-size: 100%;mask-repeat: no-repeat;mask-position: top left;position: sticky;top: 100px;}
.quem-somos-page-destaque:before {
    content: "";
    display: none;
    width: 100%;
    height: 100%;
    background: #586E77;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    mix-blend-mode: multiply;
}
.quem-somos-page-texto {padding: 0 0px 0 4%;}
.quem-somos ul {
    display: flex;
}

.quem-somos ul li {
    background-color: #cbcbcb;
    text-align: left;
    padding: 18px 18px 33px;
    margin: 3px;
    font-size: 18px;
    mask-image: url(images/mask.png);
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: top right;
	flex:1;
}
.quem-somos ul li i {
    display: block;
    width: 100%;
    text-align: left;
    font-size: 47px;
    margin: 22px 0 33px;
}
.quem-somos ul li:before {display: none}
.quem-somos-page-destaque img {line-height: 0;padding: 0;filter: grayscale(0);} 
.blocos-quemsomos ul li {
    width: 32%;
    float: left;
    margin: 2% 1%;
    padding: 33px;
    border: 1px solid #9a7652;
    border-radius: 20px;
}
.blocos-quemsomos h2 {
    color: #9a7652;
}

.blocos-quemsomos ul li:hover {
    background-color: #9a7652;
}

.blocos-quemsomos ul li:hover > p,
.blocos-quemsomos ul li:hover > h2 {
    color: #fff;
}
.blocos-quemsomos ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    max-width: none;
}

.blocos-quemsomos ul li:before {
    display: none;
}

.blocos-quemsomos ul li:first-child {width: 100% !important; margin:0}
.blocos-quemsomos ul li:nth-child(2) {margin-left:0 !important;}
.blocos-quemsomos ul li:last-child {margin-right:0 !important;}

/*------------------------------------------------------------ */
/* ------------------------- MOBILE -------------------------- */
/*------------------------------------------------------------ */
@media screen and (max-width: 700px) {
    .quem-somos-content {margin: 0px 0;}
    .quem-somos-page-destaque {padding: 0 0px 0 0;position: inherit;top: auto;}
    .quem-somos-page-texto {padding: 22px 0;}
    .blocos-quemsomos ul {padding: 0 !important;margin: 0 !important;flex-direction: column;}
    .blocos-quemsomos ul li {padding: 22px;width: 100%;}
}