@import url('https://fonts.googleapis.com/css2?family=Fira+Sans&family=Roboto:wght@300;400;700&display=swap');
/*
font-family: 'Fira Sans', sans-serif;
font-family: 'Roboto', sans-serif;
*/


/* -- GLOBAL STYLES -- */

html,
body {
    margin: 0 auto;
    padding: 0;
    font-family: Arial, sans-serif;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    text-align: center;
    vertical-align: top;
    background-color: #101010;
    color: #ffffff;
}
html {
    background-image:  url("../images/html-background.gif");
    background-position: 0 0;
    background-repeat:  repeat;
}
body {
    background-color:  transparent;
    background-image: none;
    background-position: center center;
    background-repeat: repeat;
    background-size: 450px;
    background-attachment: fixed;
    padding-bottom:  10px;
}
div, p, ul, ol,
h1, h2, h3, h4, h5, h6 {
    display: block;
    box-sizing: border-box;
    margin: 0 auto;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Fira Sans', sans-serif;
}
p, ul, ol {
    margin-bottom: 15px;
}
p:last-child,
ul:last-child,
ol:last-child {
    margin-bottom: 0;
}
a {
    color: inherit;
    text-decoration: none;
}
p a {
    color: inherit;
    text-decoration: underline;
}
img {
    border: 0 none transparent;
    box-sizing: border-box;
}
hr {
    display: block;
    margin: 20px auto;
    background-color: transparent;
    border: 0 none transparent;
    height: 1px;
    border-top: 1px solid #b92f77;
}
hr {
    border-color: transparent;
}
pre {
    display:  block;
    padding:  10px;
    text-align:  left;
    font-family:  "Courier New";
    font-size:  12px;
    line-height:  1.6;
    border:  1px dotted #dedede;
    background-color:  #ffffff;
}

input[type="text"],
input[type="password"],
input[type="file"],
input[type="number"],
input[type="email"],
input[type="date"],
input[type="time"],
input[type="datetime"],
input[type="color"],
input[type="tel"],
textarea {
    display:  inline-block;
    box-sizing:  border-box;
    width:  auto;
    max-width:  100%;
    border:  1px solid #dedede;
    padding:  6px;
    font-size:  100%;
    line-height:  1;
}
select {
    display:  inline-block;
    box-sizing:  border-box;
    width:  auto;
    max-width:  100%;
    border:  1px solid #dedede;
    padding:  6px;
    font-size:  92%;
    line-height:  1;
}
input[readonly],
select[readonly],
textarea[readonly] {
    opacity:  0.6;
    cursor:  not-allowed;
    pointer-events:  none;
}
input[type="text"],
input[type="password"],
input[type="file"],
input[type="number"],
input[type="email"],
input[type="date"],
input[type="time"],
input[type="datetime"],
input[type="color"],
input[type="tel"],
select,
textarea,
button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}


/* -- BASIC STUCTURE -- */

.wrapper {
    display: block;
    position: relative;
}
.wrapper:after {
    content: "";
    display: block;
    clear: both;
}

body > .website {
    background-color: transparent;
    color: #090909;
    width: 90%;
    width: calc(100% - 60px);
    min-width: 320px;
    max-width: 1024px;
    border-style: solid;
    border-width: 0;
    border-color: #551918;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    border-radius:  0 0 3px 3px;
    overflow:  hidden;
}
.website .header,
.website .navbar,
.website .footer,
.website .content {
    position: relative;
}
.website .header {
    z-index: 3;
}
.website .navbar {
    z-index: 2;
}
.website .footer {
    z-index: 2;
}
.website .content {
    z-index: 1;
}

.website .header {
    background-color: #b92f77;
    /* border-bottom: 2px solid #c0f4ec; */
    border-bottom: 0 none transparent;
    color: #ffffff;
    text-shadow: 1px 1px 0 #551918;
}
.website .header > .wrapper {
    height: 125px;
    padding: 20px;
    z-index: 2;
    overflow: hidden;
}

.website .navbar {
    background-color: #252525;
    border-top: 1px solid #353535;
    border-bottom: 1px solid #151515;
    border-color: #202020;
    color: #ffffff;
    text-shadow: 1px 1px 0 #551918;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.website .navbar > .wrapper {
    min-height: 45px;
    padding: 0;
    z-index: 2;
    overflow: hidden;
}

.website .footer {
    background-color: #262626;
    border-top: 1px solid #060606;
    color: #ffffff;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
}
.website .footer .wrapper {
    height: 75px;
    padding: 20px;
    z-index: 2;
}

.website .footer .subtext {
    bottom:  auto;
    top:  10px;
}

.website .header:before,
.website .footer:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    pointer-events: none;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.1+100 */
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#1a000000',GradientType=0 ); /* IE6-9 */
}
.website .header:before {
    opacity: 0.4;
    /* background-image:  url(../images/header-banner.png); */
    background-image:  url(../images/header-banner.jpg);
    background-size: 100% auto;
    background-size: cover;
    background-position: 0 0;
    background-repeat: no-repeat;
}

.website .content {
    min-height: 600px;
    min-height: calc(100vh - 255px - 6px);
    background-color: #fefefe;
    background-image: url(../images/paper-texture.jpg);
    background-position: center top;
    background-repeat: repeat;
    transition:  none;
}
.website .content:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.4;
    pointer-events: none;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f3f3f3+0,ffffff+10,ffffff+90,ededed+99 */
    background: rgb(243,243,243); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(243,243,243,1) 0%, rgba(255,255,255,1) 10%, rgba(255,255,255,1) 90%, rgba(237,237,237,1) 99%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(243,243,243,1) 0%,rgba(255,255,255,1) 10%,rgba(255,255,255,1) 90%,rgba(237,237,237,1) 99%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(243,243,243,1) 0%,rgba(255,255,255,1) 10%,rgba(255,255,255,1) 90%,rgba(237,237,237,1) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f3f3', endColorstr='#ededed',GradientType=1 ); /* IE6-9 */
}
.website .content > .wrapper {
    padding: 20px 40px 60px;
    z-index: 2;
}


/* -- HEADER STYLES -- */

.website .header .title-block {
    display: block;
    text-align: left;
    position: absolute;
    z-index: 10;
    top: 20px;
    left: 20px;
    text-transform: none;
    font-size: 300%;
    text-shadow: 2px 2px 0 #551918;
}
.website .header .title-block .name,
.website .header .title-block .subname {
    display:  block;
    margin: 0 auto;
    line-height: 1.3;
    white-space:  nowrap;
}
.website .header .title-block .name {
    font-size: 100%;
    /* letter-spacing: 0.1em; */
}
.website .header .title-block .subname {
    font-size: 60%;
}

.website .header .title-block .name .icon,
.website .header .title-block .subname .icon {
    display:  inline-block;
    font-size:  100%;
    line-height:  1;
    min-width:  1em;
}

.website .header .title-block .name .icon {
    width:  50px;
    height:  auto;
    vertical-align: bottom;
    position: relative;
    bottom: 5px;
}


/* -- Common Theme Mods -- */

