/*---------------------------------------------------------
                    GLOBAL
---------------------------------------------------------*/


html {
    background-color      : #d5d6cd;
}


body {
    width                 : 1200px;
    height                : auto;
    margin                : auto;
    background            : transparent;
}


p {
    font                  : 14px Myriad-pro-regular;
    text-align            : justify;
}


a {
    color                 : #d5ff00;
    text-decoration       : none;
}


h1 {
    font                  : 22px Myriad-pro-regular;
    color                 : #d5ff00;
    
}


h2 {
    font                  : 16px Myriad-pro-regular;
    color                 : #d5ff00;
    margin-bottom         : 0px;
}


#decorationLeft {
    display               : inline-block;
    width                 : 150px;
    height                : 400px;
    position              : fixed;
    vertical-align        : top;
    border                : none;
    margin                : 0px;
    padding               : 0px;
    background            : url("../images/decorationLeft.png") repeat-y;
}

#decorationRight {
    display               : inline-block;
    width                 : 150px;
    height                : 400px;
    position              : fixed;
    vertical-align        : top;
    border                : none;
    margin                : 0px;
    padding               : 0px;
    margin-top            : 100px;
    background            : url("../images/decorationRight.png") no-repeat;
}


#mainContent {
    display               : inline-block;
    width                 : 900px;
    border                : none;
    border-left           : 2px solid #282828;
    border-right          : 2px solid #282828;
    margin                : 0px;
    margin-left           : 150px;
    padding               : 0px;
    vertical-align        : top;
}


/*---------------------------------------------------------
                    HEADER
---------------------------------------------------------*/


header {
    width                 : auto;
    padding-top           : 50px;
    background            : url("../images/trame.png");
}


#title {
    float                 : left;
    width                 : 800px;
    height                : 60px;
    background            : url("../images/dataHorizonTitle.png") no-repeat;
    color                 : white;
    font                  : 55px PixelArt;
    letter-spacing        : 8px;
    word-spacing          : 0px;
    padding-left          : 10px;

}


header p {
    margin                : auto;
    padding-top           : 20px;
    margin-top              : -4px;
    width                 : 900px;
    height                : 60px;
    opacity               : 0.5;
    -moz-box-shadow       : 0px 5px 5px 0px #343434;
    -webkit-box-shadow    : 0px 5px 5px 0px #343434;
    -o-box-shadow         : 0px 5px 5px 0px #343434;
    box-shadow            : 0px 5px 5px 0px #343434;

    background-color      : black;
    
    color                 : white;
    font-size             : 18px;
    text-align            : center;
}


/*---------------------------------------------------------
                    REAL-SCREEN
---------------------------------------------------------*/


#webRenderer {
    background            : url("../images/trame.png") repeat scroll 0 0 transparent;
    margin                : auto;
    padding-top           : 50px;
    padding-bottom        : 60px;
}


#webRendererSWF {
    margin                : auto;
    padding               : 0;
    width                 : 768px;
    height                : 256px;
}


#webRendererSWFToReplace {
    margin                : auto;
    padding               : 0;
}


#webRendererSubtitle {
    margin                : auto;
    width                 : 768px;
    padding-top           : 6px;
    height                : 30px;
    opacity               : 0.5;
    -moz-box-shadow       : 0px 5px 5px 0px #343434;
    -webkit-box-shadow    : 0px 5px 5px 0px #343434;
    -o-box-shadow         : 0px 5px 5px 0px #343434;
    box-shadow            : 0px 5px 5px 0px #343434;
    background-color      : black;
    color                 : white;
    font-size             : 18px;
    text-align            : center;
}


/*---------------------------------------------------------
                            CONTENT
---------------------------------------------------------*/


#content {
    margin                : auto;
    padding               : 15px;
    background            : #c1c1c1;
    /*border-top            : 1px solid #4e4f4b;*/
    border-bottom         : 1px solid #4e4f4b;
    
    font                  : 14px Myriad-pro-regular;
}


/* ----------------------- Left part ---------------------*/


#left {
    position              : relative;
    display               : inline-block;
    vertical-align        : top;
    width                 : 430px;
    margin-right          : 20px;
    padding-top           : 40px;
}


#left h1 {
    margin-top            : 10px;
}


#left td {
    padding-top           : 0px;
    margin-top            : 0px;
}

#left table p {
    padding-left          : 10px;
}


#legend {
    margin-bottom         : 30px;
}


#utils {
    background-color      : #9b9b9b;
    border-radius         : 20px;
    padding               : 15px;
}


#contact {
    position              : relative;
    display               : inline-block;
    vertical-align        : top;
    width                 : 200px;
    
    padding-right         : 10px;
}


#contact img {
    border                : none;
    color                 : none;
}


#link {
    position              : relative;
    display               : inline-block;
    vertical-align        : top;
    width                 : 170px;
    padding-left          : 10px;
    
}


#link li {
    list-style-image      : url("../images/greenPuce.png");
}


/* ------------------- Right part ------------------*/


#right {
    position              : relative;
    display               : inline-block;
    width                 : 400px;
}


#right .title {
    width                 : 248px;
    height                : 27px;
    margin-top            : 10px;
    background            : url("../images/artistTitle.png") no-repeat;
    color                 : white;
    font                  : 25px PixelArt;
    letter-spacing        : 0px;
    word-spacing          : 0px;
}


#right table {
    border-collapse       : collapse;
}


#right td {
    width                 : 70px;
    border-top            : 1px solid  #3e3e3e;
    
}


#right td:last-child {
    width                 : 280px;
    padding-left          : 50px;
}


#workers {
    margin                : auto;
    width                 : 400px;
}


footer {
    height                : 100px;
    background            : url("../images/trame.png");
}