/*******************************************************************************
    Reset
*******************************************************************************/
*{
    margin: 0;
    padding: 0;
    line-height: normal;
}

html, body{
    height: 100%;
}

body {
    overflow: -moz-scrollbars-vertical;
    overflow-y: scroll;
    overflow-x: auto;
}

img{ display: block; }
ul{ list-style: none; }
a{ text-decoration: none; }

a img{border:none;}

button::-moz-focus-inner {
    border:0;
    padding:0;
}

::-ms-clear { display: none; }

/*******************************************************************************
    Font sizes
*******************************************************************************/
.fs-xs{ font-size:8px; }
.fs-s{ font-size:11px; }
.fs-sm{ font-size:12px; }
.fs-m{ font-size:13px; }
.fs-ml{ font-size:14px; }
.fs-l{ font-size:15px; }
.fs-xl{ font-size:18px; }
.fs-xxl{ font-size:24px; }
.fs-xxxl{ font-size:30px; }

/*******************************************************************************
    Line Heights
*******************************************************************************/
.lh-xs{ line-height: 18px; }
.lh-s{ line-height: 20px; }
.lh-sm{ line-height: 30px; }
.lh-m{ line-height: 35px; }
.lh-ml{ line-height: 40px; }
.lh-l{ line-height: 50px; }
.lh-xl{ line-height: 60px; }

/*******************************************************************************
    Thumb Size
*******************************************************************************/
.thumb-xs {
    width:20px;
    height:20px;
    border-radius:20px;
}

.thumb-m {
    width:30px;
    height:30px;
    border-radius:30px;
}

.thumb-l {
    width:40px;
    height:40px;
    border-radius:40px;
}

.thumb-xl {
    width:150px;
    height:150px;
    border-radius:150px;
}

/*******************************************************************************
    Font styles
*******************************************************************************/
p, span, a, label, button, h1, h2, h3, h4, h5, h6, li, input, textarea, select, abbr{
    font-family: 'Roboto', sans-serif;
}

.style-bold{ font-weight: 700; }
.style-normal{ font-weight: 400; }
.style-uppercase{ text-transform: uppercase; }
.style-lowercase{ text-transform: lowercase; }
.style-center{ text-align: center; }
.style-underlined{ text-decoration: underline; }
.style-strikethrough{ text-decoration: line-through; }

.style-right{
    text-align: right;
    padding: 0 5px 0 0;
}

.style-left{ text-align: left; }

