/* RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    font-weight: normal;
}

body {
    line-height: 1;
}

blockquote, q {
    quotes: none;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}

del {
    text-decoration: line-through;
}

em {
    font-style: italic;
}

strong {
    font-weight: bold;
}

abr {
    border-bottom: 1px dotted;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* Contents (in order)

Basic Layout
Headings
Basic Links
Buttons and Forms
Specific Module Styling
Main Content
Feeds
Trip Data
Users/vCards
Other Main Content
Sign Up Step-By-Step
Footer Styling
Front Page Styling

*/

html {
    background: #3f7999 url(../../images/texture-bg.jpg);
}

body {
    background: url(../images/compass.gif) -120px -120px no-repeat fixed;
    color: #fff;
    font-family: "Calibri", Arial, Tahoma, sans-serif;
    font-size: 14px;
    line-height: 20px;
}

p {
    padding-bottom: 20px;
}

ul, ol {
    padding: 0 0 20px 40px;
}

/* ======================== BASIC LAYOUT =========================================================*/

/* main layout sizes */

#header,
#main,
#footer {
    clear: both;
    margin: 0 auto;
    width: 940px;
}

#header {
    overflow: hidden; /* clears its contained children */

    width: 980px;
}

#main {
    background: #fff;
    color: #333;
    padding: 20px;
}

#main:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.options #main #primary {
    float: left;
    padding-right: 25px;
    width: 305px;
}
.options #main #primary2 {
    float: left;
    padding-right: 25px;
    width: 600px;
}

.main-feed #main #primary,
.dashboard #main #primary {
    float: left;
    padding-right: 25px;
    width: 625px;
}

.dashboard #main #primary {
    padding-right: 0;
    width: 650px;
}

#main #aside,
.options #main #secondary {
    float: right;
    width: 280px;
}

.single #main #primary {
    margin: 0 auto;
}

/* ======================== HEADINGS ================================================================*/

h1, h2, h3, h4, h5,
h1 a, h2 a, h3 a, h4 a, h5 a {
    color: #254557;
    font-size: 15px;
    font-weight: bold;
}

#main h1,
#photo h2,
#video h2,
#blog-post h2 {
    background: #179CE4;
    color: #fff;
    margin-bottom: 20px;
    padding: 5px 10px;
}

#photo h2,
#video h2,
#blog-post h2 {
    margin-bottom: 15px;
}

#crewlist h2 {
    padding-bottom: 10px;
}

#view-error #main h1 {
    background: #992620;
}

.single div#main h1 {
    text-align: center;
}

h2 {
    padding-bottom: 15px;
}

#main h3 {
    background: #179ce4;
    color: #fff;
    clear: both;
    display: block;
    margin-bottom: 15px;
    padding: 5px 10px;
}

#main h3 a {
    color: #fff;
}

/* ======================== BASIC LINKS =========================================================*/

a {
    color: #fff;
}

#main .view-all {
    color: #666;
    float: right;
    text-align: right;
}

#main a {
    color: #333;
}

/* ======================== BUTTONS AND FORMS =====================================================*/

/* buttons */
.button {
    background: #64beee;
    -webkit-border-radius: 15px 5px 15px 5px;
    -moz-border-radius: 15px 5px 15px 5px;
    -o-border-radius: 15px 5px 15px 5px;
    border-radius: 15px 5px 15px 5px;
    color: #254557;
    cursor: pointer;
    display: block;
    float: left;
    font-size: 15px;
    font-weight: bold;
    line-height: 1em;
    padding: 6px 17px;
    text-align: center;
    text-decoration: none;
    text-transform: capitalize;
}

.button:hover,
#main .button:hover {
    background: #254557;
    color: #64beee;
}

.load-more {
    margin-top: 20px;
    margin-left: 150px;
    width: 300px;
}

#main .following,
#main .following:hover {
    background: #DADDE0;
    color: #7A7C7D;
}

#main a.count {
    background: #179CE4;
    color: #fff;
    float: left;
    padding: 3px 7px;
}

/* add new trip button */

#header #subnav li.add-new-trip {
    float: right;
}

#header #subnav li a.button {
    background: #64beee;
    -webkit-border-radius: 15px 5px 15px 5px;
    -moz-border-radius: 15px 5px 15px 5px;
    -o-border-radius: 15px 5px 15px 5px;
    border-radius: 15px 5px 15px 5px;
    color: #254557;
    float: right;
    height: 15px;
    line-height: 1em;
    margin-top: 5px;
    margin-right: 20px;
    padding-top: 6px;
    text-transform: capitalize;
}

#header #subnav li a.button:hover {
    background: #254557;
    color: #64beee;
}

/* forms *****************/

form ul {
    padding: 0;
}

form ul li {
    list-style-type: none;
}

form p {
    padding-bottom: 10px;
}

form fieldset {
    background: #E8E8E8;
    padding: 10px;
}

form img {
    margin: 0 auto;
}

legend {
    font-weight: bold;
    padding-bottom: 10px;
}

label {
    display: block;
    padding-bottom: 5px;
}

input, textarea {
    background: #fdfdfd;
    border: 1px solid #ccc;
    color: #4e6876;
    font-family: "Calibri", Arial, Tahoma, sans-serif;
    font-size: 14px;
    line-height: 20px;
    padding: 5px;
}

input:focus,
textarea:focus {
    border-color: #64BEEE;
}

input.text {
    width: 365px;
}

input.short-url {
    margin-top: 5px;
    margin-left: 10px;
    width: 120px;
}

textarea {
    width: 365px;
}

input.submit {
    border: none;
}

select {
    width: 200px;
}

.checkbox-list,
.single #main div#primary .checkbox-list {
    border-top: 1px dotted #ccc;
    margin: 0;
    overflow: hidden; /* clear contained children */
    padding: 5px 0 20px 0;
    width: 380px;
}

#aside form#signup .checkbox-list,
#aside form#signup .checkbox-list li {
    border: none;
    margin-bottom: 0;
}

.checkbox-list li {
    border-bottom: 1px dotted #ccc;
    clear: left;
    margin-bottom: 5px;
    overflow: hidden; /* clear contained children */
}

