/* montserrat-regular - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/montserrat-v25-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/montserrat-v25-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/montserrat-v25-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/montserrat-v25-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/montserrat-v25-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/montserrat-v25-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
  }
  /* montserrat-500 - latin */
  @font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/montserrat-v25-latin-500.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/montserrat-v25-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/montserrat-v25-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/montserrat-v25-latin-500.woff') format('woff'), /* Modern Browsers */
         url('../fonts/montserrat-v25-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/montserrat-v25-latin-500.svg#Montserrat') format('svg'); /* Legacy iOS */
  }
  /* montserrat-600 - latin */
  @font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/montserrat-v25-latin-600.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/montserrat-v25-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/montserrat-v25-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/montserrat-v25-latin-600.woff') format('woff'), /* Modern Browsers */
         url('../fonts/montserrat-v25-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/montserrat-v25-latin-600.svg#Montserrat') format('svg'); /* Legacy iOS */
  }
  /* montserrat-700 - latin */
  @font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/montserrat-v25-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/montserrat-v25-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/montserrat-v25-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/montserrat-v25-latin-700.woff') format('woff'), /* Modern Browsers */
         url('../fonts/montserrat-v25-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/montserrat-v25-latin-700.svg#Montserrat') format('svg'); /* Legacy iOS */
  }
  /* montserrat-800 - latin */
  @font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 800;
    src: url('../fonts/montserrat-v25-latin-800.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/montserrat-v25-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/montserrat-v25-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/montserrat-v25-latin-800.woff') format('woff'), /* Modern Browsers */
         url('../fonts/montserrat-v25-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/montserrat-v25-latin-800.svg#Montserrat') format('svg'); /* Legacy iOS */
  }
  /* montserrat-900 - latin */
  @font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/montserrat-v25-latin-900.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/montserrat-v25-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/montserrat-v25-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/montserrat-v25-latin-900.woff') format('woff'), /* Modern Browsers */
         url('../fonts/montserrat-v25-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/montserrat-v25-latin-900.svg#Montserrat') format('svg'); /* Legacy iOS */
  }





html{
    scroll-behavior: smooth;
    }

    #body-container {
        width:100%;
        padding:0;
        margin:0;
        overflow-x: hidden;
    
       }
    
body {
    background-color: #32b5e8!important;
    font-family: 'Montserrat', sans-serif!important;
    overflow-x: hidden;
    min-height: 100vh;
    max-width: 100vw;
    background-image: url("../imgs/logo-oclab-bg.svg");
    background-size: 200vw;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0!important;
    padding: 0!important;
    
}

.obrigado-box {
    font-size:3em;
    height:100vh;
    color:white!important;
    font-weight: 700!important;
    text-align:center;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.voltar-home {
    font-size:.5em!important;
}

.voltar-home img {
width:.7em;
height:.7em;
margin-left:1vw;
}

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
    margin-top: 8vw;
    margin-bottom: 30px;
   }
   .embed-container iframe, .embed-container object, .embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
   }
   





a {
    color: white!important;
    text-decoration: none!important;    
    font-weight: 800;
    font-size: 1.3vw;
}

a:hover {
    background: rgba(0, 0, 0, .05);
}

#header {
    width:100vw;
    height:8vw;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    
    padding: 0 2vw 0 2vw;
    top:0;
    margin-bottom:2vw;
    z-index: 1000;
    position:fixed;
    background-color: #32b5e8;
    backface-visibility: hidden;
    
}

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

#logo {
    
    z-index:5;
    width:10%;
         
}

#logo img {
    
   
    width:100%;
         
}

#links-menu {
    display: flex;
    white-space: nowrap;
    list-style: none;
    gap: 1rem;
}

#social-menu {
    box-sizing: border-box;
    display: flex;    
    gap: 1rem;
    align-items: center;
}

#nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
       
}

#menu a {
    display: block;
    padding: .5rem;
    font-size:.6em;
}

#social-menu a {
    display: block;
    padding: .5rem;
}

#btn-mobile {
    display: none;
}

#main-home {
    margin: 5vw auto;
	max-width: 100vw;
    
    display: flex;
    flex-direction: column;
    justify-content: center;
    
}

.home-video-tapume {
    position:relative;
    width: 100vw;
    height:100%;    
        
}

#categorias-home {
    position:absolute;
    display: flex;    
    justify-content: space-between;
    padding: 10vw 7vw 0vw 7vw;
    width:100vw;
    height:auto;
    
    scroll-margin-top: 9vw;
    
}

.dd-tit {
    position:absolute;
    transform: rotate(2deg);
    left: 29vw;
    margin-top: -8vw;
    width:40vw;
    
}

.btn-categoria {
    width: 23vw;    
}

.btn-categoria-motion {
    position:relative;
}

.btn-categoria-web {
    position:relative;
}

.btn-categoria-branding {
    position:relative;
}

#spot-bts1 {
    position: absolute;
    width: 23vw;
    left: 0vw;
}

#spot-bts2 {
    position: absolute;
    width: 23vw;
    left: 0vw;
}

#spot-bts3 {
    position: absolute;
    width: 23vw;
    left: 0vw;
    margin-top:.6vw;
}

.video01 {    
    width: 23vw;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJDYW1hZGFfMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNDQyLjYgMzMzLjEiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojZmYwMGEwO308L3N0eWxlPjwvZGVmcz48ZyBpZD0icHJhbmNoZXRhMDIiPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTU1LjMxLDEzMC40MWMtOC44NCwxNi45NS03Ljg1LDE0LjExLTIwLjU4LDQ3LjI3LTQuMTUsMTAuODEtNS4zNCwyNC45OS02LjEsMzYuNTktLjg5LDEzLjY5LDMuNSwyNi41OS0uNzYsMzkuNjQtMy42NywxMS4yMy05LjY3LDE5Ljk5LTE2LjUsMjguODMtNi44Myw4Ljg1LTEzLjAzLDIwLjc4LTEwLjk1LDMxLjk3LDIuODgsMTUuNTMsMTguNzgsMTguNjUsMzEuNzYsMTcuOTMsMjAuMDktMS4xMiw0MS4wNi00LjMzLDYxLjI2LTQuNzgsNzcuOTMtMS43MiwxNDUuNzIsMjAuNDMsMjE4LjA0LTE1LjI1LDE3LjM3LTguNTcsMzQuOTMtMjEuMDksNDQuOS00MS4yNCwxNi41Ni0zMy40NiwxLjU1LTcxLjYzLDIzLjcxLTk5LjgsNy40MS05LjQyLDI5Ljg1LTI5LjE5LDM4Ljg4LTM1LjgzLDUuOTEtNC4zNSwyMy42My0xOS44NCwyMy42My0zOC4xMiwwLTE0LjQ5LTMwLjk1LTI0LjMtMzcuMzYtMjkuNzMtMTUuOTQtMTMuNTItMzQuODMtNDQuMTktNTEuODQtNTUuNjVDMzQyLjAyLDQuNTgsMzIyLjU3LC4zMSwzMDkuMTgsLjA1Yy0zNi42Ni0uNzItNTcuOTQsNi44Ni04OS45NiwyMS4zNS0zMy44NCwxNS4zMS01Ni4yOCwzOC4zNi05MC4yOCw0OC42My03LjY5LDIuMzItOC43NSwzLjA0LTIyLjc4LDguNDQtMTQuMDMsNS40LTI2LjY5LDEwLjI2LTM0Ljg0LDE5LjE3LTguMTUsOC45MS03LjE3LDE1LjgzLTE2LjAxLDMyLjc4WiIvPjwvZz48L3N2Zz4=)
    
}

