/* ========================================================================
   Component: messout.css
 ========================================================================== */




/*Test
*/
.systemMessage{
    background-color:transparent;
}

.label-success {
    background-color: #1b9150;
    color: white;
    padding: 10px;
    font-family: Arial;
}
.label-danger {
    background-color: #da5c00;
    color: white;
    padding: 10px;
    font-family: Arial;
}

/**Css by DT**/
/*for the jqery tooltip on a title attrbut, js in common.js*/
.ui-tooltip {
    background-color: #111 !important;
    color: #fff !important;
    opacity: 1 !important;
    padding: 2px !important;
    margin: 0px !important;
    border: 1px solid #999 !important;
    box-shadow: none !important;
    border-radius: 2px !important;
}

.loading-overlay {
    display: block;
    background-color: rgba(20, 20, 20, 0.9);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

/*containers for buttons on the pages, e.g Save all options on top on Admin -page*/
.function-bar {
    border: 0px solid #666;
    margin-bottom: 6px;
}


.function-bar-question-wrapper {
    background-color: #222;
    padding: 8px 8px 4px 8px;
    margin-bottom: 10px;
}

.function-bar-question {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
}

/*new main box for middle content*/
.container-maincontent {
    position: relative;
    left: 8px;
    min-height: 100vh; /*hack to make sure its spans even when inner boxes not effect hieght*/
    margin: 0px;
    background-color: #333;
    border-bottom: 2px solid #444;
    padding: 5px;
}

/*new main box for right side "panel"-content*/
.container-rightcontent {
    position: relative;
    width: 100%;
    left: 8px;
    background-color: #333;
}

/*right content for moderator*/
.sharedInfoPane {
    display: inline-block;
    width: 320px;
    padding: 4px; /*10px*/
    margin-top: 35px;
}
/*right panel for designer*/
.presenterSideButtons {
    display: inline-block;
    width: 320px;
    padding: 4px;
}

.tab-boxes {
    position: relative;
    width: 100%;
    margin-top: 0px;
    border: 1px dotted #333;
    padding-left: 10px;
}

.container-boxes {
    position: relative;
    height: 100%;
    width: 100%;
    margin-top: 0px;
    border: 1px dotted #333;
}

/*this is for making content scroll in boxes, e.g panels*/
.overflow-scroll {
    overflow: scroll;
}

/**END Css by DT**/



/**Overrides by DT**/




/* BEGIN Input */

input {
    color: #eee;
    background-color: #333;
}

    /*formating for making nukber boxes small*/
    input[type="number"] {
        width: 80px;
    }

/* END Input */



/* BEGIN Tables */
.questionsum-table {
    max-width: 500px;
}


td {
    vertical-align: top;
}
/* END Tables */


/*set size of Livestats in right panels in Moderator*/
.connected-graph {
    height: 150px;
}


/*style for body tag of login page*/
.loginpage {
    background-color: #333;
    color: #eee;
}

/*class for show/hide panels at Modaretor with jquery*/
.showSingle {
    cursor: pointer;
}


.messout-list {
    width: 100%;
}

    /*more spacing in lists*/
    .messout-list td {
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .messout-list tr:hover {
        background-color: #242830;
    }

/*switch button style when NOT selected*/
.switch span {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
    background-color: #999;
    border-radius: 100px;
    transition: all .5s;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25) inset;
}

/*removing padding of panels*/
.panel {
    padding: 0px;
}

/*this for making hover color work*/
.messout-tabsystem li a:hover {
    text-decoration: none;
    background-color: #596377;
    color: #eee;
}


/*vänstermenyn*/
.app-container > aside {
    position: absolute;
    top: 0px; /*default 60px*/
    left: 0;
    bottom: 0;
    width: 220px;
    z-index: 310;
}

.layout-fixed .app-container > section {
    padding-top: 0px; /* default 60px*/
}

/*should be removed*/
.panel-default {
    color: #a1a9b7;
    border-color: #999;
    border-radius: 0px;
    background-color: #333;
}




.app-container {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    -o-transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}


.app {
    padding: 0px; /*20px*/
    /*padding-bottom: 80px;*/
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

/** END DT overrides **/





.hideMe {
    visibility: hidden;
}

.sideMobile {
    width: 100%;
    height: 400px;
}


.panel-side {
    /*margin-bottom: 19px;*/
    padding: 4px;
    background-color: #242830;
    color: lightgray;
    border: 1px solid transparent;
}

body {
    margin: 0;
    padding-top: 0px !important;
    padding-bottom: 0 !important;
    overflow-x: hidden !important;
}



.questions-dropdown {
    width: 150px;
    display: inline-block;
    /*margin: 10px;*/
}

.dropdownNoPadding {
    width: 100px;
    padding-left: 0;
    padding-right: 0;
}

.allround-button {
    background: white;
    color: gray;
}

.mobileCKEditor {
    width: 30%;
    display: inline-block;
}

.center-picture {
    text-align: center;
}

.float-div-right {
    float: right;
}

    .float-div-right:after {
        clear: both;
    }

.sidebar-collapse-button {
    float: right;
    padding: 20.5px 15px 20.5px 15px;
}

    .sidebar-collapse-button:after {
        clear: both;
    }


.presenter-design-listarea {
    max-height: 850px;
    overflow: auto;
}



.datePickercustom {
    width: 160px;
    display: inline-block;
    margin: 10px;
}

/*shall be removed, should not be used DT*/
.questions-containerdiv {
    height: 800px;
    /*border: 1px solid green;*/
}

/*shall be removed, should not be used DT*/
.questions-topdiv {
    /*border: 1px solid black;*/
    height: 8%;
    margin: 5px;
    padding-left: 10px;
}

/*shall be removed, should not be used DT*/
.questions-questiondiv {
    height: 60%;
    /*border: 1px solid red;*/
    margin: 5px;
    overflow: auto;
}

/*shall be removed, should not be used DT*/
.questions-bottomdiv {
    height: 30%;
    /*border: 1px solid blue;*/
    margin: 5px;
}

/*shall be removed, should not be used DT*/
.questions-div-split {
    width: 50%;
    height: 98%;
    /*border: 1px solid pink;*/
    display: inline-block;
    padding: 2px;
}

/*remove this, should not be in use, DT*/
.question-option-btn {
    padding: 10px;
}

.new-question-labels {
    width: 30%;
}

.new-question-textinput {
    display: inline-block;
    width: 60%;
}

.new-question-labels-MinMax {
    width: 20%;
}

.new-question-div {
    padding-left: 10px;
    padding-bottom: 4px;
}

.new-question-div2 {
    padding-left: 10px;
    padding-bottom: 8px;
}

.question-type-div {
    padding: 10px;
}

.answer-collection-div {
    padding: 10px;
    border: 1px solid gray;
    height: 300px;
    overflow-y: scroll;
}

.answer-text-label {
    width: 65%;
}

.answer-remove-btn {
    margin-left: 100px;
    float: right;
}

/*all admin classes is obsolete*/
.admin-panel-tab {
    height: 700px;
}

.admin-panel-tab-content {
    height: 100%;
    width: 100%;
}

.admin-test-client {
    height: 480px;
}

.admin-test-chart {
    height: 300px;
}
/*END*/

.row-padding-custom {
    padding-bottom: 1px;
    padding-top: 1px;
}

.messout-tabsystem {
    width: 70%; /*900px*/
    min-width: 870px;
    min-height: 900px; /*900px;*/
    /*overflow-y: scroll;*/
}

.tab-content-messout {
    padding: 2px 20px;
    border-style: solid;
    border-width: 0 1px 1px 1px;
    border-color: #555;
}


.messout-moderator-tabsystem {
    width: 70%;
    min-width: 860px;
}

.messout-message-tabsystem {
    width: 100%;
    height: 700px; /*700px*/
    overflow-y: scroll;
}

.presenterPreview {
    position: relative; /*was absolute, changed cuz it bugged draggable items that didnt flow with rest of page (scrolled)*/
    width: 1024px;
    height: 768px;
    padding: 0px;
    float: left;
    background: #363C47;
}

.chosenModule {
    /*box-sizing: border-box;*/
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px dashed #666;
}

.draggable-start-size {
    width: 100px;
    height: 100px;
    box-sizing: border-box;
    /*border: 1px solid red;*/
}

.full-div-sized {
    height: 100%;
    width: 100%;
}

.generatedPresenterObject {
    width: 100px;
    height: 100px;
    display: inline-block;
    background-color: lightgrey;
}

#moderator.draggable {
    position: absolute;
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: top;
    zoom: 1;
    *display: inline;
    cursor: hand;
    cursor: pointer;
}

.resizable {
    width: 100px;
    height: 100px;
}



.setting-option-div {
    width: 1024px;
    min-height: 300px;
    display: inline-block;
    float: left;
}

.selected-div {
    background: Gray;
    color: white;
}

.first-body-div-size {
    height: 100%;
}

.text-color-black {
    color: black;
}

.text-color-white {
    color: white;
}

.user-table-content-div {
    height: 90%;
    width: 1700px;
}

.user-projects-div {
    width: 560px;
    height: 100%;
}
/*Customer Div*/
.customer-table-name {
    width: 180px;
}

.customer-table-projects {
    width: 40px;
}

.customer-table-users {
    width: 40px;
}

.customer-table-updated {
    width: 70px;
}

.customer-table-edit {
    width: 40px;
}

.customer-table-delete {
    width: 50px;
}
/*Projects div*/
.project-table-name {
    width: 120px;
}

.project-table-startdate {
    width: 70px;
}

.project-table-enddate {
    width: 70px;
}

.project-table-updated {
    width: 70px;
}

.project-table-edit {
    width: 40px;
}

.project-table-delete {
    width: 50px;
}
/*User div*/
.user-table-name {
    width: 230px;
}

.user-table-lastlogin {
    width: 70px;
}

.user-table-updated {
    width: 70px;
}

.user-table-edit {
    width: 40px;
}

.user-table-delete {
    width: 50px;
}
/*Moderator Published Messages*/
.moderator-message-table-no {
    width: 50px;
}

.moderator-message-table-message {
    width: 100%;
    min-width: 270px;
}

    .moderator-message-table-message textarea:focus {
        min-height: 150px;
        overflow-y: auto;
    }

    .moderator-message-table-message textarea {
        overflow-y: hidden;
        overflow-x: hidden;
    }

.moderator-message-table-published {
    width: 30px;
}

.moderator-message-table-Question {
    width: 100px;
}

.moderator-message-table-timeago {
    width: 50px;
}

.moderator-message-table-sender {
    width: 80px;
    border:none;
}

.moderator-message-table-sender input {

    border: none;
}

.moderator-message-table-unpublish {
    width: 30px;
}

[data-tip] { /* Styling for the hover-tooltip for the moderator messages tables */
    position: relative;
}

    [data-tip]:before { /* Styling for the hover-tooltip for the moderator messages tables */
        content: '';
        display: none;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 5px solid #1a1a1a;
        position: absolute;
        position: absolute;
        top: 35px;
        left: 15px;
        z-index: 8;
        font-size: 0;
        line-height: 0;
        width: 0;
        height: 0;
    }

    [data-tip]:after { /* Styling for the hover-tooltip for the moderator messages tables */
        display: none;
        content: attr(data-tip);
        position: absolute;
        top: 40px;
        left: 0px;
        padding: 5px 8px;
        background: #1a1a1a;
        color: #fff;
        z-index: 9;
        font-size: 0.85em;
        height: 25px;
        line-height: 18px;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        white-space: nowrap;
        word-wrap: normal;
    }

    [data-tip]:hover:before,
    [data-tip]:hover:after { /* Styling for the hover-tooltip for the moderator messages tables */
        display: block;
    }

.moderator-message-table-delete {
    width: 50px;
}
/*shall be removed, should not be used, DT*/
.page-size {
    height: 100%;
    width: 100%;
}

.background-black {
    background: #333; /*alterted to not soo dam dark, DT*/
}

.background-green {
    background: #88bf57;
}

    .background-green:hover {
        background: #88bf57;
    }

.background-red {
    background: red;
}

.background-blue {
    background: blue;
}

.background-white {
    background: white;
}

.greenbordered {
    border: 1px green solid;
}

.bluebordered {
    border: 1px blue solid;
}

.redbordered {
    border: 1px red solid;
}

.redborderedClickable {
    border: 1px red solid;
}

.messageRightButtons {
    float: right;
    /*margin: 10px;*/
}

.noPaddingOrMarginExceptLeft {
    padding: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    margin-left: 10px;
}

.colorDiv {
    height: 40px;
    width: 40px;
    display: inline-block;
    margin: 10px;
    border: 1px dotted black;
    border-radius: 50%;
}

.colorRadio {
    height: 30px;
    width: 30px;
    margin: 5px 5px !important;
}

.newMessage {
    background-color: lightgreen;
    color: black;
}

.chosen {
    color: black;
    background: gray;
    /*background-color: lightgrey !important;*/
    /*-webkit-box-shadow:inset 0px 0px 0px 10px #f00;
    -moz-box-shadow:inset 0px 0px 0px 10px #f00;
    box-shadow:inset 0px 0px 0px 10px #f00;
    box-sizing: border-box;
    border: 1px dashed black;*/
}

.colorChooser.revert {
    background-color: transparent;
}

.colorChooser.lightsalmon {
    background-color: lightsalmon;
    color: black;
}

.colorChooser.lightblue {
    background-color: lightblue;
    color: black;
}

.colorChooser.lightgreen {
    background-color: lightgreen;
    color: black;
}

.colorChooser.yellow {
    background-color: yellow;
    color: black;
}

.colorChooser.white {
    background-color: white;
    color: black;
}

.colorChooser .lightsalmon {
    background-color: lightsalmon;
    color: black;
}

.colorChooser .lightblue {
    background-color: lightblue;
    color: black;
}

.colorChooser .lightgreen {
    background-color: lightgreen;
    color: black;
}

.colorChooser .yellow {
    background-color: yellow;
    color: black;
}

.colorChooser .white {
    background-color: white;
    color: black;
}

.oldMessage {
    background-color: white;
    color: black;
}


.form-control-custom {
    margin: 5px;
    display: block;
    width: 90%;
    height: 37px;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.52857143;
    color: #515d6e;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #dbd9d9;
    border-radius: 2px;
}

.question-th {
    padding-left: 10px;
    padding-right: 10px;
    cursor: pointer;
    /*border: 1px solid black;*/
}

.question-td {
    padding-left: 10px;
    padding-right: 10px;
}



.h3_ {
    margin: 0px 0px 0px 0px;
    background: #d7d8fe;
}


.admin-container {
    width: 1100px;
    height: 800px;
    /*border: 1px solid green;*/
}

.split-admin-container {
    display: inline-block;
    width: 50%;
    height: 50%;
    /*border: 1px solid red;*/
    float: left;
}

    .split-admin-container:after {
        clear: both;
    }

.split-container-width {
    width: 50%;
    float: left;
}

    .split-container-width:after {
        clear: both;
    }

/*remove this, should not be in use, DT*/
.presenter-buttons {
    padding: 12px;
    margin-top: 2px;
}

.presenter-info-div {
    width: 88px;
    display: inline-block;
    padding: 5px;
    margin: 2px;
    overflow: hidden;
    text-align: center;
}

.page-info-div {
    width: 88px;
    display: inline-block;
    padding: 5px;
    margin: 2px;
    overflow: hidden;
}

.admin-checkbox-style {
    margin: 20px;
    display: inline-block;
}

/*remove this, should not be in use, DT*/
.admin-textarea-welcome {
    width: 100%;
    height: 100px;
    resize: none;
}

.newproject-textarea-description {
    width: 100%;
    height: 100px;
    resize: none;
}

.admin-panel-paddings {
    padding: 10px;
}


.button {
    margin-top: 0px !important;
    display: inline-block;
    width: 100%;
    font-size: 1em;
    font-weight: bold;
    /*background-image: linear-gradient(-180deg, #E4EAE7 2%, #D0D5D1 100%);*/
    border-radius: 0.5em;
    padding: 1em 0em;
    text-align: center;
    text-decoration: none;
    /*box-shadow: 0px 4px 0px #E4EAE7;*/
    /*text-shadow: 0px 2px 0px #A4AAA7;*/
    /*border-bottom: 4px solid #A4AAA7;*/
    /*color: #656565;*/
    margin-bottom: 1em;
    overflow: hidden;
}

.menubutton {
    margin-top: 0px !important;
    /*display: inline-block;*/
    width: 20%;
    font-size: 1em;
    font-weight: bold;
    background-image: linear-gradient(-180deg, #E4EAE7 2%, #D0D5D1 100%);
    border-radius: 0.5em;
    padding: 1em 0em;
    text-align: center;
    text-decoration: none;
    /*box-shadow: 0px 4px 0px #E4EAE7;
    text-shadow: 0px 2px 0px #A4AAA7;*/
    /*border-bottom: 4px solid #A4AAA7;*/
    color: #656565;
    /*margin-bottom: 15px;*/ /*1em;*/
    overflow: hidden;
}

.button.description {
    border: 1px solid #A4AAA7;
    padding: 1em 0 0 0;
    background: #E4EAE7;
}

    .button.description span {
        display: inline-block;
        padding: 0;
        margin: 0;
        text-shadow: none;
        font-weight: normal;
        text-align: left;
        margin-top: 1em;
        background: white;
        margin: 1em 0 0 0;
        padding: 0.8em;
        border-top: 1px solid #A4AAA7;
        line-height: 135%;
        font-size: 0.85em;
    }

    .button.description:active {
        margin: 0 0 1em 0;
        border: 1px solid #A4AAA7;
        box-shadow: 0px 4px 0px #E4EAE7;
    }

    .button.description.blue {
        border: 1px solid #306A8F;
        padding: 1em 0 0 0;
        background: #3A8BBF;
    }

        .button.description.blue span {
            display: inline-block;
            padding: 0;
            margin: 0;
            text-shadow: none;
            font-weight: normal;
            text-align: left;
            margin-top: 1em;
            background: white;
            margin: 1em 0 0 0;
            padding: 0.8em;
            border-top: 1px solid #306A8F;
            line-height: 135%;
            font-size: 0.85em;
            color: #656565;
        }

        .button.description.blue:active {
            margin: 0 0 1em 0;
            border: 1px solid #306A8F;
            box-shadow: 0px 4px 0px #E4EAE7;
        }

.green {
    background: #48B173 !important;
    color: white !important;
    /*text-shadow: 0px 2px 0px #409460 !important;
    border-bottom: 4px solid #388454 !important;*/
}

.red {
    background: #DE5246 !important;
    color: white !important;
    /*text-shadow: 0px 2px 0px #B4443B !important;
    border-bottom: 4px solid #B4443B !important;*/
}

.button.yellow {
    background-image: linear-gradient(-180deg, #F1D383 2%, #E7BE3A 98%);
    color: white;
    text-shadow: 0px 2px 0px #BB9B30;
    border-bottom: 4px solid #BB9B30;
}



.button.blue {
    background-image: linear-gradient(-180deg, #87B0D2 2%, #3A8BBF 98%);
    color: white;
    text-shadow: 0px 2px 0px #306A8F;
    border-bottom: 4px solid #306A8F;
}

.button:active {
    /*margin-top: 2px !important;*/
    /*margin-bottom: 15px;*/
    /*box-shadow: 0px 0px 0px #E4EAE7;*/
    /*border-bottom: 2px solid #A4AAA7;*/
    /*				box-shadow: inset 0 0 1em #A4AAA7;
			border: 2px solid #A4AAA7;
        */
}

.button.green:active {
    /*box-shadow: 0px 0px 0px #E4EAE7;
    border-bottom: 2px solid #388454;*/
}

.button.red:active {
    box-shadow: 0px 0px 0px #E4EAE7;
    border-bottom: 2px solid #B4443B;
}

.button.yellow:active {
    box-shadow: 0px 0px 0px #E4EAE7;
    border-bottom: 2px solid #BB9B30;
}

.button.blue:active {
    box-shadow: 0px 0px 0px #E4EAE7;
    border-bottom: 2px solid #306A8F;
}

.swipeBtnRight {
    display: inline-block;
    height: 400px;
    width: 40px;
    float: right;
}



.rankingOption {
    display: inline-block;
    /*float: right;*/
    background-image: url('../../Images/pilar.png') /*,  linear-gradient(-180deg, #E4EAE7 2%, #D0D5D1 100%)*/ !important;
    background-position: 15px !important;
    background-size: 10px !important;
    /*background-attachment: fixed;*/
    background-repeat: no-repeat !important;
}

.clientConfirmButtons {
    width: 40%;
    height: 50px;
    font-size: large;
    display: inline-block;
    /*border-radius: 0 100em 100em 0;*/ /*supermaxad em*/
}

.anonBtn {
    width: 50%;
    height: 50px;
    font-size: large;
    display: inline-block;
    /*border-radius: 0 100em 100em 0;*/ /*supermaxad em*/
}

.likeBox {
    width: 100%;
    margin-bottom: 10px;
    display: inline-block;
    font-size: large;
    /*background-color: lightgray;*/
    padding: 8px;
    border-radius: 10px;
}

.thumb {
    margin: 5px;
    width: 50px;
    height: 50px;
}

.clientConfirmButtons1 {
    width: 30% !important;
    height: 30%;
    font-size: large;
    display: inline-block;
}

.noPaddingOrMargin {
    margin: 0;
    padding: 0;
}

.QuestionLabel {
    margin-top: 0;
    margin-bottom: 5px;
}

.slick-dots {
    margin: 0 !important;
}

.menuOption {
    font-weight: bold;
    margin: 1em 1em 0 1em;
    color: rgba(200, 200, 200, 1);
}

#loadDiv {
    position: absolute;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    text-align: center;
}

    #loadDiv img {
        margin-top: 50%;
        top: -50px;
        position: absolute;
        width: 100px;
        height: auto;
    }

.projects_usersList {
    height: 100%;
    /*overflow-y: auto;*/
}

.tableObject {
    padding-bottom: 5px;
}

.new-user-div {
    padding-left: 20px;
    /*padding-bottom: 20px;*/
}







/*stuff from app.css*/

.sidebar {
    position: relative;
    height: 100%;
    padding-bottom: 50px;
    overflow-x: hidden;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    background-color: inherit;
    margin-right: 0;
}


@media only screen and (min-width: 1px) {
    .aside-collapsed .app-container > aside {
        width: 65px;
    }
}

@media only screen and (min-width: 1px) {
    .topnavbar .mobile-toggles {
        display: none;
    }
}

.layout-fixed .app-container > section:after {
    /*padding-top: 60px;*/
    clear: both;
}


.btn-messout-accept {
    color: #ffffff !important;
    background-color: #88bf57;
    border-color: #85be53;
}

    .btn-messout-accept:hover,
    .btn-messout-accept:focus,
    .btn-messout-accept.focus,
    .btn-messout-accept:active,
    .btn-messout-accept.active,
    .open > .dropdown-toggle.btn-messout-accept {
        color: #ffffff !important;
        background-color: #7eb948;
        border-color: #71a840;
    }

    .btn-messout-accept:active,
    .btn-messout-accept.active,
    .open > .dropdown-toggle.btn-messout-accept {
        background-image: none;
    }

    .btn-messout-accept.disabled,
    .btn-messout-accept[disabled],
    fieldset[disabled] .btn-messout-accept,
    .btn-messout-accept.disabled:hover,
    .btn-messout-accept[disabled]:hover,
    fieldset[disabled] .btn-messout-accept:hover,
    .btn-messout-accept.disabled:focus,
    .btn-messout-accept[disabled]:focus,
    fieldset[disabled] .btn-messout-accept:focus,
    .btn-messout-accept.disabled.focus,
    .btn-messout-accept[disabled].focus,
    fieldset[disabled] .btn-messout-accept.focus,
    .btn-messout-accept.disabled:active,
    .btn-messout-accept[disabled]:active,
    fieldset[disabled] .btn-messout-accept:active,
    .btn-messout-accept.disabled.active,
    .btn-messout-accept[disabled].active,
    fieldset[disabled] .btn-messout-accept.active {
        background-color: #88bf57;
        border-color: #85be53;
    }

    .btn-messout-accept .badge {
        color: #88bf57;
        background-color: #ffffff;
    }


.resize-vertical {
    -moz-resize: vertical;
    -ms-resize: vertical;
    -o-resize: vertical;
    resize: vertical;
}

.resize-horizontal {
    -moz-resize: horizontal;
    -ms-resize: horizontal;
    -o-resize: horizontal;
    resize: horizontal;
}

.resize-none {
    -moz-resize: none;
    -ms-resize: none;
    -o-resize: none;
    resize: none;
}

.form-control-blackened {
    color: #eeeeee;
    background-color: #333333;
}

    .form-control-blackened[disabled],
    .form-control-blackened[readonly],
    fieldset[disabled] .form-control-blackened {
        cursor: pointer;
        color: #eeeeee;
        background-color: #333333;
    }
/*Splash screen*/
.circularG-main {
    position: relative;
    margin: 0 auto;
    top: 12%;
    width: 128px;
    height: 128px;
}

.circularG {
    position: absolute;
    background-color: #eeeeee;
    width: 29px;
    height: 29px;
    -moz-border-radius: 19px;
    -moz-animation-name: bounce_circularG;
    -moz-animation-duration: 1.28s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -webkit-border-radius: 19px;
    -webkit-animation-name: bounce_circularG;
    -webkit-animation-duration: 1.28s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -ms-border-radius: 19px;
    -ms-animation-name: bounce_circularG;
    -ms-animation-duration: 1.28s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-direction: normal;
    -o-border-radius: 19px;
    -o-animation-name: bounce_circularG;
    -o-animation-duration: 1.28s;
    -o-animation-iteration-count: infinite;
    -o-animation-direction: normal;
    border-radius: 19px;
    animation-name: bounce_circularG;
    animation-duration: 1.28s;
    animation-iteration-count: infinite;
    animation-direction: normal;
}

.circularG_1 {
    left: 0;
    top: 50px;
    -moz-animation-delay: 0.48s;
    -webkit-animation-delay: 0.48s;
    -ms-animation-delay: 0.48s;
    -o-animation-delay: 0.48s;
    animation-delay: 0.48s;
}

.circularG_2 {
    left: 14px;
    top: 14px;
    -moz-animation-delay: 0.64s;
    -webkit-animation-delay: 0.64s;
    -ms-animation-delay: 0.64s;
    -o-animation-delay: 0.64s;
    animation-delay: 0.64s;
}

.circularG_3 {
    top: 0;
    left: 50px;
    -moz-animation-delay: 0.8s;
    -webkit-animation-delay: 0.8s;
    -ms-animation-delay: 0.8s;
    -o-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

.circularG_4 {
    right: 14px;
    top: 14px;
    -moz-animation-delay: 0.96s;
    -webkit-animation-delay: 0.96s;
    -ms-animation-delay: 0.96s;
    -o-animation-delay: 0.96s;
    animation-delay: 0.96s;
}

.circularG_5 {
    right: 0;
    top: 50px;
    -moz-animation-delay: 1.12s;
    -webkit-animation-delay: 1.12s;
    -ms-animation-delay: 1.12s;
    -o-animation-delay: 1.12s;
    animation-delay: 1.12s;
}

.circularG_6 {
    right: 14px;
    bottom: 14px;
    -moz-animation-delay: 1.28s;
    -webkit-animation-delay: 1.28s;
    -ms-animation-delay: 1.28s;
    -o-animation-delay: 1.28s;
    animation-delay: 1.28s;
}

.circularG_7 {
    left: 50px;
    bottom: 0;
    -moz-animation-delay: 1.44s;
    -webkit-animation-delay: 1.44s;
    -ms-animation-delay: 1.44s;
    -o-animation-delay: 1.44s;
    animation-delay: 1.44s;
}

.circularG_8 {
    left: 14px;
    bottom: 14px;
    -moz-animation-delay: 1.6s;
    -webkit-animation-delay: 1.6s;
    -ms-animation-delay: 1.6s;
    -o-animation-delay: 1.6s;
    animation-delay: 1.6s;
}

@-moz-keyframes bounce_circularG {
    0% {
        -moz-transform: scale(1);
    }

    100% {
        -moz-transform: scale(.3);
    }
}

@-webkit-keyframes bounce_circularG {
    0% {
        -webkit-transform: scale(1);
    }

    100% {
        -webkit-transform: scale(.3);
    }
}

@-ms-keyframes bounce_circularG {
    0% {
        -ms-transform: scale(1);
    }

    100% {
        -ms-transform: scale(.3);
    }
}

@-o-keyframes bounce_circularG {
    0% {
        -o-transform: scale(1);
    }

    100% {
        -o-transform: scale(.3);
    }
}

@keyframes bounce_circularG {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(.3);
    }
}



.overflow-x-enabled {
    overflow-x: auto;
}

.overflow-y-enabled {
    overflow-y: auto;
}

.admin-mobile-text-settings-div {
    height: 330px;
}

.admin-phone-mockup {
    background: url('/Images/phone_portrait.png');
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    padding: 140px 70px 140px 70px;
}

#newParticipantContainer {
    padding: 10px;
}


.navbar-fixed-bottom .dropdown .caret {
    border-top: 0 dotted;
    border-bottom: 4px solid #000000;
    content: "";
}
.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: 1px;
}

