@font-face {
	font-family: 'icons';
	font-display: swap;
	src: url('https://static.thetoptens.com/font/icons/icons2.woff');
}

/****** GLOBAL HTML ELEMENTS ******/
body{
  padding:0;margin:0;text-align:center;background:#E0E0E0;
  font-size:15px;line-height:20px;color:#1A1A1A;
  font-family:Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1{font-weight:normal;font-size:40px;line-height:50px;padding:0;margin:29px 0 20px 0;}

h3, .h3{background:#F5F5F5;font-size:16px;font-weight:normal;color:#888485;border-radius:1px;padding:0 15px 0 17px;margin:30px 0 0 0;display:block;height:40px;line-height:40px;position:relative}

a{color:#3285A7;text-decoration:none;cursor:pointer;}

h3 i, .h3 i{float:right;margin:-2px -12px 0 0;padding:12px;color:#BEBEBE;font-size:20px;cursor:pointer;}
h3 em{float:right;margin:14px 0 14px 15px;color:#BEBEBE;font-size:11px;cursor:pointer;}
h3 > em:empty::before{content: '8'}
h3 b{float:left;margin:14px 15px 0 0;color:#BEBEBE;font-size:11px;cursor:pointer;}
h3.h3menu span{display:none}
h3.h3menu div{display:none;position:absolute;right:0;top:0;background:#BEBEBE;padding:0 45px 0 0;z-index:10;box-shadow:0 0 10px rgba(0,0,0,.1);border-radius:1px}
h3.h3menu div span{position:relative;float:none;}
h3.h3menu div em{display:none}
h3.h3menu div em:empty::before{content: 'A'}
h3.h3menu div em:first-of-type, .h3menu div span{display:block;color:#F5F5F5}
h3.h3menu div em:first-of-type{position:absolute;top:0;right:15px}
h3 span{float:right;margin:0 0 0 15px;color:#888485;cursor:pointer;}
h3 a{float:right;margin:0 0 0 15px}
h3 > a{float:right;margin:0 0 0 15px;color:#888485;white-space:nowrap;max-width:calc(100% - 130px);overflow:hidden;text-overflow:ellipsis}

input, textarea{font-family:Helvetica, Arial, sans-serif;font-size:16px;line-height:20px;}
input:focus, textarea:focus { outline: none; }
textarea{overscroll-behavior-x:contain;overflow:auto;overflow: -moz-scrollbars-none;-ms-overflow-style: none;scrollbar-width: none}
textarea::-webkit-scrollbar{height:0 !important; width:0 !important}
::placeholder{opacity:.5}
input[type="search"]::-webkit-search-cancel-button{display:none}

@media screen and (max-width: 800px) {
	h1{font-weight:normal;font-size:30px;line-height:35px;padding:0;margin:0 0 20px 0}
}

@media screen and (max-width: 500px) {
	h3, .h3{width:100%;margin-left:-4%;padding:0 4% 0 4%}
}

@media print{
  body{background:#FFFFFF}
}


/****** CONTAINER ELEMENTS ******/
#container{position:relative;margin:auto;text-align:center;width:100%;overflow:visible}
#page{position:absolute;width:100%;text-align:left;background:#FFFFFF}
#content{position:relative; width:1165px; margin:auto; display:grid; grid-template-columns: 72.08% auto;grid-template-rows: auto;
  gap: 25px;padding:0 0 30px 0;margin-top:86px;background:#FFFFFF;}
#col2{box-sizing:border-box;overflow:hidden;contain:content}
#col2 aside{overflow:hidden;contain:content}

@media screen and (max-width: 1213.5px) {
	#content{width:96%}
	#container{margin-left:0px}
}

@media screen and (max-width: 800px) {
	#container{left:0}
	#col1{margin:14px 0 0 0}
}

@media screen and (max-width: 500px) {
	#page{overflow:hidden}
	#content{width:92%;overflow:visible;display:block}
	#col1{position:relative;margin:4px 0 0 0;}
	#col2{position:relative;padding:20px 0 0 0;overflow:visible;clear:both}
	#col2 aside{overflow:visible}
}

@media print{
  #content, #col2{width:92%;display:block}
}


/****** GLOBAL ELEMENTS ******/
/* Global Buttons */
.graybutton, .orangebutton, .bluebutton{font-size:16px;font-weight:bold;color:#FFFFFF;background:#BEBEBE;text-align:center;line-height:40px;height:40px;min-width:112px;border-radius:5px;display:inline-block;margin-right:10px;cursor:pointer}
.graybutton, .orangebutton, .bluebutton{padding:0 10px}
.orangebutton{background:#E99A00}
.bluebutton{background:#3285A7}
.bluebutton i{display:block;float:left;margin:10px -9px 0 7px;font-size:20px;}

@media screen and (min-width: 600px) {
	.graybutton:hover{background:#B8B7B7}
	.orangebutton:hover{background:#EFC77A}
	.bluebutton:hover{background:#93BDCE}
}

@media screen and (max-width: 500px) {
.graybutton, .orangebutton, .bluebutton{min-width:initial}
}

/* Pop up */
body > .popcontainer{position:fixed;width:100%;height:100%;box-sizing:border-box;z-index:99;text-align:center;overflow:scroll;top:0;overscroll-behavior-y:contain;display:grid;grid-template:"pop" auto / auto}
body > .popcontainer::-webkit-scrollbar{height:0 !important; width:0 !important}

body > .popcontainer .sitemask{left:0px;top:0;height:101%;height:calc(100% + 1px);width:100%;background:#000000;opacity:.25;grid-area:pop}

body > .popcontainer .popup{align-self: start;justify-self: center;max-width:96%;position:relative;grid-area:pop;margin:55px 0 100px 0;background:#FFFFFF;text-align:left;box-shadow:0 0 20px rgba(0,0,0,.1);}
body > .popcontainer:nth-of-type(2) .popup{margin-top:55px;}
body > .popcontainer:nth-of-type(3) .popup{margin-top:60px;}
body > .popcontainer:nth-of-type(4) .popup{margin-top:65px;}
body > .popcontainer:nth-of-type(5) .popup{margin-top:70px;}
body > .popcontainer:nth-of-type(7) .popup{margin-top:75px;}

body > .popcontainer .popup .close{display:none}
body > .popcontainer #popup .close{position:absolute;color:#FFFFFF;margin:10px;right:-48px;top:-48px;font-size:18px;cursor:pointer;z-index: 105;display:block;border:10px solid transparent}
body > .popcontainer #popup .closeinset{right:0px;top:0px;margin:0px;font-size:16px;color:#BEBEBE;padding:5px;background:#F5F5F5;border-radius:12px;border:10px solid transparent;background-clip: padding-box;}

body > .popcontainer > div{z-index:100}
#commentspop{padding:30px;color:#888485;}
#commentspop img{float:left;margin-right:20px;height:75px;width:75px;object-fit:cover;}
#commentspop p{color:#3285A7;font-size:20px;line-height:75px;padding:0;margin:0;white-space:nowrap;overflow: hidden;text-overflow: ellipsis;}
body > .popcontainer .popcomments{margin:0;padding:5px 30px 5px 30px;background:#F5F5F5;border:0}
body > .popcontainer .popcomments .i{padding:10px 0 20px 0}
body > .popcontainer .popcomments .creply{padding-bottom:0}

/* Favorites pop */
#popup div.i em{float:left;background:#BEBEBE;color:#FFFFFF;width:30px;height:30px;border:0;border-radius:5px;line-height:30px;font-size:16px;font-weight:bold;font-style:normal;text-align:center;margin:0 0 0 0}
#popup div.i > b{color:#3285A7;font-size:28px;line-height:28px;font-weight:normal;display:block;padding:7px 0 20px 60px;margin-right:125px;word-break:break-word;}

@media print{
  #sitemask, #popcontainer{display:none}
}

/* Show Loading Pop */
#showloading{position:fixed;padding:30px 30px 5px 30px;background:#FFFFFF;left:50%;left:calc(50% - 55px);top:33%;width:50px;border:1px #F5F5F5 solid;border-radius:8px;box-shadow:0 0 5px rgba(0, 0, 0, 0.1);z-index:102}
#showloading .loading{position:absolute;}
#showloading .loading div:first-of-type{font-size:52px}
#showloading .loading div:first-of-type{font-size:52px}
#showloading .loading div:nth-of-type(2){font-size:16px;top:56px}
#showloading #loadingstatus{width:110px;font-size:11px;color:#888485;min-height:15px;line-height:15px;margin:80px 0 0 -30px}

/* Miscellaneous */
.resizetextarea{position:absolute;background:#EEEEEE;text-align:left;left:-200%}
[id]{scroll-margin-top:65px}
.i[id]{scroll-margin-top:60px}

/* Profile links */
.member{cursor:pointer;font-weight:normal;}
.member[data-user]:after{content: attr(data-user);vertical-align:top}
.expert > b::before{content: "X"}
.expert > b::first-letter{display:block;position:absolute;text-shadow:0px 1px 2px rgba(0,0,0,.5);color:#f4cc7f;margin:0 5px 0 -20px;}

/* Ads */
.ad{text-align:center;margin:-1px 0 0 0;overflow:hidden;background:#FFFFFF;contain:content}
.ad > ins{color:transparent;line-height:0}

#col1 .ad + h3, #col1 .ad + .h3{margin-top:20px}
#col1 #ad1{margin:25px 0 0 0;text-align:center;width:100%;}
#ad2, #ad3, #lc .ad{text-align:center}
#ad1 div, #ad2 div, #ad3 div, #ad4 div{margin:auto;}
#col1 #ad1 ins{height:110px;width:100%;display:inline-block}
#ad2 ins, #ad3 ins, #ad3 ins, .ad ins{display:block}
#col2 .ad{margin:20px 0 0 0;}
#col2 #ad1{margin:0 0 20px 0;}

@media screen and (max-width: 500px) {
	.ad{width:108%;margin:-1px 0 0 -4%;}
  #ad1 ins{height:120px}
	#col1 .ad:nth-of-type(1){width:108%;margin:20px 0 0 -4%;}
}

@media print{
  .ad{display:none}
}

/* Slider */
#slider{position:fixed;right:0;bottom:-150px;padding:15px;width:300px;box-sizing: border-box;height:134px;border-top:4px #E3A129 solid;background:#FFFFFF;text-align:left;box-shadow:1px 3px 6px #888485;z-index:10}
#slider div{float:left;height:100px;width:100px;text-align:center;margin-right:15px}
#slider div img{height:100px;max-width:100px}
#slider h4{font-weight:normal;font-size:15px;color:#888485;margin:0;padding:0;display:block;line-height:15px}
#slider a{font-size:15px;display:block;margin-top:10px}
#slider .g{position:absolute;right:15px;top:15px;font-size:12px;color:#BEBEBE;cursor:pointer}

@media screen and (max-width: 800px) {
	#slider{height:109px;box-shadow:0px 1px 6px #888485}
	#slider div{height:75px;width:75px;}
	#slider div img{height:75px;}
}

@media screen and (max-width: 500px) {
	#slider{width:100%}
}

/* Comment Menu */
#commentmenu{position:absolute;top:-2px;right:-80px;background:#FFFFFF;border-radius:5px;box-shadow:0 0 5px rgba(0,0,0,.1);border:1px #E1DEDE solid;z-index:5;font-size:12px}
#commentmenu a{display:block;clear:both;padding:15px 13px;border-bottom:1px #E1DEDE solid;color:#888485;font-size:20px}
#commentmenu a:last-of-type{border-bottom:0}

@media screen and (max-width: 800px) {
	#commentmenu{right:-60px;}
}

/* Global Forms */
.inlineform{background:#F5F5F5;border:1px #E1DEDE solid;padding:24px;margin:0 0 26px 0;clear:both}
.inlineform .textdiv {background:#FFFFFF !important;padding:10px;font-size:16px !important;margin:0 0 16px 0 !important}
.inlineform .textdiv textarea{background:#FFFFFF !important;width:100%;min-height:108px;border:0;color:#1A1A1A;font-size:16px !important;/*margin-top:-20px !important;opacity:0.5;*/margin-top:0px !important;line-height:20px !important;float:none !important}
.inlineform .message{float:right;font-style:italic;font-size:14px;height:40px;line-height:20px !important;color:#BEBEBE;width:70%;width:calc(100% - 152px);text-align:left;display: none;}
.inlineform .message div{display: table-cell;vertical-align: middle;}
/*.inlineform textarea, .inlineform input, .textdiv textarea, .inputdiv input{opacity:.5}*/

/* Are any of these in use? */
@media screen and (max-width: 930px) {
	.inlineform .message{line-height:20px !important}
}

@media screen and (max-width: 800px) {
	.inlineform .message{font-size:12px !important;}
}

@media screen and (max-width: 725px) {
	.inlineform .message{line-height:13.33px;font-size:11px !important}
}

@media screen and (max-width: 500px) {
	.inlineform .textdiv, .inlineform .textdiv textarea, .inlineform .textdiv div[contenteditable], .addnewitem .textdiv, .addnewitem .textdiv textarea, .addnewitem .textdiv div[contenteditable] {font-size:13px;}
	.inlineform .message{font-size:11px;}
}

@media screen and (max-width: 330px) {
	.inlineform .message{display:none}
}

.tempdiv{display:none}


/****** POSITIONING ELEMENTS ******/
/* Top Navigation Elements */
#topnav{position:fixed;z-index:10;left:0;text-align:center;width:100%;height:57px;background:#E9E9E9;border-bottom:4px #E3A129 solid;}
#topnavcontainer{position:relative;text-align:left;width:1165px;margin:auto;}

.logo{width:135px;height:30px;position:absolute;margin:14px 0 0 0;display:block;contain:strict}
.logo i{position:absolute;margin:0;display:block;font-size:30px}
.logo i:nth-of-type(1){color:#e3a129;}.logo i:nth-of-type(1):before{content: "6";}
.logo i:nth-of-type(2){color:#4d4d46;margin:0 0 0 35px}.logo i:nth-of-type(2):before{content: "5";}

#links{position:absolute;width:72.08%;height:50px;margin:0;line-height:57px;overflow:hidden;text-align:center;box-sizing:border-box;padding:0 0 0 140px;contain:content}
#links a{line-height:30px;color:#888485;font-size:15px;text-decoration:none;margin:0 3.5% 0 0}
#links .member{float:right;margin:16px 10px 0 0;line-height:25px;height:25px;padding:0 0 0 35px;border-radius:3px}
#links .member div{background:#BEBEBE;border-radius:3px;height:25px;width:25px;float:left;margin:15px 12px 0 0}
#links #memberlinks, #links #authlinks{float:right;height:30px;width:126px;text-align:right;}
#links #memberlinks a{display: inline-block;margin: 19px 0 0 14px;}
#links #authlinks{width:90px}
#links #authlinks a{display: inline-block;margin: 14px 0 0 0}
#links #memberlinks a div, #mmenu div, #topmenu a span div{background:#e99a00;border:2px solid #E9E9E9;border-radius:6px;color:#E9E9E9;display: block;font-size:9px;font-weight:bold;height:13px;line-height:13px;padding:0 3px;position:absolute;text-align:center;font-family:Helvetica, Arial, sans-serif;margin:-7px 0 0 8px;}

#mmenu:empty::before{content: 'M'}

#search{float:right;width:27.89%;height:36px;margin:10px 0 0 0;padding:0 0 0 25px;background:#E9E9E9;box-sizing:border-box}
#search div:first-of-type{padding:0 30px 0 12px;background:#DDDDDD;border-radius:3px}
#search input{background:transparent;border:0;padding:0;width:100%;height:36px;line-height:30px;font-size:15px;color:#888485;}
#search span{font-size:16px;color:#888485;height:36px;width:30px;padding:9px 9px 0 0;position:absolute;right:0;display:block;cursor:pointer;box-sizing:border-box;text-align:right}
#search span:empty::before{content: 'P'}
.searchspananimation{text-shadow:1px 1px 1px rgba(0,0,0,.2);animation-name: searchspananimation;animation-duration: 2s;animation-iteration-count: infinite;animation-timing-function: linear;}
@keyframes searchspananimation {
  0%   {text-shadow:0px 0px 0px rgba(0,0,0,.2);}
  50%   {text-shadow:-4px 4px 4px rgba(0,0,0,.2);}
  100%   {text-shadow:0px 0px 0px rgba(0,0,0,.2);}
}

#searchdrop{background:#DDDDDD;padding:3px 10px 5px 10px;margin:-3px 0 0 0;border-radius:0 0 3px 3px}
#searchdrop a{font-size:15px;color:#888485;display:block;margin:15px 0 15px 0}
#searchdrop a:first-of-type{border-top: 1px solid #bdb9ba;padding-top: 15px;margin-top:0}
#searchdrop .hover{color:#1A1A1A;text-decoration:underline}
#searchdrop img{width:20px;height:20px;float:left;margin:0 10px 0 0;border-radius:2px}
#searchdrop .g{font-size:10px}

#msearch, #mmenu{display:none;cursor:pointer;}
#msearch:empty::before{content: 'P'}

#crumbs{position:absolute;max-width:72.08%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;contain:content;top:0px;}
#crumbs a, #crumbs i{font-size:12px;text-decoration:none;color:#919399;display:inline-block;margin:0}
#crumbs i:empty::before{content:'9'}
#crumbs i{margin:0 10px 0 10px;font-size:7px;line-height:20px;color:#BEBEBE}

#topmenu{right:0px;top:0px;width:175px;text-align:left;contain:content;position:fixed;box-shadow:inset 0px 0px 10px rgba(0,0,0,.2);height:150%}
#topmenu a{display:block;font-size:17px;margin:0;padding:13px;color:#888485;border-bottom:1px #C9C9C9 solid}
#topmenu a span{display:block;float:left;width:20px;margin:0 5px 0 0;}
#topmenu a:hover, #topmenu a:hover span{color:#b4b1b2}

@media screen and (min-width: 600px) {
	#searchdrop a:hover{cursor:pointer;opacity:1;}
}

@media screen and (max-width: 1213.5px) {
	#topnavcontainer{width:96%}
}

@media screen and (max-width: 800px) {
	#topnav{left:0}
	#search{margin:10px 33px 0 0;}
	#search span{font-size:16px;color:#888485;padding:9px 25px 0 0;position:absolute;right:26px;display:block;}
	#links a{font-size:13px;margin: 0 2.5% 0 0}
	#memberlinks, #authlinks, #links .member{display:none;}
	#mmenu{display:block;color:#888485;position:absolute;padding:20px 10px;margin:0;right:-10px;top:0;font-size:16px;}
	#crumbs{top:-10px;}
	#crumbs a, #crumbs i{font-size:10px;line-height:12px}
	#crumbs i{margin:0 8px 0 8px;font-size:6px;line-height:12px;}
}

@media screen and (max-width: 500px) {
	#topnavcontainer{width:92%}
	#search,#links{display:none}
	#search{position:absolute;width:101%;margin:11px 0 0 0;padding:0 35px 0 0}
	#searchcontainer{margin:0 35px 0 0;}
	#msearch{display:block;position:absolute;padding:20px 5px 20px 10px;margin:0;right:28px;top:0;font-size:16px;color:#888485;}
	#crumbs{top:-20px;max-width:100%}
}

@media print{
  #topnavcontainer{width:92%}
}


/* Footer Elements */
#footer{background:#E9E9E9;text-align:center;font-size:11px;margin:20px 0 0 0;clear:both;contain:content}
#footercontainer{position:relative;width:1165px;margin:auto;padding:20px 0 25px 0;text-align:left;font-size:13px;color:#888485;}
#footercontainer span{display:inline-block;vertical-align:top;margin-top:1px;}
#footercontainer a{color:#888485}
#footercontainer .logo{width:135px;height:30px;position:relative;margin:5px 14px 10px 0;display:inline-block}
#footercontainer .logo i{color:#c2c2c0;}
#footercontainer .social{width:120px;height:30px;float:right;margin:5px 0 0 14px;text-align:right}
#footercontainer .social a{display:block;float:right;height:24px;width:30px;border:0;border-radius:5px;line-height:25px;text-align:center;font-size:18px;background:#C2C2C0;color:#FFFFFF;padding-top:6px;margin-left:10px}
#footercontainer .social a:nth-of-type(1){background:#1da1f2;font-size:15px;padding-top:8px;height:22px}#footercontainer .social a:nth-of-type(1):before{content: "Y";}
#footercontainer .social a:nth-of-type(2){background:#4B6FA8}#footercontainer .social a:nth-of-type(2):before{content: "K";}
#footercontainer .social a:nth-of-type(3){background: #f09433;font-size:20px;width:27px;padding-left:3px;padding-top:5px;height:25px;
background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
  }
#footercontainer .social a:nth-of-type(3):before{content: '\f16d';}

@media screen and (max-width: 1213.5px) {
	#footercontainer{width:96%}
}

@media screen and (max-width: 500px) {
  #footercontainer{width:92%}
}

@media print{
  #footercontainer{width:92%}
}


/* Column Two Elements */
#col2 nav.tabnav{background:#F5F5F5;border-radius:5px;padding:0 0 6px 0;min-height:200px;contain:content}
#col2 nav.tabnav > div.tabs{padding:0 0 45px 0}
#col2 nav.tabnav > div.tabs div{width:33.33%;height:36px;font-size:16px;line-height:36px;float:left;text-align:center;color:#888485;background:#E9E9E9;cursor:pointer;}
#col2 nav.tabnav > div.tabs div:first-child{border-top-left-radius:5px}
#col2 nav.tabnav > div.tabs div:last-child{border-top-right-radius:5px}
#col2 nav.tabnav > div.tabs div.on{background:#F5F5F5}
#col2 nav.tabnav a{display:block;clear:both;font-size:15px;margin:0 15px 0 15px;padding:9px 0 9px 0;border-bottom:1px #C9C9C9 solid}
#col2 nav.tabnav a:last-child{border-bottom:0}

#col2 h4{font-size:16px;font-weight:normal;color:#888485;margin:40px 0 0 0;width:100%}
#col2 h4 i{float:right;font-style:normal;font-size:12px;margin:1px 0 0 0}
#col2 .bluebutton{width:100px;margin-top:10px}
#col2 .member{display:block;margin:10px 0 0 0;font-size:15px;color:#639FC1;line-height:25px;cursor:pointer;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;padding:0 0 0 35px;border-radius:3px;}
#col2 .member div{background-color:#BEBEBE;border-radius:3px;height:25px;width:25px;float:left;margin:0 10px 0 0;display:none}

#col2 .related{font-size:15px;clear:both;padding:10px 0 10px 0;display:block;}
#col2 .related img{float:left;margin:-10px 15px 0 -85px;width:70px;}

div.stats, div.disclaimer{background:#F5F5F5;margin:10px 0 0 0;padding:10px 14px 10px 14px;color:#8C8A88;font-size:14px}

#col2 .remix{font-size:15px;clear:both;padding:10px 0 0 0;display:block;font-weight:normal;color:#3285A7;cursor:pointer;}
#col2 .hasimage{padding:20px 0 0 85px;min-height:100px;box-sizing: border-box;}
#col2 .remix img{float:left;margin:0 15px 0 -85px;width:70px;}
#col2 .remixbutton{float:left;margin:10px 15px 0 0}
#col2 .viewall{font-size:16px;line-height:40px;margin-top:10px;display:inline-block;color:#3285A7;cursor:pointer;}
#col2 .addpost{margin-top:15px}

@media screen and (max-width: 800px) {
	#col2 nav.tabnav > div.tabs div{font-size:10px;}
	#col2 .hasimage{padding:10px 0 0 0}
	#col2 .related img{float:none;margin:0 0 10px 0;display:block;}
	#col2 .remix img{float:none;margin:0 0 10px 0;display:block;}
	#col2 h4 i{font-size:9px;margin-top:2px}
}

@media screen and (max-width: 500px) {
	#col2 .hasimage{padding:10px 0 0 115px}
	#col2 .related img{float:left;margin:0 15px 0 -115px;display:block;width:100px;height:auto}
	#col2 .remix img{float:left;margin:0 15px 0 -115px;width:100px;height:auto}
}


/* More Lists Elements */
#morelists{text-align:center;clear:both;contain:content}
#morelistscontainer{position:relative;width:1165px;margin:auto;text-align:left;}
#morelistscontainer h3, #morelistscontainer .h3{margin:0}

div.listgrid{display:grid;grid-template-columns: auto auto auto;grid-auto-flow:row dense;align-items:start;padding-bottom:30px}
div.listgrid a{align-self:start;align-content:stretch;grid-column:auto / span 1;grid-row:auto / span 1;font-size:18px;line-height:20px;padding:20px 20px 0 0;padding-left:115px;display:block;min-height:120px;box-sizing: border-box;position:relative;}
div.listgrid a img{float:left;margin:-10px 0 0 -115px;width:100px;height:100px;object-fit:cover;background:#F5F5F5}
div.listgrid a span{color:#888485;font-size:11px;display:block;margin-top:4px}
div.listgrid a span[data-user]:after{content:attr(data-user)}
div.listgrid a span.feat, .listgrid a span.trend{padding:0 7px 0 5px;margin-top:-10px;background:#3285A7;color:#FFFFFF;border-radius:5px;display:inline-block;line-height:20px;margin-bottom:10px}
div.listgrid a span.feat:empty::after{content:'Featured'}
div.listgrid a span.trend{background:#E99A00}
div.listgrid a span.trend:empty::after{content:'Trending'}
div.listgrid a span.feat:before, .listgrid a span.trend:before, .listgrid a span.fg:before{content:'X'} /* remove first two after updating HTML */
div.listgrid a span.feat::first-letter, .listgrid a span.trend::first-letter, .listgrid a span.fg::first-letter{font-size:10px;padding-right:3px} /* remove first two after updating HTML */
div.listgrid a span i.g{display:none} /* remove after updating HTML */
div.listgrid a.votedon{-webkit-filter: grayscale(100%);filter: grayscale(100%);}

@media screen and (max-width: 1213.5px) {
	#morelistscontainer{width:96%}
}

@media screen and (max-width: 900px) {
	div.listgrid{grid-template-columns: auto auto;}
}

@media screen and (max-width: 600px) {
	div.listgrid{grid-template-columns: auto;}
}

@media screen and (max-width: 500px) {
  #morelistscontainer{width:92%}
	#morelistscontainer h3, #morelistscontainer .h3{width:100%;margin-left:-4%;padding:0 4% 0 4%}
}

@media print{
  #morelistscontainer{width:92%}
}


/****** LIST PAGE ELEMENTS ******/
/* List Page Elements: Miscellaneous */
#col1 h4{font-size:16px;font-weight:normal;color:#888485;margin:40px 0 0 0;width:100%}
#lc{padding:0;margin:0;list-style:none}
li.i{padding:0;margin:0;list-style-type:none}
#lc h4{background:#F5F5F5;font-size:16px;font-weight:normal;color:#888485;border-radius:1px;margin:0px 0 0 -4%;display:block;height:40px;line-height:40px;width:100%;padding:0 4% 0 4%;contain:strict}
#col1 .member{display:block;white-space:nowrap;margin:-6px 0 20px 0;font-size:15px;line-height:25px;color:#3285A7;font-weight:normal;cursor:pointer;padding:0 0 0 35px;border-radius:3px}
h1 + .member{width:100px}
#col1 .member div{background-color:#BEBEBE;border-radius:3px;height:25px;width:25px;float:left;margin:0 12px 0 0}

@media screen and (min-width: 501px) {
  #lc h4{padding:0 15px 0 17px;margin:30px 0 0 0}
}

/* List Page Elements: List Menu */
#lm{font-size:16px;margin-top:0px}
#lm:empty::before{content: '\004D'}
#listmenu{position:absolute;top:-5px;right:43px;padding:0px;background:#BEBEBE;border-radius:1px;box-shadow:0 0 10px rgba(0,0,0,.1);z-index:10;cursor:pointer}
#listmenu a{display:block;clear:both;padding:0 15px;color:#F5F5F5;font-size:20px;margin:0;float:none;font-size:16px;line-height:50px;border-bottom:1px #CCCCCC solid}
#listmenu a:hover{background:#CECECE}
#listmenu a:last-of-type{border-bottom:0}
#listmenu .g{float:left;margin:0 10px 0 0;font-size:20px;line-height:50px;color:#F5F5F5;}
.favorite, #listmenu span.favorite{color:#E99A00;transform:rotateY(180deg)}

/* List Page Elements: List Item */
#col1 .i{clear:both;overflow-y:visible;padding:25px 0 25px 0;border-bottom:1px #E1DEDE solid;position:relative;}
#col1 *[class='i']:last-of-type{border:0}

/*#col1 .hasimage{padding:25px 0 25px 225px;min-height:250px}
#col1 .image100{padding:25px 0 25px 125px;min-height:150px}*/

#col1 .hasimage{padding:25px 0 25px 225px;min-height:250px}
#col1 .image100{padding:25px 0 25px 125px;min-height:150px}

#col1 .i > img{position:absolute;width:200px;top:0;margin:25px 0 0 -225px;background:#F5F5F5;border-radius:5px;height:200px;object-fit:scale-down}
#col1 .image100 > img{cursor:pointer;}
#col1 .image100 > b, #col1 .image100 > h2{cursor:pointer;}
#col1 .i > img + span, #col1 .i #cta2 + span{display:block;position:absolute;width:200px;top:210px;margin:25px 0 0 -225px;background:#FFFFFF;height:20px;color:#BEBEBE;font-size:12px;text-align:center;cursor:pointer;}
#col1 .i img + span:before, #col1 .i #cta2 + span:before{content: "TheTopTens Trusted Partner*";}
#col1 .i #cta2{display:block;position:absolute;width:200px;top:265px;margin:0 0 0 -225px;}
#col1 .i:not(.partner) #cta2{top:235px;}

#col1 .i #cta2 .orangebutton{font-weight:normal;width:200px;display:block;height: auto;line-height: 20px;min-height: 20px;padding: 10px 40px 10px 20px;position: relative;text-align: left;white-space:normal;box-sizing: border-box;}
#col1 .i #cta2 .orangebutton span{position:absolute;font-size:20px;right:20px;top:10px}
#col1 .i #cta2 > b{font-weight:normal;width:200px;display:block;color:#3285A7;padding-top:10px;text-align:center}

#col1 .image100 img{margin:25px 0 0 -125px;width:100px;min-height:100px;height:auto;object-fit:cover}
#col1 .image100 img[data-fsrc]{height:100px;}

#col1{counter-reset:rank} /* does not work with content-visibility: auto */
#col1 .i em{float:left;background:#BEBEBE;color:#FFFFFF;width:40px;height:40px;border:0;border-radius:5px;line-height:40px;font-size:24px;font-weight:bold;font-style:normal;text-align:center;margin:0 0 0 0;}
#col1 .i em.gold{background:#D6A328}
#col1 .i em.silver{background:#A2A7A7}
#col1 .i em.bronze{background:#986840}
#col1 .i em.gt99{font-size:20px;}
#col1 .i em.gt999{font-size:16px;}
#col1 .i em.gt9999{font-size:13px;}
#col1 .i em:empty{counter-increment:rank}
#col1 .i em:empty:not([rank])::after{content: counter(rank)}
#col1 .i em[rank]:empty::after{content:attr(rank)}

#col1 .i > b, #col1 .i > h2{color:#3285A7;font-size:28px;line-height:28px;font-weight:normal;display:block;padding:7px 0 20px 60px;margin:0 125px 0 0;overflow-wrap: anywhere; word-break: normal;}
#col1 .i:not(.j) > b a, #col1 .i:not(.j) > h2 a, #col1 .i .hublink{cursor:pointer}
#col1 .i:not(.j):nth-of-type(1) > b a, #col1 .i:not(.j):nth-of-type(2) > b a, #col1 .i:not(.j):nth-of-type(3) > b a{text-decoration:underline}
#col1 .i:not(.j):nth-of-type(1) > h2 a, #col1 .i:not(.j):nth-of-type(2) > h2 a, #col1 .i:not(.j):nth-of-type(3) > h2 a{text-decoration:underline}

#col1 .i > .member{margin:4px 0;padding:0 0 0 35px;line-height:25px;font-size: 15px;}
#col1 .i .creply + .member{margin:-7px 0 0 20px;}

@media screen and (max-width: 800px) {
	#col1 .i em{width:35px;height:35px;border:0;border-radius:5px;line-height:35px;font-size:21px;}
	#col1 .i em.gt99{font-size:18px;}
	#col1 .i em.gt999{font-size:13px;}
	#col1 .i em.gt9999{font-size:10px;}
	#col1 .i > b, #col1 .i > h2{font-size:24px;line-height:24px;padding:6px 0 20px 50px;margin:0 105px 0 0}
	#col1 .i > i{font-size:24px;line-height:35px;width:105px}
	
	#col1 .hasimage{padding:25px 0 25px 175px}
	#col1 .image100{padding:25px 0 25px 125px;}
	#col1 .ihidden{padding-bottom:0px;padding-top:0px;}
	#col1 .i img{position:absolute;width:150px;margin:25px 0 0 -175px;height:150px;}
	#col1 .image100 img{margin:25px 0 0 -125px;width:100px;min-height:100px;height:auto;}
	#col1 .i img + span:not(.comment){width:150px;top:160px;margin:25px 0 0 -175px;}
}

@media screen and (max-width: 600px) {
	#col1 .hasimage{padding:25px 0 25px 0;min-height:auto}
	#col1 .ihidden{padding-bottom:0px;padding-top:0px;}
	#col1 .i img{position:relative;float:none;margin:0 0 10px 0;width:200px;height:200px;}
	#col1 .i img + span:not(.comment){margin:0;top:auto;font-size:11px;width:200px;}
	#col1 .hasimage img{float:left;margin:0 20px 20px 0;}
	#col1 .image100 img{float:left;width:100px;min-height:100px;height:auto;margin:0 20px 10px 0;}
	#col1 .hasimage::after{content: "";clear: both;display: table;} /*prevents image from extending past bottom of item div, does not work on absolutely position*/
}

@media screen and (max-width: 500px) {
	#col1 .i em{width:30px;height:30px;border:0;border-radius:5px;line-height:30px;font-size:18px;}
	#col1 .i em.gt99{font-size:14px;}
	#col1 .i em.gt999{font-size:11px;}
	#col1 .i em.gt9999{font-size:9px;}
	#col1 .i > b, #col1 .i > h2{padding:4px 0 20px 40px;}
	#col1 .i > i{font-size:20px;line-height:30px;width:95px}
	#col1 .i > i span, #col1 .i > i.vote::first-letter, #col1 .i > i.comm::first-letter{margin:-1px 0 0 10px;height:30px;width:30px;font-size:30px;}
	#col1 .j > b{padding:7px 0 10px 0}
}

/* List Page Elements: List Item Vote Button */
#col1 .i > i{position:absolute;top:15px;padding:10px 0;right:0;width:126px;font-size:28px;line-height:40px;height:40px;text-align:right;color:#BEBEBE;font-style:normal;contain:strict}
#col1 .i > i.vote::before{content:'EVote'}
#col1 .i > i.voted{width:130px;}
#col1 .i > i.voted::before{content:'GVoted'}
#col1 .i.partner > i.vote::after, .i.partner > i.voted::after{content:'*'}
#col1 .i > i.comm{width:40px}
#col1 .i > i.comm::before{content:'H'}
#col1 .i > i.vote::first-letter, .i > i.voted::first-letter, .i > i.comm::first-letter{display:block;float:right;margin:0 0 0 14px;height:40px;width:40px;font-size:40px;text-align:center;color:#E99A00;}
#col1 .i > i.voted::first-letter{color:#BEBEBE}
#col1 .i > i.comm::first-letter{color:#3285A7}
#col1 .i > i.ia{cursor:pointer;}

#col1 .i > i span{display:block;float:right;margin:-1px 0 0 14px;height:40px;width:40px;font-size:40px;text-align:center;color:#E99A00;cursor:pointer;}
#col1 .i > i span:empty::before{content:'E'}

@media screen and (min-width: 600px) {
  #col1 .i > i.vote:hover::first-letter{color:#EFC77A}
	#col1 .i > i.voted:hover::first-letter{color:#DEDEDE}
	#col1 .i > i.comm:hover::first-letter{color:#93BDCE}
}

@media screen and (max-width: 800px) {
  #col1 .i > i{font-size:24px;line-height:35px;height:35px;width:105px}
	#col1 .i > i span, #col1 .i > i.vote::first-letter, #col1 .i > i.comm::first-letter{margin:0 0 0 10px;height:35px;width:35px;font-size:35px;}
}

@media screen and (max-width: 500px) {
	#col1 .i > i{font-size:20px;line-height:30px;height:30px;width:95px}
	#col1 .i > i span, #col1 .i > i.vote::first-letter, #col1 .i > i.comm::first-letter{margin:0 0 0 10px;height:30px;width:30px;font-size:30px;}
}

/* List Page Elements: List Item Comments */
.i p{margin:0; padding:0}
.i p + p{margin:4px 0 0 0; padding:0}

.i > blockquote{margin:14px 75px 0 0;position:relative;font-size:15px;line-height:20px;color:#1A1A1A;display:flow-root;}

.i > blockquote::before{content: '\0063';z-index:20}
.i > blockquote::first-letter{float:left;margin:0 0 0 -12px;font-style:normal;font-size:10px;color:#E99A00;}

.i > blockquote span {display:block;position:absolute;top:3px;right:-75px;width:47px;padding:0 18px 0 0;text-align:right;font-size:12px;color:#BEBEBE;cursor:pointer;line-height:15px;contain:layout}
.i > blockquote span::before{content: '\004D';}
.i > blockquote span::first-letter{float:right;margin:0 -18px 0 0;font-size:12px;font-style:normal;display:block;}
.i > blockquote span i{position:absolute;top: 6px;right: -3px;font-size: 10px;color: #F5F5F5;text-shadow: 0px 1px 2px rgba(0,0,0,.3);}
.i > blockquote span i::before{content: 'C'}
.i > blockquote span[thumbs]::after{content:attr(thumbs)}
.i > blockquote span[data-thumbs]::after{content:attr(data-thumbs)}

.i > blockquote.creply{margin:6px 87px 0 20px;font-size:14px;padding-bottom:10px;line-height:19px}

.i > blockquote b{color:#3285a7;font-weight:normal;cursor:pointer;white-space:nowrap}
.i > blockquote b{text-overflow: ellipsis;overflow: hidden;max-width: calc(100% + 50px);display: inline-block;vertical-align: top;margin-left: 5px;}
.i > blockquote b:empty::before{content:' - ';color:#1A1A1A}
.i > blockquote b[data-user]:after{content:attr(data-user)}
.i > blockquote time{display:inline;color:#919399;font-size:12px;}

#col1 .i > div.description{color: #5b5759;font-weight:normal;margin:10px 0 0 0;padding: 0;display:block;font-size:15px;line-height:20px;min-width:150px;display:flow-root;position:relative}
#col1 .i > div.description br{display:block;content: " ";margin-top:4px;height:0px;line-height:4px}

#col1 .i > div.description i{font-style:normal;color:#3285A7;cursor:pointer;}
.i div.description span{display:block;color:#BEBEBE;content: '\0061';font-size: 14px;float:right;padding: 6px 4px 6px 8px;background: #F5F5F5;border-radius: 3px;cursor: pointer;margin:0 0 10px 10px;position:absolute;top:-3px;right:-75px;}
.i div.description span::before{content: '\0061';}
#col1 .i > div.editable{margin:10px 75px 0 0}
#col1 .i > .tempinfo{text-align:right;margin:10px 55px 30px 0}
#col1 .i > .tempinfo span{right:-55px}

@media screen and (max-width: 800px) {
	.i > blockquote{margin:10px 50px 0 0;position:relative}
	.i > blockquote.creply{margin:10px 62px 0 20px;position:relative}

	.i > blockquote span {top:3px;right:-65px;width:35px;padding:15px;height:20px;}
	.i > blockquote span::first-letter{margin:-14px 0 0 0;}
	.i > blockquote span i{top: 5px;right:12px}
	
	#col1 .i > div.editable{margin:10px 50px 0 0;min-width:auto}
	.i div.description span {right:-60px;top:-13px;border:10px white solid}
	#col1 .i > .tempinfo{margin-bottom:30px}
  #col1 .i > .tempinfo span{right:-60px}
}

@media screen and (max-width: 500px) {
  #col1 > .hasimage:not(.image100) blockquote{clear:both} /*applies to remixes only*/
  .i div.description + blockquote{clear:both}
}

@media screen and (max-width: 400px) {
	#lc .hasimage:not(.image100) blockquote{clear:both}
	#lc .hasimage:not(.image100) > strong{clear:both}
	#col1 .i > div.description{margin-top:0px}
}

/* List Page Elements: List Item Links*/
#col1 .i u{margin:20px 0 0 0;padding:0;font-size:15px;overflow:hidden;display:block;clear:both;contain:layout}

#col1 .i u > *{width:auto;margin:0 25px 0 0;display:inline-block;line-height:25px; white-space:nowrap; font-weight:normal; font-style:normal; text-decoration:none; color:#3285A7; cursor:pointer}
#col1 .i u .lsn::before{content: 'U Listen to Sample'}
#col1 .i u .addimg::before{content: 'T'}
#col1 .i u .mcm::before{content: 'V'}
#col1 .i u .mcm[data-cc]::before{content: 'V' attr(data-cc) ' Comments'}
#col1 .i u .mcm[data-cc="1"]::before{content: 'V' attr(data-cc) ' Comment'}
#col1 .i u .vst:empty::before{content: 'Visit Website'}
#col1 .i u .orangebutton::before{content: '9'}
#col1 .i u .fg::first-letter{float:left;width:25px;margin:5px 10px 0 0;}
#col1 .i img + u .mcm::first-letter, #col1 .i b + u .mcm::first-letter, #col1 .i span + u .mcm::first-letter, #col1 .i div.description + u .mcm::first-letter{float:left;width:25px;margin:5px 10px 0 0;color:transparent} /*removes plus when there are no vosible comments*/

#col1 .i u:last-of-type{margin:15px 0 0 0;padding:0;font-size:15px;height:auto;min-height:50px}
#col1 .i u .orangebutton {color: #ffffff;float: left; font-weight: normal;height: auto;line-height: 20px;margin: 0 15px 0 0;min-height: 20px;padding: 15px 20px 15px 20px;position: relative;text-align: left;white-space:normal;}
#col1 .i u .orangebutton span{position:absolute;font-size:20px;right:20px;top:15px}
#col1 .i u .orangebutton.fg::first-letter{float:right;font-size:20px;margin:0 0 0 7px;}
#col1 .i u .orangebutton + b{font-weight:normal;color:#3285A7;line-height:50px;height:50px;margin-top:1px}
#col1 .i .share{background:#F5F5F5;border:1px #E1DEDE solid;padding:28px 0px 30px 31px;margin:0 0 26px 0;font-size:18px;line-height:18px;color:#1A1A1A}
#col1 .i .sharelinks{float:right;margin:-7px -3px 0 0;height:32px;width:240px;overflow:hidden}

@media screen and (max-width: 900px) {
	#col1 .i .share{padding:28px 0px 30px 31px;margin:0 0 26px 0;font-size:16px;line-height:18px}
}

@media screen and (max-width: 800px) {
	#col1 .i .sharelinks{margin:0px -3px 0 0;}
	.i #cta2 + span{width:150px;top:160px;margin:25px 0 0 -175px;}
	#col1 .i #cta2{width:150px;top:235px;margin:0 0 0 -175px;}
	#col1 .i:not(.partner) #cta2{top:185px;}
	#col1 .i #cta2 .orangebutton{width:150px;font-size:13px;padding: 10px 24px 10px 10px;}
	#col1 .i #cta2 .orangebutton span{font-size:20px;right:10px;top:10px;margin:0}
	#col1 .i #cta2 > b{width:150px;font-size:13px;padding-top:5px}
}

@media screen and (max-width: 600px) {
	#col1 .i #cta2 + span{margin:-10px 0 0 30px;top:auto;font-size:11px;width:200px;}
	#col1 .i #cta2{width:150px;top:160px;margin:0 0 0 210px;}
	#col1 .i #cta2 .orangebutton{width:130px;font-size:13px;min-height: 20px;padding: 10px 24px 10px 10px;}
	#col1 .partner #cta2 .orangebutton span, #col1 .likepart #cta2 .orangebutton span{font-size:14px;right:10px;top:12px;margin:0}
	#col1 .i #cta2 > b{width:150px;font-size:13px;padding-top:5px}
}

@media screen and (max-width: 500px) {
	#col1 .i img + span:not(.comment), #col1 .i #cta2 + span{margin:0;top:auto;font-size:11px;width:200px;opacity:.7;height:auto;z-index:3}
}

/* List Page Elements: List Load More Items */
#loadmore{margin:25px 0 40px 0;width:100%;padding:0}
#loadmore span.g{font-size: 14px;margin:0 8px 0 0;display: inline-block;padding:0 0 0 2px}

/* List Page Elements: Add New Item Form */
.addnewitem{font-size:32px;line-height:40px;color:#888485;border:1px #E1DEDE solid;padding:30px;margin:-1px 0 60px 0;cursor:pointer;position:relative;background:rgba(255,255,255,.9)}
.addnewitem > .g{float:left;margin:0 18px 0 0;height:40px;width:40px;color:#E4921A;font-size:40px;}
.addnewitem .textdiv {background:#FFFFFF;padding:10px;margin:30px 0 16px 0;font-size:16px;line-height:20px;}
.addnewitem .textdiv > textarea, .addnewitem .textdiv div[contenteditable]{background:#FFFFFF;width:100%;height:108px;border:0;padding:0;color:#1A1A1A;font-size:16px;margin-top:-20px;/*opacity:0.5*/}
.addnewitem .inputdiv, .addnewitem .inputdiv div[contenteditable]{padding-left:56px}
.addnewitem .inputdiv > span{display:block;float:left}
/*.addnewitem .inputdiv input{width:100%;border:0;font-size:32px;line-height:40px;background:#F5F5F5;color:#888485;float:left;margin-top:-40px;opacity:.5} */
.addnewitem .inputdiv input, .addnewitem .inputdiv > textarea, .addnewitem .inputdiv div[contenteditable]{background:#F5F5F5;width:100%;height:40px;line-height:40px;border:0;padding:0;color:#888485;float:left;font-size:32px;margin-top:-40px;/*opacity:0.5*/}
div[contenteditable]{position:relative;outline:0px solid transparent;word-wrap: break-word;height:auto;}

/*.addnewitem .inputdiv div[contenteditable], .addnewitem .textdiv div[contenteditable]{opacity:1}
.addnewitem .inputdiv div[contenteditable]:empty, .addnewitem .textdiv div[contenteditable]:empty{opacity:0.5}*/

.addnewitem .textdiv div[contenteditable], .addnewitem .inputdiv div[contenteditable]{height:auto;}
.addnewitem .textdiv div[contenteditable]{min-height:108px;}
.addnewitem .inputdiv div[contenteditable]{min-height:40px;}
.addnewitem .i{border-bottom:0;border-top:1px #E1DEDE solid;padding-bottom:0}

.infobutton{background:#3285a7;cursor:pointer;font-size:12px;font-weight:bold;border-radius:2px;height:21px;width:19px;text-align:center;display:inline-block;line-height:21px;color:#FFFFFF;margin:0 0 0 5px;vertical-align:top}
#itemdrop {border:none;width:100%;border-spacing: 0;border-collapse: collapse;font-size:16px;line-height:20px;border-top:1px solid #e1dede;margin-top:10px}
#itemdrop th, #itemdrop td {padding:8px;cursor:pointer}
#itemdrop tr:hover{background:#FBFBFB}
#itemdrop td:first-of-type {width:40px;}
#itemdrop img,  #col1 .i #itemdrop img{width:40px;min-height:40px;margin:0;border-radius:0;height:auto;position:relative;}
#itemdrop sup{color:#b5b2b2}
#itemdrop, #itemdrop tr, #itemdrop td {width:100%}
#itemdrop tr i{display:none}
#itemdrop tr.selecteditem{position:relative;background:#FFFFFF}
#itemdrop tr.selecteditem i{display:block;position:absolute;right:0px;top:0px;margin:0px;font-size:16px;color:#BEBEBE;padding:5px;background:#F5F5F5;border-radius:12px;border:8px solid transparent;background-clip: padding-box;}

@media screen and (max-width: 500px) {
	.inlineform .textdiv, .inlineform .textdiv textarea, .inlineform .textdiv div[contenteditable], .addnewitem .textdiv, .addnewitem .textdiv textarea, .addnewitem .textdiv div[contenteditable] {font-size:13px;}
	.inlineform .message{font-size:11px;}
	.addnewitem, .addnewitem .inputdiv input, .addnewitem .inputdiv > textarea, .addnewitem .inputdiv div[contenteditable]{font-size:20px;line-height:30px}
	.addnewitem .inputdiv input, .addnewitem .inputdiv > textarea, .addnewitem .inputdiv div[contenteditable]{margin-top:-30px;height:30px}
	.addnewitem .inputdiv div[contenteditable]{height:auto}
	.addnewitem > .g{margin:0 18px 0 0;height:30px;width:30px;font-size:30px;}
	.addnewitem .inputdiv{padding-left:46px}
	#newitemimage{height: 30px;width: 30px;}
}


/* Vote Overlay */
#voteoverlay{position:fixed;right:0;bottom:-150px;padding:10px 15px 0 15px;width:400px;min-width:275px;max-width:900px;box-sizing: border-box;border-top:4px #E3A129 solid;background:#FFFFFF;text-align:left;box-shadow:0 0 10px rgba(0,0,0,.2);z-index:10;display:grid;grid-template-rows:min-content 1fr min-content;max-height:90%;max-height:calc(100% - 30px);}
#voteoverlay > div:nth-of-type(1){font-size:16px;color:#888485;padding:0px 5px 10px 5px;border-bottom:1px #E1DEDE solid;display:grid;grid-template-columns:min-content auto min-content;grid-column-gap:5px;align-items:baseline;min-height:30px}

#voteoverlay > div:nth-of-type(1) > div{position:absolute;left:0;top:0;width:55px;height:60px;line-height:58px;font-size:10px;text-align:left;padding-left:12px;color:#E3A129;cursor:pointer}
#voteoverlay > div:nth-of-type(1) > b span{font-size:40px;color:#E3A129;line-height:40px;padding-left:15px}

#voteoverlay > div:nth-of-type(1) > b{display:inline-block;font-weight:normal;font-size:14px;overflow:hidden;max-height:40px}
#voteoverlay > div:nth-of-type(2){padding:0px 0px 0px 0;overflow:auto;overscroll-behavior-y:contain;}
#voteoverlay > div:nth-of-type(2) > div{padding:10px 0 10px 0;font-size:16px;height:40px;line-height:40px;white-space:nowrap;overflow: hidden;text-overflow: ellipsis;position:relative;border-bottom:1px #E1DEDE solid;cursor:pointer}
#voteoverlay > div:nth-of-type(2) > div[id]:last-of-type{border:none}
#voteoverlay > div:nth-of-type(2) > div b{position:absolute;top:0;right:0;font-size:15px;display:block;color:#888485;height:20px;width:40px;line-height:40px;cursor:pointer;text-align:right}
#voteoverlay > div:nth-of-type(2) > div img{max-height:40px;max-width:40px;margin-right:10px;float:left}
#voteoverlay > div:nth-of-type(3){padding:11px 0 11px 0;text-align:right;border-top:1px #E1DEDE solid}
#voteoverlay > div:nth-of-type(3) > div.fg{line-height: 1;height: 40px;padding: 12px 20px;position: relative;text-align: left;white-space:normal;min-width:auto;font-weight:normal;margin:0;box-sizing:border-box;float:right;white-space:nowrap}
#voteoverlay div.fg::first-letter{float:right;font-size:20px;margin:-2px 0 0 10px;line-height:1}
#voteoverlay > div:nth-of-type(2) > div.overlaycomment{padding:5px 10px 15px 10px;box-sizing:border-box;height:auto;border-bottom:1px #E1DEDE solid;margin-top:-1px;background:#F5F5F5;display:none}
#voteoverlay textarea{min-height:120px;max-height:360px;width:100%;border:1px #E1DEDE solid;padding:15px;box-sizing:border-box}
#voteoverlay > div:nth-of-type(2) > div.commenting{border-left:10px #F5F5F5 solid;border-right:10px #F5F5F5 solid;background:#F5F5F5}
#voteoverlay > div:nth-of-type(2) > div.commenting div{display:none}
#voteoverlay #voteresizer{position:absolute;left:4px;top:calc(50% - 15px);height:30px;width:2px;border-left:2px #E1DEDE solid;border-right:2px #E1DEDE solid;cursor:w-resize}
#voteoverlay #voteresizer:after {content:'';position:absolute;top:-10px; bottom:-10px;left:-4px; right:-4px;}

@media screen and (max-width: 900px) {
	#voteoverlay{max-width:100%}
}

@media screen and (max-width: 500px) {
	#voteoverlay{width:100%;max-height:100%}
	#voteoverlay textarea{min-height:90px;}
	#voteoverlay #voteresizer{display:none}
}

@media screen and (max-width: 400px) {
  #voteoverlay > div:nth-of-type(1) > b i{display:none}
}

@media print{
  #voteoverlay{display:none}
}


/****** GLOBAL MODULES ******/
/*Feed Style*/
#feed{width:100%;margin:0;padding:20px 0 0 0;contain:layout}
#feed tr{margin-bottom:20px;opacity:1;display:table-row}
#feed tr.hidden{display:none;opacity:0}
#feed td:first-of-type{vertical-align:top;width:40px;padding:0 0 20px 0}
#feed td:last-of-type{vertical-align:middle;padding:0 0 20px 20px;overflow:hidden}
#feed td div, #feed td img{height:40px;width:40px;text-align:center;background:#C9C7C8;color:#FFFFFF;border-radius:3px;line-height:40px;font-size:18px}
#feed td img{object-fit: cover;}
#feed a{font-weight:bold}
#feed p{padding:0;margin:5px 0 0 0;position:relative}
#feed p i{font-style:normal;position:absolute;top:0;left:-12px;font-size:10px;color:#c9c9c9;}


/*Pagination Links*/
div.pages{margin:-30px 0 60px 0;height:40px;overflow:hidden}
div.pages a, div.pages i{display:block;height:40px;width:40px;text-align:center;line-height:40px;margin-right:1px;float:left;background:#F5F5F5;font-style:normal}
div.pages .g{font-size:16px;color:#BEBEBE}
div.pages .active{background:#E1DEDE;color:#888485;cursor:pointer}
div.pages .inactive{color:#E1DEDE;cursor:default}

/*For You and #col2 lists*/
#col1 .related{font-size:18px;padding:20px 20px 0 0;margin-left:115px;display:block;float:left;width:50%;width:calc(50% - 116px);min-height:110px;box-sizing: border-box;position:relative;}
#col1 .related img{float:left;margin:-10px 0 0 -115px;width: 100px;height: 100px;object-fit: cover;}
/*.related .g{position:absolute;right:10px;top:10px;font-size:12px;color:#DDDDDD;cursor:pointer}
.related .g:hover{color:#888485;} - Included in recommended.asp*/

@media screen and (max-width: 800px) {
	#col1 .related{font-size:15px;}
}

@media screen and (max-width: 600px) {
	#col1 .related{width:100%;margin-left:0}
	#col1 .related img{margin:-10px 15px 0 0}
}

/* Responsive Related, Remixes, and Posts Modules */
#mrelated, #mremix, #mpost{padding: 20px 10px;margin: 0 -5% 0 -5%;width: 110%;overscroll-behavior-x:contain;overflow:scroll;overflow: -moz-scrollbars-none;-ms-overflow-style: none;scrollbar-width: none;background: #E3A129;box-sizing: border-box;color:#FFFFFF;contain:strict;height:160px;}
#mremix, #mpost{height:215px;}
#col1 > #mrelated, #col1 > #mremix, #col1 > #mpost{margin-top:10px;} /* module outside of #lc */
#col2 #mrelated, #col2 #mremix, #col2 #mpost{margin-top:10px;}
#mrelated + h3, #mremix + h3, #mpost + h3, #mrelated + .h3, #mremix + .h3, #mpost + .h3{margin-top:10px}
#mrelated::-webkit-scrollbar, #mremix::-webkit-scrollbar, #mpost::-webkit-scrollbar{height:0 !important; width:0 !important}
#mrelated > div:first-of-type, #mremix > div:first-of-type, #mpost > div:first-of-type{height:120px;white-space:nowrap;box-sizing:border-box;padding: 0;}
#mrelated > div:first-of-type > a, #mremix > div:first-of-type > i, #mpost > div:first-of-type > a{display: inline-block;position: relative;width: 300px;height: 120px;margin: 0 5px;text-align: left;white-space: normal;padding: 10px;box-sizing: border-box;border-radius: 4px;background:#e6ab3f;box-shadow: 0 0 10px rgba(0,0,0,.1);cursor:pointer}
#mrelated > div:first-of-type > a:last-of-type, #mremix > div:first-of-type > i:last-of-type, #mpost > div:first-of-type > a:last-of-type{margin-right:15px}
#mrelated a b, #mremix i b, #mpost a b{display: inline-block;box-sizing: border-box;padding: 10px 15px 10px 15px;color: #FFFFFF;font-size: 20px;line-height: 26px;font-weight: normal;position: absolute;overflow:hidden;font-style:normal;max-height:101px}
#mremix i b{padding-top:7px;}
#mremix i b .member{margin-top:8px;color:#FFFFFF}
#mremix i b div{font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:160px;line-height:20px}
#mrelated a img, #mremix i img{max-height: 100px;max-width: 100px;float:left;background: #C9C7C8;border-radius: 3px;}
#mremix .bluebutton, #mpost .bluebutton{width:100px;margin:15px 15px 0 5px;position:sticky;left:5px}
#mremix .bluebutton::after{content: 'Remix'}
#mpost .bluebutton::after{content: 'Add Post'}
#mremix .bluebutton i::before{content: 'W'}
#mremix .viewall, #mpost .viewall{display:inline-block;position:sticky;left:10px;color:#FFFFFF;cursor:pointer;margin-top:20px}
#mremix .bluebutton + .viewall, #mpost .bluebutton + .viewall{left:140px;}
#mremix .viewall::before, #mpost .viewall::before{content: 'View All ' attr(data-count)}
#col2 #mremix .viewall, #col2 #mpost .viewall{margin-top:15px;font-size:15px;color:#FFFFFF}
#mpost .member{position:absolute;right:15px;bottom:10px;margin:0;color:#FFFFFF}

@media screen and (min-width: 501px) {
  #mrelated, #mremix, #mpost{background:#FFFFFF;padding:0;margin:0;width:auto;overflow:hidden;height:auto;contain:content}
  #col2 #mrelated, #col2 #mremix, #col2 #mpost{margin-top:0;}
  #mrelated > div:first-of-type, #mremix > div:first-of-type, #mpost > div:first-of-type{height:auto;white-space:normal;display:grid}
  #mrelated > div:first-of-type > a, #mremix > div:first-of-type > i, #mpost > div:first-of-type > a{display: flex;flex-wrap:wrap;width: auto;height: auto;padding: 10px 0;;margin:0;background:#FFFFFF;box-shadow:none}
  #mpost > div:first-of-type > a{display:block}
  #col1 #mpost > div > a{display:block}
  #mrelated a b, #mremix i b, #mpost a b{display: inline-block;color: #3285A7;position:relative;max-height:none;font-size:15px;line-height:20px;padding:10px 0;}
  #mremix i b{padding-top:0;}
  #mpost a b{padding:0;}
  #mrelated a img, #mremix i img{max-height: 100px;max-width: 70px;border-radius: 0px;align-self: flex-start;margin:0 15px 0 0}
  #mremix i img{margin:0 15px 10px 0}
  #mremix i .member, #mremix i b .member, #mpost a b .member{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px;color:#3285A7}
  #mremix i b div{white-space:normal;width:auto}
  #mremix .bluebutton, #mpost .bluebutton{position:relative;left:auto;margin-top:10px}
  #mremix .viewall, #mpost .viewall{position:relative;color:#3285A7;left:auto}
  #mremix .bluebutton + .viewall, #mpost .bluebutton + .viewall{left:auto}
  #col2 #mremix .viewall, #col2 #mpost .viewall{font-size:15px;color:#3285A7;margin-top:10px}
  #mpost .member{position:relative;right:auto;bottom:auto;color:#3285A7;margin:5px 0 0 0}
}

@media screen and (min-width: 801px) {
  #mrelated > div:first-of-type > a, #mremix > div:first-of-type > i{flex-wrap:nowrap;}
  #mremix i img{margin:0 15px 0 0}
}

/****** GLOBAL MODIFICATIONS ******/

/*Glyph classes*/
.g, .h3 i, h3 i, h3 em, h3 b, .i > i span, .i > blockquote span::first-letter, .i > blockquote span i, .i > blockquote::first-letter, .i div.description span, .fg::first-letter, .i > blockquote i, .i .comment i, .orangebutton span, #search span, #links #memberlinks a, .bluebutton i, #footercontainer .social a, #msearch, #mmenu, #crumbs i, .logo i, .loading div, .expert > b::first-letter, .listgrid a span.trend::first-letter, .listgrid a span.feat::first-letter, *[g]{
	font-family: 'icons';
	line-height: 1;
	font-weight:normal;
	font-style:normal;

	/* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
}
*[g]::before{content: attr(g)}

/* Transition Elements */
.graybutton, .orangebutton, .bluebutton, #col1 .i > i::first-letter{-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
transition: all 0.3s ease;}

.notransition{-webkit-transition: none !important;-moz-transition: none !important;-o-transition: none !important;-ms-transition: none !important;transition: none !important}

/* Modifiers */
.noborder{border:0 !important}
.activeform{background:#F5F5F5;cursor:auto}
.nohoveropacity:hover{cursor:pointer;opacity:1}
.cvvisible{content-visibility:visible !important;}

/* Animation */
.rotatex90 {transform:rotateX(90deg)}
.rotatey-90 {transform:rotateY(-90deg);-webkit-transition: all 2s ease;-moz-transition: all 2s ease;-o-transition: all 2s ease;-ms-transition: all 2s ease;transition: all 2s ease;}
.rotatey0 {transform:rotateY(0deg);-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease;-ms-transition: all 0.6s ease;transition: all 0.6s ease}
.rotatey90 {transform:rotateY(90deg)}
.rotatey180 {transform:rotateY(180deg)}
.rotatey360 {transform:rotateY(360deg);-webkit-transition: all 2s ease;-moz-transition: all 2s ease;-o-transition: all 2s ease;-ms-transition: all 2s ease;transition: all 2s ease;}
.rotate360continuous{-webkit-animation-name: playbutton; /* Chrome, Safari, Opera */
  -webkit-animation-timing-function: linear;
	-webkit-animation-name: playbutton;
	-webkit-animation-duration: 5s;
	-webkit-animation-iteration-count: 100;
	animation-timing-function: linear;
  animation-name: playbutton;
  animation-duration: 5s;
	animation-iteration-count: 100;-webkit-transition: 0;-moz-transition: 0;-o-transition: 0;-ms-transition: 0;transition: 0;}
	
@-webkit-keyframes playbutton { /* Chrome, Safari, Opera */
  0%   {transform:rotateY(0deg);}
	50%   {transform:rotateY(360deg);}
  100% {transform:rotateY(0deg);}
}

@keyframes playbutton { /* Standard syntax */
  0%   {transform:rotateY(0deg);}
	50%   {transform:rotateY(360deg);}
  100% {transform:rotateY(0deg);}
}

div.loading{padding:0 0 0 30px;position:relative;line-height:32px;color:#888485}

div.loading div:nth-of-type(1) {font-size:20px;color: #e3a129;position:absolute;top:0;left:0;
  -webkit-animation-name: loading; /* Chrome, Safari, Opera */
  -webkit-animation-duration: 4s; /* Chrome, Safari, Opera */
	-webkit-animation-iteration-count: 100;
	-webkit-animation-timing-function: linear;
  animation-name: loading;
  animation-duration: 3s;
	animation-iteration-count: 100;
	animation-timing-function: linear;
}
div.loading div:nth-of-type(2) {font-size:6px;color: #4d4d46;position:absolute;top:23px;left:0;}
div.loading div:nth-of-type(1)::before{content: '\0036'}
div.loading div:nth-of-type(2)::before{content: '\0035'}

/* Chrome, Safari, Opera */
@-webkit-keyframes loading {
	20% {transform:rotatez(0deg) rotatey(0deg);}
	40% {color:#e3a129}
	40.1% {color:#EFC77A}
	60% {transform:rotatez(180deg) rotatey(180deg);}
	80% {color:#EFC77A}
	80.1% {color:#e3a129}
	100% {transform:rotatez(360deg) rotatey(360deg);}
}

/* Standard syntax */
@keyframes loading {
	20% {transform:rotatez(0deg) rotatey(0deg);}
	40% {color:#e3a129}
	40.1% {color:#EFC77A}
	60% {transform:rotatez(180deg) rotatey(180deg);}
	80% {color:#EFC77A}
	80.1% {color:#e3a129}
	100% {transform:rotatez(360deg) rotatey(360deg);}
}
