@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700;900&display=swap');
:root { 
    --bs-primary-rgb: 172, 10, 59; /* variable de BS5 */
    --bs-primary: #ac0a3b; /* variable de BS5 */
    --bs-primary-hover: #940731; /* variable de Ladeus pels hovers buttons*/
}

html, body { height: 100%;  }
body{ font-family: 'Inter', sans-serif ; color: #111111; font-size: 1rem; line-height: 30px;}

/********** Bootstrap, tema propio ********/

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { }
h1, .h1 {  font-size: 3 rem; line-height: 3.6rem; letter-spacing: -0.05rem; font-weight: 900;}
h2, .h2 { font-size:  2rem; letter-spacing: -0.05rem; font-weight: 900;}
h3, .h3 { font-weight: 700;  }
h4, .h4 { font-weight: 700;  }
h5, .h5 { font-weight: 700;  }

.eagr-header-title { font-weight: 400; font-size: 1.8rem!important;}

a { color: #000000; text-decoration: none; }
a:hover, a:focus { color: #444444; }

.m-b-sm { margin-bottom: 20px; }
.m-b-lg { margin-bottom: 40px; }
.m-t-lg { margin-top: 40px; }
.btn-padding{ padding: 12px 20px; }
.nav-pills > li > a{ border-radius: 0; }
.text-bold, .text-strong{ font-weight: 600; }

.custom-checkbox label { font-weight: normal; }
.checkbox label a, .custom-checkbox label a { text-decoration: underline; }
/********** FIN tema propio Bootstrap  ********/

/********** Arreglos genéricos, mejor no tocar ********/

.fw-300 { font-weight: 300;}

strong { font-weight: 900; font-weight: bolder; }
a:hover i { text-decoration: none; }

.relative { position: relative; }
.blank { padding: 0 20px 20px; color: #999; } /* Estilo para la página en blanco */
.click_a { cursor: pointer; }
.delay2 { -vendor-animation-delay: 2s; }

.text-lg { font-size: 120%; }
.text-justify { text-align: justify; }
.text-center img, .text-center .img { margin: 0 auto; }

p img { max-width: 100%; }
p img.pull-right { margin-left: 30px; }
p img.pull-left { margin-right: 30px; }

.btn i.pull-left { margin-right: 10px; margin-top: 3px; }
.btn-disabled { cursor: auto;}

/* css dels Tinys */
.linkupload { padding: 2px 5px 0px 50px; color: #454545; }
.link-pdf { background: url(../images/ico/ico-pdf-red.png) no-repeat left 2px; }
.link-docx { background: url(../images/ico/ico-word.png) no-repeat left 2px; }

/* Equal Flex */
.row-eq-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 20px; }
.row-eq-height .card { height: 100%; margin-bottom: 0; }

.aligner {
        display: flex;           /* establish flex container */
        flex-direction: column;  /* make main axis vertical */
        justify-content: center; /* center items vertically, in this case */
        align-items: center;     /* center items horizontally, in this case */
}
.overlay-black { background-color: rgba(0,0,0,0.5) }

.wrap-img-cover-object { position: relative; width: 100%; height: 550px; }
.wrap-img-cover-object img { width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover; object-position: 50% 50%;'; object-position: 50% 50%; transition: all 0.5s; }
/********** Hasta aquí arreglos genéricos ********/

/* Layout */ 

/* BS 5 */ 
.dropdown-item.active, .dropdown-item:active {   background-color: #111;}


/* Generals */
.container-continguts { padding: 0px 70px; }
.btn { border-radius: 0}
/*.btn:hover { color: #656d75!important;}*/
.btn-default {color: #444; border-radius: 0px; padding: 1rem 1.8rem; text-transform: uppercase; letter-spacing: 1px; font-size: 0.75rem; transition: all 0.2s; margin-top: 15px; border-color: #ddd; }
.btn-default:hover {border-color: #000000; background-color: #fff; color: #000000!important }
.btn-default.btn-inverse {color: #ccc; background: #000; font-weight: 500; margin-bottom: 30px; font-size:14px }
.btn-default.btn-inverse:hover {color: #333; background: #fff;}
.page-header { margin-top: 200px; border-bottom: 0; }
.page main {margin-bottom: 30px;}
.ls-1 {letter-spacing: 0.7px;}
/* Modal */
#modaldinamico h1{ font-size: 32px; line-height: 32px; margin-top: 0; }
.modal .page-header { margin-top: 30px; }

/*#wrap-contenido{ padding: 20px; background-color: white; margin-top: -20px; position: relative; z-index: 1;  }*/
.page-header .h4 {font-weight: 300;}
.page-header .h4 strong { font-weight: 400;}
.bg-corporatiu {background-color: #ac0a3a}

.fa-ul li { margin: 1rem;}

/* Header */
#header {  }
#menu-top{ border-radius: 0; }


/* Menú principal */
#wrap-menu-principal { transition: 0.4s all }
#wrap-menu-principal .navbar-brand { height: auto; padding: 20px 10px 0 0; }
#wrap-menu-principal .navbar-brand img { max-height: 74px; transition: 0.2s all }
/* .scroll-down #wrap-menu-principal .navbar-brand img { max-height: 50px;}*/

#offcanvasNavbar a { color: #000000; transition: all 0.1s!important; padding: 1.1rem; }
#offcanvasNavbar li > a:hover { background-color: #f8f9fa; transition: all 0.1s;  }
#offcanvasNavbar li.active > a, #offcanvasNavbar li > a:active { color: #000000; background-color: #f8f9fa; }
#offcanvasNavbar .languages.dropdown-menu a {padding: 0.5rem 1.1rem; }
#offcanvasNavbar .languages.dropdown-menu span { }

.navbar-toggle { background-color: #FFF; }
.navbar-toggle .icon-bar { background-color: #000; }


.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover{ background-color: #222222; }
.submenu-projectes .active {font-weight: 600}

/* Home */
.home .page-header { margin-bottom: 100px; }
.home .body-content { width: 70%; margin-bottom: 60px; }

#carousel-home .wrap-img-cover-object { height: 550px; }
#carousel-home .carousel-caption { background-color: rgba(0,0,0,0.6); left: 0; right: 0; bottom: 0; padding-bottom: 50px; }
#carousel-home .carousel-title { margin-top: 0; }
#carousel-home .carousel-indicators { bottom: 0; }

.carousel-fade .carousel-inner .item { opacity: 0; transition-property: opacity; }
.carousel-fade .carousel-inner .active { opacity: 1; }
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right { left: 0; opacity: 0; z-index: 1; }
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right { opacity: 1; }
.carousel-fade .carousel-control { z-index: 2; }

.card { border-radius: 0; transition: all 0.5s ; position: relative; border: 0; }
.card-img .card-title { padding: 15px; position: absolute; bottom: 0; left: 0; right: 0; }
.card.click_a { overflow: hidden; }
/*.card.click_a:hover .card-img img{ transform:scale(1.1); -ms-transform:scale(1.1);  -moz-transform:scale(1.1); -webkit-transform:scale(1.1); }*/
.thumbnail { border-radius: 0; }
[class*=" imghvr-"], [class^="imghvr-"] { display: block; }
[class^='imghvr-'],[class*=' imghvr-'] { background: #FFF;  }
[class*=" imghvr-"] figcaption, [class^="imghvr-"] figcaption{ 
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+71&0+0,0.65+71 */
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 71%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 71%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 71%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */

     }
[class*=" imghvr-"] figcaption > *, [class^="imghvr-"] figcaption > * { position: absolute; bottom: 30px; left: 50px; right: 50px; }
[class*=" imghvr-"].card a,[class^="imghvr-"].card a{ position: relative; color: #FFF }
[class*=" imghvr-"].card,[class^="imghvr-"].card{ margin-bottom: 5px; }


.card.animated  h2.wrap-animated{
  animation-duration: 0.5s;
  /*animation-delay: 1s;*/
}



/* INTERIORES */
.minimalpadding > [class*='col'],
.minimalpadding > [class*='col-sm'],
.minimalpadding > [class*='col-md'],
.minimalpadding > [class*='col-lg'],
.minimalpadding > [class*='col-xlg'],
.minimalpadding > [class*='col-fhd']  { padding-left: 2px; padding-right: 2px; }

/* Page */
.page.clients #galeria {background: #fff;}
/* List */
.navbar.navbar-default {background: #ededed; border: 0; border-radius: 0; margin-bottom: 4px;}
.items .navbar-nav > li > a {line-height: 80px; padding: 0px 25px; text-transform: uppercase; color: #000000 }
.items .navbar-nav > li.active > a { color: #111111; }
article.servei .icona-serveis { color: #ccc;}


/* Single */
.item { margin-top: 100px; }
.item .img-principal .wrap-img-cover-object {height: calc(100vh - 220px)!important; }
.item .wrap-descripcio {margin: 70px 0; }
.item .wrap-descripcio .mockup {margin: 0px 0px; }
.item .wrap-descripcio h2 { font-weight: 300;  font-size: 50px; line-height: 60px; letter-spacing: -1px; }
.item .wrap-descripcio .description-image  {margin: 50px 0; }
.item .peu-foto  { color: #999999; margin: 10px 0; text-align: left; }
#galeria {background: #222; padding: 40px 50px }
#galeria .padding-imatges { padding: 20px }
#galeria .padding-imatges .img-responsive { width: 100%; height:auto;}

.item .nav-next-prev { background-color: #ededed; font-size: 14px }
.item .nav-next-prev a {padding: 0 40px;  line-height: 80px; display: block; text-transform: uppercase; letter-spacing: 2px; }
.item .nav-next-prev img { margin: 0 15px 0 15px;  transition: 0.2s all; }
.item .nav-next-prev .prev a:hover img { margin: 0 30px 0 0; }
.item .nav-next-prev .next a:hover img { margin: 0 0 0 30px; }

#nav-item .row-categoria {border-top: 1px solid #333; letter-spacing: 0.5px; font-size: 0.8rem;  padding-top: 10px; background: #222;}
#nav-item .row-categoria a {color: #999; line-height: 40px; padding: 15px 0; }

.logos-landing img { max-height: 70px; max-width: 150px;}

/* Equip */
#team .team-player  { position: relative;}
#team .team-player .wrap-img {height: 378px; overflow: hidden; position: relative;}
#team .team-player .caption {color: #fff; font-weight: bold; line-height: 16px; background: #000; padding: 25px 10px 0; min-height: 80px; bottom:0; left: 0; right:0; position:absolute;}
#team .team-player .caption small {color: #999; font-weight: normal }
#team .team-player .caption a {color: #ccc;}
#team .team-player .caption a:hover {color: #fff;}
#team .team-player .foto img:last-child{display:none;}
#team .team-player:hover .foto img:first-child{display:none;}
#team .team-player:hover .foto img:last-child{display:inline-block;}

#team-mobile .team-player .foto img:last-child{display:none;}
#team-mobile .team-player:hover .foto img:first-child{display:none;}
#team-mobile .team-player:hover .foto img:last-child{display:inline-block;}

#arguments-equip {background: #000; color: #fff; padding: 250px 10px 250px; margin: -182px 0 0 0;}
#arguments-equip article { margin: 0 20px;}

/* Contact */

/* Share */
#share_zone > div { float: left; margin-left: 5px; margin-right: 5px; }
.wa_btn { background-image: url('../images/ico/whatsapp-button.svg'); border: 1px solid rgba(0, 0, 0, 0.1); display: inline-block !important; position: relative; font-family: Arial, sans-serif; letter-spacing: .4px; cursor: pointer; font-weight: 400; text-transform: none; color: #fff; border-radius: 2px; background-color: #5cbe4a; background-repeat: no-repeat; line-height: 1.2; text-decoration: none; text-align: left; }
.wa_btn_s { font-size: 12px; background-size: 16px; background-position: 5px 2px; padding: 3px 6px 3px 25px; }
.wa_btn_m { font-size: 16px; background-size: 20px; background-position: 4px 2px; padding: 4px 6px 4px 30px; }
.wa_btn_l { font-size: 16px; background-size: 20px; background-position: 5px 5px; padding: 8px 6px 8px 30px; }
.wa_btn:hover { color: #f7ecb5 }

/* Prefooter */
#prefooter{ background-color: #F0F0F0; }
#prefooter .nav > li > a{ padding: 3px 15px; }

/* Footer */
footer .dades-empresa {line-height:30px;}
footer { background-color: #000000; padding: 30px 0; position: relative; z-index: 1; color: #FFF; }
footer a { color: #ffffff; }
footer a:hover { color: #CCC; }
footer .nav-pills > li > a{ -color: #7e7e7e; }
footer .nav-pills > li > a:hover{ background-color: #333333; }
footer .logo-footer {opacity: 0.4; width: 120px; height: 27px;}
footer .descripcio b, footer .descripcio strong { font-weight: normal;}


/* Social Media */

.social_media a { color: #FFFFFF; }
.social_media a.facebook:hover { color: #3A5795; }
.social_media a.twitter:hover { color: #55ACEE; }
.social_media a.google:hover { color: #D73D32; }
.social_media a.youtube:hover { color: #D73D32; }
.social_media a.pinterest:hover { color: #D73D32; }
.social_media a.flickr:hover { color: #e5af00; }



/* Tutorials */
.level-1 .list-group-item, .level-1 .list-group-item.list-group-item-action.collapsed {
    background-color: #333; border-color: #444; color: #fff; }
/*els actius level 1*/
.level-1 .list-group-item.active, .level-1 .list-group-item:hover, .level-1 .list-group-item.active:focus, .level-1 .list-group-item.active:hover   {
    background-color: #222; border-color: #444;outline: 0px dotted; }
.level-2 .list-group-item, .level-2 .list-group-item:focus, .level-2 .list-group-item.list-group-item-action.collapsed {
    background-color: #444; border-color: #444; }
/*els actius level 2*/
.level-2 .list-group-item:hover { background-color: #555; border-color: #555 }
.level-2 .list-group-item.active, .level-2 .list-group-item.active:focus, .level-2 .list-group-item.active:hover  {
    background-color: #555; border-color: #555;outline: 1px dotted; }
.tutorial hr {margin: 2rem 0 3rem 0;}


/* Large desktop */
@media (min-width: 768px) { 

}

@media (max-width: 1200px) { 
    #team .team-player .wrap-img {height: 287px;}
    #arguments-equip { margin: -126px 0 0 0; padding: 250px 10px 150px; }
    .page-header { margin-top: 120px; }
    .wrap-img-cover-object { height: 380px; }
    
}
@media (min-width: 1200px) {
    
}



/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {

 .team-player .wrap-img {height: 300px;}
 .team-player .caption {padding: 15px 0px 0; font-size: 12px;}
 #team .team-player .wrap-img {height: 266px; }
 #arguments-equip { margin: -142px 0 0 0; }
 .container-continguts { padding: 0px 40px; }
 .wrap-img-cover-object { height: 500px; }
 .imghvr-fade figcaption{ opacity: 1 }  /* per treure el hover del caption a les imatges en mobil*/
 .imghvr-fade figcaption > div { left: 20px; right: 20px; } /* per treure el hover del caption a les imatges en mobil*/
.page-header { margin-top: 120px; }
#arguments-equip { padding: 200px 10px 100px; }
}

/* Landscape phone to portrait tablet */
@media ( max-width: 767px ) {
    .container-continguts{ padding: 0px 30px }  
    .item .nav-next-prev { font-size: 12px }
    .navbar-toggle { margin-top: 20px; }
    #caja_idiomas { border-top: 1px solid #eeeeee }
    .items .navbar-nav > li > a {line-height: 40px;}
    #idioma li { text-align: left; }
    .team-player .wrap-img { height: 415px; }
    .wrap-img-cover-object { height: 340px; }
    #team .team-player .wrap-img {height: 300px; }
    .item .wrap-descripcio .mockup {margin: 30px 0px; }
    .item .wrap-descripcio { margin: 10px 0;}
    .imghvr-fade figcaption{ opacity: 1 }  /* per treure el hover del caption a les imatges en mobil*/
    .imghvr-fade figcaption > div { left: 20px; right: 20px; } /* per treure el hover del caption a les imatges en mobil*/    
}

/* Landscape phones and down */
@media (max-width: 480px) {
    #wrap-menu-principal .navbar-brand img { max-height: 60px; }
    h1 {  font-size: 40px; line-height: 42px; letter-spacing: -2px; }
    .container-continguts{ padding: 0px 15px }    
    .item .nav-next-prev a {padding: 0 10px; line-height: 60px; }
    .page-header { margin-top: 100px; }
    #galeria .padding-imatges { padding: 5px; }
    .team-player .wrap-img { height: 345px; }
    #arguments-equip { padding: 70px 10px 140px;  margin: 0 0 0 0; }

}
@media (max-width: 380px) {

    .item .nav-next-prev a {padding: 0 5px; }
    #galeria .padding-imatges { padding: 0px; }
    .col-xxs-12 { width: 100%; }
    .team-player .wrap-img { height: 450px; }
    .item .wrap-descripcio h2 {  font-size: 40px;}    
}
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}



    /* Bootstrap base amb les variables */

    
        /* links base */
            a { color: var(--bs-primary); text-decoration: none; }
            a:hover, a:focus {  color: var(--bs-primary-hover); text-decoration: none; }
        /* btns bootstrap */
            .btn-primary { background-color: var(--bs-primary); border-color: var(--bs-primary); }
            .btn-primary:hover { background-color: var(--bs-primary-hover); border-color: var(--bs-primary-hover); }
            .btn-outline-primary { color:var(--bs-primary); border-color: var(--bs-primary); }
            .btn-outline-primary:hover,
                .btn-outline-primary:not(:disabled):not(.disabled).active,
                .btn-outline-primary:not(:disabled):not(.disabled):active,
                .show > .btn-outline-primary.dropdown-toggle {background-color: var(--bs-primary); border-color: var(--bs-primary); }
            .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
                .btn-outline-primary:not(:disabled):not(.disabled):active:focus,
                .show > .btn-outline-primary.dropdown-toggle:focus {box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), 0.5);}
            .btn-check:focus + .btn,
                .btn:focus { box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb),.25); }
            .btn-check:focus + .btn-primary,
                .btn-primary:focus {background-color: var(--bs-primary); border-color: var(--bs-primary); box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb),.5);}
            .btn-check:active + .btn-primary:focus,
                .btn-check:checked + .btn-primary:focus,
                .btn-primary.active:focus,
                .btn-primary:active:focus, .show > .btn-primary.dropdown-toggle:focus {box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb),.5);}
            .btn-link { color: var(--bs-primary); text-decoration: none;}
            .btn-link:hover { color: var(--bs-primary-hover); text-decoration: underline;} 
            .btn-close:focus { box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb),.25);}
            a.nav-link { color: var(--bs-primary); }
            a.nav-link:hover { color: var(--bs-primary-hover); }
        /* forms bootstrap */ 
            .form-control:focus { border-color: var(--bs-primary); box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb),.25); }
            .form-check-input:checked { background-color: var(--bs-primary-hover); border-color: var(--bs-primary); } 
            .form-check-input:focus { border-color: rgba(var(--bs-primary-rgb), 0.5); box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), 0.25);}
            .form-select:focus { border-color: rgba(var(--bs-primary-rgb), 0.5); box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), 0.25);}
        /*elements de menu */
            .dropdown-item.active,
            .dropdown-item:active { background-color: var(--bs-secondary) }
        /* breadcrumb */
            .breadcrumb a {color: var(--bs-gray-500);}
            .breadcrumb a:hover {color: var(--bs-gray-700);}
        /* borders */
        .border-primary { border-color: var(--bs-primary)!important; }