.checkbox-list li input {
    clear: left;
    float: left;
    margin-right: 10px;
    width: 15px;
}

.checkbox-list li label {
    display: block;
    float: left;
    width: 335px;
}

p.info,
.single #main div#primary p.info {
    clear: both;
    color: #2F6786;
    font-size: 12px;
    margin-left: 25px;
    padding-bottom: 15px;
    width: 335px;
}

#main .delete,
#main .cancel {
    color: #99251F;
}

/* form errors */

div.fieldWithErrors input.text,
div.fieldWithErrors textarea {
    border: 1px solid red;
}

/* search form */
form.search {
    background: #fff;
    float: right;
    width: 300px;
}

form.search fieldset {
    background: #fff;
    padding: 15px 20px;
}

form.search label.labelled {
    /* class is applied if jQuery is in use*/
    display: none;
}

form.search input {
    height: 18px;
    float: left;
}

form.search input.text {
    width: 215px;
}

form.search input.button {
    border: 1px solid #64BDED;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -o-border-radius: 0;
    height: 30px;
    padding: 0;
    width: 30px;
}

form.search input.button:hover {
    border: 1px solid #254557;
}

/* comment form */

form#leave-comment fieldset {
    background: #fff;
    padding: 0 10px 15px 10px;
}

form#leave-comment label {
    position: absolute;
    text-indent: -999999px;
}

form#leave-comment textarea {
    width: 595px;
}

form#leave-comment input.button {
    float: right;
    margin-top: 5px;
    padding: 5px 15px;
}

/* find crew form */

div#crewlist form {
    clear: both;
    margin-bottom: 20px;
}

div#crewlist form input.text {
    float: left;
    width: 180px;
}

div#crewlist form input.button {
    margin-left: 5px;
    padding: 5px 15px;
}

/* sign up form */

div.user-url {
    width: 375px;
}

div.user-url input {
    float: right;
    margin-top: -5px;
    width: 225px;
}

form#new_user fieldset {
    margin-bottom: 10px;
}

form#new_user label {
    font-weight: bold;
}

#main div#primary form#new_user ul.checkbox-list {
    border-top: none;
    padding-bottom: 0;
}

form#new_user ul.checkbox-list label {
    font-weight: normal;
}

form#signup fieldset input.password {
    margin-bottom: 5px;
}

form#signup input.button,
form#new_user input.button {
    margin: 0 0 0 125px;
}

/* quick sign up form */

#aside form#signup {
    background: #E8E8E8;
}

#aside form#signup fieldset {
    background: none;
    padding: 0 10px;
}

#aside form#signup label {
    margin-top: 10px;
}

#aside form#signup input.text {
    width: 248px;
}

#aside form#signup div.user-url input.text {
    width: 115px;
}

#aside form#signup fieldset .checkbox-list {
    margin-top: 10px;
}

#aside form#signup fieldset .checkbox-list li input.checkbox {
    margin-top: 10px;
}

#aside form#signup fieldset .checkbox-list li label {
    width: 220px;
    padding-bottom: 0;
}

#aside form#signup input.button {
    padding: 5px 15px;
    margin-left: 65px;
    margin-bottom: 10px;
}

/* settings forms */

form#settings fieldset {
    width: 380px;
}

form#settings fieldset.birthday select,
form#settings fieldset.birthday label {
    float: left;
    width: auto;
}

form#settings fieldset.birthday label {
    margin-bottom: 0;
}

form#settings fieldset.birthday select {
    margin: 0 20px 0 10px;
    width: 65px;
}

form#settings fieldset.birthday select#birthday {
    width: 55px;
}

form#settings fieldset.birthday select#birthmonth {
    width: 75px;
}

#view-privacy form fieldset {
    padding-bottom: 0; /* taking out excess padding caused by lots of small fieldsets */
}

form#settings fieldset input.password {
    margin-bottom: 5px;
}

form#settings fieldset input.button {
    margin: 0 0 10px 130px;
}

body#view-settings-mobile #main div#primary form fieldset input.text {
    width: 60px;
}

body#view-settings-mobile #main div#primary form fieldset p.info {
    margin-left: 5px;
    padding-top: 10px;
    padding-bottom: 0;
    width: 360px;
}

/* find people */

body#view-people #main input.button {
    padding: 5px 50px;
}

/* post trip assets */

form#post-blog-post input.button,
form#post-comment input.button,
form#post-photo input.button,
form#post-video input.button {
    margin: 0 0 0 140px;
}

/* login form */

body.login div#main form#new_user_session div#errorExplanation {
    margin: 0 auto 5px auto;
    padding: 10px;
}

body#front-page #main form#new_user_session div#errorExplanation p {
    font-size: 14px;
    font-weight: normal;
    margin-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    width: 280px;
}

body.login div#main form#new_user_session div#errorExplanation h2,
body.login div#main form#new_user_session div#errorExplanation p {
    font-size: 15px;
    line-height: 20px;
    margin-bottom: 10px;
    text-align: left;
}

body#front-page #main form#new_user_session div#errorExplanation ul {
    margin: 0;
    padding: 0;
    width: 280px;
}

body#front-page #main form#new_user_session div#errorExplanation ul li {
    color: #fff;
    font-size: 14px;
    margin-left: 15px;
    margin-bottom: 5px;
    line-height: 20px;
    list-style-type: disc;
}

/* add crew member */

input#search_by_name {
    float: left;
    margin-top: 5px;
    margin-right: 10px;
    width: 365px;
}

body#add-crew div#main h2 {
    margin-left: 5px;
}

body#add-crew form.edit_trip select,
body#add-crew form.edit_trip input {
    float: left;
    margin-top: 10px;
    margin-left: 5px;
}

body#add-crew form.edit_trip select#trip_skipper_id {
    margin-left: 5px;
}

body#add-crew form label {
    font-weight: bold;
    margin-left: 5px;
}

body#add-crew form.edit_trip select {
    margin: 10px 10px 0 10px;
}

