/* CSS Future Template */

/* Necessary code used to zero out any default values given from Browsers */
html, body, p, h1, h2, h3, h4, h5, h6, form, fieldset {
margin: 0;
padding: 0;
border: 0;
color:#333 ;
}

/* Here i set the background color, default font used, and default font color so that they are ready to be used without entering them every time for each piece of text on the HTML page */
body {
background-color: #EAEAEA;
background:url(images/back2.gif) center;
font-family: Verdana, Arial, sans-serif;
/* font-size: 80%; */
padding: 0;
margin: 0;
font-size: 12px;
color:#333 ;  /* this is a setting for the TEXT color  */
text-align:  center; /* THIS DOES NOT CENTER TEXT: it is an IE5 fix to correct the centering of the wrapper div, and must be used */
}

#main {
margin-left: 265px;
padding-top: 0;
width: 500px;
font-size: 12px;
line-height: 18px;
letter-spacing: 1px;
color:#333;
text-align: left;
}

#wrapper {   /* the Wrapper is the base of the website. everything else (divs, images, text, etc...) will be placed inside it  */
width:800px;    /* i am setting here the width of the Website. 770px is perfect for an 800x600 resolution so use this as a  standard */
background-color:#FFF;     /* i set up a background color for the web page that is WHITE */
text-align:left;  /* THIS DOES NOT CENTER TEXT: it is an IE5 fix to correct the centering of the wrapper div, and must be used */

margin: 0px auto;   /* here i set the margins. (they work from top-left-bottom-right: this case TOP-BOTTOM is 10px, and LEFT-RIGHT is set to AUTO setting so it resizes automatically according to the users browser window size.....   IMPORTANT:  most likely use as a standard:   margin: 0px auto 10px auto;        */
}

#banner {  /* top-most section that contains the banner */
height:143px;
background-image:url(images/logo2.jpg);
background-repeat:no-repeat;
}

#flash{
padding-left:400px;
}

a {
color:#006699;
text-decoration: none;
}
a:hover {
color:#006699;
text-decoration: underline;
}

#date {
position: relative;
text-align:right;
padding-right:10px;
padding-top:5px;
font-size:10px;
color:#003466;
}

#idiom {
position:absolute;
right: 10px;
top: 15px;
font-size:11px;
color:#003466;
margin-top: 5px;
}

.bandera {
position:absolute;
background: url(images/gb.png) no-repeat;
display:block;
width: 18px;
height: 11px;
right: 50px;
top: 0px;
text-indent: -99999px;
}

/*  ALL OF NAVIGATION BAR CONTENTS AND DIV    START   */
#nav {
height: 32px;
margin: 1px;
padding: 0px;
text-align:center;
}

#nav ul{ /*rules apply only to ul elements that are a descendant of the #nav ID  */
margin: 0;
padding-top: 7px;
}

#nav ul li{  /* list item element inside a ul found inside the #nav div */
display: inline; /* this makes the navigation list bar a HORIZONTAL bar  */
padding: 0;
margin: 0;
}

#nav a{ /* a link style used on any links that reside within the li element within the nav div */
padding-top: 3px;
padding-bottom: 7px;
padding-left: 13px;
padding-right: 13px;
color:#FFF;
text-decoration: none;
font-size:11px;
} 

#nav a:hover, #nav a:focus{  /* sets the background color that will change when the state becomes onHover, and onFocus  */
padding-left: 13px;
padding-right: 13px;
padding-bottom: 7px;
background-color:#069;
text-decoration: none;
}
/* END OF NAVIGATION ELEMENTS */



#content {
margin-left: 265px;
}

#content p{
margin: 20px;
}

#content h1{
font-size:130%;
color: #003366; /* this is a setting for the TEXT color  */
padding: 0;
margin: 20px;
}

#content h2{
font-size:110%;
color: #003366; /* this is a setting for the TEXT color  */
padding: 0;
margin: 20px;
}

.leftimage{
float: left;
margin: 0 10px 20px 0;
border: 1px solid #000000;
}

.rightimage{
float: right;
margin: 0 0 20px 15px;
border: 1px solid #000000;
width: 150px;
}

.clearit{  /* this is specifically used to push layers down and away from other elements. this is placed by itself in a div to work  NOT being used at the moment  */
clear: both;
}


#footer {
width: 800px;
margin: auto;
margin-top: 50px;
background: url(images/back_foot2.gif) center no-repeat;
font-size:11px;
color:#666;
height: 170px;
clear:both;}

#footer h2{
display: none;}


#footer hr {
display:none;}

#footer-content {
padding: 10px;}

#navigation-foot{
border-bottom: 1px dotted #eaeaea;
margin-bottom: 15px;
padding-bottom: 5px;
border-top: 5px solid #036;
padding-top: 10px;
color:#FFF;
text-decoration: none;
font-size:11px;}


#navigation-foot2{
margin-bottom: 15px;
padding-bottom: 5px;
border-top: 5px solid #036;
color:#FFF;
text-decoration: none;
font-size:11px;}

#navigation-foot ul{
padding: 0;
margin: 0;}

#navigation-foot li{
display: inline;
list-style:none;
padding-right: 15px;}
 
#footer ul{
padding: 0;
margin: 0;}

#footer li{
display: inline;
list-style:none;
padding-right: 15px;
}

#footer p{
font-size:90%;
padding:3px;
}

#leftcol{
margin-left: 0px;
margin-top: 30px; 
float:left;
width: 265px;
font-size:11px;
}

#leftcol p{
font-size:90%;
}

#leftcol h1{
font-size:130%;
color:#339966;
padding-bottom:20px;
text-align:center;
}

.container{
width:99%;
float:right;
margin-top: 30px; 
}

#n_main2 {
width: 500px;
font-size: 12px;
line-height: 18px;
letter-spacing: 1px;
color:#333;
text-align: justify;
border:1px solid #999;
} 

.box {
background:url(images/box-mid.gif);
padding-left: 20px;
padding-right: 5px;
color:#333;
}
.box h3 {
margin:0;}
.box p {
margin-bottom:0px;
padding-left:10px;
padding-right:20px;

}
.box a {
padding-left: 0px;}

#box-prev {
background:url(images/box-prev.gif) no-repeat;
height: 15px;
}

#box-post {
background:url(images/box-post.gif) no-repeat;
height: 25px;} 

.disclaimer p{
padding:0;
margin:0;
}
.dis_title{
font-weight:bold;
font-size:110%;
}

#div.hr {
  height: 1px;
  color:#75BBE4;
  width:450px;
  
  }
#div.hr hr {
  display: none;
}


/* HOME PAGE STYLING  */
.box-prev2{
background:url(images/box-prev2.gif) no-repeat;
height: 15px;
}
.box-mid2{
height:33px; 
width:233px; 
background-color:#BEBEBE;
margin-left:17px;
}
.news_titles_home{
width:233px;
background-color:#BEBEBE;
margin-left:17px;
}