*
{
    margin:  0;
    padding: 0;
}

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

body
{
    background-color: #FDFFFE;
    margin:           0;
    padding:          0;
    font:             10px Verdana, Arial, Helvetica, sans-serif;
    color:            #333333;
}

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

/* Containers ( backgrounds ) de intro y simulación */

#intro
{
    background: transparent url(../img/bg-intro.jpg) no-repeat;
    width:      800px;
    height:     600px;
}

#simulator
{
    background:  transparent url(../img/bg-simulator.jpg) no-repeat;
    width:       800px;
    height:      600px;
}

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

/* Textos Intro */

#intro-titulo
{
    position:   relative;
    top:        60px;
    left:       375px;
    color:      #445D02;
    font-size:  170%;
}

#intro-descripcion
{
    position:     relative;
    top:          390px;
    left:         15px;
    color:        #445D02;
    font-size:    230%;
    font-weight:  bold;
}

.intro-boton
{
    background-color: #597B02;
    border:           2px solid #A0BD02;
    color:            #FFFF00;
    padding-top:      2px;
    padding-bottom:   2px;
    padding-left:     8px;
    padding-right:    8px;
    font-weight:      bold;
    width:            70px;
    position:         relative;
    left:             150px;
    top:              415px;
    text-align:       center;
    cursor:           pointer;
    font-size:        120%;
}
.intro-boton-hover
{
    background-color: #A0BD02;
    border:           2px solid #597B02;
    color:            #597B02;
    padding-top:      2px;
    padding-bottom:   2px;
    padding-left:     8px;
    padding-right:    8px;
    font-weight:      bold;
    width:            70px;
    position:         relative;
    left:             150px;
    top:              415px;
    text-align:       center;
    cursor:           pointer;
    font-size:        120%;
}


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

/* Textos Simulator */

#simulator-titulo
{
    position:    relative;
    top:         57px;
    left:        20px;
    color:       #445D02;
    font-size:   270%;
    font-weight: bold;
}

.simulator-boton-normal
{
    background-color: #597B02;
    border:           2px solid #A0BD02;
    color:            #FFFF00;
    cursor:           pointer;
    clear:            both;
    width:            150px;
    position:         relative;
    top:              15px;
    left:             405px;
    text-align:       center;
    padding-top:      3px;
    padding-bottom:   3px;
    font-weight:      bold;
}

.simulator-boton-rojo
{
    border:           1px solid #CCCCCC;
    background-color: #C10B24;
    color:            #FFFFFF;
    cursor:           pointer;
    clear:            both;
    width:            150px;
    position:         relative;
    top:              15px;
    left:             405px;
    text-align:       center;
    padding-top:      3px;
    padding-bottom:   3px;
    font-weight:      bold;
}



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

#content
{
    padding-top:  100px;
    padding-left: 35px;
}

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

/* Visualización de las Torres */

#torres
{
    float:        left;
    width:        190px;
    height:       400px;
    border:       1px solid #D1CA58;
    margin-right: 5px;
    font-weight:  bold;
}

#torre-1
{
    background:    transparent url(../img/torre.png);
    width:         159px;
    height:        118px;
    margin:        0 auto;
    margin-top:    10px;
    margin-bottom: 12px;
}

#torre-2
{
    background:    transparent url(../img/torre.png);
    width:         159px;
    height:        118px;
    margin:        0 auto;
    margin-bottom: 12px;
}

#torre-3
{
    background: transparent url(../img/torre.png);
    width:      159px;
    height:     118px;
    margin:     0 auto;
}

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

/* Discos disco-TORRE-DISCO */
#disco-1-1
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -345px;
    height:           14px;
    text-align:       center;
}

#disco-1-2
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -340px;
    height:           14px;
    text-align:       center;
}

#disco-1-3
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -335px;
    height:           14px;
    text-align:       center;
}

#disco-2-1
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -263px;
    height:           14px;
    text-align:       center;
}

#disco-2-2
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -258px;
    height:           14px;
    text-align:       center;
}

#disco-2-3
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -253px;
    height:           14px;
    text-align:       center;
}

#disco-3-1
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -181px;
    height:           14px;
    text-align:       center;
}

#disco-3-2
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -176px;
    height:           14px;
    text-align:       center;
}

#disco-3-3
{
    width:            100px;
    position:         relative;
    left:             60px;
    background-color: #000000;
    top:              -171px;
    height:           14px;
    text-align:       center;
}


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

/* Visualización del código */

#codigo
{
    float:   left;
    width:   450px;
    height:  210px;
	top:    400px;
    border:  1px solid #D1CA58;
    padding: 10px;
}

#code-block
{
    font-size:     90%;
    margin-bottom: 15px;
}

.line_number
{
    background-color: #666666;
    color:            #FFFFFF;
    float:            left;
    padding-left:     5px;
    padding-right:    5px;
    margin-right:     8px;
    padding-top:      4px;
    padding-bottom:   4px;
}

.codeline
{
    padding-top:      4px;
    padding-bottom:   4px;
}

.codeline_highlight
{
    background-color: #FDFB71;
    padding-top:      4px;
    padding-bottom:   4px;
}

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

/* Visualización de la pila de ejecución */

#code-stack
{
    position:         relative;
    top:              10px;
    left:             0px;
    border:           1px solid #D1CA58;
    background-color: #ffffff;
    padding:          10px;
    height:           150px;
    overflow:         auto;
    z-index:          100;
    width:            430px;

}

table.code-stack-table
{
    font-size:     90%;
    border-right:  1px solid #94970A;
    border-bottom: 1px solid #94970A;
}

table.code-stack-table th
{
    padding:          1px;
    padding-left:     10px;
    padding-right:    10px;
    background-color: #94970A;
    color:            #FFFFFF;
}

table.code-stack-table tr.normal
{
}

table.code-stack-table tr.selected
{
    background-color: #94970A;
}


table.code-stack-table td
{
    padding:       2px;
    padding-left:  10px;
    padding-right: 10px;
    border-left:   1px solid #000000;
}

#printer
{
    position: absolute;
    top: 550px;
    left: 650px;
    height: 16px;
}

#printer a
{
    text-decoration: none;
}

img
{
    border: 0;
}