/**
_______________________________________________________________________________

Author: LPH <layne.heiny@gmail.com>
URL: https://www.tuxreports.com/community
Date: May 20, 2016
_______________________________________________________________________________

Table of Contents
    1. Discuss link
    2. Login Widget
    3. Online Members Widget
    4. Recent Threads Widget
    5. Featured Forum and Thread Widget
    6. XenForo Add-Ons
    7. WP Toolbar
    8. Branding
    9. UBS Latest Blog Entry
    10. Forum Thread Prefix Colors
    11. Notification Bar
    12. Avatars
*/

/**
_______________________________________________________________________________

    1. Discuss Link
_______________________________________________________________________________

*/

/** Link -- Default option */

div.xenword_discuss_container {
    margin-bottom: 1em;
    overflow: hidden;
}

div.xenword_discuss a {
    float: right;
    border: 1px solid #c5c5c5;
    border-radius: 4px;
    padding: 4px 10px;
    font-family: "Opens Sans", Arial, sans-serif;
    font-size: 0.8125rem;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    text-transform: uppercase;
}

div.xenword_discuss:hover a {
    font-weight: bold;
    background-color: #e6e6e6;
    text-decoration: none;
    text-transform: uppercase;
}

span.threadView {
    float:right;
}

/** Speech Bubble Option */

div.xenword_speech_bubble {
    background-color: #F2F2F2;
    border-radius: 5px;
    box-shadow: 0 0 6px #B2B2B2;
    display: inline-block;
    padding: 10px 18px;
    position: relative;
    vertical-align: top;
}

div.xenword_speech_bubble::before {
    background-color: #F2F2F2;
    content: "\00a0";
    display: block;
    height: 16px;
    position: absolute;
    top: 11px;
    transform: rotate( 29deg ) skew( -35deg );
    -moz-transform: rotate( 29deg ) skew( -35deg );
    -ms-transform: rotate( 29deg ) skew( -35deg );
    -o-transform: rotate( 29deg ) skew( -35deg );
    -webkit-transform: rotate( 29deg ) skew( -35deg );
    width: 20px;
}

div.xenword_speech_bubble.count a { text-transform: capitalize }

/** Show Comment Count */

.count::before {
    box-shadow: -2px 2px 2px 0 rgba( 178, 178, 178, .4 );
    left: -9px;
}

.count {
    float: left;
    margin: 5px 45px 5px 20px;
}

/**
_______________________________________________________________________________

    2. Login Widget
_______________________________________________________________________________

*/

#main .sidebar h2::before { content: "" !important }

/** Login / Visitor widget **/

.xenword_login {
    height: auto;
    background-color: #cacaca;
    clear: left; /* clear the float of the avatar, bring to new line */
}

div .visitorText {
    display: block;
    overflow: hidden;
    zoom: 1;
    padding-left: 10px;
    margin-right: 10px;
}

/** Stats */

.stats { margin-top: 2px }

#xenlogin .stats {
    margin-top: -16px; /* To offset the <br> tags below the Xenword Username and bring stats closer to it */
}

/** Username */

a.username {
    font-size: 11pt !important;
    display: block;
}

/** Profile */

.xenword_login.profile { }

.xenword_profile.edit,
.xenword_logout.logout {
    font-family: "Opens Sans", Arial, sans-serif;
    border: 1px solid #c5c5c5;
    color: #111;
    height: 35px;
    line-height: 26px;
    float: left;
    width: 46%;
    text-align: center;
    margin: 10px 5px 2px;
    padding: 4px;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 4px;
    text-decoration: none;
}

.xenword_profile.edit,
.xenword_logout.logout {
    /* Center text within buttons */
    margin: 10px 5px 2px; /* Get the buttons a little bit more away from the stats */
    min-width: 42%;
    width: auto !important;
}

h2.xenword_profile,
dl.pairsJustified {
    margin: 0 !important; /* Remove large gaps from stats */
}

dl.pairsJustified {
    height: 17px; /* Keeping the stats close together */
}

.pairsJustified dt {
    float: left;
    margin-right: 5px;
    max-width: 100%;
}

.pairsJustified dd {
    float: right;
    max-width: 100%;
    text-align: right;
    margin-left: 4px;
}

dl.pairsJustified,
.pairsColumns dl,
.pairsJustified dl {
    line-height: normal;
    padding: 0;
    overflow: hidden;
    margin: 0;
    font-size: 11px;
}