.website .header .title-block .name .icon i {
    display:  none;
}
.website .header .title-block .name .icon {
    width:  50px;
    width:  1.25em;
    height:  auto;
    vertical-align: bottom;
    position: relative;
    bottom: 5px;
}
.website .header .title-block .name .icon:before {
    content:  "";
    display:  block;
    width:  100%;
    height:  0;
    padding-bottom:  calc(100% * (100 / 100));
    background-image:  none;
    background-size:  100% auto;
    background-size:  contain;
    background-repeat: no-repeat;
}

/* -- Bacon and Egg Theme -- */

/*
.website .header .title-block .name .icon {
    width:  50px;
    width:  1.25em;
    height:  auto;
    vertical-align: bottom;
    position: relative;
    bottom: 5px;
}
.website .header .title-block .name .icon:before {
    padding-bottom:  calc(100% * (206 / 180));
    background-image:  url(../images/header-icon.png);
}
*/


/* -- Lily of the Valley Theme -- */

/*
.website .header .title-block .name .icon {
    width:  50px;
    width:  1.25em;
    height:  auto;
    vertical-align: bottom;
    position: relative;
    bottom: 5px;
}
.website .header .title-block .name .icon:before {
    padding-bottom:  calc(100% * (111 / 94));
    background-image:  url(../images/header-icon_lily-of-valley.png);
}
*/

/* -- Maple Leaf Theme -- */

.website .header .title-block .name .icon {
    bottom: 2px;
    left: 2px;
}
.website .header .title-block .name .icon:before {
    padding-bottom:  calc(100% * (80 / 80));
    background-image:  url(../images/header-icon_maple-leaf.png);
}


.website .header .address-block {
    display: block;
    text-align: right;
    position: absolute;
    z-index: 9;
    top: 20px;
    right: 20px;
    font-size: 100%;
    letter-spacing: 1px;
    font-weight: normal;
}
.website .header .address-block .row {
    display: block;
    margin: 0 auto;
}

.website .header .contact-block {
    display: block;
    text-align: left;
    position: absolute;
    z-index: 8;
    bottom: 20px;
    left: 20px;
    font-size: 100%;
}
.website .header .contact-block h3 {
    font-size: 110%;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: inherit;
    font-weight: normal;
}
.website .header .contact-block .method {
    display: inline-block;
    font-size: 100%;
    background-color: #ff7977;
    border: 1px solid #e96664;
    border-radius: 6px;
    padding: 3px 9px;
    margin: 0 3px 3px 0;
    color: inherit;
    transform: translate(0, 0);
    transition: background-color 0.3s, transform 0.3s;
}
.website .header .contact-block .method:hover {
    background-color: #ff9a98;
    transform: translate(0, -2px);
}
.website .header .contact-block .method > i {
    margin-right: 4px;
}
.website .header .contact-block .method > strong {
    display: inline-block;
    font-weight: normal;
}
.website .header .contact-block .method.disabled {
    opacity:  0.4;
    cursor:  default;
    pointer-events:  none;
}
.website .header .contact-block .method.disabled:hover {
    background-color: #ff7977;
    transform: none;
}

.website .header .social-block {
    display: block;
    text-align: right;
    position: absolute;
    z-index: 7;
    bottom: 20px;
    right: 20px;
}
.website .header .social-block:after {
    content: "";
    display: block;
    clear: both;
}
.website .header .social-block .link {
    display: block;
    float: right;
    font-size: 22px;
    width: auto;
    height: auto;
    overflow: hidden;
    padding: 2px;
    margin: 0 0 0 5px;
    transform: translate(0, 0);
    transition: transform 0.3s;
}
.website .header .social-block .link:hover {
    transform: translate(0, -2px);
}
.website .header .social-block .link:before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    width: 32px;
    height: 32px;
    background-color: #ff7977;
    border: 1px solid #e96664;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}
