/**
*
* Carregamento das Webfonts do Google
*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;900&display=swap');
:root {
    --orange: #FF6147;
    --medium-orange: #FF9750;
    --light-orange: #FDEDEC;
    --light-gray: #6F6F6F;
    --extra-light-gray: #EDEDED;
    --light-blue: #61A1BC;
    --dark-gray: #383430;
    --purple: #9B51E0;
    --dark-purple: #924891;
    --dark-green: #389871;
    --extra-light-green: #EBF5F1;
    --dark-yellow: #EEC45E;
}

.grecaptcha-badge{
	display: none !important;
}

/* BACKGROUNDS */

.bg-orange {
    background: var(--orange) !important;
}

.bg-dark-green {
    background: var(--dark-green) !important;
}

.bg-medium-orange {
    background: var(--medium-orange) !important;
}

.bg-light-orange {
    background: var(--light-orange) !important;
}

.bg-gray {
    background: var(--dark-gray) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.bg-light-gray {
    background: var(--light-gray) !important;
}

.bg-extra-light-gray {
    background: var(--extra-light-gray) !important;
}

.bg-extra-light-green {
    background: var(--extra-light-green) !important;
}

a.bg-orange:hover,
a.bg-light-orange:hover {
    background: var(--dark-gray) !important;
}

a.bg-gray:hover {
    background: var(--orange) !important;
}


/* ANIMAÇÔES */
/* .animated{
    opacity: 0;
} */


/* TEXTOS */

.text-orange {
    color: var(--orange) !important;
}

.text-light-orange {
    color: var(--light-orange) !important;
}

.text-medium-orange {
    color: var(--medium-orange) !important;
}

.text-gray {
    color: var(--dark-gray) !important;
}

.text-purple {
    color: var(--purple) !important;
}

.text-dark-green {
    color: var(--dark-green) !important;
}

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.text-light-blue {
    color: var(--light-blue) !important;
}


/* BORDAS */

.bb-medium-orange {
    border-bottom: 1px solid var(--medium-orange);
    width: max-content;
    max-width: 100%;
}
.bb-dark-purple {
    border-bottom: 1px solid var(--dark-purple);
    width: max-content;
    max-width: 100%;
}
.bb-dark-green {
    border-bottom: 1px solid var(--dark-green);
    width: max-content;
    max-width: 100%;
}

.bb-light-blue {
    border-bottom: 1px solid var(--light-blue);
    width: max-content;
    max-width: 100%;
}

h2.title-single,
h2.title-single p {
    font-size: 26px;
    margin-bottom: 0;
}

h3.title-single,
h3.title-single p {
    font-size: 22px;
    margin-bottom: 0;
}

.btn-01 {
    background: var(--light-orange);
    color: var(--dark-gray);
    border-radius: 20px;
    padding: 8px 30px;
    font-size: 16px;
    font-weight: 600;
    line-height: 40px;
}

.btn-01:hover {
    background: var(--dark-gray);
    color: #fff;
}

.btn-02 {
    background: #fff;
    color: var(--orange);
    border-radius: 20px;
    padding: 8px 30px;
    font-size: 16px;
    font-weight: 600;
    line-height: 40px;
}

.btn-02:hover {
    background: var(--orange);
    color: #fff;
}

.btn-03 {
    background: var(--orange);
    color: #fff;
    border-radius: 20px;
    padding: 8px 30px;
    font-size: 16px;
    font-weight: 600;
    line-height: 40px;
}

.btn-03:hover {
    background: var(--dark-gray);
    color: #fff;
}

body,
html,
p {
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 400;
}

b,
strong {
    font-weight: 700;
}

.desc-small,
.desc-small p {
    font-size: 15px;
    margin: 0;
}

.w-1300 {
    max-width: 1300px !important;
}

a,
a:hover,
*:hover {
    text-decoration: none !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Montserrat', sans-serif;
}

h1.titulo-home {
    font-size: 34px;
    font-weight: 700;
    color: var(--dark-gray);
}

.line-bottom:after {
    content: '';
    background: var(--orange);
    width: 300px;
    height: 1px;
    position: absolute;
    display: block;
    left: calc( 50% - 150px);
    margin-top: 10px;
}

.titulo-home.line-bottom {
    margin-bottom: 20px;
}

.text-orange {
    color: var(--orange);
}

hr.orange-border {
    border-top: 1px solid var(--orange);
}

.text-bold {
    font-weight: 700 !important;
    ;
}

img {
	height: auto;
	object-fit: cover;
}

/**
*
* HEADER
*/

header {
    position: sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    top: 0;
    box-shadow: 0 0 20px rgb(0 0 0 / 25%);
    z-index: 100;
    background: var(--dark-gray);
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    width: 100%;
    height: 70px;
}

header .navbar {
    height: 100%;
}

ul#menu-menu-principal {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

ul#menu-menu-principal a {
    color: #fff;
    text-transform: uppercase;
    font-size: 16px;
    padding-bottom: 5px;
    border-bottom: 1px solid transparent;
}

ul#menu-menu-principal a:hover,
ul#menu-menu-principal .current-menu-item a, 
ul#menu-menu-principal .current-page-ancestor a {
    border-bottom: 1px solid var(--orange);
}

#menu-menu-principal li {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 0;
    background-color: #383430;
}


ul#menu-menu-principal li:nth-child(2) {
    padding-right: 300px;
}

.logo-menu {
    position: absolute;
    left: calc( 50% - 25px);
    top: 10px;
    max-width: 50px;
}
.logo-menu svg{
    width: auto;
    height: 50px;
}

.logo-menu-back {
    position: absolute;
    display: flex;
    width: 150px;
    left: calc(50% - 85px);
    top: 72px;
}

.logo-menu-back svg {
    width: auto;
    height: 30px;
}
.logo-menu a .cls-1,
.logo-menu-back a .cls-1{
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.logo-menu-back a:hover .cls-1,
.logo-menu a:hover .cls-1{
    fill:#ff6147;
}

.navbar-toggler svg {
    fill: #ff6147;
    max-width: 30px;
    max-height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/** BTN HAMBURGUER */

.btn-menu {
    width: 50px;
    height: 50px;
    position: fixed;
    top: 8px;
    right: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.hamburguer {
    display: block;
    background: #ff6147;   
    width: 30px;
    height: 1px;
    position: relative;
    transition: .5s ease-in-out;
}
.hamburguer::before,
.hamburguer::after {
    content: '';
   background: #ff6147;
   display: block;
   width: 100%; 
   height: 100%;
   position: absolute;
   transition: .5s ease-in-out;
}
.hamburguer::before {
    top: -10px;
}
.hamburguer::after {
    bottom: -10px;
}
.navbar {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.navbar input {
    display: none;
}
.navbar label {
    width: 50px;
    height: 50px;
    display:none;
}
input:checked ~ label .hamburguer{
    transform: rotate(45deg);
}
input:checked ~ label .hamburguer::before {
    transform: rotate(90deg);
    top: 0px;
}
input:checked ~ label .hamburguer::after {
    transform: rotate(90deg);
    bottom: 0px;
}

/** CARROSSEL TOPO  **/

#slider {
    position: relative;
}

#slider .owl-nav {
    margin-top: 0;
    position: absolute;
    width: 1300px;
    left: calc( ( 100% - 1300px) / 2);
    text-align: center;
    display: flex;
    justify-content: space-between;
    top: 35%;
}
#slider .owl-nav.disabled{
    opacity: 0;
    display: none;
}

#slider .owl-nav span {
    color: var(--light-orange);
    font-size: 100px;
}