body#add-crew div#main form input.button {
    margin-top: 5px;
    padding: 5px 15px;
}

body#add-crew div#results {
    clear: both;
    margin-top: 20px;
}

body#add-crew div#results ul.users {
    clear: both;
    float: left;
    padding-top: 45px;
}

/* add trip/edit trip */

form#new_trip fieldset,
form.edit_trip fieldset {
    clear: left;
    margin-bottom: 10px;
}

form#new_trip fieldset select,
form.edit_trip fieldset select {
    float: left;
    margin: 0 5px;
    width: 115px;
}

form#new_trip fieldset textarea#trip_description,
form.edit_trip fieldset textarea#trip_description {
    height: 100px;
}

form#new_trip fieldset select#trip_wind_force_min,
form.edit_trip fieldset select#trip_wind_form_min {
    float: none;
    margin-bottom: 10px;
}

form#new_trip fieldset input#trip_boat_attributes_name,
form.edit_trip fieldset input#trip_boat_attributes_name {
    float: left;
    margin-right: 10px;
    width: 280px;
}

#main div#primary form#new_trip fieldset p,
#main div#primary form.edit_trip fieldset p {
    float: left;
    padding-top: 5px;
    padding-left: 5px;
    width: 260px;
}

#main div#primary form.edit_trip fieldset p {
    width: 250px;
}

/* find people form */

body#view-people div#primary form legend {
    position: absolute;
    margin-top: -50px;
}

body#view-people div#primary form fieldset {
    background: #fff;
    float: left;
    margin-top: 40px;
    width: 260px;
}

body#view-people div#primary form fieldset label {
    color: #4C86A6;
    font-weight: bold;
}

body#view-people div#primary form fieldset input.text {
    width: 240px;
}

body#view-people div#primary form p.alternative {
    color: #254557;
    display: block;
    float: left;
    font-size: 16px;
    font-weight: bold;
    margin: 80px 20px 0 10px;
    text-align: center;
    text-transform: uppercase;
    width: 20px;
}

body#view-people div#primary form fieldset input.submit {
    margin-top: -40px;
    margin-left: 220px;
}

/* write post and add content forms */

form#new_post,
form#new_photo,
form#new_video {
    margin: 0 auto;
    width: 400px;
}

form#new_post label,
form#new_photo label,
form#new_video label {
    font-weight: bold;
}

form#new_post fieldset,
form#new_photo fieldset,
form#new_video fieldset {
    margin-bottom: 10px;
}

form#new_photo input#photo-title {
    width: 368px;
}

form#new_photo a.delete,
form#new_video a.delete {
    float: right;
    margin-top: 10px;
}

form#new_photo textarea,
form#new_video textarea {
    height: 60px;
}

form#new_post input.button,
form#new_photo input.button,
form#new_video input.button {
    margin-left: 145px;
}

form#new_video fieldset input.upload {
    float: none;
    margin-top: 10px;
    margin-left: 0;
}

/* login form ***************/

body.login div#main h2 {
    background: #1886E1;
    color: #fff;
    padding: 0;
    text-align: center;
    width: 100%;
}

body.login form#new_user_session {
    margin: 20px auto 0 auto;
    width: 300px;
}

body.login form#new_user_session fieldset {
    margin-bottom: 10px;
}

body.login form#new_user_session label {
    font-weight: bold;
}

body.login form#new_user_session input {
    margin: 0 auto;
    width: 270px;
}

body.login form#new_user_session fieldset span {
    clear: both;
    display: block;
    font-style: italic;
    margin-top: 5px;
}

body.login form#new_user_session input.button {
    margin-left: 95px;
    width: 120px;
}

/* login form error */

body.login form#new_user_session div.errorExplanation {
    padding-top: 10px;
}

body.login form#new_user_session div.errorExplanation h2 {
    background: none;
    font-size: 16px;
}

body#front-page p {
    color: #fff;
    font-size: 14px;
    font-weight: normal;
    padding: none;
}

/* settings forms ***************/

/* general settings */

body#view-settings-personal form#settings fieldset {
    margin-bottom: 10px;
}

body#view-settings-personal form#settings legend {
    position: absolute;
}

body#view-settings-personal form#settings fieldset img {
    margin-top: 30px;
}

body#view-settings-personal #main div#primary form#settings fieldset p {
    margin: 30px 0 0 5px;
    width: 300px;
}

body#view-settings-personal form#settings fieldset a {
    display: block;
    float: right;
    text-align: right;
    width: 100px;
}

body#view-settings-personal form#settings fieldset a.delete {
    float: left;
    text-align: left;
}

body#view-settings-personal #main div#primary form#settings fieldset ul.checkbox-list {
    padding-bottom: 0;
}

body#view-settings-personal form#settings fieldset input.button {
    margin-bottom: 0;
}

/* password form */

body#view-settings-password form#settings fieldset {
    margin-bottom: 10px;
}

body#view-settings-password form#settings fieldset input#user_password {
    margin-bottom: 10px;
}

body#view-settings-password form#settings fieldset input.button {
    margin-bottom: 0;
}

/* edit map form */

body#edit-map form input#path_file {
    float: left;
    margin-right: 10px;
}

/* ======================== SPECIFIC MODULE STYLING ==============================================*/

/* ======================== HEADER ==============================================*/

/* login and out ***************/
#loginout {
    color: #d7f2ff;
    text-align: right;
    margin: 0 auto;
    overflow: hidden; /* clear contained children */
    padding: 5px 20px;
    width: 940px;
}

#loginout a.button {
    font-size: 14px;
    float: right;
    margin-left: 20px;
    padding: 5px 10px;
}

/* navigation ***************/

#header ul {
    height: 40px;
    float: left;
    margin-top: 10px;
    padding: 0;
    width: 680px;
}

#header ul li {
    float: left;
    list-style-type: none;
}

#header ul li a {
    background: #179ce4;
    border-top: 2px solid #4ab2eb;
    color: #fff;
    display: block;
    font-size: 15px;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
    margin-right: 3px;
    text-align: center;
    text-decoration: none;
    width: 140px;
}

