@font-face {
    font-family: 'Font Awesome';
    src: url('fonts/fontawesome.eot');
    src: url('fonts/fontawesome_162a16fe.eot#iefix') format('embedded-opentype'), url('fonts/fontawesome.svg') format('svg'), url('fonts/fontawesome.woff') format('woff')
}

/* SEGOE UI BOLD */ 
@font-face {
    font-family:'Segoe UI';
    src: url('fonts/Segoe UI Bold.eot');
    src: url('fonts/Segoe UI Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/Segoe UI Bold.woff') format('woff'),
        url('fonts/Segoe UI Bold.ttf') format('truetype'),
        url('fonts/Segoe UI Bold.otf') format('opentype'),
        url('fonts/Segoe UI Bold.svg#Segoe UI Bold') format('svg');
        font-weight: 700;
        font-style: normal;
        font-stretch: normal;
        unicode-range: U+0020-02DC;
}

/* SEGOE UI REGULAR */
@font-face {
    font-family:'Segoe UI';
    src: url('fonts/Segoe UI.eot');
    src: url('fonts/Segoe UI.eot?#iefix') format('embedded-opentype'),
      url('fonts/Segoe UI.woff2') format('woff2'),
      url('fonts/Segoe UI.woff') format('woff'),
      url('fonts/Segoe UI.ttf') format('truetype'),
      url('fonts/Segoe UI.otf') format('opentype'),
      url('fonts/Segoe UI.svg#Segoe UI') format('svg');
      font-weight: 400;
      font-style: normal;
      font-stretch: normal;
      unicode-range: U+0020-02DC;
}

/* SEGOE UI LIGHT */
@font-face {
    font-family:'Segoe UI Light';
    src: url('fonts/Segoe UI Light.eot');
    src: url('fonts/Segoe UI Light.eot?#iefix') format('embedded-opentype'),
      url('fonts/Segoe UI Light.woff2') format('woff2'),
      url('fonts/Segoe UI Light.woff') format('woff'),
      url('fonts/Segoe UI Light.ttf') format('truetype'),
      url('fonts/Segoe UI Light.otf') format('opentype'),
      url('fonts/Segoe UI Light.svg#Segoe UI Light') format('svg');
      font-weight: 300;
      font-style: normal;
      font-stretch: normal;
      unicode-range: U+0020-02DC;
}

:root{
  --main-bg-color: #0096ff;
}
.contenters{
  display: none;
}
#container-overflow{
  margin:0;
  padding:0;
  overflow-x: hidden;
}

/* width */
::-webkit-scrollbar {
    width: 5px;

}
/* Track */
::-webkit-scrollbar-track {
    background: #b2dfff;
}
/* Handle */
::-webkit-scrollbar-thumb {
    background: #0096ff;
    cursor: pointer;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #66c0ff;
}
body{
  scrollbar-face-color: #0096ff;
  scrollbar-3dlight-color: coral;
  scrollbar-highlight-color: orange;
  scrollbar-track-color: #b2dfff;
  scrollbar-arrow-color: #333;
  scrollbar-shadow-color: green;
  scrollbar-dark-shadow-color: yellow;
  scrollbar-base-color: red;
  overflow-x: hidden;
  margin:0;
  padding:0;
  background-color: #fcfcfc;
  font-family: 'Segoe UI';
  font-weight: 400;
  overflow-y: auto;
}
.container{
  width:70vw;
  /* background-color:pink; */
  margin:0 auto;
}

.titles{
  margin-bottom: 1vw;
  margin-top:1vw;
  font-size: 3vw;
  text-transform: uppercase;
  color:#707070;
}
.borders{
  width:6vw;
  height:1vw;
  border-bottom: 2px solid #707070;
}
.buttons{
  border:2px solid #fcfcfc;
  background-color: rgba(255,255,255,0);
  color:white;
  padding:1vw 3vw;
  text-transform: uppercase;
  font-weight: 700;
  font-family: 'Segoe UI Bold', sans-serif;
  transition:.2s;
  -o-transition:.2s;
  -moz-transition:.2s;
  -ms-transition:.2s;
  -webkit-transition:.2s;
}
button{
  outline: none;
}
.title-texts-left{
  font-size: 1.3vw;
  font-weight: 300;
  color: #707070;
  width: 100%;
  -webkit-column-count:2;
  -moz-column-count: 2;
  column-count: 2;
}

.hide{
  display: block;
}
.hiddenclass{display:none;}
.clearfix{clear: both;}

/******* LOADER ********/
.loader {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 101
}
.loader img{
  position: absolute;
  top: 50%;
  margin-top: -75px;
  margin-left: -75px;
  /* -webkit-transform: translate(-50%, -50%); */
  left: 50%;
}
/* .loader figure {
    text-align: center;
    position: absolute;
    top: 50%;
    margin-top: -5vw;
    margin-left: 0vw;
    width: 100%
} */
body.ready .loader {
    opacity: 0;
    z-index: -1;
    -webkit-transition: all .8s linear;
    -moz-transition: all .8s linear;
    -ms-transition: all .8s linear;
    -o-transition: all .8s linear;
    transition: all .8s linear
}
body.ready .loader figure {
    display: none
}

/******** PT2020 ********/
#pt{
  position: fixed;
  z-index: 100;
  background-color:#333333;
  width:100%;
  height:4vw;
  bottom:0px;
}
#containerpt{
  /* background-color: red; */
  width:70.2vw;
  height:100%;
  margin:0 auto 0 auto;
}
#social{
  /*background-color: violet;*/
  height:100%;
  /* width:20vw; */
  float:left;
}
#social img{
  /*background-color: black;*/
  height:2vw;
  margin-top:1vw;
  margin-left:7%;
}
#social img:last-child{
  margin-right:0;
}
#social img:first-child{
  margin-left:0;
}
#social img:hover{
  opacity: 0.5;
  cursor: pointer;
}
#logospt{
  height:100%;
  /* width:40vw; */
  float:right;
  margin-top: 0vw;
}

#logospt img{
  height: 1.6vw;
  float: right;
  margin-left: 1vw;
}
#co-financed-div{
  /* width: 100%; */
  float: left;
  height: 1.5vw;
  margin-top: 1.35vw;
  margin-right: 2vw;
}
#co-financed-div p{
  margin: 0vw;
  font-size: 1vw;
  text-decoration: none;
  color: #fcfcfc;
}
.co-financed{
  text-decoration: none;
}
.co-financed-logos{
  /* width: 100%; */
  height: 4.4vw;
  float: right;
  margin-top: 1.2vw;
}


/******** RECRUITING BADGE ********/
#badge p{
    
    background-color: black;
    position: fixed;
    font-size: 1.2vw;
    top: 50vh;
    margin-top: -5vw;
    padding: 4vw 1vw 1vw 1vw;
    cursor: pointer;
    font-weight: bold;
    left: -5.5vw;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    transition: 0.5s;
}

#badge p:hover{
    left: -4.5vw;
}

#badge a{
    color: white;
    text-decoration: none;
}


/******** COOKIES BAR ********/
#cookies{
  background-color: rgba(0,0,0, 0.9);
  width:100%;
  height:5vw;
  position: fixed;
  bottom:4vw;
  z-index: 100;
  display: none;
}
#cookiescontainer{
    width:67vw;
    height:100%;
    margin:0 auto;
}
#cookiescontainer p{
  width:85%;
  font-size: 0.8vw;
  float: left;
  color:#fcfcfc;
}
#cookiescontainer button{
    background-color: rgba(0,0,0,0);
    text-decoration: none;
    border: 1px solid #fcfcfc;
    color:#fcfcfc;
    padding: 0.5vw 2vw;
    font-weight: normal;
    float: right;
    margin-top:1.9%;
}
#cookiescontainer button:hover{
    background-color: #0096ff;
    cursor: pointer;
    border:1px solid #0096ff;
}

/******** MENU BAR ********/
#menuhamburger{display:none;}
#menubar{
  background-color:#0096ff;
  width:100%;
  height:5vw;
  position: fixed;
  top:-5vw;
  -o-transition: top .4s ease-in-out;
  -moz-transition: top .4s ease-in-out;
  -ms-transition: top .4s ease-in-out;
  -webkit-transition: top .4s ease-in-out;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  opacity: 0;
}
.menubar-fixed{
  background-color:#0096ff;
  width:100%;
  height:5vw;
  position: fixed;
  top:0vw;
  -o-transition: top .4s ease-in-out;
  -moz-transition: top .4s ease-in-out;
  -ms-transition: top .4s ease-in-out;
  -webkit-transition: top .4s ease-in-out;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
#menucontainer{
  width:70vw;
  height:70%;
  margin:0 auto;
  padding-top:0.9%;
}
#menubar img{
  height:90%;
  cursor: pointer;
}
.menubar-fixed img{
  height:90%;
  cursor: pointer;
}
#nav{
  /*background-color:green;*/
  height:100%;
  float:right;
}
#nav *{
  display:inline-block;
}
#menubar #menucontainer #nav ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  /*background-color: black;*/
}
#menubar #menucontainer #nav ul li:last-child a{
  border: 1px solid #fcfcfc;
  margin-left: 3.5vw;
  margin-right: -0.5vw;
  margin-top: 0.2vw;
  text-transform: uppercase;
  font-size: 0.8vw;
  font-weight: 700;
}
#menubar #menucontainer #nav ul li:last-child a:hover{
  background-color: #fcfcfc;
  color:#0096ff;

}
#menubar #menucontainer #nav ul li{
  float:left;
  margin-right: 1vw;
}
#menubar #menucontainer #nav li a{
  display: block;
  color: white;
  text-align: center;
  padding: 0.6vw 1.5vw;
  text-decoration: none;
  font-size: 1.5vw;
  font-weight: 300;
  opacity:0.5;
}


#menubar #menucontainer #nav li a:hover{
  opacity:1;
}
#nav img{
  height:1.5vw;
}
#menubar #menucontainer #nav  li:last-child{
  color:#fcfcfc;
  border: 1px solid #fcfcfc;
  margin-left: 3.5vw;
  margin-right: -0vw;
  margin-top: 0.1vw;
  text-transform: uppercase;
  font-weight: 700;
  display: block;
  text-align: center;
  padding: 0.65vw 1.5vw;
  text-decoration: none;
  font-size: 1vw;
  cursor: pointer;
  transition:.2s;
  -o-transition:.2s;
  -moz-transition:.2s;
  -ms-transition:.2s;
  -webkit-transition:.2s;
}
#menubar #menucontainer #nav li:last-child:hover{
  background-color: #fcfcfc;
  color:#0096ff;

}
/************************************/
.menubar-fixed #menucontainer #nav ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.menubar-fixed #menucontainer #nav ul li:last-child a{
  border: 1px solid #fcfcfc;
  margin-left: 3.5vw;
  margin-right: -0.5vw;
  margin-top: 0.2vw;
  text-transform: uppercase;
  font-size: 0.8vw;
  font-weight: 700;
}
.menubar-fixed #menucontainer #nav ul li:last-child a:hover{
  background-color: #fcfcfc;
  color:#0096ff;

}
.menubar-fixed #menucontainer #nav ul li{
  float:left;
  margin-right: 1vw;
}
.menubar-fixed #menucontainer #nav li a{
  display: block;
  color: white;
  text-align: center;
  padding: 0.6vw 1.5vw;
  text-decoration: none;
  font-size: 1.5vw;
  font-weight: 300;
  opacity:0.5;
}
.menubar-fixed #menucontainer #nav li a:hover{
  opacity:1;
}
.menubar-fixed #menucontainer #nav li:last-child{
  color:#fcfcfc;
  border: 1px solid #fcfcfc;
  margin-left: 3.5vw;
  margin-right: -0vw;
  margin-top: 0.1vw;
  text-transform: uppercase;
  font-weight: 700;
  display: block;
  text-align: center;
  padding: 0.65vw 1.5vw;
  text-decoration: none;
  font-size: 1vw;
  cursor: pointer;
  transition:.2s;
  -o-transition:.2s;
  -moz-transition:.2s;
  -ms-transition:.2s;
  -webkit-transition:.2s;
}
.menubar-fixed #menucontainer #nav li:last-child:hover{
  background-color: #fcfcfc;
  color:#0096ff;
}
/************************************/
.mobilelist{
  position: fixed;
  background-color: rgba(0,0,0,0.98);
  width:35vw;
  bottom: 7vw;
  top:10vw;
  right:-35vw;
  display: none;
  -o-transition: right .4s;
  -ms-transition: right .4s;
  -moz-transition: right .4s;
  -webkit-transition: right .4s;
  transition: right .4s;
}

.mobilelist ul{position: relative;text-align: center;top:50%;margin-top: -22vw; padding:0;}
.mobilelist ul a{text-decoration:none;}
.mobilelist ul li{
  color: white;
  width:100%;
  padding:1.5vw 0 1.5vw 0;
  font-size: 3.5vw;
  text-transform: uppercase;
  font-weight: 300;
  -o-transition: 0.2s;
  -ms-transition: 0.2s;
  -moz-transition: 0.2s;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  opacity: 0.5;
  list-style-type: none;
}
.mobilelist ul button{
  background-color: #0096ff;
  border:0px;
  margin-top: 4vw;
  -o-transition: 0.2s;
  -ms-transition: 0.2s;
  -moz-transition: 0.2s;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.mobilelist ul button:hover{
  background-color: #fcfcfc;
  color:#0096ff;
  cursor: pointer;
}
.mobilelist ul li:hover{
  cursor: pointer;
  background-color: rgba(255,255,255,0.1);

}

/******** START ********/
.easter-egg-intro{
  background-color: palegreen;
  width:4vw;
  height:4vw;
  position: absolute;
  right:11vw;
  top:17vw;
  z-index: 200;
  opacity: 0;
}
.easteregg{
  background-image: url(../img/surfacebook_sg99.png);
}
.screen-container-3{
  background-image: url(../img/surfacebook_sg3.png);
}
.screen-container{
  opacity: 0;
  background-size: contain;
  background-repeat: no-repeat;
  height:36vw;
  width:50.5vw;
  float:right;
  position:relative;
  left:auto;top: auto;bottom: auto;
  right:-10vw;
  animation-name: slidetablet;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  z-index: 50;
}
#start{
  background-image: url(../img/home_background.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #fcfcfc;
  height: 106vh;
  width:100%;
  display: block;
  position: static;
}
#containerstart{
  /*background-color:yellow;*/
  width:70vw;
  position:absolute;
  top:50vh;
  margin-top:-17vw;
  z-index:50;
}
.screenstart{
  opacity: 0;
  height:34vw;
  float:right;
  position:relative;
  right:-10vw;
  animation-name: slidetablet;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  z-index:50;
}
#box{
  /*background-color: rgba(255,255,255, 0.5);*/
  opacity: 0;
  width: 24vw;
  height:35.2vw;
  float: left;
  position: relative;
  margin-left: -6vw;
  animation-delay: 0s;
  z-index: 50;
}
.boxinfo{
  /*background-color: red;*/
}

@keyframes slidetablet {0%{opacity: 0;right: -10vw;}100% {opacity: 1;right: 0vw;}}

