/* poppins-100 - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/poppins-v15-latin-100.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/poppins-v15-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/poppins-v15-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/poppins-v15-latin-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/poppins-v15-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/poppins-v15-latin-100.svg#Poppins') format('svg'); /* Legacy iOS */
}

/* poppins-200 - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/poppins-v15-latin-200.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/poppins-v15-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/poppins-v15-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/poppins-v15-latin-200.woff') format('woff'), /* Modern Browsers */
       url('../fonts/poppins-v15-latin-200.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/poppins-v15-latin-200.svg#Poppins') format('svg'); /* Legacy iOS */
}

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

/*GENERAL*/
.center-v{display:flex; align-items: center;}
.lowercase,.lowercase h3{text-transform: none;}
img,picture{-webkit-transition: all 400ms ease-in-out;    transition: all 400ms ease-in-out;}
p {    font-family: 'Poppins', sans-serif;    font-weight: 200;    color: #333;}
p strong{font-weight:bold;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {    color: #333;    text-transform: uppercase;}
h1, .h1 {
    font-size: 21px;
    line-height: 60px;
    text-underline-position: under;
    text-decoration: underline 1px;
    letter-spacing: 3px;
	font-weight: 400;
}
h2 {    font-size: 22px;    letter-spacing: 0.3rem;    line-height: normal;}
.botgris{background-color: #666; border-radius: 0;    height: 58px;}
.btnipd{color: var(--primary);
    border: 1px solid var(--primary);
    padding: 8px 35px;
    text-transform: uppercase;
    font-size: 18px;
    background: transparent;
    display: block;
    font-weight: 300;
-webkit-transition: all 400ms ease-in-out;    transition: all 400ms ease-in-out;
}
.btn:hover {
    background-color: #ddd;
    color: #333;
    border-color: #ddd;
}
.btnmap{padding:0;}
.btnmap:hover{background-color: transparent;color:#000;}

.table thead th {font-weight:bold;}
.nopadding{padding:0;}
.logoarea{ display:flex;   justify-content: center;    width: 100%;}
.padding-on-scroll {     padding-bottom: 5px;}
.navbar-brand {	height: 120px;}
.navbar-collapse {    justify-content: center; }
.nav-link {    text-transform: uppercase;    font-size: 11px;}
.main-navigation ul li.nav-item {    margin:0;}
.cbp-af-header.cbp-af-header-shrink .nav-item {    margin: 0;}
.main-navigation ul li.nav-item:after{content:"|";    margin-left: 10px;    margin-right: 10px;}
.main-navigation ul li.nav-item:last-child:after{display:none;}
.margin-principal {	margin-top: 191px;}
#topbar .idiomes {    margin-top: 13px;}
ul.idiomes li{font-size:12px;}
ul.idiomes li::after {    content: "|"!important;    margin: 0 2px 0 8px !important;}
ul.idiomes li:last-child:after {display:none; }
/*HOME*/
#index .margin-principal{margin-bottom:0;}
#sliderhome .bgroundTarget{
    /*background-color: red;*/
    height: 100%;
    width: 100%;
    display: block;
    position: absolute;
    top: 0;
}
#sliderhome .bground{    width: 100%;    height: 100%;}
#sliderhome .caption{width:100%;}
#sliderhome{    margin-bottom: 0px;}
#Sliders-owl .owl-dots {	bottom: 5px;}
#sliderhome .owl-carousel .owl-nav button{border:none!important;}
#sliderhome .owl-carousel .owl-nav button span {    color: #fff !important;}
#sliderhome .owl-carousel .owl-nav button:hover {    background-color: rgba(255,255,255,0.4) !important;}
#sliderhome .owl-carousel.owl-drag .owl-item {    padding-bottom: 0;}
#sliderhome .owl-carousel .owl-item img.modulimatge {    margin-bottom: 0!important;}
#sliderhome #contentslider h1,#sliderhome #contentslider h2,#sliderhome #contentslider h3,#sliderhome #contentslider h4,#sliderhome #contentslider h5{    font-weight: 100;    color: #333; text-transform: none;
   font-size: min(max(16px, 2.2vw), 60px);
line-height: min(max(16px, 2.2vw), 60px);
letter-spacing: 0.2rem;}
#Sliders-owl .portfolio-thumb {    width: 100%;}
#Sliders-owl {    margin-bottom: 0;    padding: 0 8px;}
#contentslider .caption .btn{  color: #fff;
    border: 1px solid #fff;
    padding: 8px 35px;
    text-transform: uppercase;
    font-size: 26px;
    background: transparent;margin-top:15px;border-radius:0;}
#Sliders-owl .row .item div{    margin-left: 0!important;    margin-right: 0!important; padding:0!important;}
#blocressenyes .owl-dots {
    width: 200px;
    left: 0;
    right: 0;
    position: absolute;
    bottom: -35px;
    margin: 0 auto;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}
.destacados{margin-top:10px;}
#contentslider .bloque{padding:0!important;}
.caption h1,.caption h2,.caption h3,.caption h4,.caption h5,.caption h6{font-family: 'Poppins', sans-serif; text-align:center;line-height: normal; display:block; top:inherit;color:#fff; font-weight: 300;}
.infohome h1{text-transform: uppercase;}
.infohome p{    font-size: 20px;}
.infohome img{max-width:250px; margin-bottom:50px;}
#index #portfolio,#index #portfolio .bloque {padding:0;}
#index #portfolio .main-content-wrap{margin-top:0!important;}
#portfolio article picture,#portfoliohome article img{}
#portfolio article{padding:0 7px; margin-bottom:14px;}
#portfolio article .portfolio-wrap-1 {	border-radius: 0px;}
#portfolio article .btn-portfolio-icon {	border: 4px solid #fff;    background-color: transparent;    color: #fff;    font-weight: bold;
    font-size: 40px!important;    font-family: sans-serif;    width: 48px;    height: 48px;}
#portfolio article .wrap-mask{background-color: #3C81E1; /*mix-blend-mode: multiply;*/}
#portfolio .vermas{padding:0 36px}
#portfolio .btn-black {  background-color: #ddd; border-radius:0;color: #333;    text-transform: uppercase;}
#portfolio .btn-black:hover{ background-color: #000; color:#fff;}
/*#destacats picture,#destacats img{aspect-ratio:1/1;object-fit:cover; margin-bottom:0;}
#destacats .portfolio-wrap-1{border-radius: 0;}*/
.fondogris {	background-color: #F6F6F6;padding:0;}
.fondogris li{list-style:none;    color: #333; display:flex;}
.fondogris li:before{content:"·";    position: absolute;    left: -0px;    margin-top: -5px;    font-size: 30px;}

.destacado ul{padding:0;}
.destacado h3{    font-weight: 100;    font-size: 2vw;     line-height: 2.2vw;   padding: 0 0 0 0;}
.destacado img{width:100%;}
.imagelink{transition: all 400ms ease-in-out;opacity:1;}
.imagelink:hover{opacity:0.8;}
#bannershome{margin-top:30px;}
#bannershome .flip-card-front img{width: 80%;    max-width: 100%;}
#bannershome .flip-card-back img{    max-width: 40px;    margin-top: 15px;}
#bannershome .green h2 a{color:#cce3cd}
#bannershome .blue h2 a{color:#7098dc}
#bannershome .yellow h2 a{color:#dcbe35;}
#bannershome .red h2 a{color:#ed5e88}
#bannershome h2{     font-size: 15px;    line-height: normal;    text-transform: uppercase;    font-weight: bold;    color: #111;    margin: 0; letter-spacing: 0;}
 /* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
  background-color: transparent;
  width: 100%;
  height: 250px;
  border: none;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {     background-color: #fff;    padding: 15px;    display: flex;    justify-content: center;    align-items: center;  }

/* Style the back side */
.flip-card-back {  color: #000;  transform: rotateY(180deg);padding: 20px 15px 15px;} 
.flip-card-back p {    color: #000;    text-align: center;    line-height: 20px;    margin-bottom: 0;    margin-top: 10px;}
.flip-card-back .plus{text-align: center;width: 70px;    display: block;    margin: 0 auto;}
/*.flip-card-back p:after{content:url(https://otidisseny.pixup.cat/media/images/home/plus-01.svg);    width: 70px;    display: block;    margin: 0 auto;}*/
.green .flip-card-back {background-color:#99CC66}
.blue .flip-card-back {background-color:#6699ff}
.yellow .flip-card-back {background-color:#ffcc33}
.red .flip-card-back {background-color:#ff6666}
#clienteshome{margin-top:0px;}
#clienteshome .container{padding:0 37px;}
#clienteshome .foto{padding:0;}
#clienteshome p{font-size: 20px;}
#clienteshome .text{padding: 15px 40px;}
#clienteshome .btn {    text-transform: uppercase;    border: 1px solid #111;    font-size: 20px;    font-weight: 300;    padding: 5px 60px;    height: auto;}
#clienteshome .btn:hover{ background-color: #000; color:#fff;}
#blocressenyes{padding:40px 0;margin: 40px 0;}
#blocressenyes h2{margin-bottom:0px;}
#blocressenyes img{margin:15px 0 10px;}
.owl-carousel{    display: flex!important;    align-items: center;}
.owl-carousel .owl-nav {
    position: absolute;
    z-index: 1000;
    width: 100%;
    height: 50px;    pointer-events: none;
}
.owl-carousel .owl-nav button{border:none!important;    background-color: transparent!important; outline:none;    pointer-events: all;}
.owl-carousel .owl-nav button span {    color: #666 !important;font-size:0;}
.owl-carousel .owl-nav button:hover span{    color: #333 !important;}
.owl-carousel .owl-nav button.owl-next span:after{    font-family: 'FontAwesome';    content: '\f105';font-size:30px;}
.owl-carousel .owl-nav button.owl-prev span:after{    font-family: 'FontAwesome';    content: '\f104';font-size:30px;}
.owl-nav .owl-prev {    left: 40px;}
.owl-nav .owl-next {    right: 40px;}
#Ressenyes-owl .owl-item{padding:0 15px;}
.ressenyes{       padding: 0px 10vw;    text-align: center;}
.ressenyes p{margin:0;}
.ressenyes hr{    width: 30%;}
.ressenyes .carrec p{    color: #888;    font-size: 14px;}

#clients .clients ul{    display: flex;    flex-wrap: wrap;}
#clients .clients ul li{        list-style: none;    margin: 0;    font-weight: 300;    color: #333;}
#clients .clients ul li:after{content:"·"; margin-left: 5px;margin-right: 5px;}

#quenecesitas{padding:40px 15px 80px;}
#quenecesitas .contactbutton {
    font-size: 22px; text-transform: uppercase;
    letter-spacing: 0.3rem;    padding-top: 100px;
    padding-bottom: 50px;
}
#quenecesitas .contactbutton:hover{background-color: rgba(255,255,255,0.2); color:#666;}
.iconcontact{position:absolute!important;}

#simpleForm input,#simpleForm textarea{border-radius:0;    width: 100%;    border: 1px solid #888;    padding: 15px;}
#simpleForm textarea{min-height: 120px;}
#simpleForm label:not(.checkbox-inline){display:none;}

#simpleForm .form-input-item{margin-bottom:25px;}
#simpleForm input[type=checkbox]{width:auto!important;    margin-right: 10px;    margin-top: 5px;}
#simpleForm label.checkbox-inline{display:flex; flex-wrap:wrap;    font-size: 14px;}
#simpleForm .legal{margin-top:25px;}

#contacte h4 {
    font-weight: 300;
    color: #333;
    font-size: 22px;
    letter-spacing: 0.3rem;
}
#contacte .cinfo p{text-align:left; /*padding-left:40px;*/}

/*
#contacte .cinfo p:before{  
    font-family: FontAwesome;
    color: #666;
    margin-left: -40px;
    font-size: 40px;
    position: absolute;
    top: 0;
    line-height: 40px;}
*/
#contacte .cinfo.ubicacio p{margin-bottom:0;}
#contacte .cinfo img{margin-top:-10px;}
/*
#contacte .cinfo.ubicacio p:before{    content: "\f041";}
#contacte .cinfo.telefon p:before{    content: "\f10b ";}
#contacte .cinfo.mail p:before{    content: "\f003 ";font-size: 30px;}
*/
#contacte a{color:#333;}
#contacte a:hover{color:#666;}
#contacte button.btn-black{background-color: #888;font-weight:200; width: 70%;float: right;}
#contacte button.btn-black:hover{background-color: #000; color:#fff;}
#contacte .cinfo .social{float: right;display: flex;flex-wrap: wrap;padding: 0;max-width: 288px;width: 100%;justify-content: space-between;margin-top: -60px;}
#contacte .cinfo .social li{list-style: none;margin: 0 5px;font-size: 30px;}
#contacte .cinfo .social li a{color: #888;}
#contacte .cinfo .social li a:hover{color: #000;}

/*PORTFOLIO FITXA*/
#fitxa .video{margin-top: 30px;}
#fitxa{text-align:center;}
#fitxa h1,#clientes h1{       font-weight: 300;    color: #333;    font-size: 22px;    letter-spacing: 0.3rem;}
#fitxa .descripcio,#fitxa .descripcio p{    font-size: 20px;font-weight: 200;color: #333;}
	#fitxa .btn.btn-brand{margin-top:15px;}
	#fitxa .btn.btn-brand:hover{background-color: transparent!important; color:#666!important; }
#galeria article{margin-top: 30px;  flex: 0 0 50%;    max-width: 50%;}
#galeria article:nth-child(1) {    flex: 0 0 100%;    max-width: 100%;}
#galeria article:nth-child(3n+1) {    flex: 0 0 100%;    max-width: 100%;}
#galeria article img{width:100%;}
#portfolio .wrap-mask-black{pointer-events: none;}
#portfolio .link{font-weight:300; color:#333;}
#portfolio .link.active{ color:#333; }
#portfolio .link::after {   bottom: -5px;      background: var(--dark-blue);    height: 1px;top: inherit; top:inherit;}
.filter-sorting{display: flex;    flex-wrap: wrap;    justify-content: center;}

/*PORTFOLIO FITXA*/
/*CLIENTS DESTACATS-*/
.mod2{margin-bottom:40px;}
.mod2 .btn.btn-brand{text-transform: uppercase;
border: 1px solid #111;
font-size: 20px;
font-weight: 300;
padding: 5px 60px;
height: auto;}
.mod2 .title{margin-top:15px;}
#clientdestacat h1{font-size: 24px;letter-spacing: 0.3rem;color: var(--primary);margin:25px auto 25px;    line-height: 26px;}
#clientes article,#clientes .galeria{padding:0;}
article .btn-portfolio-icon {
    border: 4px solid #fff;
    background-color: transparent;
    color: #fff;
    font-weight: bold;
    font-size: 40px !important;
    font-family: sans-serif;
    width: 48px;
    height: 48px;
}
article .wrap-mask {
    background-color: #3C81E1;
    mix-blend-mode: multiply;
}
article .btn-portfolio-icon:hover {
    
    background-color: transparent; color:#fff;
   
}
/*FI CLIENTS DESTACATS-*/
/*EMPRESA*/
.row.fullwidth .head img{width:100%;}
.textempresa{}
#soluciones h2{padding:40px 0;}
#soluciones img{width:100%}
#soluciones .caption-solution{position:absolute;    padding: 35% 0;}
#soluciones .caption-solution h3{font-size: 24px;}
#soluciones .solucion{    -ms-flex: 0 0 20%;    flex: 0 0 20%;    max-width: 20%;}
#soluciones .solucion p{font-size:12px;font-weight: 400; text-align:left;padding-left: 15px;}
#staff{margin-bottom:60px;}
#staff .int-staff{border:1px solid #333;    margin-top: 80px;    padding-bottom: 30px;}
#staff .titolstaff{}
#staff .titolstaff:after{content:"\e82d";    font-family: "unicons";
    content: "\e82d";
    font-family: "unicons";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: table;
    margin: -25px auto 0;
    color: #333;
    font-size: 45px;
    text-decoration: inherit;
    text-align: center;
    /* opacity: .8; */
    font-variant: normal;
    text-transform: none;
    /* font-size: 120%; */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* text-shadow: 1px 1px 1px rgb(127 127 127 / 30%); */

}


#staff h2{    margin-top: -34px;    background: #fff;    display: table;    padding: 0 25px;    font-weight: lighter;}
#staff h3{     font-size: 20px;    font-weight: 400;    margin: 0;    line-height: normal;}
#staff p{     font-size: 14px;}
#staff .icontext .feature-icon img{max-width:50px;}
.footerempresa div{padding:0 1px;}
/*FI EMPRESA*/
/*FOOTER*/
.prefooterleft{text-align: center}
.post-footer{border-top:1px solid #fff;    padding-top: 10px;}

#footer.bg-dark {
    background-color:var(--primary)!important;
}
#footer{margin-top: 0;background: #eee;border-top: 1px solid #ccc;padding: 25px 0; color:#333;}
#footer .logo img{max-width: 220px;}
#footer h2,#footer h3,#footer h4{color:#fff;font-size:20px;}
.socket{background-color: #666; text-align: left;}
.socket p{padding:15px; margin:0;}
footer li{list-style:none;}
footer ul{margin:0;justify-content: flex-end;}
footer p a{color:#333!important; font-weight: 300;}
footer a:hover{color:#888;}
footer .social i{font-size:16px;}
footer .social li{padding:15px 0px;}
#footer .navbar-nav{flex-direction: row;justify-content: center;}
#footer .navbar-nav li {margin: 0;}
#footer .navbar-nav li:after{    content: "|";    margin-left: 10px;    margin-right: 10px;}
#footer .navbar-nav li:last-child:after{display:none;}
#footer .navbar-nav li a{color:#333;}
#footer p{color:#333; font-size:12px;}
#footer .col-right{display: flex;justify-content: center;align-items: end;}
#footer .social a {
    color: #fff;
    margin: 0 3px;
    background: #111;
    padding: 5px;
    width: 30px;
    height: 30px;
    display: block;
    text-align: center;
    border-radius: 50%;
    line-height: 22px;
}
.progress-wrap::after,.progress-wrap::before {    font-family: 'FontAwesome';	content: '\f106';line-height: 40px;}
.whatsappPop{    position: fixed;    bottom: 17px;    z-index: 10000;    right: 100px;    border-radius: 50%;    width: 43px;
    height: 43px;    background: #eee;}
.whatsappPop a{ color:#333}
.whatsappPop i{font-size:50px;color:#333;}
/*FI FOOTER*/
.fancybox-image, .fancybox-spaceball,.fancybox-image-wrap {
   /* width: 350px!important;
    height: 350px!important;*/
}

.progress-wrap {    bottom: 100px;}











/* ********************** RESPONSIVE ********************** */
@media (max-width: 1199px){
.margin-principal {    margin-top: 0;}
}
@media (max-width: 1024px){
.destacado h3 {    font-weight: 100;    font-size: 3vw;    padding: 0 3vw 0 0;}
#soluciones .caption-solution h3 {    font-size: 18px;}
}
@media (max-width: 991px){
	p {    margin-bottom: 15px;}
	.main-navigation .navbar-toggler{position: absolute;    top: -75px;}
	.margin-principal {    margin-top: 0;}
	.infohome p {    font-size: 16px;}
	#clienteshome p {    font-size: 14px;    line-height: normal;}
	#clienteshome .btn {		font-size: 16px;}
	#clienteshome .separador{display:none;}
	#bannershome .container{max-width: 100%;}
	#Ressenyes-owl .img-fluid{max-width: 100px; margin:15px auto 10px;}
	#galeria article:nth-child(3n+1) img{width:100%;}
	#galeria article {    margin-top: 14px;    padding: 0 7px;}
	#soluciones .caption-solution h3 {    font-size: 16px;}
	#soluciones .caption-solution {    padding: 27% 0;}
	#contacte .social{margin-top:0;margin: 0 auto;float: none;}
	#simpleForm{margin-bottom: 25px!important;}
	
}
@media (max-width: 768px){
	#sliderhome #contentslider h2{font-size: min(max(22px, 2.2vw), 60px);    line-height: min(max(22px, 2.2vw), 60px);}
}
@media (max-width: 767px){
	h2 {    font-size: 18px;    line-height: normal;    letter-spacing: 0.2rem;}
	.container {    max-width: 100%;}
	#sliderhome > .bloque{padding:0;}
	#sliderhome {    margin-bottom: 15px;}
	#bannershome h2 {		font-size: 13px;}
	.flip-card-back p {    line-height: normal;      font-size: 12px;}
	footer ul.idiomes,footer ul.social{padding:0;}
	#Sliders-owl .caption h2 {    font-size: min(max(16px, 3.8vw), 60px)!important;line-height: min(max(16px, 3.8vw), 60px)!important;}
	.owl-dots{display:none!important;}
	#soluciones .solucion {    -ms-flex: 0 0 30%;    flex: 0 0 30%;    max-width: 30%;}
	.destacado h3 {    font-weight: 100;    font-size: 3vw!important;    line-height: 3vw!important;    padding: 0 3vw 0 0;}
	#soluciones .caption-solution h3 {    font-size: 18px;}
	#soluciones .caption-solution {    padding: 33% 0;}
	.destacado h3 {      font-size: 2.5vw!important;  padding: 0 3vw 0 3vw;}
	#clientdestacat .margin-principal{padding:0 15px;}
}
@media (max-width: 540px){
	.ubicacio{margin-top:30px;}
	#simpleForm textarea {    min-height: 120px;    font-size: 16px;}
	p {	font-weight: 300;}
	#contentslider, #contentslider div{padding:0;}
	#sliderhome {    margin-bottom: 0px;}
	#sliderhomeMobile{margin-left: 0px!important;		margin-right: 0px!important;display:block!important;}
	#sliderhomeMobile > .bloque{/*padding:0; margin:0;*/}
	#sliderhomeMobile div{padding: 0; margin:0;}
	#sliderhomeMobile .caption {    position: relative;    width: auto;    display: block; margin-top: 15px; }
	#sliderhomeMobile .sliderbanner .caption{order:1}
	#sliderhomeMobile .sliderbanner .portfolio-thumb{order:0;width: 100%;}
	#sliderhomeMobile figure {    margin: 0;}
	#sliderhomeMobile .bground{z-index: -20;position: absolute;height: 100%;width: calc(100% + 3px);top: 0;}
	#sliderhomeMobile h2{margin-bottom:10px;}
	.navbar-brand {    height: 80px;}
	h2 {    font-size: 18px;    line-height: 26px;    letter-spacing: 0.1rem;}
	.navbar-brand img {		max-height: 80px;}
	.padding-on-scroll {    padding: 0;}
	.logoarea {max-height: 80px;}
	.main-navigation .navbar-toggler {    top: -50px;}
	.main-navigation ul li.nav-item:after {    content: ""; margin:0;}
	.nav-item {		padding: 5px 0;font-size: 12px;    font-weight: bold!important;}
	
	#index .margin-principal {      margin-top: 0;}
	.infohome .separador > div{margin-top:15px!important;}
	#quenecesitas {    padding: 40px 0px 80px;}
	#quenecesitas div{padding-left:0; padding-right: 0;}
	
	
#productosdestacados .item {    flex: 0 0 50%!important;    max-width: 50%!important;}
	#productosdestacados .portfolio-thumb img {    padding: 0px;}
	#clienteshome {    margin-top: 0px;    padding: 0 15px;}
	#clienteshome .order0{order:0;}
	#clienteshome .order1{order:1;}
	#clienteshome .order2{order:2;}
	#clienteshome .order3{order:3;}
	#clienteshome .order4{order:4;}
	#clienteshome .order5{order:5;}
	footer .col-left{display:none;}
	.whatsappPop { bottom: 20px;    right: 70px;}
	#portfolio .link {    font-size: 16px;    margin-bottom: 10px;}
	#portfolio .main-content-wrap{margin-top: 0!important;}
	#portfolio > .bloque{padding:0;}
	#fitxa .descripcio, #fitxa .descripcio p {		font-size: 16px;}
	#fitxa h1, #clientes h1,#contacte h4 {    font-size: 22px;		line-height: 26px;    letter-spacing: 0.1rem;}
	#soluciones .caption-solution {    padding: 30% 0;}
	#soluciones .caption-solution h3 {    font-size: 14px;    font-weight: bold;}
	#soluciones .solucion{padding:0;}
	#soluciones .solucion > .row{justify-content: center;}
	#empresa .destacado ul {    padding: 0;    margin-bottom: 0;}
	#empresa .destacado ul li h3{margin:0;}
	#empresa .destacado .center-v {    padding: 0 30px;}
	#galeria article{margin-top: 30px;  flex: 0 0 100%!important;    max-width: 100%!important;}
	.destacado{padding:15px 0;}
	.destacado h3 { font-weight: 300;   font-size: 5vw!important;    line-height: 6vw!important;    padding: 0 3vw 0 3vw;}
	.fondogris .lowercase{display:flex;}
	.fondogris li:before {
		position:relative;
    content: "·";
    left: 5px;
    margin-top: -14px;
    font-size: 30px;    height: 20px;
}
	.destacado li{margin-bottom:5px;} 
	.destacado2 h3 {font-size:5vw!important; line-height: 6vw!important; text-align:center;} 
	.destacado2{padding:15px 0 0 0;}
	.destacado1 .center-v .row{    display: block;    width: 100%;}
	.destacado1 ul {     margin: 0 auto; text-align:center;}
	#contacte button.btn-black {    float: none;}
	
}