.user-content {
     font-weight: 300;
     font-size: 17px;
     line-height:28px;
     letter-spacing: 0.01em;
     color: #5e5250;
}
 .user-content div {
     clear:both;
}
 .user-content p, .user-content ul, .user-content ol {
     margin-bottom:10px;
}
 .user-content h2, .user-content h3, .user-content h4, .user-content h5, .user-content h6 {
     margin-top:40px;
     color: #392f2b;
}
 .user-content h2 {
     font-weight:700;
     font-size:32px;
     text-transform:uppercase;
     letter-spacing:0.02em;
     margin-bottom:22px;
}
 .user-content h3 {
     font-weight:700;
     font-size:28px;
     letter-spacing:0.01em;
     margin-bottom:22px;
}
 .user-content h4 {
     font-weight:700;
     font-size:24px;
     letter-spacing:0.01em;
     margin-bottom:17px;
}
 .user-content strong, .user-content b {
     font-weight: 700;
}
 .user-content em, .user-content i {
     font-weight: 700;
     font-style: italic;
}
 .user-content a {
     color:#006197 !important;
     text-decoration: underline;
}
 .user-content a:hover {
     color:#002f6c !important;
}
 .user-content ul li {
     display:block;
     position:relative;
     margin-left: 32px;
     text-indent:-2px;
}
 .user-content ul li:before {
     content: "";
     position:absolute;
     left:-14px;
     top:12px;
     width:5px;
     height:5px;
     background-color:#aba19b;
}
 .user-content ol {
     counter-reset: list;
}
 .user-content ol li {
     counter-increment: list;
     display:block;
     position:relative;
     margin-left: 32px;
     text-indent:-20px;
}
 .user-content ol li:before {
     content: counter(list) ") ";
     font-weight: 700;
}
 .user-content table {
     margin-bottom:41px;
}
/* The table has margin by default, so that the margin shows up in the editor. In the live site, the margin should go on the wrapper ( added by js ) instead. */
 .user-content .wr-wr-table {
     position:relative;
     margin-bottom:41px;
}
 .user-content .wr-wr-table table {
     margin-bottom:0;
}
 .user-content .wr-table {
     position:relative;
     width:100%;
     overflow:hidden;
     overflow-x:scroll;
}
 .user-content .wr-wr-table:after {
     content:"";
     display:block;
     position:absolute;
     top:0;
     bottom:0;
     right:0;
     z-index: 1;
     width:30px;
     background:linear-gradient(to left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0));
}
 .user-content .wr-wr-table:before {
     content:"";
     display:block;
     position:absolute;
     top:0;
     bottom:0;
     left:0;
     z-index: 1;
     width:30px;
     background:linear-gradient(to right, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0));
}
 .user-content .wr-wr-table.left-maxed:before {
     opacity:0;
}
 .user-content .wr-wr-table.right-maxed:after {
     opacity:0;
}
 .user-content .wr-table .ps-scrollbar-x-rail {
     opacity:0.6;
     z-index: 2;
}
 .user-content .collapsible-content.last-pane {
     margin-bottom:40px;
}
 .user-content .collapse-title {
     display:block;
     font-size:18px;
     font-weight:700;
     line-height:20px;
     letter-spacing:0.01em;
     color:#847976;
     text-transform: none;
     padding:20px 180px 10px 0;
     cursor:pointer;
     border-bottom:1px solid #d7d1cc;
     position:relative;
     margin:0;
}
 .user-content .collapse-title * {
     margin:0;
     padding:0;
}
 .user-content .collapse-title .icon {
     text-transform: uppercase;
     position:absolute;
     bottom:10px;
     right:0;
     color:#6CACE4 !important;
     font-size:14px;
}
 @media screen and (max-width: 480px) {
     .user-content .collapse-title {
         padding-right:0;
    }
     .user-content .collapse-title .icon {
         position:static;
         display:block;
         margin-top:12px;
    }
}
 .user-content .collapse-title .icon.min {
     display:none;
}
 .user-content .collapsible-content.open > .collapse-title .icon.max {
     display:none;
}
 .user-content .collapsible-content.open > .collapse-title .icon.min {
     display:block;
}
 .user-content .collapse-title .icon.max:after {
     content:" " "\f055";
     font-family: "FontAwesome";
     font-size: 18px;
}
 .user-content .collapse-title .icon.min:after {
     content:" " "\f056";
     font-family: "FontAwesome";
     font-size: 18px;
}
 .user-content .collapsible-content > .content {
     overflow: hidden;
}
 .user-content .collapse-content-style {
     color:#4C4342;
     font-weight:500;
     font-size: 16px;
     line-height: 24px;
     letter-spacing: 0.010em;
     background-color: #efebe7;
     padding:20px;
}
 .WebPartContent .user-content .collapse-title:after {
     content:"SHOW LESS " "\f056";
     position:absolute;
     bottom:10px;
     right:0;
     color:#6CACE4;
     font-family: "FontAwesome";
     font-size: 18px;
}
 .user-content table th, td {
     padding: 15px 15px;
     line-height:18px;
     letter-spacing:0.02em;
}
 .user-content table td {
     font-size:13px;
     font-weight:300;
}
 .user-content table th {
     background-color:#002f6c;
     color:white;
     text-align:left;
     font-size: 14px;
     font-weight: 700;
     white-space: nowrap;
}
 .user-content table tr {
     border-left:1px solid #efebe7;
     border-right:1px solid #efebe7;
}
 .user-content table thead tr {
     background-color:#ad172b;
     color:white;
     border:1px solid #ad172b;
}
 .user-content table tr:nth-child(odd){
     background-color:#efebe7;
     color:#5e5250;
}
 .user-content table tr:nth-child(even){
     background-color:#ffffff;
     color:#5e5250;
}
 .user-content table tr:last-child {
     font-weight: bold;
     border-bottom: 1px solid #efebe7;
}
 .user-content .wr-video {
     float:right;
     max-width:364px;
     width:100%;
     margin-left:12px;
}
 .user-content .wr-video-in {
     position:relative;
     width:100%;
     height:0;
     padding-bottom:66.67%;
}
 .user-content .wr-video iframe {
     position:absolute;
     top:0;
     left:0;
     width:100%;
     height:100%;
}
 .user-content a.action-button {
     position: relative;
     display: inline-block;
     padding: 18px 70px 18px 18px;
     color: white !important;
     background: #006197;
     font-weight: 500;
     font-size: 25px;
     line-height: 25px;
     text-decoration: none;
}
 .user-content a.action-button:after {
     content: "\f138";
     position: absolute;
     top: 50%;
     right: 0;
     display: block;
     width: 70px;
     text-align: center;
     font-family: "FontAwesome";
     font-size: 24px;
     line-height: 1em;
     margin-top: -0.5em;
}
 .user-content a.action-button:hover {
     background-color:#002f6c;
     color: white;
}
 .user-content img {
     max-width:100%;
     height:auto !important 
    /* Override inline styles. Otherwise image will swuish when max-width is encountered */
}
 .user-content .image-with-caption {
     overflow:hidden;
     margin-bottom:20px;
     max-width:100%;
}
 .user-content .image-with-caption[style*="float:left"], .user-content .image-with-caption[style*="float: left"] {
     margin-right:20px;
}
 .user-content .image-with-caption[style*="float:right"], .user-content .image-with-caption[style*="float: right"] {
     margin-left:20px;
}
 .user-content .wr-image-caption {
     width:100%;
     margin:0 auto;
}
 .user-content .image-caption {
     background:#f0ebe8;
     width:100%;
     padding:20px;
     float:left;
     font-size:14px;
     font-weight:700;
     letter-spacing:0;
     line-height:18px;
}
 @media screen and (max-width:650px) {
     .user-content img, .user-content .image-with-caption, .user-content .image-caption {
         float:none !important;
         display:block;
         margin:0 auto;
    }
}
 @media screen and (max-width:500px) {
     .user-content h2, .user-content h3, .user-content h4, .user-content h5, .user-content h6 {
         margin-top:20px;
    }
}