@media (min-width: 76800px) {
    .navbar-right .dropdown-menu {
        right: 0;
        left: auto;
    }
}
.navbar {
    position: relative;
    z-index: 1000;
    min-height: 50px;
    margin-bottom: 20px;
    border: 1px solid transparent;
}

    .navbar:before,
    .navbar:after {
        display: table;
        content: " ";
    }

    .navbar:after {
        clear: both;
    }

    .navbar:before,
    .navbar:after {
        display: table;
        content: " ";
    }

    .navbar:after {
        clear: both;
    }

@media (min-width: 76800px) {
    .navbar {
        border-radius: 4px;
    }
}

.navbar-header:before,
.navbar-header:after {
    display: table;
    content: " ";
}

.navbar-header:after {
    clear: both;
}

.navbar-header:before,
.navbar-header:after {
    display: table;
    content: " ";
}

.navbar-header:after {
    clear: both;
}

@media (min-width: 76800px) {
    .navbar-header {
        float: left;
    }
}

.navbar-collapse {
    max-height: 340px;
    padding-right: 15px;
    padding-left: 15px;
    overflow-x: visible;
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-overflow-scrolling: touch;
}

    .navbar-collapse:before,
    .navbar-collapse:after {
        display: table;
        content: " ";
    }

    .navbar-collapse:after {
        clear: both;
    }

    .navbar-collapse:before,
    .navbar-collapse:after {
        display: table;
        content: " ";
    }

    .navbar-collapse:after {
        clear: both;
    }

    .navbar-collapse.in {
        overflow-y: auto;
    }

