#category-container{background-color:#e8e8e6; padding:1px 0px 30px 0px; width:90%; margin:10px auto 40px auto;
box-shadow:0 3px 5px rgba(0, 0, 0, 0.5),
inset  -3px -3px 3px rgba(55, 55, 55, 0.75), inset  3px 3px 3px  rgba(55, 55, 55,  0.75);
}
.categoryTbl{margin:20px 0px}
.category-title{text-align:left; background-color:#3b5998; color:#e2e2e0; font-weight:900; padding:7px 10px;
font-size:18px; width:100%; cursor:pointer; letter-spacing:1px;
text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #5c3f52;
box-shadow:0 5px 5px rgba(0, 0, 0, 0.5);
 }

.category-title:before{content:"\0025bc\00a0";text-shadow:none}

.categoryShown{background-color:#0084bd; color:#fafafa; 
text-shadow:   0 1px 0 #1d1d1c, 
               0 2px 0 #333,
               0 3px 0 #222,
               0 4px 0 #212121,
               0 5px 0 #121212;}
.categoryShown:before{content:"\0025b2\00a0"; font-size:18px;}
.category-wrapper{ padding:5px;display:none; margin:1px auto; margin:2px 10px; width:95%; margin:2px auto;
box-shadow:inset  -1px 0px 3px rgba(25, 25, 25, 0.8), inset  1px 1px 3px  rgba(25, 25, 25,  0.8); background-color:#9b9c9d
}
.category-wrapper table{border:0px solid !important; width:98% !important; margin:8px auto;}
.category-wrapper table tr td{padding:5px 10px !important;font-size:14px; background-color:#fff;
border:0px solid;
-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4), 0px -1px 2px rgba(0, 0, 0, 0.4)}

.category-wrapper table tr td input{width:90%; margin-left:2px; padding:2px 5px; font-size:14px}
.category-wrapper table tr td:nth-child(1){ font-weight:600;} 
.category-wrapper table tr td:nth-child(3){color:#333; font-style:italic; font-weight:bold;} 

#category-container .categoryTbl:nth-child(1) .category-wrapper{display:block;}

.ribbon {
	display:table;
 position: relative;
 margin-left:-20px;
 padding-right:27px;
}

.ribbon:before {
 left: -2em;
 border-right-width: 1.5em;
 border-left-color: transparent;
}
.ribbon:after {
 right: -2em;
 border-left-width: 1.5em;
 border-right-color: transparent;
}
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
 content: "";
 position: absolute;
 display: block;
 border-style: solid;
 border-color: #3d3d4d transparent transparent transparent;
 bottom: -1em;
}
.ribbon .ribbon-content:before {
 left: 0;
 border-width: 1em 0 0 1em;
}
.ribbon .ribbon-content:after {
 right: 0;
 border-width: 1em 1em 0 0;
}


.ribbon2 {
	display:table;
 position: relative;
 margin-left:-20px;
 margin-top:30px;
 padding-right:27px;
 cursor:default
}

.ribbon2:before {
 left: -2em;
 border-right-width: 1.5em;
 border-left-color: transparent;
}
.ribbon2:after {
 right: -2em;
 border-left-width: 1.5em;
 border-right-color: transparent;

}


.ribbon2 .ribbon-content2:before, .ribbon2 .ribbon-content2:after, .ribbon-content2 span:after {
 content:"";
 position: absolute;
 display: block;
 border-style: solid;
 border-color: #40404f transparent transparent transparent;
 bottom: -1em;
}

.ribbon2 .ribbon-content2:before, .ribbon-content2 span:before {
  left: 0;
 border-width: 1em 0 0 1em;
} 

.ribbon-content2:before{}
 
.ribbon2 .ribbon-content2:after, .ribbon-content2 span:after {
  
 left:10 !important;
 right:-17px;
 border-width: 1em 1em 0 0;
 top:0px;
 border-color:#0084bd transparent transparent transparent;
 

}

.ribbon-content2 span:after {top:0px; right:-35px; -webkit-transform:rotate(-90deg)}