.video02 {  
    width: 23vw;
    
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJDYW1hZGFfMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNDc0LjQxIDMxNS45NiI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiNmZjAwYTA7fTwvc3R5bGU+PC9kZWZzPjxnIGlkPSJwcmFuY2hldGEwMiI+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNNDY2LjMzLDIwOC43OWMyMy44OC04NC44NC05Ljg5LTgwLjQzLTQwLjU5LTE1MS44NkM0MDguODEsMTcuNTQsMzcxLjU2LDQuNSwzMjMuOTUsLjkyYy04My4yNi02LjI2LTExMy4wNSwyMS43Mi0yMDEuOTMsMTcuNTItNDIuNTItMi4wMS01OC4xNCw0NC4zNi04My40Miw2My43MUMuMjYsMTExLjUxLDI0LjA1LDEyOS4wMSwyLjM1LDE5Mi42OWMtMTMuMzcsMzkuMjYsMzIuNjIsMTA0LjE4LDc2Ljk4LDkxLjY4LDY5LjY0LTE5LjYzLDEwNi4xNiwzOS4wNSwxNDEuMzYsMzAuNzksMTAxLjQ3LTIzLjc5LDIwOS44NiwyMC43LDI0NS42NC0xMDYuMzdaIi8+PC9nPjwvc3ZnPg==)
    
}

.video03 {    
    width: 23vw;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJDYW1hZGFfMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTIzLjIgMzU0LjY0Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmMDBhMDt9PC9zdHlsZT48L2RlZnM+PGcgaWQ9InByYW5jaGV0YTAyIj48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0yNDIuNzgsMjkuMzNjLTE5LjYtMy44Ni00Mi4yNS0yOC40NC03Ni41My0xNS43OS0xMS4xOCw0LjEzLTIxLjU0LDkuNjktMzAuMzUsMTcuNzItMTAuNCw5LjQ2LTE4LjUsMjIuNDUtMzEuMzUsMjguMTYtMTEuMDYsNC45MS0yMy41Nyw2LjY0LTM1LjY3LDYuNjgtMTIuMSwuMDMtMjkuNjMsMi43Ni0zNS43MSwxMy4yMy04LjQ0LDE0LjUyLTcuNTMsMjUuNTUsMi4yLDM5LjI0QzUxLjY4LDE0MS40OS02LjA5LDE5OC4wNywuNTMsMjMxLjg4YzEuOTYsMTAuMDEsMy4yMywxNy41Niw2LjYxLDIzLjM3LDEwLjE1LDE3LjQzLDI1LjY5LDIwLjA0LDQzLjQ3LDI4LjEyLDIyLDEwLDQxLTEsOTgsNDMsMzMuMjcsMjUuNjgsNjguOTIsMjkuNDYsMTAxLDI4LDQ0LTIsODQuMDItMTEsMTE3LTExLDQ2LDAsNzEtOCw5MC0zMCwyMy4zNC0yNy4wMywyNC4xOC00OC41OCw0NC03NSwxMy40Mi0xNy45LDMzLjY4LTI2Ljc5LDE1LjEyLTcyLjQ2LTEwLjI5LTI1LjMyLTM2LjI4LTM2LjEyLTU1LjMyLTQzLjc2LTE4Ljg1LTcuNTYtMzMuMTctMTguMDQtMzcuMS0zMC42OXMtLjQxLTE4LjY2LDIuMDMtMzYuOTJjNC4wOC0zMC42Mi0uNDMtNDguMy00Ni4yNS01My45Ni0yNy43NC0zLjQzLTU0LjA0LDktODEuMTUsMTkuMDctMTcuOCw2LjYxLTM1LjksMTMuNDctNTUuMTYsOS42OFoiLz48L2c+PC9zdmc+)
    
}

.txt-motion {
    width: 21vw;
    position: absolute;
    left:7vw;
    margin-top: 20vw;
    
    top:0;
    left:0;
}

.cat-tit {
    font-family: 'Montserrat', sans-serif!important;
    font-weight:800;
}

.txt-web {
    width: 26.5vw;
    position: absolute;
    left:36vw;
    margin-top: 15vw;
    
    top:0;
    left:0;
}

.txt-branding {
    width: 18vw;
    position: absolute;
    left:71vw;
    margin-top: 18vw;
    
    top:0;
    left:0;
}


.enfeite-corda {
    width: 100%;
    height:50vw;
    position: absolute;
    background-image: url("../imgs/corda01.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 130vw;
    margin-top: -56vw;
    z-index: -10;
    
    
}

#quem-somos {
    width:100%;
    margin-top: 8vw;
    scroll-margin-top: 23vw;
}
.tit-quem-somos {
    position:absolute;
    display: flex;
    justify-content: center;
    left: 10vw;
    margin-top: -14vw;
}

.quem-somos-tit-txt {
    display: flex;
    width: 80vw;
    padding: 0 10vw;
    margin-top: 2vw;
    text-align: center;
}

.yellow-ameba-1 {
    position: absolute;
    left: -18vw;
    width: 18vw;
    margin-top: 4vw;
}

.yellow-ameba-2 {
    position: absolute;
    left: 28vw;
    width:18vw;
    margin-top: 22vw;
    z-index: 100;
}

.caracol {
    position: absolute;
    right: -10vw;
    width: 18vw;
    margin-top: -9vw;
}

.papagaio {
    position: absolute;
    left: -3vw;
    width:40vw;
    height:60vw;
    margin-top: -8vw;
    background-image: url("../imgs/qs-juan.png");
    background-position: top;
    background-size: 30vw;
    background-position-x: 2vw;
    background-position-y: 7vw;
    background-repeat: no-repeat;  
}

.ovinho-1 {
    position: absolute;
    z-index: 10;
    left: 26vw;
    margin-top: -4vw;
    width: 9vw;    
}

.right-quem-somos {
    position: absolute;
    left: 35vw;
    margin-top: 0vw;

}

.qs-juanzito-tit {
    font-size: 5vw;
    font-weight: 800;
    color: white;
}

.qs-juanzito-txt {
    font-size: 2.5vw;
    font-weight: 600;
    color: white;
    line-height: 3vw;
}

