/***** PAGINA PADRÃO E PÁGINA SOBRE *******/
.mt-84 {
    margin-top: 84px;
} 

.pagina-padrao h1 {
    font-size: 3rem;
    color: var(--grey-bold);
    margin:0
}

.pagina-padrao h2 {
    font-size: 2rem;
    color: var(--grey-bold);
    margin:0
}

.pagina-padrao h3 {
    font-size:1.5rem;
    line-height:1.625rem;
    color:var(--blue-lighter);
}

.pagina-padrao h4 {
    color: var(--grey-bold);
    font-size:1.125rem;
    font-weight: 800;
    margin:0
}

.pagina-padrao p {
    font-size:0.875rem;
    line-height:1.625rem;
    color:var(--grey-stronger);
    margin:0;
}

/***** PAGINA PADRÃO *******/
.overline {
    color:var(--grey-bold);
    font-size: 0.563rem;
    padding: 20px 0;
}

.padrao-secao1 {
    display:flex;
    flex-direction:row;
    justify-content: space-between;
    align-items:flex-start;
    flex-wrap:wrap;
    padding-bottom:60px
}

.padrao-secao1 p{
    width:41%;
}

.padrao-secao1 h2{
    width:48%;
}

.padrao-img {
    width: 100%;
    height:300px;
    overflow: hidden;
}

.pag-padrao-img {
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit: cover;
}

.padrao-secao2 h2{
    padding: 60px 0 20px 0 ;
    width:40%;
}

.padrao-sec2-div {
    display:flex;
    flex-direction:row;
    justify-content: space-between;
    align-items:flex-start;
    flex-wrap:wrap;
    padding-bottom:60px
}

.sec2-div1,.sec2-div2  {
    width:48%;
}

.padrao-sec3 {
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 60px;
}

.card-valores {
    width:32%
}

.card-valores img {
    width:100%;
    height:171px;
    border-radius:10px;
    margin-bottom: 10px;
    object-fit: cover;
    box-shadow: 0px 3px 5px 2px rgba(82,82,82,0.59);
    -webkit-box-shadow: 0px 3px 5px 2px rgba(82,82,82,0.59);
    -moz-box-shadow: 0px 3px 5px 2px rgba(82,82,82,0.59);
}

.padrao-sec3 p {
    font-size: 0.75rem;
    line-height: 1.188rem;
    padding:16px 0 50px;
}

/***** PAGINA SOBRE *******/
.sobre-titulo h1 {
    width:80%;
    padding:90px 0 50px 0
}

.sobre-sec2-div {
    display:flex;
    flex-direction:row;
    justify-content: space-between;
    align-items:flex-start;
    flex-wrap:wrap;
    padding:40px 0 60px 0;
}

.sec3-div1 {
    width:10%;
    padding-top:0;
    margin:0;
}

.sec3-div2 {
    width:38%;
}

.sec4-div1 {
    width:30%;
}

/* TIMELINE */
.timeline-div {
    text-align: center;
    padding-bottom:50px;

}
.timeline-div h2 {
    padding:60px 0 30px 0;
    
}
.timeline{
	position:relative;
	display:flex;
	flex-direction:column;
	list-style:none;
    padding:0 100px 0 100px;
    overflow: hidden;
    margin-bottom:40px;
}

.max-height-min {
    height:400px;
}

.max-height-max {
    height:max-content;
}

.gradiente-timeline {
    position: absolute;
    left:0;
    top:0;
    height:100%;
    width:100%;
    background:linear-gradient(0deg, white 0%,
    rgba(0, 0, 0, 0) 30%);
}

.timeline-div button{
    width:25%;
    height:40px;
}

.timeline h3 {
	margin:0 0 5px 0;
    color:black;
    font-weight: 800;
}

.timeline:before{
	content:"";
	position:absolute;
	top:-20px;
	bottom:0;
	left:50%;
	width: 2px;
	background-color: #D9DBE9;
}

.timeline:after{
	content:"";
	width: 5px;
	height: 5px;
	position: absolute;
	top: 2px;
	left: calc(50% - 4px);
	background-color: #D9DBE9;
	border-radius:50%;
	transform: translate(50%,-50%);
}

.timeline li{
    position:relative;
	width:50%;
 	padding: 15px 20px;
	text-align: right;
    margin-left:-39px;
}

.timeline li:before {
	content:"";
	width: 12px;
	height: 12px;
	position: absolute;
	top: 28px;
	right: 0;
	background-color:var(--blue-lighter);
	border-radius:50%;
	box-sizing:border-box;
	transform: translate(50%,-50%);
}

.timeline li:nth-child(2n) {
	align-self: flex-end;
	text-align: left;
    margin-left:0px;
    margin-right:-41px;
}
.timeline li:nth-child(2n):before {
	left: 0;
    transform: translate(-50%,-50%);
}


/***** MEDIA QUERIES  PAGINA PADRÃO E PÁGINA SOBRE *******/
@media only screen and (max-width: 800px) {
    .padrao-secao1 {
         padding-bottom:30px
    }
    .padrao-secao1 p{
        padding-top:10px;
        width:100%
    }
    .padrao-secao1 h2{
        width:100%
    }
    .padrao-secao2 h2{
        width:100%;
        padding:15px 0 10px 0;
        margin:0
    }
    .sec2-div1, .sec2-div2, .sec3-div1, .sec3-div2, .sec4-div1 {
        width:100%;
    }
    .card-valores {
        width:100%;
        margin-top:5px;
        margin-bottom: 25px;
    }
    .padrao-sec3 p {
        padding:10px 0 5px 0;
    }
    .sobre-titulo h1 {
        width:100%;
        font-size: 2rem;
        padding: 40px 0
    }
    .sobre-sec2-div {
        padding:30px 0;
    }
    .sec3-div2 {
        margin-top:30px;
    }
    .sec4-div1 h3 {
        margin-bottom:8px;
    }
    .timeline{
        padding:0;
    }
    .timeline p {
        line-height: 1.3rem;
    }
    .timeline-div button{
        width:40%;
    }
    .timeline-div {
        padding-bottom:10px;
    }
    .timeline-div h2 {
        padding:30px 0 30px 0;
    }
}