.website .header .social-block .link i {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.website .header .image {
    display: block;
    position: absolute;
    bottom: -40px;
    right: 120px;
    z-index: 6;
    width: 50%;
    max-width: 686px;
    pointer-events: none;
}
.website .header .image img {
    display: block;
    width: 100%;
    height: auto;
}

.website .header .wrench-icon {
    display: block;
    position: absolute;
    pointer-events: none;
    z-index: 1;
    top: 10px;
    left: 10px;
    width: 300px;
    height: 300px;
    background-image: none;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%;
    background-size: contain;
    opacity: 0.4;
    transform: scale(1, 1);
    transition: transform 0.3s;

    display:  none;
}
.website .header:hover .wrench-icon {
    transform: scale(1.2, 1.2);
}


/* -- NAVBAR STYLES -- */

.website .navbar ul.pages {
    display: block;
    margin: 0 auto;
    padding: 0;
    list-style-type: none;
    text-align: left;
    font-size: 100%;
    line-height: 1;
}
.website .navbar ul.pages:after {
    content: "";
    display: block;
    clear: both;
}
.website .navbar ul.pages li.page {
    display: block;
    float: left;
    cursor: pointer;
    margin: 0 auto;
    padding: 0;
    list-style-type: none;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    background-color: rgba(255, 255, 255, 0.0);
    transition: background-color 0.3s;
}
/*
.website .navbar ul.pages li.page:first-child {
    border-left: 0 none transparent;
}
.website .navbar ul.pages li.page:last-child {
    border-right: 0 none transparent;
}
*/
.website .navbar ul.pages li.page .link {
    display: block;
    padding: 15px 30px 14px;
    text-decoration: none;
}
.website .navbar ul.pages li.page.active,
.website .navbar ul.pages li.page:hover {
    background-color: rgba(255, 255, 255, 0.1);
}
.website .navbar ul.pages li.page.active .link,
.website .navbar ul.pages li.page:hover .link {
    text-decoration: underline;
}

.website .navbar .navicon {
    display: none;
    float: left;
    clear: both;
    width: auto;
    height: 45px;
    line-height: 46px;
    text-align: left;
    font-size: 160%;
    padding: 0 20px;
    text-decoration: none;
    cursor: pointer;
}
.website .navbar .navicon i {
    transform: scale(1, 1);
    transition: transform 0.3s;
}
.website .navbar .navicon:hover i {
    transform: scale(1.1, 1.1);
}
.website .navbar .navicon strong {
    font-size: 60%;
    padding-left: 6px;
    position: relative;
    bottom: 3px;
    font-weight: normal;
}
.website .navbar .navicon strong.hide {
    display: none;
}
.website .navbar.expanded .navicon strong.show {
    display: none;
}
.website .navbar.expanded .navicon strong.hide {
    display: inline;
}

/* -- WELCOME BLOCK STYLES w/ USER INFO -- */

.website .user-info.welcome-block {
    display: block;
    position: absolute;
    bottom: 10px;
    right: 20px;
    z-index: 6;
    width: auto;
    height:  auto;
    font-size:  100%;
    line-height:  1.2;
    text-align:  right;
}
.website .user-info.welcome-block.has-avatar .wrapper {
    padding-right:  55px;
}
.website .user-info.welcome-block .avatar {
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 6;
    width: 50px;
    height:  50px;
    pointer-events: none;
    background-color:  rgba(255, 255, 255, 0.6);
    border-radius:  50%;
    box-shadow:  1px 1px 0 rgba(0, 0, 0, 0.2);
}
.website .user-info.welcome-block .avatar img {
    display: block;
    width: 100%;
    height: auto;
    position:  relative;
    z-index:  2;
}
.website .user-info.welcome-block .name,
.website .user-info.welcome-block .links {
    display: block;
    clear:  both;
    margin:  0 auto;
}
.website .user-info.welcome-block .name {
    font-size:  95%;
}
.website .user-info.welcome-block .links {
    font-size:  80%;
    opacity:  0.8;
}
.website .user-info.welcome-block .links .link {
    text-decoration: none;
}
.website .user-info.welcome-block .links .link:hover span {
    text-decoration: underline;
}
.website .user-info.welcome-block .links .link + .link:before {
    content: "|";
    padding: 0 6px 0 4px;
    opacity: 0.6;
}

.website .header .user-info.welcome-block {
    display:  block;
}
.website .navbar .user-info.welcome-block {
    display:  none;
}


/* -- FOOTER STYLES -- */

.website .footer .title-block {
    position: absolute;
    z-index: 1;
    text-align: left;
    top: 20px;
    left: 20px;
    font-size: 90%;
}
.website .footer .title-block .name,
.website .footer .title-block .subname {
    display: inline-block;
    font-size: 100%;
    line-height: 1;
    margin: 0 auto 5px 0;
    font-family: inherit;
}
.website .footer .title-block .name:after {
    content: " |";
    font-weight: normal;
    color: #686868;
    text-shadow: none;
    padding: 0 4px;
}

.website .footer .address-block {
    position: absolute;
    z-index: 2;
    text-align: left;
    top: 45px;
    left: 20px;
    font-size: 80%;
}
.website .footer .address-block .row {
    display: inline-block;
}
.website .footer .address-block .row:after {
    content: " |";
    font-weight: normal;
    color: #686868;
    padding: 0 4px;
    text-shadow: none;
}
.website .footer .address-block .row:last-child:after {
    content: "";
    display: none;
}

.website .footer .contact-block {
    position: absolute;
    z-index: 3;
    text-align: right;
    top: 20px;
    right: 20px;
    font-size: 80%;
}
.website .footer .contact-block .method > strong {
    display: none;
}
.website .footer .contact-block a {
    text-decoration: none;
    color: inherit;
    margin-left: 5px;
}
.website .footer .contact-block a:hover {
    color: #ffe9cc;
}
.website .footer .contact-block .by-phone {
    position: relative;
    right: 55px;
}

.website .footer .social-block {
    position: absolute;
    z-index: 4;
    text-align: left;
    top: 36px;
    right: 20px;
}
.website .footer .social-block:empty {
    display:  none;
}
.website .footer .social-block .link {
    display: inline-block;
    width: auto;
    height: auto;
    padding: 2px;
    margin: 0 3px 0 0;
}

.website .footer .sitemap-block {
    position: absolute;
    z-index: 5;
    text-align: left;
    bottom: 42px;
    left: 50%;
    transform: translate(-50%, 0);
    font-size: 75%;
    line-height: 1.2;
}
.website .footer .sitemap-block ul {
    text-align: inherit;
}
.website .footer .sitemap-block:after {
    content: "";
    display: block;
    clear: both;
}
.website .footer .sitemap-block .label {
    float: left;
    font-size: inherit;
    line-height: inherit;
    margin: 0 10px 0 0;
    display: none;
}
.website .footer .sitemap-block .label:after {
    content: ":";
}
.website .footer .sitemap-block .pages {
    float: left;
    font-size: inherit;
    line-height: inherit;
    padding: 0;
    list-style-type: none;
    white-space: nowrap;
}
.website .footer .sitemap-block .pages .page {
    display: inline-block;
    width: auto;
    margin: 0 10px 0 0;
}
.website .footer .sitemap-block .pages .page:after {
    content: "|";
    font-weight: normal;
    color: #686868;
    text-shadow: none;
    padding: 0 0 0 10px;
}
.website .footer .sitemap-block .pages .page:last-child:after {
    display: none;
}
.website .footer .sitemap-block .pages .page a {
    text-decoration: none;
}
.website .footer .sitemap-block .pages .page:hover,
.website .footer .sitemap-block .pages .page.active {

}
.website .footer .sitemap-block .pages .page:hover a,
.website .footer .sitemap-block .pages .page.active a {
    text-decoration: underline;
}

.website .footer .subtext {
    position: absolute;
    z-index: 6;
    text-align: center;
    bottom: 20px;
    left: 50%;
    transform: translate(-50%, 0);
    line-height: 1.6;
    font-size: 60%;
    color: #a0a0a0;
    white-space: nowrap;
}
.website .footer .subtext .copy-block,
.website .footer .subtext .credit-block {
    display: inline-block;
}
.website .footer .subtext .cache-block {
    display: block;
    opacity:  0.6;
    padding-top:  6px;
}
.website .footer .subtext .credit-block:before {
    content: "| ";
}
.website .footer .subtext .credit-block:before,
.website .footer .subtext .cache-block .pipe {
    font-weight: normal;
    color: #5a5a5a;
    padding: 0 6px;
    text-shadow: none;
}
.website .footer .subtext a {
    text-decoration: none;
    color: inherit;
}
.website .footer .subtext a:hover {
    color: #84e8db;
}

.website .footer .title-block,
.website .footer .address-block,
.website .footer .contact-block,
.website .footer .social-block {
    display:  none;
}


/* -- PAGE CONTENT STYLES -- */

.website .content h1,
.website .content h2,
.website .content h3,
.website .content h4,
.website .content h5,
.website .content h6 {
    text-align: left;
    margin: 0 auto 15px 0;
}
.website .content h1,
.website .content h2,
.website .content h3 {
    font-size: 160%;
}
.website .content h4,
.website .content h5,
.website .content h6 {
    font-size: 130%;
}
.website .content h1.list-header,
.website .content h2.list-header,
.website .content h3.list-header,
.website .content h4.list-header,
.website .content h5.list-header,
.website .content h6.list-header {
    text-decoration: underline;
}
.website .content h1 + h2,
.website .content h1 + h3,
.website .content h1 + h4,
.website .content h1 + h5,
.website .content h1 + h6,
.website .content h2 + h3,
.website .content h2 + h4,
.website .content h2 + h5,
.website .content h2 + h6,
.website .content h3 + h4,
.website .content h3 + h5,
.website .content h3 + h6,
.website .content h4 + h5,
.website .content h4 + h6,
.website .content h5 + h6 {
    margin-top: -15px;
}
.website .content p + h1,
.website .content p + h2,
.website .content p + h3,
.website .content p + h4,
.website .content p + h5,
.website .content p + h6 {
    margin-top: 20px;
}
.website .content p {
    font-size: 110%;
    text-align: left;
}
.website .content ul {
    font-size: 110%;
    text-align: left;
}
.website .content a {
    color: #ae2d70;
    text-decoration: underline;
    transition: color 0.3s;
}
.website .content a:hover {
    color: #b92f77;
}
.website .content img {
    max-width:  100%;
}
.website .content hr {
    display:  block;
    clear:  both;
}
.website .content hr.visible {
    border-color:  #dedede;
}


/* -- PAGE BREADCRUMB STYLES -- */

.website .breadcrumb {
    display:  block;
    margin:  0 auto;
    font-size:  80%;
}
.website .breadcrumb .wrapper {
    display:  block;
    margin:  0 auto;
    padding:  0 0 10px;
}
.website .breadcrumb ul {
    display:  block;
    list-style-type:  none;
    text-align:  left;
    margin:  0 auto;
    padding:  0;
}
.website .breadcrumb ul li {
    display:  inline-block;
    list-style-type:  none;
    margin:  0 9px 0 0;
    padding:  0;
}
.website .breadcrumb ul li:after {
    content:  "\0000bb";
    display:  inline-block;
    margin:  0 0 0 3px;
}
.website .breadcrumb ul li:last-child:after {
    content:  "";
    display:  none;
}


/* -- COMMON ANIMATION STYLES -- */

.fade-in {
    -webkit-animation: fadeIn ease 1s;
    -moz-animation: fadeIn ease 1s;
    -o-animation: fadeIn ease 1s;
    -ms-animation: fadeIn ease 1s;
    animation: fadeIn ease 1s;
}
@-moz-keyframes fadeIn { 0% {opacity:0;} 100% {opacity:1;} }
@-webkit-keyframes fadeIn { 0% {opacity:0;} 100% {opacity:1;} }
@-o-keyframes fadeIn { 0% {opacity:0;} 100% {opacity:1;} }
@-ms-keyframes fadeIn { 0% {opacity:0;} 100% {opacity:1;} }
@keyframes fadeIn { 0% {opacity:0;} 100% {opacity:1;} }


/* -- BUTTON STYLES -- */

.website .buttons {
    margin:  20px auto 0;
    font-size:  100%;
    line-height:  1.6;
}
.website .buttons .button {
    display:  inline-block;
    box-sizing:  border-box;
    margin:  0 3px 6px;
    padding:  6px 12px;
    border:  1px solid #090909;
    background-color:  #262626;
    color:  #fefefe;
    border-radius:  3px;
    text-decoration:  none;
    cursor:  pointer;
    font-size:  inherit;
    line-height:  inherit;
    text-align: center;
}
.website .buttons .button:hover {
    background-color:  #262626;
    color:  #fefefe;
}
.website .buttons .button strong,
.website .buttons .button em {
    display:  block;
    padding:  6px 12px;
    font-style: normal;
    font-size:  100%;
    line-height:  1;
}

.website .buttons .button.big-button strong {
    font-size:  120%;
    padding-bottom:  3px;
}
.website .buttons .button.big-button em {
    font-size:  80%;
    padding-top:  3px;
}

.website .buttons .button.sub-button strong,
.website .buttons .button.sub-button em {
    font-size:  80%;
}

.website .buttons .button.of2 { width:  calc((100% / 2) - 10px); }
.website .buttons .button.of3 { width:  calc((100% / 3) - 10px); }
.website .buttons .button.of4 { width:  calc((100% / 4) - 10px); }
.website .buttons .button.of5 { width:  calc((100% / 5) - 10px); }
.website .buttons .button.of6 { width:  calc((100% / 6) - 10px); }
.website .buttons .button.of7 { width:  calc((100% / 7) - 10px); }
.website .buttons .button.of8 { width:  calc((100% / 8) - 10px); }
.website .buttons .button.of9 { width:  calc((100% / 9) - 10px); }
.website .buttons .button.of10 { width:  calc((100% / 10) - 10px); }

.website .buttons .button.of2 > strong,
.website .buttons .button.of3 > strong,
.website .buttons .button.of4 > strong,
.website .buttons .button.of5 > strong,
.website .buttons .button.of6 > strong,
.website .buttons .button.of7 > strong,
.website .buttons .button.of8 > strong,
.website .buttons .button.of9 > strong,
.website .buttons .button.of10 > strong {
    padding-left: 0; padding-right: 0;
}


/* -- HOME CONTENT STYLES -- */

.website .home-photo {
    float: right;
    margin: 0 0 20px 20px;
    width: 33%;
    min-width: 150px;
    max-width: 300px;
    border: 0 none transparent;
    box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.3);
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.website .home-bullets {
    display: block;
    margin: 0 auto 20px;
    padding: 0;
}
.website .home-bullets li {
    padding: 0 0 0 30px;
    margin: 0 auto 15px 0;
    position: relative;
    overflow: visible;
    list-style-type: none;
}
.website .home-bullets li:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    background-color: transparent;
    background-image: url(../images/wrench-icon_small_aqua.png);
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
}
.website .home-bullets li h4 {
    font-size: 120%;
    line-height: 1;
    margin: 0 auto 5px 0;
}


