
/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Left & Right alignment */

.left { float:left;}
.leftpic {float:left; margin-right:10px}
.right { float:right;}
.wrapper {width:100%; overflow:hidden;}

/* Global properties ======================================================== */

body{ background: url(../images/bg.gif) top center repeat; border:0; font:13px Arial, Helvetica, sans-serif; color:#4e4e4f; line-height:19px; min-width:960px; overflow:hidden;}

.body1{ position:fixed; background:url(../images/bg_img.jpg) center center no-repeat; width:100%; height:100%; top:0; left:0; z-index:-1}

.spinner{ position:absolute; z-index:100;background: url(../images/bg.gif) top center repeat; width:100%; height:100%; top:0; left:0}
.spinner div{ position:absolute; width:100%; height:100%; top:0; left:0; background:url(../images/ajax-loader.gif) 50% 50% no-repeat; }

/* Global Structure ============================================================= */

.container_24 {}

/* ============================= main layout ====================== */

a{ color:#4e4e4f; text-decoration: underline; outline:none}
a:hover{ text-decoration: none}
h1{ padding:0 0 0 249px}
h2{ font-size:35px; color:#fff; font-weight:700; letter-spacing:-1px; line-height:1.2em; padding:43px 0 19px 0}
p{ padding-bottom:19px;}

/* ============================= header ====================== */
header{}

#logo{ display:block; background:url(../images/logo.png) 0 0 no-repeat; width:477px; height: 138px; text-indent:-9999px; }

#menu { left:55px; position:absolute; bottom:209px;}
#menu li { float:left; position:relative; width: 170px; height:201px;}
#menu li span{ position:absolute; bottom:0 ; left:0; width:100%; height:100%; z-index:1; background:url(../images/menu_button.png) 0 bottom no-repeat; display:block}
#menu li img{ position:absolute; bottom:0 ; left:0; width:100%; height:100%; z-index:1;  display:block}
#menu li a{ position:absolute; display:block; font-size:30px; font-weight:700; text-decoration:none; z-index:2; text-align:center; line-height:1.2em; padding-top:132px; width:100%; letter-spacing:-1px; background:url(../images/spacer.png) 0 0 repeat}
#menu li a:hover, #menu .active a{ color:#fff !important}

#menu #nav1 a{ color:#fb640c}
#menu #nav2 a{color:#f8ae0a}
#menu #nav3 a{color:#98bf03}
#menu #nav4 a{color:#01a89c}
#menu #nav5 a{color:#639ecd}

/* ============================= content ====================== */

#content{ height:591px; width:100%; position:relative; margin-bottom:13px; margin-top:17px;}

#content > ul > li{ width:100%; height:100%; position:relative; bottom:0; left:0; overflow:hidden}
#content figure{ padding-top:6px;}

.page{ background:url(../images/bg_content.png) 0 bottom no-repeat}
.page1{ background:url(../images/bg_content1.png) 0 bottom no-repeat}
.page2{ background:url(../images/bg_content2.png) 0 bottom no-repeat}
.page3{ background:url(../images/bg_content3.png) 0 bottom no-repeat}
.page4{ background:url(../images/bg_content4.png) 0 bottom no-repeat}
.page5{ background:url(../images/bg_content5.png) 0 bottom no-repeat}

.pad_left1{ padding-left:14px;}
.pad_left2{ padding-left:39px;}
.marg_right1{ margin-right:19px;}
.pad_bot1{  padding-bottom:9px;}
.pad_bot2{  padding-bottom:19px;}

.cols{ width:241px; float:left;}

.box{ width:100%; overflow:hidden; position:relative; height:360px;}

.scroll{height:235px; width:280px;}
.track{ background:  url(../images/scroll_track.png) 0 0 no-repeat; left:352px; top:44px; width:47px; position:absolute; height:300px; padding:0}
.shuttle{ width:47px; height:117px; background: url(../images/scroll_drag.png) 0 0 no-repeat;}

.color1{ color:#fff; text-align:justify;}
.color2{ color:#aaa; font-size: 1.2em; text-align:justify;}
.color3{ color:#aaa; text-align:justify;}
.color4{ color:#aaa; font-size: 1.4em; text-align:justify; line-height:30px;}


.link1{ display:inline-block; background:url(../images/marker_1.png) 0 0 no-repeat; width:25px; height:25px; margin-left:-4px; margin-top:-2px;}

.button1{ display:inline-block; font-size:20px; color:#121212; height:53px; background:url(../images/button.png) 0 0 no-repeat; width:84px; text-align:center; text-decoration:none; line-height:48px; margin-left:-9px; letter-spacing:-1px;}
.button1:hover{ color:#fff}

.list1{ margin-top:-2px;}
.list1 li{ line-height:25px;}
.list1 li a{ color:#4e4e4f; text-decoration:none; padding-left:10px; background:url(../images/marker_2.png) 0 3px no-repeat}
.list1 li a:hover{ color:#fff}

#content .map{ width:500px; height:250px;border-radius:10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; position:relative; overflow:hidden; margin-bottom:15px; padding-top:0; margin-top:6px;}

.close{ width:70px; height:70px; position: absolute; display:block; top:0; right:0; z-index:99}
.close img{ position:absolute; width:100%; height:100%; top:0; left:0}

#Milestones .pad_bot1{ padding-bottom:15px;}
#Milestones .cols{ width:241px;}
#Milestones .scroll{width:805px; height:230px;}
#Milestones .track{ left:868px;}

#Partners .cols{ width:241px;}
#Partners .scroll{width:805px; height:230px;}
#Partners .track{ left:868px;}

#Projects .cols{ width:241px;}
#Projects .scroll{width:805px; height:235px;}
#Projects .track{ left:868px;}

#About .cols{ width:241px;}
#About .scroll{width:805px; height:230px;}
#About .track{ left:868px;}

#page_News .scroll{width:210px; height:230px;}
#page_News .track{ left:271px;}

#page_More .pad_bot1{ padding-bottom:15px;}
#page_More .scroll{width:225px; height:230px;}
#page_More .track{ left:268px;}


/* ============================= footer ====================== */

footer { text-align:center; font-size:14px; color:#b3b2b2; padding:17px 0 20px 0}
footer a{ color:#545353; text-decoration:none}
footer a:hover{ text-decoration:underline}

/* ============================= forms ============================= */

#ContactForm { position:relative; margin-top:10px; width:515px;}
#ContactForm a{ float:right; margin-left:1px;}
#ContactForm .input {width:206px; height:15px; background: none; padding:8px;color:#4e4e4f; font:13px Arial, Helvetica, sans-serif; position:relative; z-index:1; margin:0}
#ContactForm textarea { overflow: auto;width:253px; height:101px; background: none; padding:8px;color:#4e4e4f; font:13px Arial, Helvetica, sans-serif; position:relative; z-index:1; margin:0}

#ContactForm .bg{ float:left; border:1px solid #222222;border-radius:10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; position:relative}

#ContactForm .success{ position:absolute; z-index:10; background: #111; border:1px solid #222222; width:503px; text-align:center; top:20px; padding:20px 0;border-radius:10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;}

#ContactForm label{ position:relative; min-height:43px; display:block;}
#ContactForm .empty,#ContactForm .error{position: relative; left:10px;top:0;font:10px Arial, Helvetica, sans-serif;color:#fd540e;z-index:2; display:none;}

#ContactForm .name, #ContactForm .email, #ContactForm .phone{}
#ContactForm .textarea_box{ height:117px; overflow:hidden;}
#ContactForm .message{ min-height:129px; padding-bottom:11px; overflow:hidden; display:block; float:left; width:271px;}
#ContactForm  .cols{ float:left; width:224px; margin-right:10px;}