@media (min-width: 76800px) {
    .navbar-collapse {
        width: auto;
        border-top: 0;
        box-shadow: none;
    }

        .navbar-collapse.collapse {
            display: block !important;
            height: auto !important;
            padding-bottom: 0;
            overflow: visible !important;
        }

        .navbar-collapse.in {
            overflow-y: visible;
        }

        .navbar-collapse .navbar-nav.navbar-left:first-child {
            margin-left: -15px;
        }

        .navbar-collapse .navbar-nav.navbar-right:last-child {
            margin-right: -15px;
        }

        .navbar-collapse .navbar-text:last-child {
            margin-right: 0;
        }
}

.container > .navbar-header,
.container > .navbar-collapse {
    margin-right: -15px;
    margin-left: -15px;
}

@media (min-width: 76800px) {
    .container > .navbar-header,
    .container > .navbar-collapse {
        margin-right: 0;
        margin-left: 0;
    }
}

.navbar-static-top {
    border-width: 0 0 1px;
}

@media (min-width: 76800px) {
    .navbar-static-top {
        border-radius: 0;
    }
}

.navbar-fixed-top,
.navbar-fixed-bottom {
    position: fixed;
    right: 0;
    left: 0;
    border-width: 0 0 1px;
}

@media (min-width: 76800px) {
    .navbar-fixed-top,
    .navbar-fixed-bottom {
        border-radius: 0;
    }
}