/* -- MISC CONTENT STYLES -- */

.website .misc-bullets {
    display: block;
    margin: 0 auto 20px;
    padding: 0;
}
.website .misc-bullets li {
    padding: 0 0 0 30px;
    margin: 0 auto 15px 0;
    position: relative;
    overflow: visible;
    list-style-type: none;
}
.website .misc-bullets li:before {
    content: "\f0da";
    font-family: "FontAwesome";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
}
.website .misc-bullets li h4 {
    font-size: 120%;
    line-height: 1;
    margin: 0 auto 5px 0;
}

.website .hidden-upload-form,
.website .hidden-upload-frame {
    display: block;
    box-sizing:  border-box;
    margin: 10px auto;
    border:  1px dotted #dedede;
    background-color:  rgba(255, 255, 255, 0.2);
    padding:  20px;
}
.website .hidden-upload-form {
    margin-top:  20px;
}
.website .hidden-upload-form:after {
    content:  "";
    display:  block;
    clear:  both;
}
.website .hidden-upload-form input {
    float:  left;
    clear:  both;
    margin:  0 auto 5px 0;
}
.website .hidden-upload-frame {
    margin-bottom:  20px;
    width:  100%;
    min-height:  100px;
}
.website .hidden-upload-form,
.website .hidden-upload-frame {
    display: none;
}


/* -- STATUS MESSAGE STYLES -- */

