/*BODY*/

body{
    background-color: #E7E9E4;
}

#body{
    background-color: #CED0CB;
    padding-top: 4px;
    margin-left: auto;
    margin-right: auto;
    width: 800px;
    height: 610px;
}

#layer1{
    background-color: #0D71EC;
    margin-left: auto;
    margin-right: auto;
    border-width: 5px;
    border-color: #626361;
    border-style: solid;
    width: 566px;
    height: 593px;
}

#layer2{
    margin-left: auto;
    margin-right: auto;
    vertical-align:top;
    width: 521px;
    height: 528px;
    background-repeat: repeat;
    background-position: center;
    background-image: url("imagenslayout/gradiente.png");
}


/*HEAD - BANNER*/


#head{
    height: 192px;
    width: 100%;
}

#head-banner{
    height: 133px;
    width: 100%;
}
#head-banner-left{
    float:left;
    width: 161px;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("imagenslayout/solEnuvens.png");
}
#head-banner-center-top{
    width: 105%;
    height: 80px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("imagenslayout/aMatematicaEeu.png");
}
#head-banner-center-bottom{
    width: 100%;
    height: 30px;
    background-repeat: no-repeat;
    background-position: top;
    background-image: url("imagenslayout/aprenderBrincando.png");
}
#head-banner-right{
    float:right;
    width: 121px;
    height: 100%;
    vertical-align: center;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("imagenslayout/nuvens.png");
}


/*HEAD - TABS AND BOTTOM*/


#head-tabs{
    height: 23px;
    width: 100%;
    text-align: center;
}

.img-tabs{
    border: 0px;
    padding: 0px;
}

#head-bottom{
    width: 467px;
    height: 36px;
    margin-left: auto;
    margin-right: auto;
    background-repeat: no-repeat;
    background-image: url("imagenslayout/q1.png");
}

#main{
    height: 239px;
    width: 100%;
}

#main-left{
    float:left;
    width: 23px;
    height: 100%;
    margin-left: 27px;
    margin-right: auto;
    background-repeat: no-repeat;
    background-image: url("imagenslayout/q2.png");
}

#main-center{ 
    float:left;
    margin-left: auto;
    margin-right: auto;
    vertical-align:top;
    width: 421px;
    height: 240px;
    background-position: center;
    background-color:white;
}

#main-right{
    float:right;
    width: 23px;
    height: 100%;
    margin-right: 27px;
    background-repeat: no-repeat;
    background-position: top;
    background-image: url("imagenslayout/q3.png");
}



/*BOTTOM*/

#bottom{
    height: 107px;
    width: 100%;
}


#bottom-top{
    width: 467px;
    height: 36px;
    margin-left: auto;
    margin-right: auto;
    background-position: top;
    background-repeat: no-repeat;
    background-image: url("imagenslayout/q4.png");
}

#bottom-bottom{
    width: 521px;
    height: 62px;
    margin-left: auto;
    margin-right: auto;
    background-position: bottom;
    background-repeat: no-repeat;
    background-image: url("imagenslayout/rodape.png");
}

#bottom-left{
    float:left;
    width:70px;
    height:70px;
    margin-left: auto;
    margin-right: auto;
    background-position: left;
    background-repeat: no-repeat;
    background-image: url("imagenslayout/bola.png");
}

#bottom-right{
    float:right;
    width:85px;
    height:88px;
    margin-left: auto;
    margin-right: auto;
    background-position: right;
    background-repeat: no-repeat;
    background-image: url("imagenslayout/carro.png");
}