body{
    background-color: #f5f5f5;
}
.footer {
    background-color: #efefef;
    font-size: .9em;
    height: 60px;
}

.fixed-top {
    z-index: 10000;
}

a {
    color: #a6b51e;
}
a:hover {
    color: #444;
}

.container {
    width: auto;
    max-width: none;
}
main > .container {
    padding: 90px 30px 40px;
}

.navbar.bg-dark {
    background-color: #00073A !important;
}

.navbar .collapse .navbar-nav .nav-item .nav-link {
    font-size: 16px;
    text-transform:none;
}

.navbar .navbar-brand {
    padding: 0;
    height: 65px;
}

.navbar .navbar-brand img{
    height: 55px;
}

.nav li > form > button.logout {
    padding-top: 15px;
    color: rgba(255, 255, 255, 0.5);
}
#user .nav-tabs {
    border-bottom: 1px solid #dee2e6;
    background: #fff;
}

main > .container {
    padding: 100px 30px 40px;
}

#user .nav-tabs .nav-item .nav-link,#user  .nav-tabs .nav-item .nav-link:hover,#user  .nav-tabs .nav-item .nav-link:focus {
    border: 0 !important;
    color: #333 !important;
    font-weight: 500;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #ffffff;
    background-color: #a6b51e;
}
#user .nav-tabs .nav-item .nav-link.active {
    background-color:#a6b51e;
    transition: 0.3s background-color 0.2s;
    color:white !important
}

#user .alert {
    padding-right: 60px;
}

.form-control{
    height: auto;
}

.form-control, .is-focused .form-control {
    background-image: linear-gradient(to top, #a6b51e 2px, rgba(156, 39, 176, 0) 2px), linear-gradient(to top, #d2d2d2 1px, rgba(210, 210, 210, 0) 1px);
}

.btn.btn-primary {
    color: #fff;
    background-color: #3C5B5E ;
    border-color: #3C5B5E ;
    box-shadow: 0 2px 2px 0 rgba(156, 39, 176, 0.14), 0 3px 1px -2px rgba(156, 39, 176, 0.2), 0 1px 5px 0 rgba(156, 39, 176, 0.12);
}

.btn.btn-success {
    color: #fff;
    background-color: #64989D;
    border-color: #64989D;
    box-shadow: 0 2px 2px 0 #7EBEC5, 0 3px 1px -2px #7EBEC5, 0 1px 5px 0 #7EBEC5;
}
.btn.btn-success:hover {
    color: #fff;
    background-color: #7EBEC5;
    border-color: #7EBEC5;
    box-shadow: 0 2px 2px 0 #7EBEC5, 0 3px 1px -2px #7EBEC5, 0 1px 5px 0 #7EBEC5;
}

.btn.btn-primary.verd {
    color: #fff;
    background-color: green ;
    border-color: green ;
    box-shadow: 0 2px 2px 0 rgba(156, 39, 176, 0.14), 0 3px 1px -2px rgba(156, 39, 176, 0.2), 0 1px 5px 0 rgba(156, 39, 176, 0.12);
}

.btn-crear{
    color: #64989D;
}

.btn-crear:hover{
    color: #7EBEC5;
}


.pull-right {
    float: right;
}

.card [class*="card-header-"] .card-title a, .card [class*="card-header-"] .card-title, .card [class*="card-header-"] .icon i, .card[class*="bg-"] .card-title a, .card[class*="bg-"] .card-title, .card[class*="bg-"] .icon i {
    color: #333;
}

.card .card-header-success.oportunitat .card-icon{
    background: linear-gradient(60deg, red, red);
    background-color: red;
}

.card-title .oportunitat, .card-title .oportunitat a{
    color: red !important;
}

.card-title span{
    font-weight: bold;
}

.card-icon a{
    color: white;
}

.producte-opcions{
    background: #dfdfdf;
    border-radius: 4px;
    padding: 3px;
}

.producte-opcions .fa-trash-can{
    color: red;
}

.form-group input[type="file"] {
    opacity: 1;
    position: relative;

    z-index:0;

}



.masonary-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 4rem;
}

.masonary-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 4rem;
}

.masonary-grid-1 {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    column-gap: 4rem;
}

.masonary-grid > .masonary-grid-listview-summary {
    grid-column: 1 / -1;
}

.masonary-grid > .masonary-grid-listview-pager {
    grid-column: 1 / -1;
}

.masonary-grid > .masonary-grid-item {
}

.producte-proveidor-logo{
    max-height:100px;
    max-width:200px;
    margin-bottom:20px
}

.pagination li{
    margin: 0 2px;
}

.pagination li.active a{
    color: black;
}

.help-block{
    color: red;
}
.help-success{
    color: green;
}
.fa-file-pdf{
    color: red;
}

