@media screen and (min-width: 1080px) {
body {
    background-image: url("?r=%2Fespera%2Fimg%2Fbackground1.jpg") !important;
    display: flex; /* Establece el contenedor principal como un contenedor flexible */
    align-items: center; /* Centra verticalmente los elementos hijos */
    justify-content: center; /* Centra horizontalmente los elementos hijos */
    height: 100vh; /*Establece la altura del contenedor principal al 100% de la ventana */
}

#content_main {
    font-family: Verdana, Helvetica, Arial, sans-serif;
    font-size: 92%;
    padding-bottom: 10px;
    width: 100%;
    box-sizing: border-box;
}

.logo-container {
    margin-bottom: 20px; /* Espacio entre el logo y el título */
}

.logo {
    display: block;
    align-content: center;
    margin: 0 auto; /* Centra la imagen horizontalmente */
}

h1 {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    text-align: center; /* Centra el texto horizontalmente */
}
div { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline;
} 

.urgencias-container {
    display: block;
    width: 80%;
    border-radius: 15px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    margin-top: 7%;
    margin-bottom: 7%;
    padding-left: 2%;
    padding-right: 2%;
    box-sizing: border-box;
}

.clearfix { 
    display: inline-block;
} 

.clearfix { 
    display: block;
} 


html { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline;
} 


p { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline;
    display: block;
} 


.nivells { 
    margin-bottom: 2.5em;
} 

.clearfix:after { 
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
} 

.act { 
    background: url("?r=%2Fespera%2Fimg%2Freloj-de-pared.png") 99% 50% no-repeat; 
    padding: 3px 40px 3px 10px !important; 
    text-align: right; 
    margin-bottom: 1em;
} 

.num-pacients { 
    background: #eee; 
    padding: 1em; 
    margin-bottom: 2em;
} 

strong { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline;
} 

strong { 
    font-weight: bold;
} 

.nivell-container { 
    float: left; 
    margin-right: 20px; 
    padding-bottom: 5em; 
    position: relative; 
    width: 206px;
} 


.centres h2  { 
    border-top: 2px solid #eee; 
    font-size: 26px !important; 
    font-weight: normal !important; 
    margin-bottom: .5em !important; 
    padding-top: .75em !important;
} 

dl { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline;
} 

.num-pacients-total { 
    float: left; 
    width: 170px;
    padding-left: 12px;
    margin-top: 10px;
} 
.num-pacients-visita { 
    float: left; 
    width: 170px;
    border-right: 2px solid #9f0007;
    margin-top: 10px;
} 

.num-pacients-nivells { 
    float: right; 
    width: 473px; 
    border-left: 2px solid #9f0007;
    margin-right: 100px;
    margin-top: 10px;
} 


.nivell-container h3  { 
    position: absolute; 
    border-bottom: none !important; 
    margin-top: 5em !important;
    padding: .5em 0 0 !important; 
    border-top: 4px solid #9f0007;
} 

#interior #content_main h3 { 
    font-size: 0.9375em; 
    line-height: 1.5em; 
    color: #333333; 
    border-bottom: 1px solid #333333; 
    background: 0; 
    font-weight: bold;
} 

.nivell { 
    float: left; 
    width: 93px; 
    height: 92px; 
    padding-top: 1em; 
    text-align: center; 
    color: #fff;
} 

.nivell-1 { 
    margin-right: 20px;
} 

.nivell.nivell-1  { 
    background: #e63023;
} 
.nivell.nivell-2  { 
    background: #ef7601;
} 
.nivell.nivell-3  { 
    background: #ffda1f;
} 
.nivell.nivell-4  { 
    background: #1ba33f;
} 
.nivell.nivell-5  { 
    background: #4e62ab;
} 
.nivell-container-a h3 { 
    font-size: 1.5em;
} 
.nivell-container-b h3 { 
    font-size: 1.5em;
} 
.nivell-container-c h3 { 
    font-size: 1.5em;
} 

.nivell-4 { 
    margin-right: 20px;
} 

dt { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 20px; 
    font-family: inherit; 
    vertical-align: baseline;
    padding: 1em; 
    margin-bottom: 15px;
    background: #9f0007; 
    clear: left; 
    color: #fff; 
    float: left; 
    width: 230px;
} 

dd { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 20px; 
    font-family: inherit; 
    vertical-align: baseline;
    padding: 1em; 
    margin-bottom: 15px;
    background: #eee; 
    padding-left: 275px;
} 