.jacare {
    position: absolute;
    width: 56vw;
    margin-top: 8vw;
    left: 27vw;
    transform:rotate(6deg);
}

#qs-guga {
    position:absolute;
    
    margin-top: 65vw;
    scroll-margin-top: 17vw;
    width:100vw;
}

.yellow-ameba-3 {
    position: absolute;
    left: 10vw;
    width:18vw;
    margin-top: -5vw;
    z-index: 100;
}

.qs-guga-tit {
    position:absolute;
    font-size: 5vw;
    font-weight: 800;
    color: white;
    left:5vw;
    margin-top: -3vw;
}

.qs-guga-txt {
    margin-top: 5vw;
    position:absolute;
    left:5vw;
    font-size: 2.5vw;
    font-weight: 600;
    color: white;
    line-height: 3vw;
}

.girafa {
    
    
    width:73vw;
    height:91vw;
    margin-top: -22vw;
    background-image: url("../imgs/qs-guga.png");
    background-position: top;
    background-size: 43vw;
    background-position-x: 2vw;
    background-position-y: 7vw;
    background-repeat: no-repeat;  
}

.jellyfish-1 {
    position: absolute;
    left: 6vw;
    width:30vw;
    margin-top: 19vw;    
}

.jellyfish-2 {
    position: absolute;
    left: -6vw;
    width:16vw;
    margin-top: 20vw;
    transform: rotate(-45deg);
    filter: blur(1px);
    z-index: -11; 
}

.jellyfish-3 {
    position: absolute;
    left: 23vw;
    width:13vw;
    margin-top: 9vw;
    transform: rotate(-30deg);
    filter: blur(2.5px);
    z-index: -10;   
}

.ondas {
    position: absolute;
    left: -10vw;
    width: 100vw;
    z-index: -20;
    
    opacity: .2;
}

#bt-tem-mais-aqui {
    position: absolute;
    right: 2vw;
    width: 13vw;
    z-index: -13;
    margin-top: 12vw;    
}

#fale-com-a-gente {
    width:100%;
    position: absolute;
    
    margin-top: 50vw;
    scroll-margin-top: -20;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
    
}

.f-c-a-g-txt {
    
    position: absolute;
    width:50%;
    margin-top: 30vw;
    z-index:4;
}
.krebinho-3d {
    position: absolute;
    width:40vw;    
    margin-top: 10vw;
    z-index:3;
}

.riscos {
    width:70vw;
    position: absolute;
    
    
    z-index: -3;
    left: 10vw;    
}

.form-box {
    position: absolute;
    margin-top: 70vw;
    width:100%;
    height:50vw;
    
    background-image: url("../imgs/formbox-img.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 80%;
    
}


.form-field-box {
    position:absolute;
    width: 100%;
    height:50%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    margin-top: 12vw;
    padding: 0 15vw;
    font-size: 1.5vw;
    font-weight: 600;

    
}

.form-field-box-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    line-height: 2.5;
    

}

.form-field-box-right {
    
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    

}

.form-button {
    width:100%;
    position: absolute;
    margin-top: 35vw;
    text-align: center;
}

#input-field {
    width:31vw;
    height:2.5vw;
    font-size: 1.3vw;
}

#message-field {
    width:25vw;
    height:11vw;
    font-size: 1.3vw;
}

.form-labels {
    line-height: 2;
}

.bt-form {
    width:35vw;
    height:4.3vw;
    background-image: url("../imgs/bt-form.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size:29vw;
    border: none;
    font-size: 1.3vw;
    font-weight: 600;
    margin-top:-1vw;
    background-color: #26a6e200;
}

.bt-form:hover {
    
    opacity: .4;
    }

/* #footer-home {
    width:100vw;
    position:relative;
    font-size: 2vw;
    color: rgb(255, 255, 255);
    
    display:flex;
    flex-direction: row;
    justify-content: center;
    font-weight: 600;
} */

#portfolio-top {
    width:100vw;
   
    
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0 3vw;
    margin-bottom:3vw;
}

.nossos-trampos {
    width:90%;
 
}

.search-btn {
    background-color: #26a6e200;
    border: none;
}

.search-btn:hover {
    opacity: .5;
}

.search-field {
    width:16vw;
    border-top: none;
    border-left: none;
    border-right: none;
    background-color: #26a6e200;
    border-color: white;
    
}

::placeholder {
    color: white;

}

#menu-categorias {
    color: white;
    font-size: .9vw;
    background-color: #26a6e200;
    border: none;
    width:16vw;
}

.option-item {
    color: rgb(0, 0, 0);
    font-size: .9vw;

}





.header-trampo {
    width:100vw;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
    
    
}

.header-trampo-marks {
    width:100vw;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
    
    
}







.post-categories {
    width:50vw!important;
    display: flex!important;
    flex-direction: row!important;
    
    text-decoration: none!important;
    
    
}

.post-categories a {
    
    padding-right: .5vw!important;
    
}

ul {
    list-style-type: none;
}

.tags-categorias-left {
    text-align: center;
    font-size: 2vw;
    color: rgb(255, 255, 255);
    font-weight: 700;
    line-height: 1.2;

}

.tags-categorias-right {
    text-align: center;
    font-size: 2vw;
    color: rgb(255, 255, 255);
    font-weight:700;
    line-height: 1.2;
    
   
    
    

}

.risco {
    margin-top:1vw;
    width:15vw;
}

.tit-trampo{
  font-size: 6vw;
  letter-spacing: -4px;
  color: rgb(255, 255, 255);
  font-weight: 700;
}


.footer-trampo {
    width:100%;
    display:flex;
    align-items: center;
    justify-content: center;
}

.modal {
    border: none!important;
}

.modal-content {
    height:100%;
}
.modal-container {
    height:100%;
}

.modal-dialog {
    height:100%;
}

#exampleModal .modal-body .modal-container {
    transition: max-height .2s ease-in-out, opacity .4s ease-in-out;
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    border: none!important;
    
    
    
    
}


#exampleModal .modal-body .modal-container.show{
    opacity: 1!important;
    visibility: visible;
    max-height: 100vh;
    border: none!important;
    
    
}




.modal-container {
    text-align: left;

}



.modal-text,.modal-text a {
    
    text-decoration: none!important;    
    font-weight: 800!important;
    font-size: 1.5em!important;

    
}



.modal-text a:hover {
    color:#26a6e2!important;
    
}

.modal-text a:link {
    color:#ff9500!important;
}

.video-player-youtube {
    width:100%;
    height:100%;
}

.btn {
    background-color: transparent!important;
    border:none!important;
    box-shadow: none!important;
    display: flex!important;
    align-items: center;
    justify-content: center;
    
    
}

.btn:hover {
    opacity: 0.5!important;
}