.arxiu{
    float: left;
    position: relative;
    margin-top: 20px;
}
.arxiu .fa-trash-can{
    color: red;
}
.arxiu .fa-file-pdf{
    font-size: 50px;
}
.arxiu a{
    cursor: pointer;
    color: black;
    font-size: 17px;
}

.card-producte .fa-circle-check{
    position: absolute;
    display: none;
    font-size: 35px;
    top: 12px;
    right: 12px;
    color: green;
}

.card-producte.modificable .fa-circle-check{
    top: 62px;
}

.card-producte .votacioMitja .valoracio{
    font-size: 37px;
    padding-top: 4px;
    padding-right: 5px;
}

.card-producte .votacioMitja .krajee-icon-star {
    display: block;
    width: 2rem;
    height: 2rem;
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23fde16d%22%20stroke%3D%22%23777777%22%20d%3D%22M20.6%2011l-4.6-10.5-4.6%2010.5h-10.8l7.8%207.9-3%2012.1%2010.6-6%2010.6%206-3-12.1%207.8-7.9z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
}

.producte-search{
    background: white;
    padding: 5px 30px;
    border-radius: 5px;
    margin-bottom: 20px;
}

#productesearch-preu-slider {
    display: block;
    margin-top: 49px;
    margin-left: 33px;
}

.producte-search .tooltip-inner{
    min-width: 20px !important;
}

.producte-search .tooltip-min,.producte-search .tooltip-max{
    opacity: 1;
    display: block !important;
    width: auto !important;

}

.producte-search .tooltip {
    font-size: 0.75rem;
}

.producte-search .tooltip-min .tooltip-inner:after, .producte-search .tooltip-max .tooltip-inner:after {
    content: "€";
}

.producte-search .slider .tooltip.top {
    margin-top: -48px;
}

.producte-search .slider .tooltip.bottom {
    top: 27px !important;
}

#productesearch-valoracions{
    font-size: 25px;
    border-bottom: 0px;
    color: orange;
    background-image: none;
    border: 1px solid #ced4da;
    padding: 0 10px;
    border-radius: 4px;
}

.producte-index .card .card-header.card-header-icon i, .producte-index .card .card-header.card-header-text i {

    font-size: 24px;
}

.votacio .control-label{
    display: none;
}
.infoValoracio{
    margin-top: 15px;
}
.infoValoracio .theme-krajee-svg.rating-md .krajee-icon, .infoValoracio .theme-krajee-svg.rating-md .krajee-icon-clear {
    width: 1.5rem;
    height: 1.5rem;
}


.missatges {
    border: 1px solid;
    padding: 20px 20px 10px 20px;
    border-radius: 7px;
    margin-bottom: 20px;
}
.missatges textarea{
    width: 100%;
}

.editarComentari{
    cursor: pointer;
    color: #a6b51e !important;
}

.resposta{
    margin-left: 50px;
}

#comentarisProducte b{
    font-weight: bold;
}

#comentarisProducteValidacio{
    display: none;
    color: red;
}

#carouselMobile{
    display: none;
}
#carouselDesktop{
    display: desktop;
}

.no-seleccionable {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

@media (max-width: 820px) { /*responsive*/


    main > .container {
        padding: 10px 30px 40px;
    }

    .masonary-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        column-gap: 4rem;
    }
    .masonary-grid-3 {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        column-gap: 4rem;
    }
    .masonary-grid-2 {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        column-gap: 4rem;
    }
    .masonary-grid-1 {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        column-gap: 4rem;
    }

    #banner_footer img{
        width: 85%;
    }

    nav.fixed-top{
        position: relative;
    }

    .navbar-collapse {
        position: relative;
    }

    .navbar .navbar-collapse.collapse.show,
    .navbar .navbar-collapse.collapse.show.in,
    .navbar .navbar-collapse.show.collapsing {
        display: block !important;
        transform: none;
        top: 10px;
    }

    .navbar-collapse .navbar-nav {
        position: relative;
        z-index: 3;
        background-color: #3C4858;
        color:white;
    }

    .navbar .collapse .navbar-nav li button {
        position: relative;
        padding: 10px 15px;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        border-radius: 3px;
        line-height: 20px;
        margin-left: 5px;
        color: inherit;

        margin-top: 20px;
        margin-bottom: 20px;
        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
    }
    .navbar .collapse .navbar-nav li button:hover {
        color: white;
    }

    .dropdown-menu .dropdown-item, .dropdown-menu li > a {
        color: white;

    }

    [class*="navbar-"] .navbar-nav > li > a{
        opacity: 1;
    }

    button.navbar-toggler{
        padding: 10px;
    }

    #carouselMobile{
        display: block;
    }
    #carouselDesktop{
        display: none;
    }

}