#box,
#box h1,
#box button{
  animation-name: slide;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-out;
}



@keyframes slide {0%{opacity: 0;right: 10vw;}100% {opacity: 1;right: 0vw;}}
@keyframes slide-scrollDown {0%{opacity: 0;bottom: -3vh;}100% {opacity: 0.8;bottom: 6vh;}}


.logosquare{
  position: absolute;
  right:5vw;
  height:18vw;
  cursor:pointer;
  transition-timing-function: ease-in-out;
  /* transition: 1.5s; */
  animation-delay: 0s;
}

.scrollDown{
  z-index:100;
  animation-name: slide-scrollDown;
  transition-timing-function: ease-in-out;
  opacity: 0;
  animation-fill-mode: forwards;
  animation-duration: 2s;
  animation-delay: 1s;
  position: absolute;
  margin: auto;
  top: 83vh;
  left: 50%;
  margin-left: -2vw;
  width: 4vw;
  cursor: pointer;
}

#box h1{
  margin-top:18.5vw;
  color:white;
  text-align:right;
  font-size: 2.3vw;
  position: relative;
  right:10vw;
  animation-delay: 0.5s;
  opacity: 0;
}
#box button{
  text-decoration: none;
  border: 1.5px solid #FCFCFC;
  color: #FCFCFC;
  opacity: 0;
  font-size: 1vw;
  padding:0.9vw 0vw;
  padding-top:1.1vw;
  float: right;
  width:18vw;
  background-color: rgba(255,255,255,0);
  text-transform: uppercase;
  font-weight:700;
  position:absolute;
  bottom:0;
  right:0;
  animation-delay: 1s;
  transition: .2s;
  -webkit-transition: .2s;
  -moz-transition: .2s;
  -o-transition: .2s;
}
#box button:hover{
  background-color: rgba(255,255,255,1);
  color:#0096ff;
  cursor: pointer;
}

.boxstartwhy {
  width: 100%;
  color: #fcfcfc;
  font-family: 'Segoe UI';
  font-size: 1.3vw;
  margin-top: 1vw;
  margin-bottom: 2vw;
  font-weight: 300;
  -webkit-column-count: 2;
  -moz-column-count: 2;
  column-count: 2;
}

.subtitle{
  color: #fcfcfc;
  font-family: 'Segoe UI';
  font-weight: 700;
  font-size: 1.3vw;
}

/******** WHY ********/
#why{
  /* background-color: coral; */
  padding-top: 1px;
  height: 80vw;
  position: relative;
  margin-top: -6vw;
  z-index: 1;
}

.bgcoraltriangle{
  border-bottom: 5vw solid #0096ff;
  border-left: 106.5vw solid transparent;
  height: 0;
  width: 0;
  position: absolute;
  top: 0;
  left: -4vw;
  z-index: -1;
}
.bgcoral{
  width:100%;
  height:70%;
  background-color: #0096ff;
  position: absolute;
  top:4.6vw;
  left:0;
  z-index: -2;
  /* clip-path: polygon(0 6vw, 100% 0, 100% 100%, 0% 100%); */
}
.bggray1triangle{
  width: 0;
  height: 0;
  border-bottom: 6vw solid #f5f5f5;
  border-right: 136vw solid transparent;
  position: absolute;
  top: 50.3vw;
  left: 0;
  z-index: -1;
}
.bggray1{
  width:100%;
  height:18.1vw;
  background-color: #f5f5f5;
  position: absolute;
  bottom:6vw;
  left:0;
  z-index: -2;
}
.bggray2{
  width: 0;
  height: 0;
  border-top: 6vw solid #f5f5f5;
  border-right: 100vw solid transparent;
  position: absolute;
  bottom:0;
  left:0;
  z-index: -1;
}

#title{
  margin-top: 10vw;
}
#title h1{
  color:white;
}
#title div{
  border-bottom: 2px solid #fcfcfc;
}
#title button:hover{
  color: #0096ff;
  background-color: rgba(255,255,255,1);
  cursor: pointer;
}

#containerwhy{
  width:100%;
  margin-top: 4vw;
  /*background-color: blue;*/
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  -webkit-display: flex;
  -webkit-flex-direction: row;
  -webkit-flex-wrap: wrap;
  -webkit-justify-content: space-between;
}
.flexchild{
  background-color: pink;
  background-color: #fcfcfc;
  width: 23%;
  height:25vw;
  text-align: center;
  font-size: 30px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.flexchild img{
  width:30%;
  margin-top: 10%;
  margin-bottom: 10%;
}
.flexchild h1{
  font-size: 1vw;
  /*background-color: yellow;*/
  margin:0 auto;
  width:75%;
  color:#707070;
  text-transform: uppercase;
}
.flexchild p{
  font-size: 1vw;
  /*background-color: yellow;*/
  margin:0 auto;
  width:70%;
  color:#707070;
  text-align: left;
  font-weight: 300;
}
.borderwhy{
  height:1px;
  width:2vw;
  border-bottom: 2px solid var(--main-bg-color);
  margin: 6% auto;

}

#video{
  width:100%;
  cursor: pointer;
  margin-top: 5vw;
}
#player{
  margin-top: 5vw;
  width:100%;
  height:39vw;
  box-shadow: 0 0 15px #0000000d;
}

#map-mobile{
  display: none;
}


/******** WHOO ********/
#whoo{
  /* background-color: palegreen; */
  margin-top: 46vw;
}
#borderwho{
  width:6vw;
  height:1vw;
  border-bottom: 1px solid #707070;
}
#titlewho{
  margin-top:1vw;
  font-size: 3vw;
  text-transform: uppercase;
  color:#707070;
}

#sortby{
  /*background-color: blue;*/
  width:100%;
}
#sortby p{
  /*background-color: yellow;*/
  width:13%;
  float:left;
  text-transform: uppercase;
  font-weight: 700;
  color:#707070;
  font-size: 1.5vw;
  font-family: 'Segoe UI';
}

#clients{
  /*background-color: pink;*/
  flex-wrap: wrap;
  display: flex;
  flex-direction: row;
  align-content: space-between;
  width:100%;
  margin-top:5vw;
}
.square{
  /*background-color: #dbdbdb;*/
  width:20%;
  height: 0;
  padding-top: 20%;
}