#header ul li.current a,
#header ul li a:hover {
    background: #fff;
    border-top-color: #fff;
    color: #254557;
    height: 40px;
}

#header #subnav {
    background: #fff url(../images/subnav-border.gif) bottom left repeat-x;
    height: 40px;
    margin-top: -11px;
    padding: 10px 0 5px 10px;
    width: 970px;
}

#header #subnav li a {
    background: none;
    border: none;
    color: #254557;
    height: 33px;
    margin: 0 10px;
    padding-top: 0;
    width: 100px;
}

#header #subnav li.current {
    background: url(../images/selected-triangle.gif) bottom center no-repeat;
    margin-top: 0;
    margin-bottom: -9px;
    padding-bottom: 9px;
}

#header #subnav li.current a {
    background: #2f6786;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    color: #fff;
    height: 35px;
    margin-bottom: 0;
    width: 130px;
}

#header #subnav li a:hover {
    color: #1692D6;
}

#header #subnav li.current a:hover {
    color: #fff;
}

/* little pro emblem */

#header ul li a abbr.pro {
    color: #179ce4;
    display: block;
    font-size: 12px;
    margin-top: -50px;
    margin-left: 90px;
    position: absolute;
    text-transform: uppercase;
}

body#view-profile #header ul li a abbr.pro,
body#view-settings-personal #header ul li a abbr.pro,
body#view-settings-password #header ul li a abbr.pro {
    margin-left: 70px;
}

/* ======================== MAIN CONTENT ==============================================*/

/* main notification ***************/
.notification {
    background: #179ce4;
    clear: both;
    margin: 2px auto;
    overflow: hidden; /* clear contained children */
    padding: 20px;
    width: 920px;
}

#errorExplanation {
    background: #99251F;
}

#errorExplanation h2,
#errorExplanation p,
#errorExplanation ul {
    float: none;
    margin: 0 auto;
    text-align: left;
    width: 300px;
}

#errorExplanation ul {
    margin-top: 10px;
}

#errorExplanation ul li {
    font-style: italic;
    margin-left: 20px;
}

.notification h2 {
    color: #fff;
    float: left;
}

.notification a.button {
    background: #2f6786;
    color: #fff;
    margin-left: 850px;
    padding: 5px 20px;
    position: absolute;
}

.notification a.button:hover {
    background: #64BEEE;
    color: #2f6786;
}

#errorExplanation a.button {
    background: #5D110F;
}

#errorExplanation a.button:hover {
    background: #E11E00;
    color: #fff;
}

.notification p {
    clear: left;
    float: left;
    padding-bottom: 0;
    width: 420px;
}

.notification ul {
    float: right;
    margin-left: 40px;
    padding: 0;
    width: 420px;
}

/* user stats module ***************/
.user-stats {
    border-bottom: 1px dotted #ccc;
}

.user-stats h2 {
    border-top: 1px dotted #ccc;
    clear: both;
    padding-top: 15px;
}

.user-stats ul {
    padding: 0;
}

.user-stats ul li {
    border-top: 1px dotted #ccc;
    list-style-type: none;
    padding: 15px 0;
}

#main .user-stats ul li dl dt,
#main .user-stats ul li dl dt a {
    color: #4c86a6;
    font-size: 60px;
    font-weight: bold;
    letter-spacing: 3px;
    line-height: 60px;
    text-decoration: none;
}

#main .user-stats ul li dl dd,
#main .user-stats ul li dl dd a {
    color: #2f6786;
    font-size: 15px;
    margin-top: -25px;
    text-align: right;
    text-decoration: none;
}

/* ads module ***************/
.ads {
    margin: 10px 0 0 10px;
    padding: 0;
}

.ads li {
    float: left;
    list-style-type: none;
    margin: 0 10px 10px 0;
}

/* ======================== FEEDS ==============================================*/

/* feed nav ************/

ul.feeds-nav {
    border-bottom: 3px solid #275275;
    clear: both;
    margin: 0;
    overflow: hidden; /* clear contained children */
    padding: 0;
}

ul.feeds-nav li {
    float: left;
    list-style-type: none;
}

#main ul.feeds-nav li a {
    color: #244557;
    display: block;
    float: left;
    font-weight: bold;
    padding: 10px 20px 7px 20px;
    text-decoration: none;
}

#main ul.feeds-nav li a:hover {
    color: #149CE4;
}

#main ul.feeds-nav li.current a {
    background: #275275;
    color: #fff;
    padding: 10px 30px 7px 30px;
}

/* feed ************/

.feed {
    border-bottom: 1px dotted #ccc;
    margin-bottom: 25px;
    padding: 0;
}

.feed li {
    list-style-type: none;
}

h2.feed-title {
    float: left;
    padding-right: 10px;
}

.feed .feed-item {
    padding-bottom: 25px;
}

.feed .feed-item:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.feed .feed-item ul {
    padding: 0 10px;
}

.feed .feed-item h4,
.feed .feed-item p,
.feed .feed-item blockquote {
    padding: 0 10px;
    width: 210px;
}

.feed .feed-item blockquote {
    width: 205px;
}

.feed .feed-item blockquote p {
    min-height: 40px;
    padding: 0 0 0 10px;
}

.feed .feed-item p {
    font-size: 13px;
}

.feed .feed-item blockquote {
    /*background: url(../images/quoted.gif) 5px 0 no-repeat;*/
    font-style: italic;
    margin-top: 10px;
    padding: 0 10px 0 0;
}

.feed .feed-item blockquote small {
    display: block;
    font-style: normal;
    margin: 10px 0 0 10px;
}

.feed .feed-item ul {
    font-size: 13px;
}

.feed .feed-item .fee {
    color: #2E6686;
}

.feed .feed-item .distance,
#main #trip-meta ul .distance,
p.distance,
ul.users li p.distance,
div#users-found ul.users li p.distance {
    /* distance number */
    color: #4c86a6;
    float: right;
    font-size: 30px;
    font-weight: bold;
    text-align: right;
    width: 110px;
}

#main #trip-meta ul .distance {
    font-size: 48px;
    margin-top: -10px;
    width: 170px;
}

