/*
################################################################################
#
# File:    css/article.css
#
# Purpose: CSS for articles
#
# Modifications:
#   - 2013-12-06  txe  Started  creation.
#   - 2014-07-15  txe  Finished creation.
#   - 2014-10-13  txe  Improved CSS when not enough points to unlock.
#   - 2014-10-22  txe  Started  adding misc downloads.
#   - 2014-10-23  txe  Finished adding misc downloads.
#   - 2014-12-31  txe  Switched to new CSS.
#   - 2015-02-16  txe  Started  adding Add Video support.
#   - 2015-02-18  txe  Finished adding Add Video support.
#   - 2015-03-24  txe  Increased max height of user thumbnail.
#   - 2015-06-02  txe  Added stats (superuser only).
#   - 2015-06-12  txe  Added feature link.
#   - 2015-07-24  txe  Made comment buttons narrower.
#   - 2015-10-27  txe  Cleaned up.
#   - 2017-09-22  txe  Un-bolded comment heading.
#   - 2017-10-06  txe  Overhauled.
#   - 2017-10-12  txe  Added official comment style.
#   - 2018-04-05  txe  Started  overhaul.
#   - 2018-04-30  txe  Finished overhaul.
#   - 2018-07-18  txe  Updated for ride reports.
#
################################################################################
*/

#main                            { margin-bottom: 0; }

#main h1 { text-align: center; color: #464646; font-size: 20px; font-weight: normal; }

/* 2018-04-05 txe start */
/*
#main h1 { margin: 20px auto 10px; color: #464646; text-align: center; }

.wrapper1 { margin: 0 auto; padding: 0 10px; max-width: 750px; }
*/

#main .content-block { margin-bottom: 20px; max-width: 750px; }

/*
#blocks { text-align: center; }


#main .map-placeholder,
#main .photo,
#main .block,
#main .content-block,
#main #info,
#main #misc-uploads,
#main .ac-group,
#main .bac-group,
#main #comments,
#main #comment-buttons { margin: 0 auto 20px; max-width: 750px; }

#crumbs { margin: 20px auto; xmax-width: 750px; }

@media (max-width: 790px)
{
#main .map-placeholder,
#main .photo,
#main .block,
#main .content-block,
#main #info,
#main #misc-uploads,
#main .ac-group,
#main .bac-group,
#main #comments,
#main #comment-buttons { margin: 0 10px 20px; }
}

#main .content-block { text-align: left; }
*/

/* 2018-04-05 txe end */


#main ul,
#main ol                         { margin-left: 20px; }
#main dt                         { color: #B64500; font-weight: bold; }

#main dt:first-child,
#main dt:first-child + dd        { padding-top: 0; border-top: 0; }


#unlockable                      { margin: 50px auto; width: 280px; }
#unlockable .heading             { margin: 0 auto 15px; white-space: nowrap; color: #900; font-size: 25px; font-style: italic; }
#unlockable p                    { line-height: 20px !important; font-style: italic; }

#unlockable a.submit             { margin: 20px auto 0; width: 100% !important; }

#main a.submit.is-disabled       { opacity: 0.5; }

#main #not-unlockable            { margin: 10px 0 30px; text-align: center; }
#main #not-unlockable a.submit   { width: 300px !important; }

#main #not-unlockable p          { margin: 15px auto; font-style: italic; }
#main #not-unlockable .buttons a { margin: 10px; }


#info dt                         { font-weight: normal; }

#info-members-only               { margin: 30px 0; padding: 10px 10px 0; border: 3px solid #c00; }
#info-members-only ul            { margin-bottom: 10px; }

#misc-uploads dt                 { font-weight: normal; }
#misc-uploads dd i               { color: #999; }

#main #author                    { margin: 0 0 40px; position: relative; min-height: 130px; }
#main .avatar                    { position: absolute; left: 0; top: 40px; }
#main .avatar img                { max-width: 150px; max-height: 113px; }

#main .user-info                 { margin: 0 400px 10px 160px; width: auto;  }
#main .contributions             { position: absolute; right: 0; top: 40px; }


