.left {float:left;}
.right {float:right;}
.one_third {width: 33%;}
.one_quarter {width: 25%;}
.one_fifth {width: 20%;}
.one_half {width: 50%;}

/********* HEADER *********/

body {background-image: url('../images/header_background.png'); background-repeat: repeat-x; background-position: top center; width:100%;}

#shadow {overflow-x: hidden; height:11px; width:100%; background: url('../images/shadow.png') no-repeat center top; position: absolute; top: 320px; left: 0px;}

#links {margin-top: 21px; width:860px; margin-left: auto; margin-right: auto; height: 60px;}
#links .item {cursor:pointer; height: 60px;}
#links li {list-style-type:none; float: left; width: 25%;}
#links .name {font: 24px Verdana; letter-spacing:-1px;}
#links .name_hover {font: 28px Verdana; letter-spacing:-1px; font-style: bold;}
#links .subtitle {font: 14px Verdana; color: #666666;}
#links .subtitle_hover {font: 18px Verdana; color: #666666; font-style: bold;}
#links .signup {background: url('../images/signup_icon.png') no-repeat left center; padding-left: 75px;}
#links .download {background: url('../images/download_icon.png') no-repeat left center; padding-left: 56px;}
#links .pricing {background: url('../images/pricing_icon.png') no-repeat left center; padding-left: 88px;}
#links .tour {background: url('../images/tour.png') no-repeat left center; padding-left: 58px; margin-left: 25px;}

#wrap { margin:0 0; overflow:hidden;}

/********* SPLASH ********/

#splash { position:fixed; background: transparent url(/images/opacity.png) scroll repeat 0 0; width:100%; height:100%; z-index:1000; left: 0px; }
#splash_box { position: absolute; width:100px; height:100px; background-color:#555; padding:2px; }
#splash_container {background-color:#fff; position:fixed; z-index:2; }

#splash_container .close { position: relative; left: 333px; top: -70px; cursor: pointer; }
#splash_container .logo_desktop { position: relative; left: 2px; top: 20px; }

#splash .size { font-family: Arial; font-size: 14px; position: absolute; left: 129px;}
#splash .lin_size {  top: 23px; }
#splash .win_size {  top: 23px;}
#splash .mac_size {  top: 23px;}
#splash .android_size {  top: 23px;}
#splash .iphone_size {  top: 23px;}

#download_container { background: #f5f5f5 url(/images/index/splash/separator.png) no-repeat; margin-top: 17px; height: 282px; position: relative; }

#download_container .versions { border: 2px solid #bfdff1; margin: 0 15px 0 15px; height: 330px; background-color: #e8eff3; position: relative; top: 89px; }
#download_container .versions .arrow { position: relative; top: -62px; left: -4px; }
#download_container .versions .title { font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 46px; padding-top: 5px; }
#download_container .versions .choose { position: relative; left: 45px; top: -93px; }
#download_container .versions .so { position: relative; top: -76px; }

#download_container .so .linux { vertical-align: bottom; font-family: Helvetica; font-style: italic; font-size: 14px; text-align: center; }
#download_container .linux_logo { margin-top: 36px; clear: both; cursor: pointer; }
#download_container .so .windows { vertical-align: bottom; font-family: Helvetica; font-style: italic; font-size: 14px; text-align: center; }
#download_container .windows_logo { margin-top: 21px; cursor: pointer; }
#download_container .so .mac { vertical-align: bottom; font-family: Helvetica; font-style: italic; font-size: 14px; text-align: center; }
#download_container .mac_logo { margin-top: 7px; clear: both; cursor: pointer; }
#download_container .so .android { vertical-align: bottom; font-family: Helvetica; font-style: italic; font-size: 14px; text-align: center; }
#download_container .android_logo { margin-top: 5px; clear: both; cursor: pointer; }
#download_container .so .iphone { vertical-align: bottom; font-family: Helvetica; font-style: italic; font-size: 14px; text-align: center; }
#download_container .iphone_logo { margin-top: 7px; clear: both; cursor: pointer; }

/********* NEWS ***********/