.feed .feed-item .distance abbr,
#main #trip-meta ul .distance abbr,
ul.users li p.distance abbr {
    font-size: 14px;
    font-weight: normal;
    margin-left: -5px;
}

.feed .feed-item .trip-meta {
    margin-top: 20px;
}

.feed .feed-item .trip-meta:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.feed .feed-item .trip-meta li {
    border-right: 1px solid #179ce4;
    float: left;
    line-height: 15px;
    margin-right: 7px;
    padding-right: 8px;
}

.feed .feed-item .trip-meta li:last-child {
    border-right: none;
}

/* photo or video feed post ************/

.feed .new-photo img,
.feed .new-video img,
.feed .now-following img {
    float: left;
}

.feed .new-photo h4,
.feed .new-photo p,
.feed .new-video h4,
.feed .new-video p,
.feed .now-following h4,
.feed .now-following p {
    float: left;
    width: 94px;
}

.feed .new-photo h4,
.feed .new-video h4,
.feed .now-following h4 {
    height: 40px;
    overflow-y: hidden;
}

.main-feed .feed .new-photo h4,
.main-feed .feed .new-photo p,
.main-feed .feed .new-video h4,
.main-feed .feed .new-video p,
.main-feed .feed .now-following h4,
.main-feed .feed .now-following p {
    width: 250px;
}

.main-feed .feed .new-photo p,
.main-feed .feed .new-video p {
    height: 60px;
    margin-top: 20px;
    overflow-y: hidden;
}

.main-feed .feed .new-photo p.geo,
.main-feed .feed .new-video p.geo {
    height: auto;
    margin-top: 0;
    overflow-y: visible;
}

.main-feed .feed .feed-item p.comments,
.main-feed .feed .new-video p.comments {
    height: auto;
    margin-top: 15px;
}

.main-feed .feed .feed-item p.leave-comment,
.main-feed .feed .new-video p.leave-comment {
    float: right;
    height: auto;
    margin-top: -25px;
    padding: 0;
    width: 155px;
}

h2.comments-header {
    clear: both;
    padding-top: 20px;
}

div.photo-navigation a.next {
    float: right;
}

body .photos .photos a,
body .photos a {
    border: 3px solid #ccc;
}

body .photos .photos a:hover,
body .photos a:hover {
    border: 3px solid #1887E2;
}

#view-videos .feed .new-video p {
    clear: both;
}

#view-videos .feed .new-video p a.button {
    margin-top: -25px;
    margin-left: 760px;
    width: 120px;
}

.trip-feed.videos.big object {
    float: left;
    margin-bottom: 20px;
}

body.dashboard .feed .feed-item h4 img {
    float: left;
    margin: 0 10px 0 0;
}

body.dashboard .feed .feed-item h4 a,
body.dashboard .feed .feed-item small {
    font-size: 13px;
}

body.dashboard .feed .feed-item blockquote {
    padding-top: 0;
}

/* blog or comment feed post ************/

.main-feed .feed .new-blog-post h4 {
    margin-bottom: 10px;
}

.main-feed .feed .new-blog-post p {
    height: 80px;
    overflow-y: hidden;
    width: 510px;
}

.main-feed .feed .new-comment h4,
.main-feed .feed .new-comment p {
    width: 530px;
}

.main-feed .feed blockquote {
    width: 515px;
}

.main-feed .feed blockquote p,
.main-feed .feed .new-comment blockquote p {
    width: 495px;
}

.main-feed .feed .comment p {
    color: #333;
    width: 505px;
}

.main-feed .feed blockquote {
    /*background: url(../images/quoted-big.gif) 6px 0 no-repeat;
   height: 60px;
   overflow-x: hidden;
   overflow-y: hidden;*/
}

.main-feed .feed .new-blog-post p.comments {
    height: auto;
    margin-top: 15px;
}

.main-feed .feed .new-blog-post p.leave-comment {
    float: right;
    height: auto;
    margin-top: -25px;
    padding: 0;
    width: 155px;
}

div.post-content {
    margin-top: 15px;
    width: 530px;
}

div.blog-posts {
    margin-top: 20px;
}

body#view-trip-blog-post .main-feed .feed .new-blog-post p.leave-comment {
    clear: both;
}

div#blog-post div.post-content {
    float: left;
    margin: 5px 10px 10px 10px;
    width: 520px;
}

/* new trip feed post ************/

.main-feed .feed .new-trip h4 {
    margin-bottom: 10px;
}

/* single photo, video view ************/

#view-photo #trip-meta #photo img,
#view-video #trip-meta #video img {
    margin: 15px 0;
}

#view-photo #trip-meta #photo .vcard img,
#view-video #trip-meta #video .vcard img {
    /* cancels accidental styling by above rule */
    margin: 0;
}

#trip-meta #photo p,
#trip-meta #video p {
    margin-top: 10px;
}

#trip-meta #photo p.geo,
#trip-meta #video p.geo {
    margin-top: 0;
    padding-bottom: 0;
}

/* search results feed ************/

body#view-search #main ul.results {
    list-style-type: none;
    padding: 0;
    width: 600px;
}

/* dashboard feeds ************/

.dashboard #main #primary div#people-i-follow,
.dashboard #main #primary div#crew-wanted,
.dashboard #main #primary div#from-fave-trips,
.dashboard #main #primary div#my-log {
    float: left;
    padding-right: 20px;
    width: 305px;
}

.dashboard #main #primary div#from-fave-trips,
.dashboard #main #primary div#my-log {
    float: right;
}

.dashboard #main #primary div#my-log {
    border-top: 1px dotted #ccc;
    padding-top: 20px;
}

.dashboard #main #primary div#crew-wanted {
    border-top: 1px dotted #ccc;
    padding-top: 20px;
    clear: both;
}

.dashboard #main #primary .feed {
    border-bottom: none;
    padding-bottom: 0;
}

/* ======================== TRIP DATA ==============================================*/

/* trip meta ************/

#trip-meta ul {
    margin: 0;
    padding: 0 10px 10px 10px;
}