span.dark_postrating_positive {
    color: #62A201;
}

input#ctrl_remember {
    margin-top: 2em;
}
/** XenForo Sign up Button */

a.xenword_signup,
a.xenword_signup:hover {
    display: block;
    width: 100%;
    height: 2em;
    text-align: center;
    font-weight: bold;
    font-size: 1.2em;
    color: #fff !important;
    background: #222;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
    text-shadow: 0 0 0 transparent, 0 0 3px rgba(0,0,0, 0.5);
    padding: 7px 12px 4px;
}

/** Facebook Login Button */

a.xenword_fbLogin {
    display: inline-block;
    width: 70%;
    height: 22px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    background: #29447e url(../images/connect_sprite.png) no-repeat left -188px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
    padding: 0 0 0 1px;
    outline: none;
    text-decoration: none;
    color: white;
    font-weight: bold;
    font-size: 11px;
    line-height: 14px;
}

a.xenword_fbLogin span {
    background: #29447e url(../images/connect_sprite.png);
    border-top: solid 1px #879ac0;
    border-bottom: solid 1px #1a356e;
    display: block;
    padding: 2px 4px 3px;
    margin: 1px 1px 0 21px;
    text-shadow: none;
    white-space: nowrap;
    overflow: hidden;
}

/** Twitter Login Button */

a.xenword_twitterLogin {
    display: inline-block;
    width: 70%;
    height: 22px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    background-color: #eee;
    background-image: -webkit-linear-gradient(#fff, #dedede);
    background-image: linear-gradient(#fff, #dedede);
    border: #ccc solid 1px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
    padding: 3px;
    color: #333 !important;
    font-weight: bold;
    font-size: 11px;
    line-height: 14px;
}

a.xenword_twitterLogin span {
    display: block;
    background:
            url('../images/twitter-bird.png') no-repeat,
            left 0;
    padding-left: 22px;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
    white-space: nowrap;
    overflow: hidden;
}

/** Google Login Button */

.googleLogin {
    display: inline-block;
    width: 70%;
    height: 22px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    background-color: #dd4b39;
    border: #be3e2e solid 1px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
    padding-left: 2px;
    color: white;
    font-weight: bold;
    font-size: 11px;
    line-height: 14px;
}

.googleLogin span {
    display: block;
    background: url('../images/gplus.png') no-repeat left 0;
    padding: 3px 3px 3px 23px;
    white-space: nowrap;
    overflow: hidden;
}

.xenword-login-line { display: none }

/**
* Additional CSS to help match default XenForo theme
* Feel free to remove comments, etc
*
*/

#xenlogin {
    margin-bottom: 5em;
}

#xenlogin a.avatar {
    /* Similar to XenForo default CSS */
    margin-right: 5px;
    float: left;
}

span.avatar-u4-s {
    padding: 25px;
    line-height: 96px;
    width: 96px;
    height: 96px;
    font-size: 57.6px;
}

div.ctrlWrapper { }

/**
_______________________________________________________________________________

    3. Online Members Widget
_______________________________________________________________________________

*/

/** Online Users Widget */

div.onlineUsers_container {
    display: inline-block;
    top: 0;
    left: 0;
}

div.onlineUsers_username {
    float: left;
    margin-right: 5px;
}

div.onlineUsers_avatars_container {
    /**display: flex; */
}

div.onlineUsers_totals {
    margin-top: 1em;
    background-color: #dfdfdf;
    padding: 6px 10px;
    font-size: 1em;
    color: black;
    border-top: 1px solid red;
}

/**
_______________________________________________________________________________

    3b. Comment Ranking Widget
_______________________________________________________________________________

*/

div.ranking_container {
    display: block;
    top: 0;
    left: 0;
    margin-bottom: 1em;
}

div.ranking_avatar {
    float: left;
    margin-right: 10px;
    border: 1px solid lightgrey;
    border-radius: 5px;
    padding: 5px;
}

/**
_______________________________________________________________________________

    4. Recent Threads Widget
_______________________________________________________________________________

*/

/** Latest Threads Widget **/

div.threadListItem {
    margin: 0;
    display: block;
    padding: 1em;
}

div.threadPollItem {
    margin: 0;
    display: block;
    padding: 1em;
}

/* Tab Container */

.widget_tabs ul.widget-title li h3 { font-size: initial }

.widget {
    display: block;
    position: relative;
}