.carousel {
    width:100vw;
    height:30vw;
  }

  .carousel-item-content{
   display:flex;
   align-items: center;
   justify-content: center;
   
   
  }

  .carousel-item-content img{
    width:100%;
    
  }

  .carousel-indicators [data-bs-target] {
    width:2vw!important;
    height:2vw!important;
    border-radius: 50%;
    margin-right:2vw!important;
    margin-left:2vw!important;
    background-color:#000000!important;
    
    
  }

  .d-block {       

  }

  .carousel-control-next-icon {
    background-image: url("../imgs/bt-seta-dir.png")!important;
    width:6.3vw!important;
    height:6.3vw!important;
}

.carousel-control-prev-icon {
    background-image: url("../imgs/bt-seta-esq.png")!important;
    width:6.3vw!important;
    height:6.3vw!important;
}

.carousel-control-next-icon:after {
    content: none!important;
}

.carousel-control-prev-icon:after {
    content: none!important;
}

.carousel-item-content img {
    width: 50vw;
}



.modal-dialog {
    width:100vw!important;
    max-width: 100vw!important;
    margin-right:0!important;
    margin-left:0!important;
    margin:0 0!important;
    display:flex!important;
    flex-direction: column!important;
    justify-content: center!important;
    align-items: center!important;
    border: none!important;
}

 .modal-backdrop.gray{
    background-color: #2b3b4f!important;
    opacity:1!important;
    margin:0!important;
    border: none!important;
 }

 .modal-backdrop.red {
    background-color: red!important;
    opacity:1!important;
 }

 .modal-backdrop.dark-blue {
    background-color: #011a9e!important;
    opacity:1!important;
 }

 .modal-backdrop.yellow {
    background-color: #fff449!important;
    opacity:1!important;
 }

 .modal-backdrop.orange {
    background-color: #d96e24!important;
    opacity:1!important;
 }

 .modal-backdrop.green {
    background-color: #007976!important;
    opacity:1!important;
 }
 .modal-backdrop.royal-blue {
    background-color: #2575E8!important;
    opacity:1!important;
 }
 



 .modal-content {
    align-items: center;
    width:100vw!important;
    background-color: transparent!important;
    border: none!important;
    box-shadow: none!important;
 }

 .modal-content-purple {
    align-items: center;
    width:100vw!important;
    background-color: purple;
    border: none!important;
    box-shadow: none!important;
 }

 .modal-header {
    width:95vw!important;
    justify-content: flex-end!important;
    border: none!important;
 }

 .modal-header .btn-close {
    background-image: url("../imgs/bt-fechar.png")!important;
    background-size: cover;
    width:101px!important;
    height:101px!important;
    padding:0!important;
    margin:0!important;
    background-color: transparent!important;
    opacity:1!important;
    border:none!important;

 }





 

 .modal-footer {
    border: none!important;
 }