.website .status-messages {
  display: block;
  margin: 0 auto 15px;
  padding: 0;
  list-style-type: none;
  list-style-image: none;
}
.website .status-messages .message {
  margin: 0 auto 5px;
  padding: 5px 5px 5px 28px;
  vertical-align: middle;
  text-align: left;
  font-size: 13px;
  line-height: 15px;
  color: #393636;
  background: #FFFFFF none scroll no-repeat 5px 5px;
  border: 1px solid #CBCBCB;
  border-radius: 0.5em;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.10);
  cursor: pointer;
}
.website .status-messages .message:hover {
  border-color: #ABABAB;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.15);
  background-position: 5px 4px;
}
.website .status-messages .message a,
.website .status-messages .message a:hover {
  color: #393636;
  text-decoration: underline;
}
.website .status-messages .status-error {
  color: #A30000;
  background-image: url(../images/messages/icon_error.png);
}
.website .status-messages .status-error a,
.website .status-messages .status-error a:hover {
  color: #A30000;
}
.website .status-messages .status-success {
  color: #49913D;
  background-image: url(../images/messages/icon_success.png);
}
.website .status-messages .status-success a,
.website .status-messages .status-success a:hover {
  color: #49913D;
}
.website .status-messages .status-notice {
  color: #C37C3D;
  background-image: url(../images/messages/icon_notice.png);
}
.website .status-messages .status-notice a,
.website .status-messages .status-notice a:hover {
  color: #C37C3D;
}
.website .status-messages .status-warning {
  color: #D38C1B;
  background-image: url(../images/messages/icon_warning.png);
}
.website .status-messages .status-warning a,
.website .status-messages .status-warning a:hover {
  color: #D38C1B;
}
.website .status-messages .status-loading {
  color: #798FA7;
  background-image: url(../images/messages/icon_loading.png);
}
.website .status-messages .status-loading a,
.website .status-messages .status-loading a:hover {
  color: #798FA7;
}
.website .status-messages .status-alert {
  color: #45739C;
  background-image: url(../images/messages/icon_alert.png);
}
.website .status-messages .status-alert a,
.website .status-messages .status-alert a:hover {
  color: #45739C;
}
.website .status-messages .status-default {
  color: #868686;
  background-image: url(../images/messages/icon_default.png);
}
.website .status-messages .status-default a,
.website .status-messages .status-default a:hover {
  color: #868686;
}
.website .status-messages .status-unknown {
  color: #868686;
  background-image: url(../images/messages/icon_unknown.png);
}
.website .status-messages .status-unknown a,
.website .status-messages .status-unknown a:hover {
  color: #868686;
}
.website .status-messages .status-options {
  color: #868686;
  background-image: url(../images/messages/icon_unknown.png);
}
.website .status-messages .status-options a,
.website .status-messages .status-options a:hover {
  color: #868686;
}


/* -- WEBSITE FORM STYLES -- */

.website .web-form {


}
.website .web-form .fhead,
.website .web-form .field,
.website .web-form .buttons {
    display:  block;
    width:  auto;
    min-width:  100px;
    margin:  0 10px 10px 0;
    padding:  0 10px 10px 0;
    text-align:  left;
    font-size:  100%;
    line-height:  1.6;
    float:  none;
    clear:  both;
}
.website .web-form .fhead:after,
.website .web-form .field:after,
.website .web-form .buttons:after {
    content:  "";
    display:  block;
    clear:  both;
}

.website .web-form .fhead {
    display:  block;
    margin:  0 auto 20px;
    padding:  12px;
    border:  1px solid #dedede;
    background-color:  #fefefe;
    color:  #292929;
    border-radius:  3px;
    text-decoration:  none;
    font-size:  inherit;
    line-height:  inherit;
}
.website .web-form .fhead h3,
.website .web-form .fhead h4 {
    margin:  0 auto;
    line-height:  1.2;
}
.website .web-form .fhead p {
    font-size:  80%;
}

.website .web-form .fhead + hr {
    display:  none;
}

.website .web-form .field {

}
.website .web-form .field.hidden {
    display: none;
}
.website .web-form .field.fullsize {
    clear:  both;
}
@media (min-width: 800px){
    .website .web-form .field:not(.fullsize) {
        margin-right:  40px;
        width:  calc((100% / 2) - 40px);
        float:  left;
        clear:  none;
    }
}
@media (max-width: 799px){
    .website .web-form .field {
        margin-right:  0;
        padding-right:  0;
    }
}

.website .web-form .field .label {
    display:  block;
    margin:  0 auto;
    float:  left;
    clear:  left;
    font-weight:  bold;
    position:  relative;
    font-size:  90%;
}
.website .web-form .field .label strong {
    display:  inline-block;
}
.website .web-form .field.required .label strong:after {
    content:  "*";
    color:  #c43331;
    margin-left:  4px;
}
.website .web-form .field .label em {
    display:  inline-block;
    margin-left:  4px;
    font-size:  80%;
    position:  relative;
    bottom:  6px;
    font-weight:  normal;
    font-style: normal;
    color:  #262626;
}
.website .web-form .field .label em:before {
    content:  "(";
}
.website .web-form .field .label em:after {
    content:  ")";
}

.website .web-form .field .info {
    display:  block;
    margin:  4px auto 0;
    float:  left;
    clear:  left;
    position:  relative;
    font-size:  75%;
    color:  #262626;
}
.website .web-form .field .info:before {
    content:  "?";
    display:  inline-block;
    margin-right:  3px;

    content:  "\f059";
    font-family: "Font Awesome 6 Pro";
    font-weight: 400;
}