/*******************************************************************************
    Font Colors
*******************************************************************************/
.color-primary{ color: #e43227; }
.color-secondary{ color: #a3b1bf; }
.color-grey{ color: #999999; }
.color-grey-2{ color: #a3b1bf; }
.color-white{ color: #ffffff; }
.color-black{ color: #222222; }

/*******************************************************************************
    Backgrounds
*******************************************************************************/
.bg-primary{ background-color: #e43227; }
.bg-secondary{ background-color: #a3b1bf }
.bg-white{ background-color: #ffffff; }
.bg-black{ background-color: #222222; }
.bg-grey-1{ background-color: #f2f2f2; }
.bg-grey-2{ background-color: #fafafa; }
.bg-grey-3{ background-color: #e5e5e5; }
.bg-grey-4{ background-color: #a3b1bf; }
.bg-green{ background-color: #77cc66; }
.bg-red{ background-color: #e65c5c; }
.bg-pink{ background-color: #e116; }
.bg-none{ background-color: transparent; }

/*******************************************************************************
    Notification & Error Colors
*******************************************************************************/
.color-success{ color: #77cc66; }
.color-info{ color: #a3b1bf; }
.color-warning{ color: #e5c52f; }
.color-error{ color: #e65c5c; }
.bg-success{ background-color: #77cc66; }
.bg-info{ background-color: #a3b1bf; }
.bg-warning{ background-color: #e5c52f; }
.bg-error{ background-color: #e65c5c; }

.cursor-help {
    cursor:help;
}

.cursor-pointer {
    cursor:pointer;
}

.circle-notification {
    border-radius: 50%;
    width: 22px;
    height: 22px;
    background: none;
    border: 2px solid #fff;
    margin-top:12px;
}

#notification-section{
    padding: 0;
    height: 50px;
    position: fixed;
    right: 0px;
    left: 260px;
    top: 60px;
    z-index: 10;
}

.notification-bar {
    height: 50px;
    position:relative;
}

.notification-bar-inner {
    padding-left:60px;
    padding-right:40px;
}

.error-page-bar {
    height: 50px;
    position:relative;
    padding-left:15px;
    padding-right:15px;
    margin-bottom:25px;
}

#notification-close {
    cursor:pointer;
}

#notification-close:hover {
    opacity:0.8;
}

/*******************************************************************************
    Test Top Bar
*******************************************************************************/
#test-flag + #wrapper > #top-section,
#test-flag + #wrapper > .login-content-image {
    top:50px !important;
}

#test-flag + #wrapper > #show-left-section-button,
#test-flag + #wrapper > #left-section,
#test-flag + #wrapper > #notification-section,
#test-flag + #wrapper > #tool-section,
#test-flag + #wrapper > #filter-section,
#test-flag + #wrapper > #show-filter-button {
    top:110px !important;
}

#test-flag + #wrapper > #right-section {
    top:260px !important;
}

#test-flag + #wrapper > #main-section {
    padding-top:250px !important;
}

#test-flag + #login-section {
    top:50px !important;
}

#test-flag{
    width: 100%;
    height:50px;
    background-color: #ff003c;
    position:fixed;
    top:0;
    z-index:50;
}

#test-flag>p{
    font-size:20px;
    line-height:50px;
    letter-spacing: 0.02em;
}

/*******************************************************************************
    Hover
*******************************************************************************/
.hv-bg-primary:hover{ background-color: #e43227; }
.hv-bg-secondary:hover{ background-color: #a3b1bf; }
.hv-bg-green:hover{ background-color: #77cc66; }
.hv-bg-red:hover{ background-color: #e63428; }
.hv-bg-grey:hover{ background-color: #fafafa; }
.hv-bg-grey-2:hover{ background-color: #f2f2f2; }

.hv-color-black:hover{ color: #222222; }
.hv-color-secondary:hover{ color: #a3b1bf; }
.hv-color-primary:hover{ color: #e43227; }
.hv-color-green:hover{ color: #77cc66; }

.hv-no-underline:hover{ text-decoration: none; }
.hv-underline:hover{ text-decoration: underline; }

/*******************************************************************************
    Helpers
*******************************************************************************/
.box{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.left{ float: left; }
.right{ float: right; }

.inline-icon{ padding: 0 5px 0 0; }
.overflow{ overflow: hidden; }
.no-wrap{ white-space: nowrap; }

.horizontal-divider{
    width: 100%;
    height: 1px;
}

.coma-seperated:after{ content: ', '; }
.coma-seperated:last-child:after{ content: ''; }

.top-margin-5{ margin-top: 5px; }
.top-margin{ margin-top: 10px; }
.top-margin-20{ margin-top: 20px; }
.top-margin-30{ margin-top: 30px; }
.top-margin-50{ margin-top: 50px; }
.bottom-margin{ margin-bottom: 10px; }
.left-margin{ margin-left: 10px; }
.right-margin-20{ margin-right: 20px; }

.right-padding{ padding-right: 10px; }
.left-padding{ padding-left: 10px; }
.top-padding{ padding-top: 10px; }
.top-padding-s{ padding-top: 5px; }
.padding-10{ padding: 10px; }

.block{ display: block; }
.inline-block{ display: inline-block; }
.hidden{ display: none; }

/*******************************************************************************
    Global Site Elements
*******************************************************************************/
#wrapper{
    min-height: 100%;
    position: relative;
    padding: 0 0 60px 0;
}

#top-section{
    position: fixed;
    height: 60px;
    right: 0;
    top: 0;
    left: 0;
    padding: 0 0 0 20px;
    z-index: 50;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    min-width: 1280px;
}

#left-section{
    width: 259px;
    position: fixed;
    left: 0;
    top: 60px;
    bottom: 0;
    border-right: 1px solid #e5e5e5;
    z-index: 25;
}


#right-section{
    position: fixed;
    right: 60px;
    top: 210px;
    width: 275px;
}

#tool-section{
    padding: 50px 50px 0 0;
    height: 112px;
    position: fixed;
    right: 0;
    left: 320px;
    top: 60px;
    z-index: 5;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    min-width: 960px;
}

#main-section{
    padding: 200px 60px 50px 320px;
    min-height: 100%;
    min-width: 1280px;
}

#bottom-section{
    border-top: 1px solid #e5e5e5;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 260px;
    padding: 0 20px;
    z-index: 5;
}

#filter-section{
    position: fixed;
    right: -275px;
    top: 60px;
    bottom: 0px;
    width: 260px;
    z-index: 25;
    -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
    -moz-box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
    overflow-y: scroll;
    transition: all .25s ease;
}
#filter-section.open {
    right: -15px;
}
#filter-section label {
    display: inline-block;
}

/*******************************************************************************
    History
*******************************************************************************/
.history-title{
    border-bottom:1px solid #e5e5e5;
    padding-top:20px;
    padding-bottom:20px;
}

.event{
    padding-top:15px;
    padding-bottom:15px;
    border-bottom:1px solid #e5e5e5;
    min-height: 40px;
}

.event-text {
    margin-left:50px;
}

.event-text del {
    color:#e65c5c;
}

.event-text ins {
    color:#77cc66;
}

.event-logo{
    margin: 0 10px 0 0;
}

.event-profile-pic-small {
    margin: 5px 0 0 0;
}

.event-user-name{
    padding: 0 10px 0 0;
    margin: 0 10px 0 0;
    border-right: 1px solid #e5e5e5;
}

.event-horizontal-divider{
    margin: 10px 0 10px 0;
}

.event-mutation-seperator {
    height:3px;
    width:15px;
    margin-top:10px;
    margin-bottom:10px;
    margin-left:50px;
}

.event-left-margin {
    margin-left:50px;
}

/*******************************************************************************
    Login Section
*******************************************************************************/

.login-wrapper {
    overflow: hidden;
    min-height: 5px;
    height: 100%;
}

#login-section{
    height: 100%;
    position: relative;
    z-index: 1;
    float: left;
    width: 400px;
    overflow: hidden;
    min-height: 700px;
    box-shadow: 0 0 20px #181818;
}

#login-top{
    padding: 45px 0 65px 39px;
    position: relative;
    margin: 0 0 100px 0;
}

#login-triangle{
    border-style: solid;
    border-width: 40px;
    border-color: #f2f2f2 transparent transparent #f2f2f2;
    position: absolute;
    left: 40px;
    bottom: -40px;
    width: 0;
    height: 0;
}

#login-main{
    padding: 0 40px 0 40px;
    margin-bottom:60px;
}

.login-info{
    height:80px;
}

.login-info div{
    margin-top:25px;
}

#login-bottom{
    padding: 0 40px 0 40px;
    border-top: 1px solid #e5e5e5;
    position: fixed;
    bottom: 0;
    width: 400px;
    background-color:#ffffff;
}

#login-image{
    height:100%;
    width:100%;
    background-repeat:no-repeat;
    background-size:cover;
    background-position: center center;
    display: none;
}

.login-content-wrapper{
    float: left;
    width: 100%;
    height:100%;
}

.login-content-left{
    float: left;
    width: 400px;
    height: 100%;
    min-height:100%;
}

.login-content-image{
    display: block;
    float: none;
    min-height: 700px;
    height: 100%;
    -webkit-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left;
    overflow: hidden;
}

.login-content-image > img {
    width: 100%;
    height: auto;
}

/*******************************************************************************
    Top Section
*******************************************************************************/
.logo-holder{
    width: 240px;
    position: relative;
}

.logo{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 25px;
}

.top-navigation-link-holder{
    position: relative;
}

.top-navigation-link-triangle{
    width: 0;
    height: 0;
    border-width: 5px;
    border-color: transparent transparent #ffffff transparent;
    border-style: solid;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    display: none;
}

.top-navigation-link-profile-triangle{
    width: 0;
    height: 0;
    border-width: 5px;
    border-color: transparent transparent #ffffff transparent;
    border-style: solid;
    position: absolute;
    bottom: 0;
    right: 22px;
}

.user-options-triangle {
    width: 0;
    height: 0;
    border-width: 5px;
    border-color: transparent transparent #a3b1bf transparent;
    border-style: solid;
    position: absolute;
    bottom: 0;
    right: 22px;
    display:none;
}

.top-navigation-link-holder:hover .top-navigation-link-triangle,
.top-navigation-link-holder.active .top-navigation-link-triangle{
    display: block;
}

.top-navigation-link{
    padding: 0 20px;
    opacity: 0.8;
    display: block;
}

.top-navigation-link-holder:hover .top-navigation-link,
.top-navigation-link-holder.active .top-navigation-link{
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.1);
}

.user-profile-picture{
    position: absolute;
    left: 0;
    top: 15px;
}

.user-info-holder{
    position: relative;
    padding: 0 20px 0 50px;
}

.user-options-menu-point {
    padding-left: 15px;
    padding-right: 20px;
    border-bottom: 1px solid #e5e5e5;
}

.user-info:hover .user-options-menu,
.user-info:hover .user-options-triangle{
    display:block;
}

.user-options-menu {
    width:200px;
    position:absolute;
    right:0px;
    top:60px;
}

.impersonation-holder{
    position: relative;
    padding: 0 20px 0 50px;
}

.impersonation-options-menu-point {
    padding-left: 15px;
    padding-right: 20px;
    border-bottom: 1px solid #e5e5e5;
}

.impersonation-info:hover .impersonation-options-menu,
.impersonation-info:hover .impersonation-options-triangle{
    display:block;
}

.impersonation-options-menu {
    width:200px;
    position:absolute;
    right:0px;
    top:60px;
}

/*******************************************************************************
    Left Section
*******************************************************************************/
#show-left-section-button{
    position: fixed;
    left: 0;
    top: 60px;
    padding: 0;
    width: 34px;
    z-index: 25;
}

.side-section-title-holder{
    padding: 0 0 0 20px;
    height: 50px;
    border-bottom: 1px solid #e5e5e5;
}

.side-section-toggle{
    width: 34px;
    border-left: 1px solid #e5e5e5;
    height: 100%;
    cursor: pointer;
}

.left-navigation-link-holder{
    padding: 0 0 0 20px;
    width: 260px;
}

.left-navigation-link-holder:hover{
    border-right: 1px solid #e5e5e5;
}

.left-navigation-link-holder.active,
.left-navigation-link-holder.active:hover{
    background-color: #a3b1bf;
    border-right: 3px solid #6c7680;
}

.left-navigation-link{
    padding: 15px 21px 15px 0;
    display: block;
    border-bottom: 1px solid #e5e5e5;
}

.left-navigation-link-holder.active .left-navigation-link{
    border-bottom: none
}

.left-navigation-link-holder.active .left-navigation-menu-title,
.left-navigation-link-holder.active .left-navigation-menu-description{
    color: #ffffff;
}

.help-link-holder{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border-top: 1px solid #e5e5e5;
    padding: 0 0 0 30px;
}

/*******************************************************************************
    Right Section
*******************************************************************************/
.status{
    width: 100%;
    padding: 0 0 0 20px;
    position: relative;
    height: 90px;
}

.status-bullet-point{
    width: 40px;
    height: 40px;
    border-radius: 40px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    background-color: #2ab5f7;
    padding: 10px 0 10px 0;
}

.status-inner{
    padding: 15px 0 15px 33px;
    border-left: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
}

.status:last-child .status-inner{
    border-bottom: none;
}
/*******************************************************************************
    Tool Section
*******************************************************************************/
.tool-section-row{
    height: 62px;
    border-bottom: 1px solid #e5e5e5;
}

.tool-section-title-holder{
    padding: 12px 0 0 0;
}

.tool-section-title{
    padding: 0 20px 0 0;
    margin: 0 20px 0 0;
    border-right: 1px solid #e5e5e5;
}

.button-row{
    height: 67px;
}

/*******************************************************************************
    Filter Section
*******************************************************************************/
#show-filter-button{
    position: fixed;
    right: 0;
    top: 59px;
    padding: 0;
    width: 40px;
    z-index: 25;
}

#filter-form{
    padding: 0 20px 0 20px;
}

#filter-form .checkbox-label{
    display: block;
}

/*******************************************************************************
    Form Elements
*******************************************************************************/
button, .button{
    border: none;
    cursor: pointer;
    padding: 0 20px;
    font-weight: bold;
}

button.right,
.button.right{
    margin: 0 0 0 10px;
}

button.left,
.button.left{
    margin: 0 10px 0 0;
}

button.disabled,
button.disabled:hover{
    background-color: #e5e5e5;
    cursor: wait;
    color: #f2f2f2;
    opacity: 1;
}

input[type='text'], input[type='email'], input[type='password'], textarea, select{
    width: 100%;
    padding: 10px;
    border: 1px solid #e5e5e5;
}

input[type='text'], input[type='email'], input[type='password'], input[type='date'], select{
    height: 40px;
}

input[type='text']:focus, input[type='email']:focus, input[type='password']:focus, input[type='date']:focus, select:focus, textarea:focus {
    border:1px solid #5ca1e5;
}

input:focus + span.input-icon {
    border-left:1px solid #5ca1e5;
}

textarea{
    height: 100px;
}

input[type='date']{
    width: 100%;
    padding: 10px 40px 10px 10px;
    border: 1px solid #e5e5e5;
}

label.required:after{
    content: ' *';
    color: #e43227;
}

label {
    padding-right:5px;
    font-size:14px;
    padding-top:10px;
    font-weight: bold;
}

.label-padding-right{
    padding: 0 20px 0 0;
}

.file-selected{
    display: none;
}

.checkbox-label {
    padding: 0 10px 0 25px;
    position: relative;
}

input[type="checkbox"],
input[type="radio"]{
    bottom: 0;
    left: 0;
    margin: auto;
    position: absolute;
    top: 0;
}

.file-upload{
    position: relative;
    height: 50px;
    border: 1px dashed #a3b1bf;
    text-align: center;
}

.file-upload:hover{
    background-color: #fafafa;
}

.file-upload input[type="file"]{
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    cursor: pointer;
}

select{
    background: #fafafa;
    border: 1px solid #e5e5e5;
}

.input-holder{
    position: relative;
}

.input-icon{
    position: absolute;
    right: 0px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 40px;
    width: 40px;
    border-left: 1px solid #e5e5e5;
    cursor: pointer;
}

/* Errors */
.error-holder{
    position: relative;
    padding: 10px;
}

.error-triangle{
    position: absolute;
    height: 0;
    width: 0;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #e65c5c transparent;
    top: -10px;
    left: 10px;
}

.warning-triangle{
    position: absolute;
    height: 0;
    width: 0;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #e5c52f transparent;
    top: -10px;
    left: 10px;
}

/* Success Messages */
.success-holder{
    position: relative;
    padding: 10px;
}
.success-triangle{
    position: absolute;
    height: 0;
    width: 0;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #77cc66 transparent;
    top: -10px;
    left: 10px;
}

/* Switch */
.switch-outer{
    position: relative;
    height: 30px;
    width: 80px;
    border: 1px solid #e5e5e5;
    border-radius: 20px;
    cursor: pointer;
    margin: 5px 0 5px 0;
}

.switch-inner{
    position: absolute;
    top: 0;
    bottom: 0;
    height: 20px;
    width: 40px;
    margin: auto;
    border-radius: 10px;
    left: 33px;
}

.switch-outer.on .switch-inner{ left: 5px; }

.switch-label{
    position: relative;
    padding: 0 0 0 95px;
}

.switch-disabled {
    opacity: 0.5;
}

/* Datepicker */
.pika-single {
    z-index: 9999;
    display: block;
    position: relative;
    width: 240px;
    padding: 8px;
    border: 1px solid #e5e5e5;
}

.pika-single.is-hidden {
    display: none;
}

.pika-single.is-bound {
    position: absolute;
}

.pika-title {
    position: relative;
}

.pika-label {
    display: inline-block;
    *display: inline;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 5px 3px;
}
.pika-title select {
    cursor: pointer;
    position: absolute;
    z-index: 9998;
    margin: 0;
    left: 0;
    top: 5px;
    filter: alpha(opacity=0);
    opacity: 0;
}

.pika-prev,
.pika-next {
    display: block;
    cursor: pointer;
    position: relative;
    border: 0;
    padding: 0;
    width: 20px;
    height: 30px;
    white-space: nowrap;
    overflow: hidden;
}

.pika-select {
    display: inline-block;
}

.pika-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
}

.pika-table th,
.pika-table td {
    width: 14.285714285714286%;
    padding: 0;
}

.pika-button {
    cursor: pointer;
    display: block;
    outline: none;
    border: 0;
    margin: 0;
    width: 100%;
    padding: 5px;
}

.pika-abbr{
    font-size: 12px;
    line-height: 25px;
}

.form-button-row {
    border-top:1px solid #e5e5e5;
    padding-top:20px;
    padding-bottom:20px;
    margin-top:20px;
}

.form-top-spacer {
    padding-top:20px;
}

.form-top-spacer-40 {
    padding-top:40px;
}
/* Profile Picture Upload */
.picture-upload{
    position: relative;
}

.picture-upload input[type='file']{
    opacity: 0;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    max-width: 100%;
    z-index: 1;
    cursor:pointer;
}

.picture-upload-circle{
    width: 150px;
    height: 150px;
    border-radius: 150px;
    border: 5px solid #e5e5e5;
    margin: 0 auto;
    position: relative;
}

#profile-picture{
    position: absolute;
    width: 150px;
    height: 150px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border-radius: 150px;
}

.signature-placeholder {
    width: 400px;
    height: 150px;
    border: 5px solid #e5e5e5;
    position: relative;
}

.signature-placeholder img {
    width: 100%;
}

.loader {
    background-image: url('../img/icons/loading@2x.gif');
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: text-top;
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}
/*******************************************************************************
    Datatable
*******************************************************************************/
.datatable{
    border-collapse: collapse;
    width: 100%;
    display: table;
    position: relative;
}

.table-body{ display: table-row-group; }
.table-head{ display: table-header-group;}
.table-footer {
    display: table-footer-group;
    display: table-caption;
    caption-side: bottom;
}
.table-footer p { margin-left:15px; }
.table-row{ display: table-row; }

.table-cell, .table-cell-small{
    display: table-cell;
    vertical-align: top;
    min-width: 34px;
}

.table-cell, .table-cell-medium{
    display: table-cell;
    vertical-align: top;
    min-width: 44px;
}
.table-colspan{
    position: absolute;
    width: 95%;
}

.datatable .table-head .table-cell{
    padding: 0 15px 0 0;
}

.datatable .table-head .table-cell:first-child{
    padding: 0 15px 0 15px;
}

.datatable .table-body .table-cell{
    padding: 25px 15px 15px 0;
}

.datatable .table-body .table-cell:first-child{
    padding: 25px 15px 15px 15px;
}

.datatable .table-body .table-cell-small{
    padding: 5px 15px 5px 0;
}

.datatable .table-body .table-cell-small:first-child{
    padding: 5px 15px 5px 5px;
}

.datatable .table-body .table-cell-medium{
    padding: 5px 15px 5px 0;
}

.datatable .table-body .table-cell-medium:first-child{
    padding: 5px 15px 5px 5px;
}

.datatable .table-head .table-row{
    background-color: #f2f2f2;
}

.datatable .table-body .table-row{
    border-bottom: 1px solid #e5e5e5;
    height: 79px;
}

.datatable .table-body .table-row-small{
    height: 39px;
}

.datatable .table-body .table-row-medium{
    height: 49px;
}

.datatable-tools-holder{
    display: none;
    position: absolute;
    right: 0;
    z-index: 5;
    margin: 19px 10px 19px 0;
    background-color: #fafafa;
    -webkit-border-top: 1px solid #e5e5e5;
}

.datatable-tools-holder.small{
    margin-top: 5px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {

    .placeholder-cell{
        display: table-cell;
        vertical-align: top;
        width: 1px;
    }

}

.datatable .table-body .table-row.touch .datatable-tools-holder,
.datatable .table-body .table-row:hover .datatable-tools-holder {
    display: block;
}

#entriesPerPage{
    width: 80px;
    margin: 0 0 0 10px;
}

.entries-per-page-holder {
    padding-top:4px;
}

.progress-bar{
    height: 5px;
    width: 100%;
    position: relative;
    margin: 10px 0 5px 0;
}

.progress-bar-inner{
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
}

.progress-bar-inner-exeed{
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}

.pagination-holder{
    margin: 20px 0 0 0;
}

.pagination-button{
    padding: 0 15px 0 15px;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    border-left: 1px solid #e5e5e5;
}

.pagination-button:hover{
    background-color: #f2f2f2;
}

.pagination-button:last-child{
    border-right: 1px solid #e5e5e5;
}

/* ------------------------------------------------------------ *\
    Export Section
\* ------------------------------------------------------------ */
.export-list {
    margin-top: 20px;
    float: right;
    width: 450px;
}

.export-list .button {
    font-weight: normal;
    color: #e43227;
}

.export-list > span {
    font-size: 13px;
    line-height: 20px;
    color: #999999;
}

.table-cell-xs {
    width: 5px;
    min-width:5px;
}

.table-cell-s {
    width: 40px;
}

.table-cell-m {
    width: 100px;
}

.table-cell-ml {
    width: 120px;
}

.table-cell-l {
    width: 200px;
}


/*******************************************************************************
    Main Content Elements
*******************************************************************************/
.main-title{
    margin: 0 0 25px 0;
}

.main-subtitle{
    padding: 0 0 0 20px;
    margin: 25px 0 20px 0;
}

.main-row{
    margin: 0 0 10px 0;
}

.section-title-row{
    padding: 20px 0 20px 0;
    margin: 30px 0 30px 0;
    border-bottom: 1px solid #e5e5e5;
}

.section-title-row:first-child{
    padding-top: 30px;
    padding-bottom: 20px;
    margin: 0px 0 30px 0;
}

.main-subsection-row{
    padding: 0 0 0 20px;
    margin: 0 0 10px 0;
}

.main-horizontal-divider{
    width: 100%;
    height: 1px;
    margin: 35px 0 35px 0;
}

.main-form-holder{
    max-width: 900px;
    width: calc(100% - 300px);
}

/* User List */
.user-list-profile-thumb{
    margin-top: -3px;
    float:left;
}

.account-status-bullet {
    position:relative;
    float:left;
    width:8px;
    height:8px;
    margin-left: -16px;
    margin-top:-12px;
    font-size:24px;
}

.meeting-info-box {
    position: absolute;
}

/* Modal */
.confirmation-modal {
    display: none;
    background: #ffffff;
    padding:30px 30px 10px;
    min-width:300px;
}

.modalCloseImg {
    display:none;
}

.simplemodal-overlay {
    background:#000;
}

/* Plaintext Application */
.textarea_widget {padding-left:2px; width:95%; }
.textarea_widget textarea {font-family: "Courier New", Courier, monospace; }


/* Placeholder */
#infobox {
    width: 400px;
    margin: 20px auto;
    padding: 20px;
    color: #333;
    background-color: #9fe1ff;
    border: 4px solid #333;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
    -moz-box-shadow: 0 0 5px #333;
}

.hasPlaceholder {
    color: #777;
}

/*******************************************************************************
    Change Log
*******************************************************************************/
.change-log-title {
    padding-top:20px;
    padding-bottom:20px;
    border-bottom: 1px solid #e5e5e5;
}

.log-icon-holder {
    width:30px;
    margin-top:10px;
}

.log-entry {
    margin-top:12px;
}

.log-entry ul {
    margin-top:10px;
    margin-bottom:10px;
}

.log-entry ul li {
    list-style-type:disc;
    margin-left:14px;
}

/*******************************************************************************
    Small Screens
*******************************************************************************/
@media screen and (max-width : 1640px) {

    /***************************************************************************
        Datatable
    ***************************************************************************/
    .big-screen-cell {
        display: none;
    }

}