/* 
    Document   : bicentenario-style
    Created on : 12/01/2010, 12:26:36 AM
    Author     : Comisión Especial
    Description:
        Purpose of the stylesheet follows.
*/
/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
body {
    background:#AD8637;
    font-family:Arial,Helvetica,sans-serif;
    color:#352400;
    font-size: 12px;
    background-color:#AD8637;
}
.container {
    text-align:center;
}
.center {
    margin-left:auto;
    margin-right:auto;
    width:950px;
    height:1610px;
    *height:1750px;
    background-image:url(../img/bg.jpg);
    *background-image:url(../img/bg2.jpg);
}
.principal-container {
    margin-left:auto;
    margin-right:auto;
    padding-top:50px;
    width:850px;
    height:auto;
}
.header {
    width:850px;
    height:120px;
    background-image:url(../img/head-bg2.png);
    background-repeat:no-repeat;
    background-position:top;
}
#comisiontop {
    width:850px;
    height:75px;
}
#comision {
    height:35px;
    width:850px;
    text-align:center;
    font-size:14px;
    font-weight:bolder;
    color:#352400;
}
.second-container {
    height:40px;
    width:850px;
    z-index:1;
}
.menu-container {
    height:36px;
    width:850px;
}
.social-container {
    height:30px;
    width:70px;
    float:right;
}
.social{
    width: 70px;
    height: 20px;
}
#twitter {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/twitter.png) no-repeat ;
    background-position: top;
    outline:none;
}
a#twitter:hover {
    background: url(../img/twitter.png) no-repeat ;
    background-position:  bottom;
}
#facebook {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/facebook.png) no-repeat ;
    background-position: top;
    outline:none;
}
#facebook:hover {
    background: url(../img/facebook.png) no-repeat ;
    background-position:  bottom;
}
    #slideshow-container	{ width:850px; height:300px; position:relative; }
#slideshow-container img { display:block; position:absolute; top:0; left:0; z-index:1; }

.divider {
    width:850px;
    height:6px;
    background-image:url(../img/brown.png);
    background-repeat:repeat-x;
}
.divider2 {
    width:850px;
    height:6px;
}

.middle-container {
    height:200px;
    width:850px;
}
.libros {
    height:200px;
    width:615px;
    float:left;
    *background-image:url(../images/bg-lib.png);
}
.festejos {
    height:200px;
    width:200px;
    float:right;
    background-image:url(../img/festejos-bg2.png);
    margin-right:10px;
    *margin-right:0px;
}
#festejos-m {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/festejos-m.png) no-repeat ;
    background-position: bottom;
    outline:none;
}
#festejos-m:hover {
    background: url(../img/festejos-m.png) no-repeat ;
    background-position:  top;
}
#festejos-a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/festejos-a.png) no-repeat ;
    background-position: bottom;
    outline:none;
}
#festejos-a:hover {
    background: url(../img/festejos-a.png) no-repeat ;
    background-position:  top;
}
.festejos-am{
    width: 200px;
    height: 85px;
}
.festejos-head {
    height:30px;
    width:200px;
    font-size:.1px;
    font-weight:bold;
    color:buttontext;
    font-variant: small-caps;
    vertical-align:bottom;
}
#text {
    width:850px;
    height:650px;
    text-align:justify;
    margin-right:auto;
    margin-left:auto;
    font-size:14px;
    line-height:20px;
}
.text-content{
    width:810px;
    height:580px;
    overflow:auto;
    margin-right:auto;
    margin-left:auto;
}
.text-content2{
    width:840px;
    height:6000px;
    overflow:auto;
    margin-right:auto;
    margin-left:auto;
}
/* styling of the container. */
a.myPlayer {
    display:block;
    width: 320px;
    height:240px;
    text-align:center;
    margin:0 15px 15px 0;
    float:left;
    border:1px solid #999;
}

/* play button */
a.myPlayer img {
    margin-top:70px;
    border:0px;
}

/* when container is hovered we alter the border color */
a.myPlayer:hover {
    border:1px solid #000;
}