.bci{
  background-image:url(../img/bci_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.bci:hover{
  background-image:url(../img/bci_cor.png);
  cursor: pointer;
}
.fidelidade{
  background-image:url(../img/fidelidade_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.fidelidade:hover{
  background-image:url(../img/fidelidade_cor.png);
  cursor: pointer;
}
.cgd{
  background-image:url(../img/cgd_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cgd:hover{
  background-image:url(../img/cgd_cor.png);
  cursor: pointer;
}
.bfa{
  
  background-image: url(../img/bfa_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.bfa:hover{
  background-image:url(../img/bfa_cor.png);
  cursor: pointer;
}
.bpi{
  
  background-image: url(../img/bpi_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.bpi:hover{
  background-image:url(../img/bpi_cor.png);
  cursor: pointer;
}
.montepio{
  background-image:url(../img/montepio_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.montepio:hover{
  background-image:url(../img/montepio_cor.png);
  cursor: pointer;
}
.bem{
  background-image:url(../img/bem_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.bem:hover{
  background-image:url(../img/bem_cor.png);
  cursor: pointer;
}
.cacc{
  background-image:url(../img/cacc_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cacc:hover{
  background-image:url(../img/cacc_cor.png);
  cursor: pointer;
}
.caconsult{
  background-image:url(../img/caconsult_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.caconsult:hover{
  background-image:url(../img/caconsult_cor.png);
  cursor: pointer;
}
.cagest{
  background-image:url(../img/cagest_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cagest:hover{
  background-image:url(../img/cagest_cor.png);
  cursor: pointer;
}
.cainform{
  background-image:url(../img/cainformatica_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cainform:hover{
  background-image:url(../img/cainformatica_cor.png);
  cursor: pointer;
}
.caseguros{
  background-image:url(../img/caseguros_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.caseguros:hover{
  background-image:url(../img/caseguros_cor.png);
  cursor: pointer;
}
.caservicos{
  background-image:url(../img/caservicos_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.caservicos:hover{
  background-image:url(../img/caservicos_cor.png);
  cursor: pointer;
}
.cavida{
  background-image:url(../img/cavida_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cavida:hover{
  background-image:url(../img/cavida_cor.png);
  cursor: pointer;
}
.caimoveis{
  background-image:url(../img/caimoveis_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.caimoveis:hover{
  background-image:url(../img/caimoveis_cor.png);
  cursor: pointer;
}
.casgps{
  background-image:url(../img/casgps_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.casgps:hover{
  background-image:url(../img/casgps_cor.png);
  cursor: pointer;
}
.cafacam{
  background-image:url(../img/cafacam_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cafacam:hover{
  background-image:url(../img/cafacam_cor.png);
  cursor: pointer;
}
.cccamgi{
  background-image:url(../img/cccamgi_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cccamgi:hover{
  background-image:url(../img/cccamgi_cor.png);
  cursor: pointer;
}
.caalcobaca{
  background-image:url(../img/caalcobaca_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.caalcobaca:hover{
  background-image:url(../img/caalcobaca_cor.png);
  cursor: pointer;
}
.catejosado{
  background-image:url(../img/cats_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.catejosado:hover{
  background-image:url(../img/cats_cor.png);
  cursor: pointer;
}
.caba{
  background-image:url(../img/caba_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.caba:hover{
  background-image:url(../img/caba_cor.png);
  cursor: pointer;
}
.casep{
  background-image:url(../img/casep_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.casep:hover{
  background-image:url(../img/casep_cor.png);
  cursor: pointer;
}
.tap{
  background-image:url(../img/tap_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.tap:hover{
  background-image:url(../img/tap_cor.png);
  cursor: pointer;
}
.galp{
  background-image:url(../img/galp_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.galp:hover{
  background-image:url(../img/galp_cor.png);
  cursor: pointer;
}
.nors{
  background-image:url(../img/nors_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.nors:hover{
  background-image:url(../img/nors_cor.png);
  cursor: pointer;
}
.aps{
  background-image:url(../img/aps_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.aps:hover{
  background-image:url(../img/aps_cor.png);
  cursor: pointer;
}
.tdp{
  background-image:url(../img/tdp_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.tdp:hover{
  background-image:url(../img/tdp_cor.png);
  cursor: pointer;
}
.aicep{
  background-image:url(../img/aicep_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.aicep:hover{
  background-image:url(../img/aicep_cor.png);
  cursor: pointer;
}
.adc{
  background-image:url(../img/adc_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.adc:hover{
  background-image:url(../img/adc_cor.png);
  cursor: pointer;
}
.cmvm{
  background-image:url(../img/cmvm_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmvm:hover{
  background-image:url(../img/cmvm_cor.png);
  cursor: pointer;
}
.erse{
  background-image:url(../img/erse_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.erse:hover{
  background-image:url(../img/erse_cor.png);
  cursor: pointer;
}
.hff{
  background-image:url(../img/hff_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.hff:hover{
  background-image:url(../img/hff_cor.png);
  cursor: pointer;
}
.pe{
  background-image:url(../img/parqueescolar_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.pe:hover{
  background-image:url(../img/parqueescolar_cor.png);
  cursor: pointer;
}
.spms{
  background-image:url(../img/spms_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.spms:hover{
  background-image:url(../img/spms_cor.png);
  cursor: pointer;
}
.cmlisboa{
  background-image:url(../img/cmlisboa_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmlisboa:hover{
  background-image:url(../img/cmlisboa_cor.png);
  cursor: pointer;
}
.cmporto{
  background-image:url(../img/cmporto_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmporto:hover{
  background-image:url(../img/cmporto_cor.png);
  cursor: pointer;
}
.cmcascais{
  background-image:url(../img/cmcascais_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmcascais:hover{
  background-image:url(../img/cmcascais_cor.png);
  cursor: pointer;
}
.cmalmada{
  background-image:url(../img/cmalmada_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmalmada:hover{
  background-image:url(../img/cmalmada_cor.png);
  cursor: pointer;
}
.cmguimaraes{
  background-image:url(../img/cmguimaraes_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmguimaraes:hover{
  background-image:url(../img/cmguimaraes_cor.png);
  cursor: pointer;
}
.cmsantarem{
  background-image:url(../img/cmsantarem_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmsantarem:hover{
  background-image:url(../img/cmsantarem_cor.png);
  cursor: pointer;
}
.cmloule{
  background-image:url(../img/cmloule_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.cmloule:hover{
  background-image:url(../img/cmloule_cor.png);
  cursor: pointer;
}
.amloule{
  background-image:url(../img/amloule_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.amloule:hover{
  background-image:url(../img/amloule_cor.png);
  cursor: pointer;
}
.iscap{
  background-image:url(../img/iscap_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.iscap:hover{
  background-image:url(../img/iscap_cor.png);
  cursor: pointer;
}
.uminho{
  background-image:url(../img/uminho_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.uminho:hover{
  background-image:url(../img/uminho_cor.png);
  cursor: pointer;
}
.amporto{
  background-image:url(../img/amporto_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.amporto:hover{
  background-image:url(../img/amporto_cor.png);
  cursor: pointer;
}
.amcascais{
  background-image:url(../img/amcascais_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.amcascais:hover{
  background-image:url(../img/amcascais_cor.png);
  cursor: pointer;
}
.amguimaraes{
  background-image:url(../img/amguimaraes_black.png);
  background-size:75%;
  background-position: center;
  background-repeat: no-repeat;
}
.amguimaraes:hover{
  background-image:url(../img/amguimaraes_cor.png);
  cursor: pointer;
}


.info{
  width:60vw;
  height:35vw;
  background-color:#FCFCFC;
  position: fixed;
  z-index:100;
  margin-top:50vh;
  top:-17.5vw;
  margin-left:50%;
  left:-30vw;
  box-shadow: 0 0 15px rgba(0,0,0,0.2);
  display: none;
  opacity: 0;
  -o-transition: .3s ease-in-out;
  -ms-transition: .3s ease-in-out;
  -moz-transition: .3s ease-in-out;
  -webkit-transition: .3s ease-in-out;
}
#containerinfo{
  /*background-color: pink;*/
  width:50vw;
  margin:1.5vw auto 0 auto;
}
#containerinfo img{
  height:10vw;
  float: left;
}
#containerinfo p{
  font-size:1vw;
  font-weight: 300;
  color:#707070;
}
#containerinfo h2{
  font-size:1.5vw;
  font-weight: 700;
  color:#707070;
  margin: 0;
}
#borderinfo{
  width:3vw;
  height:20px;
  border-bottom: 1px solid #707070;
  margin-top:-0.5vw;
  margin-bottom:4vw;
}
#containerinfo button{
  background-color: #0096ff;
  color:#FCFCFC;
  text-decoration: none;
  border: 0 solid #fcfcfc;
  padding:1.3vw 2vw 1vw 2vw;
  font-size:1vw;
  text-transform: uppercase;
  font-weight: bolder;
}
#containerinfo button:hover{
  background-color: #fcfcfc;
  color:#0096ff;
  border: 1px solid #0096ff;
  cursor:pointer;
}

.buttoncross{
  background-color:#0096ff;
  float: right;
  height:3.5vw;
  width: 3.5vw;
  top: 0;
  right: 0;
  position: absolute;
}
.buttoncross img{
  height:1vw!important;
  margin-left: 1.25vw;
  margin-top: 1.2vw;
}
.buttoncross:hover{
  opacity:0.5;
  cursor: pointer;
}

/******** WHAT ARE WE UP TO? ********/
#blog{
  background-color: #fcfcfc;
  height:0/*50vw*/;
  margin-top: 10vw;
}

#titlewhat button{
  border:2px solid #0096ff;
  color:#707070;
}
#titlewhat button:hover{
  color:#fcfcfc;
  background-color: #0096ff;
  cursor:pointer;
}
#titlewhat p{
  font-size:1.3vw;
  font-weight:300;
  color:#707070;
  margin-bottom:2vw; 
}

#boxblog{
  width:100%;
  margin-top: 5vw;
  height: 50vw;
/*  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;*/
}


/******** FIND A PARTNER ********/
.bgpartnergray{
  width: 0;
  height: 0;
  border-bottom: 6vw solid #f5f5f5;
  border-right: 133vw solid transparent;
  position: absolute;
  top:-5vw;
  left:0;
  z-index: -1;
}
.bgpartnergray2{
  width: 100%;
  height: 106vw;
  background-color: #f5f5f5;
  position: absolute;
  top:5.8vw;
  left:0;
  z-index: -1;
  display: none;
}
#partner{
  background-color: #f5f5f5;
  padding-bottom: 5vw;
  position: relative;
  top:9vw;
}
#titlefindpartner{
  padding-top:6vw;
  margin-top: 20vw;
}
#map{
  position: relative;
}
#map img{
  width:90vw;
  position: relative;
  margin-left:-12vw;
  margin-top: 10vw;
  /*background-color: red;*/
}
.pin{
  background-image:url(../img/pin.png);
  background-size: cover;
  width:3%;
  padding-top:3%;
  position: absolute;
  -ms-transition: .3s;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  transition: .3s;
}
.pin p{
  position: absolute;
  background-color: #fcfcfc;
  color:#c8c8c8;
  border: 2px solid #dfdfdf;
  padding:0.5vw 2vw;
  text-transform: uppercase;
  font-weight: 700;
  font-family: inherit;
  font-size: 1vw;
  top:-1.5vw;
  left: 3vw;
  z-index: 1000;
  -webskit- transition: .3s;
  text-align: center;
}
.pin-hidden{
  display: none;
  -webskit- transition: .3s;
}
.pin a{
  text-decoration: none;
  color:#c8c8c8;
}


.portugal{
  top:21.5vw;
  left:26.6vw;
}
.california{
  top:22vw;
  left:-3vw;
}
.connecticut{
  top:19.1vw;
  left:11.4vw;
}
.malasya{
  top:33vw;
  left:58vw;
}
.nigeria{
  top:31vw;
  left:30.5vw;
}
.uganda{
  top:33vw;
  left:38vw;
}
.tanzania{
  top:35.5vw;
  left:38vw;
}
.brazil{
  top:41vw;
  left:16.5vw;
}
.capeverde{
  top:28.5vw;
  left:22.5vw;
}
.spain{
  top:21.3vw;
  left:27.7vw;
}
.southafrica{
  top:44.5vw;
  left:34.5vw;
}
.kenya{
  top:34.3vw;
  left:39.2vw;
}
.pennsylvania{
  top:21vw;
  left:7.7vw;
}
.ny{
  top:20.3vw;
  left:9vw;
}
.florida{
  top:25vw;
  left:6vw;
}
.nc{
  top:22.5vw;
  left:7vw;
}
.angola{
  top:37.5vw;
  left:33.3vw;
}
.toronto{
  top:18.9vw;
  left:8vw;
}
.mozambique{
  top:40vw;
  left:38vw;
}
.ghana{
  top:31.8vw;
  left:27.9vw;
}
.ivorycoast{
  top:32vw;
  left:26.6vw;
}
.cameroon{
  top:32.6vw;
  left:31.9vw;
}
.pin:hover{
  cursor:pointer;
  margin-top: -5px;
}

#textfindpartners{
  /*background-color: #EADEDB;*/
  width:100%;
  margin-top:5vw;
}
#textfindpartners p{
  /*background-color: violet;*/
  width:47%;
  color:#707070;
  font-weight: 300;
  font-size: 1.3vw;
}
#textfindpartners p:first-child{
  float:left;
}
#textfindpartners p:last-child{
  float:right;
}
#buttonfindpartner{
  border: 2px solid #0096ff;
  color: #707070;
  background-color: rgba(255,255,255,0);
  margin-top:3vw;
  margin-bottom: 15vw;
}
#buttonfindpartner:hover{
  cursor:pointer;
  color: #fcfcfc;
  background-color: #0096ff;
}

#mappers {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width:100%;
  margin-top: 8vw;
}

.listchild{
  background-color: #fcfcfc;
  width: 100%;
  text-align: center;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  padding:2.5vw 0;
  margin:1.5vw 0;
  font-weight: 300;
  color:#0096ff;
  font-size: 3vw;
  transition: 0.4s;
}
.listchild:hover{
  background-color: #0096ff;
  color:#fcfcfc;
  cursor: pointer;
}
.listcontainer{
  width:100%;
  margin: 2vw 0;
  display:none;
  transition: 0.4s;
}
.listcontainer a{text-decoration: none;}
.listcontainer h1{
  font-size: 4vw;
  color:#0096ff;
  background-color: rgba(0,0,0,0.02);
  width:100%;
  text-align: center;
  font-weight: 300;
  padding:2vw 0;
  margin: 0;
}
.listcontainer h1:hover{
  cursor: pointer;
  background-color: rgba(0,0,0,0.05);
}

.pininfoo{
  width:30vw;
  height:40vw;
  background-color:#FCFCFC;
  position: fixed;
  z-index:100;
  margin-top:50vh;
  top:-20vw;
  margin-left:50%;
  left:-15vw;
  box-shadow: 0 0 15px rgba(0,0,0,0.2);
  display: none;
  opacity: 0;

  -webkit-transition: .3s ease-in-out;
}
.visuallyhidden{
  opacity: 1;
}
#containerpin{
  /*background-color: pink;*/
  width:60%;
  margin:0 auto;
  margin-top: 5vw;
  height:30vw;

}
#containerpin h1{
  color:#333333;
  text-transform: uppercase;
  font-size: 2vw;
}
.buttoncrosss{
  /*background-color:blue;*/
  float: right;
  height:3vw;
  margin-top: -4.3vw;
}
.buttoncrosss:hover{
  opacity:0.5;
  cursor: pointer;
}
.buttoncrosss div{
  width:2vw;
  height:0.2vw;
  background-color:#0096ff;
  cursor:pointer;
  margin-top: 1.4vw;
  margin-left: 1vw;
}
.buttoncrosss div:first-child{
  -webkit-transform: rotate(45deg);
}
.buttoncrosss div:last-child{
  -webkit-transform: rotate(-45deg);
  margin-top:-0.2vw;
}
.pinbox{
  text-align: center;
  /*background-color: lavender;*/
  width:100%;
  height:20vw;
  margin-top: 4vw;
  margin-right:3.5%;
  float: left;
  display: flex;
  flex-direction: column;
}
.pinbox:last-child{
  margin-right:0;
}
.pinbox p{
  font-size: 1.5vw;
  font-weight: 300;
  margin:0;
  color:#707070;
  padding:1vw 0;
}
.pinbox p:hover{
  color:#fcfcfc;
  cursor:pointer;
  background-color: #0096ff;
}

/******** DEMO ********/
#demo{
  background-color: none;
  margin-bottom: 2vw;
  height:75vh;
  overflow: hidden;
  min-height: 90vw;
  position: relative;
  margin-top: -14vw;
}
.demoindex{
  z-index: 100;
  margin-top: -2vw!important;
}

.bgdemotriangle{
  border-bottom: 6vw solid #0096ff;
  border-right: 147vw solid transparent;
  width:0;
  height:0;
  position: absolute;
  left: 0;
  top:0;
  z-index: -1;
  /* clip-path: polygon(0 0, 100% 10vw, 100% 100%, 0% 100%); */
}
.bglavender{
  background-color: #0096ff;
  width:100%;
  height:100%;
  position: absolute;
  left: 0;
  top:5.7vw;
  z-index:-1;
  /* clip-path: polygon(0 0, 100% 10vw, 100% 100%, 0% 100%); */
}
.bghighlightdemo{
  border-bottom: 46vw solid rgba(255,255,255,0.05);
  border-left: 80vw solid transparent;
  width:0;
  height:0;
  position: absolute;
  bottom:0;
  right: 0;
  z-index: -1;
  /* clip-path: polygon(100% 0, 0% 100%, 100% 100%); */
}
#container-demo{
  /* background-color: green; */
  height: 100%;
  margin-top: 8vw;
  position: relative;
}
#titledemo{
  /* background-color: pink; */
  width:100%;
  margin: 0 auto;
  text-align: center;
  padding-top: 10vw;
}
#titledemo h1{
  color:#fcfcfc;
  text-transform: uppercase;
  margin: 0;
}
#titledemo p{
  margin: 0;
  color:#fcfcfc;
  font-size: 1.5vw;
  font-weight: 300;
}
#formbox{
  width:60%;
  height:auto;
  margin: 4vw auto;
  transition: .4s;
  /* background-color: pink; */
}
#formbox input{
  height:5vw;
  width:100%;
  background: none;
  border: 0 solid #fcfcfc;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  box-sizing: border-box;
  /* padding:1vw 0 1vw 0; */
  font-size: 1.4vw;
  font-weight: 300;
  font-family: inherit;
  margin-bottom: 1vw;
  position: absolute;
  color:#fcfcfc;
}

.input{
  /* background-color: brown; */
  position: relative;
  height: 5vw;
  margin-bottom: 2vw;
}
.input p{
  position: absolute;
  top: 50%;
  margin-top: -1vw;
  color: #fcfcfc;
  font-size: 1.5vw;
  font-weight: 300;
  opacity: 0.5;
  transition: .3s;
}
.inputcountrycode{
  width:27%;
  display: inline-block;
  position: relative;
  height: 5vw;
}
.inputphonenumber{
  width:70%;
  float: right;
  display: inline-block;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{
    -webkit-appearance: none;
    margin: 0;
}
input[type='number'] {
    -moz-appearance:textfield;
}
input{outline: none;}
.input-p-transition{
  top: 0 !important;
  font-size: 1vw !important;
}
.formdemo{
    background-color: rgba(0,0,0,0);
    width: 100%;
    padding:1vw 0;
    margin: 1vw 0;
    display: inline-block;
    border: 0 solid #ccc;
    border-bottom: 1px solid rgba(255,255,255, 0.5);
    box-sizing: border-box;
    color:#0096ff;
    font-size: 1.3vw;
}

#divers{
  /* background-color: pink; */
}
#divers input{
  width:70%;
  float: right;
}

#gdpr{
  /* background-color: pink; */
  width:100%;
  margin: 4vw auto;
  height:auto;
  transition: .4s;
}
#gdpr a{
  color:#fcfcfc;

}
#gdpr p{
  font-size: 1.2vw;
  font-weight: 300;
  color:#fcfcfc;
  margin: 0;
  margin:1.5vw 0;
}
#gdpr p:last-child{
  font-size: 1vw;
  margin-top: 1px;
}


/* Customize the label (the container) */
.containere {
  display: block;
  position: relative;
  padding-left: 3vw;
  cursor: pointer;

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.containere p{
  color:#fcfcfc;
  font-size: 1.1vw;
}
/* Hide the browser's default checkbox */
.containere input {
  /*position: absolute;*/
  opacity: 0;
  cursor: pointer;
  display: none;
}
/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 1.5vw;
  width: 1.5vw;
  background-color: #0078cc;

}
/* On mouse-over, add a grey background color */
.containere:hover input ~ .checkmark {
  background-color: #0069b2;
}
/* When the checkbox is checked, add a blue background */
.containere input:checked ~ .checkmark {
  background-color: #0078cc;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
/* Show the checkmark when checked */
.containere input:checked ~ .checkmark:after {
  display: block;
}
/* Style the checkmark/indicator */
.containere .checkmark:after {
  left: 0.5vw;
  top: 0.15vw;
  width: 0.35vw;
  height: 0.8vw;
  border: solid white;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

#buttondemo{
  margin-left: 12.5vw!important;
  margin:0 auto;
  width:40%!important;
  background-color: #fcfcfc!important;
  color:#0096ff!important;
  padding: 1vw 0;
  font-weight: 700!important;
  position: static!important;
  outline: none;
}
#buttondemo:hover{
  background-color: #0096ff!important;
  color:#fcfcfc!important;
  border: 1px solid #fcfcfc;
  cursor:pointer;

}


/******** FOOTER ********/
footer{
  /*background-color: lavender;*/
  position: absolute;
  width:100%;
  bottom: 2vw;
}
#cavedigital{
  /*background-color: yellow;*/
  width:37vw;
  height:3.5vw;
  margin:0 auto;
}
.sgfooter{
  width: 10vw!important;
  margin-left: 4.5vw!important;
}
#cavedigital p{
  color:#fcfcfc;
  font-size: 1vw;
  float:left;
  margin-left:0.8vw;
}
#cavedigital img{
  width:8vw;
  margin-top: 0.3vw;
  margin-left: 1vw;
  float:left;
}
#cavedigital img:first-child{
  margin-top: 1vw;
}
#cavedigital img:last-child{
  margin-top: 0.2vw;
  float: right;
}
#terms{
  border-top: 0.5px solid rgba(255,255,255,0.5);
  width:100%;
  height:5.5vw;
  margin-top: 2vw;
  text-align: center;
  margin-bottom: 7.5vw;
}
#terms p{
  color:#fcfcfc;
  font-weight: 300;
  font-size: 1vw;
  margin-top: 2vw;
}
#terms a{
  color:#fcfcfc;
  text-decoration: none;
}
#terms a:hover{
  opacity: 0.5;
}
#terms a:first-child{
  margin-right:2vw;
}
#terms a:last-child{
  margin-left:2vw;
}

/******************************/
/********** PAGE WHY **********/
/******************************/
#start-why{background-color:none;padding-top: 15px;position: relative;}
#start-why img{width:100%;margin-top: 5vw;}
#start-why h1{color:#fcfcfc;font-size:3vw;}
.border-pagewhy{margin-top:10vw;border-bottom: 2px solid #fcfcfc;}
.bg-pagewhy-start{
  width:105vw;
  height:45.5vw;
  background-color: #0096ff;
  position: absolute;
  top:0;
  left:0;
  z-index: -2;
  display: none;
  /* clip-path: polygon(0 0, 100% 0, 100% 32vw, 0% 100%); */

}
.bg-pagewhy-starttriangle{
  width: 0;
  height: 0;
  border-top: 51vw solid #0096ff;
  border-right: 593vw solid transparent;
  position: absolute;
  top:0;
  left:0;
  z-index: -1;
  /* clip-path: polygon(0 0, 100% 0, 100% 32vw, 0% 100%); */

}
.bg-pagewhy-start-highlight{
  width: 0;
  height: 0;
  border-bottom: 38vw solid rgba(255,255,255,0.1);
  border-left: 189vw solid transparent;
  position: absolute;
  top:1vw;
  left:-68vw;
  z-index: -1;

  /* clip-path: polygon(0 25vw, 100% 0, 100% 20vw, 0 38vw); */

}

#sec2{
  /* background-color: lavender; */
  text-align: center;
}
.little-title{
  color:#0096ff;
  font-size: 1.7vw;
  text-align: center;
  font-weight: 700;
  /* background-color: coral; */
  width:60%;
  position: relative;
  left:50%;
  line-height: 2.2vw;
  margin-left: -30%;
  margin-top: 9vw;
  margin-bottom: 10vw;
}
#why-blocks{
  /* background-color: blue; */
  width:70%;
  display: flex;
  justify-content: space-between;
  position: relative;
  left:50%;
  margin-left: -35%;
}
.block{
  background-color: #fcfcfc;
  box-shadow: 0 0 0 rgba(0,0,0,0.2);
  width:24.5%;
  text-align: center;
  cursor: pointer;
  transition: .3s;
}
.block:hover{
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  margin-top:-10px;
  margin-bottom:10px;
  z-index: 30;
}
.block img{
  width:35%;
  margin-top: 15%;
}
.block p{
  font-size: 1vw;
  font-weight: 700;
  color:#707070;
  text-transform: uppercase;
  margin-bottom: 15%;
}
.border-block{
  height: 2px;
  background-color: none;
  border-bottom: 2px solid #0096ff;
  width:15%;
  position: relative;
  left:50%;
  margin-left: -7.5%;
  margin-top: 10%;
}

#sec3{
  padding-bottom: 0vw;
  background-color:none;
  position: relative;
}
#sec3 .titles{font-size: 3vw;margin-bottom: 5vw;}
#improve-screen{
  width:100%;
  margin-top: 5vw;
  margin-bottom: 5vw;
}
.border-improve{
  margin-top: 10vw;
}
.bg-pagewhy-improve{
  width:100%;
  height:44vw;
  background-color: #efefef;
  position: absolute;
  top:-5vw;
  left:0;
  z-index: -1;
}
.improve-textbox{
  /* background-color: pink; */

}
.textbox{
  /* background-color: pink; */
  width:50%;
  height:auto;
  display: inline-block;
  float: left;
}
.textbox-title{
  /* background-color: lavender; */
  margin-top: 0;
}
.textbox-title img{
  margin-right: 1vw;
  float: left;

}
.textbox-title h1{
  font-size: 1.5vw;
  font-weight: 700;
  color:#707070;
  width: 80%;
  /* background-color: pink; */
  margin-left: 3vw;
  width:80%;
  display: table-cell;
}
.textbox-title p{
  font-size: 1.3vw;
  font-weight: 300;
  color:#707070;
  margin-left:3vw;
  width:85%;
}

.checkmark-img{
  width:1.5vw;
  margin-top:0.3vw;
}
.modernize-textbox{
  padding-bottom: 12vw;
  /* background-color: lavender; */
  height:auto;
  padding-top: 14vw;
}
.textbox-textpart-modernize{
  /* background-color: blue; */
  width:38%;
  float: left;
}
.textbox-gifpart-modernize{
  /* background-color: pink; */
  width:60%;
  float:right;
}
#gif{
  width:100%;
  margin-top: 3.2vw;
}
.border-text{
  border-bottom:2px solid #0096ff!important;
}
.title-text{
  font-size: 2.5vw;
}

.bg-pagewhytriangle{
  width: 0;
  height: 0;
  border-bottom: 6vw solid #0096ff;
  border-left: 100vw solid transparent;
  position: absolute;
  bottom:186.5vw;
  left: 0vw;
  z-index: -1;
  /* clip-path: polygon(0 10vw, 100% 0, 100% 100%, 0% 100%); */
}
.bg-pagewhy{
  background-color: #0096ff;
  height:193.6vw;
  width:100%;
  position: absolute;
  bottom:-7vw;
  left: 0;
  z-index: -2;
  /* clip-path: polygon(0 10vw, 100% 0, 100% 100%, 0% 100%); */
}
.reduce-textbox{
  /* background-color: pink; */
  height: auto;
  padding-top: 5vw;
}
.textbox-gifpart-reduce{
  /* background-color: pink; */
  width:60%;
  float:left;
}
.textbox-textpart-reduce{
  /* background-color: blue; */
  width:35%;
  float:right;
}
.title-text-reduce{
  color:#fcfcfc!important;
}
.border-text-reduce{
  border-bottom:2px solid #fcfcfc!important;
}
.textbox-title-reduce{
  /* background-color: lavender; */
  margin-top: 0;
}
.textbox-title-reduce img{
  margin-right: 1vw;
  float: left;
}
.textbox-title-reduce h1{
  font-size: 1.5vw;
  font-weight: 700;
  color:#fcfcfc;
  width:80%;
  /* background-color: pink; */
  margin-left: 3vw;
}
.textbox-title-reduce p{
  font-size: 1.3vw;
  font-weight: 300;
  color:#fcfcfc;
  margin-left:3vw;
  width:85%;
}

.control-textbox{
  /* background-color:coral; */
  padding-top: 15vw;
  height:auto;
}
.textbox-textpart-control{
  /* background-color: blue; */
  width:37%;
  float: left;
}
.textbox-gifpart-control{
  /* background-color: yellow; */
  width:60%;
  float:right;
}
.title-text-control{
  color:#fcfcfc!important;
}
.border-text-control{
  border-bottom:2px solid #fcfcfc!important;
}
.textbox-title-control{
  margin-top: 0;
}
.textbox-textpart-control h1,.textbox-textpart-control p{
  color:#fcfcfc!important;
}

.demowhy{
  width:100%;
  top:-8vw;
  height:100vh;
  height:100vh;
  overflow: hidden;
  min-height: 90vw;
  padding-top: 6vw;
  top:0;
  position: static;
  margin-top: -1px!important;
}

.bg-pagewhy-highlight{
  width: 0;
  height: 0;
  border-bottom: 53vw solid rgba(255,255,255,0.1);
  border-right: 333vw solid transparent;
  position: absolute;
  bottom:-14vw;
  left: 0;
  z-index: -1;
  /* clip-path: polygon(0 0, 100% 10vw, 100% 30vw, 0 50vw); */
}

#videos-sg{
  height: 42vw;
  margin-top: -7vw;
  padding-top: 18vw;
  position: relative;
}
.sg-video {
    width: 15.7vw;
    height: 15.7vw;
    background-size: 32.5vw;
    background-position: center;
    float: left;
    margin-left: 8.3vw;
}
#video-dtf {
    background-image: url(../img/video-dtf.png);
    margin-left: 0!important;
}
#video-cis {
    background-image: url(../img/video-cis.png);
    background-position: center;
}
#video-pscr {
    background-image: url(../img/video-pscr.png);
    background-position: center;
}
.whyUseIt {
    padding: 1vw;
    background-color: #0096ff;
}
.sg-video-button {
    width: 100%;
    height: 100%;
    vertical-align: top;
    text-align: left;
    background: none;
    margin-left: -0.5vw;
    border: 0;
    cursor: pointer;
    padding: 1px 6px;
    font-family: 'Akzidenz Grotesk';
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.sg-video-button:hover{
  opacity: 0.5;
}
.sg-video h2 {
    margin-top: -7.9vw;
    margin-left: 0vw;
}
.whyUseIt h2 {
    font-family: 'Segoe UI';
    text-transform: uppercase;
    color: #ffffff;
    margin-bottom: 3%;
    font-size: 1.2vw;
    font-weight: 700;
}
.whyUseIt h2 span {
    display: block;
}
.container-videos{
    height: 100%;

}
.bg-videos-triangle{
    top: 0;
    z-index: -1;
    position: absolute;
    width: 0;
    height: 0;
    border-bottom: 14vw solid #fcfcfc;
    border-left: 116vw solid transparent;
    left: -16vw;
}
.bg-videos-triangle2{
    position: absolute;
    background-color: #f5f5f5;
    z-index: -1;
    width: 100%;
    height: 26vw;
    bottom: 7vw;
}
#vid{
    margin-top: 7vw;

}
.textbox-videopart-modernize{
    margin-top: 46vw;
    margin-bottom: 0vw;

}


/******************************/
/********* PAGE WHAT **********/
/******************************/

#sectionone-what{
  position: relative;
  background:none;
  height:auto;
  padding-top: 1px;
  margin-top: -5vw!important;
}
#bg-sectionone{
  position: absolute;
  top: 0;
  height:60.4vw;
  width:100%;
  background-color: #0096ff;
  z-index: -1;
  /* clip-path: polygon(0 0, 100% 0, 100% 100%, 0 55vw); */

}
.bg-sectiononetriangle{
  position: absolute;
  bottom: 0;
  height:0;
  width:0;
  border-top: 7vw solid #0096ff;
  border-right: 200vw solid transparent;
  z-index: -1;
  /* clip-path: polygon(0 0, 100% 0, 100% 100%, 0 55vw); */

}
.box-what{
  /* background-color: lavender; */
  width:43%;
  float: left;
}
.box-what .titles{
  color:#fcfcfc;
}
.box-what .borders{
  border-bottom: 2px solid #fcfcfc;
}
#buttonsec1:hover{
  cursor: pointer;
  color:#0096ff;
  background-color: #fcfcfc;
}
#sectionone-what img{
  width:50%;
  float: right;
}
.box-what p{
  width:100%;
  color:#fcfcfc;
  font-family: 'Segoe UI';
  font-size: 1.3vw;
  margin: 2vw 0;
  margin-top: 2vw;
  font-weight: 300;
}
.box-what p:last-child{
  margin-top:-3vw;
}
.container-what-start{
  margin-top: 20vw;
}

#sectiontwo-what{
  /* background-color: lavender; */
  height: auto;
  margin-top: 5vw;
}
.sectiontwo-title{
  width:100%;
  /* background-color: blue; */
}
#sectiontwo-what p{
  /* background-color: yellow; */
  width:100%;
  font-size: 1.3vw;
  color: #707070;
  float: left;
  /* background-color: yellow; */
  font-weight:300;
  /* background-color: yellow; */
  -webkit-column-count:2;
  /* background-color: yellow; */
  -moz-column-count:2;
  /* background-color: yellow; */
  column-count:2;
}


#slideshow-what{
  background-image: url(../img/background-cut.png);
  background-size:cover;
  background-repeat: no-repeat;
  height:38vw;
  width:100vw;
  margin-top: 10vw;
  /* clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 88%); */
}

#sectionthree-what{
  /* background-color: Beige; */
  height:82vw;
  margin-top: 10vw;
  position:relative;
}
.box-what-1{
  /* background-color: coral; */
  width:35vw;
  text-align: right;
  position: absolute;
  top:2vw;
  left: 50%;
  margin-left: -40vw;
}
.box-what-1 img{
  width:6vw;
}
.box-what-1 .borders{
  border-bottom: 2px solid #0096ff;
  position: static;
  margin-left: 29vw;
  width:6vw;
}
.box-what-1 p{
  font-size: 1.5vw;
  color:#707070;
  margin-top: 2vw!important;
}
.box-what-1 h1{
  text-transform: uppercase;
  font-size: 2.5vw;
  text-align: right;
  color:#707070;
  margin-top: 2vw!important;
}
.box-what-2{
  /* background-color: coral; */
  width:35vw;
  text-align: left;
  position: absolute;
  top:30vw;
  left: 50%;
  margin-left: 5vw;
}
.box-what-2 img{
  width:6vw;
}
.box-what-2 .borders{
  border-bottom: 2px solid #0096ff;
  position: static;
  width:6vw;
}
.box-what-2 p{
  font-size: 1.5vw;
  color:#707070;
  margin-top: 2vw!important;
}
.box-what-2 h1{
  text-transform: uppercase;
  font-size: 2.5vw;
  color:#707070;
  margin-top: 2vw!important;
}
.box-what-3{
  /* background-color: coral; */
  width:35vw;
  text-align: right;
  position: absolute;
  top:50vw;
  left: 50%;
  margin-left: -40vw;
}
.box-what-3 img{
  width:6vw;
}
.box-what-3 .borders{
  border-bottom: 2px solid #0096ff;
  position: static;
  margin-left: 29vw;
  width:6vw;
  margin-top: 1vw;
}
.box-what-3 p{
  font-size: 1.5vw;
  color:#707070;
  margin-top: 2vw!important;
}
.box-what-3 h1{
  text-transform: uppercase;
  font-size: 2.5vw;
  text-align: right;
  color:#707070;
  margin-top: 2vw!important;
}
.border-what{
  height:100%;
  width:2px;
  border-left: 1px solid rgba(0,0,0,0.1);
  position: absolute;
  left:50%;
}
.circle1{
  background-color: #fcfcfc;
  width:1.5vw;
  height:1.5vw;
  position: absolute;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 50%;
  left:50%;
  margin-left: -0.8vw;
  top:4vw;
}
.circle2{
  background-color: #fcfcfc;
  width:1.5vw;
  height:1.5vw;
  position: absolute;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 50%;
  left:50%;
  margin-left: -0.8vw;
  top:33vw;
}
.circle3{
  background-color: #fcfcfc;
  width:1.5vw;
  height:1.5vw;
  position: absolute;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 50%;
  left:50%;
  margin-left: -0.8vw;
  top:52vw;
}

#sectionfour-what{
  /* background-color: lavender; */
  margin-top: 10vw;
  text-align: center;
  margin-bottom: 10vw;
}
#sectionfour-what h2{
  color:#707070;
  font-weight: 300;
  font-size: 3vw;
}
#sectionfour-what .buttons{
  border: 2px solid #0096ff;
  color:#707070;
}
#buttonsec4:hover{
  background-color: #0096ff;
  color:#fcfcfc;
  cursor: pointer;
}

#sectionfive-what{
  /* background-color:palegreen; */
  text-align: center;
  margin-bottom: 6vw;
  position: relative;
  padding-bottom:12vw;
  padding-top: 6vw;
}
.borderfive{
  height:2px;
  width:5vw;
  border-bottom: 1px solid #d2d2d2;
  position: relative;
  left:50%;
  margin-left: -2.5vw;
}
#sectionfive-what h1{
  color:#d2d2d2;
  font-weight: 300;
  text-transform:uppercase;
  text-align: center;
}
#sectionfive-what img{
  height:3.5vw;
  margin:1vw 1.5vw;
  opacity: 0.35;
}
.logos-partners2{
  margin-top: 2vw;
  margin-bottom: 2vw;
}
#bg-sectionfive{
  background-color: #f5f5f5;
  width:100%;
  height:65vw;
  position: absolute;
  z-index: -2;
  /* clip-path: polygon(0 5vw, 100% 0, 100% 25vw, 0 100%); */
}
#bg-sectionfivetriangle{
  border-bottom: 6vw solid #f5f5f5;
  border-left: 100vw solid transparent;
  top: 0;
  width:0;
  height:0;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0.5vw;
  /* clip-path: polygon(0 5vw, 100% 0, 100% 25vw, 0 100%); */
}


/******************************/
/******** PAGE CONTACT ********/
/******************************/
#contact-section{
  background-image: url(../img/home_background.jpg);
  background-size: cover;
  width:100%;
  height: auto;
  padding-top: 1px;
  padding-bottom: 6vw;
  position: relative;
  z-index: -2vw;
}
.bg-contact-triangle{
  width: 0;
  height: 0;
  border-bottom: 21vw solid #0096ff;
  border-right: 167vw solid transparent;
  z-index: 2vw;
  position: absolute;
  bottom:0;
}
.bg-contact-img{
  /* background-color: #0096ff; */
  width:100%;
  height:30vw;
  position: absolute;
  bottom: 0;
  /* clip-path: polygon(0 8vw, 100% 0, 100% 100%, 0% 100%); */
}
.form-contact{
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  width:40vw;
  height: auto;
  background-color: #fcfcfc;
  position: relative;
  left:50%;
  margin-left: -20vw;
  margin-top:10vw;
  text-align: center;
  padding-top: 3vw;
  padding-bottom: 3vw;
  font-family: 'Segoe UI';
  z-index: 3;
}
.form-contact .titles{
  margin: 0!important;
}
.message{
  color:707070;
  font-size: 1.5vw;
  margin:0;
  font-weight: 300;
}
.info-contact{
  font-size: 1.5vw;
  /* background-color: lavender; */
  margin-top: 5vw;
}
.info-contact p{
  color: #707070;
  margin:0;
  font-weight: 300;
}
.info-contact p:first-child{
  font-weight: 700;
}

.input-contact{
  background:none;
  border: 0 solid white;
  border-bottom: 1px solid #dbdbdb;
  font-size: 1.5vw;
  padding:1.5vw 0;
  width:100%;
  margin-bottom: 2vw;
  opacity:0.6;
  font-family: 'Segoe UI';
  font-weight: 300;
}
#form-contact{
  /* background-color: pink; */
  width:80%;
  margin: 5vw auto 0 auto;
}
#subject{
  resize: none;
  overflow-y: scroll;
  overflow: auto;
}

#button-contact{
  background-color: #0096ff;
  text-decoration: none;
  border: 2px solid #0096ff;
  color:#fcfcfc;
  font-size: 2vw;
  font-weight: 700;
  padding: 1.5vw 3vw;
  font-family: 'Segoe UI';
  margin-top: 3vw;
  text-transform: uppercase;
}
#button-contact:hover{
  background-color: #fcfcfc;
  border: 2px solid #0096ff;
  color:#0096ff;
  cursor: pointer;
}

/* COVID-19 */

.cvd-start {
    width: 100vw;
}
.cvd-start img {
    width: 100vw;
    margin-top: 3vw;
}
.rita-testimonial {
    background-color: white;
    width: 100vw;
    padding-top: 5vw;
    padding-bottom: 5vw;
}
.first-btn{
  margin-right: 2vw;
}

/* COVID-19 BAGDE */
.badge-covid {
    background-color: #0096ff;
    position: absolute;
    top: 17vw;
    right: -4vw;
    z-index: 10000;
    color: white;
    height: 7.8vw;
    width: 10vw;
    padding-top: 2.2vw;
    opacity: 0;
    text-align: center;
    border-radius: 10vw;
    transform: rotate(-15deg);
    box-shadow: 0vw 0vw 4vw rgba(0, 150, 255, 0.56);
    animation-name: covid;
    animation-duration: 1s;
    animation-delay: 1.2s;
    animation-fill-mode: forwards;
    font-size: 1.3vw;
    cursor: pointer;
    transition: 0.2s ease;
    -webkit-transition: 0.2s ease;
    -moz-transition: 0.2s ease;
    -ms-transition: 0.2s ease;
    -o-transition: 0.2s ease;
}

.badge-covid:hover{
    box-shadow: none;
    background-color: #0083de;
}

.badge-covid p {
    font-family: Segoe UI;
    font-weight: BOLD;
    line-height: 1.4vw;
    
}

/* The animation code */
@keyframes covid {
  0%   {opacity:0;right:-6vw;}
  100%  {opacity:1;right:-4vw;}
}


/***************************************************************************/
@media only screen and (min-width: 1680px /* TV */) {

  #badge p{
    background-color: black;
    position: fixed;
    font-size: 20px;
    top: 50vh;
    margin-top: -85px;
    padding: 75px 20px 17px 20px;
    cursor: pointer;
    font-weight: bold;
    left: -96px;
}

  #badge p:hover{
      left: -80px;
  }

  .subtitle{
    font-size: 18px;
  }

  #titlewhat p{
    font-size:18px;
    font-weight:300;
    color:#707070; 
  }
  .title-texts-left {
    font-size: 18px;
    /* width: 49%; */;
  }

  #videos-sg {
    height: 692px;
    margin-top: -105px;
    padding-top: 310px;
    position: relative;
  }
  .bg-videos-triangle {
    border-bottom: 233px solid #fcfcfc;
    border-left: 129vw solid transparent;
    left: -25vw;
  }
  .bg-videos-triangle2 {
    height: 473px;
    bottom: 98px;
  }
  #vid {
    margin-top: 120px;
  }
  .whyUseIt {
    padding: 15px;
  }
  .sg-video {
    width: 270px;
    height: 270px;
    background-size: 545px;
    margin-left: 100px;
  }
  .sg-video-button {
    margin-left: 3px;
  }
  .whyUseIt h2 {
    font-size: 20px;
  }
  .sg-video h2 {
    margin-top: -136px;
  }
  footer{
    bottom: 0vw;
  }

  .co-financed-logos {
    height: 33px;
    margin-top: 16px;
  }
  #co-financed-div p {
    font-size: 14px;
  }

  #co-financed-div {
    height: 25px;
    margin-top: 24px;
    margin-right: 5px;
  }

  .titles{
    margin-bottom: 15px;
    margin-top:10px;
    font-size: 56px;
  }
  .borders{
    width: 140px;
    height: 5px;
  }
  .button{
    padding:16px 40px;
  }
  .buttons{
    padding:16px 40px;
  }
  /*PT*/
  #containerpt{
    width:1100px;
  }
  .container{
    width:1100px;
  }
  #social{
    width:auto;
  }
  #social img{
    height:35px;
    margin-top:17px;
    margin-left:5px;
  }

  #logospt img{
    height: 24px;
    margin-left: 19px;
    padding-top: 6px;
  }
  #pt{
    height:67px;
  }
  /*COOKIES*/
  #cookies{
    height: 83px;
    bottom: 67px;
  }
  #cookiescontainer{
    width:1100px;
  }
  #cookiescontainer p{
    font-size:13.4px;

  }
  #cookiescontainer button{
    padding: 11.5px 40px;
  }
  /*MENUBAR*/
  #menubar{
    height:67px;

  }
  .menubar-fixed{
    height: 67px;
  }
  #menubar img{
    height:38px;
  }
  #menucontainer{
    width:1100px;
    padding-top: 15px;
  }
  #menubar #menucontainer #nav ul li{
    margin-right:21px;
  }
  #menubar #menucontainer #nav li a{
    padding: 7px 17px;
    font-size:17px;
  }
  #menubar #menucontainer #nav li:last-child{
    font-size: 14px;
    padding:7px 24px;
    margin-top:1px;
    margin-left:23px;
  }
  .menubar-fixed #menucontainer #nav ul li{
    margin-right:21px;
  }
  .menubar-fixed #menucontainer #nav li a{
    text-decoration:none;
    padding: 7px 17px;
    font-size:17px;
  }
  .menubar-fixed #menucontainer #nav li:last-child{
    font-size: 14px;
    padding:7px 24px;
    margin-top:1px;
    margin-left:23px;
  }
  /*START*/
  #containerstart{
    width:1100px;
    margin-top: -310px;
  }
  #box{
    height:565px;
    width:370px;
    margin-left: -101px;

  }
  .logosquare{
    height:269px;
  }

  .scrollDown{
    top: 780px;
    margin-left: -32.5px;
    width: 65px;
   }

  .boxstartwhy {
  font-size: 18px;
  margin-top: 16px;
  margin-bottom: 38px;
  font-weight: 300;
  }
  
  #box h1{
    margin-top: 282px;
    font-size: 38px;

  }
  #box button{
    font-size: 16px;
    padding:14px 0;
    padding-top: 18px;
    width:269px;
  }
  .easter-egg-intro{
    width:86px;
    height: 65px;
    right: 181px;
    top: 283px;
  }
  .screen-container{
    height: 565px;
    width:806px;

  }
  /*WHY INDEX*/
  #title{
    margin-top: 176px;
  }
  #containerwhy{
    margin-top: 77px;
  }
  .flexchild p{
    font-size: 16px;
  }
  .flexchild h1{
    font-size: 16px;
  }
  .borderwhy{
    width: 30px;
  }
  .flexchild{
    height: 385px;
  }
  #player{
    margin-top: 65px;
    height: 618px;
  }
  #why{
    height: 1400px;
    margin-top: -129px;
  }
  .bggray1triangle{
    top:604px;
    border-bottom: 142px solid #f5f5f5;
  }
  .bggray1{
    height: 515px;
    bottom: 142px;

  }
  .bggray2{
    border-top: 144px solid #f5f5f5;
  }
  /*WHO INDEX*/
  #clients{
    margin-top:90px;
  }
  #whoo{
    margin-top: 410px;
  }
  #sortby p{
    font-size: 25px;

  }
  .info{
    left: -500px;
    top: -315px;
    height: 580px;
    width: 1000px;
  }
  #containerinfo{
    margin: 25px auto 0 auto;
    width:850px;
  }
  #containerinfo img{
    height: 178px;
  }
  .buttoncross{
    height:57px;
    width: 57px;
  }
  .buttoncross img {
    height: 17px!important;
    margin-left: 21px;
    margin-top: 20px;
  }
  /* .buttoncross div {
    width: 23px;
    height: 2px;
    margin-top: 27px;
    margin-left: 17px;
  } */
  #containerinfo p{
    font-size: 16px;

  }
  #containerinfo h2{
    font-size: 25px;

  }
  #borderinfo{
    width: 50px;
    margin-bottom: 54px;
    margin-top: -5px;
  }
  #containerinfo button{
    font-size: 16px;
    padding: 23px 34px 20px 34px;
  }
  /*BLOG*/
  #blog{
    height: 0/*805px*/;
    margin-top: 190px;
  }
  #boxblog{
    margin-top: 82px;
  }
  .boxchild{
    height: 385px;

  }
  .date{
    font-size: 18px;
    margin: 16px auto;
  }
  .titleblog{
    font-size: 16px;
  }
  .text{
    margin: 15px auto;
    font-size: 17px;
    height: 89px;
  }
  .boxchild button{
    right: 20px;
    bottom: 17px;
    font-size: 16px;
  }
  .boximg{
    height: 122px;
  }
  /*PARTNER*/
  #partner{
    padding-bottom: 95px;
    top: -10px;
  }
  #titlefindpartner{
    padding-top: 100px;
    margin-top: 345px;
  }
  #map img{
    width: 1516px;
    margin-left: -203px;
    margin-top: 165px;
  }
  .portugal{
    top:364px;
    left: 449px;
  }
  .california{
    top: 373px;
    left: -52px;
  }
  .nigeria{
    top: 528px;
    left: 513px;

  }
  .tanzania{
    top: 600px;
    left: 640px;
  }
  .uganda{
    top: 560px;
    left: 640px;
  }
  .malasya{
    top: 558px;
    left: 977px;
  }
  .brazil{
    top: 693px;
    left: 278px;
  }
  .spain{
    top: 356px;
    left: 471px;
  }
  .southafrica{
    top: 751px;
    left: 581px;
  }
  .kenya{
    top: 581px;
    left: 663px;
  }
  .capeverde{
    top: 482px;
    left: 384px;
  }
  .pennsylvania{
    top: 354px;
    left: 129px;
  }
  .angola{
    top: 658px;
    left: 561px;
  }
  .toronto{
    top: 316px;
    left: 134px;
  }
  .mozambique{
    top: 678px;
    left: 638px;
  }
  .ghana{
    top: 534px;
    left: 472px;
  }
  .ivorycoast{
    top: 541px;
    left: 449px;
  }
  .connecticut{
    top:322px;
    left:192px;
  }
  .cameroon{
    top: 547px;
    left: 538px;
  }
  .ny{
    top: 340px;
    left: 152px;
  }
  .nc{
    top: 377px;
    left: 120px;
  }
  .florida{
    top: 422px;
    left: 101px;
  }
  .pin p{
    font-size: 16px;
    margin: 5px 20px;
    top: -20px;
    left: 35px;
  }
  #textfindpartners{
    margin-top: 70px;
  }
  #textfindpartners p{
    font-size: 18px;
  }
  #buttonfindpartner{
    margin-top: 55px;
    margin-bottom: 255px;
  }
  /*DEMO*/
  #demo{
    margin-bottom: 0;
    margin-top: -225px;

  }
  #container-demo{
    margin-top: 67px;
  }
  #titledemo{
    padding-top:140px;
  }
  #titledemo p{
    font-size: 20px;
  }
  #formbox{
    margin: 90px auto;
  }
  .input{
    height: 85px;
    margin-bottom: 35px;
  }
  #formbox input{
    height: 84px;
    font-size: 20px;
    margin-bottom: 24px;
  }
  .inputcountrycode{
    height: 85px;
  }
  .input p{
    margin-top: -20px;
    font-size: 24px;

  }
  #gdpr{
    margin:76px auto;
  }
  .containere{
    padding-left:50px;
  }
  #gdpr p{
    font-size: 20px;
    margin:25px 0;
  }
  .checkmark{
    height: 25px;
    width: 25px;
  }
  .containere .checkmark:after{
    left:8px;
    top:3px;
    width:6px;
    height: 13px;
  }
  #buttondemo{
    margin-left: 198px!important;
    width: 260px!important;
    padding: 28px 0;
  }
  #cavedigital{
    width: 586px;
    height: 50px;
  }
  .sgfooter{
    width: 160px!important;
    margin-left: 71px!important;
  }
  #cavedigital p{
    font-size: 17px;
    margin-left: 16px;
  }
  #terms{
    height: 85px;
    margin-top: 40px;
    margin-bottom:135px;
  }
  #terms p{
    font-size: 17px;
    margin-top: 32px;
  }
  #terms a:first-child{
    margin-right: 35px;
  }
  #terms a:last-child{
    margin-left: 35px;
  }
  #cavedigital img{
    width: 130px;
    margin-top: 5px;
    margin-left: 18px;
  }
  #cavedigital img:first-child{
    margin-top: 16px;
  }
  /*PAGE WHAT*/
  #sectionone-what{
    margin-top: -110px!important;

  }
  #bg-sectionone{
    height: 945px;

  }
  .bg-sectiononetriangle{
    border-top: 101px solid #0096ff;
  }
  .container-what-start{
    margin-top:335px;
  }
  .box-what p{
    font-size: 18px;
    margin: 40px 0;
  }
  #sectiontwo-what{
    margin-top: 80px;
  }
  #sectiontwo-what p{
    font-size: 18px;

  }
  #slideshow-what{
    height: 38vw;
    margin-top: 100px;
  }
  #sectionthree-what{
    margin-top: 125px;
    height: 1400px;
  }
  .box-what-1{
    width: 594px;
    top: 32px;
    margin-left: -680px;
  }
  .box-what-2{
    width: 594px;
    top: 505px;
    margin-left: 83px;
  }
  .box-what-3{
    margin-left: -680px;
    top:850px;
    width: 594px;
  }
  .box-what-1 img{
    width: 100px;
  }
  .box-what-1 .borders{
    margin-left: 489px;
    width: 99px;
  }
  .box-what-1 h1{
    font-size: 40px;
    margin-top: 40px!important;
  }
  .box-what-1 p{
    font-size: 20px;
    margin-top: 40px!important;
  }
  .box-what-2 img{
    width: 100px;
  }
  .box-what-2 .borders{
    width: 99px;

  }
  .box-what-2 h1{
    font-size: 40px;
    margin-top: 40!important;
  }
  .box-what-2 p{
    font-size: 20px;
    margin-top: 40px!important;
  }
  .box-what-3 img{
    width: 100px;
  }
  .box-what-3 .borders{
    margin-left: 489px;
    width: 99px;
    margin-top: 20px;
  }
  .box-what-3 h1{
    font-size: 40px;
    margin-top: 40px!important;
  }
  .box-what-3 p{
    font-size: 20px;
    margin-top: 40px!important;
  }
  .circle1{
    width: 25px;
    height: 25px;
    margin-left: -13.5px;
    top: 67px;
  }
  .circle2{
    width: 25px;
    height: 25px;
    margin-left: -13.5px;
    top: 558px;
  }
  .circle3{
    width: 25px;
    height: 25px;
    margin-left: -13.5px;
    top: 882px;
  }
  #sectionfour-what{
    margin-top: 100px;
    margin-bottom: 100px;
  }
  #sectionfour-what h2{
    font-size: 44px;
  }
  #sectionfive-what{
    margin-bottom: 100px;
    padding-top: 135px;
    padding-bottom: 135px;
  }
  #bg-sectionfivetriangle{
    border-bottom: 136px solid #f5f5f5;
  }
  .borderfive{
    width: 60px;
    margin-left: -30px;
  }
  .logos-partners2{
    margin-top: 30px;
    margin-bottom: 30px;
  }
  #sectionfive-what img{
    height: 54px;
    margin: 25px 30px;

  }
  /*PAGE WHY*/
  .bg-pagewhy-starttriangle{
    border-top: 900px solid #0096ff;

  }
  .bg-pagewhy-start-highlight{
    border-bottom: 700px solid rgba(255,255,255,0.1);
    top:0;
    left: -1100px;
  }
  .border-pagewhy{
    margin-top: 160px;
  }
  #start-why h1{
    font-size: 55px;
  }
  #start-why img{
    margin-top: 100px;
  }
  .little-title{
    font-size: 32px;
    margin-top: 160px;
    margin-bottom: 160px;
    line-height:35px;
  }
  .block p{
    font-size: 18px;
  }
  #sec3{
    padding-bottom: 50px;
  }
  .bg-pagewhy-improve{
    height: 650px;
    top: -90px;
  }
  .textbox-title img{
    margin-right: 17px;

  }
  .checkmark-img{
    width: 22px;
    margin-top: 7px;
    padding-right: 10px;
  }
  .textbox-title h1{
    font-size: 24px;
    margin-left: 12px;
  }
  .textbox-title p{
    font-size: 20px;
    margin-left: 50px;
  }
  #sec3 .titles{
    font-size: 46px;
    margin-bottom: 75px;
  }
  .border-improve{
    margin-top: 220px;
  }
  .modernize-textbox{
    padding-top: 160px;
    height: auto;
    padding-top:230px;
    padding-bottom: 180px;
  }
  .textbox-videopart-modernize {
    margin-top: 300px;
    margin-bottom: 0vw;
  }
  #gif{
    margin-top: 30px;
  }
  .reduce-textbox{
    padding-top: 80px;
    height: auto;
  }
  .textbox-title-reduce img{
    margin-right: 18px;
  }
  .textbox-title-reduce h1{
    font-size: 24px;
    margin-left: 50px;
  }
  .textbox-title-reduce p{
    font-size: 20px;
    margin-left: 50px;
  }
  .control-textbox{
    height: auto;
    padding-top: 160px;
  }
  .bg-pagewhy{
    height: 2922px;
    bottom: -120px;
  }
  .bg-pagewhytriangle{
    border-bottom: 115px solid #0096ff;
    bottom: 2800px;
  }
  .bg-pagewhy-highlight{
    border-bottom: 1000px solid rgba(255,255,255,0.1);
    border-right: 6000px solid transparent;
  }
  .bgdemotriangle{
    border-bottom: 102px solid #0096ff;
  }
  .bglavender{
    top: 101px;
  }
  /*CONTACT PAGE*/
  #contact-section{
    padding-bottom: 140px;
  }
  .form-contact{
    width: 700px;
    margin-left: -350px;
    margin-top: 200px;
    padding-top: 46px;
    padding-bottom: 62px;
  }
  .message{
    font-size: 20px;
  }
  .info-contact{
    font-size: 26px;
    margin-top: 80px;
  }
  #form-contact{
    margin:75px auto 0 auto;
  }
  .input-contact{
    font-size: 24px;
    padding: 22px 0;
    margin-bottom: 26px;

  }
  #button-contact{
    font-size: 26px;
    margin-top: 40px;
    padding:14px 70px;
  }
  .bg-contact-triangle{
    border-bottom: 330px solid #0096ff;
  }


}
  @media only screen and (max-width: 768px /* TABLET */) {

    .badge-covid {
      top: 57vw;
      right: -4vw;
      height: 10.2vw;
      width: 13vw;
      padding-top: 2.7vw;
      font-size: 2vw;
  }
  .badge-covid p {
    line-height: 2vw;
  }
    .cvd-start img {
      margin-top: 13vw;
  }
    #badge p{
      background-color: black;
      position: fixed;
      font-size: 2.2vw;
      top: 50vh;
      margin-top: -7vw;
      padding: 7vw 2vw 2vw 2vw;
      cursor: pointer;
      font-weight: bold;
      left: -9.5vw;
    }

    #badge p:hover{
        left: -7.5vw;
    }

  	#start{
  		background-attachment: scroll;
	    height: 100vh;
	    background-size: cover;
	    background-repeat: no-repeat;
	    background-position: center;
  	}

    .subtitle{
      font-size: 2vw;
    }
    .box-what p {
      font-size: 1.5vw;
      margin: 2vw 0;
      margin-top: 2vw;
    }
    #titlewhat p{
      font-size:2vw;
      margin-bottom:3vw; 
    }
 
    .title-texts-left {
      font-size: 2vw;
      -webkit-column-count: 2;
      -moz-column-count: 2;
      column-count: 2;
    }
    #sec3{
      padding-bottom:4vw;
    }
    .textbox-videopart-modernize {
      /* background-color: pink; */
      margin-top: 4vw;
      margin-bottom: 0vw;
    }
    #title-what-start {
      font-size: 4.5vw;
    }
    #bg-sectionone {
      height: 79vw;
    }
    .bg-sectiononetriangle {
      border-top: 8vw solid #0096ff;
      border-right: 193vw solid transparent;
    }
    #sectionone-what {
      padding-top: 1px;
      padding-bottom: 5vw;
    }
    .buttoncross {
      height: 4.5vw;
      width: 4.5vw;
    }
    .buttoncross img {
      height: 1.5vw!important;
      margin-left: 1.5vw;
      margin-top: 1.5vw;
    }
    #borderinfo {
      margin-top: -2.5vw;
    }
    .boxstartwhy {
     font-size: 2vw;
     margin-top: 1.5vw;
     margin-bottom: 4.5vw;
     font-weight: 300;
    }
    #cavedigital {
      width: 55vw;
      height: 3.5vw;
      margin: 0 auto;
    }
    .sgfooter {
      width: 16vw!important;
      margin-left: 6vw!important;
    }
    #cavedigital img {
      margin-top: 0vw;
      width: 13vw;
    }
    #cross {
      width: 10vw;
      height: 10vw;
      top: 5vw;
      right: 8vw;
      display: none;
      position: absolute;
      transform:rotate(45deg);
      cursor: pointer;
      /* -ms-transform:rotate(45deg);
      -webkit-transform:rotate(45deg); */
    }
    #cross:hover{
      opacity: 0.5;
    }

   #cross:before, #cross:after {
    content: "";
    position: absolute;
    z-index: 101;
    background: #fcfcfc;
  }

  #cross:before {
    left: 50%;
    width: 1.2vw;
    margin-left: -0.3vw;
    margin-top: 0.2vw;
    height: 100%;
  }

  #cross:after {
    top: 50%;
    height: 1.2vw;
    margin-top: -0.3vw;
    margin-left: 0.2vw;
    width: 100%;
  }
  .checkmark-img{
    margin-top: 0.7vw;
  }

  #sectionfive-what img{
    height: 5vw;
    margin: 1vw 1.5vw;
  }
  .easter-egg-intro{
    right: 20.5vw;
    top: 52.5vw;
  }
  .form-contact{
    width:50vw;
    margin-left: -25vw;
    margin-top:20vw;
    padding-top: 4vw;
    padding-bottom: 4vw;
  }
  .bg-pagewhytriangle{
    bottom: 272.8vw;
  }

  #slideshow-what{
    height:30vh;
  }
  #buttonsec1{
    font-size: 1.8vw;
  }

  #containerstart{
    /*background-color:blue;*/
    width:70vw;
    position:absolute;
    top:50vh;
    margin-top:-44vw;
  }
  .screen-container{
    height:49vw;
    width:80vw;
    float:none;
    position:relative;
    right:-10vw;
    margin-top: 30vw;
    /*animation-name: slidetablet;*/
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    animation-delay: 0.5s;
  }
  /*  .screenstart{
    opacity: 0;
    height:49vw;
    float:none;
    position:relative;
    right:-10vw;
    margin-top: 2vw;
    animation-name: slidetablet;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    animation-delay: 0.5s;
  }*/
  .bg-pagewhy-improve{
    height: 71vw;
    top: -4vw;
  }
  #box{
    /*background-color: rgba(255,255,255, 0.5);*/
    opacity: 0;
    width: 100%;
    height:25vw;
    float: left;
    position: relative;
    margin-left:0;
    animation-delay: 0s;
  }
  .logosquare{
    position: relative;
    right:0;
    height:28vw;
    cursor:pointer;
    animation-delay: 0s;
    float: left;
  }

  @keyframes slide-scrollDown-tablet {0%{opacity:0; bottom:-5vh;} 100%{opacity:0.8; bottom:5vh;}}
  .scrollDown{
    animation-name: slide-scrollDown-tablet;
    animation-fill-mode: forwards;
    animation-duration: 2s;
    animation-delay: 1s;
    width: 8vw;
    top:76vh;
    margin-left: -4vw;
  }

  #box h1{
    /*background-color: pink;*/
    margin-top:0;
    color:white;
    text-align:left;
    font-size: 3.78vw;
    position: relative;
    right:0;
    animation-delay: 0.5s;
    opacity: 0;
    width:100%;
    float: left;

  }
  #box button{
    opacity: 0;
    font-size: 1.5vw;
    padding:1.5vw 1vw 1.2vw 1vw;
    float: none;
    width:20vw;
    position:absolute;
    bottom:-15px;
    right:0;
    margin-right:20vw;
  }
  .boxinfo{
    /*background-color: red;*/
    height:111%;
    width:40vw;
    float: right;
  }

  .titles{
    margin-top:1vw;
    font-size: 5vw;
    text-transform: uppercase;
    color:#707070;
  }
  .borders{
    width:10vw;
    height:1vw;
  }

  #why{
    height: 181vw;
  }

  .bgcoral{

    /* clip-path: polygon(0 6vw, 100% 0, 100% 100%, 0% 100%); */
  }
  .bggray1triangle{
    top:96.5vw;
  }
  .bggray1{
    height:73vw;
    background-color: #f5f5f5;
    position: absolute;
    bottom:6vw;
    left:0;
    z-index: -1;
    /* clip-path: polygon(0 0, 100% 7vw, 100% 55vw, 0% 100%); */
  }
  .bgpartnergray2{
    height: 488vw;
  }
  .inputcountrycode{
    height: 7vw;
  }

  #who{
    height: 100vw;
  }
  .flexchild{
    width: 48%;
    margin-bottom:2.5vw;
    height:50.5vw;
  }
  .flexchild img{
    width:25%;
    margin-top: 12%;
    margin-bottom:12%;
  }
  .flexchild h1{
    font-size:2vw;
  }
  .flexchild p{
    font-size:2vw;
    width:70%;
  }
  .borderwhy{
    width:5vw;
    margin: 8% auto;
  }
  .buttons{
    padding:1.3vw 3.5vw;
  }
  #containerwhy{
    margin-top: 8vw;
  }

  #whoo{
    margin-top: 52vw;
  }
  .square{
    width:25%;
    padding-top: 25%;
    margin-bottom: 0;
  }
  #sortby{
    width:100%;
    /*background-color: blue;*/
  }
  #sortby p{
    /*background-color: yellow;*/
    width:15%;
    font-size: 2vw;
  }
  .info{
    width:80vw;
    height:auto;
    top:-26vw;
    margin-left:50%;
    left:-40vw;
    padding-bottom: 4vw;
  }
  #containerinfo{
    width:80%;
    margin:4vw auto 0 auto;
  }
  #containerinfo img{
    height:13vw;
  }
  #containerinfo p{
    font-size:1.8vw;
  }
  #containerinfo h2{
    font-size:2vw;
  }
  #containerinfo button{
    background-color: #0096ff;
    color:#FCFCFC;
    text-decoration: none;
    border: 0 solid #fcfcfc;
    padding:1.5vw 2vw 1.3vw 2vw;
    font-size:1.3vw;
    text-transform: uppercase;
    font-weight: bolder;
  }

  #boxblog{
    margin-top: 10vw;
  }
  .boxchild{
    width:48%;
    height:45vw;
    margin-bottom: 3vw;
  }
  .boximg{
    height:13vw;
    overflow: hidden;
  }
  .boximg img {
    height: 115%;
    margin-top: -3%;
    margin-left: 0%;
    width: auto;
  }
  .date{
    font-size:2vw;
    margin:2vw auto;
  }
  .titleblog{
    font-size: 2vw;
  }
  .text{
    margin:2vw auto;
    font-size: 2vw;
    height: 8.1vw;
  }
  .boxchild button{
    right: 2vw;
    bottom: 2vw;
    font-size: 2vw;
  }
  #blog{
    background-color: #fcfcfc;
    height:0/*150vw*/;
    margin-top: 10vw;
  }

  #partner{
    /* padding-top: 60vw; */
    /*margin-top: 73vw;*/
  }
  #titlefindpartners{
    margin-top: 20vw;
    padding-top: 10vw;
  }
  #textfindpartners p{
    /*background-color: violet;*/
    width:48%;
    font-size: 2vw;
  }

  #demo{
    min-height: 133vw;
    margin-bottom: 6.9vw;
  }

  #pt{
    height:9vw;
  }

  #containerpt{
    width:70vw;
    height:100%;
    margin:0 auto 0 auto;
  }
  #social{
    margin-top:1.5vw;
    float:right;
  }
  #social img{
    height:4vw;
    margin-left:1.5vw!important;
  }
  #social img:last-child{
    margin-right:0;
  }
  #social img:first-child{
    margin-left:0vw!important;
  }
  #social img:hover{
    opacity: 0.5;
    cursor: pointer;
  }
  #logospt {
    width: 37vw;
    float: left;
    margin-top: 0vw;
  }
  #co-financed-div {
    width: 100%;
    float: left;
    margin-top: 1.5vw;
  }
  #co-financed-div p {
    margin: 0vw;
    font-size: 1.5vw;
    text-decoration: none;
    color: #fcfcfc;
  }
  .co-financed-logos {
    float: left;
  }
  #logospt img {
    height: 2vw;
    float: right;
    margin-top: 0.6vw;
    margin-right: 1vw;
    margin-left: 0vw;
  }


  #menubar{display:none; }
  .menubar-fixed{display:none;}
  .menuhamburger-fixed{
    top:0!important;
  }
  #menuhamburger{
    display: block;
    z-index: 3;
    width:100%;
    background-color: #0096FF;
    height:14vw;
    position: fixed;
    top:-14vw;
    -o-transition: top .4s ease-in-out;
    -moz-transition: top .4s ease-in-out;
    -webkit-transition: top .4s ease-in-out;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
  }
  #menucontainer2{
    /* background-color: pink; */
    width:85vw;
    margin:0 auto;
  }
  #menucontainer2 img{
    width:30vw;
    margin-top:2vw;
    cursor: pointer;
  }

  #nav2 {
      float: right;
      display: block;
      color: #fff;
      font-size: 30px;
      margin-top: 2.6vw;
      right: 0.6vw;
      /* text-shadow: 0 0 30px #9c9c9c; */
      z-index: 99;
      font-family: 'Font Awesome';
      font-style: normal;
      content: '\f0c9'
  }

  #nav2:after {
      font-family: 'Font Awesome';
      font-style: normal;
      content: '\f0c9'
  }
  #nav2:hover{
    cursor:pointer;
    opacity: 0.5;
  }
  .hamb{
    background-color: white;
    height: 2.4px;
    width:100%;
  }
  .mobilelist{display: block; bottom: 9vw;top: 14vw;}

  #cookies{
    height:9vw;
    bottom:9vw;
  }
  #cookiescontainer p{
    width:85%;
    font-size: 1.2vw;
    float: left;
    color:#fcfcfc;
  }
  #cookiescontainer button{
      padding: 0.5vw 2vw;
      margin-top:2.7vw;
      font-size: 2vw;
  }

  .checkmark-img{
    width:2.5vw;
  }
  .little-title{
    font-size: 3vw;
    width: 92%;
    margin-left: -46%;
    line-height: normal;
  }

  .block p{
    font-size: 1.52vw;
    margin:inherit 10%;
  }
  #why-blocks{
    width:85%;
    left:50%;
    margin-left: -42.5%;
  }
  .block{
    width:auto;
    text-align: center;
    cursor: pointer;
    transition: .3s;
  }

  .textbox-title-reduce p{
    font-size: 2vw;
  }
  .textbox-title h1{
    font-size: 2.3vw;
    margin-left: 4vw;
  }
  .textbox-title p{
    font-size: 2vw;
  }

  .textbox-textpart-modernize{
    /* background-color: blue; */
    width:100%;
    float: none;
    margin-top: 6vw;
  }

  .textbox-gifpart-modernize{
    /* background-color: pink; */
    width:100%;
    float:none;
  }
  .modernize-textbox{
    /* background-color: lavender; */
    height:auto;
  }
  .textbox-title p{
    margin-left:4vw;
  }

  .reduce-textbox{
    height: auto;
    margin-top: -10vw;
  }
  .textbox-gifpart-reduce{
    width:100%;
    float:none;
    margin-top: 10vw;
  }
  .textbox-textpart-reduce{
    margin-top: 5vw;
    width:100%;
    float:none;
  }
  .textbox-title-reduce img{
    margin-right: 1vw;
    float: left;
  }
  .textbox-title-reduce h1{
    font-size: 2.5vw;
    font-weight: 700;
    color:#fcfcfc;
    width:80%;
    /* background-color: pink; */
    margin-left: 3vw;
  }
  .textbox-title-reduce p{
    font-size: 2vw;
    font-weight: 300;
    color:#fcfcfc;
    margin-left:4vw;
    width:85%;
  }

  .control-textbox{
    /* background-color:coral; */
    height: auto;
    padding-top: 11vw;
    padding-bottom: 0vw;
  }
  .textbox-textpart-control{
    /* background-color: blue; */
    width:100%;
    float: none;
    margin-top: 5vw;
    /* background-color: blue; */
    margin-bottom:3vw;
  }
  .textbox-gifpart-control{
    /* background-color: yellow; */
    width:100%;
    float:none;
  }

  #demowhy{
    margin-top: -16px;
  }
  .bg-pagewhy{
    height:279.9vw;
  }
  .border-pagewhy{margin-top:16vw;border-bottom: 2px solid #fcfcfc;}
  #formbox{width:100%;}
  .input p{
    top: 50%;
    margin-top: -1.5vw;
    font-size: 2.3vw;
  }
  .input{
    margin-bottom: 5vw!important;
    height:7vw;
  }
  .input-p-transition{
    top: -0.5 !important;
    font-size: 2vw !important;
  }
  #formbox input{
    height:100%;
    width:100%;
    padding:2vw 0 1vw 0;
    font-size: 2.3vw;
    margin-bottom: 1vw;
  }

  #gdpr p{
    font-size: 2vw;
    margin:2vw 0;
  }
  .containere .checkmark:after {
    left: 0.6vw;
    top: 0vw;
    width: 0.4vw;
    height: 1.2vw;
  }
  .checkmark {
    top: 0.5vw;
    left: 0;
    height: 2vw;
    width: 2vw;

  }
  #buttondemo{
    margin-left: 20.5vw!important;
    margin-top: 0vw;
    padding-bottom: 2vw!important;
    position: static!important;
    height:7vw!important;
  }

  #menucontainer2{
    width:70vw;
    margin-top: 2vw!important;
  }
  #gdpr{
    margin: 13vw 0 11vw 0;
  }

}
@media only screen and (max-width: 620px /* MAPPERS */) {


  #map-mobile{
    width: 114%;
    margin-left: -10%;
    margin-bottom: 10vw;
    margin-top: 3vw;
    display: block;
  }
  #mappers {
    display: flex;
  }
  .listchild{
    background-color: #fcfcfc;
    width: 100%;
    text-align: center;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    padding:3vw 0;
    font-weight: 300;
    color:#0096ff;
    font-size: 4vw;
  }
  #map{
    display: none;
  }
  #mappers{display:block;}

}
@media only screen and (max-width: 535px /* TABLET MINI */) {
  .textbox-title p {
    font-weight: normal;
  }
  .box-what p {
    font-weight: normal;
  }
  #gdpr p {
    font-weight: normal;
  }
  .text {
    font-weight: normal;
  }
  .date {
    font-weight: normal;
  }
  .flexchild p {
    font-size: 2vw;
    font-weight: normal;
  margin-top: -2vw;
  text-align: center;
  }
  #textfindpartners p {
    font-size: 4vw;
    font-weight: normal;
  }
  .info {
    width: 100%;
    height: 100vh;
    top: 0;
    margin-top: 0;
    margin-left: 0;
    left: 0;
    padding-bottom: 0;
    z-index: 1000;
  }
  .buttoncross {
    height: 8.5vw;
    width: 8.5vw;
  }
  .buttoncross img {
    height: 3vw!important;
    margin-left: 2.7vw;
    margin-top: 2.7vw;
  }
  #containerinfo img {
    height: 22vw;
  }
  #containerinfo p {
    font-size: 2.5vw;
    font-weight: normal;
  }
  #containerinfo h2 {
    font-size: 3vw;
  }
  #borderinfo {
    width: 6vw;
  }
  .bg-videos-triangle2 {
    height: 93vw;
    bottom: 104vw;
  }

}
@media only screen and (max-width: 480px /* SMARTPHONE */) {

  .badge-covid {
      top: 70vw;
      height: 17vw;
      width: 23vw;
      padding-top: 5.5vw;
      font-size: 3vw;
      border-radius: 30vw;
  }
  .badge-covid p {
    line-height: 3vw;
  }
    #badge p{
    background-color: black;
    position: fixed;
    font-size: 3.7vw;
    top: 50vh;
    margin-top: -23vw;
    padding: 12vw 2vw 1.5vw 2vw;
    cursor: pointer;
    font-weight: bold;
    left: -16.5vw;
    }

    #badge p:hover{
        left: -13vw;
    }

  .subtitle{
      font-size: 4vw;
  }
  #titlefindpartner {
    margin-top: 9vw;
  }
  #partner{
    padding-bottom: 0vw;
  }
  #titlewhat p{
    font-size:4vw;
    margin-bottom:5vw;
    font-weight:normal; 
  }
  #button-index-why{
    width: 100%;
    padding: 3vw 5vw;
  }
  #button-index-blog{
    width: 100%;
    padding: 3vw 5vw;
  }
  .title-texts-left {
    font-size: 4vw;
    width: 100%;
    float: none;
    font-weight: normal;
    margin: 7vw 0;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
  }
  .bg-videos-triangle2 {
    height: 93vw;
    bottom: 104vw;
  }
  .container-videos {
    margin-top:8vw;
  }
  .whyUseIt h2 {
    margin-bottom: 0;
    font-size: 6.2vw;
  }
  .sg-video h2 {
    margin-top: -34.9vw;
    margin-left: 3vw;
  }
  #videos-sg {
    height: 314vw;
  }
  .sg-video{
    float: none;
    margin-left: 0;
    margin-bottom: 15vw;
    width: 78vw;
    height: 75vw;
    background-size: 140vw;
  }
  footer{
    bottom: 13.5vw;
  }
  #cross{display: block;}

  #sec3 .titles {
    margin-bottom: 15vw;
  }
  .title-text-control{
    margin-bottom: 8vw!important;
  }
  .title-text-reduce{
    margin-bottom: 8vw!important;
  }
  .title-text{
    margin-bottom: 8vw!important;
  }

  @keyframes slide-scrollDown-mobile {0%{opacity: 0;bottom: -16vh;}100% {opacity: 0.8;bottom: 16vh;}}
  .scrollDown{
    animation-name: slide-scrollDown-mobile;
    animation-fill-mode: forwards;
    animation-duration: 2s;
    animation-delay: 1s;
    width: 12vw;
    margin-left: -6vw;
    top:100vw;
    z-index:98;
  }
  #cookiescontainer {
    width: 80vw;
  }
  #menuhamburger{
    height: 19vw;
    top: -19vw;
  }
  #menucontainer2 img{
    width: 50vw;
  }
  .mobilelist ul{
    margin-right: -1vw;
    margin-top: -53vw;
  }
  .mobilelist ul li{
    font-size: 8vw;
    margin: 3vw 0;
  }
  .mobilelist ul button{
    font-size: 8vw;
    padding: 3vw 23vw;
  }
  .textbox-gifpart-reduce{
    margin-top: 10vw;
  }
  .bg-pagewhytriangle{
    bottom: 495vw;
    border-bottom: 16vw solid #0096ff;
    border-left: 160vw solid transparent;
    left: -47vw;
  }
  .easter-egg-intro{
    right: 18.5vw;
    top: 66vw;
    width:7vw;
    height:6vw;
  }
  .bg-contact-triangle{
    border-right: 248vw solid transparent;
    border-bottom:64vw solid #0096ff;
  }
  .boxstartwhy {
    font-size: 4vw;
    margin-top: 2.5vw;
    margin-bottom: 6.5vw;
    font-weight: 300;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
  }
  #terms{
    margin-bottom: 14vw;
    margin-top:3vw;
  }
  #terms p{
    font-size: 4vw;
    margin-top: 3.5vw;
  }
  #cavedigital{
    width: 80vw;
    height: 7.5vw;
  }
  #cavedigital img:first-child{
    margin-top:2vw;
  }
  #cavedigital img{
    width: 23vw;
    margin-top: 0.2vw;
    margin-left: 1vw;
  }
  .sgfooter{
    width: 28vw!important;
    margin-left: 2.5vw!important;
  }
  #gdpr{
    margin: 17vw auto;
  }

  .inputcountrycode{
    height: 10vw;
  }
  .form-contact{
    width:80vw;
    margin-left: -40vw;
    margin-top:30vw;
    padding-top: 7vw;
    padding-bottom: 7vw;
  }
  .form-contact .titles{
    font-size: 8vw!important;
  }
  .message{
    font-size: 3.5vw;
  }
  .info-contact{
    font-size: 3.5vw;
    margin-top: 10vw;
  }
  .input-contact{
    background:none;
    border: 0 solid white;
    border-bottom: 1px solid #dbdbdb;
    font-size: 4vw;
    padding:3vw 0;
    width:100%;
    margin-bottom: 3vw;
    opacity:0.4;

  }
  #form-contact{
    margin: 9vw auto 0 auto;
  }
  #button-contact{
    font-size: 4vw;
    padding: 2vw 5vw;
    margin-top: 5vw;
  }
  #contact-section{
    padding-bottom: 25vw;
  }
  .bg-contact-img{
    height:60vw;
    /* clip-path: polygon(0 10vw, 100% 0, 100% 100%, 0% 100%); */
  }
  .bg-pagewhy-starttriangle{
    border-top: 94vw solid #0096ff;
  }

  .container-what-start{
    margin-top: 30vw;
  }
  .box-what{
    width:100%;
    float: none;
  }
  #sectionone-what img{
    width:100%;
    float: none;
    margin-top: 10vw;
  }
  #bg-sectionone{
    position: absolute;
    top: 0;
    height:244.2vw;
    width:100%;
    background-color: #0096ff;
    z-index: -1;
    /* clip-path: polygon(0 0, 100% 0, 100% 100%, 0 110vw); */
  }

  .bg-sectiononetriangle{
    bottom: 32vw;
    border-top: 12.1vw solid #0096ff;
    border-right: 161vw solid transparent;
  }
  .box-what p{
    font-size: 4vw;
    margin-top: 5vw;
    font-weight: normal;
  }
  #buttonsec1{
    font-size: 3vw;
    margin-top: 7vw;
    width: 100%;
    padding: 3vw 0;
  }

  #sectiontwo-what{
    height: auto;
    margin-top: 20vw;
  }
  #sectiontwo-what p{
    font-size: 4vw;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    font-weight: normal;
  }

  #slideshow-what{
    /* height:8vh; */
  }

  #sectionthree-what{
    height: auto;
    margin: 0 auto;
    width: 80vw;
  }
  .box-what-1{
    /*background-color: coral; */
    width: 100%;
    /* padding: 0 13vw; */
    text-align: left;
    position: static;
    top: 2vw;
    left: 50%;
    margin-left: 0;
  }
  .box-what-1 img{
    width: 15vw;
  }
  .box-what-1 .borders{
    border-bottom: 2px solid #0096ff;
    position: static;
    margin-left: 0;
    width: 15vw;
  }
  .box-what-1 p{
    font-size: 5vw;
    color: #707070;
    margin-top: 2vw!important;
  }
  .box-what-1 h1{
    text-transform: uppercase;
    font-size: 7vw;
    text-align: left;
    color: #707070;
    margin-top: 2vw!important;
  }
  .box-what-2{
    width: 100%;
    text-align: left;
    position: static;
    top: 0;
    right: auto;
    left: 0;
    margin-left: 0;
    margin-top: 3em;
  }
  .box-what-2 img{
    width: 14vw;
  }
  .box-what-2 .borders{
    border-bottom: 2px solid #0096ff;
    position: static;
    margin-left: 0;
    width: 15vw;
  }
  .box-what-2 p{
    font-size: 5vw;
    color: #707070;
    margin-top: 2vw!important;
  }
  .box-what-2 h1{
    text-transform: uppercase;
    font-size: 6.5vw;
    color: #707070;
    margin-top: 2vw!important;
  }
  .box-what-3{
    width: 100%;
    text-align: left;
    position: static;
    top: 0;
    left: 0;
    margin-left: 0;
    margin-top: 3em;
  }
  .box-what-3 img{
    width: 14vw;
  }
  .box-what-3 .borders{
    border-bottom: 2px solid #0096ff;
    position: static;
    margin-left: 0;
    width: 15vw;
    margin-top: 1vw;
  }
  .box-what-3 p{
    font-size: 5vw;
    color: #707070;
    margin-top: 2vw!important;
  }
  .box-what-3 h1{
    text-transform: uppercase;
    font-size: 7vw;
    text-align: left;
    color: #707070;
    margin-top: 2vw!important;
  }
  #start{
    height: 71vh;
  }

  .border-what{
    display: none;
  }
  .circle1{
    display: none;
  }
  .circle2{
    display: none;
  }
  .circle3{
    display: none;
  }
  #sectionfour-what{
    margin-top: 12vw;
    text-align: center;
    margin-bottom: 20vw;
  }
  #sectionfour-what h2{
    font-size: 6vw;
  }
  #bg-sectionfive{
    background-color: #f6f6f6;
    width:100%;
    margin-top: 0;
    height:160%;
    /* clip-path: polygon(0 5vw, 100% 0, 100% 50vw, 0 100%); */
  }
  #bg-sectionfivetriangle{
    border-left: 147vw solid transparent;
    left:-47vw;
  }
  .logos-partners2{
    margin-bottom: 8vw;
  }
  #sectionfive-what img{
    height:4vw;
  }
  .borderfive{
    height:2px;
    width:5vw;
    border-bottom: 1px solid #ddd;
    position: relative;
    left:50%;
    margin-left: -2.5vw;
  }

  #gdpr p{
    font-size: 3.5vw;
    margin-left: 4vw;
  }
  #menucontainer2{
    width:80vw;
  }
  .containere .checkmark:after {
    left: 1.15vw;
    top: 0vw;
    width: 1vw;
    height: 2.2vw;
  }
  .checkmark {
    top: 0.5vw;
    left: 0;
    height: 4vw;
    width: 4vw;

  }
  .input p{
    font-size: 4vw;
    margin-top: -3vw;
  }
  .input{
    height: 10vw;
  }
  .input-p-transition{
    top: 0 !important;
    font-size: 3vw !important;
  }
  #formbox input{
      height:100%;
      font-size: 4.3vw!important;
  }
  #buttondemo{
    padding-bottom: 2vw!important;
    position: static!important;
    height:12vw!important;
    width: 100%!important;
    nt: ;
    */: ;
    margin-left: 0vw!important;
  }
  #buttonfindpartner{
    margin-bottom: 33vw;
  }


  .container{
    width:80vw;
  }
  .screenstart{
    height:56vw;
    float:none;
    position:relative;
    right:-10vw;
    margin-top: 2vw;
  }
  .screen-container{
    height:56vw;
    float:none;
    position:relative;
    right:0;
    margin-top: 10vw;
    top:28vw;
   /* animation-name: slidetablet-mobile;
    animation-duration: 0.5s;*/
  }
  #containerstart{
    width:80vw;
    top: 30vh;
  }
  #box{
    width: 80vw;
    height:35vw;
    float: left;
    position: relative;
    margin-left:0;
    animation-delay: 0s;
  }
  .logosquare{
    height:34vw;
    cursor:pointer;
    animation-delay: 0s;
    float: left;
    margin-top:1vw;
    animation-duration: 0.3s;
  }
  #box h1{
    margin-top:0;
    color:white;
    text-align:left;
    font-size: 4.6vw;
    position: relative;
    right:-10vw;
    /*animation-delay: 0.5s;*/
    opacity: 0;
    width:100%;
    float: left;
  /*animation-name: slide-mobile;
    animation-duration: 0.5s;*/
  }

  @keyframes slidetablet-mobile {0%{opacity: 0;top: 35vw;}100% {opacity: 1;top: 28vw;}}
  @keyframes slide-mobile {0%{opacity: 0;right: -10vw;}100% {opacity: 1;right: 0vw;}}

  .boxinfo{
    width:43vw;
    float: right;
  }
  #box button{
    opacity: 0;
    font-size: 2.5vw;
    padding:2.5vw 2vw 2.5vw 2vw;
    float: none;
    width:43vw;
    position:absolute;
    bottom:0;
    right:0;
    margin-right:0vw;
    /*animation-name: slide-mobile;
    animation-duration: 0.5s;*/
  }

  .titles{
    margin-top:3vw;
    font-size: 10vw!important;
    text-transform: uppercase;
    color:#707070;
  }
  .borders{
    width:20vw;
    height:1vw;
  }

  #title{
    margin-top: 20vw;
  }
  #why{
    height: 579vw;
  }
  .bgcoral{
    /* clip-path: polygon(0 6vw, 100% 0, 100% 100%, 0% 100%); */
  }
  .bggray1{
    height:211.8vw;
    background-color: #f5f5f5;
    position: absolute;
    bottom:6vw;
    left:0;
    z-index: -1;
    /* clip-path: polygon(0 0, 100% 7vw, 100% 180vw, 0% 100%); */
  }
  .bggray1triangle{
    top: 355.8vw;
  }
  .bgpartnergray2{
    height: 400vw;
  }

  #who{
    height: 200vw;
  }
  .flexchild{
    width: 100%;
    margin-bottom:8vw;
    height:113vw;
  }
  .flexchild img{
    width:20%;
    margin-top: 10%;
    margin-bottom:10%;
  }
  .flexchild h1{
    font-size:6vw;
  }
  .flexchild p{
    font-size:4.5vw;
    width:70%;
  }
  .borderwhy{
    width:8vw;
    margin: 8% auto;
  }
  .buttons{
    border:2px solid #fcfcfc;
    background-color: rgba(255,255,255,0);
    color:white;
    padding:2vw 5vw;
    margin-top: 2vw;
  }
  #containerwhy{
    margin-top: 15vw;
  }

  #whoo{
    margin-top: 150vw;
  }
  #sortby p{
    width:100%;
    font-size: 4vw;
  }
  #clients{
    margin-top: 14vw;
  }
  .square{
    width:50%;
    padding-top: 50%;
  }
  .info{
    height: 100vh;
  width: 100%;
  margin-left: 0;
  left: 0;
  z-index: 1000;
  margin-top: 0;
  top: 0;
  }
  #borderinfo{
    height: 2px;
    width: 10vw;
    margin-top:2.5vw;
  }
  #containerinfo{
    width:80%;
    margin:4vw auto 0 auto;
  }
  #containerinfo img{
    margin-top: 3vw;
    height:32vw;
  }
  #containerinfo p{
    font-size:4vw;
    font-weight: normal;
  }
  #containerinfo h2{
    font-size:6vw;
  }
  #containerinfo button{
    background-color: #0096ff;
    color:#FCFCFC;
    text-decoration: none;
    border: 1px solid #0096ff;
    padding:2.3vw 2vw 2vw 2vw;
    font-size:3vw;
    width:100%;
    text-transform: uppercase;
    font-weight: bolder;
    margin-bottom: 8vw;
  }

  .buttoncross{
    height: 14vw;
    width: 14vw;
  }
  .buttoncross img {
    height: 4vw!important;
    margin-left: 5vw;
    margin-top: 5vw!important;
  }

  .buttoncross div{
    width:54px;
    height:1px;
    background-color:#0096ff;
    cursor:pointer;
    margin-top: 5vw;
    margin-left: 3vw;
  }
  .buttoncross div:first-child{
    -webkit-transform: rotate(45deg);
  }
  .buttoncross div:last-child{
    -webkit-transform: rotate(-45deg);
    margin-top:-1px;
  }

  #blog{
    margin-top: 20vw;
    height: 0/*280vw*/;
  }
  .boxchild{
    height:90vw;
    width:100%;
    font-family: 'Segoe UI';
  }
  .date{
    margin:5vw auto;
    font-size: 5vw;
  }
  .boximg{
    height:30vw;
  }
  .titleblog{
    font-size: 4vw;
  }
  .text{
    font-size: 4vw;
    height: 16.1vw;
  }
  .boxchild button{
    font-size: 4vw;
    right: 8vw;
    bottom: 4vw;
  }
  .hide{
    display: none;
  }

  #partner{
    padding-top: 1vw;
    background-color: #f5f5f5;
    margin-top: 81vw;
    padding-bottom: 7vw;
  }
  #partner button{background-color: #0096ff;width:100%;color:#fcfcfc;padding:3vw 0;}
  #partner button:hover{background-color: rgba(0,0,0,0);color:#0096ff;}
  #textfindpartners p{
    float: none;
    width:100%;
    font-size: 4vw;
  }

  #demo{
    min-height: 219vw;
    margin-bottom: 15.5vw;
  }
  .demoindex{
    margin-top: -15vw!important;
    z-index: 100;
  }

  #pt{
    height:28vw;
  }
  #containerpt {
    width: 79vw;
    height: 100%;
    margin: 0 auto 0 auto;
  }
  #social {
    float: right;
    margin-top: 0;
    text-align: left;
    padding-left: 35vw;
    width: 100vw;
    height: auto;
    margin-right: -18vw!important;
    background-color: #424242;
  }
  #social img {
    height: 8vw;
  }
  #logospt {
    width: 100%;
    margin-top: 1.5vw;
    text-align: center;
    float: left;
  }
  #co-financed-div {
    width: 100%;
    height:1.5vw;
    margin-bottom: 3vw;
    margin-left: -15.8vw;
    margin-top: 1.5vw;
    float: left;
  }
  #co-financed-div p {
    margin: 0vw;
    font-size: 3vw;
  }
  .co-financed-logos {
    margin: 0 auto;
    height: 8vw;
    float: none;
    width: 66vw;
    margin-left: -2vw;
  }
  #logospt img {
    height: 3.5vw;
    float: right;
    margin-top: 1.6vw;
    margin-right: 0.8vw;
    margin-left: 2vw;
  }


  #cookies{
    height:58vw;
    bottom:28vw;
  }
  #cookiescontainer{
    padding-top: 0.1px;
  }
  #cookiescontainer p{
    width:100%;
    font-size: 3.5vw;
    float:none;
    color:#fcfcfc;
  }
  #cookiescontainer button{
      padding: 3vw 0;
      margin: -1vw 0 0 -10vw;
      font-size: 3vw;
      float: none;
      width:20vw;
      position: relative;
      left: 50%;
  }

  .mobilelist{
    bottom: 0vw;
    width:100vw;
    right:-100vw;
    z-index: 100;
    height: 100vh;
    top: 0;
  }

  #titledemo p{
    font-size: 3.5vw;
  }
  #formbox{
    width:100%;
    height:200px;
    margin: 5vw auto;
  }
  .nome{
    /* background-color: black; */
    width:42vw;
    color:#fcfcfc;
    font-weight:300;
    font-size: 3vw;
    position: absolute;
    margin-top:5vw;
    opacity: 0.5;
  }
  #name{
      width: 100%;
      padding: 1vw 0;
      margin: 3vw 0;
      display: inline-block;
      border: 0 solid #ccc;
      border-bottom: 1px solid rgba(255,255,255,0.5);
      box-sizing: border-box;
      background-color: #0096ff;

  }

  .border-pagewhy{margin-top:20vw;border-bottom: 2px solid #fcfcfc;}

  #why-blocks{
    display: block;
  }
  .block{
    /* background-color: palegreen; */
    width:50%;
    float: left;
  }
  .block:hover{
    z-index: 100;
  }
  .block img{
  }
  .block p{
    font-size: 3vw;
  }
  .border-block{
    width:15%;
    left:50%;
    margin-left: -7.5%;
    margin-top: 10%;
  }
  .bg-pagewhy{
    height:506vw;
  }
  .bg-pagewhy-improve{
    top:-10vw;
    height: 230vw;
  }
  .border-improve{
    margin-top: 20vw;
  }
  #sec3 p{
    font-size: 4vw;
  }
  .checkmark-img{
    width:3vw;
    margin-top: 1.3vw;
  }
  .textbox{
    width:100%;
    float: none;
  }
  .textbox-title h1{
    font-size: 4vw;
    margin-left: 4vw;
    width: 90%;
  }

  .modernize-textbox{
    height:auto;
    margin-top: 10vw;
    /* background-color: blue; */
  }

  .reduce-textbox{
    height: auto;
  margin-top: 0;
  }
  .textbox-title-reduce h1{
    font-size: 4vw;
    margin-left: 5vw;
  }

  .control-textbox{
    /* background-color: lavender; */
    height:auto;
    padding-top: 25vw;
  }
  .textbox-textpart-reduce{
    margin-top: 15vw;
    margin-bottom: 10vw;
  }
  .textbox-textpart-control{
    margin-top: 15vw;
  }
  .textbox-textpart-modernize{
    margin-top: 15vw!important;
  }

  .bg-pagewhy-start{
    height:85vw;
    /* clip-path: polygon(0 0, 100% 0, 100% 75vw, 0% 100%); */

  }
  .bg-pagewhy-start-highlight{
    height:50vw;
    top:15vw;
    /* clip-path: polygon(0 25vw, 100% 0, 100% 40vw, 0 100%); */

  }
  #sec3{
    padding-bottom: 8vw;
  }






}
@media only screen and (max-width: 335px  /*SMARTPHONE MINOR*/ ) {
  #containerstart {
    top: 36vh;
  }
}

/*** TRANSITIONS ***/
.imput p .countrycode{top:0!important;}

.logosquare-slide{opacity:1;right: 0vw!important;}
.logosquare-slide-ie{opacity:1;right: -10vw!important;}

.slidebar{right:0vw;}
.listcontainer-active{display: block;}
.menu-show{opacity: 1!important;top:0vw !important;}
.menuhamburger-show{top:0vw !important;}
.demo-opacity{opacity:0.2;}