#main #trip-meta ul li {
    color: #2E6686;
    font-size: 13px;
    list-style-type: none;
}

body#edit-map #trip-meta h2 {
    clear: both;
    margin-top: 20px;
}

body#edit-map ul#paths-list {
    float: left;
}

body#edit-map ul#paths-list li {
    clear: both;
    float: left;
    font-size: 14px;
    margin-bottom: 5px;
    width: 100%;
}

body#edit-map ul#paths-list li div {
    margin-right: 10px;
}

body#edit-map ul#paths-list li a.delete {
    margin-left: 10px;
    text-transform: capitalize;
}

body#edit-map #mapdiv {
    height: 400px;
    margin-bottom: 20px;
    width: 625px;
}

#mapdiv {
    float: left;
    height: 555px;
    width: 940px;
}

/* trip actions ************/

#trip-meta .trip-actions {
    margin: 0 0 10px 0;
    overflow: hidden; /* clear contained children */
    padding: 10px 0 0 0;
}

#trip-meta .trip-actions li {
    float: left;
    list-style-type: none;
}

.not-trip-member #trip-meta .trip-actions li a,
#trip-meta .trip-actions li a {
    margin-top: -5px;
    margin-right: 10px;
}

.trip-member #trip-meta a.button {
    position: absolute;
    margin-top: -45px;
    margin-left: 510px;
}

.trip-member #trip-meta .trip-actions li a.button {
    position: relative;
    margin-top: 0;
    margin-right: 10px;
    margin-left: 0;
}

/* ======================== USERS/VCARDS ==============================================*/

/* feed user details ***************/
.vcard,
.main-feed .feed .comment .vcard {
    border-left: 1px solid #179ce4;
    float: right;
    font-size: 13px;
    height: 115px;
    margin: -45px 0 0 0;
    padding: 0 0 5px 10px;
    width: 70px;
}

body#add-crew .vcard {
    border-left: none;
    padding-left: 5px;
}

.main-feed #my-log .feed .new-trip .vcard,
.main-feed #past-crew .feed .new-trip .vcard,
.main-feed #my-log .feed .now-following .vcard,
.main-feed .feed .new-blog-post .vcard {
    height: 105px;
}

body#view-trip-blog-post .feed .new-blog-post .vcard,
body#view-trip .feed .vcard {
    height: 120px;
}

.main-feed #my-log .feed .vcard,
.main-feed #past-crew .feed .vcard,
.main-feed #my-feed .feed .vcard,
.main-feed #global-feed .feed .vcard,
.main-feed #crew-wanted .feed .vcard {
    height: 130px;
}

.main-feed .feed .new-blog-post .vcard {
    height: 150px;
}

.main-feed .feed .vcard {
    height: 200px;
}

.main-feed #past-crew .feed .new-photo .vcard,
.main-feed #my-log .feed .new-photo .vcard,
.main-feed #my-feed .feed .new-photo .vcard,
.main-feed #global-feed .feed .new-photo .vcard,
.main-feed #past-crew .feed .new-video .vcard,
.main-feed #my-log .feed .new-video .vcard,
.main-feed #my-feed .feed .new-video .vcard,
.main-feed #global-feed .feed .new-video .vcard {
    height: 230px;
}

#view-photo #trip-meta #photo .vcard,
#view-video #trip-meta #video .vcard {
    height: 465px;
}

.vcard dt {
    height: 65px;
}

/* main feed new crew member ************/

.main-feed .feed .new-crew-member img,
.main-feed .feed .new-crew-member h4,
.main-feed .feed .new-crew-member p {
    float: left;
}

.main-feed .feed .new-crew-member .vcard {
    height: 120px;
}

/* list of user vcards *************/

#view-followers ul.users,
#view-following ul.users,
#view-people ul.users,
#view-sign-up ul.users {
    clear: both;
    margin-bottom: 20px;
}

#view-sign-up ul.users {
    float: left;
    height: 330px;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-bottom: 5px;
    width: 650px;
}

#view-sign-up ul.users li a.follow,
#view-sign-up ul.users li span.follow {
    margin-top: -70px;
    position: relative;
}

#view-sign-up ul.users li span.follow,
#view-sign-up ul.users li a.following {
    padding-left: 5px;
    padding-right: 5px;
    width: 80px;
}

#view-followers ul.users li.vcard,
#view-following ul.users li.vcard,
#view-people ul.users li.vcard,
#view-sign-up ul.users li.vcard {
    border-left: none;
    float: none;
    height: auto;
    margin: 0;
    padding: 0;
    width: 640px;
}

#view-followers ul.users li.vcard,
#view-following ul.users li.vcard,
#view-people ul.users li.vcard,
#view-sign-up ul.users li.vcard {
    width: 530px;
}

/* crew list *************/

div#crewlist ul {
    border-top: 1px dotted #ccc;
    overflow: hidden; /* clear contained children */
    padding: 20px 0 0 14px;
}

div#crewlist ul li {
    float: left;
    list-style-type: none;
    margin: 0 13px 0 0;
    width: 75px;
}

div#crewlist ul li .vcard {
    border-left: none;
    float: none;
    height: 110px;
    margin: 0;
    padding: 0;
    text-align: center;
    width: 75px;
}

div#crewlist ul li .vcard dt {
    height: 60px;
}

.skipper img {
    border: 2px solid #179CE4;
    height: 51px;
    width: 68px;
}

/* profile *************/

#recent-trips h2 {
    margin-top: 15px;
}

/* found users and following/followers *************/

body#view-followers ul.users {
    float: left;
}

div#users-found {
    border-top: 1px dotted #ccc;
    clear: both;
    padding-top: 20px;
}

div#users-found p {
    font-size: 15px;
    font-weight: bold;
}

ul.users li p {
    font-size: inherit;
    font-weight: normal;
    margin-left: 10px;
}

ul.users li.vcard,
body#view-search #primary ul.results li.vcard {
    clear: both;
    width: 530px;
}

body#view-search #primary ul.results li.vcard {
    border-left: none;
    float: none;
    margin-top: 0;
    padding-left: 0;
    width: 400px;
}