#slider .owl-dots {
    position: absolute;
    z-index: 1;
    width: 100%;
    margin-top: -30px;
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev {
    outline: none !important;
    background: none !important;
}

.owl-theme .owl-dots .owl-dot {
    outline: none !important;
    border: none !important;
}

#slider .owl-theme .owl-dots .owl-dot span {
    background: var(--light-orange);
    width: 40px;
    height: 3px;
}

#slider .owl-theme .owl-dots .owl-dot.active span {
    background: var(--orange);
}

/* .cabecalho-pagina {
    position: relative;
    align-items: center;
    justify-content: center;
    height: 300px;
}
.cabecalho-pagina .container{
    position: absolute;
    top: 42%;
    max-width: 100%;
    text-align: center;
}
.cabecalho-pagina h1, .cabecalho-pagina h2{
    font-size: 34px;
    font-weight: 700;
    color: #fff;
} */

#img-topo-servicos, .cabecalho-pagina{
    position: relative;
}
#img-topo-servicos .img-fundo-servicos{
    overflow: hidden;
}
#img-topo-servicos .img-fundo-servicos img{
    width: 100%;
    height: auto;
    /* min-width: 100%; */
}
#img-topo-servicos .img-fundo-servicos.image-center-center{
	display: flex;
    justify-content: center;
}
#img-topo-servicos .img-fundo-servicos.image-center-center img{
	object-fit: cover;
    object-position: center;
}
#img-topo-servicos .img-fundo-servicos.image-center-left{
	display: flex;
    justify-content: start;
}
#img-topo-servicos .img-fundo-servicos.image-center-left img{
	object-fit: cover;
    object-position: left;
}
#img-topo-servicos .img-fundo-servicos.image-center-right{
	display: flex;
    justify-content: flex-end;
}
#img-topo-servicos .img-fundo-servicos.image-center-right img{
	object-fit: cover;
    object-position: right;
}
 
.cabecalho-pagina .img-cabecalho-pagina img {
    width: 100%;
    height: auto;
}
#img-topo-servicos .img-fundo-servicos img{
    width: auto;
    min-width: 100%;
	object-fit: cover;
    object-position: center;
}
#slider .content-slide,
.cabecalho-pagina .content-cabecalho-pagina,
#img-topo-servicos .content-slide {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    top: 40%;
    width: 100%;
    text-align: center;
    max-width: 100%;
    flex-wrap: wrap;
}

#slider .content-slide h1,
.cabecalho-pagina .content-cabecalho-pagina h1,
#img-topo-servicos .content-slide h1 {
    font-size: 34px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 10px;
}

#slider .content-slide svg,
#img-topo-servicos svg{
    height: 30px;
    margin: 20px 15px;
    fill: #fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
#slider a.ativo svg path,
#slider svg:hover path,
#img-topo-servicos a.ativo svg path,
#img-topo-servicos svg:hover path {
    fill: var(--orange);
}


.cabecalho-pagina.single-page .img-cabecalho-pagina {
    background: #c4c4c4;
    min-height: 150px;
}