.navbar-fixed-top {
    top: 0;
    z-index: 1030;
}

.navbar-fixed-bottom {
    bottom: 0;
    margin-bottom: 0;
}

.navbar-brand {
    float: left;
    padding: 15px 15px;
    font-size: 18px;
    line-height: 20px;
}

    .navbar-brand:hover,
    .navbar-brand:focus {
        text-decoration: none;
    }

@media (min-width: 76800px) {
    .navbar > .container .navbar-brand {
        margin-left: -15px;
    }
}

.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 8px;
    margin-right: 15px;
    margin-bottom: 8px;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
}

    .navbar-toggle .icon-bar {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 1px;
    }

        .navbar-toggle .icon-bar + .icon-bar {
            margin-top: 4px;
        }

@media (min-width: 76800px) {
    .navbar-toggle {
        display: none;
    }
}

.navbar-nav {
    margin: 7.5px -15px;
}

    .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
        line-height: 20px;
    }

@media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none;
    }

        .navbar-nav .open .dropdown-menu > li > a,
        .navbar-nav .open .dropdown-menu .dropdown-header {
            padding: 5px 15px 5px 25px;
        }

        .navbar-nav .open .dropdown-menu > li > a {
            line-height: 20px;
        }

            .navbar-nav .open .dropdown-menu > li > a:hover,
            .navbar-nav .open .dropdown-menu > li > a:focus {
                background-image: none;
            }
}