.website .web-form .field .input {
    display:  block;
    margin:  5px auto 0;
    float:  left;
    clear:  left;
    width:  100%;
    min-height:  34px;
    position:  relative;
}
.website .web-form .field .input input[type="text"],
.website .web-form .field .input input[type="password"],
.website .web-form .field .input input[type="file"],
.website .web-form .field .input input[type="number"],
.website .web-form .field .input input[type="email"],
.website .web-form .field .input input[type="date"],
.website .web-form .field .input input[type="time"],
.website .web-form .field .input input[type="datetime"],
.website .web-form .field .input input[type="color"],
.website .web-form .field .input input[type="tel"],
.website .web-form .field .input textarea {
    display:  block;
    box-sizing:  border-box;
    width:  100%;
    max-width:  100%;
    border:  1px solid #dedede;
    padding:  6px;
    font-size:  100%;
    line-height:  1;
}
.website .web-form .field .input input[type="file"] {
    width:  auto;
}
.website .web-form .field .input select {
    display:  block;
    box-sizing:  border-box;
    width:  100%;
    max-width:  100%;
    border:  1px solid #dedede;
    padding:  6px;
    font-size:  92%;
    line-height:  1;
}
.website .web-form .field .input input[type="text"][disabled],
.website .web-form .field .input input[type="number"][disabled],
.website .web-form .field .input input[type="email"][disabled],
.website .web-form .field .input input[type="date"][disabled],
.website .web-form .field .input input[type="time"][disabled],
.website .web-form .field .input input[type="datetime"][disabled],
.website .web-form .field .input input[type="color"][disabled],
.website .web-form .field .input input[type="tel"][disabled],
.website .web-form .field .input textarea[disabled],
.website .web-form .field .input select[disabled] {
    opacity:  1;
    background-color:  rgba(255, 255, 255, 0.5);
    border-style:  dotted;
    color:  #696969;
}
.website .web-form .field .input input[type="text"][readonly],
.website .web-form .field .input input[type="number"][readonly],
.website .web-form .field .input input[type="email"][readonly],
.website .web-form .field .input input[type="date"][readonly],
.website .web-form .field .input input[type="time"][readonly],
.website .web-form .field .input input[type="datetime"][readonly],
.website .web-form .field .input input[type="color"][readonly],
.website .web-form .field .input input[type="tel"][readonly],
.website .web-form .field .input textarea[readonly],
.website .web-form .field .input select[readonly] {
    opacity:  1;
    background-color:  rgba(255, 255, 255, 0.5);
    border-style:  dotted;
    color:  #696969;
}
.website .web-form .field .input.hidden {
    display:  none;
}
.website .web-form .field .input.textbox {

}
.website .web-form .field .input.textbox.date,
.website .web-form .field .input.textbox.time {
    width:  auto;
}
.website .web-form .field .input.textbox.time {
    font-size:  80%;
}
.website .web-form .field .input.textbox.date + .input.textbox.time {
    float:  left;
    clear:  none;
    margin-left:  20px;
}
.website .web-form .field .input.textbox.date input[type="date"],
.website .web-form .field .input.textbox.time input[type="time"] {
    box-sizing:  content-box;
}
.website .web-form .field .input.textbox.currency {

}
.website .web-form .field .input.textbox.currency:before {
    content:  "$";
    display:  block;
    position:  absolute;
    left:  5px;
    top:  50%;
    transform:  translate(0, -50%);
    opacity:  0.3;
    transition:  opacity 0.3s;
}
.website .web-form .field .input.textbox.currency:hover:before {
    opacity:  0.6;
}
.website .web-form .field .input.textbox.currency input[type="number"] {
    padding-left:  20px;
}
.website .web-form .field .input.textarea {

}
.website .web-form .field .input.checkbox,
.website .web-form .field .input.radio {

}
.website .web-form .field .input.checkbox .checkwrap,
.website .web-form .field .input.radio .radiowrap {
    display:  inline-block
}
.website .web-form .field .input.checkbox .checkwrap strong,
.website .web-form .field .input.radio .radiowrap strong,
.website .web-form .field .input.checkbox .checkwrap input[type="checkbox"],
.website .web-form .field .input.radio .radiowrap input[type="radio"] {
    vertical-align: middle;
    text-align: left;
    margin:  0 auto;
}
.website .web-form .field .input.checkbox .checkwrap strong,
.website .web-form .field .input.radio .radiowrap strong {
    font-size:  80%;
    font-weight:  normal;
}
.website .web-form .field .input.checkbox .checkwrap input[type="checkbox"],
.website .web-form .field .input.radio .radiowrap input[type="radio"] {
    margin-right:  5px;
}
.website .web-form .field .input.dropdown {

}
.website .web-form .field .input.filebox {

}
.website .web-form .field .input.filebox.new {

}
.website .web-form .field .input.filebox.new + .label {
    margin-top:  20px;
}
.website .web-form .field .input.filebox.link {
    display:  block;
    font-size:  80%;
    line-height:  1.4;
    margin-top:  10px;
}
.website .web-form .field .input.filebox.link .details,
.website .web-form .field .input.filebox.link .actions {
    display:  block;
    float:  left;
    border:  1px solid transparent;
    background-color:  transparent;
    color:  inherit;
    font-weight:  normal;
    text-decoration: none;
    padding:  4px;
    border-radius:  3px;
    position:  relative;
}
.website .web-form .field .input.filebox.link .details {
    z-index:  1;
    min-width:  200px;
    border-color:  #7e73af;
    background-color:  #7e73af;
    color:  #ffffff;
    padding-left:  34px;
    padding-right:  54px;
    opacity:  1.0;
    transition:  transform 0.3s;
}
.website .web-form .field .input.filebox.link .details:before {
    content:  "";
    display:  block;
    position:  absolute;
    top:  6px;
    bottom:  6px;
    left:  26px;
    border-right:  1px solid rgba(255, 255, 255, 0.1);
}
.website .web-form .field .input.filebox.link a.details:hover {
    background-color:  #887db5;
}
.website .web-form .field .input.filebox.link .details > i {
    position:  absolute;
    left:  7px;
    top:  50%;
    transform: translate(0, -50%);
    font-size:  80%;
    opacity:  0.8;
}
.website .web-form .field .input.filebox.link .details .name,
.website .web-form .field .input.filebox.link .details .mtime,
.website .web-form .field .input.filebox.link .details .size {
    display:  block;
    float:  left;
}
.website .web-form .field .input.filebox.link .details .name {
    float:  none;
    clear:  both;
    font-size:  110%;
    line-height:  1.2;
    margin-bottom:  1px;
    text-decoration: none;
}
.website .web-form .field .input.filebox.link .details .mtime,
.website .web-form .field .input.filebox.link .details .size {
    display: block;
    float: left;
    margin-right: 10px;
    font-size: 80%;
    opacity: 0.6;
}
.website .web-form .field .input.filebox.link .actions {
    z-index:  2;
    font-size: 140%;
    color:  inherit;
}
.website .web-form .field .input.filebox.link .actions .link {
    display:  inline-block;
    margin:  0 0 10px 10px;
    color:  inherit;
    opacity:  0.6;
    transition: 0.3s;
    cursor:  pointer;
}
.website .web-form .field .input.filebox.link .actions .link:hover {
    opacity:  1.0;
}
.website .web-form .field .input.filebox.link .actions .link i {
    display:  inline-block;
    color:  inherit;
}
.website .web-form .field .input.filebox.link .actions .link i.alt {
    display:  none;
}
.website .web-form .field .input.filebox.link:after,
.website .web-form .field .input.filebox.link .details:after,
.website .web-form .field .input.filebox.link .actions:after {
    content:  "";
    display:  block;
    clear:  both;
}
.website .web-form .field .input.filebox.link .actions .link.delete {
    color:  #ac3b39;;
}
.website .web-form .field .input.filebox.link .actions .link.delete:hover {
    color:  #b9302e;;
}
.website .web-form .field .input.filebox.link.pending-delete .details {
    opacity:  0.3;
    pointer-events:  none;
    background-color: #ac3b39;
    border-color: #8f2524;
}
.website .web-form .field .input.filebox.link.pending-delete .details .name {
    text-decoration: line-through;
}
.website .web-form .field .input.filebox.link.pending-delete .actions .link.delete {
    color:  #696969;
}
.website .web-form .field .input.filebox.link.pending-delete .actions .link.delete {
    color:  #797979;
}
.website .web-form .field .input.filebox.link.pending-delete .actions .link.delete i.base {
    display:  none;
}
.website .web-form .field .input.filebox.link.pending-delete .actions .link.delete i.alt {
    display:  inline-block;
}


.website .web-form .field.has-info + .field .input {
    min-height:  58px;
}
@media (max-width: 800px){
    .website .web-form .field.has-info + .field .input {
        min-height:  34px;
    }
}


.website .web-form .field.has-stack {

}
.website .web-form .field.has-stack + .field {

}
.website .web-form .field.has-stack.stack-size-2 .input,
.website .web-form .field.has-stack.stack-size-2 + .field .input {
    min-height:  68px;
}
.website .web-form .field.has-stack.stack-size-3 .input,
.website .web-form .field.has-stack.stack-size-3 + .field .input {
    min-height:  102px;
}
@media (max-width: 800px){
    .website .web-form .field.has-stack.stack-size-2 .input,
    .website .web-form .field.has-stack.stack-size-2 + .field .input,
    .website .web-form .field.has-stack.stack-size-3 .input,
    .website .web-form .field.has-stack.stack-size-3 + .field .input {
        min-height:  34px;
    }
}