.num-pacients-total p  { 
    padding-right: 12px !important; 
    padding-bottom: 0 !important;
    font-size: 20px;
} 

.num-pacients-visita p  { 
    padding-right: 12px !important; 
    padding-bottom: 0 !important;
    font-size: 20px;
} 

.num-pacients-nivells p  { 
    float: left; 
    width: 63px; 
    padding-left: 12px !important; 
    margin-right: 12px;
} 

.num-pacients-nivells div  { 
    width: 67px; 
    float: left; 
    background: #eee; 
    margin-right: 12px; 
    color: #fff; 
    text-align: center; 
    font-size: 12px; 
    padding: 1em 0;
} 

.num-pacients-nivells div.nivell-5  { 
    margin-right: 0;
} 

.nivell-a.nivell-1{
    background: #e63023;
    margin-left: 12px;;
}
.nivell-a.nivell-2{
    background: #ef7601;
}
.nivell-b.nivell-3{
    background: #ffda1f;
}
.nivell-c.nivell-4{
    background: #1ba33f;
}
.nivell-c.nivell-5{
    background: #4e62ab;
}

.nivell span  { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline;
    display: block; 
    font-size: 40px; 
} 

.num-pacients-total span  { 
    display: block; 
    font-size: 2em; 
    padding-top: 0.3em; 
    line-height: 1.2;
} 
.num-pacients-visita span  { 
    display: block; 
    font-size: 2em; 
    padding-top: 1em; 
    line-height: 1.2;
} 

.num-pacients-nivells div span  { 
    display: block; 
    font-size: 30px; 
    padding: .5em 0 .25em;
} 

.textdefinicio_temps {
    font-size: 20px;
}

.text-especialitats {
    font-size: 20px;    
    font-weight: bold;
}


/* These were inline style tags. Uses id+class to override almost everything */
#style-Gm5x2.style-Gm5x2 {  
   display: none;  
}  
#style-gv7tq.style-gv7tq {  
   display: none;  
}  
#style-okoEr.style-okoEr {  
   display: none;  
}  

.titlepage {
    display: none;
}
}