.widget select { width : 100% }

#sidebar .widget,
#sidebar2 .widget {
    margin-bottom: 35px;
    width: 100%;
    clear: both;
}

#sidebar .widget:last-child,
#sidebar2 .widget:last-child { margin-bottom: 0 }

.widget,
.widget ul {
    font-size: 13px;
    line-height: 19px;
    position: relative;
}

.widget_tabs ul.widget-title {
    margin-top: 13px;
    margin-bottom: 20px;
    border: none;
    display: inline;
}

.widget_tabs ul.widget-title li {
    display: block;
    cursor: pointer;
    padding: 5px;
}

.widget_tabs ul.widget-title h3 { margin-right: 3px }

.widget_tabs ul.widget-title li h3 { padding: 5px }

.widget_tabs ul.widget-title li.active h3 {
    background: lightblue;
    padding: 5px;
    border-radius: 4px;
}

.tab_container { display: none }

.tab_container:first-child { display: block }

/**
_______________________________________________________________________________

    5. Featured Forum and Thread
_______________________________________________________________________________

*/

/** Featured Forum */

.forum_header_table { width: 100% }

span.featured_forum_viewcount {
    float: right;
    padding-right: 1%;
}

span.featured_forum_views { font-size: smaller }

span.featured_forum_replycount {
    float: right;
    padding-right: 1%;
}

td.forum_header_thread_starter {
    width: 5%;
    background-color: #2581aa;
    color: white;
    text-transform: uppercase;
    border: none;
}

td.forum_header_thread_title {
    width: 55%;
    background-color: #2581aa;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    border: none;
}

td.forum_header_thread_views {
    width: 20%;
    background-color: #2581aa;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    border: none;
    border-left: 1px solid grey !important;
    border-right: 1px solid grey !important;
    padding-right: 1%;
}

td.forum_header_thread_start_date {
    width: 20%;
    background-color: #2581aa;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    border: none;
    padding-left: 1%;
}

span.featured_thread_author {
    font-size: small;
    color: grey;
}

tr.featured_forum_table_row { border-bottom: 1px solid lightgrey }

span.featured_thread_last_thread_date {
    font-size: small;
    padding-left: 5%;
    color: grey;
}

span.featured_forum_last_username { padding-left: 5% }

span.resource_icon {
    float: left;
    margin-right: 10px;
}

span.resource_date {
    color: grey;
    font-size: small;
}

span.xenword_view_more a {
    float: right;
    border: 1px solid #c5c5c5;
    padding: 5px;
    border-radius: 3px;
}

/**
Featured Thread
 */

div.xenword_featured_thread_author {
    padding-bottom: 1em;
}

div.forumEntryUrl {
    float:right;
    border: 1px solid #eee;
    border-radius: 3px;
    padding: 0.5em;
}

/**
_______________________________________________________________________________

    6. XenForo Add-Ons
_______________________________________________________________________________

*/

/** Post Ratings */

div.xenword_postratings_container {
    display: block;
    position: relative;
    margin-bottom: 1em;
    border: 1px solid lightgrey;
    border-radius: 5px;
}

div.xenword_postratings_title {
    display: flex;
    float:left;
    font-size: xx-small;
    padding: 2px;
}

div.xenword_postratings_image { margin: 0 5px }

/**
_______________________________________________________________________________

    7. WP Toolbar
_______________________________________________________________________________

*/

/** WordPress Admin Toolbar **/

#wpadminbar .quicklinks .ab-top-secondary>li {
    float: right;
    display: inline-flex;
}

#wpadminbar #wp-admin-bar-conversations .ab-icon:before {
    content: "\f466";
    top: 1px;
    font: 400 16px/1 dashicons;
}

#wpadminbar #wp-admin-bar-alerts .ab-icon:before {
    content: "\f227";
    top: 1px;
    font: 400 16px/1 dashicons;
}

#wpadminbar #wp-admin-bar-likes .ab-icon:before {
    content: "\f487";
    top: 1px;
    font: 400 16px/1 dashicons;
}

/** WordPress Toolbar */

#wpadminbar {
    /**
    height: 45px !important;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 99999;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #2581aa; */
}

#LoginControl.Toolbar_textCtrl {
    margin-left: 5px;
    width: 200px !important;
    margin-right: 5px !important;
}

#ctrl_password.Toolbar_textCtrl {
    margin-left: 5px;
    margin-right: 5px;
}