.website .web-form .buttons {
    clear:  both;
    margin:  0 auto 20px;
    padding:  30px 0 0;
    font-size:  110%;
    line-height:  1.6;
}
.website .web-form .buttons br {
    display:  none;
}
.website .web-form .buttons .button {
    display:  inline-block;
    padding:  6px 12px;
    border:  1px solid #090909;
    background-color:  #262626;
    color:  #fefefe;
    border-radius:  3px;
    text-decoration:  none;
    cursor:  pointer;
    font-size:  inherit;
    line-height:  inherit;
}
.website .web-form .buttons .button:hover {
    background-color:  #262626;
    color:  #fefefe;
}

.website .web-form .buttons .button.create,
.website .web-form .buttons .button.submit {
    background-color: #278a27;
    border-color: #1c631c;
}
.website .web-form .buttons .button.create:hover,
.website .web-form .buttons .button.submit:hover {
    background-color: #2b972b;
}

.website .web-form .buttons .button.delete,
.website .web-form .buttons .button.cancel {
    background-color: #ac3b39;
    border-color: #8f2524;
}
.website .web-form .buttons .button.delete:hover,
.website .web-form .buttons .button.cancel:hover {
    background-color: #b9302e;
}

.website .web-form .buttons .meta {
    display:  block;
    margin:  10px auto 0;
    padding:  0 5px 0;
    font-size:  60%;
    line-height:  1.6;
    color:  #969696;
}
.website .web-form .buttons .meta + .meta {
    margin-top:  0;
}


/* -- WEBSITE FILTER STYLES -- */

.website .web-filter {
    display:  block;
    margin:  0 auto 20px;
    padding:  0;
    font-size:  80%;
    line-height: 1.6;
}

.website .web-filter .group {
    display:  block;
}
.website .web-filter .group.overview-buttons,
.website .web-filter .group.dropdown-counter {
    margin:  0 auto;
}
.website .web-filter .group.overview-buttons {
    float:  right;
    text-align: right;
    min-width:  150px;
}
.website .web-filter .group.dropdown-counter {
    float:  left;
    text-align: left;
    min-width:  175px;
}

.website .web-filter .overview,
.website .web-filter .buttons,
.website .web-filter .dropdown,
.website .web-filter .counter {
    display:  block;
    float:  none;
    clear:  both;
    width:  auto;
    margin:  0 auto 5px;
}

.website .web-filter .overview {
    border:  1px solid #dedede;
    background-color:  #fefefe;
    padding:  6px 12px;
    font-size:  100%;
    line-height: 1.6;
    border-radius:  6px;
}
.website .web-filter .overview .total {
    display:  block;
    font-weight:  bold;
}
.website .web-filter .overview .total.main {
    font-size:  150%;
}
.website .web-filter .overview .total.other {
    font-size:  110%;
}
.website .web-filter .overview .total .label {
    display:  block;
    float:  left;
    padding-right:  20px;
    line-height:  1.6;
}
.website .web-filter .overview .total .value {
    display:  inline-block;
}
.website .web-filter .overview .total .value i {
    display:  inline;
    font-style: normal;
    padding-right:  2px;
}
.website .web-filter .overview .total .value .positive {
    color:  #0c7f21;
}
.website .web-filter .overview .total .value .negative {
    color:  #b9302e;
}
.website .web-filter .overview .total.other .value .positive {
    color:  #509f5f;
}
.website .web-filter .overview .total.other .value .negative {
    color:  #c98382;
}

.website .web-filter .dropdown {
    width:  100%;
    border:  1px solid #dedede;
    background-color:  #fefefe;
    border-radius: 6px;
    color:  #090909;
    font-size:  100%;
    line-height:  1;
    padding:  6px 12px;
    font-size:  125%;
}

.website .web-filter .counter {
    padding: 3px 12px;
    border: 1px dotted #dedede;
    background-color: #fefefe;
    border-radius: 6px;
    font-size: 100%;
    line-height:  1.6;
    font-weight:  normal;
    color: #696969;
}
.website .web-filter .counter strong {
    font-weight:  inherit;
}

.website .web-filter .buttons {
    margin-bottom:  0;
    padding-bottom:  0;
    font-size:  100%;
    line-height: 1.6;
    border-radius:  6px;
    text-align: right;
}
.website .web-filter .buttons:after {
    content:  "";
    display:  block;
    clear:  both;
}
.website .web-filter .buttons .button {
    display:  inline-block;
    padding:  3px 6px;
    margin:  0 0 3px 6px;
    border:  1px solid #090909;
    background-color:  #262626;
    color:  #fefefe;
    border-radius:  3px;
    text-decoration:  none;
}
.website .web-filter .buttons .button:hover {
    color:  #fefefe;
}
.website .web-filter .buttons .button strong,
.website .web-filter .buttons .button em {
    display:  inline-block;
    padding:  0 6px;
    font-style: normal;
    font-size:  100%;
    line-height:  1;
}
.website .web-filter .buttons .button.has-icon {
    padding-left:  2em;
    position:  relative;
}
.website .web-filter .buttons .button.has-icon i,
.website .web-filter .buttons .button.has-icon strong {
    display:  inline-block;
}
.website .web-filter .buttons .button.has-icon i {
    position:  absolute;
    left:  0.75em;
    top:  50%;
    transform:  translate(0, -50%);
}
.website .web-filter .buttons .button.new {
    background-color: #278a27;
    border-color: #1c631c;
}
.website .web-filter .buttons .button.new:hover {
    background-color: #2c9b2c;
}

@media (max-width:  374px){
    .website .web-filter .group.overview-buttons,
    .website .web-filter .group.dropdown-counter {
        float:  none;
        clear:  both;
        width:  100%;
        height:  auto;
    }
    .website .web-filter .overview,
    .website .web-filter .buttons,
    .website .web-filter .dropdown,
    .website .web-filter .counter {
        margin-bottom:  5px;
    }
    .website .web-filter .buttons,
    .website .web-filter .dropdown,
    .website .web-filter .counter {
        text-align: center;
    }
    .website .web-filter .buttons .button:only-child {
        display:  block;
        margin:  0 auto;
    }
}


/* -- WEBSITE TABLE STYLES -- */

.website .web-table {
    font-size:  80%;
    line-height:  1.6;
    text-align:  left;
}
.website .web-table table.table {
    border:  1px solid #dedede;
    background-color:  #ffffff;
    font-size:  inherit;
    line-height:  inherit;
    text-align:  inherit;
    width:  100%;
    max-width:  100%;
    overflow:  hidden;
    table-layout:  fixed;
    border-collapse: collapse;
    border-spacing: 0;
}
.website .web-table table.table thead th,
.website .web-table table.table tfoot td,
.website .web-table table.table tbody td {
    vertical-align: middle;
    padding:  8px;
}
.website .web-table table.table thead,
.website .web-table table.table thead th,
.website .web-table table.table tfoot,
.website .web-table table.table tfoot td {
    background-color:  #404040;
    color:  #ffffff;
}
.website .web-table table.table tfoot td {
    padding-top:  4px;
    padding-bottom:  4px;
    font-size:  80%;
}
.website .web-table table.table tbody tr:nth-child(even),
.website .web-table table.table tbody tr:nth-child(even) td {
    background-color:  #fafafa;
}
.website .web-table table.table tbody tr:nth-child(odd),
.website .web-table table.table tbody tr:nth-child(odd) td {
    background-color:  #f5f5f5;
}
.website .web-table table.table tbody td > .value {
    display:  inline-block;
    white-space:  nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width:  100%;
    position:  relative;
}
.website .web-table table.table tbody td > .value .raw {
    display:  none;
}