/**   HOME   **/
.sobre-upplay {
    background-image: radial-gradient(#fdfdfd, #ececec);
    font-size: 15px;
}

.sobre-upplay p {
    font-size: 15px;
    margin-bottom: 0;
}

.sobre-upplay .title-custom p {
    font-size: 30px;
    max-width: 155px;
    line-height: 35px;
}

.sobre-upplay .title-custom b,
.sobre-upplay .title-custom strong,
.titulo-blog b,
.titulo-blog strong,
.title-custom-itens b,
.title-custom-itens strong {
    color: var(--orange);
}

.sobre-upplay .title-custom-itens {
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 10px;
}

.content-sobre-right{
    max-width: 900px;
    margin: 0 auto;
}
.text-1, .text-2, .text-3 {
    max-width: 250px;
}
.text-2 {
    margin-top: 200px;
}
img.icone-seta-1 {
    position: absolute;
    transform: rotateX(180deg);
    width: 180px;
    margin-left: -195px;
}
img.icone-seta-2 {
    position: absolute;
    width: 300px;
    margin-left: -320px;
    margin-top: -15px;
    transform: rotate3d(1, 1, 1, 10deg);
}
img.icone-seta-3 {
    position: absolute;
    width: 315px;
    margin-left: -305px;
    transform: rotate(33deg);
    margin-top: -105px;
}

.circle-img-fluid-1 svg{
    position: absolute;
    fill: red;
    opacity: 0.3;
    width: 20px;
    animation: pulseCircle 3s ease-in-out infinite;
}
.circle-img-fluid-1 {
    position: absolute;
    width: 55px;
    top: 5.2%;
    left: 45.19%;
}
.circle-img-fluid-2 svg{
    fill: red;
    width: 55px;
    opacity: 0.3;
    animation: pulseCircle 3s ease-in-out infinite;
}
.circle-img-fluid-2 {
    position: absolute;
    width: 55px;
    top: 32.2%;
    left: 23.2%;
}
.circle-img-fluid-3 svg{
    position: absolute;
    fill: red;
    opacity: 0.3;
    width: 54px;
   
    animation: pulseCircle 3s ease-in-out infinite;
}
.circle-img-fluid-3 {
    position: absolute;
    width: 54px;
    top: 22.2%;
    left: 75.4%;
}

.servicos-upplay {
    background: var(--light-orange);
}

.servicos-upplay .img-services {
    width: 45vw;
    height: 30vw;
    margin-top: -120px;
    max-height: 515px;
    min-height: 100%;
}

.servicos-upplay .title-services,
.servicos-upplay .title-services p {
    font-weight: 900;
    color: var(--orange);
    font-size: 38px;
    width: 45vw;
    text-align: right;
    margin-top: 15px;
}

.servicos-upplay a {
    color: var(--light-gray);
    display: flex;
    align-items: center;
    margin: 25px 0;
    text-align: left;
    max-width: fit-content;
}

.servicos-upplay a:hover {
    color: var(--orange);
}

ul.list-servicos {
    list-style-type: none;
    margin: 0;
    padding: 0 30px;
}

ul.list-servicos img {
    width: 40px;
    height: auto;
}

ul.list-servicos h2 {
    font-size: 20px;
    margin: 0 0 0 10px;
}

.title-parceiros,
.title-parceiros p {
    font-size: 28px;
    color: #000;
    text-align: center;
    font-weight: 500;
}

.title-parceiros strong,
.title-parceiros strong p {
    font-size: 34px;
    font-weight: 700;
    text-decoration: underline;
    color: var(--orange);
}

.list-parceros {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.list-parceros .item-parceiros {
    text-align: center;
    padding: 10px;
    margin-top: 10px;
    width: 150px;
}

.list-parceros .item-parceiros img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 125px;
    transform: scale(1);
}
.list-parceros .item-parceiros a:hover img{
    transform: scale(1.05);
}

.projetos-upplay {
    background: var(--orange);
    color: #fff;
    text-align: center;
}

.projetos-upplay .titulo-projetos,
.projetos-upplay .titulo-projetos p {
    font-weight: 700;
    font-size: 34px;
    color: #fff;
    text-align: center;
    margin-bottom: 0;
}

.projetos-upplay .titulo-projetos:after {
    content: '';
    background: #fff;
    width: 300px;
    height: 1px;
    position: absolute;
    display: block;
    left: calc( 50% - 150px);
    margin-top: 10px;
}

.project-item {
    opacity: 1;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.project-item:hover {
    opacity: 0.7;
    background-size: 102% !important;
}

.project-item div {
    height: 16vw;
    min-height: 300px;
}

.blog-upplay .titulo-blog,
.titulo-interno-destaque,
.titulo-blog p {
    color: var(--dark-gray);
    text-transform: uppercase;
    text-align: center;
    font-size: 28px;
    font-weight: 600;
}

.blog-upplay .titulo-blog img {
    margin-left: -90px;
    max-width: 75px;
    height: auto;
    width: 100%;
}

.blog-upplay .titulo-blog:after,
.titulo-interno-destaque:after {
    content: '';
    background: var(--orange);
    width: 300px;
    height: 1px;
    position: absolute;
    display: block;
    left: calc( 50% - 150px);
    margin-top: 10px;
}

.blog-upplay .titulo-blog:after {
    margin-top: -10px;
}

.blog-upplay a,
.blog-upplay a .titulo-post {
    color: var(--dark-gray);
}
.blog-upplay a article{
    margin-bottom: 30px
}

.blog-upplay a:hover .titulo-post {
    color: var(--orange);
}

.blog-upplay .titulo-post,
.blog-upplay .titulo-post h2 {
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    height: 80px;
    line-height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.blog-upplay .resumo-post p {
    font-size: 14px;
    text-align: center;
    border-top: 1px solid var(--orange);
    padding: 10px 15px;
    height: 160px;
    overflow: hidden;
    margin-bottom: 25px;
}

.blog-upplay .leia-mais {
    content: '';
    background: var(--orange);
    height: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-upplay .leia-mais span {
    background: var(--orange);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    padding: 5px 30px;
    border-radius: 20px;
}

.blog-upplay .thumbnail-post {
    overflow: hidden;
}

.blog-upplay .data-post {
    font-size: 14px;
    text-align: center;
    margin: 10px 0;
}

.blog-upplay a .thumbnail-post img {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    transform: scale(1);
    width: 100%;
    height: auto;
    max-height: 219px;
}

.blog-upplay a:hover .thumbnail-post img {
    transform: scale(1.1);
}

.pagination a, .pagination span {
    width: 30px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-left: 2px solid var(--light-gray);
    font-weight: 600;
    margin-top: 15px;
}
.pagination span, .pagination a:hover{
    color: var(--orange);
}
.pagination a:first-child,
.pagination span:first-child{
    border: none !important;
}

/* FILTRO CATEGORIAS */
.list-cat-filter .item-filtro {
    background:var(--extra-light-gray);
    padding: 5px 20px;
}
.list-cat-filter a{
    color: var(--dark-gray);
    font-weight: 500;
    font-size: 14px;
}
.list-cat-filter a.active, .list-cat-filter a:hover{
    color: var(--orange);
}
.list-cat-filter .item-filtro, .list-cat-filter .item-filtro {
    border-left: 2px solid #000;
    border-right: 2px solid transparent;
}
.list-cat-filter a:first-child .item-filtro {
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
    border-radius: 20px 0 0 20px;
}
.list-cat-filter a:last-child .item-filtro {
    /* border-left: 2px solid transparent; */
    border-right: 2px solid transparent;
    border-radius: 0 20px 20px 0;
}


/*  SIDEBAR  */
.titulo-sidebar {
    font-size: 22px;
    border-bottom: 1px solid var(--orange);
    max-width: 250px;
    margin: 40px auto 10px auto;
    font-weight: 700;
    text-align: center;
}
.sidebar-bio {
    background: var(--extra-light-gray);
    padding: 20px 25px;
    text-align: center;
    font-size: 14px;
}
.sidebar-bio a:not(.btn-03){
    color: var(--dark-gray);    
}
.sidebar-bio a:not(.btn-03):hover{
    color: var(--orange);    
}
.sidebar-cat{
    padding: 15px;
    text-align: center;
}
.sidebar-cat ul {
    list-style-type: none;
    padding: 0;
}
.sidebar-cat ul li {
    font-size: 18px;
    border-bottom: 1px solid var(--extra-light-gray);
    max-width: 250px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}
.sidebar-cat ul li a{
    color: var(--dark-gray);
}
.sidebar-cat ul li a:hover{
    color: var(--orange);
}
.item-noticia-sidebar a{
    color: var(--dark-gray);
}
.item-noticia-sidebar a:hover .titulo{
    color: var(--orange);
}
.item-noticia-sidebar img{
    width: 100%;
    height: auto;
    transform: scale(1);
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.item-noticia-sidebar a:hover img{
    transform: scale(1.05);
}
.item-noticia-sidebar .corpo-post{
    background: var(--extra-light-gray);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px;
}
.item-noticia-sidebar .corpo-post .titulo{
    font-size: 16px;
    line-height: initial;
    font-weight: 500;
}
.item-noticia-sidebar .corpo-post .data svg{
    width: 13px;
    height: 13px;
    margin-right: 5px;
}
.item-noticia-sidebar .corpo-post .data{
    margin-top: 5px;
    font-size: 12px;
    display: flex;
    align-items: center;
}
.contact-single {
    background: var(--extra-light-gray);
    padding: 15px;
}
.contact-single input.wpcf7-form-control:not(.wpcf7-submit), .contact-single textarea.wpcf7-form-control {
    background: #fff;
}

.contact-single textarea.form-control {
    background: #ffff;
}
.contact-single input.form-control {
    background: #fff;
}
.contact-single .verificacao {
    flex-direction: column;
    grid-gap: 15px;
}
.contact-single .verificacao input.form-control {
    margin-left: 0 !important;
}

/* BREADCRUMB */
.breadcrumb{
    background: transparent;
}
.breadcrumb button svg{
    width: 18px;
    fill: #dd2c1c;
}
.breadcrumb button:hover svg{
    fill: var(--orange);
    color: var(--orange);
}
.breadcrumb button{
    border: none;
    background: none;
    outline: none;
    margin-right: 5px;
    display: flex;
    align-items: center;
}
.breadcrumb button span{
    font-size: 14px;
}
.breadcrumb, .breadcrumb a{
    color: #fff;
    font-weight: 600;
    font-size: 13px;
}
.breadcrumb.fora-topo{
    padding: 10px 0 0 0;
}
.breadcrumb.fora-topo a, .breadcrumb.fora-topo{
    color: var(--dark-gray);
    font-weight: 400;
    align-items: center;
}
.cabecalho-pagina.single-page .breadcrumb,.cabecalho-pagina.single-page .breadcrumb a{
    color: var(--dark-gray);
}
.breadcrumb a:hover, .cabecalho-pagina.single-page .breadcrumb a:hover{
    color: var(--orange);
}
.breadcrumb span {
    color: var(--orange);
    font-weight: 500;
    font-size: 16px;
}


/* PAGE PROJETOS */
.projetos-page > .container{
    position: relative;
}
img.img-simbol {
    position: absolute;
    top: 0;
    left: 80%;
    max-width: 210px;
    opacity: 0.5;
}
.item-categoria-projeto{
    text-align: center;
    padding: 25px 15px;
}
.item-categoria-projeto a{
    color: var(--dark-gray);
}
.item-categoria-projeto a h2{
    font-weight: 700;
    margin: 10px 0;
    font-size: 24px;
}
.item-categoria-projeto a:hover h2{
    color: var(--orange);
}
.item-categoria-projeto img{
    transform: scale(1);
    max-height: 60px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.item-categoria-projeto .desc-cat {
    font-size: 14px;
}
.item-categoria-projeto a:hover img{
    transform: scale(1.05);
}


/* CTA PROJETOS */
#cta-projetos{
    background: var(--extra-light-gray);
    text-align: center;
}
#cta-projetos h3{
    font-size: 20px;
}
#cta-projetos svg {
    height: 30px;
    margin: 20px 15px;
    fill: var(--orange);
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
#cta-projetos svg:hover path {
    fill: var(--dark-gray);
}

.list-projetos{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.list-projetos .item-projeto{
    width: 20%;
    height: 14vw;
    overflow: hidden;
    position: relative;
}
.list-projetos .item-projeto img{
    height: 100%;
    width: auto;
    min-width: 100%;
    min-height: 100%;
}
.list-projetos .item-projeto .content-projeto div{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.list-projetos .item-projeto .content-projeto a{
    text-align: center;
    display: none;
}
.list-projetos .item-projeto .content-projeto{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgb(0 0 0 / 50%);
    opacity: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.list-projetos .item-projeto:hover .content-projeto{
    opacity: 1;
    display: flex;
}
.list-projetos .item-projeto:hover .content-projeto a{
    display: block;
}
.list-projetos .item-projeto .content-projeto a:hover span{
    background: var(--dark-gray);
}
.list-projetos .item-projeto .content-projeto h2{
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    padding: 0 10px;
}
.list-projetos .item-projeto .content-projeto span{
    background: var(--orange);
    color: #fff;
    border-radius: 20px;
    padding: 7px 20px;
    font-weight: 600;
    font-size: 13px;
}

/* SINGLE BLOG && PROJETOS*/
.owl-single.owl-theme .owl-dots .owl-dot span {
    width: 35px;
    height: 3px;
    margin: 0px 7px;
}
.owl-single.owl-theme .owl-dots .owl-dot.active span, .owl-single.owl-theme .owl-dots .owl-dot:hover span {
    background: var(--orange);
}
.owl-single.owl-theme .owl-nav.disabled+.owl-dots {
    margin-top: 0;
}
.link-voltar button{
    color: var(--dark-gray);
    font-weight: 400;
    font-size: 14px;
    background: transparent;
    border: none;
    outline: none;
}
.link-voltar button:hover{
    color: var(--orange);
}
.link-voltar button span{
    color: var(--orange);
}
.content-single img{
    max-width: 800px;
    width: 100%;
    height: auto;
    max-height: 472px;
}
.content-single h1{
    color: var(--dark-gray);
	color: var(--dark-gray);
    font-size: 30px;
    font-weight: 700;
	margin-top: 25px;
    margin-bottom: 10px;
}
.content-single h2{
    color: var(--orange);
    font-size: 24px;
	margin-top: 25px;
    margin-bottom: 10px;
}
.content-single h3{
    color: var(--orange);
    font-size: 20px;
	margin-top: 25px;
    margin-bottom: 10px;
}
.content-single h4{
    color: var(--orange);
    font-size: 18px;
	margin-top: 25px;
    margin-bottom: 10px;
}
.wp-block-columns {
    margin-bottom: 0px;
}

/**  Página de Serviços  **/

a.btn-producao {
    padding: 8px 30px;
    font-size: 14px;
    border-radius: 20px;
    font-weight: 600;
}

a.btn-producao.bg-gray,
a.btn-producao.bg-orange {
    color: #fff;
}

a.btn-producao.bg-light-orange {
    color: var(--orange);
}

img.servico-icone {
    width: auto;
    height: auto;
    max-width: 40px;
}

h2.servico-title {
    font-size: 22px;
    margin: 0 5px;
    font-weight: 900;
}


/* .criacao-sites, 
.producao-conteudo, 
.producao-seo, 
.marketing-digital, 
.producao-fotografica,
.producao-videos,
.desevolvimento-sistemas{
    font-size: 18px;
} */

.criacao-sites .mockup-site {
    position: absolute;
    width: 500px;
    margin-left: -130px;
    margin-top: 45px;
}

.producao-conteudo {
    background: var(--purple);
}

.producao-seo {
    background: var(--dark-green);
}

img.mockup-seo {
    position: absolute;
    bottom: -65px;
    /* max-width: 650px; */
    width: 60vw;
    max-width: 650px;
}

img.icone-seo {
    margin-left: -50px;
    width: 40vw;
    max-width: 500px;
    height: auto;
}

.marketing-digital {
    background: var(--dark-yellow);
}

img.mockup-conteudo{
    width: 45vw;
    max-width: 100%;
}
img.mockup-marketing,
img.mockup-producao-fotografica,
img.mockup-desenvolvimento-sistemas {
    max-width: 100%;
}

img.mockup-producao-videos {
    max-width: 700px;
    margin-bottom: -100px;
    margin-left: -280px;
    width: 68vw;
}


/* SERVIÇOS INTERNO */

.services-sec1 {
    padding: 10px 0 40px 0;
}

.services-sec1 h2,
.services-sec1 h2 p {
    font-size: 32px;
    padding-bottom: 10px;
    margin-bottom: 0;
}
.services-sec1 h2.titulo-interno-bt{
    font-size: 32px;
    padding-bottom: 10px;
    margin-bottom: 0;
}
.services-sec1 h2.titulo-interno-bt:after {
    content: '';
    background: var(--orange);
    width: 300px;
    height: 1px;
    position: absolute;
    display: block;
    left: calc( 50% - 150px);
    margin-top: 10px;
}
.services-sec1 .content-text-ini {
    padding: 15px 60px 15px 15px;
}


/* ARVORE */

div.ancora {
    position: absolute;
    margin-top: -60px;
}

div.arvore {
    position: relative;
    padding-top: 50px;
    margin-top: 30px;
}

div.arvore ul {
    list-style-type: none;
    padding: 0;
    display: flex;
    justify-content: space-between;
    justify-content: center;
}

div.arvore li {
    padding-top: 45px;
    padding-bottom: 10px;
    position: relative;
    flex: 1;
    min-width: 20%;
}

div.arvore li a {
    font-size: 22px;
    text-align: center;
    color: var(--dark-gray);
    padding: 0 20px;
    font-weight: 600;
    display: flex;
    line-height: initial;
    justify-content: center;
}

div.arvore li a:hover  {
    color: var(--orange);
}

div.arvore.content-blue li a:hover {
    color: var(--light-blue);
}

div.arvore:before {
    content: '';
    width: 1px;
    height: 50px;
    top: 0;
    background: var(--orange);
    position: absolute;
    left: 50%;
}

div.arvore.content-blue:before {
    background: var(--light-blue);
}

div.arvore li::before,
div.arvore li::after {
    content: '';
    position: absolute;
    top: 0;
    right: 50%;
    border-top: 1px solid var(--orange);
    width: 50%;
    height: 30px;
}

div.arvore.content-blue li::before,
div.arvore.content-blue li::after {
    border-top: 1px solid var(--light-blue);
}

div.arvore li:first-child::before,
div.arvore li:last-child::after {
    border: 0 none;
}

div.arvore li::after {
    right: auto;
    left: 50%;
    border-left: 1px solid var(--orange);
}

div.arvore li:last-child::before {
    border-right: 1px solid var(--orange);
    border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
}

div.arvore.content-blue li::after {
    border-left: 1px solid var(--light-blue);
}

div.arvore.content-blue li:last-child::before {
    border-right: 1px solid var(--light-blue);
}

div.arvore.content-blue li:first-child::before,
div.arvore.content-blue li:last-child::after{
    border: 0 none;
}

div.arvore li:first-child::after {
    border-radius: 5px 0 0 0;
    -webkit-border-radius: 5px 0 0 0;
    -moz-border-radius: 5px 0 0 0;
}

div.arvore-inversa {
    position: relative;
    padding-top: 5px;
}

div.arvore-inversa ul {
    list-style-type: none;
    padding: 0;
    display: flex;
    justify-content: space-between;
    justify-content: center;
}

div.arvore-inversa li {
    padding-top: 35px;
    padding-bottom: 10px;
    position: relative;
    flex: 1;
}

div.arvore-inversa li a {
    font-size: 22px;
    text-align: center;
    color: var(--dark-gray);
    padding: 0 20px;
    font-weight: 600;
    display: flex;
    line-height: initial;
    justify-content: center;
}

div.arvore-inversa li a:hover {
    color: var(--orange);
}

div.arvore-inversa li::before,
div.arvore-inversa li::after {
    content: '';
    position: absolute;
    top: 0;
    right: 50%;
    border-top: 1px solid var(--orange);
    width: 50%;
    height: 30px;
}

div.arvore-inversa li:first-child::before,
div.arvore-inversa li:last-child::after {
    border: 0 none;
}

div.arvore-inversa li::after {
    right: auto;
    left: 50%;
    border-left: 1px solid var(--orange);
}

div.arvore-inversa li:last-child::before {
    border-right: 1px solid var(--orange);
    border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
    transform: rotateX(-180deg);
    margin-top: -29px;
}

div.arvore-inversa li:first-child::after {
    border-radius: 5px 0 0 0;
    -webkit-border-radius: 5px 0 0 0;
    -moz-border-radius: 5px 0 0 0;
    transform: rotateX(-180deg);
    margin-top: -29px;
}


/* SINGLE MARKETING DIGITAL */

.mkt-sec1 {
    background: rgba(255, 178, 125, 0.1);
    padding-top: 40px;
    min-height: 400px;
}

.mkt-sec1 img {
    position: absolute;
    margin-top: 15px;
    max-height: 350px;
    width: auto;
    max-width: calc( 100% - 30px);
    z-index: 1;
    right: 15px;
}

.mkt-sec2 {
    padding-top: 100px;
    padding-bottom: 50px;
    background-image: radial-gradient(#fdfdfd, #ececec);
    position: relative;
}

.mkt-sec2 img.bottom-mkt {
    position: absolute;
    right: 5vw;
    bottom: -38px;
    width: 50vw;
    max-width: 500px;
}

.mkt-sec2 .icone-serv {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mkt-sec2 .icone-serv img {
    max-width: 80px;
    max-height: 80px;
    height: auto;
}

.mkt-sec3 {
    padding: 30px 0;
}

.mkt-sec3 .row {
    align-items: center;
    min-height: 350px;
}


/* SINGLE PRODUCAO FOTOFRAFICA */

.pf-sec1 {
    background-image: radial-gradient(#fdfdfd, #ececec);
    padding-top: 40px;
    min-height: 460px;
}

.pf-sec1 img {
    height: 18vw;
    max-height: 360px;
    position: absolute;
    right: 15px;
    min-height: 90%;
    margin-top: 10px;
}

.pf-sec2 {
    padding: 30px 0;
    position: relative;
    display: flex;
    align-items: center;
}

.pf-sec2 .row {
    min-height: 430px;
}

.pf-sec2>img {
    position: absolute;
    /* top: 30px; */
    left: 50vw;
    height: auto;
    width: 50vw;
    max-width: 650px;
}

.pf-sec3 {
    padding: 50px 0;
    min-height: 460px;
}

.pf-sec3 img {
    max-width: calc( 100% - 50px);
    position: absolute;
    top: -90px;
}

section.pf-sec4 {
    padding: 40px 0;
}


/* SINGLE SEO */
.bg-service-seo {
    position: relative;
}
/* .bg-service-seo > img {
    position: absolute;
    left: 50vw;
    top: 15px;
    width: 50vw;
    max-width: 550px;
} */
.seo-sec1{
    margin-top: -7vw;
}
.seo-sec3 img.imagem-esq {
    height: 18vw;
    max-height: 360px;
    position: absolute;
    right: 15px;
    min-height: 90%;
    margin-top: 10px;
}
.seo-sec4 {
    background-image: linear-gradient( #fff 85%, #919191);
}


/* SINGLE PRODUCAO DE VÍDEO */
.pv-sec1 {
    background-image: radial-gradient(#fdfdfd, #ececec);
    padding-top: 40px;
    min-height: 390px;
}

.pv-sec1 img {
    height: 18vw;
    max-height: 360px;
    position: absolute;
    right: 15px;
    min-height: 90%;
    margin-top: 10px;
}

.pv-sec2 {
    padding: 30px 0;
    position: relative;
    display: flex;
    align-items: center;
}

.pv-sec2 .row {
    min-height: 430px;
}

.pv-sec2 .img-float {
    position: absolute;
    left: 55%;
    width: 40%;
}

.pv-sec2 .img-float img {
    height: auto;
    width: 40vw;
    max-width: 600px;
}

.pv-sec2 .img-float a:hover img, .img-vid-prev:hover {
    box-shadow: 0 0 10px #4a4a49;
}

.img-vid-prev iframe {
    max-width: 100%;
}

.pv-sec3 {
    background: #000;
    padding: 100px 0;
    position: relative;
}

.pv-sec3::before {
    content: '';
    background: url(../images/retangulo-filme.svg) center repeat-x;
    height: 10px;
    width: 100%;
    position: absolute;
    background-repeat: round;
    top: 20px;
}

.pv-sec3::after {
    content: '';
    background: url(../images/retangulo-filme.svg) center repeat-x;
    height: 10px;
    width: 100%;
    position: absolute;
    background-repeat: round;
    bottom: 20px;
}

.pv-sec4 {
    padding: 40px 0;
}

.pv-sec4 img {
    max-width: 100%;
}

.pv-sec5 {
    padding: 40px 0;
    background-image: radial-gradient(#fdfdfd, #ececec);
}

.pv-sec5 img {
    max-width: 80%;
}

.pv-sec6 {
    padding: 40px 0;
}

.pv-sec6 .img-fluid {
    width: 100%;
}


/* PRODUÇÃO DE CONTAUDO */
.bg-service-producao-conteudo{
    background: url(https://teste.upplay.com.br/upplay/wp-content/themes/upplay/images/servicos/icone-gray-producao-conteudo.svg) 2vw 2vw no-repeat;
    background-size: 24vw;
}

.bg-service-producao-conteudo img{
    width: 320px;
    max-width: 100%;
}
.pc-sec2{
    position: relative;
}
.pc-sec2 > img{
    position: absolute;
    top: 42px;
    right: 58vw;
    width: auto;
    max-width: 35vw;
}

.pc-sec3{
    position: relative;
}
.pc-sec3 > img{
    position: absolute;
    left: 50vw;
    top: 42px;
    width: auto;
    max-width: 42vw;
}

/* CRIACAO DE SITES */
.bg-service-criacao-sites{
    background: url(https://teste.upplay.com.br/upplay/wp-content/themes/upplay/images/servicos/icone-gray-sites.svg) 2vw 2vw no-repeat;
    background-size: 24vw;
}

.cs-sec1{
    background: linear-gradient(90deg, #ededed, white) !important;
    position: relative;
}
.cs-sec1 .img-processos{
    position: absolute;
    width: auto;
    left: -315px;
    top: 0;
    height: 100%;
    max-width: 450px;
}
.cs-sec3 h2.title-single b, .cs-sec3 h2.title-single strong{
    color: var(--orange);
}
.cs-sec3 .list-mkps{
    margin-top: -100px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
.cs-sec3 .list-mkps .img-left{
    max-height: 430px;
    max-width: 45%;
}
.cs-sec3 .list-mkps .img-right{
    max-height: 500px;
}
.cs-sec4 h2.title-single b, .cs-sec4 h2.title-single strong{
    color: var(--orange);
}
.cs-sec4 .list-img-blog {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: -80px;
    margin-bottom: -80px;
}
.cs-sec4 .list-img-blog img{
    width: 450px;
    max-width: 100%;
}
.cs-sec6 h2.title-single b, .cs-sec6 h2.title-single strong{
    color: var(--orange);
}
.cs-sec6 {
    background-image: linear-gradient( #fff 70%, #919191);
    position: relative;
}
.cs-sec6 .content-image-left img{
    max-height: 420px;
}
.cs-sec6 .content-image-left{
    margin-top: -80px;
}
.line-hr-orange hr{
    max-width: 100%;
    width: 500px;
    border-top: 1px solid #ff4b3c;
}


/* DESENVOLVIMENTO DE SISTEMAS */

.ds-sec1 {
    background: rgba(156, 196, 213, 0.5);
    padding: 40px 0;
}

.ds-sec1 img {
    max-width: 100%;
    margin-top: -20%;
}

.ds-sec2 {
    padding: 40px 0;
}

.bkg-titulo-des-sis {
    min-height: 475px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bkg-titulo-des-sis h2 {
    max-width: 250px;
}


/**  CTA  **/

.cta-upplay {
    background: var(--dark-gray);
    color: #fff;
    font-weight: 600;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.cta-upplay img {
    max-width: 70px;
    width: 100%;
    height: auto;
}

/** POLÍTICA DE PRIVACIDADE*/
.introducao-politica_logo {
    display: flex;
    justify-content: center;
    align-items: center;
}
#introducao-politica .container {
    padding-top: 70px;
    padding-bottom: 40px;
}
#conteudo-politica h2 {
    padding-top: 15px;
}

/* COOKIES  */
.row-cookies{
    width: 100%;
    display: flex;
    justify-content: center;
}
.box-cookies.hide {
    display: none !important;
}
.box-cookies {
    position: fixed;
    background: #fff;
    z-index: 1000;
    bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 0 5px #8a8a8a;
    border-radius: 5px;
}
.box-cookies .msg-cookies,
.box-cookies .btn-cookies {
    text-align: left;
    padding: 25px;
    color: #464646;
    font-size: 14px;
}
.box-cookies .msg-cookies{
    margin: 0;
    padding: 15px 25px;
    width: 100%;
}
.box-cookies .btn-cookies {
    min-width: 200px;
    background: #ff6147;
    cursor: pointer;
    align-self: normal;
    border: none;
    color: #fff;
    font-size: 16px;
    border-radius: 0 5px 5px 0;
    display: inline-block;
    text-align: center;
    padding: 0 !important;
    outline: none;
}


/*   FOOTER   */

footer {
    background: #4A4A49;
    color: #fff;
    font-size: 13px;
}

footer p.titulo-footer {
    font-size: 12px;
    text-transform: uppercase;
    color: #fff;
    font-weight: 600;
}

footer p.titulo-footer:after {
    content: '';
    display: block;
    width: 30px;
    height: 1px;
    background: var(--orange);
    margin: 5px auto 5px 0;
}

p.titulo-contato{
    text-transform: uppercase;
    color: var(--dark-gray);
    font-weight: 600;
}
p.titulo-contato:after {
    content: '';
    display: block;
    width: 30px;
    height: 1px;
    background: var(--orange);
    margin: 5px auto 5px 0;
}

footer .logo-footer {
    text-align: center;
}

footer .logo-footer img {
    max-width: 100%;
}
footer .logo-footer {
    width: 200px;
    margin: 0 auto;
    max-width: 100%;
}
ul.servicos-footer {
    list-style: none;
    padding: 0px;
}
.item-footer {
    width: 20%;
    padding-inline: 16px;
}
footer .container .row>div {
    padding-top: 20px;
}

footer .container .row>div:not(:first-child) {
    border-left: 1px solid #fff;
}

footer a {
    color: #fff;
    font-size: 13px;
}

footer a:hover {
    color: var(--orange);
}

footer p.copy {
    margin-top: 25px;
    margin-bottom: 0;
    text-align: center;
    font-weight: 500;
    font-size: 10px;
    background: #000;
    padding: 15px 2px;
}



/* PAGINA CONTATO */

.titulo-form:after {
    content: '';
    display: block;
    width: 80px;
    height: 1px;
    background: var(--orange);
    margin: 5px auto 15px 0;
}
#mapa iframe{
    height: 450px;
    width: 100%;
    margin-bottom: -10px;
}
ul.contato-contato {
    list-style-type: none;
    padding: 0;
}
ul.contato-contato li {
    display: flex;
    margin: 15px auto;
    font-size: 14px;
}
ul.contato-contato a{
    color: var(--dark-gray);
}
ul.contato-contato a:hover{
    color: var(--orange);
}

ul.contato-contato svg,
ul.contato-footer svg {
    fill: #fff;
    max-width: 26px;
    max-height: 26px;
    margin-right: 10px;
}
ul.contato-contato svg {
    fill: var(--orange);
    max-width: 26px;
    max-height: 26px;
    margin-right: 10px;
}
input.wpcf7-form-control, textarea.wpcf7-form-control {
    width: 100%;
    background: rgba(126, 126, 128, 0.1);
    border: none;
    padding: 10px;
    border-radius: 3px;
    font-size: 14px;
    color: #2a2a2a;
    resize: none;
}
input.wpcf7-submit {
    background: var(--orange);
    color: #fff;
    width: auto;
    padding: 5px 34px;
    font-weight: 600;
    border: none !important;
    font-size: 16px;
    border-radius: 20px;
    outline: none !important;
    text-transform: uppercase;
    font-size: 14px;
    float: right;
}
input.wpcf7-submit:hover {
    background: var(--dark-gray);
}
.wpcf7-not-valid-tip {
    font-size: 13px;
}
.wpcf7 form.invalid .wpcf7-response-output {
    text-align: center;
    font-size: 13px;
}



ul.contato-footer{
    list-style-type: none;
    padding: 0;
}
ul.contato-footer li{
    display: flex;
    margin: 15px auto;
}
ul.contato-footer li:not(.item) {
    align-items: center;
}

.redes-sociais-contato ul,
.redes-sociais-footer ul {
    display: flex;
    list-style-type: none;
    justify-content: space-evenly;
    margin: 15px auto;
    max-width: 165px;
    padding: 0;
}


ul.contato-footer svg {
    fill: #fff;
    max-width: 26px;
    max-height: 26px;
    margin-right: 10px;
}
.redes-sociais-contato ul a,
.redes-sociais-footer ul a{
    height: 35px;
    width: 35px;
    font-size: 18px;
    border: 1px solid #fff;
    border-radius: 15px;
    display: flex;
    text-align: center;
    align-items: center;
    flex-direction: row;
    margin: 0 2px;
    justify-content: center;
    color: #fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.redes-sociais-footer ul a:hover,
ul.redes-sociais-contato a:hover {
    border: 1px solid #fff;
    background: var(--orange);
    color: #fff;
}
.redes-sociais-contato ul a {
    border: 1px solid var(--orange);
    color: var(--orange);
}
.redes-sociais-contato ul a:hover {
    border: 1px solid #fff;
    background: var(--orange);
}
.redes-sociais-contato ul a:hover svg {
    fill: #fff;
}

.redes-sociais-footer ul svg{
    max-width: 18px;
    max-height: 18px;
    fill: #fff;
}
.redes-sociais-contato ul svg{
    max-width: 18px;
    max-height: 18px;
    fill: var(--orange);
}

footer .menu ul {
    list-style-type: none;
    padding: 0;
}

footer .menu li {
    margin: 5px 0;
}

footer .menu-item a {
    font-size: 13px;
}
ul#menu-menu-principal-1 {
    list-style: none;
    padding-left: initial;
    margin-bottom: 0;
}

.copyright {
    background: var(--dark-gray);
    padding: 15px 0;
}

.copyright p {
    font-size: 12px;
}


/** BTN TOP   **/

.div-gotop {
    opacity: 0;
    display: block;
    position: fixed;
    right: 35px;
    bottom: 100px;
    z-index: 10;
}

.div-gotop button.gotop {
    background: transparent;
    outline: 0 !important;
    box-shadow: none;
    border: none;
    text-shadow: none;
    cursor: pointer;
    margin: 0;
    padding: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.div-gotop button.gotop img {
    width: 50px;
}

.div-gotop.active {
    opacity: 1;
}

/* .div-gotop.active button.gotop {
    animation: 1.5s ease-out 0s 1 slideInFromTop;
}

@keyframes slideInFromTop {
    0% {
        transform: translateY(-1500%);
        opacity: 0;
    }
    20% {
        opacity: 0.6;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
} */
@keyframes pulseCircle {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}


/**
* 
* Media Querys
*/

@media screen and (max-width: 1440px) {
    #slider .owl-nav {
        width: 100%;
        left: 0;
    }
    .list-projetos .item-projeto{
        width: 25%;
        height: 16vw;
    }
}

@media screen and (max-width: 1440px) {
    h1.titulo-home,
    .sobre-upplay .title-custom p,
    .servicos-upplay .title-services, .servicos-upplay .title-services p,
    .projetos-upplay .titulo-projetos, .projetos-upplay .titulo-projetos p,
    .blog-upplay .titulo-blog, .titulo-interno-destaque, .titulo-blog p,
    .title-parceiros, .title-parceiros p, 
    .title-parceiros strong, .title-parceiros strong p,
    .services-sec1 h2, .services-sec1 h2 p, 
    .services-sec1 h2.titulo-interno-bt{
        font-size: 28px;
    }
}

@media screen and (max-width: 1199px) {
    .container{
        max-width: 100%;
    }
    .sobre-upplay .title-custom p{
        max-width: none;
    }
    .content-sobre-right {
        padding-top: 50px;
    }
    .servicos-upplay .img-services {
        margin-top: -50px;
        width: 50vw;
    }
    .servicos-upplay .title-services, .servicos-upplay .title-services p{
        width: 50vw;
    }
    ul.list-servicos img {
        width: 35px;
    }
    ul.list-servicos h2, .cta-upplay {
        font-size: 18px;
    }
    .criacao-sites .mockup-site {
        width: 35vw;
        margin-left: 0;
        margin-top: 20px;
    }
    div.arvore li h2, div.arvore-inversa li h2 {
        font-size: 18px;
    }
    .services-sec1 .content-text-ini {
        padding: 15px;
    }
    .cs-sec1 .img-processos{
        position: relative;
        height: auto;
        max-width: 100%;
        margin: 0 auto;
        left: auto;
        top: auto;
    }
    .list-projetos .item-projeto{
        width: 33.333%;
        height: 23vw;
    }
}

@media screen and (max-width: 1080px) {
    img.mockup-producao-videos {
        margin-left: -30vw;
    }
    .pv-sec1 img, .pf-sec1 img {
        height: auto;
        max-height: initial;
        min-height: initial;
        width: 100%;
    }
    .mkt-sec2 img.bottom-mkt {
        opacity: 0.3;
    }
    .ds-sec1 img {
        margin-top: 20px;
    }
}

@media screen and (max-width: 991px) {
    body, html, p,
    .desc-small, .desc-small p {
        font-size: 14px;
    }
    div.arvore li h2, div.arvore-inversa li h2 {
        font-size: 16px;
    }
    .pv-sec3 {
        padding: 70px 0;
    }
    .pf-sec3 img {
        max-width: calc( 100% - 15px);
        position: relative;
        top: auto;
    }
    #img-topo-servicos .content-slide h1 {
        font-size: 30px;
    }
    
    #slider .content-slide svg ,
    #img-topo-servicos .content-slide svg {
        height: 28px;
        margin: 15px 15px;
    }
    .navbar {
        justify-content: flex-end;
    }
    ul#menu-menu-principal li:nth-child(2) {
        padding-right: 0px;
    }
    header .navbar {
        padding-right: 0px;
        padding-left: 0px;
    }
    #navegacao {
        z-index: 1;
    }
    ul#menu-menu-principal {
        position: absolute;
        background: white;
        /* top: 69px; */
    }
    .navbar label {
        display: block;
    }
    
    .img-fluid {
        max-width: 345px;
        max-height: 340px;
        width: 300px;
        height: auto;
    }
    .circle-img-fluid-1 {
        position: absolute;
        width: 55px;
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        top: 13px;
        left: 115px;
    }
    .circle-img-fluid-2 {
        position: absolute;
        width: 55px;
        top: 181px;
        left: 59px;
    }
    .circle-img-fluid-3 {
        position: absolute;
        width: 60px;
        height: 60px;
        display: flex;
        top: 121px;
        left: 226px;
        justify-content: center;
        align-items: center;
    }
    .imgs {
        position: relative;
    }
    .text-1, 
    .text-2, 
    .text-3 {
        padding: 15px;
        width: 100%;
        max-width: 100%;
    }
    .text-1 img, 
    .text-2 img, 
    .text-3 img {
        display: none;
    }
    .text-2 {
        margin-top: 0px;
    }
    img.img-simbol {
        top: 37px;
        max-width: 170px;
        left: 75%;
    }
    ul#menu-menu-principal a {
        padding-bottom: 0px;
    }
    ul#menu-menu-principal a:hover,
    ul#menu-menu-principal li.current-menu-item, 
    ul#menu-menu-principal li.current-page-ancestor {
        opacity: 0.5;
    }
    footer .logo-footer {
        width: 200px;
        height: 125px;
        margin: 0 auto;
    }
    .item-footer {
        width: 25%;
    }
    .item-logo-footer {
        width: 100% !important;
    }
    footer .row {
        justify-content: center;
    }
    .item-footer:not(.item-logo-footer){
        margin-top: 20px;
    }
}


@media screen and (max-width: 767px) {
    .owl-carousel .owl-item img {
        height: auto;
        width: 100%;
        overflow: hidden;
    }
    h1.titulo-home,
    .sobre-upplay .title-custom p,
    .servicos-upplay .title-services, .servicos-upplay .title-services p,
    .projetos-upplay .titulo-projetos, .projetos-upplay .titulo-projetos p,
    .blog-upplay .titulo-blog, .titulo-interno-destaque, .titulo-blog p,
    .title-parceiros, .title-parceiros p, 
    .title-parceiros strong, .title-parceiros strong p,
    h2.title-single, h2.title-single p,
    .services-sec1 h2, .services-sec1 h2 p,
    .services-sec1 h2.titulo-interno-bt {
        font-size: 22px;
        text-align: center;
    }
    #img-topo-servicos .content-slide h1 {
        font-size: 24px;
    }
    h3.title-single, h3.title-single p {
        font-size: 18px;
    }
    ul.list-servicos h2, .cta-upplay {
        font-size: 16px;
    }
    .servicos-upplay .img-services {
        margin-top: -25px;
        width: 100%;
        height: 60vw;
    }
    .title-custom{
        margin-bottom: 10px;
    }
    .servicos-upplay .title-services, .servicos-upplay .title-services p{
        width: auto;
        text-align: left;
        padding-left: 20px;
        margin-bottom: 0;
    }
    .cta-upplay{
        display: block;
    }
    .list-projetos .item-projeto .content-projeto{
        opacity: 1;
        display: flex;
    }
    .list-projetos .item-projeto .content-projeto a{
        display: block;
    }
    .list-projetos .item-projeto .content-projeto h2 {
        font-size: 20px;
    }
    .list-parceros .item-parceiros {
        width: 130px;
    }   
    .wa__btn_popup .wa__btn_popup_txt{
        display: none;
    }
    .blog-upplay .titulo-blog:after, hr.orange-border{
        display: none;
    }
    .blog-upplay .titulo-blog img {
        margin-left: 0;
        max-width: 50px;
    }
    section.criacao-sites {
        min-height: 320px;
    }
    img.mockup-producao-videos {
        margin-left: 0;
        width: 100%;
    }
    h2.servico-title {
        font-size: 20px;
    }
    .pv-sec1 img, .pf-sec1 img {
        right: 0;
        position: relative;
    }
    .mkt-sec2 {
        padding-top: 50px;
    }
    .mkt-sec3 .row {
        min-height: auto;
    }
    .mkt-sec1 img, .pf-sec1 img{
        position: relative;
    }
    .bkg-titulo-des-sis {
        min-height: 400px;
    }
    .cs-sec1 .img-processos{
        max-height: 300px;
    }
    .cs-sec3 .list-mkps{
        margin-top: 20px;
        margin-bottom: 25px;
    }
    .cs-sec6 .content-image-left{
        position: absolute;
        left: 15px;
        top: 0;
        max-width: 160px;
        opacity: 0.8;
        margin-top: 0;
    }
    .cs-sec6 {
        background-image: linear-gradient( #fff 70%, #cccccc);
    }
    /* #img-topo-servicos .img-fundo-servicos img {
        max-height: 280px;
    } */
    .pf-sec2>img{
        position: relative;
    }
    .seo-sec1{
        margin-top: 0;
    }
    .list-projetos .item-projeto{
        width: 50%;
        height: 31vw;
    }
    .imgs-fluid {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #img-topo-servicos .img-fundo-servicos, 
    .cabecalho-pagina .img-cabecalho-pagina {
        min-height: 0px;
    }
    img.img-simbol {
       display: none;
    }
    .services-sec1 {
        padding: 10px;
    }
    .services-sec1 .content-text-ini {
        padding: 0px;
    }
    .ds-sec1, 
    .mkt-sec2, 
    .mkt-sec1,
    .pf-sec3 {
        padding: 30px 0px;
    }
    .pv-sec1 {
        padding-top: 15px;
    }
    .services-sec1 h2, 
    .services-sec1 h2 p {
        padding-bottom: 2px;
    }
    .pf-sec1, 
    section.pf-sec4 {
        padding-top: 20px;
    }
    img.mockup-producao-fotografica{
        padding-left: 15px;
    }
    #img-topo-servicos .img-fundo-servicos img{
        width: 100%;
    }
    .item-footer {
        width: 50%;
    }
    .title-custom p {
        text-align: center;
    }
    .sobre-upplay .title-custom-itens {
        text-align: center;
    }
    .titulo-form:after {
        margin: 0px auto;
        margin-bottom: 15px;
    }
    .services-sec1 h2, .services-sec1 h2 p {
        margin: 0 auto;
    }

    .row-cookies .box-cookies {
        display: flex;
        flex-direction: column;
    }
    .btn-cookies {
        height: 55px;
    }
}

@media screen and (max-width: 575px) {
    h1.titulo-home,
    .sobre-upplay .title-custom p,
    .servicos-upplay .title-services, .servicos-upplay .title-services p,
    .projetos-upplay .titulo-projetos, .projetos-upplay .titulo-projetos p,
    .blog-upplay .titulo-blog, .titulo-interno-destaque, .titulo-blog p,
    .title-parceiros, .title-parceiros p, 
    .title-parceiros strong, .title-parceiros strong p,
    h2.title-single, h2.title-single p,
    .services-sec1 h2, .services-sec1 h2 p,
    .services-sec1 h2.titulo-interno-bt{
        font-size: 20px;
        
    }
    .servicos-upplay .title-services{
        padding: 0 15px;
    } 
    .servicos-upplay .title-services p, ul.list-servicos{
        padding: 0;
    }
    .criacao-sites .mockup-site {
        width: 100%;
        position: relative;
        margin-top: 10px;
    }
    img.mockup-conteudo {
        width: 100%;
    }    
    img.mockup-seo {
        position: relative;
        bottom: auto;
        width: 100%;
        max-width: 100%;
    }
    .bkg-titulo-des-sis {
        min-height: 320px;
    }
    .cs-sec3 .list-mkps .img-right {
        max-width: 45%;
    }
    .line-hr-orange hr {
        max-width: 90%;
    }
    #slider .content-slide svg ,
    #img-topo-servicos .content-slide svg {
        height: 22px;
        margin: 15px 8px;
    }
    .list-projetos .item-projeto{
        width: 100%;
        height: 58vw;
    }
    section {
        text-align: center;
    }
    footer .container .row>div:not(:first-child) {
        border-left: none;
        padding-left: 20px;
    }
    .centraliza-mb{
        justify-content: center !important;
    }
    img.servico-icone {
        max-width: 36px;
    }
    #img-topo-servicos .content-slide h1 {
        font-size: 20px;
    }
    .wa__btn_popup .wa__btn_popup_icon {
        width: 50px;
        height: 50px;
    }
    .div-gotop {
        right: 85px;
        bottom: 28px;
    }
    .div-gotop button.gotop img {
        width: 52px;
    }
}
@media screen and (max-width: 475px) { 
    #cta-projetos svg {
        height: 6vw;
    }
    .item-footer {
        width: 100%;
    }
    #slider .content-slide svg, #img-topo-servicos .content-slide svg {
        margin: 5px;
    }
    #cta-projetos svg {
        margin: 15px 7px;
    }
}
@media screen and (max-width: 400px) { 
    h2.servico-title {
        font-size: 18px;
    }
}