input:focus{outline:none;}

body {float:left; background:url('../images/common/body_bkg.png') repeat 0 0; }
a {cursor:pointer; color: #DA4A18; font: 15px arial;}
li {
  font: 15px Arial;
}


div.outer_layout {float:left; width:100%; background:url('../images/common/upper_bkg.jpg') repeat-x center -10px;}
div.outer_layout div.inner_layout {float:left; width:100%; background:url('../images/common/inner_bkg.png') repeat-x 0 bottom; padding:0;}


/* GALAXY ZOO */
div#galaxy_zoo {float:left; width:100%; background:url('../images/common/header_bkg.png') repeat-x 0 0; height:35px;}
div#galaxy_zoo div.content {margin:0 auto; width:890px;}
div#galaxy_zoo div.content ul.left {float:left;}
div#galaxy_zoo div.content ul li {display: inline; font-size: 0.7em; margin-left: 0px; margin-top: 0px; padding-top: 0px; padding-right: 5px; padding-bottom: 0px; padding-left: 2px; font-family: Arial, sans-serif; font-weight: normal; color: #FFFFFF; line-height:36px;}
div#galaxy_zoo div.content ul.right {float:right;}

div#galaxy_zoo div.content ul li img {padding-bottom:5px;}

/* HEADER */
div#header {margin:0 auto; width:890px;}
div#header div.left {float:left; width:190px; padding:30px 0 15px;}
div#header div.left a.logo {float:left; width:230px; height:56px; background:url(../images/common/old-logo.png) no-repeat -6px 0;}
div#header div.right {float:right; width:700px; padding:47px 0 15px 0;}
div#header div.right ul {float:right; width:700px;}
div#header div.right ul li {float:right; width:auto; margin:0 5px; position:relative;}
div#header div.right ul li.last {margin:0 0 0 5px;}
div#header div.right ul li a {float:left; padding:0 0 0 2px; height:23px; background:url(../images/common/item_left.png) no-repeat 0 0; text-decoration:none;}
div#header div.right ul li a >span {float:left; padding:4px 7px 4px 5px; height:15px; background:url(../images/common/item_right.png) no-repeat right 0; font:bold 13px arial; color:white; cursor:pointer; text-shadow: #909797 0 1px;}
div#header div.right ul li.selected a {background-position:0 -23px;}
div#header div.right ul li.selected a span {background-position:right -23px; color:#999999; text-shadow:none;}
div#header div.right ul li.started a {background:url(../images/common/started_left.png) no-repeat 0 0;}
div#header div.right ul li.started a span {background:url(../images/common/started_right.png) no-repeat right 0; color:white; text-shadow:#00A6A6 0 1px;}
div#header div.right ul li a:hover {background-position:0 -23px;}
div#header div.right ul li a:hover span {background-position:right -23px; color:#999999; text-shadow:none;}
div#header div.right ul li.selected.started a {background-position:0 -23px;}
div#header div.right ul li.selected.started a span {background-position:right -23px; color:white;}
div#header div.right ul li.started a:hover span {background-position:right -23px; color:white;}
div#header div.right ul li.logged {position:relative;}
div#header div.right ul li.logged >span {float:left; background:url(../images/common/user_logged_left.png) no-repeat 0 0; height:15px; vertical-align:center; line-height:13px; color:white; padding:4px 11px; font:bold 13px "Merriweather"; color:white; min-width:60px;}
div#header div.right ul li.logged >span a {font:bold 13px arial; color:white; text-decoration:none; background:none;}
div#header div.right ul li.logged >span a:hover {background:none; color:#F1F1F1;}
div#header div.right ul li.logged a.button {float:left; background:url(../images/common/user_logged_right.png) no-repeat 0 0; height:23px; width:23px; margin:0;}
div#header div.right ul li.logged div.options {position:absolute; display:none; right:1px; top:22px; width:100%; height:72px; z-index:100;}
div#header div.right ul li.logged div.options div.left {float:left; background:url(../images/common/log_cont_left.png) no-repeat 0 0; width:100%; height:100px; padding:0 0 0 4px;background-color:#00C3CD;}
div#header div.right ul li.logged div.options div.left div.right {float:left; background:url(../images/common/log_cont_right.png) no-repeat right 0; width:100%; height:100px; padding:0 4px 0 0; background-color:#00C3CD;}
div#header div.right ul li.logged div.options div.left div.right div.center {  background:url(../images/common/log_cont.png) repeat-x 0 0; width:100%; padding:4px 0 0 0; height:90px;background-color:#00C3CD;}
div#header div.right ul li.logged div.options span.line {position:absolute; top:0; left:0; width:100%; height:1px; background:url(../images/common/log_cont_line.png) repeat-x 0 0;}
div#header div.right ul li.logged div.options div.left div.right div.center a {float:left; margin:5px 0 0 10px; padding:0; width:100px; height:auto; background:none; text-decoration: underline; font:normal 13px "Merriweather"; color:#B3EDF0;}
div#header div.right ul li.logged div.options div.left div.right div.center a:hover {color:#FFFFFF;}
div#header div.right ul li ul.drop_down {
  display:none; background-image:none; background-color: transparent;position:absolute ; z-index: 1000; width:155px; padding-top: 20px; top: 0px; left:-70px;

}

div#header div.right ul li ul.drop_down .content{
	background-color: white;
	border-radius: 3px;
	margin-top: -14px;
	position: relative;
	-webkit-box-shadow: 1px 1px 1px #888;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, .2);
	margin-right: 7px;
	font-family: arial;
}

div#header div.right ul li ul.drop_down .content li {font-size:13px; float:none;color: #EB593D; background: none; border:none; }
div#header div.right ul li ul.drop_down .content li a {font-size:13px; color: #EB593D; background: none; border:none; line-height:1px; }

div#header div.right ul li:hover ul.drop_down .arrow-n {background-color: transparent; }
div#header div.right ul li:hover ul.drop_down {display:block; }
div#header div.right ul li ul.drop_down:hover {display:block; }

div#header div.right ul li ul.drop_down li {border-bottom: 1px solid #F2F2F2; color: #EA593C; width: 100%; padding:15px; }

/*COMMON*/
div.data {margin:0 auto; width:910px;}
div.data div.shadow_left {float:left; width:10px; height:514px; padding:0; margin:0; background:url(../images/common/shadow_side.png) no-repeat -3px 0;}
div.data div.shadow_right {float:left; width:10px; height:514px; padding:0; margin:0; background:url(../images/common/shadow_right.png) no-repeat -15px 0;}
div.data div.shadow_topbottom {float:left; width:910px; height:10px; background:url(../images/common/shadow_updown.png) no-repeat center -1px;}
div.data div.shadow_topbottom.bottom {background-position:center -3px; height:5px;}
div.data div.information {float:left; width:890px; background:white;}

/* VESSELS-LIST */
div.data div.information.vessels_bkg {background:url(../images/home/right_column_bkg.png) repeat-y right 0;}