@media (min-width: 76800px) {
    .navbar-nav {
        float: left;
        margin: 0;
    }

        .navbar-nav > li {
            float: left;
        }

            .navbar-nav > li > a {
                padding-top: 15px;
                padding-bottom: 15px;
            }
}

@media (min-width: 76800px) {
    .navbar-left {
        float: left !important;
    }

    .navbar-right {
        float: right !important;
    }
}

.navbar-form {
    padding: 10px 15px;
    margin-top: 8px;
    margin-right: -15px;
    margin-bottom: 8px;
    margin-left: -15px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
}

@media (min-width: 76800px) {
    .navbar-form .form-group {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle;
    }

    .navbar-form .form-control {
        display: inline-block;
    }

    .navbar-form .radio,
    .navbar-form .checkbox {
        display: inline-block;
        padding-left: 0;
        margin-top: 0;
        margin-bottom: 0;
    }

        .navbar-form .radio input[type="radio"],
        .navbar-form .checkbox input[type="checkbox"] {
            float: none;
            margin-left: 0;
        }
}

@media (max-width: 767px) {
    .navbar-form .form-group {
        margin-bottom: 5px;
    }
}

@media (min-width: 76800px) {
    .navbar-form {
        width: auto;
        padding-top: 0;
        padding-bottom: 0;
        margin-right: 0;
        margin-left: 0;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}

.navbar-nav > li > .dropdown-menu {
    margin-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.navbar-nav.pull-right > li > .dropdown-menu,
.navbar-nav > li > .dropdown-menu.pull-right {
    right: 0;
    left: auto;
}

.navbar-btn {
    margin-top: 8px;
    margin-bottom: 8px;
}

.navbar-text {
    float: left;
    margin-top: 15px;
    margin-bottom: 15px;
}

@media (min-width: 76800px) {
    .navbar-text {
        margin-right: 15px;
        margin-left: 15px;
    }
}

.navbar-default {
    background-color: #f8f8f8;
    border-color: #e7e7e7;
}

    .navbar-default .navbar-brand {
        color: #777777;
    }

        .navbar-default .navbar-brand:hover,
        .navbar-default .navbar-brand:focus {
            color: #5e5e5e;
            background-color: transparent;
        }

    .navbar-default .navbar-text {
        color: #777777;
    }

    .navbar-default .navbar-nav > li > a {
        color: #777777;
    }

        .navbar-default .navbar-nav > li > a:hover,
        .navbar-default .navbar-nav > li > a:focus {
            color: #333333;
            background-color: transparent;
        }

    .navbar-default .navbar-nav > .active > a,
    .navbar-default .navbar-nav > .active > a:hover,
    .navbar-default .navbar-nav > .active > a:focus {
        color: #555555;
        background-color: #e7e7e7;
    }

    .navbar-default .navbar-nav > .disabled > a,
    .navbar-default .navbar-nav > .disabled > a:hover,
    .navbar-default .navbar-nav > .disabled > a:focus {
        color: #cccccc;
        background-color: transparent;
    }

    .navbar-default .navbar-toggle {
        border-color: #dddddd;
    }

        .navbar-default .navbar-toggle:hover,
        .navbar-default .navbar-toggle:focus {
            background-color: #dddddd;
        }

        .navbar-default .navbar-toggle .icon-bar {
            background-color: #cccccc;
        }

    .navbar-default .navbar-collapse,
    .navbar-default .navbar-form {
        border-color: #e6e6e6;
    }

    .navbar-default .navbar-nav > .dropdown > a:hover .caret,
    .navbar-default .navbar-nav > .dropdown > a:focus .caret {
        border-top-color: #333333;
        border-bottom-color: #333333;
    }

    .navbar-default .navbar-nav > .open > a,
    .navbar-default .navbar-nav > .open > a:hover,
    .navbar-default .navbar-nav > .open > a:focus {
        color: #555555;
        background-color: #e7e7e7;
    }

        .navbar-default .navbar-nav > .open > a .caret,
        .navbar-default .navbar-nav > .open > a:hover .caret,
        .navbar-default .navbar-nav > .open > a:focus .caret {
            border-top-color: #555555;
            border-bottom-color: #555555;
        }

    .navbar-default .navbar-nav > .dropdown > a .caret {
        border-top-color: #777777;
        border-bottom-color: #777777;
    }

@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #777777;
    }

        .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
        .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #333333;
            background-color: transparent;
        }

    .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #555555;
        background-color: #e7e7e7;
    }

    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #cccccc;
        background-color: transparent;
    }
}