#wp-admin-bar-register a { font-weight: bold }

input.button.primary {
    margin-right: 5px !important;
    margin-top: 5px;
    padding-left: 5px !important;
    padding-right: 5px !important;
    border-radius: 3px !important;
    font-size: 1em;
    float: left;
}

label.rememberPassword {
    margin-left: 5px;
    font-size: 0.8em;
    color: grey;
}

#wpadminbar ul#wp-admin-bar-root-default>li { margin-left: 19px }

li#wp-admin-bar-display-username {
    float: right;
    margin-right: 5% !important;
}

li#wp-admin-bar-conversations-unread-count {
    float: right;
    margin-right: 5px !important;
    margin-left: 3px !important;
}

span#conversations-unread-count {
    background: red;
    padding: 3px 5px;
    border-radius: 3px;
}

li#wp-admin-bar-xf-inbox {
    float: right;
    margin-right: 5px !important;
}

li#wp-admin-bar-alerts-unread {
    float: right;
    margin-right: 5px !important;
    margin-left: 5px !important;
}

span#alerts-unread-count {
    background: red;
    padding: 3px 5px;
    border-radius: 3px;
}

li#wp-admin-bar-alerts-unread-count {
    float: right;
    margin-right: 3% !important;
    margin-left: 5px !important;
}

li#wp-admin-bar-alerts-unread-count0 {
    float: right;
    margin-right: 3% !important;
    margin-left: 5px !important;
}

li#wp-admin-bar-get-avatar { margin-bottom: 80px !important }

/** Second Column */

li#wp-admin-bar-your-news-feed { margin-top: -208px !important }

li#wp-admin-bar-your-news-feed .ab-item {
    float: right;
    display: inline-block;
    margin-left: 150px;
}

li#wp-admin-bar-conversations .ab-item {
    float: right;
    margin-top: 0;
    margin-left: 150px;
}

li#wp-admin-bar-sub-alerts .ab-item {
    float: right;
    margin-top: 0;
    margin-left: 150px;
}

li#wp-admin-bar-sub-likes .ab-item {
    float: right;
    margin-top: 0;
    margin-left: 150px;
}

li#wp-admin-bar-sub-your-content .ab-item {
    float: right;
    margin-top: 0;
    margin-left: 150px;
}

li#wp-admin-bar-people-you-follow .ab-item {
    float: right;
    margin-top: 0;
    margin-left: 150px;
}

li#wp-admin-bar-people-you-ignore .ab-item {
    float: right;
    margin-top: 0;
    margin-left: 150px;
}

li#wp-admin-bar-xf-logout .ab-item {
    float: right;
    margin-top: 0;
    margin-left: 150px;
    /** margin-bottom: 2% !important; **/
}

/**
_______________________________________________________________________________

    8. Branding
_______________________________________________________________________________

*/

/** Branding **/

div.xenword_branding {
    width: auto;
    text-align: center;
    font-size: small;
    line-height: 50px;
}

/**
_______________________________________________________________________________

    9. UBS Latest Blog Entry
_______________________________________________________________________________

*/

div.ListBlockInnerImage {
    float: left;
}

div.ListBlock.main {
    float: right;
}

/**
_______________________________________________________________________________

    10. Featured Forum and Thread
_______________________________________________________________________________

*/

span.prefix.prefixPrimary {
    font-size: 80%;
    color: white;
    background-color: #d7edfc;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #d7edfc;
}

span.prefix.prefixSecondary {
    font-size: 80%;
    color: white;
    background-color: #f9d9b0;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #f9d9b0;
}

span.prefix.prefixGreen {
    font-size: 80%;
    color: white;
    background-color: green;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: green;
}

span.prefix.prefixOlive {
    font-size: 80%;
    color: black;
    background-color: olive;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: olive;
}

span.prefix.prefixLightGreen {
    font-size: 80%;
    color: black;
    background-color: lightgreen;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: lightgreen;
}

span.prefix.prefixBlue {
    font-size: 80%;
    color: white;
    background-color: blue;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #88F;
}

span.prefix.prefixRoyalBlue {
    font-size: 80%;
    color: white;
    background-color: royalblue;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #81A9E1;
}

span.prefix.prefixSkyBlue {
    font-size: 80%;
    color: black;
    background-color: skyblue;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: skyblue;
}