/*------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 1079px) {
    body {
        line-height: 16px;
        color: #333;
        display: flex; /* Establece el contenedor principal como un contenedor flexible */
        justify-content: center; /*Centra horizontalmente los elementos hijos*/
    }
    
    #content_main {
        padding-bottom: 10px;
        width: 100%;
        box-sizing: border-box;
    }
    
    .logo-container {
        margin-bottom: 20px; /* Espacio entre el logo y el título */
    }
    
    .logo {
        display: block;
        align-content: center;
        margin: 0 auto; /* Centra la imagen horizontalmente */
    }
    
    h1 {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        font-weight: inherit;
        font-style: inherit;
        font-size: 100%;
        font-family: inherit;
        text-align: center; /* Centra el texto horizontalmente */
    }
    div { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 100%; 
        font-family: inherit; 
        vertical-align: baseline;
    } 
    
    .urgencias-container {
        display: block;
        width: 95%;
        border-radius: 15px;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
        background-color: #fff;
        margin-top: 2%;
        margin-bottom: 2%;
        padding-left: 2%;
        padding-right: 2%;
        box-sizing: border-box;
    }
    
    
    div.nivells.clearfix { 
        display: block;
    } 

    div.num-pacients.clearfix{
        display: flex;
    }
    
    
    html { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 100%; 
        font-family: inherit; 
        vertical-align: baseline;
    } 
    
    
    p { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 100%; 
        font-family: inherit; 
        vertical-align: baseline;
        display: block;
    } 
    
    .act { 
        background: url("?r=%2Fespera%2Fimg%2Freloj-de-pared.png") 99% 50% no-repeat; 
        padding: 3px 40px 3px 10px !important; 
        text-align: right; 
        margin-bottom: 1em;
    } 
    
    .num-pacients { 
        background: #eee; 
        padding: 1em; 
        margin-bottom: 2em;
    } 
    
    strong { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 100%; 
        font-family: inherit; 
        vertical-align: baseline;
    } 
    
    strong { 
        font-weight: bold;
    } 
    
    .nivell-container { 
        float: left; 
        margin-right: 20px; 
        padding-bottom: 6em; 
        position: relative; 
    } 
    
    
    .centres h2  { 
        border-top: 2px solid #eee; 
        font-size: 26px !important; 
        font-weight: normal !important; 
        margin-bottom: .5em !important; 
        padding-top: .75em !important;
    } 
    
    dl { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 100%; 
        font-family: inherit; 
        vertical-align: baseline;
    } 
    
    .num-pacients-total { 
        float: left; 
        width: 155px;
    } 
    .num-pacients-visita { 
        float: left; 
        width: 155px;
        border-right: 2px solid #9f0007;
        margin-right: 1em;
    } 
    
    .num-pacients-nivells { 
        padding-left: 12px !important; 
        border-left: 2px solid #9f0007;
        padding-left: 0.5em;
    } 
    
    
    .nivell-container h3  { 
        position: absolute; 
        border-bottom: none !important; 
        margin-top: 7em !important;
        padding: .5em 0 0 !important; 
        border-top: 4px solid #9f0007;
    } 

    .text-especialitats{
        font-weight: bold;
    }
    
    #interior #content_main h3 { 
        font-size: 0.9375em; 
        line-height: 1.5em; 
        color: #333333; 
        border-bottom: 1px solid #333333; 
        background: 0; 
        font-weight: bold;
    } 
    
    .nivell { 
        float: left; 
        width: 93px; 
        height: 92px; 
        padding-top: 1em; 
        text-align: center; 
        color: #fff;
    } 
    
    .nivell-1 { 
        margin-right: 20px;
    } 
    
    .nivell.nivell-1  { 
        background: #e63023;
    } 
    .nivell.nivell-2  { 
        background: #ef7601;
    } 
    .nivell.nivell-3  { 
        background: #ffda1f;
    } 
    .nivell.nivell-4  { 
        background: #1ba33f;
    } 
    .nivell.nivell-5  { 
        background: #4e62ab;
    } 
    .nivell-container-a h3 { 
        font-size: 1em;
    } 
    .nivell-container-b h3 { 
        font-size: 1em;
    } 
    .nivell-container-c h3 { 
        font-size: 1em;
    } 
    
    .nivell-4 { 
        margin-right: 20px;
    } 
    
    dt { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 15px; 
        font-family: inherit; 
        padding: 1em; 
        background: #9f0007; 
        clear: left; 
        color: #fff; 
    } 
    
    dd { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 15px; 
        font-family: inherit; 
        padding: 1em; 
        margin-bottom: 15px;
        background: #eee; 
    } 
    
    
    .num-pacients-total p  { 
        padding-right: 12px !important; 
        padding-bottom: 0 !important;
    } 
    
    .num-pacients-nivells p  { 
        width: 100%; 
        margin-right: 12px;
    } 
    .num-pacients-visita p  { 
        padding-right: 12px !important; 
        padding-bottom: 0 !important;
    } 
    
    .num-pacients-nivells div  { 
        width: 67px; 
        float: left; 
        background: #eee; 
        margin-right: 12px; 
        color: #fff; 
        text-align: center; 
        font-size: 12px; 
        padding: 1em 0;
    } 
    
    .nivell-a.nivell-1{
        background: #e63023;
        margin-bottom: 0.2em;
    }
    .nivell-a.nivell-2{
        background: #ef7601;
        margin-bottom: 0.2em;
    }
    .nivell-b.nivell-3{
        background: #ffda1f;
        margin-bottom: 0.2em;
    }
    .nivell-c.nivell-4{
        background: #1ba33f;
        margin-bottom: 0.2em;
    }
    .nivell-c.nivell-5{
        background: #4e62ab;
        margin-bottom: 0.2em;
    }
    
    .nivell span  { 
        margin: 0; 
        padding: 0; 
        border: 0; 
        outline: 0; 
        font-weight: inherit; 
        font-style: inherit; 
        font-size: 100%; 
        font-family: inherit; 
        vertical-align: baseline;
        display: block; 
        font-size: 40px; 
    } 
    
    .num-pacients-total span  { 
        display: block; 
        font-size: 2em; 
        padding-top: 0.4em; 
        line-height: 1.2;
    } 
    .num-pacients-visita span  { 
        display: block; 
        font-size: 2em; 
        padding-top: 1em; 
        line-height: 1.2;
    } 
    
    .num-pacients-nivells div span  { 
        display: block; 
        font-size: 30px; 
        padding: .5em 0 .25em;
    } 
    
    
    .text-especialitats {
        font-size: 20px;    
    }
    
    
    /* These were inline style tags. Uses id+class to override almost everything */
    #style-Gm5x2.style-Gm5x2 {  
       display: none;  
    }  
    #style-gv7tq.style-gv7tq {  
       display: none;  
    }  
    #style-okoEr.style-okoEr {  
       display: none;  
    }  
    
    .titlepage {
        display: none;
    }
}