.navbar-default .navbar-link {
    color: #777777;
}

    .navbar-default .navbar-link:hover {
        color: #333333;
    }

.navbar-inverse {
    background-color: #222222;
    border-color: #080808;
}

    .navbar-inverse .navbar-brand {
        color: #999999;
    }

        .navbar-inverse .navbar-brand:hover,
        .navbar-inverse .navbar-brand:focus {
            color: #ffffff;
            background-color: transparent;
        }

    .navbar-inverse .navbar-text {
        color: #999999;
    }

    .navbar-inverse .navbar-nav > li > a {
        color: #999999;
    }

        .navbar-inverse .navbar-nav > li > a:hover,
        .navbar-inverse .navbar-nav > li > a:focus {
            color: #ffffff;
            background-color: transparent;
        }

    .navbar-inverse .navbar-nav > .active > a,
    .navbar-inverse .navbar-nav > .active > a:hover,
    .navbar-inverse .navbar-nav > .active > a:focus {
        color: #ffffff;
        background-color: #080808;
    }

    .navbar-inverse .navbar-nav > .disabled > a,
    .navbar-inverse .navbar-nav > .disabled > a:hover,
    .navbar-inverse .navbar-nav > .disabled > a:focus {
        color: #444444;
        background-color: transparent;
    }

    .navbar-inverse .navbar-toggle {
        border-color: #333333;
    }

        .navbar-inverse .navbar-toggle:hover,
        .navbar-inverse .navbar-toggle:focus {
            background-color: #333333;
        }

        .navbar-inverse .navbar-toggle .icon-bar {
            background-color: #ffffff;
        }

    .navbar-inverse .navbar-collapse,
    .navbar-inverse .navbar-form {
        border-color: #101010;
    }

    .navbar-inverse .navbar-nav > .open > a,
    .navbar-inverse .navbar-nav > .open > a:hover,
    .navbar-inverse .navbar-nav > .open > a:focus {
        color: #ffffff;
        background-color: #080808;
    }

    .navbar-inverse .navbar-nav > .dropdown > a:hover .caret {
        border-top-color: #ffffff;
        border-bottom-color: #ffffff;
    }

    .navbar-inverse .navbar-nav > .dropdown > a .caret {
        border-top-color: #999999;
        border-bottom-color: #999999;
    }

    .navbar-inverse .navbar-nav > .open > a .caret,
    .navbar-inverse .navbar-nav > .open > a:hover .caret,
    .navbar-inverse .navbar-nav > .open > a:focus .caret {
        border-top-color: #ffffff;
        border-bottom-color: #ffffff;
    }

@media (max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
        border-color: #080808;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
        color: #999999;
    }

        .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
        .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #ffffff;
            background-color: transparent;
        }

    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #ffffff;
        background-color: #080808;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #444444;
        background-color: transparent;
    }
}

.navbar-inverse .navbar-link {
    color: #999999;
}

    .navbar-inverse .navbar-link:hover {
        color: #ffffff;
    }
body.modal-open,
.modal-open .navbar-fixed-top,
.modal-open .navbar-fixed-bottom {
    margin-right: 15px;
}
#customCss {
	min-height: 400px;
}