ul.users li img.photo,
body#view-search #primary ul.results li.vcard img.photo {
    float: right;
    margin-top: -45px;
}

li.distance small a{
    font-size:11px !important;
}

ul.users li p.distance,
body#view-search #primary ul.results li.vcard p.distance {
    padding-right: 10px;
}

body#view-search #primary ul.results li.vcard p.distance {
    float: right;
    margin: 0;
    width: 200px;
}

body#view-search #primary ul.results li.vcard p.distance abbr {
    font-size: 13px;
}

ul.users li ul.badges {
    float: right;
    width: 120px;
}

body#view-search #primary ul.results li.vcard ul.badges {
    float: left;
    padding: 0 10px 0 0;
    width: 110px;
}

div#users-found ul.users li ul.badges {
    margin-top: -45px;
}

ul.users li a.follow,
ul.users li span.follow,
body#view-search #primary ul.results li.vcard a.follow,
body#view-search #primary ul.results li.vcard span.follow {
    margin-top: -20px;
    margin-left: 540px;
    position: absolute;
}

body#view-search #primary ul.results li.vcard a.follow,
body#view-search #primary ul.results li.vcard span.follow {
    margin-left: 290px;
    margin-top: 35px;
}

div#users-found ul.users li a.follow,
div#users-found ul.users li span.follow {
    margin-top: -60px;
}

/* add crew members and crew page */

body#add-crew div#results li.vcard {
    height: 130px;
    width: 450px;
}

body#add-crew div#results ul.users li p {
    font-size: 14px;
    font-weight: bold;
}

body#add-crew div#results ul.users li p.distance {
    font-size: 30px;
}

body#add-crew div#results li.vcard a.button {
    margin-top: -60px;
    margin-left: 460px;
    position: absolute;
}

body#add-crew ul.users li ul.badges {
    margin-top: -45px;
}

/* ======================== OTHER MAIN CONTENT ==============================================*/

/* single column content ***************/

.single #main div#primary p,
.single #main div#primary ul,
.single #main div#primary form {
    float: none;
    margin: 0 auto;
    width: 400px;
}

/* error messages ***************/

p.explanation {
}

#view-error #main form.search fieldset {
    padding: 0;
}

#view-error #main form.search input.text {
    width: 300px;
}

/* profile ***************/

div.profile-pic {
    float: left;
    width: 285px;
}

#view-profile #aside a.button {
    margin-bottom: 15px;
    width: 90px;
}

#view-profile #aside a.share {
    margin-left: 20px;
}

/* badges ***************/

#badges {
    width: 940px;
}

#view-profile #badges {
    float: left;
    width: 340px;
}

.single #main div#primary #badges ul {
    padding: 0 0 0 20px;
    width: 900px;
}

#view-profile #badges ul {
    clear: both;
    margin-left: -2px;
    padding: 0 0 20px 0;
}

#badges ul li,
.badges li {
    float: left;
    list-style-type: none;
}

#badges ul li img,
#badges ul li a {
    display: block;
    float: left;
    height: 55px;
    margin: 2px;
    width: 55px;
}

#view-profile #badges ul li img,
#view-profile #badges ul li a {
    margin: 1px;
}

.badges li img,
.badges li a {
    display: block;
    float: left;
    height: 25px;
    margin: 0 5px;
    width: 25px;
}

#badges ul li a {
    background: url(../images/badges/no-badge.gif) center center no-repeat;
    text-indent: -999999px;
}

.badges li a {
    background: url(../images/badges/no-badge-small.gif) center center no-repeat;
    text-indent: -999999px;
}

/* ======================== SIGN UP STEP-BY-STEP ========================================*/

ul#steps {
    background: #DFEDFB;
    display: block;
    float: left;
    margin-top: -20px;
    margin-bottom: 20px;
    padding: 10px;
}

ul#steps li {
    background: #76C4FF;
    float: left;
    display: block;
    list-style-type: none;
}

ul#steps li.current-step {
    background: #285077;
    color: #fff;
}

ul#steps li dl {
    padding: 10px;
    width: 270px;
}

ul#steps li dl.one,
ul#steps li dl.two {
    background: url(../images/not-current-to-not-current.gif) center right no-repeat;
    width: 300px;
}

ul#steps li dl.two {
    width: 290px;
}

#main ul.current-step-two li dl.one {
    background: url(../images/not-current-to-current.gif) center right no-repeat;
}

ul#steps li dl.three {
    background: url(../images/not-current-to-end.gif) center right no-repeat;
}

#main ul.current-step-three li dl.two {
    background: url(../images/not-current-to-current.gif) center right no-repeat;
}

ul#steps li.current-step dl.one,
ul#steps li.current-step dl.two {
    background: url(../images/current-to-not-current.gif) center right no-repeat;
}

ul#steps li.current-step dl.three {
    background: url(../images/current-to-end.gif) center right no-repeat;
}

ul#steps li dl dt,
ul#steps li dl dt a {
    font-weight: bold;
    margin-bottom: 5px;
}

div.tips {
    color: #254557;
    clear: both;
}

a.next-step {
    clear: both;
    float: none;
    margin-left: 760px;
    width: 140px;
}

body#view-sign-up #primary p {
    border-bottom: 1px dotted #ccc;
    margin-bottom: 20px;
    font-weight: bold;
    padding: 0 20px 20px 20px;
    width: 590px;
}

body#view-sign-up #primary p.distance {
    border-bottom: none;
    margin-bottom: 0;
    padding: 0 10px 0 0;
    width: 110px;
}

body#view-sign-up form#new_trip {
    margin-bottom: 10px;
    width: 640px;
}

body#view-sign-up form#new_trip fieldset {
    clear: none;
    float: left;
    margin-bottom: 0;
}

body#view-sign-up form#new_trip fieldset input.text {
    width: 300px;
}

body#view-sign-up form#new_trip fieldset input#start-date,
body#view-sign-up form#new_trip fieldset input#end-date {
    width: 70px;
}

body#view-sign-up form#new_trip fieldset input#trip_distance {
    width: 70px;
}