.news_container { background: transparent url(/images/news.png) no-repeat scroll 0% 0%; float: right; width: 500px; height: 335px; margin-top: 72px; position: relative; }
.news_container label { font-family: Lucida Sans; position: relative; left: 25px; color: #a19e9e; font-style: italic; font-size: 13px; display: block; }

/********* VIDEO ***********/

.video_container { margin-top: 20px; margin-left: 40px; float: left; }
.video_container .title {color: #5b9000; font-family: Verdana; font-size: 18px;}
.video_container .video { margin-top: 10px;  }
.video_container .footer { display: block; font-family: Arial; font-size: 13px; color: #666; }

/********* MESSAGE *********/

#message {margin-left:17px; padding-left: 90px; margin-top:60px; width:853px; background: url('../images/index/guy.png') no-repeat;}

#balloon_left {background: url('../images/index/balloon_left.png') no-repeat; width:33px; height:93px; float:left;}
#balloon_middle {background: url('../images/index/balloon_middle.png') repeat-x; width:816px; height:93px;top:0px;float:left;}
#balloon_right {background: url('../images/index/balloon_right.png') no-repeat; width:1px; height:93px; float:left;}

#message_title {font: 18px Verdana; color: #5B9000; width:377px; height:18px; position:relative; top:12px; left:43px;}
#message_text {font: 18px Georgia; color: #444444; line-height: 21px; text-align:left; font-style:italic; display: inline-block; position:relative; top:24px; left:43px; width:800px; letter-spacing:0.65px;}

/********* MAIN BOX *********/

#main_and_shadow {padding-top:30px; clear: both; margin: auto;}

#main_and_shadow .shadow {height:8px; float:left;}
#main_and_shadow .top_left {width:6px; background: url('../images/index/shadow_top_left.png') no-repeat;}
#main_and_shadow .top_middle {width:948px; background: url('../images/index/shadow_top_middle.png') repeat-x;}
#main_and_shadow .top_right {width:6px; background: url('../images/index/shadow_top_right.png') no-repeat;}
#main_and_shadow .bottom_left {width:8px; background: url('../images/index/shadow_bottom_left.png') no-repeat;}
#main_and_shadow .bottom_middle {width:944px; background: url('../images/index/shadow_bottom_middle.png') repeat-x;}
#main_and_shadow .bottom_right {width:8px; background: url('../images/index/shadow_bottom_right.png') no-repeat;}
#main_and_shadow .main_box {width:940px; padding-left:10px; padding-right:10px; padding-top:3px; padding-bottom:9px;background: url('../images/index/shadow_middle.png') repeat-y; clear: both;}

#menu_box {float: left;}
#menu_box .text {font: 14px Verdana; color: #005b90; text-align: left; height: 29px; margin-left: 4px; vertical-align: middle; padding-top: 10px; padding-left: 39px; background-repeat: no-repeat; background-position: 5px center; border: 1px solid #C9C9C9; cursor: pointer; width: 117px; margin-bottom: 7px;}
#menu_box .information {background-image: url('../images/index/information.png');}
#menu_box .pulse {background-image: url('../images/index/pulse.png');}
#menu_box .cards {background-image: url('../images/index/cards.png');}
#menu_box .management {background-image: url('../images/index/management.png');}
#menu_box .desktop {background-image: url('../images/index/desktop.png');}
#menu_box .active {background-color: #FFFFFF;}
#menu_box .inactive {background-color: #F5F5F5;}
#menu_box .inactive:hover {background-color: #FFFFFF;}
#menu_box .blog {background-image: url('../images/index/at.png');}
#menu_box .support {background-image: url('../images/index/support.png');}

#info_box {width: 728px; background-color: #E8EFF3; border: 1px solid #BFDFF1; float: left; margin-left: 13px; padding: 15px; ;}

/* INFORMATION */

.text {line-height: 24px; font-family: Arial; font-size: 17px; color: #666; font-weight: normal; font-style: normal; }
.text p { margin-bottom: 10px; }
#workforce .title {font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 46px; padding-top: 6px;}
#workforce .gear {background: url('../images/index/information/gear.png') no-repeat; height: 37px;}
#workforce .comments {float: left; margin-top: 15px;}
#workforce .upper {float: left; margin-left: 9px; text-align: left; font: 16px Arial; line-height: 24px; font-style: italic; font-weight: bold; width: 403px; margin-top: 24px;}
#workforce .upper_text { margin: 10px 0 5px 15px; }
#workforce .lower {width: 407px; height: 135px; padding-left: 10px; clear: both; display: block; padding-top: 23px;}
#workforce .video {margin-top: 29px; margin-left: 10px; cursor: pointer; float: left;}

#knowledge {clear: both; background: url('../images/index/information/screenshots.png') no-repeat 430px 150px; padding-top: 45px;}
#knowledge .title {font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 46px; padding-top: 5px;}
#knowledge .globe {background: url('../images/index/information/globe.png') no-repeat 4px 0px; height: 36px;}
#knowledge .upper_text { margin: 10px 0 5px 15px; }
#knowledge .upper {text-align: left; font: 16px Arial; font-style: italic; font-weight: bold; width: 440px; margin-top: 25px; margin-left: 14px;}
#knowledge .special_leading {line-height: 18px;}
#knowledge .normal_leading {line-height: 24px; margin-top: 5px; width: 385px;}
#knowledge .single {float: left; margin-top: 5px; margin-left: 14px;}
#knowledge .lower {float: left; margin-top: 63px; margin-left: 45px;}

/* PULSE */

#pulse .left {float:left;}
#pulse .title {font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 50px; padding-top: 6px; margin-left: 10px;}
#pulse .gear {background: url('../images/index/pulse/books.png') no-repeat; height: 39px;}
#pulse .comments {float: left; margin-top: 15px;}
#pulse .upper {float: left; margin-left: 15px; text-align: left; font: 16px Arial; line-height: 24px; font-style: italic; font-weight: bold; width: 275px; margin-top: 24px;}
#pulse .lower {width: 362px; height: 300px; padding-left: 10px; clear: both; display: block; padding-top: 23px;}
#pulse .pulse_img {margin-top: 23px; margin-left: 50px; cursor: pointer; float: left;}

/* CARDS */

#cards .left {float:left;}
#cards .title {font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 53px; padding-top: 13px; margin-left: 10px;}
#cards .exchange .title {font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 53px; padding-top: 13px; margin-left: 10px;}
#cards .dekks .gear {background: url('../images/index/cards/dekks_icon.png') no-repeat; height: 39px;}
#cards .exchange .gear {background: url('../images/index/cards/switch.png') no-repeat; height: 39px;}
#cards .comments {float: left; margin-top: 15px;}
#cards .upper {float: left; margin-left: 15px; text-align: left; font: 16px Arial; line-height: 24px; font-style: italic; font-weight: bold; width: 275px; margin-top: 24px;}
#cards .dekks .lower {width: 384px; height: 111px; padding-left: 10px; clear: both; display: block; padding-top: 23px;}
#cards .exchange .lower {width: 473px; height: 160px; padding-left: 13px; clear: both; display: block; padding-top: 23px;}
#cards .exchange .suggestion {width: 418px; height: 134px; margin-left: 13px; margin-top: 30px;}
#cards .dekk_img {margin-top: -35px; margin-left: 10px; cursor: pointer; float: left;}
#cards .dekk_def {margin-top: 30px; margin-left: 12px; }
#cards .exchange {margin-top: 40px;}
#cards .dekkstop {margin-top: 60px;margin-left: 10px;}
#cards .bottom {margin-top: 30px; margin-left: 13px;}


/* MANAGEMENT */

#management .top {margin-top: 15px; margin-left: 12px;}
#management .left {float:left;}
#management .title {font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 50px; padding-top: 6px; margin-left: 10px;}
#management .gear {background: url('../images/index/management/icon.png') no-repeat; height: 39px;}
#management .comments {float: left; margin-top: 15px;}
#management .upper {float: left; margin-left: 15px; text-align: left; font: 16px Arial; line-height: 24px; font-style: italic; font-weight: bold; width: 275px; margin-top: 24px;}
#management .lower {width: 363px; height: 231px; padding-left: 10px; clear: both; display: block; padding-top: 23px;}
#management .desktop_img {margin-top: -15px; margin-left: 50px; cursor: pointer; float: left;}
#management .text .pie_text { margin-left: 5px; }
#management .bar { margin-top: -2px; }
#management .flyout { margin-top: -2px; }
#management .text .bar_text { margin-left: 5px; }

/* DESKTOP */

#desktop .left {float:left;}
#desktop .title {font: 18px Verdana; color: #5B9000; vertical-align: middle; padding-left: 50px; padding-top: 6px; margin-left: 10px;}
#desktop .gear {background: url('../images/index/desktop/icon.png') no-repeat; height: 39px;}
#desktop .comments {float: left; margin-top: 15px;}
#desktop .upper {float: left; margin-left: 15px; text-align: left; font: 16px Arial; line-height: 24px; font-style: italic; font-weight: bold; width: 275px; margin-top: 24px;}
#desktop .lower {width: 363px; height: 231px; padding-left: 10px; clear: both; display: block; padding-top: 23px;}
#desktop .desktop_img {margin-top: -15px; margin-left: 50px; cursor: pointer; float: left;}