@media (min-width: 1024px) {

    body {
        background-size:400%;
        background-position-y: 20vw;
        background-position-x: center;
    }
    

   

    

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

    #nav {
        
        display: flex;
        align-items: center;
        justify-content: flex-end;
        font-size: 1.5vw!important;
           
    }
    
    #links-menu {
        display: flex;
        white-space: nowrap;
        list-style: none;
        gap: 1rem;
        
        
    }
    
    #social-menu {
        box-sizing: border-box;
        display: flex;    
        gap: 1rem;
        align-items: center;
    }

    #qs-guga {
        position:absolute;
        
        margin-top: 65vw;
        scroll-margin-top: 17vw;
        width:100vw;
    }
    
    .yellow-ameba-3 {
        position: absolute;
        left: 10vw;
        width:18vw;
        margin-top: -5vw;
        z-index: 100;
    }
    
    .qs-guga-tit {
        position:absolute;
        font-size: 5vw;
        font-weight: 800;
        color: white;
        left:5vw;
        margin-top: -3vw;
    }
    
    .qs-guga-txt {
        margin-top: 5vw;
        position:absolute;
        left:5vw;
        font-size: 2.5vw;
        font-weight: 600;
        color: white;
        line-height: 3vw;
    }
    
    .girafa {
        
        
        width:100vw;
        height:91vw;
        margin-top: -22vw;
        background-image: url("../imgs/qs-guga.png");
        background-position: top;
        background-size: 43vw;
        background-position-x: 58vw;
        background-position-y: 7vw;
        background-repeat: no-repeat;  
    }
    
    .jellyfish-1 {
        position: absolute;
        left: 6vw;
        width:30vw;
        margin-top: 19vw;    
    }
    
    .jellyfish-2 {
        position: absolute;
        left: -6vw;
        width:16vw;
        margin-top: 20vw;
        transform: rotate(-45deg);
        filter: blur(1px);
        z-index: -11; 
    }
    
    .jellyfish-3 {
        position: absolute;
        left: 23vw;
        width:13vw;
        margin-top: 9vw;
        transform: rotate(-30deg);
        filter: blur(2.5px);
        z-index: -10;   
    }
    
    .ondas {
        position: absolute;
        left: -10vw;
        width: 100vw;
        z-index: -20;
        
        opacity: .2;
    }
    

    #portfolio-top {
        width:100vw;
        
        margin-top: 13vw;
        display:flex;
        flex-direction: row;
        justify-content: space-between;
        padding: 0 3vw;
        margin-bottom:3vw;
    }

    .portfolio-tit {
        width:70%;
    }
    
    .nossos-trampos {
        width:100%;
     
    }

    .box-filtro-trampos {
        width:30%;
        text-align: right;
    }
    
    .search-btn {
        background-color: #26a6e200;
        border: none;
    }
    
    .search-btn:hover {
        opacity: .5;
    }
    
    .search-field {
        width:19vw;
        border-top: none;
        border-left: none;
        border-right: none;
        background-color: #26a6e200;
        border-color: white;
        
    }
    
    ::placeholder {
        color: white;
    
    }
    
    #menu-categorias {
        color: white;
        font-size: 1.2vw;
        background-color: #26a6e200;
        border: none;
        width:22vw;
    }
    
    .option-item {
        color: rgb(0, 0, 0);
        font-size: .9vw;
    
    }

    #trampo-template-marks {
        
        width: 100%;
        height:40vw;
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        background-color: #ee3d44;
        background-image: url("../imgs/logo-oclab-bg-red.svg");
        background-size: 600vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-estadao {
        
        width: 100%;
        height:43vw;
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        background-color: #2575E8;
        background-image: url("../imgs/logo-oclab-bg-royalblue.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-se-mudando {
        
        width: 100%;
        height:43vw;
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        background-color: #011a9e;
        background-image: url("../imgs/logo-oclab-bg-blue.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-tansu {
        
        width: 100%;
        height:43vw;
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        background-color: #2b3b4f;
        background-image: url("../imgs/logo-oclab-bg-tansublue.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-grupo-salta {
        
        width: 100%;
        height:43vw;
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        background-color: #007976;
        background-image: url("../imgs/logo-oclab-bg-greenteal.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-sgscopills {
        
        width: 100%;
        height:47vw;
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        background-color: #fff449;
        background-image: url("../imgs/logo-oclab-bg-yellow.svg");
        background-size: 250vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -80vw;
        
    }

    #trampo-template-wespline {
        
        width: 100%;
        height:47vw;
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        background-color: #d96e24;
        background-image: url("../imgs/logo-oclab-bg-orange.svg");
        background-size: 250vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -80vw;
        
    }
    
    .header-trampo {
        position:relative;
        width:95vw;
        display: flex;
        flex-direction: row;
        height:auto;
        padding:0;
        margin:0;
        
        justify-content: space-between;
       
        
        
    }
    .header-trampo-marks {
        position:relative;
        width:95vw;
        display: flex;
        flex-direction: row;
        height:auto;
        padding:0;
        margin:0;
        
        justify-content: space-between;
       
        
        
    }
   
    
    
    
    .risco {
        margin-top:1vw;
        width:15vw;
    }
    
    .tit-trampo{
      font-size: 5vw;
      letter-spacing: -4px;
      color: rgb(255, 255, 255);
      
    }

    .container-trampo {
        
        position:relative;
        display:flex;
        flex-direction: column;
    }

    .container-trampo-video {
        
        display: flex;
        justify-content: space-between;
        
    }

    .container-trampo-video img {
        
        width:40vw;
        
        
    }

   .container-video-1 {
    text-align: center;
    width:50vw;
    height:20vw;
    
   }

   .container-video-2 {
    text-align: center;
    width:50vw;
    height:20vw;
    
   }     

   .container-trampo-images {
    display:flex;
   }

   .yellow-mais {
    margin-top:1vw;
   }
   
    .bt-mais {
        background-image: url("../imgs/bt-mais.png");
        background-size: cover;
        background-position: center;
        width:6vw;
        height:6vw;
    }

    .modal-body {
        width:70vw!important;
        min-height:100vw!important;
        color: white!important;
        
        
        border: none!important;
        
     }
    
     .modal-body a {
        color:rgb(173, 173, 173)!important;
        
     }


   
}




@media (max-width: 1023px) {
body {
    background-repeat: no-repeat;
    background-position-y: 50vw;
    background-size: 300vw;
    padding:0;
    margin:0;
}
    #logo img{
        position:absolute;
        z-index:5;
        width:40vw;
        margin-top:-11vw;
        
        
        
        
    }

    #main-home {
        
        margin: 10vw auto;
        
         
    }

   

    #header {
        max-width:100vw;
        height:29vw;
        
        
    }

   #nav {
        justify-content: end;
    }

    #nav.active #menu {
        visibility: visible;
        height: calc(100vh - -82px);
        overflow-y: hidden;
        z-index: 0;        
    }

    #menu {
        display: block;
        position: absolute;
        width: 100%;
        
        top: 0;
        right: 0px;
        height: 0px;
        transition: .6s;
        background:  #26a6e2;
        visibility: hidden;
        overflow-y: hidden;
        z-index: 0;        
    }

    #links-menu {
        display: flex;
        flex-direction: column;
        margin-top: 46vw;
        z-index: 8;  

    }

    #social-menu {
        margin-top:10vw;
        width:100%;
        display:flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-around;
    }

    #btn-mobile {
        display: flex;
        padding: .5rem 1rem;
        font-size: 1rem;
        border: none;
        background: none;
        cursor: pointer;
        margin-top:-5vw;
    }

    #hamburguer {
        border-top: 4px solid;
        width: 45px;
        display: block;
        color: white;
        z-index:10;
        
    }

    #hamburguer::after, #hamburguer::before {
        content: '';
        display: block;
        width: 45px;
        height: 4px;
        background: red;
        margin-top: 10px;
        background: currentColor;
        transition: .3s;
        position: relative;
    }

    #nav.active #hamburguer {
        border-top-color: transparent;
    }

    #nav.active #hamburguer::after {
        transform: rotate(135deg);
        top: -14px;
    }

    #nav.active #hamburguer::before {
        transform: rotate(-135deg);
    }

    .home-video-tapume {
        
        width: 100%;
        
       margin-top:15vw;
        
    }

    #categorias-home {
        
        
    }

    #qs-guga {

    }

    .girafa {
        width:100vw;
        background-position-x: 55vw;
    }

    .yellow-ameba-3 {
        margin-top:-9vw;
    }

    #fale-com-a-gente {
        
        margin-top: 50vw;
        
        
    }


    #portfolio-top {
        width:100vw;
        position:relative;
        margin-top: 29.5vw;
        display:flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        
        z-index: 10;
    }

    .portfolio-tit{
        width:98vw;
        text-align: center;
    }

    .box-filtro-trampos {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        width:100vw;
        margin-top: 5vw;
    }
    
    .nossos-trampos {
        width:97vw;
     
    }
    
    .search-btn {
        background-color: #26a6e200;
        border: none;
    }
    
    .search-btn:hover {
        opacity: .5;
    }
    
    .search-field {
        width:38vw;
        border-top: none;
        border-left: none;
        border-right: none;
        background-color: #26a6e200;
        border-color: white;
        
    }
    
    ::placeholder {
        color: white;
    
    }

    .categoria-container {
        display:flex;
        align-items: flex-end;

    }
    
    #menu-categorias {
        color: white;
        font-size: 2vw;
        background-color: #26a6e200;
        border: none;
        width:33vw;
    }
    
    .option-item {
        color: rgb(0, 0, 0);
        font-size: 2vw;
    
    }

    #trampo-template-marks {
        padding:0;
        height:100%;
        margin-top:6vw!important;
        background-color: #ee3d44;
        background-image: url(../imgs/logo-oclab-bg-red.svg);
        background-size: 600vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        margin-bottom:none;
        

    }

    .bt-mais{
        width:20vw!important;
    }

    .bt-mais-sgspills{
        margin-top:30vw;
    }

    #trampo-template-estadao {
        
        margin-top:-2vw!important;
        background-color: #2575E8;
        background-image: url("../imgs/logo-oclab-bg-royalblue.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    

    #trampo-template-se-mudando {
        
        margin-top:-2vw!important;
        background-color: #011a9e;
        background-image: url("../imgs/logo-oclab-bg-blue.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-grupo-salta {
        
        margin-top:-2vw!important;
        background-color: #007976;
        background-image: url("../imgs/logo-oclab-bg-greenteal.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-tansu {
        
        margin-top:-2vw!important;
        background-color: #2b3b4f;
        background-image: url("../imgs/logo-oclab-bg-tansublue.svg");
        background-size: 200vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-sgscopills {
        margin-top:-2vw!important;
        background-color: #fff449;
        background-image: url("../imgs/logo-oclab-bg-yellow.svg");
        background-size: 250vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -80vw;
        
    }

    #trampo-template-wespline {
        margin-top:-2vw!important;
        background-color: #d96e24;
        background-image: url("../imgs/logo-oclab-bg-orange.svg");
        background-size: 250vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -80vw;
        
    }
    .container-trampo {
        margin:0;
        padding:0;
        height:100%;
    }

    .container-trampo-video img{
        width:95vw;

    }
    
    .header-trampo {
        width:98vw;
        display: flex;
        flex-direction: column-reverse;
        align-items: baseline;
        justify-content: space-between;
       
        margin-top:2vw;
    }

   
    .header-trampo-marks {
        flex-flow: column;
    }
    
    .tags-categorias-left {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width:100vw;
        
    }

    .tags-categorias-right {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        flex-flow: column-reverse;
        width:100vw;

    }

   

    .header-trampo-sgscopills{
        flex-flow: column-reverse;
    }
    
    .risco {
        margin-top:1vw;
        width:50vw;
    }
    
    .tit-trampo{
        text-align: center;
      width:98vw;
      font-size: 10vw;
      letter-spacing: -4px;
      color: rgb(255, 255, 255);
      
      
    }
    
    
    
    
    .footer-trampo {
        width:100%;
        display:flex;
        align-items: center;
        justify-content: center;
        
    }
    
    .btn-mais {
        background-color: #26a6e200;
        border:none;
      margin-top:-48vw;
      padding:0;
    }

    .carousel-control-prev, .carousel-control-next {
       top:20vw!important;
    }

    .carousel-indicators {
        bottom:-32vw!important;
    }

    .carousel-item-content img {
        width: 90vw;
        margin-top:5vw;
    }
    .modal-text {
        
        text-align:left;
    }
    
    
    #footer-home {
        margin-top: 163vw;

    }
    .modal-body {
        width:80vw!important;
        min-height:100vw!important;
        color: white!important;
         
        
        
        border: none!important;
        
     }
    
     .modal-body a {
        color:rgb(173, 173, 173)!important;
        
     }
}