body#view-sign-up form#new_trip input#trip_submit {
    float: right;
    margin-top: 10px;
}

body#view-sign-up #primary form#find-users {
    float: left;
    width: 640px;
}

body#view-sign-up div#primary form#find-users h2 {
    color: #333;
    font-size: 14px;
    margin-left: 20px;
}

body#view-sign-up div#primary form#find-users fieldset {
    background: #fff;
    float: left;
    margin-top: 0;
    width: 260px;
}

body#view-sign-up div#primary form#find-users fieldset label {
    color: #4C86A6;
    font-weight: bold;
}

body#view-sign-up div#primary form#find-users fieldset input.text {
    width: 240px;
}

body#view-sign-up #primary form#find-users p.alternative {
    border-bottom: 0;
    color: #254557;
    display: block;
    float: left;
    font-size: 16px;
    font-weight: bold;
    margin-top: 40px;
    margin-right: 10px;
    margin-bottom: 0;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    width: 20px;
}

body#view-sign-up #main form#find-users input.button {
    margin-left: 220px;
    padding: 5px 50px;
}

body#view-sign-up #main div#users-found {
    clear: both;
    margin-top: 20px;
    width: 640px;
}

body#view-sign-up #main div#users-found .users .vcard p {
    border-bottom: none;
    margin-left: 10px;
    margin-top: 0;
    padding: 0;
}

body#view-sign-up #main div#users-found .users .vcard p.distance {
    margin-right: 10px;
}

body#view-sign-up #main div#users-found .users .vcard ul.badges {
    margin-right: 200px;
}

/* ======================== FOOTER STYLING ==============================================*/

#footer {
    height: 210px;
    margin: 2px auto;
    padding: 0;
    width: 980px;
}

#footer a {
    color: #fff;
}

#footer li {
    float: left;
    list-style-type: none;
    margin-right: 2px;
    margin-bottom: 2px;
}

#footer li.copyright {
    background: #179ce4;
    float: left;
    height: 20px;
    margin-bottom: 2px;
    margin-right: 0;
    padding: 177px 15px 10px 15px;
    text-align: right;
    width: 389px;
}

#footer li h2 {
    background: #179ce4;
    color: #fff;
    margin-bottom: 2px;
    padding: 10px 15px;
    width: 155px;
}

#footer li ul {
    background: #179ce4;
    height: 145px;
    padding: 10px 15px;
    width: 155px;
}

#footer li ul li {
    border-right: none;
    float: none;
    width: inherit;
}

/* ======================== FRONT-PAGE STYLES ===============================================*/

body#front-page {
    background: none;
}

body#front-page div#main {
    padding: 60px;
    width: 840px;
}

body#front-page h1 {
    background: url(../images/compass.png) 410px 20px transparent no-repeat;
    color: #4c86a6;
    font-size: 52px;
    height: 540px;
    line-height: 60px;
    padding-right: 460px;
    position: absolute;
    width: 470px;
    z-index: 1;
}

body#front-page h1 span.app-name {
    color: #294E68;
    font-weight: bold;
}

body#front-page p,
body#front-page h2 {
    font-size: 18px;
    font-weight: bold;
    padding-left: 10px;
    line-height: 25px;
    width: 440px;
}

body#front-page p {
    padding-top: 140px;
}

body#front-page h2 {
    clear: both;
    padding-left: 0;
}

body#front-page ul {
    padding-left: 25px;
}

body#front-page ul li {
    font-size: 16px;
    line-height: 25px;
}

body#front-page ul li a {
    color: #3a7291;
    text-decoration: none;
}

body#front-page ul li span.coming-soon {
    color: #666;
}

body#front-page #main p.call-to-action,
body#front-page #main p.call-to-action-beta {
    margin: 10px auto;
    padding-top: 0;
    position: relative;
    width: 760px;
    z-index: 2;
}

body#front-page #main p.call-to-action-beta {
    width: 360px;
}

body#front-page div#main a.button {
    background: #127DB6;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    color: #fff;
    cursor: pointer;
    float: left;
    font-size: 30px;
    font-weight: bold;
    margin: 0 10px 40px 10px;
    padding: 20px 30px 15px 30px;
    width: 300px;
}

body#front-page div#main a.button:hover {
    background: #64BEEE;
    color: #254557;
}

body#front-page div#main a.button span.desc {
    display: block;
    font-size: 18px;
}

body#front-page ul#photo-list {
    padding-left: 0;
}

body#front-page ul#photo-list li {
    float: left;
    list-style-type: none;
    margin: 0 5px 20px 0;
}

body#front-page ul#photo-list li a img {
    border: 1px solid #ccc;
    height: 110px;
    width: 160px;
}

body#front-page ul#reviews {
    padding: 0;
}

body#front-page ul#reviews li {
    float: left;
    list-style-type: none;
    width: 210px;
}

body#front-page ul#reviews li img {
    border: 1px solid #ccc;
    float: left;
    margin: 0 10px 5px 0;
}

body#front-page ul#reviews li span.summary {
    display: block;
    float: left;
    width: 140px;
}

body#front-page ul#reviews li a {
    color: #333;
    text-decoration: underline;
}

body#front-page ul#footer {
    background: #179ce4;
    height: 30px;
    padding-left: 0;
    text-align: right;
    width: 960px;
}

body#front-page ul#footer li {
    float: right;
    margin-right: 20px;
}

body#front-page ul#footer li a {
    color: #fff;
    display: block;
    float: left;
    font-size: 14px;
    line-height: 30px;
    text-align: right;
    text-decoration: underline;
}

table.plans_table {
    padding: 30px;
}

table.plans_table td, table.plans_table tr, table.plans_table th {
    border: 1px solid #ccc;
    padding: 10px;
}

table.plans_table tr.active_td {
    background-color: #179CE4;
    color: white;
}

.trip_desc{
    font-size: smaller;
    font-size: 80%;
}


.biger_find_and_bolder{
    font-weight: bold;
    font-size: 16px;
}

.center{
    text-align: center;
}

#primary2 .center{
    padding: 20px 0 20px 0;
}