.website .web-table .col[data-col].is_date > .value .raw {

}
.website .web-table .col[data-col].is_date > .value .raw span:after {
    content:  "/";
    display:  inline;
}
.website .web-table .col[data-col].is_date > .value .raw span:last-child:after {
    content:  "";
    display:  none;
}

.website .web-table .col[data-col].is_id {
    text-align:  left;
}

.website .web-table .col[data-col].is_name {
    text-align:  left;
    font-weight:  bold;
}
.website .web-table .col[data-col].is_name a {
    text-decoration:  underline;
}
.website .web-table .col[data-col].is_name a sup,
.website .web-table .col[data-col].is_name a sub {
    display:  inline;
    font-size:  inherit;
    line-height:  inherit;
    position:  static;
    vertical-align: inherit;
}
.website .web-table .col[data-col].is_name .value i {
    display: inline;
    line-height: inherit;
    position: relative;
    bottom: -2px;
    vertical-align: inherit;
    text-decoration: none;
    font-size: 80%;
    color: #969696;
    float: right;
    margin-left: 6px;
}

.website .web-table .col[data-col].is_date,
.website .web-table .col[data-col].is_flag {
    text-align:  center;
}

.website .web-table .col[data-col].is_timestamp {

}

.website .web-table .col[data-col].is_decimal,
.website .web-table .col[data-col].is_currency {
    text-align:  right;
}
.website .web-table .col[data-col].is_currency i {
    display:  inline;
    font-style: normal;
    padding-right:  2px;
}
.website .web-table .col[data-col].is_currency .positive {
    color:  #0c7f21;
}
.website .web-table .col[data-col].is_currency .negative {
    color:  #b9302e;
}
.website .web-table .col[data-col].is_currency.is_other_currency .positive {
    color:  #509f5f;
}
.website .web-table .col[data-col].is_currency.is_other_currency .negative {
    color:  #c98382;
}

.website .web-table .col[data-col="actions"] {
    text-align:  right;
}

.website .web-table .actions {
    display:  block;
    margin:  0 0 0 auto;
    padding:  0;
    white-space:  nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display:  block;
}
.website .web-table .actions .link {
    display:  inline-block;
    margin-left:  9px;
    text-decoration: none;
    cursor:  pointer;
}
.website .web-table .actions .link.disabled {
    cursor:  not-allowed;
    opacity:  0.3;
}
.website .web-table .actions .link i {
    display:  inline-block;
    min-width:  1em;
    text-align:  center;
}
.website .web-table .actions .link strong {
    display:  inline-block;
}
.website .web-table .actions .link i + strong {
    margin-left:  3px;
}
.website .web-table .actions .link,
.website .web-table .actions .link:hover {
    text-decoration: none;
}
.website .web-table .actions .link:hover strong {
    text-decoration: underline;
}

.website .web-table .actions .link.edit {
    color: #336ba3;
}
.website .web-table .actions .link.edit:hover {
    color: #256bb1;
}

.website .web-table .actions .link.delete {
    color: #b9302e;
}
.website .web-table .actions .link.delete:hover {
    color: #b92f77;
}


/* -- MISC STYLES -- */

.website .content .auth-text {
    display:  block;
    margin:  0 auto;
    padding:  50px auto;
    font-size:  100%;
    line-height:  1.6;
}


/* -- POPUP WINDOW STYLES -- */


.website .popup-overlay {
    display: none;
    box-sizing: border-box;
    position: absolute;
    z-index: 9998;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: black;
    background-color: rgba(0, 0, 0, 0.6);
}
.website .popup-overlay.visible {
    display: block;
}
.website .popup-overlay .popup-wrapper {
    display: block;
    box-sizing: border-box;
    position: absolute;
    z-index: 9999;
    top: 50px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 800px;
    height: 800px;
    max-width: 90vw;
    max-height: 90vh;
    background-color: #ae2d70;
    border: 1px solid #b92f77;
    box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2);
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}
.website .popup-overlay .popup-body {
    display: block;
    box-sizing: border-box;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 28px 7px 7px;
}
.website .popup-overlay .popup-body:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    left: 2px;
    top: 2px;
    right: 2px;
    height: 27px;
    background-color: #551918;
    border-radius: 3px 3px 0 0;
}
.website .popup-overlay .popup-body > .button {
    display: block;
    position: absolute;
    cursor: pointer;
    z-index: 3;
    top: 5px;
    font-size: 140%;
    line-height: 1;
    color: #fefefe;
    opacity: 0.5;
    transition: opacity 0.3s;
}
.website .popup-overlay .popup-body > .button:hover {
    opacity: 1.0;
    color: #ffffff;
}

.website .popup-overlay .popup-content {
    display: block;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    width: 100%;
    height: auto;
    min-height: 100%;
    max-height: 100%;
    overflow: auto;
    padding: 10px;
    color: #ffffff;
    font-size: 100%;
    line-height: 1.6;
}
.website .popup-overlay .popup-content img.fullsize {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    border: 1px solid #b92f77;
    border-radius: 6px;
}

.website .popup-overlay .popup-body > .button.close {
    right: 5px;
}

.website .popup-overlay .popup-body.has-prev,
.website .popup-overlay .popup-body.has-next {
    padding-left: 21px;
    padding-right: 21px;
}
.website .popup-overlay .popup-body > .button.prev,
.website .popup-overlay .popup-body > .button.next {
    top: 50%;
    display: none;
}
.website .popup-overlay .popup-body.has-prev > .button.prev,
.website .popup-overlay .popup-body.has-next > .button.next {
    display: block;
}
.website .popup-overlay .popup-body > .button.prev {
    left: 4px;
    right: auto;
}
.website .popup-overlay .popup-body > .button.next {
    left: auto;
    right: 4px;
}

.website .popup-overlay .popup-wrapper.photo-mode {
    width: auto;
    height: auto;
    max-height: none;
}

.website .popup-overlay .popup-content .page,
.website .popup-overlay .popup-content .body,
.website .popup-overlay .popup-content .subbody {
    display: block;
    margin: 0 auto;
    padding: 0;
}

/* width */
.website .popup-overlay ::-webkit-scrollbar { width: 10px; }
/* button */
.website .popup-overlay ::-webkit-scrollbar-button { background: #2f4765; }
/* Handle */
.website .popup-overlay ::-webkit-scrollbar-thumb { background: #365172; }
/* Handle on hover */
.website .popup-overlay ::-webkit-scrollbar-thumb:hover { background: #3b587d; }
/* Track */
.website .popup-overlay ::-webkit-scrollbar-track { background: #23354d; }
/* The track NOT covered by the handle. */
.website .popup-overlay ::-webkit-scrollbar-track-piece { background: #23354d; }
/* Corner */
.website .popup-overlay ::-webkit-scrollbar-corner { background: #435f84; }
/* Resizer */
.website .popup-overlay ::-webkit-resizer { background: #283d57; }