/* General */

            @font-face {
                font-family:DejaVuLight;
                src: local('DejaVu Sans Extralight'), url('../fonts/DejaVuSans-ExtraLight.ttf') format('truetype')
            }

            @font-face {
                font-family:DejaVuSans;
                src: local('DejaVu Sans'), url('../fonts/DejaVuSans.ttf') format('truetype')
            }

            @font-face {
                font-family:LatoLight;
                font-weight: 100;
                src: local('Lato Light'), url('../fonts/Lato-Light.ttf') format('truetype')
            }

            @font-face {
              font-family: 'Lato';
              font-style: normal;
              font-weight: 400;
              src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v11/1YwB1sO8YE1Lyjf12WNiUA.woff2) format('woff2');
            }

            @font-face {
              font-family: 'OpenSans';
              font-style: normal;
              font-weight: 400;
              src: local('OpenSans Regular'), local('OpenSans-Regular'), url('../fonts/opensans-regular-webfont.woff') format('woff');
            }

            * {
                margin:0px; padding:0px; font-family:  DejaVuSans;
            }

            html, body {
                height: 100%; background-color: white; border:0px solid red; font-size:16px; 
            }

            /* Llistes */
            main ul {
                margin:2rem;
            }

            main li {
                margin-left:3rem; margin-bottom:1rem; color:rgb(80,80,80)
            }

            /* Taules */ 
            table {
                border-collapse: collapse; width: 100%;
            }

            table td, table th {
                border: 1px solid #ddd;
            }


            table tr:nth-child(even){background-color: #f2f2f2;}

            table th {
                padding: 0.3rem;
                text-align: left;
                background-color: rgb(212,0,0);
                color: white;
            }

            table td {
                padding:0.3rem;
            }

            /* Capcelera */

            header {
                width:98%;  border-bottom: 0.10rem solid black;
                background-color: rgb(236,236,236); padding: 0.8% 0% 0% 2%
            }


            header img {
                width:11rem; display:inline-block; border:0px solid red;
            }


            /* Navegació d'idioma */
            header nav {
                position:absolute; right:0px; top:0px
            }

                header nav ul {
                    background-color:white; display:block; border: 0px solid red; padding:0.0rem 0.3rem 0.2rem 0.3rem;
                    border-bottom-left-radius: 0.4rem;
                }

                header nav li {
                    display: inline; font-family: DejaVuLight; font-size:0.6rem; color:black;
                }

                header nav li a {
                    font-size:inherit; color:inherit; text-decoration:none;font-family: inherit;
                }


            /* Avis legal */
            section#legal {
                padding:2rem; font-size:0.8rem; display: none; text-align:left; margin-top:1rem;
                height:15rem; overflow-y: scroll; background-color: rgb(236,236,236);
            }

                section#legal p {
                    margin-bottom:2rem;
                }

                section#legal h1 {
                    margin-bottom:1rem; font-size:1rem; 
                }


            /* Navegació de productes  i serveis */
            header nav#menu {
                position:relative;  margin-left:3rem; right:auto;  margin-top:0rem; display:inline-block;
            }
                header nav#menu em {
                    text-decoration: none; font-style: normal;
                }

                header nav#menu ul {
                    background-color: transparent; padding:0rem; border-bottom:0px; display:inline; margin-top:0px;
                }

                header nav#menu li{
                    display:inline-block; position:relative; margin:0px 0.2rem 0px 0px;
                    padding:0.6rem 1rem; background-color: rgba(236,236,236,0.93);
                    border-radius: 3px 3px 0px 0px; cursor:pointer;
                    font-family:  DejaVuLight; font-size:1rem; color:rgb(100,100,100); text-align:center; text-transform: uppercase;
                    transition: background-color 0.2s linear 0s;
                }


                header nav#menu li li{
                    position:relative; display:block; font-size:1rem; background-color: rgba(236,236,236,0.93);
                    border-radius: 0px; color:rgb(100,100,100); border-top:0.1rem dotted rgb(180,180,180);
                    margin:0; text-align:left; transition: background-color 0.2s linear 0s;

                }

                header nav#menu li li:first-of-type {
                    border:0px;

                }

                header nav#menu li ul {
                  position: absolute; left:0px; top:2.40rem;
                  display: none; visibility: hidden;
                  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.25);

                }


                header nav#menu li:hover ul {
                  display: block; visibility: visible;
                }

                header nav#menu li:hover {
                    color:rgb(212,0,0); background-color: #b8bbbe;

                }

                header nav#menu li li:hover {
                    background-color: #b8bbbe; color:white;

                }

            /*header nav#menu {
                position:relative;  margin-left:3rem; right:auto;  margin-top:-1.2rem; display:inline-block;
            }
                header nav#menu ul {
                    background-color:  transparent; padding:0rem; border-bottom:0px;
                    display:inline;
                }

                header nav#menu li{
                    display:inline-block; position:relative; margin:0px 0.2rem 0px 0px; font-size:1rem;
                    padding:0.2rem 1rem; background-color: rgb(212,212,212);
                    border-radius: 3px 3px 0px 0px; color:black; cursor:pointer; font-family: OpenSans;
                }


                header nav#menu li li{
                    position:relative; display:block; font-size:1.1rem; background-color:rgb(130,130,130);
                    border-radius: 0px; color:white; border-top:0.1rem solid rgb(180,180,180);
                    margin:0;

                }

                header nav#menu li ul {
                  position: absolute; left:0px; top:1.75rem;
                  display: none; visibility: hidden;
                  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.25);

                }


                header nav#menu li:hover ul {
                  display: block; visibility: visible;
                }

                header nav#menu li:hover {
                    background-color:rgb(130,130,130); color:white;

                }

                header nav#menu li li:hover {
                    background-color:rgb(212,0,0); color:white;

                }
                */




            /* Main */



            /* Peu */
            footer {
                width:96%;  border-top: 0.10rem solid rgb(212,0,0);text-align: right;
                background-color: rgb(236,236,236); padding: 0.3% 2% 0.4% 2%;

            }

                footer a {
                    font-size:0.7rem; color:rgb(40,40,40);
                }