@charset "utf-8"; /* CSS Document */
/* NB: reset.css in use */

html, body { margin: 0; padding: 0; font-size: 11px; line-height: 14px; font-family: Arial, Helvetica, sans-serif; color: #000; background-color: #272525;} /* #a0a0a0;}*/
body { background: url('../images/bg_body.jpg') repeat-x; z-index: 500;}

a, a:visited, a img, img, object { border: 0; text-decoration: none; outline: 0; color: #c10003;}
a:hover, a:active { color: #000; text-decoration: underline;}

/* re-curring styles */
em { font-style: italic;}
strong, b { font-weight: bold;}
img { border: none; padding: 0; margin: 0;}
h1 { font-size: 18px; padding: 20px 0 10px 0; text-align: left; color: #c10003;}
h2 { font-size: 15px; line-height: 17px; padding: 0 0 10px 0; text-align: left; font-weight: bold; color: #c10003;}
h3 { font-size: 12px; padding: 0 0 6px 0; font-weight: bold; text-align: left;}
p { position: relative; float: left; font-size: 12px; line-height: 18px; margin: 0 0 14px 0;}
.h1 { padding-bottom: 10px;}

/* wrapper */
#wrapper { margin: 0 auto; width: 1024px; height: 600px;}

/* header */
#header { position: relative; float: left; width: 1024px; height: 33px; margin-top: 0px; top: 0px; z-index: 500;}
#header_logo { position: absolute; left: 36px; top: 12px; height: 162px; width: 162px; z-index: 500;}
#header_navigation { position: relative; float: left; height: 33px; width: 570px; left: 215px;} /* left: 480px;} */

/* navigation */
#nav { border: none; list-style: none; margin: 0; padding: 0; position: absolute; top: 0px; width: 591px; height: 33px; z-index: 500;}
#nav li { display: inline; float: left; list-style: none; position: relative; height: 33px;}
#nav a { display: block; height: 33px; text-indent: -9000px; overflow: hidden; position: relative; width: 135px; background: url('../images/nav.gif') no-repeat;}

#n1 a { background-position: -8px 0px; width: 98px;}
#n1 a:hover, .n1_hover { background-position: -8px -54px !important;}
#index #n1 a { background-position: -8px -108px !important; height: 42px;}

#n2 a { background-position: -105px 0px; width: 99px;}
#n2 a:hover, .n2_hover { background-position: -105px -54px !important;}
#websites #n2 a { background-position: -105px -108px !important; height: 42px;}

#n3 a { background-position: -203px 0px; width: 78px;}
#n3 a:hover, .n3_hover { background-position: -203px -54px !important;}
#mobile #n3 a { background-position: -203px -108px !important; height: 42px;}

#n4 a { background-position: -280px 0px; width: 73px;}
#n4 a:hover, .n4_hover { background-position: -280px -54px !important;}
#social #n4 a { background-position: -280px -108px !important; height: 42px;}

#n5 a { background-position: -353px 0px; width: 71px;}
#n5 a:hover, .n5_hover { background-position: -353px -54px !important;}
#video #n5 a { background-position: -353px -108px !important; height: 42px;}

#n6 a { background-position: -424px 0px; width: 75px;}
#n6 a:hover, .n6_hover { background-position: -424px -54px !important;}
#about #n6 a { background-position: -424px -108px !important; height: 42px;}

#n7 a { background-position: -504px 0px; width: 89px;}
#n7 a:hover, .n7_hover { background-position: -504px -54px;}

/* sub nav */
.sub_nav { position: absolute; top: 33px; padding-top: 20px; width: 170px; border: 1px solid #ccc; background: #fff url('../images/dropdown_bg.gif') 0 0 repeat-y; display: none; z-index: 400;}
.sub_nav .subnav_link { display: block; font-size: 12px; font-weight: bold; color: #666; line-height: 16px; padding: 0px 0px 8px 6px; width: 160px; cursor: pointer;}
.sub_nav .subnav_link:hover {  text-decoration: underline; color: #c10003;}

#sub_n1 { left: 5px;}
#sub_n2 { left: 104px;}
#sub_n3 { left: 203px;}
#sub_n4 { left: 282px;}
#sub_n5 { left: 353px;}
#sub_n6 { left: 424px;}

/* search */
#search { DISPLAY: NONE;} /* position: absolute; top: 7px; right: 40px; width: 150px; height: 17px; color: #5d5959; border: 1px solid #5d5959; background: #060000 url('../images/search_bg.gif') 0 0 no-repeat; z-index:200;} */
#searchcontrol { position: absolute; top: 0px; left: 0px; width: 135px; z-index:200;}
.gsc-search-box { position: absolute; z-index: 101;}
#search input { border: 0; font-size: 11px; color: #fff; position: absolute; top: 0; left: 0px; width: 112px;}
.gsc-input { width: 128px; color: #01b5cb; font-size: 11px; padding: 0; margin: 0; outline: none;}
#search input.gsc-input { top: 2px; left: 2px; width: 125px; background: none; padding: 0; margin: 0; outline: none;}
.gsc-branding { display: none;}
td.gsc-search-button { position: absolute; width: 15px !important; height: 8px; top: -5px; left: 130px; outline: none; text-indent: -9000px !important; color: #000 !important;}
#search input.gsc-search-button { display: block; width: 15px;!important; height: 15px;!important; background: url('../images/search_btn.gif') 0 0 no-repeat; text-decoration: none; top: 5px; right: 23px; text-indent: -9000px; cursor: pointer; *font-size: 0px; *color: #000; padding-top: 8px; outline: none; text-indent: -9000px !important; color: #000 !important;}
#search input.gsc-search-button:hover { background-position: 0 -22px;}
.gsc-clear-button { position: absolute; left: 130px; top: 30px; z-index: 101;}
.gsc-resultsbox-visible{ position: absolute !important; background: #fff !important; top: 25px; left: -200px; margin-left: -3px; *margin-left: 0; border: 1px solid #E2DFDF; padding: 5px; width: 350px; z-index: 100;}
.gs-result .gs-title, .gs-result .gs-title *, .gsc-results .gsc-trailing-more-results, .gsc-results .gsc-trailing-more-results * { color: #c10003 !important;}
.gs-result a.gs-visibleUrl, .gs-result .gs-visibleUrl { color: #000 !important;}

/* left column */
#latest_news { position: absolute; width: 155px !important; top: 200px; left: 40px; margin: 0; text-align: right; border-bottom: 1px solid #e2dfdf; overflow: hidden !important;}
#twitter_container { height: 240px; overflow: hidden !important; background: url('../images/twitter_bg_bar.gif') 0px 133px no-repeat;}
#twitterLink { text-indent: -9000;}
a.date { text-decoration: none; color: #999; font-size: 10px;}
a.date:hover { text-decoration: underline; color: #000; }
#contact { position: absolute; width: 155px; height: 145px; top: 430px; left: 40px; margin: 0; text-align: right;}
.frame { width: 145px; padding: 8px 8px 15px 0; border-top: 1px solid #e2dfdf; border-right: 1px solid #e2dfdf; border-bottom: 1px solid #e2dfdf;}

/* twitter carousel */
#twitter_update_list { top: 0px;}
#twitter_update_list li { height: 136px; width: 145px; overflow: hidden;}
#ssc_controls { position: relative; float: left; display: none;}
.ssc_next, .ssc_prev { display: block; height: 16px; overflow: hidden; position: absolute; text-indent: -9000px; top: 0px; width: 16px; }
.ssc_prev { background: url('../images/buttons.gif') -214px -7px; left: 20px; }
.ssc_prev:hover, .ssc_prev:active { background-position: -214px -50px;}
.ssc_next { background: url('../images/buttons.gif') -89px -8px; left: 0px; }
.ssc_next:hover, .ssc_next:active { background-position: -89px -51px;}
.disabled { visibility: hidden; }

/* main section */
#content { position: relative; float: left; width: 770px; height: 495px; top: 45px; left: 215px; z-index: 400; overflow: hidden;}
.screenshot_lg { position: relative; float: left; padding: 0px 25px 0px 40px; height: 390px; width: 390px; background: url('../images/loading.gif') 205px 185px no-repeat;}
.logo { position: relative; float: left; padding: 20px 0px 15px 0px;}
.projectname { position: relative; float: left; width: 270px; font-weight: bold; font-size: 18px; color: #666; line-height: 24px; padding: 0px 0px 10px 0px;}
.learnmore { position: relative; float: left; font-weight: bold; padding: 0px 0px 0px 14px; margin: 0px 0px 6px 0px; background: url('../images/learnmore.gif') no-repeat; background-position: 0px -43px;}
.learnmore:hover { background-position: 0px 0px;}
.presslinks { font-weight: bold;}
.flashplayer { position: relative; float: left; width: 470px; _width: 460px; height: 390px; _height: 320px; padding: 0 20px 0 0; background: url('../images/loading.gif') 205px 130px no-repeat;}

/* video
#video p, .video p { width: 250px; _width: 220px;} */
#video p .learnmore, .video p .learnmore { margin-top: 10px; font-size: 11px; background-position: 0px -41px;}
#video p .learnmore:hover, .video p .learnmore:hover { background-position: 0px 2px;}
 
.flashplayer object { padding: 0 0 0 0; float: left;}
.video_info { float: left; width: 270px; padding: 0 0 0 0px;}
.project_info { float: left; width: 290px; padding: 0;}

/* carousel */
.carousel { position: relative; float: left; list-style: none; height: 415px; width: 9000px; border-bottom: 1px solid #e2dfdf;}
.carousel li { float: left; list-style: none; position: relative; width: 770px; height: 415px; overflow: hidden;}
#about .carousel li { height: 430px;}

#carousel_left_arrow { position: relative; float: left; top: 10px; left: 0px; display: none;}
#carousel_right_arrow { position: relative; float: right; top: 10px; right: 0px; display: none;}

#wawa { position: relative; float: left; top: 14px; left: 0px; width: 730px; height: 21px; text-align: center; display: none;}
.dotcom { width: 15px; height: 15px; margin: 0 4px 0 4px; font-size: 18px; background: url('../images/dotcom.gif') no-repeat; background-position: 0px 0px;}
.current_li, .dotcom:hover { background-position: 0px -43px;}

#video #wawa { _position: absolute; _top: 425px; left: 0px; width: 730px; height: 21px; text-align: center; display: none;}
#video #carousel_left_arrow { _position: absolute; _top: 425px;}
#video #carousel_right_arrow { _position: absolute; _top: 425px;}

/* about */
.portrait { position: relative; float: left; width: 100px; height: 128px; margin: 0px 10px 0px 0px; text-align: center; background-color: #fff;}
#about .carousel { height: 440px;}
#about p { _width: 250px;}

/* footer */
#footer { margin: 0 auto; width: 1024px; text-align: center; font-size: 11px; color: #fff; padding-top: 0px; height: 168px;}
#footer a { color: #fff; text-indent: -9000px; overflow: hidden; height: 28px; width: 28px; display: inline; float: left;}
#footer a:hover { color: #434343;}

#quicklinks { margin: 0 auto; width: 140px;}
#quick_01 { background: url('../images/share/icon_li.gif') no-repeat;}
#quick_02 { background: url('../images/share/icon_fb.gif') no-repeat;}
#quick_03 { background: url('../images/share/icon_twitter.gif') no-repeat;}
#quick_04 { background: url('../images/share/icon_vimeo.gif') no-repeat;}
#quick_05 { background: url('../images/share/icon_flickr.gif') no-repeat;}

#legal { position: relative; margin: 0 auto; left: -6px; width: 180px; clear: left; color: #5D5959; font-size: 9px;}