li{
    /*display: inline-block;*/
    display: block;
    height: 40.5px;
    margin-right: 5px;
    position: relative;
}

li[class*='mat']{
    cursor:pointer;
}

li * a{
    border-style:none;
    outline-style:none;
    text-decoration:none;
}

ul:not([class='pop']) li{
    float: left;
}

ul{
    margin-bottom:5px;
    margin-top: 4px;
}

li:not([class=tmedia]){

    border-radius:3px;
    width:47px;
}

li p{
    position:relative;
    margin-left:21px;
    margin-top:20px;
    width:10px;
    font-weight:200px;
}

.enlaces{
    width:309px;
}

.pop{
    margin: 0;
    width:96%;
    list-style: none;
}

.customScrollBox{
    top:50px;
    overflow:hidden;
    height:84%;
    width:100%;
    position:absolute;
}

.container{
    position:absolute;
}

@font-face {
 font-family: ariall;
 font-weight: normal;
 font-style: normal;
 src: url("arial.eot") 
}
@font-face {
 font-family: ariall;
 font-weight: normal;
 font-style: normal;
 src: url("arial.ttf") 
}

@font-face {
 font-family: Larabie;
 font-weight: bold;
 src: url("larabieb.ttf") 
}

@font-face {
 font-family: Melbourne;
 src: url("Melbourne_reg.otf") 
}
@font-face {
    font-family: Intro;
    src: url('Intro.otf');    
}
.dragger_container{
    margin-top:4px;
    height:100%;
    width:3px;
    border-radius:2px;
    background-color:white;
    position:absolute;
    right:5px;
    top:0px;
    margin-top:0px;
    margin-right:6px;
}

.dragger{
    margin-top:4px;
    width:12px !important;
    height:12px !important;
    border-radius:6px;
    background-color:white;
    position:absolute;
    right:-5px;
    top:0px;
    margin-top:0px;
    cursor:pointer;
}

.tmedia img{
    float: left;
    /*left: 1px;*/
    position: relative;
    /*top: 1.5px;*/
    width:41px;
    height:41px;
}

body{
    /*height:100%;*/
    height:99%;
    width:100%;
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}

.Projecte{
    /*background-color: #000000;*/
    border-radius: 4px 4px 4px 4px;
    color: white;
    font-family: ariall;
    font-size: 11px;
    height: 22px;
    padding: 4px 4px 4px 32px;
    position: absolute;
    right: -84px;
    text-transform: uppercase;
    top: -55px;    
    cursor:pointer;
}

.lectura{
    /*background-color: #000000;*/
    border-radius: 4px 4px 4px 4px;
    color: white;
    font-family: ariall;
    font-size: 11px;
    height: 22px;
    padding: 4px 4px 4px 32px;
    position: absolute;
    right: 207px;
    text-transform: uppercase;
    top: -55px;    
    cursor:pointer;
}

.temps{
    /*background-color: #000000;*/
    border-radius: 4px 4px 4px 4px;
    color: white;
    font-family: ariall;
    font-size: 11px;
    height: 22px;
    padding: 4px 4px 4px 32px;
    position: absolute;
    right: 66px;
    text-transform: uppercase;
    top: -55px;    
    cursor:pointer;
}

.PT-2{
    /*background-color: #000000;*/
    border-radius: 4px 4px 4px 4px;
    color: white;
    font-family: ariall;
    font-size: 11px;
    height: 22px;
    padding: 4px 4px 4px 32px;
    position: absolute;
    right: 66px;
    text-transform: uppercase;
    top: -55px;    
    cursor:pointer;
}

/*.PT img{
     left: 6px;
    position: absolute;
    top: 3px;
    width: 20px;
}*/

.less{
    font-size: 15px;
    font-weight: 800;
    font-family:Verdana;
    margin-left:10px;
}

.pop p{
    margin-bottom:36px;
}

.pop li{
    display:block;
    width:245px;
    height:25px;
    margin-left:25px;
    margin-bottom:8px;
    font-size:14px;
    line-height:21px;
}

