﻿@import url('https://fonts.googleapis.com/css?family=Poppins:300,regular,500,600,700');


body { font-family: Poppins, "Open Sans", Segoe UI, Tahoma,Geneva, Verdana,Arial,sans-serif; font-size: 14px; margin: 0; z-index: 1; color: #333; padding-bottom: 0; }
body.signedin { background: #EEE; }

/*HTML Style elements*/
body#tinymce { background: transparent; }
/*Should be on the editor only*/

#ajaxscripts { display:none}
#hdr, header { background: rgba(0,0,0,0); color: #000; }

#h-table { width: 100%; }

#searchouter { width: 300px; }
#profile-links { width: 160px; }
body.signedin header #profile-links { width: 220px; }
header .profile { color: #000; font-size: 13px; font-weight: bold; }
header .links { line-height: .85em; }
header .links a { margin: 0; text-transform: uppercase; color: #BBB; font-size: 11px; }

body.home header .homepagelink { display: none; }

#hdr { padding-top: 5px; padding-bottom: 5px; transition: all ease-in-out 0.4s; position: fixed; z-index: 20; right: 0; left: 0; top: 0; border-bottom: solid 1px rgba(0,0,0,0.1); }
#hdr, #hdr > div { min-height: 48px; }
#hdr #search-box { max-width: 450px; z-index: 5; float: none; width: auto; padding-bottom: 0; padding-top: 0px; }
#hdr #search-box .container-search { background: #EFEFEF; border-color: #E0E0E0; height: 38px; }
#hdr #search-box .container-search input.txt { background: rgba(0,0,0,0); border-top: none; border-right: none; border-left: none; border-bottom: none; }
#hdr #search-box .container-search input.txt:focus { color: #000; }
header #profile .avatar img { border-radius: 50%; }

#logo { background-repeat: no-repeat; background-size: contain; height: 65px; display: inline-block; background-position: center center; }
.logo { background-image: url('../img/logo/vx_logo_onwhite_small.png'); }

#hdr #logo-c { width: 240px; padding-left: 15px; padding-right: 15px; }
body #hdr .vxtitle { height: 50px; }
body #hdr #logo { width: 100%; height: 50px; background-size: contain; }


body.signedin #hdr { left: 0; background: rgba(255,255,255,1); }
body.scrolled #hdr { background: rgba(255,255,255,0.9); }
body.signedin #hdr > div { }

body.nosidemenu { left: 0 !important; }

body.skinny #main-body {max-width: 800px; }

.nosidemenu #main-body { margin: 0 auto; padding-left: 0; }

/**/
#userdata { /*min-width: 190px;*/ position: relative; transition: all ease-in-out 0.2s; }
#avatar { float: left; margin-right: 4%; width: 32px; }
#avatar img { max-width: 100%; border-radius: 50%; }

/**/
.avatar { background-size: cover; background-position: center center; aspect-ratio: 1/ 1; margin-bottom: 2px; }
#l-menu .avatar { margin-bottom: 7px; }

div.detailsset .avatar { width: 48px; float: left; margin-right: 8px; }
div.detailsset h3 { margin-bottom: 0; }

.detail-image { aspect-ratio: 16/ 7; background-color:#C0C0C0; background-repeat: no-repeat; background-size: cover; background-position: center top; }

hr { border: none; background: #EFEFEF; height: 1px; margin-top: 2px; margin-bottom: 4px; }
/**/
.smallthumbnails { display: flex; flex-wrap: wrap; gap: 5px; }
.smallthumbnails > div { position: relative; width: calc((100% - 20px) / 5); aspect-ratio: 1 / 1; background-size: cover; background-position: center center }
.smallthumbnails > div a { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
/* Misc */

.sml-font { font-size: 0.9em; }
.bold { font-weight: bold; }
.collapse { border-collapse: collapse; }
.inline, .ln { display: inline; }
.i-blk { display: inline-block !important; }
.none { display: none !important; }
.softnone { display: none; }
.invisible { visibility: hidden; }
.mauto { margin: auto; }
.m0 { margin: 0px !important; }
.m5 { margin: 5px; }
.mr10 { margin-right: 10px; }
.mr5 { margin-right: 5px; }
.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px !important; }

.nopad { padding: 0px !important; }
.nomargin { margin: 0px !important; }

.pad10 { padding: 10px; }
.pad5 { padding: 5px; }
.pad2 { padding: 2px; }
.p25 { padding: 25px; }
.padt2 { padding-top: 2px; }
.padt5 { padding-top: 5px !important; }
.padt10 { padding-top: 10px; }
.padt15 { padding-top: 15px; }
.padt20 { padding-top: 20px; }
.padt25 { padding-top: 25px; }
.padt50 { padding-top: 55px; }

/*span.padt10 { display:inline-block;}*/

.padb5 { padding-bottom: 5px }

.padl15 { padding-left: 15px; }
.padl35 { padding-left: 35px; }
.padl70 { padding-left: 70px; }
.padl75 { padding-left: 75px; }
.padl110 { padding-left: 110px; }
.padl120 { padding-left: 120px; }
.padl130 { padding-left: 130px; }

.padr20 { padding-right: 20px; }

.w100 { width: 100px; }
.w200 { width: 200px; }
.pw100 { width: 100% !important; }
.pw99 { width: 99% !important; }
.pw98 { width: 98% !important; }
.pw95 { width: 95% !important; }
.pw90 { width: 90%; }
.pw80 { width: 80%; }
.pw70 { width: 70%; }
.pw60 { width: 60%; }
.pw55 { width: 55%; }
.pw50 { width: 50%; }
.pw45 { width: 45%; }
.pw40 { width: 40%; }
.pw33 { width: 33%; }
.pw30 { width: 30% !important; }
.pw25 { width: 25%; }
.pw10 { width: 10% !important; }

.w16 { width: 16px; }
.h300 { height: 300px; }
.h75 { height: 75px; }
.h5 { height: 5px; }

.ph100 { height: 100%; }

.mauto { margin: auto; }

.pw100.border { width: calc(100% - 2px) !important; }

.rel { position: relative !important; }
.staple { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.vtop { vertical-align: top !important; }
.vmid { vertical-align: middle !important; }
.lft { text-align: left; }
.rit { text-align: right; }
.cen { text-align: center; }
.f-rit { float: right; }
.f-lft { float: left; }
.clear { clear: both; }

.upper { text-transform: uppercase; }

.rit.pad5 { padding-right: 0; }

.agreementitems { padding: 25px 0; }

/**/
.mosaic .stat { bottom: 34px; right: 2px; height: 14px; }
.mosaic .stat > div { height: 13px; }
.stat { height: 100%; top: 0; right: 0; bottom: 0; left: 0; position: absolute; overflow: hidden; width: auto; background: #DDD; border: none; opacity: 0.95; border-radius: 4px; }
.stat > div { font-size: 13px; font-family: Arial; vertical-align: middle; }
.yesno { width: 100%; border: none; }
.yesno > div { text-align: center; bottom: 0; top: 0; position: absolute; vertical-align: middle; line-height: 25px; padding: 0 0 3px 0; cursor: pointer; transition: all ease-in-out 0.2s; }
.yesno .yes { background: #090; color: #FFF; left: 0; }
.yesno .no { background: #F00; right: 0; color: #FFF; }
.yesno .yes:hover { background: #3C3; }
.yesno .yes:hover { background: #3C3; }
.yesno .no:hover { background: #D00; }

/**/
.profile-links { background: transparent; border-left: solid 1px rgba(255,255,255,0.1); border-right: solid 1px transparent; height: 40px; }
.profile-links ul { height: 100%; }
.profile-links li { margin-top: 8px; margin-right: 2px; border: solid 1px transparent; padding-top: 5px; padding-bottom: 5px; }
.profile-links li > a { padding: 2px; }
.profile-links li:hover { border-color: #666; background-color: #666; }
.profile-links li:hover > a { color: #FFF; }
.no-touch .profile-links li > a:hover { background-color: transparent; }

/**/

.breadcrumb { font-size: 11px; color: #C0C0C0; margin-bottom: 10px; }
.breadcrumb a { color: #C0C0C0; }

a img { border: none; }

/* Fonts */
h1, h2, h3, h4 { color: #000; font-family: Poppins, "Open Sans", Segoe UI, Arial, Helvetica, sans-serif; margin: 0 0 5px 0; padding-bottom: 0; font-weight: 600; line-height: 1.45em; -webkit-margin-after: 0; }
h1 { font-size: 20px; font-weight: 600; }
h2 { font-size: 17px; font-weight: 600; }
h3 { font-size: 15px; font-weight: 600; color: #222 }
h3 a.icn-16 { padding-bottom: 0px; }
h3:hover a, h3 a:hover { text-decoration: underline; }
h4 { font-size: 15px; font-weight: 600; color: #222; }
h5 { margin-top: 4px; margin-bottom: 4px; }

h2 a, h3 a { color: inherit !important; font-size: inherit !important; }
/*h2 span.issuename{color:inherit !important;font-size:inherit !important;}*/

/* Temporary */

#profile { position: relative; text-align: center; padding-top: 5px; margin-bottom: 10px; }
#profile a { vertical-align: top; }
#profile a.avatar { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
#profile .avatar { max-width: 100%; font-size: 0; }


body.sidebar .c-wrapper { display: table; width: 100%; }
body.sidebar .c-wrapper > div { display: table-row; }
body.sidebar .c-inner,
body.sidebar .c-sidebar { display: table-cell; vertical-align: top; }
body.sidebar .c-inner { width: 75%; padding-right: 5px; }
body.sidebar .c-sidebar { padding-left: 20px; }

/* Temporary End */

#u-menu { padding-left: 10px; }

.av { background-size: cover; background-repeat: no-repeat; }
.av img { visibility: hidden; aspect-ratio: 1 /1; }

/* Tables */
.table.style { border-collapse: collapse; width: 100%; margin-top: 5px; margin-bottom: 5px; }
.table.style tr:nth-child(even) > td /*, .table > div:nth-child(even) > div */ { background: #fafafa; border-bottom: 1px solid #ebeff2; transition: all ease-in-out 0.2s; }
.table.style td { padding: 6px 5px; line-height: 18px; word-wrap: break-word; vertical-align: top; border-bottom: 1px solid #ebeff2; vertical-align: middle; }
/* Rows */


.activity-lastcolumn .rrow, .rrow { width: calc(100% - 20px); display: block; padding: 10px; border-bottom: solid 1px #EFEFEF; height: auto; min-height: 90px; border-radius: 4px; background: #FFF; }
.activity-lastcolumn .rrow .table { width: 100%; }

.rrow .img > div { overflow: hidden; width: 100px; aspect-ratio: 1 /1; background-size: cover; background-position: center center; }
.rrow, .list > div.rrow h3 { margin-top: 0; }

.column .rrow .table > div > div.mainbody { min-width: calc(100% - 100px); }
.column .rrow, .column .list > div.rrow { }


.activity-lastcolumn .rrow .table > div > div.mainbody { min-width: 75%; }

.rrow div.agreement, .item div.agreement { text-align: left; word-break: keep-all; height: auto !important; padding: 4px 0 !important; font-size: 1.25em; font-weight: bold; }
.rrow div.agreement span, .item div.agreement span { font-size: 0.8em; font-weight: 200; }
.rrow div.agreement .yes, .item div.agreement .yes { color: #32BB9D; }
.rrow div.agreement .no, .item div.agreement .no { color: #F00; }

.rrow .img > div.agreement { text-align: center; }
.rrow .img div.stat { bottom: -24px; top: auto; max-height: 24px; width: auto !important; }

.rrow.post .mainbody { padding-bottom: 10px; }
.rrow.post .desc { font-size: 14px; }
.rrow.post .img > div img { border-radius: 50%; width: 80%; }
.activity-lastcolumn .rrow.post { min-height: 50px; padding: 20px 20px 0px 20px; }
.activity-lastcolumn .rrow.post .table > div > div.mainbody { min-width: 85%; }


.rrow .mainbody { padding-left: 12px; padding-bottom: 0; }
.rrow .controls { position: absolute; bottom: 8px; }
.rrow .controls a { display: inline-block; color: #AAA; padding: 3px 7px; transition: all ease-in-out 0.2s; width: auto; height: auto; }


.image-editor .preview { background-size: contain; height: auto; aspect-ratio: unset; }

/*Form elements, Checkboxes, Dropdowns, Radio buttons text areas text inputs*/
textarea { resize: none; }
.fbox input, .fbox input[type=text], .fbox textarea { width: 98% !important; padding-left: 1%; padding-right: 1%; }

input.txt, input[type=text], textarea, .rstext textarea, .comment textarea { font-family: Segoe UI,Tahoma,Geneva,Arial,sans-serif; border: solid 1px #E0E0E0; color: #303030; border-radius: 3px; -webkit-appearance: none; background: rgba(0,0,0,0.02); }
input.txt, input[type=text] { height: 18px; padding: 15px 20px 15px 20px; font-size: 15px; width: calc(100% - 42px); line-height: 18px; }
input.txt:hover, input[type=text]:hover, textarea.txt:hover { border-color: #ECD672; }
input.txt:focus, input[type=text]:focus, textarea.txt:focus { border-color: #ECD672; color: #000; }
textarea, .rstext textarea, .comment textarea { line-height: 22px; padding: 12px 10px 14px 10px; width: calc(100% - 22px); font-size: 13px; }


input.txt.time { width: 130px; background: #EFEFEF url('../img/icn/16/clock.png') no-repeat 120px 2px; text-align: left; }
input.txt.datepicker, input.txt.date { width: 130px; background: #EFEFEF url('../img/icn/16/calendar-16.png') no-repeat right center; text-align: left; }
input[type=submit], input[type=button] { -webkit-appearance: none; }

.ui-widget-header { border-color: #FFF; background: #EEE; border-radius: 0; }


.fulltext { border: solid 1px #EEE; }
.fulltext textarea, .fulltext .rstext textarea, .fulltext .comment textarea { border-color: transparent; width: calc(100% - 22px); }

/* Resizable Textbox Formatting */
.rstext { zoom: 1; min-height: 24px; vertical-align: middle; position: relative; }
.rstext.rel { margin-top: 5px; max-width: 100%; }
.rstext .point { display: block; position: absolute; top: -5px; left: 20px; height: 7px; width: 13px; background: transparent url('/inc/img/design/resizable-textbox-point.png') no-repeat; }
.rstext textarea, .comment textarea { color: #303030; font-size: 1.1em; line-height: 22px; overflow: auto; margin-bottom: 0px; -webkit-transition: height 0.2s; -moz-transition: height 0.2s; transition: height 0.2s; }

.rstext textarea { min-height: 22px; }
.rstext .controls { display: none; height: 24px; position: absolute; bottom: 5px; right: 16px; max-width: 150px; }
.rstext:hover .controls { display: block; }
.rstext .controls a { cursor: pointer; margin-top: 1px; display: block; float: right; width: 22px; height: 21px; border: solid 1px #FFF; opacity: 0.7; filter: alpha(opacity = '70'); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }
.rstext .controls a:hover { border: dashed 1px #09F; opacity: 1.0; filter: alpha(opacity = '100'); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
.rstext .controls span.chars { margin-right: 5px; display: block; padding-top: 5px; float: right; color: #666; font-size: 10px; }
.rstext .controls a.spell { background: transparent url('/inc/img/design/spellcheck_small.png') no-repeat center center; }

/**/
#instruct { position: relative; width: 99%; height: 20px; margin: 5px auto 0px auto; border-radius: 5px 0 0 5px; padding: 8px 5px 8px 8px; font-size: 15px; font-family: Tahoma,Geneva; color: #FFF; background: rgb(0,130,148); background: linear-gradient(90deg, rgba(0,130,148,1) 0%, rgba(0,130,148,1) 84%, rgba(0,130,148,0) 98%); }

/* Icons & Buttons */
.hover-pad { position: relative; z-index: 10; }
.hover-pad > .hover-block { opacity: 0; z-index: 11; position: absolute; bottom: 15px; right: 15px; padding: 7px 9px 7px 9px; background: #FFF; color: #FFF; border-radius: 50%; text-align: center; transition: all 0.2s ease-in-out; }
.hover-pad > .hover-block i { font-size: 18px; color: #000; }
.hover-pad:hover > .hover-block { opacity: 1; }
.hover-pad.editmode:hover > .hover-block { display: none; }

.socialbtn { color: #FFF !important; padding: 4px 10px 3px; line-height: 38px; display: block; min-width: 200px; text-align: center; font-weight: 600; margin-bottom: 8px; border: solid 1px rgba(0,0,0,0); border-radius: 2px; }
.socialbtn:hover { text-decoration: none; }
.socialbtn .fab { margin-right: 8px; font-size: 1.2em; font-weight: normal }
.socialbtn.facebook { background-color: #3C66C4; }
.socialbtn.google { background-color: #CF4332; }
.socialbtn.linkedin { background-color: #283E4A; }
.socialbtn.facebook:hover { background-color: #2B55B3; }
.socialbtn.google:hover { background-color: #BE3221; }
.socialbtn.linkedin:hover { background-color: #394F5B; }
.socialbtn.microsoft { background-color: #FFFFFF; color: #1b1b1b !important; border-color: #CCC }
.socialbtn.microsoft:hover { background-color: #EFEFEF; }

/*Buttons for Response.*/
.green-btn.larger, .brightgreen-btn.larger, .red-btn.larger, .secondary-btn.larger, .brightred-btn.larger,
.green-btn.large, .brightgreen-btn.large, .red-btn.large, .secondary-btn.large, .brightred-btn.large { font-size: 1.05em; padding: 5px 25px 6px 25px !important; text-decoration: none !important; }
.green-btn.thin, .brightgreen-btn.thin, .red-btn.thin, .brightred-btn.thin { font-size: 0.9em; padding: 0px 8px 0px 8px !important; }
.green-btn.icn-16, .brightgreen-btn.icn-16, .red-btn.icn-16 { padding-left: 0px; display: block; }
.green-btn:disabled, .green-btn:disabled:hover, .red-btn:disabled, .red-btn:disabled:hover,
.brightred-btn:disabled, .brightred-btn:disabled:hover { border: solid 1px #E0E0E0; color: #FFF; background: #E0E0E0; cursor: default; }

input.primary-btn[disabled] { opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; border: solid 1px #C0C0C0; background: #FFF; color: #C0C0C0; cursor: default; }
input.primary-btn[disabled]:hover { border: solid 1px #C0C0C0; background: #FFF; color: #C0C0C0 }


/* Advertisements */
.ad-text { font-size: 0.8em; color: #CCC; height: 13px; }
.site-ad { position: relative; margin: auto; overflow: hidden; }
.site-ad img { width: 100%; }
.ad-banner { }

.ad-skyscraper160x600 { max-width: 180px; }
.ad-banner728x90 { max-width: 728px; }
.ad-rectangle300x250 { max-width: 300px; height: 263px; }
.ad-rectangle336x280 { max-width: 336px; }

.middle { width: 75%; position: relative; max-width: 1550px; margin: auto; }
/*#hdr > .middle, #content > .middle { width: 75%; }*/


/* Layout */
.l-menu { position: relative; font-size: 13px; vertical-align: top; box-shadow: 0 5px 10px rgba(0,0,0,0.1); border-right: solid 1px rgba(0,0,0,0.1); background: #FFF; width: 250px; min-width: 180px; max-width: 250px; padding: 72px 10px 90px 10px; z-index: 19 }
.l-menu .inner .icn-16.title { color: #FFF; }
.l-menu .inner .icn-16.title:hover { background: transparent; }
.l-menu .inner .icn-16 { margin-left: 2px; margin-right: 0; padding-left: 28px; }
.l-menu .inner .icn-16:hover { background: #58595B; }
.l-menu .inner .icn-16 span { position: absolute; left: 0; }
.l-menu .pnl { padding: 0; margin-top: 25px; margin-bottom: 10px; border: none !important; }
.l-menu .pnl h3 { margin: 2px 0 8px 0; padding-bottom: 1px; }
.l-menu .inner .icn-16.group { padding-left: 34px; }
.no-touch .l-menu .ftr a:hover { text-decoration: underline; }

.l-menu .label { padding: 5px 0; color: #CCC; text-transform: uppercase; }
.l-menu .title { margin-top: 0; }
.l-menu .title > a { color: #333; font-size: 15px; font-weight: bold; word-wrap: break-word; }


.l-menu .mitem { border: solid 1px #FFF; border-radius: 3px; transition: all 0.1s ease-in-out; position: relative; }
.l-menu .mitem:hover { border-color: #EEE; background-color: #EEE }
.l-menu .mitem span { display: inline-block; width: 22px; padding-left: 4px; margin: 0 !important; }
.l-menu .mitem a { display: block; padding: 7px 6px; }
.l-menu .mitem a i { margin-right: 5px; }
.l-menu .mitem a i.red { color: #F00; }
.l-menu .mitem.disabled a { color:#C0C0C0; }
.l-menu .mitem.disabled:hover {background:rgba(0,0,0,0) }

.l-menu .mitem span.alert { position: relative; width: 6px; height: 6px; line-height: 6px; display: inline-block; padding: 4px 4px 4px 4px; background: #F00; color: #FFF !important; font-size: 10px; font-family: Arial; margin-left: 6px !important; opacity: 0.9; filter: alpha(opacity=90); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; border-radius: 50%; }
.l-menu .mitem .alert:hover { background: #E00; }
.l-menu .mitem .alert.important { position: relative; }
.l-menu .mitem .alert.important:hover { background: #A00; }
.l-menu .mitem .alert a { position: absolute; top: 0px; background: #F00; }

.l-menu .menulinks { }
.l-menu .menulinks .menuitem { display: block; border: solid 1px #FFF; border-radius: 3px; padding: 7px 6px; transition: all 0.1s ease-in-out; position: relative; }
.l-menu .menulinks .menuitem:hover { border-color: #EEE; background-color: #EEE; }


#menu-verify-your-email a { color:#F00; }
#menu-verification-email-sent a{ color:#090}

.invisible { opacity: 0; }

.mitem span { margin-right: 8px; }
#menu-delete-group a,
#menu-leave-group a,
#menu-cancel-request a { color: #F00 }

#menu-restore-group a { }
#menu-request-to-join-group a { color: #090 }

#main-body .buttonlist .mitem { display: inline-block; margin-right: 20px; }
#main-body .buttonlist { margin-top: 15px; }
#main-body .buttonlist .mitem a { border: solid 1px #C0C0C0; padding: 5px 16px; border-radius: 4px; }
#main-body .buttonlist h3 { margin-bottom: 10px; }

/* Groups */
#main-body .groupjoin { padding: 30px 20px 45px; background: #F6F6F6; max-width: 500px; margin: 50px auto 50px; border-radius: 10px; font-size: 1.2em; text-align: center; }
#main-body .groupjoin .fa { width: 20px; }

.groupmember #main-body .groupjoin { padding: 0; background: #FFF; font-size: 1.1em; }
.groupmember #main-body .buttonlist > a { display: inline-block; margin-right: 0; margin-left: 20px; }

.fa.red { color: #F00 }

#pageheader { }
#pageheader .link { border-radius: 5px; padding: 4px; font-size: 14px; font-weight: bold; color: rgb(0, 102, 204); }
#pageheader .link:hover { background: #EEE; }

.link { font-size: 14px; font-weight: bold; color: rgb(0, 102, 204); }

#main-body { padding: 67px 0 0 20px; position: relative; min-height: 100vh; }
.signedin #main-body { padding-top: 85px; width: 100%; max-width: 1240px; }

.signedin.vx-hdrimg #main-body { padding-top: 10px; }

.main-menu .menulinks { min-width: 38%; text-align: right; }
.menulinks .menuitem { margin-top: 1%; margin-bottom: 1%; }

.column iframe { max-width: 100% !important; }
.column .pnl { padding: 15px; border: solid 1px #E9E9E9; margin-bottom: 15px; border-radius: 5px; }
.column .pnl h2 { margin-top: 0; }

.vxtitle { z-index: 1; position: relative; display: block; }
.vxtitle a, #menu .vxtitle a { vertical-align: middle; padding: 0; }
.vxtitle a img { margin-right: 8px; margin-top: 3px; float: left;  }

.vxtitle.haslogo { margin-top: 0; }
.vxtitle.haslogo a img { max-height: 100%; min-height: 90%; margin-top: 0; }
.vxtitle.haslogo #logo { background: none; height: 59px; }

.pnl { padding: 10px 15px; margin-bottom: 10px; position: relative; background: #FFF; border: solid 1px #EFEFEF; border-radius: 5px }
.pnl > div { /*padding: 15px 0;*/ }
.pnl .inner { color: #666; }
.pnl div.case { padding: 0px 5px 5px 5px; margin-top: 0px; }
.pnl > a > div { width: 210px; position: relative; }
.pnl .pnl, .pnl > div.pnl { margin-top: 15px; }

.pnl.gray > div, .pnl.gray .pnl { background: #EEE; }

/**/

.note b { color: #606060; }
.note span.info { cursor: pointer; margin-right: 2px; margin-left: 2px; }
.note span.info { font-family: "Font Awesome 6 Pro"; font-weight: 200; font-style: light; font-variant: normal; text-rendering: auto; line-height: 1; }
.note span.info::before { content: "\f059"; }
.note i { margin-right: 2px;  }
.note.small { font-size: 11px; }

.descpnl { margin-top: 0; padding: 0 0 6px 0 !important; margin-bottom: 0; border-bottom: solid 1px #EEE; }
.descpnl > p { margin: 0; padding: 0; }

span.prompt, .descpnl, .note { font-size: 12px; color: #555; font-weight: 300; }
span.prompt a, .descpnl a { text-decoration: underline; color: #999; }
/**/

/*#hdr #search-box { }*/
/*#searchbtn { display: none; top: 9px; position: absolute; right: 40px; z-index: 10; }*/
#searchbtn .mobile-search-btn, a#mobile-btn { color: #000; z-index: 10; }
#searchbtn .mobile-search-btn { font-size: 17px; }
.mobile-search-btn.opened { display: none; }

#hdr #searchouter .close { display: none !important; }
#hdr .spc2 { text-align: right; }
#hdr .spc2 a { font-size: 20px; }

#mobile-btn-c { width: 30px; text-align: right; padding-right: 10px; }
body.signedin #mobile-btn-c { }

/* Mobile Menu */
#mobile-menu { margin: 0; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 300; display: none; background-color: rgba(25,25,25,0.9); }
#mobile-menu.open { display: block; }
#mobile-menu #menu { color: #444; }
#mobile-menu #menu .menuitem { border-bottom: 1px solid rgba(255, 255, 255, 0.2); border-top: medium none; color: #444; display: block; font-size: 16px; padding: 10px 5% 10px 5%; text-decoration: none; text-align: left; }
#mobile-menu #menu a { padding: 0; background: transparent; }
#mobile-menu #menu a.icn-16 { padding-left: 28px; }
#mobile-menu .box a { background: rgba(0,0,0,0); }
#mobile-btn { color: #ffffff; cursor: pointer; font-size: 30px; }
#mobile-wrap { position: relative; z-index: 2; min-height: 80vh; }
#mobile-menu .l-menu { margin-top: 10%; text-align: center; font-size: 17px; }
#mobile-menu .l-menu .inner .icn-16 span { display: none; }
#mobile-menu .l-menu .inner .icn-16 { padding-left: 0; }
#mobile-menu .l-menu .pnl { max-width: 350px; }

#menumob { margin: auto; max-width: 80%; padding-top: 20px; }
#menumob .l-menu { width: 100%; }
#menumob .menulinks { display: block; position: relative; right: auto; left: auto; width: 100%; }
#menumob .menulinks a { display: block; text-align: center; padding: 10px 0; font-size: 18px; font-weight: 600; margin-bottom: 0; margin-top: 0; line-height: 18px; color: #FFF; }
#menumob .copyright { color: rgba(255,255,255,0.2); text-align: center; }
#menumob #closemenu { position: absolute; top: 10px; right: -20px; color: rgba(255,255,255,0.8); font-size: 17px; }
#menumob .sociallinks { margin-top: 35px; text-align: center; }

/**/
body.vx-hdrimg { }
body.vx-hdrimg #menu .middle { max-width: 95%; width: 95%; }
body.vx-hdrimg.scrolled #hdr { border-bottom: none; box-shadow: 0px 4px 10px rgba(0,0,0,0.1); }
body.vx-hdrimg .headerimage { position: relative; width: 100%; margin: 0; padding: 0; max-height: 100vh; overflow: hidden; line-height: 0; }
body.vx-hdrimg.signedin .headerimage { max-height: 450px; }
body.vx-hdrimg .headerimage .img { background-color: #666; background-position: center center; background-size: cover; width: 100%; aspect-ratio: 50 / 15 }
body.vx-hdrimg .headerimage .headertitle { position: absolute; top: 200px; left: 0; right: 0; text-align: center; z-index: 12; }
body.vx-hdrimg .headerimage .headertitle h1 { color: #FFF; font-weight: 300 !important; font-size: 50px; line-height: 1.1; font-family: 'Poppins' !important; display: block; width: 1250px; max-width: 80%; margin: auto; }
body.vx-hdrimg .detail .inner h1 { }

body.vx-hdrimg.signedin .headerimage .headertitle { top: 150px; }
body.vx-hdrimg.signedin .headerimage .headertitle .middle { margin-left: 100px; }

/* Image Library */
#image-library { display: flex; gap: 5px; flex-wrap: wrap; height: auto; width: 100%; border: none; margin: 15px 0 10px 0; }
#image-library > div { width: calc((100% - 67px) / 8); aspect-ratio: 1 / 1; border: solid 2px #FFF; display: inline-block; background: #FFF; text-align: center; overflow: hidden; background-repeat: no-repeat; background-position: center center; cursor: pointer; position: relative; transition: all ease-in-out 0.2s; }
.no-touch #image-library > div:hover { border-color: #09F; }
#image-library > div .ftr { position: absolute; bottom: 0; right: 0; left: 0; display: none; background: rgba(0,0,0,0.5); color: #FFF; opacity: 0.75; font-size: 13px; }
#image-library > div .ftr a { color: #FFF; }
#image-library .ftr a:hover { color: #09F; }
.no-touch #image-library > div:hover .ftr { display: block; }
#image-library .file { background-position: center 10%; overflow: visible; background-size: 32px; }
#image-library .file .ftr { display: block; color: #666; background: rgba(0,0,0,0); top: 45px; }
#image-library .file .ftr span { display: block; margin-bottom: 5px; }
#image-library .file .ftr span.gname { font-size: 0.9em; font-style: italic; }
#image-library .file .ftr a { color: #666; font-size: 13px; }

#image-library .icnbtn { background-position: center center; }
.no-touch #image-library > div:hover .lightshow { display: block; }
#image-library .lightshow { top: 2px; right: 2px; position: absolute; display: none; opacity: 0.8; filter: alpha(opacity='80'); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; }
.no-touch #image-library .lightshow:hover { opacity: 1.0; filter: alpha(opacity='100'); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

/* Box Grid */

.box-grid { position: relative; display: flex; gap: 10px; flex-wrap: wrap; }
.box-grid i { font-size: 50px; margin-top: 10px; margin-bottom: 10px; }
.box-grid h3 { font-size: 17px; }
.box-grid > div { width: calc((100% - 38px) / 4); aspect-ratio: 2 / 1; border: solid 1px #CCC; border-radius: 4px; position: relative; transition: all ease-in-out 0.2s; }
.box-grid > div > div { padding: 10px 20px 20px 20px; }
.box-grid div > a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; cursor: pointer; }
.box-grid div.click {  cursor: pointer; }
.box-grid div.selected, .box-grid div.selected:hover { border-color: #000; }



#content { z-index: 0; position: relative; }
/*  */
.panel { background: #EEE; padding: 30px 30px; margin-bottom: 25px; position: relative; }
.panel.nofill { background: transparent; }
.panel.filler { padding-left: 0; padding: 0; margin-top: 0px; }
.panel.filler img { width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0; padding: 0 !important; }
.panel .titleoverlay { position: absolute; top: 22%; left: 25%; right: 25%; text-align: center; background: rgba(255,255,255,0.3); padding: 15px; }
.panel .titleoverlay h1 { font-size: 2.7em; }
.panel h1 { font-weight: 200; line-height: 1.4em; margin: 25px 0 15px; }

/**/

.list-numbered { list-style: none; margin-left: 1em; counter-reset: line; }
.list-numbered > li { position: relative; }
.list-numbered > li:before { position: absolute; left: -4.25em; top: 5px; display: inline-block; width: 22px; height: 20px; padding: 12px 10px 10px 10px; margin-right: 0.5em; background-color: #32BB9D; border-radius: 50%; font-weight: 600; color: #FFF; text-align: center; line-height: 1.25em; font-size: 1.25em; counter-increment: line; content: counter(line); }


/* */

.loader { width: 80px; position: fixed; z-index: 15000; display: none; left: calc(50% - 40px); top: 10vh; }
.loader .inner { padding: 12px 25px 12px 25px; position: absolute; width: 78px; height: 18px; font-family: Arial; font-size: 14px !important; font-weight: bold; color: #FFF; }
.loader span { width: 16px; height: 16px; float: left; display: block; margin-right: 4px; background: url('/skinimg/white-loader.gif') no-repeat center center; }
#wrap > .loader { position: fixed; }

.loadingPanel { display: none !important; }
.overlay { z-index: 999; position: fixed; }

.loader-overlay { z-index: 100; position: absolute; }
.loader-overlay > .mid { top: 2px; left: 2px; right: 2px; bottom: 2px; padding: 2px 2px 2px 4px; position: absolute; font-family: Arial; text-align: center; font-weight: bold; color: #FFF; z-index: 101; vertical-align: middle; }
.loader-overlay .bg, .o2k7Skin .mceBlocker { position: absolute; }
.loader-overlay img { vertical-align: middle; max-height: 32px; }
.loader-overlay img.small { vertical-align: middle; width: 18px; }
.loader-overlay .bg, .o2k7Skin .mceBlocker, .overlay, .loader .inner { top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.6); }

/* */

div.box-hdr h2, .list > div.box-hdr h2 { padding-top: 4px; color: #000; }
div.box-hdr, .list > div.box-hdr { background: none; border: solid 1px #FFF; padding: 1px 5px 1px 5px; }


#divDialog { overflow: hidden; }
#divDialog .nosubmit .preview { display: none; }
#divDialog .preview { border: solid 1px #D7D7D7; margin-top: 10px; margin-left: 5px; min-height: 50px; width: 750px; padding: 10px; }
#divDialog .preview .canvas { margin: 5px; }
.editor .inner { padding: 5px; }

.preview { }
.preview .canvas { border: solid 1px #FFF; background: #FFF; }
.preview .canvas th { font-weight: normal; color: #606060; }
.preview .canvas tr th { padding: 2px; background: #E7E7E7; border-bottom: solid 1px #E0E0E0; }
.preview .canvas tr th:first-child { padding: 2px 2px 2px 5px; background: #E7E7E7; text-align: left; border-right: solid 1px #E0E0E0; }
.preview .canvas tr td { padding: 5px 2px 1px 2px; min-width: 30px; }
.preview .canvas tr td .checkbox.nolabel span.item, .preview .canvas tr td .radio.nolabel span.item { margin-left: 40%; }

/**/
.graybg { color: #A0A0A0; }
.graybg:hover { color: #606060; }

/*CLICK LIST*/
.click-list ul li.deleteready > span, .click-list ul li.deleteready.selected > span { color: #FFF; background-color: #F00; }
.click-list ul li.locked > span, .click-list ul li.locked:hover > span { color: #606060; background-color: #C0C0C0; background-image: linear-gradient(#E0E0E0, #C0C0C0); background-image: -o-linear-gradient(#E0E0E0, #C0C0C0); background-image: -moz-linear-gradient(#E0E0E0, #C0C0C0); background-image: -webkit-linear-gradient(#E0E0E0, #C0C0C0); background-image: -ms-linear-gradient(#E0E0E0, #C0C0C0); background-image: -webkit-gradient(linear,left bottom,right top,#E0E0E0,#C0C0C0); }

.results.click-list > .data > div { line-height: 20px; height: 28px; position: relative; vertical-align: middle; padding: 1px 5px 1px 0px !important; cursor: pointer; z-index: 102; color: #666; transition: all ease-in-out 0.2s; border-radius: 3px; }
.results.click-list .data > div.thumb, .results.click-list div.thumb:hover { height: 22px; width: 28px; }
.results.click-list .data > div:hover div.thumb, .results.click-list div.selected div.thumb { background-position: center center; background-repeat: no-repeat; }
.results.click-list .data > div:hover, .results.click-list div.selected { background: #09F; color: #FFF; }
.results.click-list .data > div.nohover { height: 20px; }
.results.click-list .data > div.nohover:hover { background: none; color: #666; }
.results.click-list .data > div img { vertical-align: middle; height: 28px; margin-right: 3px; }
.results.click-list > div.loader { cursor: default; background: none; color: #333; height: 18px; text-align: left; vertical-align: middle; position: absolute; top: -32px; right: 0px; display: block; width: 90px; }
.results.click-list > div.loader:hover { background: none; }
.results.click-list > div.loader img { height: 16px; width: 16px; float: left; margin-right: 2px; }
.results.click-list div i.tip { position: absolute; right: 5px; font-size: 0.9em; }

.click-list { padding: 8px !important; margin-top: 5px; margin-bottom: 12px; border: solid 1px #E0E0E0; position: relative; min-height: 24px; border-radius: 2px; -moz-border-radius: 2px; transition: all ease-in-out 0.2s; }
.click-list.enabled:hover { border-color: #09F; cursor: text; }
.click-list.highlight, .click-list.highlight:hover { border-color: #08F; }
.click-list ul { margin: 0px; padding: 4px 0 0 0; list-style: none; }
.click-list ul li { line-height: 24px; display: inline-block; margin: 0 2px 1px 0; }
.click-list ul li > span { font-size: 12px; position: relative; cursor: pointer; display: block; padding: 1px 8px 2px 4px; color: #444; outline: medium auto; background-position: 0px 0px; outline-style: none; background-color: #F0F0F0; border: solid 1px #EEE; border-bottom-color: #DDD; border-right-color: #DDD; border-radius: 15px; -moz-border-radius: 15px; transition: all ease-in-out 0.2s; }
.click-list ul li > span.hasimg { padding-left: 0; }
.click-list ul li > span:hover { background-color: #07D; color: #FFF; }
.click-list ul li.selected > span { color: #FFF; background-color: #09F; }
.click-list ul li.locked > span, .click-list ul li.locked:hover > span { color: #606060; background-color: #C0C0C0; }
.click-list .del { text-transform: lowercase; margin-left: 4px; color: #8A8A8A; }

.click-list .clear-all { position: absolute; right: 0px; bottom: 0px; margin: 2px 2px 5px 5px; }

.click-list ul li.search { padding-right: 18px; }
.click-list ul li.search input { min-width: 175px; max-width: 450px; padding: 2px 8px; box-shadow: none; outline: none; border-color: transparent; background: transparent; font-size: 1.1em; font-family: 'Segoe UI',Arial; font-weight: 400; width: calc(100% - 36px); color: #ADB5BD; }
.click-list ul li.error > span { background-color: #F91D1D; background-image: -moz-linear-gradient(#F9AFAF, #F91D1D); border-color: #D98888 #DF3939 #DF3939; color: #FFFFFF; }
.click-list span.del { display: none; }
.click-list .thumb { width: 22px; height: 22px; margin-right: 4px; margin-top: 2px; padding-right: 0px; background-size: cover; background-repeat: no-repeat; float: left; border-radius: 10px; }

.click-list.tags ul li > span { padding: 1px 8px 2px 8px; }
.click-list.tags .thumb { display: none; }
.results.click-list#results_P_EOB_cPost_Tags_Tags .thumb { display: none; }

.results.click-list { display: none; position: absolute; line-height: 16px; padding: 2px 8px 2px 8px !important; z-index: 1500; border: solid 1px #e0e0e0; border-top: none; box-shadow: 0 5px 5px rgba(0,0,0,0.2) }
.results.click-list .data { position: relative; z-index: 102; }
.results.click-list > span.bg { z-index: 101; background: rgba(255,255,255,0.9); position: absolute; display: block; bottom: 0; top: 0; left: 0; right: 0; }
.results.click-list .item { line-height: 20px; height: 25px; position: relative; vertical-align: middle; padding: 1px 5px 1px 5px; cursor: pointer; color: #666; }
.results.click-list .thumb { margin-left: 3px; }
.results.click-list .item .thumb, .results.click-list .item .thumb:hover { height: 22px; width: 28px; }
.results.click-list .item:hover .thumb, .results.click-list .selected .thumb { background-position: center center; background-repeat: no-repeat; }
.results.click-list .item:hover, .results.click-list .item.selected { background: #09F; color: #FFF; }
.results.click-list .nohover { height: 20px; padding: 1px 5px 1px 5px; }
.results.click-list .nohover:hover { background: none; color: #666; }
.results.click-list .data > div img { vertical-align: middle; height: 28px; margin-right: 3px; }

.results.click-list .loader { cursor: default; background: none; height: 18px; text-align: left; vertical-align: middle; position: absolute; top: -24px; right: 0px; display: block; }
.results.click-list .loader:hover { background: none; }
.results.click-list .loader img { height: 16px; width: 16px; float: left; margin-right: 2px; }

.click-list.tags ul:before { content: "\f02c"; font-family: "Font Awesome 6 Pro"; font-weight: 900; font-size: 17px; color: #ADB5BD; margin-right: 4px; }

/*CLICK LIST END*/

/**/
.sectionedcircle { position: relative; padding: 5px; overflow: hidden; margin: 20px auto; border: solid 3px #888; border-radius: 50%; }
.sectionedcircle ul { position: relative; margin: 0; padding: 0; width: 32em; height: 32em; border-radius: 50%; list-style: none; overflow: hidden; }
.sectionedcircle .slice { overflow: hidden; position: absolute; top: 0; right: 0; width: 50%; height: 50%; transform-origin: 0% 100%; border: solid 2px #FFF; }
.sectionedcircle .slice:first-child { transform: rotate(15deg); }
.sectionedcircle .slice-contents { transition: all ease-in-out 0.2s; position: absolute; left: -100%; width: 200%; height: 200%; border-radius: 50%; background: lightblue; }
.sectionedcircle .slice:first-child .slice-contents { }
.sectionedcircle .slice:hover .slice-contents { background: violet; }

.sectionedcircle .inner { position: absolute; z-index: 10; width: 50%; height: 50%; }
.sectionedcircle .inner .link { position: absolute; top: 0; right: 0; bottom: 0; left: 0; cursor: pointer; z-index: 11; }
.sectionedcircle .inner img { width: 110%; padding: 0; position: absolute; top: 0; right: 0; bottom: 0; left: -5%; display: none; }
.sectionedcircle .title { position: absolute; z-index: 12; top: 8%; text-align: center; }
.sectionedcircle .title h3 { max-width: 80%; margin: auto; }
.sectionedcircle.slices6 .inner img { width: 140%; }

/**/

/**/

.result { margin-bottom: 10px; }
.result:first-child .hdr { margin-top: 0; }
.result h2 { font-size: 14px; }
.result .hdr { margin-top: 35px; margin-bottom: 15px; padding: 5px 0px 0px 5px; }
.result h3 { }
.result h3 a { font-weight: bold; }
.no-touch .result h3 a:hover { text-decoration: none; }
.result .hdr table { width: 100%; border-collapse: collapse; }
.result .hdr table td.note { vertical-align: top; text-align: right; width: 200px; }
.result .hdr table td:first-child { width: 65px; }
.result .hdr table td:last-child { width: 110px; }
.result .hdr table td:last-child div { float: right; }
.result .hdr h3 { position: relative; }
.result .hdr .thumb { width: 32px; height: 32px; background-size: cover; margin-right: 8px; border-radius: 50%; }
.result .hdr .agreement { margin-left: 12px; font-size: 14px; }
.result .hdr .agreement .fa { font-size: 10px; vertical-align: top; line-height: 13px; }
.result .hdr .agreement .fa-quote-right { margin-right: 3px; }
.result .hdr .agreement .fa-quote-left { margin-left: 3px; }
.result .hdr .sitename { position: absolute; bottom: -13px; left: 38px; }

.result .detail h3 { font-weight: bold; font-size: 14px; display: block; min-height: 20px; margin-top: 10px; margin-bottom: 6px; }
.result .detail h3Lfirst-child { margin-top: 4px; }
.result .detail h3 span { float: left; height: 20px; width: 20px; margin-right: 4px; background-repeat: no-repeat; background-image: url('../img/icn/sprites/vx_sprites.png?23'); }
.result h3.basics { color: #366EAA; }
.result h3.basics span { background-position: -120px -220px; }
.result h3.reactions { color: #81A43E; }
.result h3.reactions span { background-position: -100px -220px; }
.result h3.reasons { color: #0099FF; }
.result h3.reasons span { background-position: -80px -220px; }
.result h3.alternatives { color: #606060; }
.result h3.alternatives span { background-position: -140px -220px; }

.cmt-box { max-width: 600px; min-width: 335px; }

.result .children.likes { padding-top: 4px; padding-bottom: 4px; margin-top: 1px; border-bottom: none; background-color: #EAEAEA; }
.result .children.likes, .attr div.post-options { padding: 1%; }
.result .detail .smalllist { margin-right: 0; min-width: 350px; }
.report-main .ajaxcontent { min-height: 24px; margin-bottom: 8px; }

/* Paging */
.pages { margin: 5px 0 8px 0; height: 25px; }
.pages a, .pages span { white-space: nowrap; border: 1px solid transparent; text-decoration: none; background-color: transparent; padding-top: 2px !important; padding-bottom: 2px !important; display: block; float: right; font-weight: bold; }
.pages span { font-weight: normal; }
.pages a { color: #777; padding-left: 2px; padding-right: 2px; min-width: 14px; text-align: center; }
span.page-count { color: #606060; padding-left: 5px; }
.pages a:hover { background-color: white; border: 1px solid #707070; }
.pages a:active, .pages a.sel { background-color: #777; color: #FFF; border: 1px solid #777; }
.pages a.large { min-width: 32px; }
.report-main div.pages a { padding-left: 0px; padding-right: 0px; }

/* Mosaic Styles */
.item a.more { font-size: 11px; }
.list-more-wrapper { margin: auto auto 5px auto; }
.scrolleddeeper .list-more-wrapper { clear: both; }
.list-more { font-family: Verdana,Arial,sans-serif; text-transform: lowercase; padding: 5px; font-size: 16px; display: block; text-align: center; color: #666; }
.list-more:hover { text-decoration: none; color: #444; }
.list a.list-more:hover { text-decoration: none; }
.list-more img { width: auto; margin: 0 auto !important; }

.clickguard { position: absolute; width: 100%; height: 100%; background: transparent url('/inc/img/bg/bg_white_opacity_70.png') repeat; }
.mosaic-wrapper { margin: 10px auto 0px auto; position: relative; }
.mosaic { position: relative; width: 100%; height: 100%; z-index: 10; }
.mosaic > .item .sub { position: absolute; }
.mosaic > .item .ftr { padding: 4px 4px 2px 0px; position: absolute; bottom: 0px; right: 0px; left: 0px; height: 22px; background: none; border: none; text-align: left; }
.mosaic > .item .ftr .f-rit { position: absolute; right: 4px; top: 2px; }
.mosaic .hoverpopup { display: none; position: absolute; top: 0; left: 0; font-size: 12px; z-index: 100; background-color: #FFF; border-style: solid; border-width: 1px; border-right: none; border-color: #D7D7D7; -webkit-box-shadow: #000 0px 0px 15px; -moz-box-shadow: #000 0px 0px 15px; box-shadow: #000 0px 0px 15px; behavior: url(/inc/css/PIE.htc); }
.mosaic .hoverpopup a.more { font-size: 12px; }
.mosaic .hoverpopup h3 { font-size: 1.3em; }
.mosaic .hoverpopup .content { position: absolute; left: 0px; top: 0px; bottom: 0px; right: 0px; overflow: hidden; padding-left: 2px; padding-right: 2px; background-color: #FFF; }
.mosaic .content .thumb { }
.mosaic .content p { margin: 0px; padding: 2px 12px 4px 6px; text-align: justify; }

.reasondock { background: #FFF url('../img/bg/reason-dock-bg.png?123') right repeat-y; position: absolute; right: 0; top: 0; bottom: 0; width: 24px; /*27px;*/ overflow: hidden; }
.reasondock > a.hide-16 { display: block; height: 18px; width: 0; height: 19px; margin: 4px auto; }
.reasondock > div { background-position: center; width: 16px; height: 16px; margin: 2px auto; }
.mosaic .reasondocktooltip { width: 0; border-radius: 0 10px 10px 0; -moz-border-radius: 0 10px 10px 0; height: 32px; behavior: url(/inc/css/PIE.htc); }
.mosaic .renderdock { border-width: 1px; }
.mosaic > .item1 { height: 77px; width: 113px; }
.mosaic > .item2 { height: 156px; width: 228px; }
.mosaic > .item1 h3 a, .mosaic > .item2 h3 a { font-size: 14px; }
.mosaic > .item2 .sub, .mosaic > .item1 .sub, .mosaic > .item3 .sub { bottom: 27px; }
.mosaic > .item2 .thumb, .mosaic > .item1 .thumb { width: 46px; height: 46px; }
.mosaic > .item3 { width: 363px; height: 235px; }
.mosaic > .item3 .thumb, .mosaic > .item4 .thumb { width: 50px; }
/* Large */
.mosaic > .item4 { width: 458px; height: 312px; }
.mosaic > .item4 .thumb { height: 77px; width: 120px; }
.mosaic > .item4 .hoverpopup, .mosaic > .item3 .hoverpopup { top: 0px; left: 0px; right: 0px; bottom: 0px; }
.mosaic > .item4 > .hoverpopup { font-size: 12px; box-shadow: none; }
.mosaic > .item4 .sub { bottom: 34px; }
.mosaic > .item4 .ftr { height: 26px; }

.mosaic-over { display: none; width: 100%; height: 100%; background: #000; z-index: 10; }
.mosaic-caseview { position: absolute; top: 5%; left: 5%; width: 90%; background: white; z-index: 20; }
.bio { padding-top: 2px; }

.mosaic > div.item { position: absolute; padding: 0px; background-repeat: no-repeat; background-position: center center; background-attachment: scroll; background-image: url('/inc/img/icn/white-loader-16.gif'); background-color: #EEE; }
.mosaic > div.item.null { background: #FFF; }
.mosaic > h3 { margin-top: 3px; padding-left: 4px; padding-right: 4px; }
.mosaic > .item.user .bio { }
.mosaic > .item.case .proposal { font-size: 12px; text-align: left; }
.mosaic > .item.case .proposal a.sml-btn { margin-left: 10px; }
.mosaic > .item a.info { left: 40%; right: auto; }
.mosaic > .item .content a.hide-16 { position: absolute; top: 2px; right: 2px; height: 18px; background-color: #FFF; }
.mosaic > .item a.share { left: auto; right: 4px; }
.mosaic > .item .topright { left: 4px; color: #888; }

/*these get made visible dynamically*/
.mosaic > .item .reasonicon { position: absolute; top: 0px; right: 0px; display: none; width: 20px; height: 20px; padding-left: 0px; }
.mosaic > .item .typeicon, .list table.tr .typeicon { position: absolute; top: 0px; left: 0px; display: none; width: 20px; height: 20px; padding-left: 0px; opacity: 0.6; filter: alpha(opacity=60); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }
.list table.tr .typeicon { display: block; position: relative; }
.mosaic > .item .reasonbanner { margin-left: 0; margin-right: 0; background-color: #FFF; position: absolute; top: 0px; right: 0px; width: 18px; display: none; padding: 4px; color: #FFF; }
.mosaic > .item .reasonbanner div.icn-16 { position: absolute; top: 0; right: 0; }

/*  
Lists
*/

.flex { display: flex; flex-wrap: nowrap; }
.flex.popular { width: calc(100% - 25px); margin-left: auto; margin-right: auto; display: flex; flex-direction: row; gap: 15px; flex-wrap: wrap; }
.flexbox { display: flex; flex-wrap: wrap; gap: 10px }

.flexbox.col2 > div { width: calc((100% - 10px) / 2); }

/* Small List */

.smalllist.border .item { border: solid 1px #dee0e1; padding-top: 0; border-radius: 4px; }
.smalllist .item { margin-bottom: 10px; position: relative; min-height: 40px; text-align: left; border-radius: 5px; border-bottom: solid 1px #E9E9E9; }
/*.smalllist:not(.feed) .item > div { padding: 10px 14px 0; }*/
.smalllist .item img { }
.smalllist .item table { border-collapse: collapse; }
.smalllist .item div.item { border-bottom: none; }
.smalllist .item .desc { margin-left: 47px; padding-bottom: 5px; }
.smalllist .item .padl110 { padding-bottom: 8px; }

.pnl .smalllist .item { padding: 10px 0 10px 0; }

.smalllist.flexbox .c { width: calc((100% - 20px) / 2) }
.smalllist .item.owner { padding-left: 0; padding-right: 0; padding-bottom: 0; }
.smalllist .thumb { width: 35px !important; height: 35px !important; position: relative; margin-right: 7px; margin-left: 2px; margin-bottom: 2px; background-size: cover; border-radius: 50%; }
.smalllist.border > div > div > .thumb { margin-left: 15px; }

.smalllist > .item .body > div.showmore { max-height: 300px; overflow: hidden; position: relative; transition: all ease-in-out 0.2s; }
.smalllist > .item .body > div.showmore m-container { position: absolute; bottom: 0; left: 0; right: 0; background: rgb(255,255,255); background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8127451664259454) 30%, rgba(255,255,255,1) 99%); text-align: center; padding: 25px 0px; }
.smalllist > .item .body > div.showmore a.showmorebutton { font-size: 10px; }
.smalllist .item .type-addedfriend .subject { margin-bottom: 25px; }

.body-c { padding: 10px 10px 0 10px; }


.smalllist .item .privatemsg { padding: 10px }

.smalllist tr td { padding-bottom: 0px; }
.smalllist .proposal b { font-weight: normal; }
.item .topright { color: #999; font-size: 0.9em; position: absolute; right: 4px; top: 7px; }

.p-author { color: #263990; font-weight: 400; margin-bottom: 5px; }
.p-author a { color: #000; font-weight: 400; }
.p-author .d-info { display: inline; margin-left: 8px; }
.p-author .d-info, div.item .d-info .note { font-size: 11px; }
.p-author .d-info.nopad { margin-left: 0px; }
.p-attachments.attachments { padding-left: 0px !important; }
.p-attachments.attachments > div { width: 25%; text-align: center; max-height: 250px; overflow: hidden; vertical-align: top; }
.p-attachments.attachments > div img { width: 100%; max-width: 100%; border-radius: 0; vertical-align: top; }
.p-attachments.attachments > div a { display: block; width: 97%; padding: 1.5%; }

.p-attachments.attachments.large { }
.p-attachments.attachments.large > div { max-height: 500px; }
.p-attachments.attachments.large > div a { margin: auto; padding: 0%; }
.p-attachments.attachments.medium { width: 100%; }
.p-attachments.attachments.medium > div { max-height: 200px; }

.subject { font-size: 15px; font-weight: 700; color: #000; margin-top: 7px; margin-bottom: 5px; }
.subject a { color: #333; text-decoration: underline; }


.p-detail table.content img.icon { max-width: 18px; min-width: 16px; }
.p-detail div.content .d-main { max-height: 80px; }
.p-detail .img { float: left; margin: 0 15px 15px 0; position: relative; }
.p-detail .img a { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.img { background-size: cover; background-repeat: no-repeat; background-position: center center; }

.item .p-detail .img { width:100%;float:none;aspect-ratio: 16 /9;}
.item.announcement .p-detail .img {aspect-ratio:auto;height: 140px;width:auto;background-size:contain;background-position-x:left;}

.issue .img { aspect-ratio: 1 /1; width: 90px; }

.p-detail.showmore div.findlinks { max-height: 250px;overflow: hidden;}

.post .body textarea { height: 35px; }

/* */
.attribute-form { }
.attribute-form tr { line-height: 22px; }
.attribute-form.fitspace tr td:first-child { width: 180px; }

.attribute-form.fitspace > div > div:first-child { width: 180px; }
#portfolio label, .attribute-form label { font-weight: 500; color: #000; }

td.textbox, td.textarea, td.dropdownlist { width: 30%; }
td.textbox:last-child { width: auto; }
label.CheckBoxList, label.RadioButtonList { display: block; margin-top: 12px; }

/* Big List */
.biglist { display: flex; flex-wrap: wrap; gap: 10px; }
.biglist > div { min-height: 125px; padding: 2px; padding-bottom: 6px; }
.biglist > div > div.case { padding-right: 30px; }
.biglist > div > div.case.nopad { padding-right: 0px; }
.biglist div.item > div { padding: 8px; }

.biglist .thumb { aspect-ratio: 1 / 1; width: 125px; margin-bottom: 12px; margin-right: 12px; background-size: cover; }
.biglist div > h3 a { padding-bottom: 0px; line-height: 20px; padding-bottom: 0px; line-height: 12px; }
.biglist div > h3 { font-size: 1.35em; line-height: 1.35em; }
.biglist .desc { text-align: left; margin-bottom: 20px; }
.biglist ul { margin: 2px 0px 4px 80px; padding-left: 20px; }
.biglist > .item { /*padding-bottom: 15px;*/ padding-right: 0px; width: calc((100% - 14px) / 2); }
.biglist > .item > .post .user { margin-left: 0px; }
.biglist .item .body { margin-left: 87px; max-width: 80%; }
.biglist .proposal { font-size: 14px; }
.biglist > div.list-more-wrapper { margin-top: 10px; width: 100%; }

.item .stat { left: 0px; width: 105px; bottom: 2px; }
.biglist .item .stat { width: 100%; }
.mosaic div.item .stat { width: 90px; bottom: 34px; right: 2px; height: 14px; }

.list .item { background: #FFF; border-bottom: solid 1px #EFEFEF; transition: all ease-in-out 0.2s; }
.pnl .list .item { margin-bottom: 10px; }

.list .item.jnl > div, .list .item.blog > div, .list.pad .item > div { padding: 10px; }

/*Version 2 Wall Items END*/
.quicksearch div.site { width: 60px; max-height: 25px; right: 0px; top: -1px; }
.quicksearch div.item { text-align: left; overflow: hidden; }
.quicksearch.list > div.bg { padding: 0; }
.quicksearch { text-align: left; display: block; position: fixed; z-index: 1051; background: #FFF; filter: alpha(opacity = '90'); }
.quicksearch > * { background-color: white; }
.quicksearch.dropshadow15 { padding-top: 10px; }
.quicksearch > h3 { padding-top: 0px; padding-left: 4px; padding-bottom: 0px; font-size: 11px; color: #000; font-weight: normal; background: #FFF; border-bottom: solid 1px #E6E6E6; position: relative; z-index: 1052; }
.quicksearch > div { z-index: 1052; }
.quicksearch .thumb { background-position: left center; background-size: 100%; width: 32px; margin: 2px 7px 5px 4px; padding-right: 0px;aspect-ratio:1/1; }
.quicksearch .topright { right: 2px; }
.quicksearch > .item { overflow-y: hidden; padding: 4px 5px 2px 2px; }
.quicksearch .item:hover { background: #09F; cursor: pointer; color: #FFF; }
.quicksearch .item h3 { margin: 0; padding-bottom: 3px; padding-top: 0px; font-size: 13px; }
.quicksearch .item .proposal { font-size: 11px; }
.quicksearch .item:hover h3 a { color: #FFF; text-decoration: none; }
.quicksearch a { transition: none; }
.no-touch .quicksearch a:hover { text-decoration: none !important; }
.quicksearch .item:hover .proposal { color: #FFF; }
.quicksearch .item:hover span.note { color: #FFF; }
.quicksearch .item.group > .topright { position: absolute; left: 0; bottom: 0; color: #888; }

.quicksearch #search-ftr { text-align: center; font-size: 0.85em; min-height: 25px; border-bottom-color: rgba(0,0,0,0); }
.quicksearch #search-ftr span { color: #606060; font-style: italic; }
.quicksearch #search-ftr:hover span, .quicksearch #search-ftr:hover b { color: #FFF; }
.quicksearch .nodata { margin: 2px; color: #A0A0A0; font-size: 0.9em; text-align: center; }


.quicksearch.list > div.bg { padding-top: 10px; padding-bottom: 10px; background-color: rgba(0,0,0,0); }
#quicksearch1 { position: fixed; left: 0 !important; right: 0 !important; top: 30px !important; width: auto !important; }

.csspie { behavior: url(/inc/css/PIE.htc); }
.dropshadow15 { -webkit-box-shadow: rgba(0,0,0,0.1) 0px 0px 5px; -moz-box-shadow: rgba(0,0,0,0.1) 0px 0px 5px; box-shadow: rgba(0,0,0,0.1) 0px 0px 5px; behavior: url(/inc/css/PIE.htc); }
.borderradius15 { -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; behavior: url(/inc/css/PIE.htc); }

/**/
.inlineuploader { }
.inlineuploader input[type=file] { cursor: pointer; opacity: 0; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: +1; width: 100%; }
.inlineuploader .subbutton { bottom: 42px; width: 16px; height: 16px; right: -16px; transition: all ease-in-out 0.3s; opacity: 0 }
.inlineuploader:hover .subbutton { opacity: 1.0 }
.inlineuploader:hover .icn-btn { background: #000; color: #FFF; z-index: +2 }

/**/

.xp-item { text-align: center; color: #32BB9D; }
.xp-item .score { font-size: 1.7em;; }
.xp-item .score i { font-style: normal; font-size: 0.9em; }
.xp-item .level { font-size: 11px; color: #888; }
.list .xp-item { }
.list.rankings .xp-rank { font-size: 16px; }

.myrank { color: #32BB9D; border: solid 2px #32BB9D; background: #FFF; margin-bottom: 5px; border-radius: 4px; position: relative; }
.myrank h2 { color: #32BB9D; }
.myrank .xp-item { width: 170px; }
.myrank .xp-item .score { font-size: 21px; }

/**/
.msg-item { position: relative; padding: 17px 17px 17px 17px !important; text-align: left; margin: 8px 0 8px 0; color: #000; border-radius: 3px; }
.msg-item img.close { display: none; }
.msg-item a { color: #505050; text-decoration: underline; }
.msg-item b, .msg-item h3 { color: inherit; font-weight: 500; }
.msg-item h3 { font-size: 1.25em; }
.msg-item .hide-16 { float: right; margin-top: 3px; margin-right: 3px; cursor: pointer; position: absolute; top: 0; right: 0; }
.msg-item ul { margin: 0px 0px 0px 10px; padding: 0px; }
.msg-item .icon { display: none; }
.sucmsg, .strongPass { border: solid 1px #349B44; background: #EBFBEE; color: #349B44; }
.errmsg, .badPass, .shortPass { border: solid 1px #F00; background: #FFF5F4; color: #F00; }
.msg, .hlpmsg { border: solid 1px #2B72B5; background: #E7F5FF; color: #2B72B5; }

/**/

p a,
.desc a { color: #32BB9D }
 
/*Use this style for items in the item lists, to be upgraded.*/

.editor .options { position: relative; bottom: 0; right: 0; left: 0; }
.optionset { position: absolute; right: 14px; bottom: 7px; min-height: 20px; }
.options .blk.respondentinfo { font-size: 17px;float:right; }
.options .blk.respondentinfo i { margin-right: 6px; }
.options > a { /*float: right;opacity: 0.8;*/ margin-left: 3px;  }
.options > a, .options .blk.respondentinfo i { font-size: 17px; }
.no-touch .options > a:hover { opacity: 1.0; }
.options > a.ignore, .item .options > a.ignore { background: transparent url('../img/icn/sprites/toggle.png') no-repeat center -17px; }
.options > a.include, .item .options > a.include { background: transparent url('../img/icn/sprites/toggle.png') no-repeat center 0px; }
.options > a.ignore, .item .options > a.ignore, .options > a.include, .item .options > a.include { height: 17px; min-height: 17px; border: none; }
.options a.request-box { margin-left: 3px; }
.options .note { display: inline-block; margin-right: 5px; }

.list .options { padding-top: 10px; }
.list .primary-btn.add { display: inline-block; }

.optionset > a { font-size: 17px; color: #404040; }
.no-touch .optionset > a:hover { color: #606060; }

/**/
div.reqst { background: #EEE; padding: 12px 4px; margin-bottom: 15px; font-size: 13px; }
.smalllist.list div.reqst div h3 { max-width: 100%; }
div.reqst .list .item { background: rgba(0,0,0,0); }
div.reqst .options { position: relative; clear: both; left: 0; }
div.reqst .options div.reqst { padding-left: 0; padding-right: 0; padding-top: 0; width: 100%; border-bottom: solid 1px #CCC; }
div.reqst .options div.reqst table { width: 100%; }
div.reqst a { white-space: nowrap; display: inline-block; }
div.reqst a.primary-btn { padding: 3px 8px 3px 8px !important; }
div.reqst img { max-width: 25px; margin-right: 5px; float: left; }
div.reqst td:first-child { }
div.reqst h4 { /* background: #A0A0A0; */line-height: 20px; color: #09F; display: inline-block; margin: 0 5px 0 0; padding: 0; }
div.reqst > a > .fa { color: #CCC; margin-left: 5px; }
div.reqst > a.primary-btn > .fa { margin-left: 0; margin-right: 4px; color: #FFF; }
#l-menu div.reqst { padding: 4px 4px; margin-top: 4px; background: transparent; }

/**/
.p-detail { color: #111; padding: 0 0 10px 0; font-size: 1.05em; max-width: 100%; word-break: break-word; }
.p-detail h4 { font-size: 1.05em; font-weight: bold; }
.p-detail h4 a { color: #1A1A1A; }
.p-detail p { margin-top: 0; }
.p-detail a, .inn a { color: #32BB9D }
.item .extra { padding: 5px; }
.item .p-detail .stat { margin: 3% 0%; height: 40px; position: relative; width: 98%; clear: both; }
.item .p-detail .stat > div { padding-top: 8px;padding-bottom:8px; font-size: 1.4em; }
.item .p-detail .yesno .yes { }

.post-tags { padding: 6px 0 10px 1% }
.post-tags label { font-weight: bold; }
.post-tags a, .tag-list a { display: inline-block; margin-right: 0; padding: 2px 5px; border-radius: 5px; color: #263990; white-space: nowrap; }
.post-tags a:hover, .tag-list a:hover { background: #09F; color: #FFF; text-decoration: none; }

.p-agreement { margin-top: 25px; font-weight: 500; font-size: 1.25em; }
.item .p-agreement { margin-bottom: 20px; }

.d-main-outer { max-width: 100px; max-height: 100px; }
.d-main { float: left; margin-right: 2.5%; margin-bottom: 1.5%; max-width: 100px !important; }
.p-detail table.content { width: 100%; border-collapse: collapse; }
.p-detail table.content td:first-child { max-width: 40%; }
.p-detail table.content td:last-child { padding-left: 3%; max-width: 360px; min-width: 60%; text-align: justify; }
.p-detail table.content img { width: 100%; max-width: 200px; min-width: 100px; }
.p-detail table.content img.icon { max-width: 18px; min-width: 16px; }
.p-detail table .media .img .bg { margin: auto; background-color: #CCC; padding: 5px; }

/**/
.crumbs { color: #A0A0A0; font-size:12px;margin-bottom:10px }
.crumbs > span { margin-right:5px;}
/**/

.main-img { float: left; margin: 5px 15px 10px 0; width: 120px; }
.smalllist .main-img { max-height: 100px; width: auto; }

.smalllist .comment { padding: 5px; margin-top: 1px; }
.comment textarea { margin-top: 1px; }
.item .body.children .comment td { padding: 5px; }
.item .body.children .comment td:last-child { padding-left: 0; width: 46px; }
.comment td:last-child { vertical-align: bottom; }
.body.children { background: #f2f3f5; padding: 0 !important; border-radius: 3px; }
.body.children > div { position: relative; }
.body.children > div, .body .children { padding: 10px; margin-top: 0; border-bottom: none; }
.body.children > div .thumb { width: 32px; height: 32px !important; background-size: cover; border-radius: 50%; }
.body.children > div .inn { margin-left: 10px; margin-bottom: 0px; }
.body.children > div.owner { background: rgba(250,250,250,0.5); }

.block-pnl .uploadbtn { }
.block-pnl .uploadbtn:hover { text-decoration: none; }
.block-pnl .uploadbtn .fa { font-size: 15px; }

.boarddetail .body.children { margin-left: 0; }

.media .img .bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: 100%; }
#chats .media .img { width: 120px; height: 90px; }
.smalllist.list .media .img, #chats .media .img { }
.smalllist.list .media .img.youtube { }
.smalllist.list .media .img.audio { width: 120px; height: 60px; }
#chats .media .bg { background-size: 90px 60px; background-image: url('../img/icn/videobtn_gray_small.png?1'); }


.smalllist.list .media .img.audio, .smalllist.list .media .img.audio .bg, #chats .audio .bg { background-image: url('../img/icn/audiobtn_gray_small.png?1'); }

.embed .media .bg { background-size: 160px 120px; width: 160px; height: 120px; position: relative; }
.embed object, .embed iframe { max-width: 100%; }
.biglist.list .media .img .bg { background-size: 90px 60px; margin: 5px 1px 0px 5px; }
.biglist .media .img { width: 300px; }

.media .extra { padding: 5px; font-family: Verdana; font-size: 9px; }
.response .embed iframe { max-width: 100%; }
.response .incrementshown .primary-btn.next { display: none; }

.list .children .media .img, .list .children .media .img.hasextra { margin-left: 15px; width: 290px; }

.scrollWrapper .media .img .bg { background-size: 90px 60px; width: 90px; height: 60px; margin: 5px 1px 0px 5px; }

.activity.tight .media .extra, .scrollWrapper .media .extra { display: none; }
.morefromme a span { display: none; }


/*  
List Masonry 
*/
.list.masonry { max-width: 100%; margin-left: auto; margin-right: auto; }
.list.masonry .item, .latestissues.list.items.masonry .item { display: block !important; }
.list.items.masonry .item, .list.masonry .item { color: #777777; border: 1px solid #eaeaea; box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.05); width: calc(25% - 15px); margin-right: 13px; padding: 0 0 25px 0; margin-bottom: 20px; }
.mason .m-date { font-size: 11px; padding-right: 12px; white-space: nowrap; opacity: 0.8; line-height: 1em; }
.mason .m-date .fal { font-size: 13px; float: left; margin-left: 1px; margin-right: 4px; }
.list.masonry .item .mason { font-size: 13px; margin-top: 25px; margin-bottom: 10px }
.list.masonry .item .mason .author { width: 100%; margin-top: 10px; }
.list.masonry .item .mason .author img { width: 18px; border-radius: 50%; float: left; margin-right: 4px; }
.list.masonry .item .img-container { width: 100%; max-height: 170px; min-height: 170px; overflow: hidden; padding: 0; }
.list.masonry .item .img-container img { width: 100%; }
.list.masonry .detail { background: #FFF !important; position: static; padding-left: 20px; padding-right: 20px; }
.list.masonry h4.issuetitle { font-size: 18px !important; font-weight: 600; margin-top: 15px; }
.list.masonry .item-tb { display: none; }

.list.masonry .link-options { opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.5); transition: all ease-in-out 0.35s; text-align: center; padding-top: 25%; }
.list.masonry .link-options a { display: block; font-size: 1.55em; color: #FFF; }
.list.masonry .link-options a.ontop { z-index: 10; position: relative; margin-top: 10px }
.list.masonry .item:hover .link-options { opacity: 1.0; }

.list.masonry .tools a:not(.staple) { font-size: 11px; }
.list.masonry .tools a:hover { color: #09F; }
.list.masonry .tools { color: rgba(255,255,255,0.7); text-align: center; position: absolute; bottom: 5px; right: 0; left: 0; z-index: +1; border-bottom: none; }
.list.masonry .tools .favourite span { }

.green { color: #32BB9D }

/* Controls */
::placeholder { color: #A2A2A2; opacity: 1; /* Firefox */ }

::-ms-input-placeholder { /* Edge 12 -18 */ color: #A2A2A2; }

.primary-btn, .green-btn, .brightgreen-btn, .red-btn, .secondary-btn, .primary-btn, input[type=submit],
.popmenu-wrap a.popmenutrigger { transition: all ease-in-out 0.2s; text-decoration: none !important; padding: 1px 16px 3px 16px !important; font-size: 1em; background: #606060; border: solid 1px #606060; color: #FFF; text-shadow: none; margin: 0 3px 1px 0; letter-spacing: 0.5px; text-transform: capitalize; white-space: nowrap; cursor: pointer; font-weight: 500; line-height: 25px; display: inline-block; border-radius: 2px; text-align: center; }
.primary-btn:last-child { margin-right: 0; }
.primary-btn.small, .list .primary-btn.small, .navi_button .primary-btn.small { font-size: 0.9em; padding: 3px 8px !important; }
.primary-btn.small .fa { }
.primary-btn:hover, .primary-btn:hover,
input[type=submit]:hover, .secondary-btn:hover { background: #404040; border: solid 1px #404040; text-decoration: none; }

.green-btn, input.green-btn, input[type="submit"].green-btn { background-color: #5BB75B !important; border-color: #5BB75B !important; background-image: none !important; }
.brightgreen-btn { background-color: #33CC33 !important; border-color: #33CC33 !important; background-image: none !important; }
.red-btn { background-color: #900 !important; border-color: #900 !important; background-image: none !important; }
.brightred-btn { background-color: #F00 !important; border-color: #F00 !important; background-image: none !important; }

.secondary-btn, input.secondary-btn, input[type=submit].secondary-btn { background-color: #FFF; border-color: #606060; color: #606060; background-image: none !important; background-image: none !important; }


.btn, button.btn, input[type=submit].btn { padding: 8px 25px 8px 25px; border-radius: 18px; font-weight: 600; border: solid 1px #404040; }
.btn.large, button.btn.large, input[type=submit].btn.large { padding: 10px 27px 10px 27px; border-radius: 20px; font-size: 15px; }

.checkbox { line-height: 1em; }

/* Sections / Modules */
.post-hdr { padding: 7px 8px 5px;background: #EFEFEF; border: solid 1px #EFEFEF; border-bottom-color: #FFF; border-bottom: none;  font-size: 12px; font-weight: bold; color: #000; font-family: Helvetica, Arial, sans-serif; border-radius: 4px 4px 0 0; }
.post-ftr { background: #EFEFEF; border: solid 1px #EFEFEF; padding: 5px 8px 5px 14px; border-radius: 0 0 4px 4px; }
.postbox { background: #FFF; padding: 0 !important; margin-bottom: 15px; }
.postbox .fulltext { border-color: #FFF; }
.postbox #dropbox { border: solid 1px #E0E0E0; margin: 0; border-top: none; border-radius: 0; }
.postbox #dropbox:hover { background: #FFF; }
.postbox #dropbox .message i { font-size: 12px; }
.post-hdr .post-options { float: right; padding: 0; margin-top: -3px; }
.post-hdr .post-options label { font-weight: normal; }
div.table.p-table { border: solid 1px #E0E0E0; border-top-color: #FFF; width: calc(100% - 1px); }
.p-avatar { padding: 10px 10px 10px 20px; width: 43px; text-align: center; }
.p-avatar img { border-radius: 50%; border: solid 2px #EFEFEF; width: 100%; }

#post-tag-option { }
#post-tag-option h3 { display: none; }
#post-tag-option .msg-item { display: none; }
#post-tag-option table { width: 100%; }
#post-tag-option .click-list { margin-top: -1px; margin-bottom: 0; }

#post-media-option { border: solid 1px #E0E0E0; border-top: none; border-bottom: none; min-height: 24px; padding: 10px 8px 8px; position: relative; }
#post-media-option a { position: absolute; top: 0; right: 0; left: 0; bottom: 0; }
#post-media-option label { font-size: 1.1em; color: #ADB5BD; font-weight: 400; }
#post-media-option .fa { font-size: 17px; color: #ADB5BD; margin-right: 8px; }

.postbox .click-list { }
.postbox .click-list.enabled:hover, .postbox .click-list.highlight { border-color: #E0E0E0; }
.postbox .rstext textarea { border-radius: 10px; background: #EEE; margin: 8px 8px 0 0; width: calc(100% - 30px); }
.postbox #image-list { border: solid 1px #E0E0E0; border-top: none; border-bottom: none; }
.postbox .post-options { background: #FFF; }

.list-options { min-height: 20px; padding-bottom: 0; margin-bottom: 1px; z-index: 10; }
.list-options a { width: 18px; height: 18px; margin: 0 3px 3px 0; float: left; }
.list-options .icn-16:hover > span { background-image: url('../img/icn/sprites/vx_sprites.png?23'); opacity: 1.0; filter: alpha(opacity='100'); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
.list-options .selected .icn-btn { opacity: 1.0; filter: alpha(opacity='100'); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.list-options.btns a { width: auto; float: none; height: auto; display: inline-block; padding: 1px 6px 3px; position: relative; border: solid 1px #505050; border-radius: 2px; color: #505050; text-decoration: none; }
.list-options.btns a.selected { border: solid 1px #606060; background-color: #606060; color: #FFF; opacity: 1; }
.list-options.btns .icn-16 > span { display: none; }
.list-options.btns a.clear { border-radius: 50%; padding: 1px 7px 2px; }
.list-options.btns a.clear:hover { color: #F00; border-color: #F00; }



/* */
.bigboxlist { }
.bigboxlist .item { width: calc((100% - 32px) / 3); background-color: #AAA; position: relative; border: solid 2px #FFF; transition: all ease-in-out 0.2s; }
.bigboxlist .item:hover { border-color: #09F; }
.bigboxlist .item .content { min-height: 100px; padding-left: 10px; margin-left: 0; color: #212121; }
.bigboxlist .item a { color: #212121; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.bigboxlist .item .more { position: relative; width: 100%; height: 20px; text-align: center; color: #FFF; }
.bigboxlist .item .more a { color: #FFF; }
.bigboxlist .item .more span { position: relative; transform: rotate(0deg); }
.bigboxlist .item .img { height: 180px; }
.bigboxlist .item .img h2 { padding: 17% 2% 0 2%; font-size: 1.7em; color: #FFF; font-weight: normal; text-align: center; font-family: Verdana; }
.no-touch .bigboxlist .item a:hover { text-decoration: none; }

.bigboxlist .item.notts { background-color: #0066cc; }

i.notts { display: inline-block; width: 20px; height: 16px; margin-right: 4px; background-color: #0066cc; background-repeat: no-repeat; background-image: url('/inc/img/old/Customer/notts-nhs/logoweb.png'); background-size: 80%; background-position: center center; }


/**/

#coursecontents { padding-bottom: 0; }

.contentstable { position: relative; padding-top: 0 !important; }
.contentstable div.item { }
.contentstable div.item a { padding: 7px 6px; display: block }
.contentstable.pnl .header { padding-left: 3px; background: #EEE; }
.contentstable.pnl > .header.sub { padding-left: 3px; background: transparent; }
.contentstable.pnl > .header h3 { padding-top: 3px; margin-bottom: 0; color: #333 !important; font-weight: 600; font-size: 15px; }
.contentstable .item { background: transparent; border: none; border-radius: 0px; opacity: 0.9; }
.contentstable .item.complete { opacity: 1.0; }
.contentstable .item.selected { font-weight: bold; }
.contentstable .item.selected a { color: #09F; }
.contentstable .item.title { margin-top: 8px; margin-bottom: 2px; font-weight: 600; font-size: 14px; opacity: 1.0; }

.contentstable .item.resource { opacity: 1.0; }
.contentstable.pnl > .header.sub.resource,
.contentstable .item.resource { color: #A0A0A0; background: #EEE; font-size: 11px; }
.contentstable .item.resource a { color: #606060; }

.contentstable .tick { margin-left: 4px; }
.contentstable .item.complete .tick { color: #32BB9D }

.haschildren.item.selected { }
.haschildren.item.selected > a { color: #09F; }
.haschildren.selected .children a { color: #333; font-weight: normal; }

.contentstable .item:hover { background: #EEE; }
.contentstable .item:hover a { }
.contentstable .item a { color: #333; text-decoration: none; }
.contentstable .sort { position: absolute; right: 0; top: 2px; display: none; height: 16px; width: 16px; text-align: center; }
.contentstable .item:hover .sort { display: block; }

.contentstable .haschildren > a { font-weight: 600; font-size: 13px; margin-bottom: 1px; }
.contentstable.list .item.haschildren { padding-left: 19px; }
.contentstable.list .item.haschildren > a { position: relative; }
.contentstable.list .item.haschildren.complete > a { opacity: 1.0; }
.contentstable.list .item.haschildren > a.toggleicon { position: absolute; left: 2px; top: 4px; }

.contentstable .children .item:hover { background: transparent; }
.contentstable .childitem { padding-left: 2px; }
.contentstable .childitem .childitem { margin-left: 10px; }
.contentstable .childitem .childitem .childitem { margin-left: 15px; }

/**/
#divDialog { overflow: visible; }
.dialogclose { position: absolute; top: 3px; right: 5px; width: 17px; z-index: 2500; height: 18px; text-decoration: none; font-size: 16px; }
.dialogclose:hover { color: #900; }

/* Input Styling: END */
#divDialog { min-height: 100px; background: #FFF; border: 2px solid #FFF; padding: 2px; z-index: 1000; overflow: no-display; position: fixed; left: 10%; top: 2%; right: 10%; bottom: 5%; max-width: 1350px; border-radius: 5px; }
#divDialog > .container { width: auto; overflow: hidden; overflow-y: auto; max-height: inherit; position: absolute; top: 0; right: 0; bottom: 0; left: 0; min-height: 0 !important; padding: 0; }
#divDialog > .container .dialog-inner, #divDialog > .container .dialog-inner > iframe { position: absolute; top: 0; right: 10px; bottom: 0; left: 0; }
#divDialog > .container .dialog-inner > iframe { min-height: 100% !important; }

#divDialog.postedit { width: 800px; max-width: 100%; max-height: 600px; margin: 5% auto 0 auto; top: 80px; min-width: 500px; }
#divDialog.postedit.comment { max-height: 320px; }
#divDialog.postedit iframe { min-height: 100% !important; width: 100%; }

@media only screen and (min-width:1900px) {
  #divDialog { left: 0; right: 0; max-width: 1350px; /*min-width: 1350px;*/ margin: auto; }
}

/* Dropbox Element */
.uploads { }

ul.list { list-style: none; display: block; vertical-align: top; padding: 0; margin: 0; position: relative; }

.column .uploads ul.list.grid.files { margin: 0 10px; }
.column .uploads ul.list.grid.files li { width: calc(((100% - 20px) / 3) - 10px);aspect-ratio:1/1; }
.column .uploads ul.list.grid.files li:nth-child(3n+3) { margin-right: 0; }
.uploads ul.list.grid.files { display: flex; gap: 10px; flex-wrap: wrap; }
.uploads ul.list.grid.files li { padding: 5px; width: calc(((100% - 20px) / 3) - 10px); background: none; margin: 0; border: none; position: relative; box-shadow: 0 0 2px transparent; transition: all ease-in-out 0.2s; }

@media only screen and (min-width:750px) {
  .uploads ul.list.grid.files li { width: calc(((100% - 30px) / 4) - 10px);}
}

@media only screen and (min-width:1000px) {
  .uploads ul.list.grid.files li { width: calc(((100% - 40px) / 5) - 10px); }
}

.popUP .uploads ul.list.grid.files li { width: calc(((100% - 20px) / 3) - 10px); }

.uploads ul.list.grid.files li:hover { box-shadow: 0 0 2px #000000; }
.uploads ul.list.grid.files li img { max-height: 130px; max-width: 100%; }
.uploads ul.list.grid.files li img:hover { }
.uploads ul.list h4 { cursor: pointer; font-size: 11px; overflow: hidden; height: 30px; margin-right: 18px; word-wrap: break-word; text-align: center; }
.uploads .img-holder { text-align: center; }
.uploads .ctrl { position: relative; display: block; }
.uploads table { width: 100%; border-collapse: collapse; }
.uploads table tr td:last-child { width: 18px; }
.uploads a.option { position: absolute; top: 0; right: 0; display: block; line-height: 1px; padding: 1px 4px 2px 4px; height: 8px; border: solid 1px #FFF; border-radius: 3px; cursor: pointer; color: #666; }
.uploads a.option:hover { border: solid 1px #C0C0C0; }
.uploads .options { min-width: 110px; right: 0; display: none; text-align: left; font-size: 11px; }
.uploads .options > div { height: 20px; border-bottom: solid 1px rgba(0,0,0,0.05); padding: 4px; }
.uploads .options > div:hover { background: #3297FD; border-bottom-color: #3297FD; }
.uploads .options > div:hover a { color: #FFF; text-decoration: none; }
.uploads .options span:last-child { padding-top: 3px; display: inline-block; background-image: none; width: auto; }
.uploads .options span.icn { float: left; }
.uploads .options a { float: none !important; color: #666; cursor: pointer; display: block; }
.uploads .popup { background: #FFF; position: absolute; padding: 0; border: solid 1px rgba(0, 0, 0, 0.1); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); z-index: 50; }

#dropbox { border-radius: 3px; position: relative; margin: 5px auto 5px; min-height: 100px; overflow: hidden; padding-bottom: 80px; border: dashed 2px #E0E0E0; transition: all ease-in-out 0.2s; }
#dropbox:hover { background: #EEE; }
#dropbox .message { width: 100%; text-align: center; padding-top: 6%; border: none; background: transparent; transition: all ease-in-out 0.2s; }
#dropbox .message i { color: #A0A0A0; transition: all ease-in-out 0.2s; }
#dropbox:before { border-radius: 3px 3px 0 0; }
#dropbox #old { position: absolute; bottom: 0; left: 0; right: 0; border-top: solid 1px #E0E0E0; display: none; }
#dropbox .preview { width: 160px; height: 140px; float: left; margin: 15px 0 0 15px; position: relative; text-align: center; background-image: none; }
#dropbox .preview img { max-width: 100%; max-height: 130px; display: block; }
#dropbox .imageHolder, .dropbox .imageHolder { display: inline-block; position: relative; }
#dropbox .uploaded, .dropbox .uploaded { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: url('/inc/img/icn/done.png') no-repeat center center rgba(255,255,255,0.5); display: none; }
#dropbox .preview.done .uploaded, .dropbox .preview.done .uploaded { display: block; }
#dropbox .preview.error .uploaded, .dropbox .preview.error .uploaded { display: block; background: url('/inc/img/icn/error.png') no-repeat center center rgba(255,255,255,0.5); }
#dropbox .progressHolder, .dropbox .progressHolder { position: absolute; background-color: #252f38; height: 12px; width: 100%; left: 0; bottom: 0; }
#dropbox .progress, .dropbox .progress { background-color: #09F; position: absolute; height: 100%; left: 0; width: 0; box-shadow: 0 0 1px rgba(255, 255, 255, 0.4) inset; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; }
#dropbox .preview.done .progress, .dropbox .preview.done .progress { width: 100% !important; }

#dropbox .upload-browse { position: relative; }
#dropbox .upload-browse a { margin-top: 20px; max-width: 150px; text-align: center; cursor: pointer; }
#dropbox .upload-browse:hover a { color: #09F; }
#dropbox .upload-browse input { opacity: 0; width: 100%; cursor: pointer; }

/*===========================================*/

/* Tabs */
.tabs { height: 39px; margin-top: 10px; margin-bottom: 5px; min-width: 100%; white-space: nowrap; overflow-x: hidden; overflow-y: hidden; -ms-overflow-style: none; -ms-scroll-chaining: none; -ms-scroll-snap-type: mandatory; -ms-scroll-snap-points-x: snapInterval(0%, 100%); position: relative; }

.tabs .inner { height: 38px; /**/; }
.tabs .inner > a { margin-right: 8px; border: solid 1px rgba(0,0,0,0.1);; transition: all 0.3s ease 0s; display: inline-block; padding: 4px 11px 5px; color: #666; font-size: 12px; font-weight: 600; line-height: 22px; text-decoration: none; border-radius: 4px; }
.tabs .inner > a:nth-match(a) { margin-left: 0; }
.tabs .inner > a:hover { background: #EEE; border: solid 1px rgba(0,0,0,0.5); }
.tabs .inner > a.selected { color: #000; border: solid 1px #000; }

.tab-holder { margin-top: 0; margin-bottom: 10px; border: none; border-top: none !important; }
.tab-holder .tab.selected { display: block; }
.tab-holder .tab { display: none; }

/**/

.popmenu-wrap { position: relative; }
div.popmenu-wrap a.popmenutrigger { padding-right: 24px !important; position: relative; }
.popmenu-wrap a { }
.popmenu-wrap a:hover { text-decoration: none; }
a.popmenutrigger.open, a.popmenutrigger:hover { background-color: #09F; color: #FFF; }
a.popmenutrigger .fa { display: block; position: absolute; right: 2px; top: 2px; width: 18px; height: 18px; }
.popmenu { position: absolute; z-index: 10; margin-top: 8px; background: #FFF; display: none; -webkit-box-shadow: 0px 10px 5px 0 rgba(32, 25, 23, 0.5); -moz-box-shadow: 0px 10px 5px 0 rgba(32, 25, 23, 0.5); box-shadow: 0px 10px 5px 0 rgba(32, 25, 23, 0.5); border-radius: 0 4px 0 0; overflow: hidden; }
.popmenu ul { margin: 0; padding: 0; list-style: none; }
.popmenu li { display: block; white-space: nowrap; transition: all ease-in-out 0.2s; }
.popmenu li:hover { background: #09F; }
.popmenu li:hover a { color: #FFF; }
.popmenu li a { display: block; width: 100%; padding: 7px 15px; font-size: 13px; color: #444; }

.toggleicon, .icnbtn.toggleicon { cursor: pointer; font-size: 12px; height: 12px; padding: 2px 2px 2px 14px; background: url('../img/icn/sprites/toggle.png') 0px 2px no-repeat; }
.toggleicon:hover { }

/**/
.board .boarddesc { padding: 3px 0px 2px 0px; font-size: 13px; }
.board .list-more-wrapper { margin-top: 5px; margin-right: 8px; }
.board .boardadd { position: absolute; border: solid 1px #C0C0C0; background: #FFF; width: 550px; height: 300px; margin: auto; z-index: 10; }
.board .col .placeholder { width: 243px; height: 1px; max-width: 100%; }
.board div.controls { position: relative; min-height: 18px; }
.board div.controls a { margin-right: 5px; }
.board div.controls h2 { margin-right: 140px; margin-bottom: 2px; }
.board .options { top: 0px; right: 0; left: auto; }
.board div.controls .options a.icn-16 { width: auto; padding-right: 4px; font-size: 12px; font-weight: bold; }
.board .col { display: flex; gap: 10px; flex-wrap: wrap; }
.board .c { width: calc((100% - 20px) / 3); }
.board .item { font-size: 12px; background: #FFF; padding: 0 0 55px; border: solid 1px #EFEFEF; }

.board .item .date { position: relative; padding-left: 10px; display: block; }
.board .item .comments { padding: 0 15px; }
.board .loader-overlay img { width: 32px; }
.board .loader-overlay img.small { width: 24px; }
.board .item .top-wrapper { padding: 0 10px 0 10px; }


.board .item a { color: #333; }
.board .item a.primary-btn { color: #FFF; }
.board .item a.view-all { font-size: 12px; }
.no-touch .board .item a:hover { color: #09F; }
.board .item a.image { }
.board .item a.abuse { float: left; color: #888; margin-right: 5px; }
.board .item .cmt a.abuse { float: none; }
.board .item .cmt a { text-decoration: underline; }
.board .item .icn-16 { background-position: 0px center; background-size: 16px; }
.board .item .filelink { margin-left: 15px }
.board .item .desc { text-align: left; overflow-x: hidden; word-wrap: break-word; padding: 0 10px 10px; }
.board .item .desc a { color: #00AEBF; }
.board .item .desc object { width: 180px; max-width: 190px; }
.board .item .green-btn, .board .item .green-btn:hover { color: #FFF; }
.board .item .by { margin: 10px 15px 5px; }
.board .item .functions { display: none; position: absolute; right: 0px; }
.board .item .functions.top { top: 0; right: 0; background: rgba(255,255,255,0.85); min-width: 44px; z-index: 25; padding-right: 6px; }
.board .item .functions.top .navi { position: absolute; left: -100px; top: 0px; }
.board .item .functions.bottom { display: block; left: 0px; bottom: 0px; margin-left: 0px; background: #EFEFEF; border-top: solid 1px #E0E0E0; padding: 10px 15px 15px 15px; }
.board .item .functions.bottom a { font-size: 14px; margin-left: 0; }
.board .item .functions .icn-16, .board .item .functions a { font-size: 17px; margin-left: 8px; }
.board .item .functions.top div { float: right; }

.board .item.comment { padding-bottom: 160px; }
.board .item.comment .commentdata { display: block; margin-top: 10px; }
.board .item.comment .message > span { background-image: url('../img/icn/sprites/vx_sprites.png?23'); opacity: 1.0; filter: alpha(opacity = 100); }
.board .item.comment .commentdata table tr td:first-child { width: 43px; }
.board .item.comment .commentdata .thumb { width: 38px; height: 38px; margin-right: 2px; border-radius: 50%; background-size: cover; }
.board .item .commentdata .txt { line-height: 13px; width: calc(100% - 20px); background: rgba(255,255,255,0.9) }
.board .item .commentdata { display: none; height: 102px; }
.board .item a.bg { background: #FFF; border: solid 1px #E0E0E0; border-radius: 4px; }
.board .item:hover .functions { display: block; opacity: 1; filter: alpha(opacity = 100); }
.board .item .rating { opacity: 0.8; filter: alpha(opacity = 80); padding-top: 10px; padding-bottom: 7px; }
.board .item:hover .rating { opacity: 1.0; filter: alpha(opacity = 100); }
.board .item.addboard { height: 18px; }
.board .item.addboard a.addboard { position: absolute; top: 2px; bottom: 0; right: 0; left: 0; padding: 15px 15px 10px 15px; }

.board .item .image { width: 100% }
.board .item .image img { width: 100%; }

.board-list { margin-top: 5px; margin-bottom: 5px; min-height: 170px; }
.board-list .values { height: 99px; position: relative; overflow: hidden; width: 100%; }
.board-list .browse { display: none; top: 65%; padding: 0; position: absolute; height: 20px; width: 20px; z-index: 1; background-color: #666666; border-radius: 10px; box-shadow: 0 0 10px #000000; }
.board-list .browse.disabled, .board-list .values:hover .browse.disabled { display: none; }
.board-list .browse.right { right: 2px; background-image: url('/inc/img/btn/circle-btn-gray-right.png'); }
.board-list .browse.left { left: 2px; background-image: url('/inc/img/btn/circle-btn-gray-left.png'); }
.board-list .values:hover .browse { display: block; }
.board-list .group { display: flex; gap: 10px; flex-wrap: wrap; position: relative; width: 100%; }

.cols .item .comments .cmt-total { border: 1px solid #aaa; background: #999; color: #FFF; text-decoration: none; border-radius: 15px; float: right; font-family: Tahoma,Geneva; font-size: 9px; font-weight: bold; padding: 0 4px; }
.cols .comments .cmt-total:hover { background: #FFF; color: #999; text-decoration: none; }

.board-list .values .items { height: 125px; overflow: hidden; }
.board-list .item { width: calc((100% - 30px) / 4); aspect-ratio: 1 / 1; padding: 0 0 8px 0; }
.board-list .item:nth-child(1) { margin-left: 0; }
.board-list .item .thumb { height: 96px; width: 100%; margin: 0; float: none; background-size: 100%; }
.board-list .item .inn { display: none; }
.board-list .item:last-child { margin-right: 0; }
.board-list .item.active { }
.board-list .item.active.add { background: #FFF; }
.board-list .details { padding: 5px 0 10px 0; margin-top: 0; min-height: 50px; }

.board-list .add { min-width: 80px; position: relative; }
.board-list .add .thumb { width: 100%; margin: 0 2px; background: #00D900; text-align: center; background: #FFF; border: solid 1px #DDD; font-family: Verdana; transition: all 0.3s ease-in-out; }
.board-list .add .thumb a { padding: 10px; font-size: 15px; color: #797979; text-decoration: none; }
.board-list .add .thumb a > b { font-size: 18px; }
.board-list .add .green.thumb { background: #AAA; border-color: #AAA; }
.board-list .add .green.thumb a { color: #FFF; }
.board-list .add:hover .green.thumb, .board-list .add:hover .thumb { background: #09F; border-color: #09F; }
.board-list .add:hover .thumb b { color: #FFF; }


/**/

strong { font-weight: 500; }

#main-body iframe { aspect-ratio: 16 / 9; width: 100%; height: auto !important; }

/**/

#footer { margin-top: 150px; background-color: #464646; color: #ffffff; padding: 30px 0 2em 20px; font-size: 80%; clear: both }
#footer a, #footer h2, #footer h3 { color: #FFF; }


/**/

#modal { display: none; width: 440px; max-width: 100%; border: 10px solid #666; border: 10px solid rgba(82, 82, 82, 0.698); border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; z-index: 100; }
#modal > div { padding: 15px; border: 1px solid #E0E0E0; background-color: #fff; font-family: "lucida grande",Tahoma,Geneva,verdana,arial,sans-serif; }
#modal div.inner { border-bottom: none; }
#modal div.footer { border-top: none; text-align: center; padding-top: 0px; }
#modal h2 { margin: -11px; margin-bottom: 0px; color: #fff; background-color: #CCC; padding: 8px 15px; border: 1px solid #C0C0C0; font-size: 20px; }
#modal .close { right: -1px; top: 0px; display: block; position: absolute; background: transparent url("../img/icn/16/close icon.png") no-repeat; height: 18px; width: 18px; }
#modal button { border: solid 1px #C0C0C0; cursor: pointer; padding: 2px 8px; }

#modal.greenmodal { border: none; box-shadow: 2px 4px 8px rgba(0,0,0,0.3); }
#modal.greenmodal h2 { background-color: #090; border-color: #090; }
#modal.greenmodal button { background-color: #090; color: #FFF; border-color: #090; }

/**/

.tools { padding: 5px 0; margin-top: 5px; margin-bottom: 5px; text-align: right; }
.tools a { font-size: 12px; color: #333; font-family: Arial; font-weight: 600; text-transform: uppercase; }
.tools a:hover { color: #09F; text-decoration: none; }
.tools a .fa { margin-right: 4px; }

/*  */
.detail .charts { min-height: 220px; }
.detail .chart-title { padding-top: 0px; }

.detail .proposal { padding: 15px 0; text-align: left; }
.detail .proposal h4, h4.proposal, .proposal { color: #244C88; font-weight: bold; }

h2.proposal { font-weight: bold; top: 8px; text-align: center; padding-top: 10px; padding-bottom: 10px; }

/* */
.column.lastelem img { max-width: 100%; }
.column.lastelem h2, .column.lastelem h3 { font-size: 1.45em; font-weight: 500; }
.column .column { min-height: 0; padding: 0; }
.column .column:first-child { border-right-color: transparent; }

.autoheight .column { min-height: 0; }

.col2 .column { position: relative; }
.column { display: table-cell; vertical-align: top; min-height: 600px; padding: 10px 0 10px 0; }
.column.pw50 { width: 50% !important; max-width: 49% !important; }
.column:last-child, .column.lastelem { width: 33%; min-width: 180px; }

.table.col2 > div > div:first-child, .column:first-child { padding-right: 18px; }


/* */
header .level-progress { max-width: 220px }

.level-progress { position: relative; }
.level-progress table { width: 100%; }
.level-progress .bg { position: relative; overflow: hidden; width: 100%; height: 24px; background: #DDD; border-radius: 4px; }
.level-progress .progress { position: absolute; top: 0; left: 0; bottom: 0; background: #32BB9D; }
.level-progress:hover .progress { background-position: 0px -4px; }
.level-progress > div { display: inline-block; }
.level-progress .points, .level-progress .rank { position: absolute; color: #FFF; top: 4px; font-size: 12px; }
.level-progress .points { right: 3%; z-index: 1; text-align: right; }
.level-progress .rank { cursor: pointer; left: 3%; }
.level-progress .rank a { color: #FFF; }
.no-touch .level-progress .rank a:hover { color: #333; text-decoration: none; }

.level-progress .nextlevel { cursor: pointer; position: absolute; top: 1px; right: 0px; border-radius: 10px; width: 16px; height: 16px; z-index: 10; }
.level-progress .nextlevel:hover { border: solid 2px #F00; }

.newpoints { position: absolute; right: 0; top: 0; color: #C9EA00; font-weight: bold; font-size: 15px; z-index: 10; text-align: center; }
.newpoints .note { font-size: 12px; text-align: center; color: #C9EA00; }



/* Lists */
.biglist.cards { display: flex; gap: 15px; }
.biglist.cards .thumb { float: none; width: 100%; min-height: 180px; height: 180px !important; border-radius: 5px 5px 0 0; margin: 0 0 5px 0; }
.biglist.cards .item { width: calc((100% - 75px) / 6); padding: 0; margin: 0 !important; border-radius: 5px; text-align: center; }
.biglist.cards .item h3 { margin: 0; width: 100% !important; max-width: 100% }


.fileupload-buttonbar .span7 { padding-top: 10px; }
.uploadbox { padding: 20px 10px 10px 20px; }


/* Responsive */
.desktop, .desktop.tablet, .desktop.mobile { display:inherit;}
.tablet { display:none;}
.mobile { display:none;}

@media only screen and (max-width: 1750px) {

  .middle { width: 84%; padding-left: 0; padding-right: 0; }
  body.vx-hdrimg.signedin .headerimage .headertitle { top: 30%; }
  body.vx-hdrimg .headerimage .headertitle { top: 25%; }

  body.vx-hdrimg .headerimage .img { aspect-ratio: 50 / 17; }
}

@media only screen and (max-width: 1500px) {

  .middle { width: 96%; padding-left: 0; padding-right: 0; }
  body.vx-hdrimg .headerimage .headertitle { top: 140px; }
  body.vx-hdrimg .headerimage .img { aspect-ratio: 50 / 22; }


  .signedin #main-body {max-width: calc(100vw - 300px);}
}


@media only screen and (max-width: 1250px) {
  .list.items.masonry .item, .list.masonry .item { width: calc(33.33% - 15px); }
  body.vx-hdrimg .headerimage .img { aspect-ratio: 50 / 20; }

  .signedin #main-body { max-width: calc(100vw - 270px);}
  .signedin #main-body { margin-right: auto; margin-left: auto; }

  .box-grid > div {     width: calc((100% - 26px) / 3);}

  #main-body { padding-left:5px;}
  .table.col2 > div > div:first-child, .column:first-child { padding-right: 12px;}


  .l-menu {padding-left:5px;padding-right:5px; width:230px;}
}


@media only screen and (max-width: 1024px) {
.desktop { display:none;}
.tablet, .desktop.tablet, .mobile.tablet { display:inherit;}
.mobile { display:none;}

}

@media only screen and (max-width: 960px) {
  .list.items.masonry .item, .list.masonry .item { width: calc(50% - 15px); }
  body.vx-hdrimg .headerimage .img { aspect-ratio: 50 / 25; }

  #u-menu { padding-left: 0; }

  .box-grid > div {     width: calc((100% - 14px) / 2);}
}


@media only screen and (max-width: 850px) {

  #hdr #logo-c { width: 150px;padding-left:5px }
  body #hdr #logo { width: 100px; }

  .signedin #main-body { max-width: calc(100vw - 20px);}

  body.vx-hdrimg #userdata { border-bottom: none; }
  body.vx-hdrimg #hdr { border-bottom: none; }


  .display850 { display: block; }

  .mobileonly { display: block; }
  .notwhensmall { display: none !important; }

  body.vx-hdrimg .headerimage .img { aspect-ratio: 50 / 28; }

  #hdr { background: #FFF; }
  #hdr #searchouter { display: none; }
  #hdr td.spc2 { display:none;}

 
  .column { width: 100% !important; min-height: 500px; }
  .table.col2 > div > div:first-child, .column:first-child { width: 100%; border-right: 0; /*padding-right: 0;*/ }
  .column:last-child { width: 100%; }


  div.table > div.columns  { display: block; }
  div.table > div.columns  > div { display: block; }

  #l-menu .avatar{ display:none;}


}

@media only screen and (max-width: 825px) {
  #hdr > .middle { width: 100%; }
  body.signedin header #profile-links {width: 190px; }
  body.vx-hdrimg .headerimage .headertitle h1 { font-size:34px; }


  body.vx-hdrimg .headerimage .img { aspect-ratio: 50 / 30; }
}


@media only screen and (max-width: 750px) {
  body.vx-hdrimg .headerimage .img { aspect-ratio: 50 / 40; }
}


@media only screen and (max-width: 655px) {
  div.table { display: block; }
  div.table > div { display: block; }
  div.table > div > div { display: block; }


  .table.col2 > div > div:first-child { width: auto; padding-right: 0; }

  div.table.nofold { display: table; }
  div.table.nofold > div { display: table-row; }
  div.table.nofold > div > div { display: table-cell; }


.list.items.masonry .item, .list.masonry .item { width: 100%; }

}

@media only screen and (max-width: 600px) {
  body.vx-hdrimg .headerimage .img { aspect-ratio: auto;        min-height: 60vh; }
  body.vx-hdrimg.signedin .headerimage .headertitle .middle {  margin-left: 4%; }
  body.vx-hdrimg .headerimage .headertitle h1 { font-size:25px; }


  .desktop, .tablet, .tablet.desktop { display:none !important;}
 
  .mobile, .tablet.mobile, .desktop.mobile, .desktop.mobile.tablet  { display:inherit !important;}

  body.signedin header #profile-links { width:30px; }


  header .profile,
  header .links { display:none;}


}


@media only screen and (max-width: 500px) { 
  #main-body { min-height: 100vh; }
  .box-grid > div {     width:100%;aspect-ratio:auto;}
}