span.prefix.prefixRed {
    font-size: 80%;
    color: white;
    background-color: red;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #F88;
}

span.prefix.prefixOrange {
    font-size: 80%;
    color: black;
    background-color: orange;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #FFC520;
}

span.prefix.prefixYellow {
    font-size: 80%;
    color: black;
    background-color: yellow;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #E0E000;
}

span.prefix.prefixGray {
    font-size: 80%;
    color: black;
    background-color: gray;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: #AAA;
}

span.prefix.prefixSilver {
    font-size: 80%;
    color: black;
    background-color: silver;
    padding: 2px 6px;
    border-radius: 2px;
    border-color: silver;
}

.label {
    display: inline-block;
    padding: 1px .35em;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 80%;
    line-height: 1.26;
    text-decoration: none;
}

.label.label--red {
    color: #fff;
    background: #e20000;
    border-color: #af0000;
}

.label.label--gray {
    color: #fff;
    background: #808080;
    border-color: #676767;
}

.label.label--primary {
    color: #2577b1;
    background: #edf6fd;
    border-color: #bcdef5;
}

.label.label--accent {
    color: #aa6709;
    background: #fff4e5;
    border-color: #f9c479;
}

.label.label--green {
    color: #fff;
    background: #008000;
    border-color: #004d00;
}

.label.label--olive {
    color: #fff;
    background: #808000;
    border-color: #4d4d00;
}

.label.label--lightGreen {
    color: #000;
    background: #ccf9c8;
    border-color: #bee8ba;
}

.label.label--blue {
    color: #fff;
    background: #0008e3;
    border-color: #0006b0;
}

.label.label--royalBlue {
    color: #fff;
    background: #4169e1;
    border-color: #214cce;
}

.label.label--skyBlue {
    color: #fff;
    background: #7cc3e0;
    border-color: #53b0d6;
}

.label.label--gray {
    color: #fff;
    background: #808080;
    border-color: #676767;
}

.label.label--silver {
    color: #000;
    background: #c0c0c0;
    border-color: #a7a7a7;
}

.label.label--yellow {
    color: #000;
    background: #ffff91;
    border-color: #e6e687;
}

.label.label--orange {
    color: #000;
    background: #ffcb00;
    border-color: #cca200;
}

#xenword_wide_stats {
    width: 100%;
    border: none;
    background-color: #f7f7f7;
}

#xenword_wide_stats tr:first-child td {
    background-color: #0c2b41;
    border: #f7f7f7;
    color: white;
}

.xenword_wide_stats_td {
    border:none;
    text-align: center;
}

tr.xenword_wide_stats_forum_link {
    background-color: black;
    color: white;
}

tr.xenword_wide_stats_forum_link a {
    background-color: black;
    color: white;
}

/**
_______________________________________________________________________________

    11. Notification Bar
_______________________________________________________________________________

*/

div.xenword_notification {
    top:0;
    position: sticky;
    z-index: 99999;
    width: 100%;
    border-bottom: solid 5px;
    background-color:lightyellow;
    color:black;
    text-align: center;
}

/**
_______________________________________________________________________________

    12. Avatars
_______________________________________________________________________________

*/

a.avatar--s {
    display: block;
    -webkit-border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    border-radius: 50% !important;
    width: 48px;
    height: 48px;
    text-align: center;
    line-height: 2.5em;
}

a.avatar {
    border-radius: 50%;
}

img.avatar--s {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.xenword_profile.avatar {
    display: block;
}

div .widget_xenword_login_widget a.avatar {
    background-color: #fcfcff;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    padding: 2px;
    line-height: 2em;
    font-family: Arial, sans-serif;
    font-size: 24px;
}

div.onlineUsers_avatar {
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
    border: 1px solid lightgrey;
    border-radius: 5px;
    padding: 5px;
}

div.onlineUsers_avatar a.avatar {
    display: block;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    line-height: 2em;
    font-family: Arial, sans-serif;
    font-size: 24px;
}

div.threadPollAvatar {
    display: block;
    float: left;
    padding: 1em;
}

div.threadPollAvatar a.avatar {
    display: block;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    line-height: 2em;
    font-family: Arial, sans-serif;
    font-size: 24px;
}

div.threadListAvatar {
    float: left;
    display: block;
    padding: 1em;
}

div.threadListAvatar a.avatar--s {
    display: block;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    line-height: 2em;
    font-family: Arial, sans-serif;
    font-size: 24px;
}