.subnivell{
    margin-left:80px;
}

li.true{
    margin-left:60px;
    width: 230px !important;
}

.pop li a,.pop li a:hover{
    text-decoration:none;
    font-family:ariall;
    cursor:pointer;
}

.pop li a:hover{
    color:white !important;
}

ul.number li p{
    margin: 0 auto;
    font-size:25px;
    left:17px;
    font-family: Intro;
}

li.actlink{
    margin-top: 26px;
}

a.actlink{
    font-family:ariall;
    font-size:14px;
    text-decoration:none;
}

a.actlink:hover{
    color:white !important;
}

.contenidor{
    width:920px;
    position:relative;
    margin:0 auto;
    top:110px;  
}

.has p{
    margin:0 auto;
    top:40%;
}

.container ul{
    padding:0px;
}

.container{
    width:100%;
}

.titol{
    position:absolute;
    /*left:236px;*/
    top:-70px;
    padding-left:5px;
    padding-right:5px;
    padding-bottom:10px;
    padding-top:10px;
    border-radius:40px 6px 6px 40px; 
    height: auto;
    height:40px;
    /*cursor:pointer;*/
}

.titol img{
    position:relative;
    bottom:5px;
    width:55px;
    left:-2px;
}

.text-titol{
    position:absolute;
    left:62px;
    top:10px;
}

a.link{
    font-weight:bold;
    text-transform:uppercase;
    width:100%;
}

span.link{
    color:white;
    margin:0;
    width:100%;
    font-family:ariall;
    display:block;
}

div.link{
    width:245px;
}

.subtitol{
    left: 50px;
    position: absolute;
    top: -23px;
    text-transform:uppercase;
    font-size:13px;
    padding-left:10px;
    padding-right:20px;
    padding-bottom:5px;
    padding-top:0px;
    border-radius:6px;
    cursor:pointer;
}

.cercle{
    width:10px;
    height:10px;
    border-radius:40px 40px 40px 40px;
}

li.tmedia p{
    font-size: 11px;
    left: 11px;
    position: relative;
    margin-top:15px;
    width: 86%;
}

.titolcasella{
    margin-left:15px;    
}

.titolcasella,.titolcasella span{
    font-family:ariall;
    font-weight:bold;
    font-size:13px;
    text-transform:uppercase;
}

.titolcasella span{
    margin-left:5px;
    color: white!important;
}

.tmedia{
    width:221px;
    text-align:left !important;
    /*border-radius:40px 6px 6px 40px;*/
    background-color: #000000!important;
    border-radius:3px;
    font-family:ariall;
    font-weight:bold;
    color:white;
    padding-top:1px;
    text-transform:uppercase;
    bottom:9px;
    position:relative;
    bottom:6px;
    margin-top:-5px;
    top:5px;
}

.grid{
    padding-left:5px;
}

ul:not([class='pop']){
    height:40px;
}

.curs{
    font-family:Fontin-Regular;
    font-size:40px;
    position:absolute;
    left:482px;
    top:4px;
}

.text-titol{
    font-family:Fontin;
    font-size:29px;
    margin-right:20px;
    margin-left:-55px;
    color:white;
}

.number{
    margin-left:191px;
    font-family:Fontin-Regular;
    position:relative;
    top:2px;
    margin-bottom: 6px;
}

.deu p{ 
    left:7px !important;
}
.desena{left: 11px!important;}
.subgroup{
    margin-left:38px;
    font-family:ariall;
    font-weight:bold;
    font-size:13px;
    text-transform:uppercase;
    color:white;
}



@font-face{
    font-family:Fontin;
    font-weight: normal;
    font-style: normal;
    src: url('lte50331.ttf'),
         url('lte50331.eot');
}

.number li{
    background-color:black;
}
.guiain img {
    float: left;   
    top: 15.5px;
    right: 5px;
    position:relative;
}
.guiain{
    margin-left:8px;
    position:absolute;
    top:-14px;
    cursor:pointer;    
}