div.vessels_list {float:left; margin:30px 0 0 30px; width:570px;}
div.vessels_list h1 {font:normal 25px 'Merriweather', "Merriweather", sans-serif; color:#666666; letter-spacing:-1.0px; padding:0;}
div.vessels_list h2 {font:normal 15px arial; color:#666666; margin:2px 0 0 0; padding:0;}

div.vessels_list ul.ships {float:left; width:538px; margin:26px 0 0 0; border-bottom:1px solid #E5E5E5;}
div.vessels_list ul.ships li {float:left; position:relative; border-top:1px solid #E5E5E5; padding:13px 0; height:51px; width:538px;}
div.vessels_list ul.ships li div.info {float:left; width:190px;}
div.vessels_list ul.ships li div.image {float:left; background:url(../images/common/bkg_img_ship.png) no-repeat 0 0; width:51px; height:51px; }
div.vessels_list ul.ships li div.image img {float:left; width:49px; height:49px; margin:1px 0px 0 1px;}
div.vessels_list ul.ships li div.info {float:left; margin:0 0 0 8px; padding:0;}
div.vessels_list ul.ships li div.info p.ship {float:left; font:bold 15px "Merriweather"; color:#666666; width:100%;}
div.vessels_list ul.ships li div.info p.ship a {font:bold 15px arial; color:#666666; text-decoration:none;}
div.vessels_list ul.ships li div.info p.ship a:hover {color:#DB4A18;}
div.vessels_list ul.ships li div.info p.travel {font:normal 13px arial; color:#999999; margin:2px 0 0 0;}
div.vessels_list ul.ships li div.info p.travel img {width:10px; height:7px;}
div.vessels_list ul.ships li div.info div.bar {float:left; margin:8px 0 0 0; background:url(../images/common/bar_empty.png) no-repeat 0 0; width:190px; height:6px; overflow:hidden; padding:0;}

/* 	PROGRESS BAR (-- COMMON --)	*/
div.bar p.percent_orange {display:none;}
div.bar p.percent_blue {display:none;}

div.bar a {cursor:pointer; margin:0; padding:0;}
div.bar a.left {float:left; height:6px; margin:0; width:auto;}
div.bar a.left.orange {background:url(../images/common/left_orange.png) no-repeat 0 0;}
div.bar a.left.blue {background:url(../images/common/left_cyan.png) no-repeat 0 0;}
div.bar span.orange {background-color:#DB4A18; height:6px; width:auto; float:left; margin:0 0 0 2px; padding:0;}
div.bar span.blue {background-color:#00CFD7; height:6px; width:auto; float:left; margin:0 0 0 2px; padding:0;}

div.bar span.space {float:left; background-color:#FFFFFF; width:1px; height:6px; margin:0; padding:0;}

div.bar a.right {float:left; height:6px; width:2px; margin:0 0 0 0px;}
div.bar a.right.orange {background:url(../images/common/right_orange.png) no-repeat right 0;}
div.bar a.right.blue {background:url(../images/common/right_cyan.png) no-repeat right 0;}

div.bar a.second_bar {float:left; height:6px; margin:0 0 0 1px; width:auto;}
div.bar a.second_bar.orange {background-color:#DB4A18;}
div.bar a.second_bar.blue {background-color:#00CFD7;}

/* ---------- */
div.vessels_list ul.ships li span.line {position:absolute; top:8px;  background:url(../images/common/line_divide.png) no-repeat 0 0; width:2px; height:62px; padding:0; margin:0;}
div.vessels_list ul.ships li span.line.left {left:319px;}
div.vessels_list ul.ships li img.source_icon {position:absolute; left:328px; width: 50px; height:50px;}
div.vessels_list ul.ships li img.diff_icon {position:absolute; left:263px; width: 50px; height:50px; background: #4e4e4e; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}

img.diff_icon {
  width: 50px; 
  height: 50px; 
  background: #4e4e4e; 
  -webkit-border-radius: 2px; 
  -moz-border-radius: 2px; 
  border-radius: 2px;
  left: 0;
  position: absolute;
}

div.vessels_list ul.ships li img.easy {background: #4e4e4e url(../images/easy.png) no-repeat}
img.easy {background: #4e4e4e url(../images/easy.png) no-repeat}
div.vessels_list ul.ships li img.medium {background: #4e4e4e url(../images/medium.png) no-repeat}
img.medium {background: #4e4e4e url(../images/medium.png) no-repeat}
div.vessels_list ul.ships li img.hard {background: #4e4e4e url(../images/hard.png) no-repeat}
img.hard {background: #4e4e4e url(../images/hard.png) no-repeat}
div.vessels_list ul.ships li img.challenging {background: #4e4e4e url(../images/challenging.png) no-repeat}
img.challenging {background: #4e4e4e url(../images/challenging.png) no-repeat}

div.vessels_list ul.ships li span.line.right {left:383px;}

div.by_source span.ranking:first-child {padding-top: 10px}
.ranking {
  display: block;
  color: #777;
  font: normal 11px arial;
  line-height: 1.3em;
  margin: 2px 0 0 0;
  min-height: 65px;
  padding: 0 0 0 60px;
  position: relative;
  vertical-align: top;
}

div.vessels_list ul.ships li div.users {float:right; margin:8px 0px 0 0; width:140px; padding:0;}
div.vessels_list ul.ships li div.users p {float:right; font:normal 13px arial; color:#666666; margin:0; width:100%;}
div.vessels_list ul.ships li div.users div.following {float:left;  margin:3px 0 0 0; width:100%; position:relative;}
div.vessels_list ul.ships li div.users div.following a {font:normal 13px arial; color:#00CFD7; text-decoration:underline; position:absolute; top:0; left:0; padding:0;}
div.vessels_list ul.ships li div.users div.following a:hover {color:#00B2B9;}
div.vessels_list ul.ships li div.users div.following span {position:absolute; color:#B5B5B5; background:url(../images/common/follow_checked.png) no-repeat 0 2px; padding:0 0 0 15px; font:normal 13px "Merriweather"; top:0; left:0; display:none;}

div.vessels_list div.pages {float:right; width:170px; height:50px; margin:15px 35px 0 0; font:normal 13px "Merriweather"; padding:0 0 0px 0;}
div.vessels_list div.pages ul {float:left; width:120px; height:20px;}
div.vessels_list div.pages ul li {float:left; margin:0 2px; width:13px; height:17px; padding:1px 0 0 5px;}
div.vessels_list div.pages ul li.selected {background:url(../images/common/bkg_page_selected.png) no-repeat 0 0; }
div.vessels_list div.pages ul li.selected:hover {background-position:0 -18px;}
div.vessels_list div.pages ul li a.option {float:left; font:normal 13px "Merriweather"; color:#999999; text-decoration:none; padding:1px 0 0 5px;}
div.vessels_list div.pages ul li a.option:hover {color:#666666;}
div.vessels_list div.pages ul li.selected a {color:#FFFFFF; text-decoration:none;}
div.vessels_list div.pages a.next, a#help {float:right; font:normal 13px "Merriweather"; text-decoration:underline; color:#EB593E; margin:0; padding:2px 0 0 0;}
div.vessels_list div.pages a.next:hover {color:#B2432E;}

div.pagination {float:right; height:50px; margin:15px 35px 0 0; font:normal 13px "Merriweather"; padding:0 0 0px 0;}
div.pagination span {float:left; margin:0 2px; width:13px ! important; height:17px ! important; padding:1px 0 0 5px; color:#999; background:none ! important;}
div.pagination a {float:left; margin:0 2px; width:13px; height:17px; padding:1px 0 0 5px; color:#999;}
div.pagination em {float:left; background:url(../images/common/bkg_page_selected.png) no-repeat 0 0; color:#ffffff; padding:2px 5px 3px 5px;}
div.pagination em:hover {background-position:0 -18px;}

div.data div.information.digitalizing_bkg {background:url(../images/home/right_column_bkg.png) repeat-y right 0;}
div.digitalizing_content {position:relative; float:left; margin:30px 0 0 0px; width:570px; background:white; height:1120px;}

div.data div.information div.digitalizing_content div.image {float:left; width:51px; height:51px; margin:0 7px 0 30px; padding:0; background:white; border:none;}
div.data div.information div.digitalizing_content div.image img {float:left; width:49px; height:49px; margin:1px 0 0 1px; border:none;}
div.data div.information div.digitalizing_content div.info {float:left; width:450px;}
div.data div.information div.digitalizing_content h6 {float:left; font:bold 15px "Merriweather"; color:#666666;}
div.data div.information div.digitalizing_content div.info p {float:left; font:normal 13px "Arial"; color:#999999; padding:0;}
div.data div.information div.digitalizing_content div.info p a{font:normal 13px "Merriweather"; color:#EB593E;}
div.data div.information div.digitalizing_content div.info p a:hover{font:normal 13px "Merriweather"; color:#B2432E;}



div.data div.information div.digitalizing_content div.bar {float:left; margin:8px 0 0 0; background:url(../images/digitalizing/bar_empty.png) no-repeat 0 0; width:483px; height:6px; overflow:hidden; padding:0; position:relative;}

div.data div.information div.digitalizing_content div.progress {float:left; border-top:1px solid #E5E5E5; width:600px; padding:28px 0 0px 0; margin:20px 0 0 0; background:white; height:100px;}
div.data div.information div.digitalizing_content div.progress ul {float:left; width:539px; position:relative; margin:0 0 0 30px;}
div.data div.information div.digitalizing_content div.progress ul li {font:bold 11px "Merriweather"; color:#FFFFFF; height:22px; padding-top:10px; text-transform:uppercase;}
div.data div.information div.digitalizing_content div.progress ul li.step1 {background:url(../images/digitalizing/first_progress.png) no-repeat; width:117px; position:absolute; top:0; left:0; z-index:6; padding-left:10px;}
div.data div.information div.digitalizing_content div.progress ul li.step1.current {background:url(../images/digitalizing/first_progress_current.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.step1.passed {background:url(../images/digitalizing/first_progress_checked.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.step2 {background:url(../images/digitalizing/second_progress.png) no-repeat; width:116px; position:absolute; top:0; left:105px; z-index:5; padding-left:30px;}
div.data div.information div.digitalizing_content div.progress ul li.step2.current {background:url(../images/digitalizing/second_progress_current.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.step2.passed {background:url(../images/digitalizing/second_progress_checked.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.step3 {background:url(../images/digitalizing/third_progress.png) no-repeat; width:100px; position:absolute; top:0; left:225px; z-index:4; padding-left:36px;}
div.data div.information div.digitalizing_content div.progress ul li.step3.current {background:url(../images/digitalizing/third_progress_current.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.step3.passed {background:url(../images/digitalizing/third_progress_checked.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.step4 {background:url(../images/digitalizing/fourth_progress.png) no-repeat; width:89px; position:absolute; top:0; left:321px; z-index:3; padding-left:49px;}
div.data div.information div.digitalizing_content div.progress ul li.step4.current {background:url(../images/digitalizing/fourth_progress_current.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.step4.passed {background:url(../images/digitalizing/fourth_progress_checked.png) no-repeat;}
div.data div.information div.digitalizing_content div.progress ul li.stepfinish {background:url(../images/digitalizing/fifth_progress.png) no-repeat right 0; width:68px; position:absolute; top:0; right:0; z-index:2; color:#999999; padding-left:80px;}
div.data div.information div.digitalizing_content div.progress ul li.stepfinish.current {background:url(../images/digitalizing/fifth_progress_finished.png) no-repeat; color:#FFFFFF;}
div.data div.information div.digitalizing_content div.progress ul li.stepfinish.passed {background:url(../images/digitalizing/fifth_progress_checked.png) no-repeat;}

div.data div.information div.digitalizing_content div.digitalization_fake {position:absolute; top:160px; left:-22px; background:url(../images/digitalizing/digitalization_demo.png) no-repeat 0 0; width:630px; height:918px;}
div.data div.information div.digitalizing_content div#digitalization {position:absolute; top:180px; left:-12px; background:url(../images/digitalizing/log_frame.png) no-repeat 0 0; width:630px; height:919px;}
div.data div.information div.digitalizing_content div#digitalization img {margin:7px 0px 0px 5px}

/* lens box */
/*div.data div.information div.digitalizing_content div#digitalization div.lens_confirm {position:absolute; top:80px; left:100px; background:url(../images/digitalizing/lens_confirmed.png) no-repeat 0 0; width:182px; height:92px; z-index:50;}
div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content {position:relative; width:100%; height:100%;}*/

/* push pin */

div.data div.information div.digitalizing_content div#digitalization div.lens_confirm {position:absolute; background:url(../images/digitalizing/pin.png) no-repeat 0 0; width:43px; height:52px; z-index:4;}

/* Clean box*/
/*div.data div.information div.digitalizing_content div#digitalization div.lens_confirm {position:absolute; top:80px; left:100px; width:182px; height:92px; z-index:50; border:solid #000 2px;padding:0 2px 2px 0;}*/
/*div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content {position:relative; width:100%; height:100%;border: solid #fff 1px;}*/

div.data div.information div.digitalizing_content div#digitalization div.lens_confirm:hover div.content div.edit_label {display:block;}
div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content div.edit_label {position:absolute; top:6px; right:8px;height:15px;background:url(../images/digitalizing/label_edit.png) no-repeat; width:58px;display:none; cursor:pointer;}

div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content div.type_label {position:absolute; top:35px; right:7px; height:15px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content div.type_label_weather {background:url(../images/digitalizing/label_weather.png) no-repeat; width:58px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content div.type_label_location {background:url(../images/digitalizing/label_location.png) no-repeat; width:58px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content div.type_label_event {background:url(../images/digitalizing/label_event.png) no-repeat; width:58px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content div.type_label_date {background:url(../images/digitalizing/label_date.png) no-repeat; width:58px;}

div.data div.information div.digitalizing_content div#digitalization div.lens_confirm div.content a.confirm:hover {background-position:0 -15px;}

div.data div.information div.digitalizing_content div#digitalization div.lens_tool {position:absolute; top:320px; left:200px; background:url(../images/digitalizing/lens_tool.png) no-repeat 0 0; width:258px; height:170px; z-index:200; cursor:pointer;}
div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content {position:relative; width:100%; height:100%; }
div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content p.info {font:normal 13px "Merriweather"; color:#666666; position:absolute; top:15px; left:17px;}
div.lens_tool p input {width:100%; height:100%; position:relative; left:-2px; top:-3px;}
div.lens_tool p#input-selector {}


div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content div.data {position:absolute; top:50px; left:50px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content div.data p {font:bold 15px "Merriweather"; color:#666666; width:20px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content div.data p.blue {position:absolute; left:0px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content div.data p.magenta {position:absolute; left:65px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content div.data p.yellow {position:absolute; left:128px;}


div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content a {position:absolute; background:url(../images/digitalizing/ok_digitalized.png) no-repeat 0 0; width:37px; height:26px; top:45px; right:14px;}
div.data div.information div.digitalizing_content div#digitalization div.lens_tool div.content a:hover {background-position:0 -26px;}

div.ship_information {float:right; width:289px; border-left:1px solid #DCDCDC; position:relative; height:auto; margin:0;z-index:20;}
div.ship_information div.content {float:left; margin:30px 0 0 25px; width:200px;}
div.ship_information h1 {float:left; font:normal 25px 'Merriweather', "Merriweather", sans-serif; color:#666666; letter-spacing:-1.0px; padding-bottom:5px;}
div.ship_information p {
  color: #777;
  float: left;
  font: normal 13px "arial";
  width: 220px;
}
div.ship_information a {
  font: normal 13px "arial";
}
div.ship_information div.ship_image {float:left; margin:15px 0 0 0; width:219px; padding:4px; border:1px solid #c6c6c6; background:#E0e0e0;}
div.ship_information p.info {margin:18px 0 0 0;}
div.ship_information p.info a {text-decoration:underline; color:#999999;}
div.ship_information p.info a:hover {color:#666666;}
div.ship_information h3 {float:left; font:normal 21px 'Merriweather', "Merriweather", sans-serif; color:#666666; letter-spacing:-1.0px; margin:25px 0 0 0; padding-bottom:5px;}

div.ship_information div.map_timeline {float:left; width:229px; padding:5px 0 0 0; margin-top: 15px;}
div.ship_information div.map_timeline .top {height: 6px;background:url(../images/digitalizing/bkg_map_timeline.png) no-repeat top left; padding: 0 6px;}
div.ship_information div.map_timeline .upper {margin:0;background:url(../images/digitalizing/bkg_map_middle.png) repeat-y;padding: 0 6px 6px 6px;}
div.ship_information div.map_timeline .lower {margin:0;background:url(../images/digitalizing/bkg_map_timeline.png) no-repeat scroll left bottom transparent; padding: 0 0 10px 6px;}

div.ship_information div.map_timeline div#map {float:left; width:218px; height:135px;}
div.ship_information div.map_timeline ul.information {float:left; width:209px; margin:7px 0 0 0; border-bottom:1px solid #E5E5E5; padding:0 0 15px 9px;}
div.ship_information div.map_timeline ul.information li {float:left; height:25px; margin-top: 10px;}
div.ship_information div.map_timeline ul.information li p.title {font:bold 11px "Merriweather"; color:#CCCCCC; width:100%; margin:0; text-transform:uppercase;}
div.ship_information div.map_timeline ul.information li p.data {font:normal 13px "Merriweather"; color:#666666; width:100%; margin:0;}
div.ship_information div.map_timeline ul.information li.date { border-right:1px solid #E5E5E5; margin-right:10px; width:70px;}
div.ship_information div.map_timeline ul.information li.position { max-width:118px;}	

div.ship_information div.map_timeline ul.data_temp {float:left; width:218px; min-height:155px; margin:0; padding:0; display:inline;}
div.ship_information div.map_timeline ul.data_temp li.row {float:left; width:218px;height:53px; margin:0; padding:0; }
div.ship_information div.map_timeline ul.data_temp li.row ul {float:left; margin:0; padding:0;position:relative;}
div.ship_information div.map_timeline ul.data_temp li.temp_image {float:left; margin:0; padding:0;}
div.ship_information div.map_timeline ul.data_temp li.temp_image img {width:70px; height:49px;}

div.ship_information div.map_timeline ul.data_temp li.data_temp {float:left; width:47px; height:49px; background:url(../images/digitalizing/data_temp.png) no-repeat 0 0; margin:0 0 0 2px;}
div.ship_information div.map_timeline ul.data_temp li.data_event {float:left; width:218px; height:49px; background:url(../images/digitalizing/data_event.png) no-repeat 0 0; margin:0 0 0 0; margin-top:4px;}

div.ship_information div.map_timeline ul.data_temp li.data_event p.material {float:left; font:bold 11px "Merriweather"; text-align:center; text-transform:uppercase; width:218px; height:10px; margin:12px 0 0 0; color:white; line-height:11px;}
div.ship_information div.map_timeline ul.data_temp li.data_event p.event {float:left; font:normal 15px 'Merriweather', "Merriweather", sans-serif; width:218px; margin:8px 0 0; text-align:center; padding:0; line-height:19px; color:white;}

div.ship_information div.map_timeline ul.data_temp li.data_temp p.material {margin:9px 0 0 0;}
div.ship_information div.map_timeline ul.data_temp li.data_event p.material {margin:12px 0 0 0;}

div.delete-cross {
	display: none;
	position:absolute;
	left:-11px;
	top:-5px;
	width:23px;
	height:23px;
	background-image: url(../images/digitalizing/close.png);
	cursor:pointer;
	z-index:100;
}

.lens_confirm div.delete-cross {
	background-image: url(../images/digitalizing/close.png);	
	top:-8px;
	left: -9px;
}

.annotationBox div.delete-cross {
	display:block;
	background-image: url(../images/digitalizing/close.png);	
	top:-6px;
	left: 0px;
	z-index:1000;
}

div.delete-cross:hover {
	background-position: 0 -24px;
}

.map_timeline .lower .row:hover .delete-cross{
  display:block;
}

.scribe_marker:hover .delete-cross{
	display:block;
}

.scribe_marker .scribe_marker_edit{
	display: none;
	background-image: url(../images/digitalizing/edit.png);	
	width: 23px;
	height: 23px;
	left: 15px;
	top: -6px;
	position: absolute;
	cursor: pointer;
	
}

.scribe_marker:hover .scribe_marker_edit{
	display: block;
}


div.ship_information div.map_timeline ul.data_temp li.data_temp p.temperature {float:left; font:normal 19px 'Merriweather', "Merriweather", sans-serif; width:47px; margin:6px 0 0; text-align:center; padding:0; line-height:19px; color:white;}
div.ship_information div.map_timeline ul.data_temp li.data_temp p.temperature sup {font:normal 9px "Merriweather"; padding:0; margin:0; vertical-align:0.9em; line-height:9px;}
div.ship_information div.map_timeline ul.data_temp li.data_temp p.material {float:left; font:bold 11px "Merriweather"; text-align:center; text-transform:uppercase; width:47px; height:10px; margin:9px 0 0 0; color:white; line-height:11px;}
div.ship_information div.map_timeline a.page_finished {float:left;margin:5px 0 0 0; background:url(../images/digitalizing/btn_page_finished.png) no-repeat 0 0; width:217px; height:28px; font:bold 15px "Merriweather"; color:#FFFFFF; text-decoration:none; text-align:center; padding-top:9px;}
div.ship_information div.map_timeline a.page_finished:hover {background-position:0 -37px;}
.push {clear:both;height: 1px;}

/* CONTENT_RIGHT */
div.filter {float:right; width:289px; border-left:1px solid #DCDCDC; position:relative; height:auto;}
div.filter div.content {float:left; margin:30px 0 0 20px;}
div.filter h1 {font:normal 25px 'Merriweather', "Merriweather", sans-serif; color:#666666; letter-spacing:-1.0px; padding-bottom:20px;}

div.filter span.search {float:left; width:240px; margin:0; padding:0;}
div.filter span.search.second {margin:20px 0 0 0;}
div.filter span.search p {float:left; font:bold 11px arial; color:#666; text-transform:uppercase;}

div.filter div.by_source {
  float: left;
  margin: 10px 0px;
  padding: 0;
  width: 240px;
}

div.filter div.by_source h3 {
  color: #666;
  font: bold 11px arial;
  margin: 5px 0;
  text-transform: uppercase;
}

div.filter div.by_source p {
  color: #999;
  font: normal 11px/1.3em arial;
  margin: 5px 0;
}

div.filter div.by_source a {
  font: inherit;
}

div.filter div.by_source ul li {margin-top:10px;}
div.filter div.by_source ul li img {display:inline-block; vertical-align: top; width: 50px; height: 50px;}
div.filter div.by_source ul li div {display:inline-block; vertical-align: top; margin-left: 5px;}
div.filter div.by_source ul li div p a {color:#DA4A18; text-decoration:none;}
div.filter span.search form {float:left; position:relative; margin:4px 0 0 0; padding:0; background:url(../images/vessels/bkg_input_search.png) no-repeat 0 0; width:237px; height:30px;}
div.filter span.search form input[type="text"] {font:normal 13px arial; color:#666666; width:200px; height:20px; border:none; background:transparent; position:absolute; top:5px; left:5px; line-height:17px;}
div.filter span.search form input[type="submit"] {background:url(../images/vessels/search_len.png) no-repeat 0 0; height:15px; width:15px; border:none; position:absolute; top:7px; right:7px; cursor:pointer;}

div.filter ul.links {float:left; width:90px; height:50px; margin:10px 0 0 1px; padding-bottom:35px;}
div.filter ul.links.two {float:left; margin:10px 0 0 30px;}
div.filter ul.links li {float:left; margin:1px 0 0 0; width:100%;}
div.filter ul.links li a {font:normal 13px arial; color:#DA4A18; text-decoration:none;}
div.filter ul.links li a:hover {color:#A53611;}
div.filter ul.links li a.view_all {text-decoration:underline;}
div.filter.vessel {background:url(../images/vessels/container_bkg.png) repeat-y 0 0 white;}

div#vertex_right {background:url(../images/common/vertex_right.png) no-repeat 0 0; width:22px; height:39px; position:absolute; left:-15px; top:29px;} 




/*VESSEL DESC*/
div.data div.information.vessels_desc {background:url(../images/vessels/container_bkg.png) repeat-y 0 0 white;}
div.data div.information div.left {float:left; width:229px; padding:25px 30px;}
div.data div.information div.left h3 {float:left; width:100%; font:normal 25px "Merriweather"; color:#666666;}
div.data div.information div.left p {float:left; margin:4px 0 0 0; width:100%; font:normal 13px "Merriweather"; color:#929292;}
div.data div.information div.left div.image {float:left; margin:15px 0 0 0; width:219px; padding:4px; border:1px solid #c6c6c6; background:#E0e0e0;}
div.data div.information div.left span {float:left; width:229px; height:10px; background:url(../images/vessels/shadow_image.png) no-repeat 0 0;}
div.data div.information div.left a.back {float:left; margin:7px 0 0 0; font:normal 13px "Merriweather"; color:#E45739; text-decoration:none; border-bottom:1px solid #E45739;}
div.data div.information div.left a.back:hover {color:#A53611;}

div.data div.information div.right {position:relative; float:right; width:541px; padding:30px;}
div.data div.information div.right img.arrow {position:absolute; top:25px; left:-1px; width:18px; height:33px;}
div.data div.information div.right h3 {float:left; width:100%; font:bold 20px arial; color:#333333;}
div.data div.information div.right h4 {float:left; width:100%; font:bold 15px arial; color:#333333;}
div.data div.information div.right h4 a{float:left; width:100%; font:bold 15px "Merriweather"; color:#EB593A;}
div.data div.information div.right h4 a:hover{float:left; width:100%; font:bold 15px "Merriweather"; color:#B2432E;}

div.data div.information div.right h4.sub {padding:30px 0 0 0;}
div.data div.information div.right p {float:left; width:100%; font:normal 13px arial; color:#666666; padding:10px 0;}
div.data div.information div.right p a {color:#DA4A18;}
div.data div.information div.right p a:hover {color:#A53611;}


/* INDEX */
div.data div.information.vessel_map {position:relative; background:url(../images/home/right_column_bkg_mini.png) repeat-y right 0;}
div.data div.information.vessel_map div#map {float:left; width:100%; height:400px;}

div.data div.vessel_map div.floating_content {position:absolute; right:35px; top:90px; width:283px; height:210px; padding:19px; z-index:100; background:url(../images/home/float_bkg.png) no-repeat 0 0;}
div.data div.information.vessel_map div.floating_content h2 {float:left; width:100%; font:normal 27px "Merriweather"; color:white; line-height:27px; padding:0; margin:0;}
div.data div.information.vessel_map div.floating_content p {float:left; width:100%; padding:3px 0 0; font:normal 13px "Merriweather"; color:white; line-height:13px;}
div.data div.information.vessel_map div.floating_content div.bar {float:left; width:283px; height:6px; margin:35px 0 0 0; background:url(../images/home/bar_bkg.png) no-repeat 0 0;}
div.data div.information.vessel_map div.floating_content div.inner_bar {position:relative; float:left; width:auto; height:6px; margin:0; padding:0 0 0 2px; background:url(../images/home/left_inner_bar.png) no-repeat 0 0;}
div.data div.information.vessel_map div.floating_content div.inner_bar span {float:left; width:50px; height:6px; background:url(../images/home/right_inner_bar.png) no-repeat right 0;}
div.data div.information.vessel_map div.floating_content div.inner_bar p.bar_tooltip_inner {position:absolute; top:-27px; right:-48px; width:96px; height:18px; padding:4px 0 0 0; text-align:center; background:url(../images/common/white_tooltip.png) no-repeat 0 0; font:bold 10px "Merriweather"; color:#DA4A18; line-height:10px;}
div.data div.information.vessel_map div.floating_content div.info {float:left; width:100%; margin:20px 0 0 0;}
div.data div.information.vessel_map div.floating_content div.info div.image {float:left; width:28px; margin:2px 10px 0 0;}
div.data div.information.vessel_map div.floating_content div.info p {float:left; width:240px; padding:0; margin:0; line-height:15px;}
div.data div.information.vessel_map div.floating_content a{color:#F15A3E;text-decoration:none;}
div.data div.information.vessel_map div.floating_content a.big_link {float:left; width:189px; height:30px; margin:18px 0 0 0; font:bold 19px "Merriweather"; color:#F15A3E; text-decoration:none; padding:7px 0 0 10px; background:url(../images/home/follow_button.png) no-repeat 0 0;}
div.data div.information.vessel_map div.floating_content a:hover {background-position:0 -37px; color:#666666;}

div.data div.information.vessel_map div.orange_container {

  float:left; width:100%;
	background-image: linear-gradient(bottom, #CB301F 47%, #FF3E25 100%);
	background-image: -o-linear-gradient(bottom, #CB301F 47%, #FF3E25 100%);
	background-image: -moz-linear-gradient(bottom, #CB301F 47%, #FF3E25 100%);
	background-image: -webkit-linear-gradient(bottom, #CB301F 47%, #FF3E25 100%);
	background-image: -ms-linear-gradient(bottom, #CB301F 47%, #FF3E25 100%);
  -moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow:0 2px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  border-top: 1px solid #cf3320;
  border-bottom: 1px solid #a52819;
}
div.data div.information.vessel_map div.orange_container h1 {
	float: left; 
	width: 100%; 
	font-size: 44px; 
	font-family: "Merriweather"; 
	font-weight: 400; 
	text-shadow: 0px -1px 0px #960000; 
	line-height: 60px; 
	color: #F2F2F2; 
	text-align: center; 
	padding: 10px 0 0 0;
}

div.data div.information.vessel_map div.orange_container p {float:left; width:100%; font:normal 22px "Merriweather"; color:#FFFFFF; text-align:center;}
div.data div.information.vessel_map div h4 {float:left; width:100%; font:normal 22px "Merriweather"; color:#666666;}
div.data div.information.vessel_map div p {float:left; width:100%; font-family:Arial;  color:#7B7B7B; padding:3px 0 0; font-size:15px;line-height:17px;}
div.data div.information.vessel_map div p a {color:#EB593A;}
div.data div.information.vessel_map div p a:hover {color:#A53611;}
div.data div.information.vessel_map div.left_map {float:left; width:540px; padding:25px 30px; height:334px; background:white;}
div.data div.information.vessel_map div.left_map div.block {float:left; width:173px; margin:25px 10px 0 0;}
div.data div.information.vessel_map div.left_map div.block.last {margin:25px 0 0 0;}
div.data div.information.vessel_map div.left_map div.block div.gray_cont {float:left; width:173px; height:96px;}
div.data div.information.vessel_map div.left_map div.block div.gray_cont img{padding:3px 0px 0px 2px;}


div.data div.information.vessel_map div.left_map div.block h5 {float:left; margin:15px 0 0 0; width:100%; font:bold 15px "Merriweather"; color:#333; text-align:center;}
div.data div.information.vessel_map div.left_map div.block p {float:left; width:100%; padding:4px 0 0 0; font:normal 12px "Arial"; color:#666;text-align:center;}
div.data div.information.vessel_map div.left_map div.block a {color:#EB593A; text-decoration:none;}
div.data div.information.vessel_map div.left_map div.b
lock a:hover {color:#A53611;}

div.data div.information.vessel_map div.right_map {position:relative; float:right; width:230px; padding:25px 30px; height:334px;}
div.data div.information.vessel_map div.right_map img.arrow {position:absolute; left:0; top:28px; width:13px; height:25px;}
div.data div.information.vessel_map div.right_map div.percentage {float:left; margin:25px 0 0 0; width:236px; height:251px; background:url(../images/paper.png) no-repeat 0 0;

 box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */
    padding:20px;}

div.data div.information.vessel_map div.right_map div.percentage span.top_stats {float:left; width:199px; height:43px; margin-bottom:20px; }
div.data div.information.vessel_map div.right_map div.percentage span.top_stats h6 {float:left; font:bold 40px "Merriweather"; color:#EB593D; letter-spacing:-3px; padding:0; width:90px; line-height:45px;}
div.data div.information.vessel_map div.right_map div.percentage span.top_stats p {float:right; font:bold 15px "Merriweather"; color:#EB593D; width:104px; padding:6px 0 0 0; letter-spacing:-1px; margin:0 0 0 4px; line-height:17px;}

div.data div.information.vessel_map div.right_map div.percentage div.bottom{ width:100%; height:100%;}
div.data div.information.vessel_map div.right_map div.percentage div.bottom p { width:90%; height:100%; font-size: 13px; color: #EB593D; padding-left: 20px}
div.data div.information.vessel_map div.right_map div.percentage div.bottom p.icon_page {background: url(../images/icons/page.png) no-repeat left center;}
div.data div.information.vessel_map div.right_map div.percentage div.bottom p.icon_ship {background: url(../images/icons/ship.png) no-repeat left center;}

div.data div.information.vessel_map div.right_map div.percentage div.bottom p span { float:right; color: #999;}
div.data div.information.vessel_map div.right_map div.percentage div.bottom p.line {  color: #999; margin-bottom:3px;}
div.data div.information.vessel_map div.right_map div.percentage div.bottom div.source_stats div.source_stat {  margin-bottom:10px;}




div.data div.information.vessel_map div.left_map_bottom {float:left; width:540px; padding:25px 30px; margin:1px 0 0 0; background:white; height:272px;}
div.data div.information.vessel_map div.left_map_bottom div.block {float:left; width:157px; margin:20px 26px 0 0;}
div.data div.information.vessel_map div.left_map_bottom div.block.last {margin:20px 0 0 0; width:168px;}

div.data div.information.vessel_map div.left_map_bottom div.block h5 {float:left; margin:10px 0 0 0; width:100%; font:bold 15px "Merriweather"; color:#666666;}
div.data div.information.vessel_map div.left_map_bottom div.block h5 a {float:left; margin:10px 0 0 0; width:100%; font:bold 15px "Merriweather"; color:#EB593A; text-decoration:underline;}
div.data div.information.vessel_map div.left_map_bottom div.block h5 a:hover {float:left; margin:10px 0 0 0; width:100%; font:bold 15px "Merriweather"; color:#B2432E; text-decoration:underline;}


div.data div.information.vessel_map div.left_map_bottom div.block p {float:left; padding:10px 0 0 0; width:100%; font:normal 15px "Arial"; color:#666;}
div.data div.information.vessel_map div.left_map_bottom div.block a {color:#EB593A; text-decoration:none;}
div.data div.information.vessel_map div.left_map_bottom div.block a:hover {text-decoration:underline;}

div.data div.information.vessel_map div.right_map_bottom {

    position:relative; float:right; width:289px; height:272px; border-top: solid 1px gainsboro;
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */
    padding:30px;
}
div.data div.information.vessel_map div.right_map_bottom h4 { float:left; background:#F4F4F4; padding:0px; font:normal 25px "Merriweather"; color:black; letter-spacing:-1px;}
div.data div.information.vessel_map div.right_map_bottom p { text-align: left; font-size:12px;}
.projectSliderCarousel {margin-top: 96px;}
div.data div.information.vessel_map div.right_map_bottom ul.projectSlider {width:227px; height:110px; overflow: hidden;}
div.data div.information.vessel_map div.right_map_bottom ul.projectSlider li {float:left; width:227px; padding:0; height:110px; margin:0;}
div.data div.information.vessel_map div.right_map_bottom ul.projectSlider li img {width: 227px; padding:0; height:110px;  float:left;position:relative;}



/* VESSELS */
div.data div.information.vessels {background:url(../images/home/right_column_bkg.png) repeat-y right 0;}
div.data div.information.vessels div.left.top {position:relative; float:left; width:601px; height:390px; margin:0; padding:0;}
div.data div.information.vessels div.left.top img.arrow {position:absolute; right:0; top:20px; width:16px; height:32px;}
div.data div.information.vessels div.left.top div#map {float:left; width:100%; height:100%; padding:0; margin:0;}
div.data div.information.vessels div.left.top div#map span {background:none; width:auto; margin:0; padding:0;}
div.data div.information.vessels div.right.top {float:right; width:229px; height:340px; padding:25px 30px; background:url(../images/vessels/orange_bkg_x.png) repeat-x 0 0;}
div.data div.information.vessels div.right.top h3 {float:left; width:100%; font:normal 25px "Merriweather"; color:white; line-height:25px; padding:0; margin:0;}
div.data div.information.vessels div.right.top p {float:left; width:100%; font:normal 13px arial; color:#853226; padding:5px 0 0; line-height:13px;}
div.data div.information.vessels div.right.top div.image {float:left; margin:15px 0 0 0; width:219px; padding:4px; border:1px solid #9E3A2D; background:#B04132; display: inline-block;}
div.data div.information.vessels div.right.top div.image img {float:left; width:100%;}
div.data div.information.vessels div.right.top span {float:left; width:229px; height:10px; background:url(../images/vessels/orange_shadow.png) no-repeat 0 0;}
div.data div.information.vessels div.right.top p.desc {color:#68261D; line-height:16px;}
div.data div.information.vessels div.right.top p.desc a {color:#68261D;}
div.data div.information.vessels div.right.top p.desc a:hover {color:#000000;}

div.data div.information.vessels div.blue_part {position:relative; float:left; width:100%; height:69px;}
div.data div.information.vessels div.blue_part div.abs {position:absolute; left:-10px; top:0; height:79px; width:910px; background:url(../images/vessels/blue_abs_bkg.png) no-repeat 0 0;}
div.data div.information.vessels div.blue_part div.abs div.bar {float:left; width:587px; height:6px; padding:1px 0 0 0; margin:41px 0 0 24px; background:url(../images/vessels/bar_bkg.png) no-repeat 0 0;}
div.data div.information.vessels div.blue_part div.abs div.inner_bar {position:relative; float:left; width:auto; height:6px; margin:0; padding:0 0 0 2px; background:url(../images/vessels/left_inner_bar.png) no-repeat 0 0;}
div.data div.information.vessels div.blue_part div.abs div.inner_bar span {float:left; width:200px; height:6px; background:url(../images/vessels/right_inner_bar.png) no-repeat right 0;}
div.data div.information.vessels div.blue_part div.abs div.inner_bar p.bar_tooltip_inner {position:absolute; top:-27px; right:-48px; width:96px; height:18px; padding:4px 0 0 0; text-align:center; background:url(../images/common/white_tooltip.png) no-repeat 0 0; font:bold 10px arial; color:#00969C; line-height:10px; display:block; z-index:100;}
div.data div.information.vessels div.blue_part div.abs a {float:right; margin:16px 24px 0 0; width:214px; height:34px; padding:8px 0 0 34px; background:url(../images/vessels/follow_button.png) no-repeat 0 0; font:bold 19px arial; color:#F15A3E; text-decoration:none; text-shadow:white 0 1px;}
div.data div.information.vessels div.blue_part div.abs a:hover {background-position:0 -42px; color:#666666;}


div.data div.information.vessels div.left.bottom {float:left; width:540px; padding:25px 30px;}
div.data div.information.vessels div.right.bottom {position:relative; float:right; width:229px; padding:25px 30px;}
div.data div.information.vessels div h4 {float:left; width:100%; font:normal 25px "Merriweather"; color:#666666;}
div.data div.information.vessels div p {float:left; width:100%; font:normal 15px "Merriweather"; color:#666666; padding:3px 0 0; margin:0; font-family: arial}
div.data div.information.vessels div ul {float:left; width:100%; margin:10px 0 0 0;}

div.data div.information.vessels div.left.bottom ul {border-bottom:1px solid #E5E5E5;}
div.data div.information.vessels div.left.bottom ul li {float:left; padding:12px 0; width:251px; border-bottom:1px solid #E0E0E0;}
div.data div.information.vessels div.left.bottom ul li.long {position:relative; float:left; height:66px; width:542px; border-bottom:none; padding:0; margin:10px 0 0 0;}
div.data div.information.vessels div.left.bottom ul li.long div.abs {position:absolute; left:-5px; top:0; width:532px; padding:8px 5px; height:50px; background:url(../images/vessels/captain_bkg.png) no-repeat 0 0;}
div.data div.information.vessels div.left.bottom ul li.right {float:right; width:266px;}
div.data div.information.vessels div.left.bottom ul li.last {border-bottom:none;}
div.data div.information.vessels div.left.bottom ul li div.image {float:left; width:51px; height:51px; margin:0 7px 0 2px; padding:0; background:url(../images/common/bkg_img_ship.png) no-repeat 0 0; border:none;}
div.data div.information.vessels div.left.bottom ul li div.image img {float:left; width:49px; height:49px; margin:1px 0 0 1px;}
div.data div.information.vessels div.left.bottom ul li div.info {float:left; width:188px;}
div.data div.information.vessels div.left.bottom ul li.right div.info {float:left; width:203px;}
div.data div.information.vessels div.left.bottom ul li div.info h6 {float:left; font:bold 15px arial; color:#666666; padding:0; line-height:15px;}
div.data div.information.vessels div.left.bottom ul li div.info h6 a {float:left; font:bold 15px arial; color:#666666; padding:0; line-height:15px; text-decoration:none;}
div.data div.information.vessels div.left.bottom ul li div.info p.class {float:left; font:normal 13px arial; color:#999999; padding:2px 0 0 0;}
div.data div.information.vessels div.left.bottom ul li div.info p.pages_made {float:left; font:normal 13px arial; color:#EB593E; padding:2px 0 0 0;}

div.data div.information.vessels div.left.bottom div.pages {float:right; height:50px; font:normal 13px "Merriweather"; padding:0;}
div.data div.information.vessels div.left.bottom div.pages ul {float:right; width:120px; height:20px; border:none; margin:15px 0 0 0;}
div.data div.information.vessels div.left.bottom div.pages ul li {float:left; margin:1px 2px 0; width:13px; height:17px; padding:1px 0 0 5px; border:none;}
div.data div.information.vessels div.left.bottom div.pages ul li.selected {background:url(../images/common/bkg_page_selected.png) no-repeat 0 0; padding:0 0 0 5px; height:18px; margin:0 2px 0;}
div.data div.information.vessels div.left.bottom div.pages ul li.selected:hover {background-position:0 -18px;}
div.data div.information.vessels div.left.bottom div.pages ul li a.option {float:left; font:normal 13px "Merriweather"; color:#999999; text-decoration:none; padding:1px 0 0 5px;}
div.data div.information.vessels div.left.bottom div.pages ul li a.option:hover {color:#666666;}
div.data div.information.vessels div.left.bottom div.pages ul li.selected a {color:#FFFFFF; text-decoration:none;}
div.data div.information.vessels div.left.bottom div.pages a.next {float:right; font:normal 13px "Merriweather"; text-decoration:none; color:#EB593E; margin:18px 0 0 6px;}
div.data div.information.vessels div.left.bottom div.pages a.next:hover {color:#B2432E;}


div.data div.information.vessels div.right.bottom ul li {float:left; width:100%; padding:12px 0; border-bottom:1px solid #E0E0E0;}
div.data div.information.vessels div.right.bottom ul li.last {border-bottom:none;}
div.data div.information.vessels div.right.bottom ul li div.image {float:left; width:51px; height:51px; margin:0 7px 0 0; background:url(../images/common/bkg_img_ship.png) no-repeat 0 0;}
div.data div.information.vessels div.right.bottom ul li div.image img {float:left; width:49px; height:49px; margin:1px 0 0 1px;}
div.data div.information.vessels div.right.bottom ul li div.info {float:left; width:171px;}
div.data div.information.vessels div.right.bottom ul li div.info h6 {font:bold 15px "Merriweather"; color:#666666; line-height:15px;}
div.data div.information.vessels div.right.bottom ul li div.info h6 a {font:bold 15px "Merriweather"; color:#666666; line-height:15px; text-decoration:none;}
div.data div.information.vessels div.right.bottom ul li div.info h6 a:hover {color:#333333;}
div.data div.information.vessels div.right.bottom ul li div.info p {font:normal 13px "Merriweather"; color:#999999;}
div.data div.information.vessels div.right.bottom ul li div.bar {float:left; margin:7px 0 0 0; background:url(../images/common/bar_bkg_gray.png) no-repeat 0 0; width:169px; height:6px; overflow:hidden; padding:0;}

div.data div.information.vessels div.right.bottom a.view_all {float:left; font:normal 13px "Merriweather"; color:#DA4A18; margin:18px 0 0 0;}
div.data div.information.vessels div.right.bottom a.view_all:hover {color:#A53611;}

/* Some stupidly wasteful CSS rules */
div.data div.information.vessels div.right.bottom p {
  color: #777;
  float: none;
  font-size: 12px;
  line-height: 1.4em;
  margin: 0 0 13px 0;
  padding: 0;
}
div.data div.information.vessels div.right.bottom a {
  font-size: 12px;
}


/*USER*/
div.data div.information.user {background:url(../images/home/right_column_bkg.png) repeat-y right 0;}

div.data div.information.user div.left.top {float:left; padding:30px; width:540px; height:auto;}
div.data div.information.user div.left.top div.info {float:left; width:100%;}
div.data div.information.user div.left.top div.info div.image {float:left; margin:0 10px 0 0; width:60px; background:url(../images/user/avatar_border.png) no-repeat 0 0 #f5f5f5; padding:5px; border:none;}
div.data div.information.user div.left.top div.info div.image img {float:left; width:60px; height:60px;}
div.data div.information.user div.left.top div.info div.user_info {float:left; width:450px; }
div.data div.information.user div.left.top div.info div.user_info h1 {float:left; width:100%; font:normal 35px "Merriweather"; color:#666666;}
div.data div.information.user div.left.top div.info div.user_info p {float:left; width:100%; font:normal 15px arial; color:#666666; padding:6px 0 0 0;}

div.data div.information.user div.left.top div.numbers {float:left; width:415px; margin:18px 0 0 0; padding:0;}
div.data div.information.user div.left.top div.numbers div.digitalizations {float:left; background:url(../images/user/blue_left.png) no-repeat 0 0; width:auto; padding:0 0 0 3px; height:56px; margin:0 11px 0 0;}
div.data div.information.user div.left.top div.numbers div.digitalizations span {float:left; background:url(../images/user/blue_right.png) no-repeat right 0; width:auto; padding:8px 11px 0 8px; height:48px;}
div.data div.information.user div.left.top div.numbers div.digitalizations p.number {float:left; font:bold 33px arial; color:white; padding:0; width:auto; margin:0 10px 0 0;}
div.data div.information.user div.left.top div.numbers div.digitalizations p.text {float:left; font:normal 13px arial; color:white; padding:4px 0 0 0; width:auto;}
div.data div.information.user div.left.top div.numbers div.vessels {float:left; background:url(../images/user/grey_left.png) no-repeat 0 0; width:auto; padding:0 0 0 2px; height:56px;}
div.data div.information.user div.left.top div.numbers div.vessels span {float:left; background:url(../images/user/grey_right.png) no-repeat right 0; width:auto; padding:8px 11px 0 8px; height:48px;}
div.data div.information.user div.left.top div.numbers div.vessels p.number {float:left; font:bold 33px arial; color:#666666; padding:0; width:auto; margin:0 10px 0 0;}
div.data div.information.user div.left.top div.numbers div.vessels p.text {float:left; font:normal 13px arial; color:#666666; padding:4px 0 0 0; width:auto;}
div.data div.information.user div.left.top a.digitalize {float:right; color:#00CDD7; margin:38px 0 0 0; font:normal 15px arial; width:120px; padding:0; text-align:right;}
div.data div.information.user div.left.top a.digitalize:hover {color:#00AAB0;}

div.data div.information.user div.right.top {float:right; padding:30px; width:230px;}
div.data div.information.user div.right.top div.white_round {position:relative; float:left; width:202px; height:105px; padding:15px 13px; background:url(../images/user/white_bkg_round.png) no-repeat 0 0;}
div.data div.information.user div.right.top div.white_round h5 {float:left; width:100%; font:normal 11px arial; color:#666666;}
div.data div.information.user div.right.top div.white_round div.your_data {float:left; margin:17px 0 0 0; padding:0;}
div.data div.information.user div.right.top div.white_round div.your_data div.image {float:left; width:49px; height:49px; padding:0; border:0; background:none; margin:0 7px 0 0;}
div.data div.information.user div.right.top div.white_round div.your_data div.image img {float:left; width:49px; height:49px; padding:0; margin:0; border:0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info {float:left; width:146px;}
div.data div.information.user div.right.top div.white_round div.your_data div.info h6 {float:left; font:bold 15px arial; color:#666666; width:100%; padding:0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info h6 a {color:#666666; text-decoration:none;}
div.data div.information.user div.right.top div.white_round div.your_data div.info h6 a:hover {color:#DB4A18;}

div.data div.information.user div.right.top div.white_round div.your_data div.info p {float:left; font:normal 13px arial; color:#999999; width:100%; padding:2px 0 0 0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar {float:left; margin:6px 0 0 0; background:url(../images/user/top_bar_bkg.png) no-repeat 0 0; width:147px; height:6px; padding:0; overflow:hidden;}

div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar p.percent_orange {display:none;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar p.percent_blue {display:none;}

div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a {cursor:pointer; margin:0; padding:0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.left {float:left; height:6px; margin:0; width:auto;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.left.orange {background:url(../images/common/left_orange.png) no-repeat 0 0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.left.blue {background:url(../images/common/left_cyan.png) no-repeat 0 0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar span.orange {background-color:#DB4A18; height:6px; width:auto; float:left; margin:0 0 0 2px; padding:0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar span.blue {background-color:#00CFD7; height:6px; width:auto; float:left; margin:0 0 0 2px; padding:0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar span.space {float:left; background-color:#FFFFFF; width:1px; height:6px; margin:0; padding:0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.right {float:left; height:6px; width:2px; margin:0 0 0 0px;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.right.orange {background:url(../images/common/right_orange.png) no-repeat right 0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.right.blue {background:url(../images/common/right_cyan.png) no-repeat right 0;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.second_bar {float:left; height:6px; margin:0 0 0 1px; width:auto;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.second_bar.orange {background-color:#DB4A18;}
div.data div.information.user div.right.top div.white_round div.your_data div.info div.bar a.second_bar.blue {background-color:#00CFD7;}

div.data div.information.user div.right.top div.white_round a.continue {float:right; padding:15px 0 0 0; color:#00CDD7; font:normal 13px "Merriweather";}
div.data div.information.user div.right.top div.white_round a.continue:hover {color:#00AAB0;}

div.data div.information.user div.map_container {position:relative; float:left; height:470px; width:890px;}
div.data div.information.user div.map_container div.abs {position:absolute; width:910px; width:470px; top:0; left:-10px; right:-10px;}
div.data div.information.user div.map_container div.abs div#map {position:absolute; top:0; left:0; width:910px; height:430px;}
div.data div.information.user div.map_container div.abs div.dates {position:absolute; left:0; top:417px; width:910px; height:63px; background:url(../images/user/user_band.png) no-repeat 0 13px;}
div.data div.information.user div.map_container div.abs div.years_container {float:left; width:795px; padding:0;}
div.data div.information.user div.map_container div.abs div.years_container ul {float:left; width:auto; padding:0; margin:0;}
div.data div.information.user div.map_container div.abs div.years_container ul li {float:left; background:url(../images/user/date_separator.png) no-repeat right 12px; width:auto; padding:26px 13px 7px 13px; height:20px;}
div.data div.information.user div.map_container div.abs div.years_container ul li.selected {background:url(../images/user/selected_date.png) no-repeat 0 0;}
div.data div.information.user div.map_container div.abs div.years_container ul li.last {background:none;}
div.data div.information.user div.map_container div.abs div.years_container ul li a {float:left; color:white; font:normal 15px "Merriweather"; line-height:15px;}
div.data div.information.user div.map_container div.abs div.years_container ul li a:hover {color:#F4F4F4;}
div.data div.information.user div.map_container div.abs div.dates a.all {float:right; width:auto; width:89px; padding:26px 13px 7px 13px; height:20px; color:white; text-align:center;}
div.data div.information.user div.map_container div.abs div.dates a.all.selected {background:url(../images/user/selected_all.png) no-repeat 0 0;}

div.data div.information.user div.left.bottom {float:left; width:540px; padding:25px 30px;}
div.data div.information.user div.right.bottom {position:relative; float:right; width:229px; padding:25px 30px;}
div.data div.information.user div h4 {float:left; width:100%; font:normal 25px "Merriweather"; color:#666666;}
div.data div.information.user div p {float:left; width:100%; font:normal 13px arial; color:#666666; padding:3px 0 0; margin:0;}
div.data div.information.user div ul {float:left; width:100%; margin:10px 0 0 0;}

div.data div.information.user div.left.bottom ul {border-bottom:1px solid #E5E5E5;}
div.data div.information.user div.left.bottom ul li {float:left; padding:12px 0; width:251px; border-bottom:1px solid #E0E0E0;}
div.data div.information.user div.left.bottom ul li.right {float:right; width:266px;}
div.data div.information.user div.left.bottom ul li.last {border-bottom:none;}
div.data div.information.user div.left.bottom ul li div.image {float:left; width:51px; height:51px; margin:0 7px 0 0; padding:0; background:white; border:none;}
div.data div.information.user div.left.bottom ul li div.image img {float:left; width:49px; height:49px; margin:1px 0 0 1px; border:none;}
div.data div.information.user div.left.bottom ul li div.info {float:left; width:190px;}
div.data div.information.user div.left.bottom ul li.right div.info {float:left; width:205px;}
div.data div.information.user div.left.bottom ul li div.info h6 {float:left; font:bold 15px arial; color:#666666;}
div.data div.information.user div.left.bottom ul li div.info h6 a {color:#666666; text-decoration:none;}
div.data div.information.user div.left.bottom ul li div.info h6 a:hover {color:#DB4A18;}
div.data div.information.user div.left.bottom ul li div.info p {float:left; font:normal 13px arial; color:#999999; padding:2px 0 0 0;}
div.data div.information.user div.left.bottom ul li div.info div.bar {float:left; margin:7px 0 0 0; background:url(../images/common/bar_bkg_gray_2.png) no-repeat 0 0; width:178px; height:6px; padding:0; overflow:hidden;}
div.data div.information.user div.left.bottom ul li.right div.info div.bar {width:178px;}

div.data div.information.user div.left.bottom ul li div.info div.bar p.percent_orange {display:none;}
div.data div.information.user div.left.bottom ul li div.info div.bar p.percent_blue {display:none;}

div.data div.information.user div.left.bottom ul li div.info div.bar a {cursor:pointer; margin:0; padding:0;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.left {float:left; height:6px; margin:0; width:auto;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.left.orange {background:url(../images/common/left_orange.png) no-repeat 0 0;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.left.blue {background:url(../images/common/left_cyan.png) no-repeat 0 0;}
div.data div.information.user div.left.bottom ul li div.info div.bar span.orange {background-color:#DB4A18; height:6px; width:auto; float:left; margin:0 0 0 2px; padding:0; background-image:none;}
div.data div.information.user div.left.bottom ul li div.info div.bar span.blue {background-color:#00CFD7; height:6px; width:auto; float:left; margin:0 0 0 2px; padding:0;background-image:none;}
div.data div.information.user div.left.bottom ul li div.info div.bar span.space {float:left; background-color:#FFFFFF; width:1px; height:6px; margin:0; padding:0;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.right {float:left; height:6px; width:2px; margin:0 0 0 0px;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.right.orange {background:url(../images/common/right_orange.png) no-repeat right 0;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.right.blue {background:url(../images/common/right_cyan.png) no-repeat right 0;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.second_bar {float:left; height:6px; margin:0 0 0 1px; width:auto;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.second_bar.orange {background-color:#DB4A18;}
div.data div.information.user div.left.bottom ul li div.info div.bar a.second_bar.blue {background-color:#00CFD7;}

div.data div.information.user div.left.bottom p.select {float:left; width:auto; margin:17px 0 0 0; font:normal 13px arial; color:#666666;}
div.data div.information.user div.left.bottom p.select a {color:#00CDD7;}
div.data div.information.user div.left.bottom p.select a:hover {color:#00AAB0;}

div.data div.information.user div.left.bottom div.pages {float:right; height:50px; font:normal 13px "Merriweather"; padding:0; margin:5px 0 0 0;}
div.data div.information.user div.left.bottom div.pages ul {float:right; width:120px; height:20px; border:none; margin:15px 0 0 0;}
div.data div.information.user div.left.bottom div.pages ul li {float:left; margin:1px 2px 0; width:13px; height:17px; padding:1px 0 0 5px; border:none;}
div.data div.information.user div.left.bottom div.pages ul li.selected {background:url(../images/common/bkg_page_selected.png) no-repeat 0 0; padding:0 0 0 5px; height:18px; margin:0 2px 0;}
div.data div.information.user div.left.bottom div.pages ul li.selected:hover {background-position:0 -18px;}
div.data div.information.user div.left.bottom div.pages ul li a.option {float:left; font:normal 13px "Merriweather"; color:#999999; text-decoration:none; padding:1px 0 0 5px;}
div.data div.information.user div.left.bottom div.pages ul li a.option:hover {color:#666666;}
div.data div.information.user div.left.bottom div.pages ul li.selected a {color:#FFFFFF; text-decoration:none;}
div.data div.information.user div.left.bottom div.pages a.next {float:right; font:normal 13px "Merriweather"; text-decoration:none; color:#EB593E; margin:18px 0 0 6px;}
div.data div.information.user div.left.bottom div.pages a.next:hover {color:#B2432E;}

div.data div.information.user div.right.bottom ul li {float:left; width:100%; padding:12px 0; border-bottom:1px solid #E0E0E0;}
div.data div.information.user div.right.bottom ul li.last {border-bottom:none;}
div.data div.information.user div.right.bottom ul li div.image {float:left; width:28px; height:28px; margin:0 7px 0 0; }
div.data div.information.user div.right.bottom ul li div.image img {float:left; width:28px; height:28px; margin:1px 0 0 1px;}
div.data div.information.user div.right.bottom ul li div.info {float:left; width:171px;}
div.data div.information.user div.right.bottom ul li div.info h6 {font:bold 15px arial; color:#666666; line-height:15px; padding:0;}
div.data div.information.user div.right.bottom ul li div.info p.class {float:left; font:normal 13px "Merriweather"; color:#999999; padding:2px 0 0 0;}
div.data div.information.user div.right.bottom ul li div.info p.pages_made {float:left; font:normal 13px "Merriweather"; color:#EB593E; padding:2px 0 0 0;}



/* FOOTER */
div#footer {float:left; width:100%; height:244px; background:#222222; padding:10px 0 0 0;}
div#footer div.content_foo {margin:0 auto; width:890px; padding:29px 0 21px 0;}
div#footer div.content_foo div.block {float:left; width:168px; margin:0 0 0 15px; padding:0;}
div#footer div.content_foo div.block.first {margin:0 0 0 30px;}
div#footer div.content_foo div.block h4 {float:left; width:168px; font:bold 13px arial; color:#767676; padding:0 0 15px 0;}
div#footer div.content_foo div.block p {float:left; width:168px; font:normal 13px arial; color:#5A5A5A; line-height:18px;}
div#footer div.content_foo div.block p a {color:#5E5E5E;}
div#footer div.content_foo div.block p a:hover {color:#CCCCCC; text-decoration:none;}
div#footer div.content_foo p.terms {float:left; width:860px; padding:50px 0 0 30px; font:normal 13px arial; color:#5A5A5A; text-align:left;}
div#footer div.content_foo p.terms a {color:#5A5A5A;}
div#footer div.content_foo p.terms a:hover {color:#CCCCCC; text-decoration:none;}



/*source description*/

div.data div.source_information {float:left; width:890px; background:white;}




div.data div.source_information div.left {float:left; width:541px; padding:25px 30px;}
div.data div.source_information div.left h3 {float:left; width:100%; font:normal 25px "Merriweather"; color:#666666;}
div.data div.source_information div.left p {float:left; margin:20px 0 0 0; width:100%; font:normal 13px "Merriweather"; color:#929292;}

div.data div.source_information div.left div.image {float:left; margin:15px 0 0 0; width:219px; padding:4px; border:1px solid #c6c6c6; background:#E0e0e0;}
div.data div.source_information div.left span {float:left; width:229px; height:10px; background:url(../images/vessels/shadow_image.png) no-repeat 0 0;}
div.data div.source_information div.left a.back {float:left; margin:7px 0 0 0; font:normal 13px "Merriweather"; color:#E45739; text-decoration:none; border-bottom:1px solid #E45739;}
div.data div.source_information div.left a.back:hover {color:#A53611;}

div.data div.source_information div.right {position:relative; float:right; width:229px; padding:30px;}
div.data div.source_information div.right img.arrow {position:absolute; top:25px; left:-1px; width:18px; height:33px;}
div.data div.source_information div.right h4 {float:left; width:100%; font:bold 15px "Merriweather"; color:#333333;}
div.data div.source_information div.right h4 a{float:left; width:100%; font:bold 15px "Merriweather"; color:#EB593A;}
div.data div.source_information div.right h4 a:hover{float:left; width:100%; font:bold 15px "Merriweather"; color:#B2432E;}

div.data div.source_information div.right h4.sub {padding:30px 0 0 0;}
div.data div.source_information div.right p { font:normal 13px "Merriweather"; color:#666666; padding:10px 0; display: inline-block;}
div.data div.source_information div.right .source_total_done p {color:#DA4A18; display: inline-block; float:right;text-transform:uppercase; vertical-align:middle; font-size: 10px; width: 100px; font-family: arial }
div.data div.source_information div.right p a:hover {color:#A53611;}
div.data div.source_information div.right #source_stats { border: 2px solid #B8B8B8; padding:10px ;border-radius: 6px; width:180px;}
div.data div.source_information div.right #source_stats .source_total_done{width: 100%; border-bottom: 1px solid #B8B8B8; height:60px;}
div.data div.source_information div.right #source_stats .source_other_stats {width:100%; margin-top:10px; }

div.data div.source_information div.right #source_stats .source_other_stats li {width:100%; font-size: 13px; color:#DA4A18; font-family: arial;}
div.data div.source_information div.right #source_stats .source_other_stats li .stat_value {float: left; padding-left: 20px;}
div.data div.source_information div.right #source_stats .source_other_stats li .stat_name {float: right; color:#C9C9C9; font-family: arial; font-size:12px; }
div.data div.source_information div.right #source_stats .source_other_stats li .icon_page {background: url(../images/icons/page.png) no-repeat;}
div.data div.source_information div.right #source_stats .source_other_stats li .icon_ship {background: url(../images/icons/ship.png) no-repeat;}

div.data div.source_information div.right .source_total_done h1{ vertical-align:middle; display: inline-block;font:bold 40px "Merriweather"; color:#EB593D; letter-spacing:-3px; padding:0;line-height:45px; }


.annotationBox {		
	position:absolute;		
	font-family: "Merriweather", tahoma, sans-serif;					
	font-size: 70%;
}	

.annotationBox #topSection {
	position: relative;	
	margin: 0 auto;
	z-index: 100;
}

.annotationBox #leftSide {
	float: left;	
	height: 132px;			
	width: 9px;
	background: url('../images/annotationBox/left_side.png') no-repeat;
}

.annotationBox #rightSide {
	float: right;	
	height: 132px;	
	width: 9px;		
	background: url('../images/annotationBox/right_side.png') no-repeat;
}

.annotationBox #topContent {
	height: 111px;
	margin: 0 9px;
	background: url('../images/annotationBox/middle2.png') repeat-x;		
}

.annotationBox #topContent #question {
	padding: 14px 6px ;
	padding-bottom:6px;
	font-size: 1.2em;
	color:#999;
}

.annotationBox #arrow {
	position: relative;		
	height: 15px;
	top: 0px;
	margin: 0 9px;	
	background: url('../images/annotationBox/arrow.png') no-repeat center center;	
	z-index:4;
}

#topInput {
	padding: 4px 10px 0px 10px;
	height: 40px;
}

#bottom {
	position: absolute;
	top: 109px;
	margin: 0 auto;
	z-index:50;
}

#bottom #lensLeft {
	height: 83px;
	width: 13px;
	position:absolute;
	left:-3px;
	background: url('../images/annotationBox/lens_left.png') no-repeat;		
}

#bottom #lensRight {
	position:absolute;
	right:-3px;
	height: 83px;
	width: 13px;
	background: url('../images/annotationBox/lens_right.png') no-repeat;
}

#zoomed {
	position: relative;
	height: 80px;
	border: solid #fff 3px;
	margin: 0 auto;
}

#zoomed #overlay{
	position:relative;	
	height: 80px;
	z-index : 6;
/*	background-image:url("../images/annotationBox/imageOverlay.png");*/
}

#target {
	position:relative;
}

#target img {
	position: absolute;
}

#tabs {
	padding-top:3px;
	padding-bottom:3px;
}

#tabs ul{
	margin-left:0px;
	margin-top:5px;
	border-bottom:1px solid #e0e0e0;
	padding-left:5px;
	height:15px;
}

#tabs li {
	list-style: none;
	background:#f4f4f4;
	border-top:1px solid #e0e0e0;
	border-left:1px solid #e0e0e0;
	border-right:1px solid #e0e0e0;
	display: inline;
	margin: 3px 2px 0px 2px;
	padding:2px 7px 2px 7px;
 	cursor:pointer;
	color: #afafaf;
}

#tabs li.current {
	background:#eb593e;
 	cursor:pointer;
	color: #ffffff;
}

#tabs li:hover {
	color:#000000;
}

.weather_input td{
	padding-left:4px;
}
.weather_input th{
	padding-left:4px;
}

.event_input td{
	padding-left:5px;
}
.event_input th{
	padding-left:5px;
}


.location-input td{
	padding-left:5px;	
}

.location-input th{
	padding-left:5px;
}

.event-input td{
	padding-left:5px;
}
.event-input th{
	padding-left:5px;
}

.ui-draggable-dragging{
	cursor:pointer;
}

.ok_button {
	background: url('/images/digitalizing/ok_digitalized.png') no-repeat;
	border: none;
	margin-left: 0px;
	height: 26px;
	width: 37px;
	top: 1px;
}

.ok_button:hover {
	background-position: 0 -26px;
	cursor: pointer;
}

.weather_input th{
	text-align:center;
}

.overlay {
	width:30px;
	height:30px;
	position:absolute;
}

.helpBox{
	width:250px;
	height:120px;
	opacity:0;
	color:#999;
	position:absolute;
	top: 0px;
	left: 200px;
	background-color:white;
	z-index:49;
	padding:5px;
	border-width:2px;
	border-style:solid;
}

.helpBox a{
	line-height:20px;
	color:#EB593E;
	text-decoration:underline;
	padding-top:5px;
}

.helpBox a:hover{
	color:#B2432E;
}

a#help {
	float:right;
}

#wind_over{
	top: 20px;
	left: 27px;
	background-image:url(../images/annotationBox/red.png);
}

#speed_over{
	top: 20px;
	left: 74px;
	background-image:url(../images/annotationBox/blue.png);
}

#code_over{
	top: 20px;
	left:113px;
	background-image:url(../images/annotationBox/pink.png);
}

#heights_over{
	top: 20px;
	left: 215px;
	background-image:url(../images/annotationBox/purple.png);
}

#air_over{
	top: 20px;
	left: 268px;
	background-image:url(../images/annotationBox/green.png);
}

#bulb_over{
	top: 20px;
	left: 300px;
	background-image:url(../images/annotationBox/yellow.png);
}

#sea_over{
	top: 20px;
	left: 331px;
	background-image:url(../images/annotationBox/dark_green.png);
}

#wind_input{
	color:#F60000;
	
}

#force_input{
	color:#0000F6;;
	
}

#code_input{
	color:#F400BB;
	
}

#heights_input{
	color:#840046;
	
}

#air_input{
	color:#27D500;
	
}
#bulb_input{
	color:#E69E00;
	
}
#sea_input{
	color:#003800;
	
}

#digitalizing{
	background:url(../images/digitalizing/log_frame.png);
	width:919px;
	height:630px;
}

/*For weather result forecast*/

.weather_composite{
	width:70px;
	height:49px;
	position:absolute;
}
.weather_composite_container{
	width:70px;
	height:49px;
	position:relative;
}

.wbackground{
	background-image:url(../images/digitalizing/weather_icons/bg.png);
	z-index:0;
}

.storm{
	z-index:1;
}

.sky{
	z-index:2;
}

.percip{
	z-index:3;
}

/*For combo autocomplete box*/
.ac_results{
	z-index:20000; /* Looks like someone wants this to be shown always :-) */
	font-size: 11px;
	font-family: "Merriweather", tahoma, sans-serif;
	font-style: normal;
	line-height:13px;
}
.ac_odd{
	background-color:#EEEEEE;
	padding:2px 0px 2px 2px;
}

.ac_even{
	background-color:white;
	padding:2px 0px 2px 2px;
	
}

.ac_over{
	background-color: #EB593E;
	color:white;
}



/*for logs page */

#pagelist{
	width:500px;
	height:1000px;
	list-style: none;
	
}

#pagelist li {
	float:left ;
	width:80px;
	height:124px;
	margin:0px;
	padding:3px;
	z-index:0;
	position:relative;
}

/* For the submenu links */

ul.sub-menu{
	padding:0px;
	margin:10px 0 0 0;
	list-style-position: inside;
}

ul.sub-menu li{
	font:normal 13px arial; 
	color:#EB593E; 
	margin:0; 
	padding:2px 0 0 0px;
	line-height:18px;
	list-style-type:square;
	list-style-position: inside;
}

.sub-menu li a{
	text-decoration:underline;
	color:#EB593E; 
	margin:0; 
	padding:2px 0 0 0;		
}

.jcarousel-skin-tango .jcarousel-container {
    background: #ffffff;
		height:160px;
		margin-top:50px;
}

.jcarousel-skin-tango .jcarousel-direction-rtl {
	direction: rtl;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 460px;
    padding: 0px 40px;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  460px;
		top:5px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 80px;
}

ul#recents_carousel{
	border:none;
}

ul#recents_carousel li.jcarousel-item{
	width:140px;
	border:none;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
	margin-left: 0;
    margin-right: 20px;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal {
	margin-left: 10px;
    margin-right: 0;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 53px;
    right: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url('../images/new_next_horizontal.png') no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: 5px;
    right: auto;
    background-image: url('../images/new_prev_horizontal.png');
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 53px;
    left: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url('../images/new_prev_horizontal.png') no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: 5px;
    background-image: url('../images/new_next_horizontal.png');
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

#recents_carousel li p.classification_meta{
	color: #999;
	display: inline;
	float: none;
	font-family: "Merriweather";
	font-size: 13px;
	font-style: normal;
	font-variant: normal;
}

.player{
	position:relative;
}

.player div {
	position:absolute;
	top: 0px;
	left: 0px;
	width: 166px;
	height: 91px;
	z-index: 100;
  background: transparent url('../images/player/play_sprite.png') no-repeat 65px 26px;
}

.player div:hover {
	position:absolute;
	top: 0px;
	left: 0px;
	width: 166px;
	height: 91px;
	z-index: 100;
  background: transparent url('../images/player/play_sprite.png') no-repeat 65px -58px;
}

.sub_block{
	margin-top:12px;
	height:160px;
}

/* Flash box */

div#error, div#notice, div#warning{
	position:absolute;
	top:35px;
	width:100%;
	background:#a8e984;
	border-bottom:1px solid #64af3a;
	height:73px;
	opacity: 0.9;
	
}

.flash p{
	text-align:center;
	padding-top:28px;
	font-family:"Merriweather", Helvetica, sans-serif;
	font-color:#3c3c3c;
	font-size:14px;
}

a.unfollow{
	color: #DA4A18;
	float: none;
	font-family: "Merriweather";
	font-size: 13px;
	height: 0px;
	text-decoration: underline;
}

a.unfollow:hover{
	color: #A53611;
}

.saving{
	font-size:18pt;
	color:#DC4E1A ! important;
	
}

#collection-source{
  width:890px;
  height:400px;
  background-color: rgb(0 ,181 ,190);
  text-align:center;
    position:relative;
  z-index: 0;
}

#collection-source .fade_outer{
  width: 890px;
  height: 400%;
  overflow:hidden;
  position:relative;
}

#collection-source .fade_inner{
  position:relative;
	width: 890px;
	height: 400px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	padding: 40px 20px 100px 40px;
	cursor: pointer;
  float:left;
}

#collection-source .home_ship_banner{
  background: no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



#collection-source .fade_inner img.source_icon{
  position:absolute;
  top:165px;
  left:130px;
  width: 60px;
  height: 60px;
}

#collection-source .source_info{
  display:inline-block;
  vertical-align: middle;
}

#collection-source .fade_inner  h1 {
  margin-left: 60px;
  margin-right: auto;
  width: 530px;
  color: #041D22;
  font-size: 30px;
  padding-top: 100px;
  font-family: "Merriweather";
  font-weight: 700;
  text-shadow: 0px 1px 0px #1EB3BD;
  text-align: left;
  margin-top: 20px;
}


#collection-source .fade_inner p{
  margin-left: 60px;
  margin-right: auto;
  width: 530px;
  text-align: left;
  color: white;
  font-size: 16px;
  line-height: 22px;
  font-family: Arial;
  text-shadow: 0px 1px 2px #08373A;
}
.collection_description{
  border-bottom:1px solid #dcdcdc;
  width:100%;
  height:105px;
  padding:30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
	z-index:2;
}

.collection_description img{
  display: inline-block;
  vertical-align:middle;
}
.collection_details{
  display: inline-block;
  margin-left:20px;
  vertical-align:middle;
}
.collection_description h1{
  font-size: 36px;
  font-family: "Merriweather";
  font-weight: 700;
  color:black;
  
}

.collection_description h2{
  font-size: 28px;
  color:#C9C9C9;
  font-family: arial;
  font-size: 15px;
}
.collection_description a{
  float:right;
  margin-right: 27px;
  color:#DA4A18;
  vertical-align:middle;

 font: 14px arial;
}

h2.section_header{
  color: #C9C9C9;
  font-size: 12px;
  margin: 0px;
  padding: 0px;
  text-transform: uppercase;
  font-family: arial;
  line-height:17px;

}
div.data div.source_information div.left div.section  p {
  padding:0px;
  margin:0px 0px 10px;
 font: 14px arial;
 line-height: 18px;

}

div.data div.source_information div.left div.section  p.caption {
  padding:0px;
  margin:0px 0px 10px;
 font: 12px arial;
 line-height: 14px;
}


#more_source_details{
  border:none;
  margin-bottom: 20px;
}

#more_source_details{
  width:100%;
}

#more_source_details li:first-child{
  border:none;
  padding:10px 10px 10px 0px;
}

#more_source_details li{
  display: inline-block;
  vertical-align: middle;
  height: 40px;
  border-left: 1px #dcdcdc solid;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px;
}

#more_source_details li p{
  color: #999;
  font-size: 12px;
  margin: 0px;
  padding: 0px;
  font-family: arial;
  line-height:15px;
}

/* Sigh */
.source_information h4 {
  color: #666;
  font-family: arial;
  font-size: 12px;
  line-height: 17px;
  margin: -5px 0px 0px 0px;
  padding: 0px;
  text-transform: uppercase;
}

.source_information p {
  float: none !important;
}
  




.arrow-n,
.arrow-e,
.arrow-s,
.arrow-w {
  /*
   * In Internet Explorer, The"border-style: dashed" will never be
   * rendered unless "(width * 5) >= border-width" is true.
   * Since "width" is set to "0", the "dashed-border" remains
   * invisible to the user, which renders the border just like how
   * "border-color: transparent" renders.
   */
  border-style: dashed;
  border-color: transparent;
  border-width:16px;
  display: -moz-inline-box;
  display: inline-block;
  /* Use font-size to control the size of the arrow. */
  font-size: 18px;
  height: 0;
  line-height: 0;
  position: relative;
  vertical-align: middle;
  width: 0;
  padding-bottom: 0px;
  left:110px;
}

.arrow-n {
  border-bottom-width: 1em;
  border-bottom-style: solid;
  border-bottom-color: white;
  bottom: 0.25em;
}

.arrow-e {
  border-left-width: 1em;
  border-left-style: solid;
  border-left-color: #666;
  left: 0.25em;
}
                    
.arrow-s {
  border-top-width: 1em;
  border-top-style: solid;
  border-top-color: #666;
  top: 0.25em;
}

.arrow-w {
  border-right-width: 1em;
  border-right-style: solid;
  border-right-color: #666;
  right: 0.25em;
}

 .carousel-pagination{
  float:right;
  margin-top:10px;
 }

 .carousel-pagination li {
            display:block;
            width:10px;
            height:10px;
            margin-right:5px;
            cursor:pointer;
            float:left;
            background:#8B8B8B;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            border-radius: 10px;
        }
        
        .carousel-pagination .carousel-pagination-active {
            background:#222222;
        }

.ui-datepicker{
  background-color: white;
}


#inline_tutorial_outer {
  width:300px;
  color: #FFFFFF;
  height:160px;
  background-color:#505050;
  border:3px solid #303030;
  position:absolute;
  margin:0px;
  padding:0px;
  display:none;
  -moz-border-radius: 5px;
  border-radius: 5px;
  z-index: 10000;
  font: normal 12px/15px Prelude, Arial, sans-serif;
  -moz-box-shadow: 0px 3px 6px #000;
  -webkit-box-shadow: 0px 3px 6px #000;
  box-shadow: 0px 3px 6px #000;
  /* For IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=180, Color='#000000')";
  /* For IE 5.5 - 7 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=180, Color='#000000'); 
}

#inline_tutorial_box{
  width:100%;
  height:100%;
  position:relative;
  top:0px;
  left:0px;
  margin:0px;
  padding:0px;

}

#inline_tutorial_box .tutorial_header{
  color:#FFFFFF;
  font-size:15px;
  top:10px;
  left:5px;
  text-transform: uppercase;
  font: normal 14px/14px Prelude, Arial, sans-serif;
  margin-left:10px;
  margin-top:10px;
}

#inline_tutorial_box .tutorial_text{
  top:30px;
  left:5px;
  position:absolute;
  margin-left:8px;
}

#inline_tutorial_box .tutorial_text a{
  color: white;
}

#inline_tutorial_box .controls{
  background-color:#303030;
  position:absolute;
  width:100%;
  height:20px;
  bottom:10px;
  text-transform: uppercase;
  font: normal 10px/20px Prelude, Arial, sans-serif;
}

#inline_tutorial_box .controls .tutorial_previous{
  color:#FFFFFF;
  position:absolute;
  left:10px;
  border:0px;
  padding:0px;
  cursor:pointer;
  bottom:-2px;
}

#inline_tutorial_box .controls .tutorial_next, #inline_tutorial_box .controls .prompt{
  color:#FFFFFF;
  position:absolute;
  right:10px;
  border:0px;
  padding:0px;
  cursor:pointer;
  bottom:-2px;
}

.tutorial_indicator {
  position:absolute;
  z-index:1000000000;
}



.inline-arrow-top {
        width: 0;
        height: 0;
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        border-bottom: 20px solid #303030;
        position:absolute;
        top:-20px;
}

.inline-arrow-bottom {
        width: 0;
        height: 0;
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        border-top: 20px solid #303030;
        position:absolute;
        bottom:-20px;
}

.inline-arrow-right {
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-left: 20px solid #303030;
        position:absolute;
        right:-20px;
}

.inline-arrow-left {
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent; 

        border-right:20px solid #303030;
        position:absolute;
        left:-20px;
}

.weather_composite_container{
  position:relative;
}

.hour_number{
  position: absolute;
  bottom:2px;
  right:2px;
  z-index: 1000;
  color:#666666;
  font-size:12px;

}