@media (max-width: 768px) {
    #main-home {
        margin-top: 28vw;
    }

}

@media (max-width: 500px) {
   
    body {
        background-size:cover;
        background-position-y: center;
        background-position-x: center;
    }
   

    #logo img{
        width: 40vw;
        margin-top:-9vw;
    }

    #header {
        max-width:100vw;
        position:absolute;
        
        
        
    }

    #main-home {
        margin-top: 30vw;
    }

    .embed-container {
        margin-top:35vw;
    }

    .home-video-tapume {
        width:100vw;
        margin-top:15vw;
    }

    #categorias-home {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        padding: 10vw 7vw 0vw 7vw;
        max-width:100%;
        height:auto;
        
        scroll-margin-top: 9vw;
        
    }
    
    .dd-tit {
        left:3vw;
        width:90vw;        
    }
    
    .btn-categoria-motion {
        width: 80vw;
        left:0vw;
    }

    .btn-categoria-web {
        width: 80vw;
        margin-top: 18vw;
    }

    .btn-categoria-branding {
        width: 80vw;
        margin-top: 8vw;
    }

   
    
    #spot-bts1 {
        position: absolute;
        width: 80vw;
        
        margin-top:10vw;
        
    }
    
    #spot-bts2 {
        position: absolute;
        width: 80vw;
        
        margin-top:.6vw;
    }
    
    #spot-bts3 {
        position: absolute;
        width: 80vw;
       
        margin-top:.6vw;
    }
    
    .video01 {    
        width: 80vw;
        margin-top:10vw;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJDYW1hZGFfMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNDQyLjYgMzMzLjEiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojZmYwMGEwO308L3N0eWxlPjwvZGVmcz48ZyBpZD0icHJhbmNoZXRhMDIiPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTU1LjMxLDEzMC40MWMtOC44NCwxNi45NS03Ljg1LDE0LjExLTIwLjU4LDQ3LjI3LTQuMTUsMTAuODEtNS4zNCwyNC45OS02LjEsMzYuNTktLjg5LDEzLjY5LDMuNSwyNi41OS0uNzYsMzkuNjQtMy42NywxMS4yMy05LjY3LDE5Ljk5LTE2LjUsMjguODMtNi44Myw4Ljg1LTEzLjAzLDIwLjc4LTEwLjk1LDMxLjk3LDIuODgsMTUuNTMsMTguNzgsMTguNjUsMzEuNzYsMTcuOTMsMjAuMDktMS4xMiw0MS4wNi00LjMzLDYxLjI2LTQuNzgsNzcuOTMtMS43MiwxNDUuNzIsMjAuNDMsMjE4LjA0LTE1LjI1LDE3LjM3LTguNTcsMzQuOTMtMjEuMDksNDQuOS00MS4yNCwxNi41Ni0zMy40NiwxLjU1LTcxLjYzLDIzLjcxLTk5LjgsNy40MS05LjQyLDI5Ljg1LTI5LjE5LDM4Ljg4LTM1LjgzLDUuOTEtNC4zNSwyMy42My0xOS44NCwyMy42My0zOC4xMiwwLTE0LjQ5LTMwLjk1LTI0LjMtMzcuMzYtMjkuNzMtMTUuOTQtMTMuNTItMzQuODMtNDQuMTktNTEuODQtNTUuNjVDMzQyLjAyLDQuNTgsMzIyLjU3LC4zMSwzMDkuMTgsLjA1Yy0zNi42Ni0uNzItNTcuOTQsNi44Ni04OS45NiwyMS4zNS0zMy44NCwxNS4zMS01Ni4yOCwzOC4zNi05MC4yOCw0OC42My03LjY5LDIuMzItOC43NSwzLjA0LTIyLjc4LDguNDQtMTQuMDMsNS40LTI2LjY5LDEwLjI2LTM0Ljg0LDE5LjE3LTguMTUsOC45MS03LjE3LDE1LjgzLTE2LjAxLDMyLjc4WiIvPjwvZz48L3N2Zz4=)
        
    }
    
    .video02 {  
        width: 80vw;
        
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJDYW1hZGFfMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNDc0LjQxIDMxNS45NiI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiNmZjAwYTA7fTwvc3R5bGU+PC9kZWZzPjxnIGlkPSJwcmFuY2hldGEwMiI+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNNDY2LjMzLDIwOC43OWMyMy44OC04NC44NC05Ljg5LTgwLjQzLTQwLjU5LTE1MS44NkM0MDguODEsMTcuNTQsMzcxLjU2LDQuNSwzMjMuOTUsLjkyYy04My4yNi02LjI2LTExMy4wNSwyMS43Mi0yMDEuOTMsMTcuNTItNDIuNTItMi4wMS01OC4xNCw0NC4zNi04My40Miw2My43MUMuMjYsMTExLjUxLDI0LjA1LDEyOS4wMSwyLjM1LDE5Mi42OWMtMTMuMzcsMzkuMjYsMzIuNjIsMTA0LjE4LDc2Ljk4LDkxLjY4LDY5LjY0LTE5LjYzLDEwNi4xNiwzOS4wNSwxNDEuMzYsMzAuNzksMTAxLjQ3LTIzLjc5LDIwOS44NiwyMC43LDI0NS42NC0xMDYuMzdaIi8+PC9nPjwvc3ZnPg==)
        
    }
    
    .video03 {    
        width: 80vw;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJDYW1hZGFfMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTIzLjIgMzU0LjY0Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmMDBhMDt9PC9zdHlsZT48L2RlZnM+PGcgaWQ9InByYW5jaGV0YTAyIj48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0yNDIuNzgsMjkuMzNjLTE5LjYtMy44Ni00Mi4yNS0yOC40NC03Ni41My0xNS43OS0xMS4xOCw0LjEzLTIxLjU0LDkuNjktMzAuMzUsMTcuNzItMTAuNCw5LjQ2LTE4LjUsMjIuNDUtMzEuMzUsMjguMTYtMTEuMDYsNC45MS0yMy41Nyw2LjY0LTM1LjY3LDYuNjgtMTIuMSwuMDMtMjkuNjMsMi43Ni0zNS43MSwxMy4yMy04LjQ0LDE0LjUyLTcuNTMsMjUuNTUsMi4yLDM5LjI0QzUxLjY4LDE0MS40OS02LjA5LDE5OC4wNywuNTMsMjMxLjg4YzEuOTYsMTAuMDEsMy4yMywxNy41Niw2LjYxLDIzLjM3LDEwLjE1LDE3LjQzLDI1LjY5LDIwLjA0LDQzLjQ3LDI4LjEyLDIyLDEwLDQxLTEsOTgsNDMsMzMuMjcsMjUuNjgsNjguOTIsMjkuNDYsMTAxLDI4LDQ0LTIsODQuMDItMTEsMTE3LTExLDQ2LDAsNzEtOCw5MC0zMCwyMy4zNC0yNy4wMywyNC4xOC00OC41OCw0NC03NSwxMy40Mi0xNy45LDMzLjY4LTI2Ljc5LDE1LjEyLTcyLjQ2LTEwLjI5LTI1LjMyLTM2LjI4LTM2LjEyLTU1LjMyLTQzLjc2LTE4Ljg1LTcuNTYtMzMuMTctMTguMDQtMzcuMS0zMC42OXMtLjQxLTE4LjY2LDIuMDMtMzYuOTJjNC4wOC0zMC42Mi0uNDMtNDguMy00Ni4yNS01My45Ni0yNy43NC0zLjQzLTU0LjA0LDktODEuMTUsMTkuMDctMTcuOCw2LjYxLTM1LjksMTMuNDctNTUuMTYsOS42OFoiLz48L2c+PC9zdmc+)
        
    }

   
    
    .txt-motion {
        width: 73vw;
        position: absolute;
        left:0vw;
        margin-top: 80vw;
        
    }
    
    .txt-web {
        width: 85vw;
        position: absolute;
        left:-2vw;
        margin-top: 52vw;
        
    }
    
    .txt-branding {
        width: 67vw;
        position: absolute;
        left:4vw;
        margin-top: 60vw;
        
    }
    
    
    .enfeite-corda {
        display:none;
        
        
    }
    
    #quem-somos {
        width:100vw;
        margin-top: 277vw;
        scroll-margin-top: 23vw;
        overflow-x: hidden;
    }
    .tit-quem-somos {
        width:80%;
        
        
        
        margin-top: -14vw;
    }
    
    .quem-somos-tit-txt {
        position:absolute;
        display: flex;
        width: 100vw;
        
        margin-top: 0vw;
        text-align: center;
    }
    
    .yellow-ameba-1 {
        position: absolute;
        left: -18vw;
        width: 18vw;
        margin-top: 4vw;
    }
    
    .yellow-ameba-2 {
        position: absolute;
        left: 51vw;
        width:40vw;
        margin-top: 1vw;
        z-index: 100;
    }
    
    .caracol {
        display:none;
    }
    
    .papagaio {
        position: absolute;
        left: -3vw;
        width:62vw;
        margin-top: 6vw;        
        height:100vw;
        background-image: url("../imgs/qs-juan.png");
        background-position: top;
        background-size: cover;
        background-position-x: -11vw;
        background-position-y: 7vw;
        background-repeat: no-repeat;
    }
    
    .ovinho-1 {
        position: absolute;
        z-index: 10;
        left: 0vw;
        margin-top: 2vw;
        width: 19vw;    
    }
    .left-quem-somos {

    }
    .right-quem-somos {
        position: absolute;
        left: 49vw;
        margin-top: 9vw;
        width:45vw;
    
    }
    
    .qs-juanzito-tit {
        font-size: 10vw;
        font-weight: 800;
        color: white;
        left:2vw;
    }
    
    .qs-juanzito-txt {
        font-size: 4vw;
        font-weight: 600;
        color: white;
        line-height: 6vw;
    }
    
    .jacare {
        display:none;
    }
    
    #qs-guga {
        
        position:relative;
        margin-top: 150vw;
        scroll-margin-top: 17vw;
        width:50vw;
        
        
    }
    
    .yellow-ameba-3 {
        position: absolute;
        left: 54vw;
        width:33vw;
        margin-top: -2vw;
        z-index: 100;
    }
    
    .qs-guga-tit {
        margin-top: 36vw;
        font-size: 10vw;
        font-weight: 800;
        color: white;
    }
    
    .qs-guga-txt {
        margin-top: 51vw;
        font-size: 4vw;
        font-weight: 600;
        color: white;
        line-height: 6vw;
        
    }
    
   .girafa {
        
        width:100vw;
        height:116vw;
        margin-top: -82vw;
        overflow-x: hidden;
        background-image: url("../imgs/qs-guga.png");
        background-position: top;
        background-size: 82vw;
        background-position-x: 49vw!important;
        background-position-y: 26vw;
        background-repeat: no-repeat;
        
        
    } 
    
    .jellyfish-1 {
        display:none; 
    }
    
    .jellyfish-2 {
        display:none; 
    }
    
    .jellyfish-3 {
        display:none;   
    }
    
    .ondas {
        display:none; 
    }
    
    #bt-tem-mais-aqui {
        display:none;  
    }
    
    #fale-com-a-gente {
        width:100%;
        position: absolute;
        
        margin-top: 330vw;
        scroll-margin-top: -20;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        
        
    }
    
    .f-c-a-g-txt {
        
        position: absolute;
        width:94%;
        margin-top: 130vw;
        z-index:4;
        left:1vw;
    }
    .krebinho-3d {
        position: absolute;
        width:92vw;    
        margin-top: 71vw;
        left:2vw;
    }
    
    .riscos {
        width:85vw;
        position: absolute;
        margin-top:20vw;
        z-index: -3;
        left: 6vw;    
    }
    
    .form-box {
        position: absolute;
        margin-top: 377vw;
        width:95%;
        height:226vw;
        
        background-image: url("../imgs/formbox-mobile-img.svg");
        background-repeat: no-repeat;
        background-position: center;
        background-position-y: top;
        background-size: 98%;
        left:1.3vw;
        
    }
    
    
    .form-field-box {
        position:absolute;
        width: 95%;
        height:50%;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        margin-top: 12vw;        
        font-size: 1.5vw;
        font-weight: 600;
        margin-left:-1.6vw;
    
        
    }
    
    .form-field-box-left {
        position: absolute;
        width:100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: left;
        line-height: 2.5;
        left: 5vw;
        margin-top: -37vw;
        
        
    
    }
    
    .form-field-box-right {
        position: absolute;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        left: 5vw;
        margin-top: 114vw;
        
    
    }
    
    .form-button {
        width:96vw;
        height:20vw;
        position: absolute;
        margin-top: 35vw;
        text-align: center;
    }
    
    #input-field {
        width:88vw;
        height:10vw;
        font-size: 5vw;
        z-index:5;
    }
    
    #message-field {
        width:88vw;
        height:80vw;
        font-size: 5vw;
    }
    
    .form-labels {
        line-height: 2;
        font-size: 5vw;
        width:95%;
        text-align: left;
    }
    
    .bt-form {
        width:80vw;
        height:10vw;
        background-image: url("../imgs/bt-form.svg");
        background-repeat: no-repeat;
        background-position: center;
        background-size:70vw;
        border: none;
        font-size: 3vw;
        font-weight: 600;
        margin-top:140vw;
        background-color: #26a6e200;
    }
    
    .bt-form:hover {
        
        opacity: .4;
        }

    #footer-home {
    margin-top: 442vw;
    font-size: 4.5vw;
    
    }

    #portfolio-top {
        width:100%;
        position:relative;
        margin-top: 48vw;
        display:flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        
        z-index: 10;
    }

    .portfolio-tit{
        
        text-align: center;
    }

    .box-filtro-trampos {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        width:100%;
        margin-top: 5vw;
    }
    
    .nossos-trampos {
        width:100%;
     
    }
    
    .search-btn {
        background-color: #26a6e200;
        border: none;
    }
    
    .search-btn:hover {
        opacity: .5;
    }
    
    .search-field {
        width:73vw;
        border-top: none;
        border-left: none;
        border-right: none;
        background-color: #26a6e200;
        border-color: white;
        
    }
    
    ::placeholder {
        color: white;
    
    }

    .categoria-container {
        display:flex;
        align-items: flex-end;

    }
    
    #menu-categorias {
        color: white;
        font-size: 4vw;
        background-color: #26a6e200;
        border: none;
        width:80vw;
    }
    
    .option-item {
        color: rgb(0, 0, 0);
        font-size: 4vw;
    
    }

    
    
    

    #trampo-template-marks {
        padding:0;
        height:100%;
        margin-top:6vw!important;
        background-color: #ee3d44;
        background-image: url(../imgs/logo-oclab-bg-red.svg);
        background-size: 600vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        margin-bottom:none;
        

    }

    .bt-mais{
        width:20vw!important;
    }

    .bt-mais-sgspills{
        margin-top:30vw;
    }

    #trampo-template-estadao {
        
        margin-top:-2vw!important;
        background-color: #2575E8;
        background-image: url("../imgs/logo-oclab-bg-royalblue.svg");
        background-size: 400vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-se-mudando {
        
        margin-top:-2vw!important;
        background-color: #011a9e;
        background-image: url("../imgs/logo-oclab-bg-blue.svg");
        background-size: 400vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-tansu {
        
        margin-top:-2vw!important;
        background-color: #2b3b4f;
        background-image: url("../imgs/logo-oclab-bg-tansublue.svg");
        background-size: 400vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-grupo-salta {
        
        margin-top:-2vw!important;
        background-color: #007976;
        background-image: url("../imgs/logo-oclab-bg-greenteal.svg");
        background-size: 400vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -50vw;
        
    }

    #trampo-template-sgscopills {
        margin-top:-2vw!important;
        background-color: #fff449;
        background-image: url("../imgs/logo-oclab-bg-yellow.svg");
        background-size: 250vw;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x: -80vw;
        
    }

    #trampo-template-wespline {
        margin-top:-2vw!important;
        background-color: #d96e24;
        background-image: url("../imgs/logo-oclab-bg-orange.svg");
        background-size: 800vw!important;
        background-repeat: no-repeat;
        background-position: center;
        background-position-x:-30vw;
        
    }
    .container-trampo {
        margin:0;
        padding:0;
        height:100%;
    }

    .container-trampo-video img{
        width:95vw;

    }
    
    .header-trampo {
        width:98vw;
        display: flex;
        flex-direction: column-reverse;
        align-items: baseline;
        justify-content: space-between;
       
        margin-top:2vw;
    }

   

    .header-trampo-marks {
        flex-flow: column;
    }
    
    .tags-categorias {
        width:90vw;
        font-size: 4vw;
        color: rgb(255, 255, 255);
        
        line-height: 1.2;
    }

    .tags-categorias-left {
        text-align: center;
        font-size: 5vw;
        color: rgb(255, 255, 255);
        
        line-height: 1.2;

    }

    .tags-categorias-right {
        text-align: center;
        font-size: 5vw;
        color: rgb(255, 255, 255);
        
        line-height: 1.2;
        display:flex;
        flex-direction: column;
        flex-flow: column-reverse;
        width:100vw;
        
        align-items: center;
        justify-content: center;

    }

    .header-trampo-sgscopills{
        flex-flow: column-reverse;
    }
    
    .risco {
        margin-top:1vw;
        width:50vw;
    }
    
    .tit-trampo{
        text-align: center;
      width:98vw;
      font-size: 10vw;
      letter-spacing: -4px;
      color: rgb(255, 255, 255);
      
      
    }
    
    
    
    
    .footer-trampo {
        width:100%;
        display:flex;
        align-items: center;
        justify-content: center;
        
    }
    
    .btn-mais {
        background-color: #26a6e200;
        border:none;
      margin-top:-48vw;
      padding:0;
    }

    .carousel-control-prev, .carousel-control-next {
       top:20vw!important;
    }

    .carousel-item-content img {
        width: 80vw;
        margin-top:5vw;
    }

    .carousel-indicators {
        bottom:-32vw!important;
    }
    .modal-text {
        
        text-align:left;
    }

    .modal-body {
        width:95vw!important;
        
        color: white!important;
        text-decoration: none!important;    
        font-weight: 800!important;
        
        border: none!important;
        
     }
    
     .modal-body a {
        color:rgb(173, 173, 173)!important;
        
     }
   

   

}