.guiainteractiva{
    color: #FFFFFF;
    font-family: arial;
    font-weight: bold;
    text-align: left !important;
    text-transform: uppercase;
}
.imatge-guiainteractiva{
    margin-left: -120px;
    margin-top: 7px;
}
.espai img {
    float: left;
    left: 150px;
    position:relative;
    top: -0.5px;
}
.espai{
    border-radius: 3px;
    width: 140px;
    height: 23.5px;
    margin-left:8px;
    margin-top:-10px;
    position:absolute;
    top:22px;
    cursor:pointer;
}

.espai p {
    font-size: 9px;
    left: 8px;
    margin-top: 7px;
    width: 100%; 
    position:relative;   
}
.espaialumne{
    color: #FFFFFF;
    font-family: arial;
    font-weight: bold;
    text-align: left !important;
    text-transform: uppercase;
}
.sala_lectura{
    z-index: 1000000;
    position: absolute;
    width: 308px;
    height: 275px;
    background-color: #000;
    border-radius: 4px;
    right: -78px;
    margin-top: 7px;
}
.arrow_box {
    margin-top: 0px;
    position: relative;
    background: red;
}
.arrow_box:after {
    bottom: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.arrow_box:after {
    border-bottom-color: black;
    border-width: 5px;
    left: 50%;
    margin-left: -5px;

}
ul.ul-lectura{
    list-style-type: initial!important; 
    margin-left: -35px;     
    color:white!important;     
}
.ul-lectura > li{
    color:green;
    float:none!important;
    width: 100%;
    background-color: black; 
}
.ul-lectura > li > a{
    text-decoration:none;
}
.ul-lectura > li > p{
    color:#fff;  
    left:0px!important;   
}
.text-lectura{
    color:white;
    width: 100%; 
    font-size: 14px!important;  
}
.ul-lectura{margin-top: 30px;margin-left: -15px;}
.linia_temps{
    z-index: 1000000;    
    position: absolute;
    width: 308px;
    height: 275px;
    background-color: black; 
    border-radius: 4px;   
    right:-84px;
    margin-top:7px;
}

.menu_reportatges{
    z-index: 1000000;    
    position: absolute;
    width: 308px;
    height: 275px;
    background-color: black; 
    border-radius: 4px;   
    right:-84px;
    margin-top:7px;
}
.ul-reportatges > li{
    color:green;
    float:none!important;
    width: 100%;
    background-color: black; 
}
.ul-reportatges > li > a{
    text-decoration:none;
}
.ul-reportatges{margin-top:30px;margin-left: -15px;}
.text-reportatges{
    color:white;
    width: 100%; 
    /*font-size: 14px!important;*/
}
ul.ul-lectura{
    list-style-type: initial!important; 
    margin-left: -35px;     
    color:white!important;     
}
.ul-temps > li{
    color:green;
    float:none!important;
    width: 100%;
    background-color: black; 
}
.ul-temps > li > a{
    text-decoration:none;
}
.ul-temps > li > p{
    color:#fff;  
    left:0px!important;   
}
.ul-temps{margin-top: 30px;margin-left: -15px;}
.text-temps{
    color:white;
    width: 100%; 
    /*font-size: 14px!important;*/
}
.atonium{
    color:black;
    font-family: Larabie;
    font-size:36px;
}
.atonium_sub{
    font-family: Melbourne;
    font-size:24px;
}
.pop > li > div > a:before {
    content: "• ";
    color: red; /* or whatever color you prefer */
}
.n3 > p{top:6px!important;}
.activitat-inicial:before{color:black!important;}
.ul-reportatges > li > a:before {
    content: "• ";
    color: red; /* or whatever color you prefer */
}
.ul-temps > li > a:before {
    content: "• ";
    color: red; /* or whatever color you prefer */
}
.ul-lectura > li > a:before {
    content: "• ";
    color: red; /* or whatever color you prefer */
}