#main .logged-out,
#main .locked                    { color: #999; font-style: italic; }


/* 2018-07-18 txe start */
#main .photo .locked a { color: #999; text-decoration: underline; }
/* 2018-07-18 txe end */


#main .bac { margin: 20px auto; }

/*
#main .comments                  { margin-top: 20px; }
#main .comments h2               { margin: 30px 0 20px; padding: 10px; background: #c6c6c6; color: #464646; position: relative; font-weight: normal; }
#main .comments .comment         { margin: 0 0 20px; padding: 10px; min-height: 113px; background: #eee; position: relative; }
#main .comments .thumb           { width: 150px; position: absolute; top: 10px; text-align: center; }
#main .comments .thumb img       { max-width: 150px; max-height: 113px; }
#main .comments .thumb a:hover   { opacity: 0.5; }
#main .comments .left            { left: 10px; }
#main .comments .right           { right: 10px; }

#main .comments .middle          { margin: 0 160px; padding-bottom: 35px; xposition: relative; }

#main .comments .header          { margin: 0 0 5px; padding: 10px; background: #c6c6c6; }
#main .comments .is-official .header   { background: #464646; color: #fff; }
#main .comments .is-official .header a { color: #fff; } 

#main .comments a.user           { color: #333; text-decoration: underline; font-weight: bold; }
#main .comments .date            { color: #999; font-style: italic; }
#main .comments .stars           { margin-left: 5px; display: inline-block; position: relative; top: 2px; }

#main .comments a.view           { margin-left: -85px; position: absolute; left: 50%; bottom: 10px; width: 160px !important; }

#main .comments p.no-results     { margin: 20px auto; text-align: center; color: #999; font-style: italic; }

#main .comments .logged-out,
#main .comments .locked          { margin: 20px auto 10px; display: block; text-align: center; }
*/

#comments                  { margin: 0 -1000px; }

#comments .panel           { height: 247px; }
#comments .panel .title    { text-align: center; }



#main a.submit                   { margin: 0 10px; display: inline-block; }


#comment-buttons                 { margin: 25px 0 40px; padding: 5px 0 0; text-align: center; xbackground: #c6c6c6; xborder-radius: 10px 10px 10px 0; position: relative; }
x#comment-buttons::after          { width: 100%; height: 20px; content: " "; background: url(/images/flair-down-medium-brown.gif) left top no-repeat; position: absolute; left: 0; bottom: -20px; }
#comment-buttons a.submit        { margin: 0 7px 5px; width: 125px !important; }            

#comment-buttons .logged-out,
#comment-buttons .locked         { margin: 0 20px; padding: 5px; color: #655f47; display: inline-block; }


#main #unlockees h2              { margin-top: 30px; padding: 10px; background: #464646; color: #fff; border-radius: 10px 0 10px 10px; position: relative; }
x#main #unlockees h2::before      { width: 100%; height: 20px; content: " "; background: url(/images/flair-up-dark-brown.gif) right bottom no-repeat; position: absolute; left: 0; top: -20px; }

#unlockees td                    { vertical-align: top; border-bottom: 1px dotted #ccc; }
#unlockees .thumb                { width: 120px; }
#unlockees .thumb img            { max-width: 120px; max-height: 90px; }
#unlockees .text a               { text-decoration: underline; color: #5F5943; font-weight: bold; }
#unlockees .text a:hover         { color: #b64500; }
#unlockees .text p               { margin: 10px 0 0; }
#unlockees .categories           { width: 120px; color: #666; white-space: nowrap; }
#unlockees .categories div       { padding-left: 20px; background: url(/images/bullet-checker-10.jpg) 0 50% no-repeat; line-height: 20px; }


#main #edit                      { margin: 0 auto; display: block; }



#stats    { margin: 50px auto 20px; text-align: center; }


/* 2015-10-27 txe start */
#stats h3 { color: #999; }
/* 2015-10-27 txe end */


#feature { margin: 20px auto; text-align: center; }