@font-face {
    font-family: 'Futura';
    src: url('../fonts/futura book font.ttf') format('truetype');
}

@font-face {
    font-family: 'DidactGothic';
    src: url('../fonts/DidactGothic.ttf') format('truetype');
}

@font-face {
    font-family: 'FundamentalBrigade';
    src: url('../fonts/Fundamental Brigade.ttf') format('truetype');
}

@font-face {
    font-family: 'FundamentalBrigadeSchlank';
    src: url('../fonts/Fundamental Brigade Schlank.ttf') format('truetype');
}

@font-face {
    font-family: 'FundamentalBrigadeSchwer';
    src: url('../fonts/Fundamental Brigade Schwer.ttf') format('truetype');
}

@font-face {
    font-family: 'SegoeUI';
    src: url('../fonts/SEGOEUI.TTF');
}



/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    /*box-shadow: inset 0 0 5px grey;*/
    border-radius: 10px;
    border:solid 1px #fff;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #FFFFFF;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #FFFFFF;
}



.displayNone { display:none; }

.whiteBackground { background:#fff !important;}



body {
    /*padding-top: 50px;*/
    padding-bottom: 20px;
    /*font-family: 'FundamentalBrigade' !important;*/
    font-family: 'SegoeUI' !important;
    background: #1A1A34;
    color: #fff;
}

.container {
    /*min-width:1920px !important;*/
    max-width: 1920px !important;
}




#footer {
    height: 30px;
    margin: 5px 0 20px 0;
}

#footer ul
{
    list-style:none;
    padding:0;
    margin:0;    
    float:right;
}

#footer ul li
{
    display:inline;
    padding: 0 25px;
}

#footer ul li a {
    color:#fff;
    font-size:14px;
}



#whiteBorder {
    height: 10px;
    background: #FFFFFF;
}

#emmaLogo
{
    width:115px;
    height:50px;
    float:left;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 40px;
}

#loadingBackground {
    display: none;
    /*background: #fff;*/
    opacity: 0.9;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

#loadingSpinner {
    display: none;
    position: fixed;
    border: 12px solid #EDAD25; /* Light grey */
    border-top: 12px solid #fff; /* yellow */
    border-radius: 50%;
    width: 60px;
    height: 60px;
    animation: spin 1s linear infinite;
    top: 50%;
    left: 50%;
    z-index: 20000;
}
@keyframes spin {
    0% { transform: rotate(0deg); }

    100% { transform: rotate(360deg); }
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}

/* Dashboard */

.projectBox { margin-bottom: 35px; }
.projectThumbnail { border: solid 1px grey; border-top: none; position:relative; }
.projectThumbnail img { width: 100%; height: 160px; }
.projectInputs { padding: 5px 0; }

.thumbnailCube 
{ 
    position:absolute; right:10px; bottom:5px; color:#fff;
    animation-duration: 0.6s;
    animation-name: expandcontract;
    animation-iteration-count: infinite;
    animation-direction: alternate;  
}

@keyframes expandcontract {
    from {
        transform: scale(1);
    }

    to {
        transform: scale(1.15);
    }
}




/* Project Dashboard */

.dashboardBox { }

.dashboardTitle {
    background: #4C4A4A;
    padding: 10px;
    color: #fff;
    text-align: center;
}

.dashboardTitle a {
        color: #ffffff;
    }

.dashboardThumbnail {
    border: solid 1px grey;
    border-top: none;
}

.dashboardThumbnail img {
        width: 100%;
        height: 160px;
    }

.dashboardInputs {
    padding: 5px 0;
}



.pageDivider {
    width: 100%;
    height: 1px;
    background: lightgray;
    margin: 25px 0;
}


#tabs {
    /*font-family: 'Futura' !important;*/
    font-family: 'SegoeUI' !important;
    background: none;
    border: solid 1px #3D3E53;
}

#tabs p { color: #fff; }

#tabs label { color: #fff; }

#tabs .ui-state-active {
    background: #3D3E53;
    border: none;
}

#tabs .ui-widget-content a {
    /*color: #ffffff !important;*/
}

.ui-tabs .ui-tabs-nav
{
    background:none;
    border:none;
}

.ui-tabs .ui-tabs-nav li
{
    background:none;
    border:none;
}

.ui-tabs .ui-tabs-nav li a {
    color: #fff;
}



/* Dropdown Button */
#btnConfig {
    /*background-color: #04AA6D;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;*/

    font-size: 15px;
    font-weight: lighter;
    text-decoration: none;
    /*font-family: FundamentalBrigadeSchlank !important;*/
    font-family: 'SegoeUI' !important;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.config-dropdown {
    display: none;
    position: absolute;
    background-color: #262640;
    min-width: 170px;
    box-shadow: 6px 10px 18px #00000080;
    z-index: 201;
    font: normal normal normal 16px SegoeUI;
    right: 0px;
}

/* Links inside the dropdown */
.config-dropdown a {
    color: #fff;
    padding: 8px 12px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.config-dropdown a:hover {
    /*background-color: #fff;*/
    text-decoration:underline;
}

.dropdownAbove {
    bottom: 30px;
    right: 0;
    min-width: 190px !important;
    z-index: 201;
}

.dropdownAbove a:hover 
{
    background:#fff;
    color:#1A1A34 !important;
    text-decoration:none;
}

.dropdownAbove .training {
    background: url("/static/app/images/icons/Training.svg");
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 20px 20px;
    padding-left:35px;
}

.dropdownAbove .training:hover {
    background: #fff url("/static/app/images/icons/Training_hover.svg");
    background-repeat: no-repeat !important;
    background-position: left 10px center !important;
    background-size: 20px 20px !important;
}

.dropdownAbove .gettingStarted {
    background: url("/static/app/images/icons/GettingStarted.svg");
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 20px 20px;
    padding-left:35px;
}

.dropdownAbove .gettingStarted:hover {
    background: #fff url("/static/app/images/icons/GettingStarted_hover.svg");
    background-repeat: no-repeat !important;
    background-position: left 10px center !important;
    background-size: 20px 20px !important;
}

.dropdownAbove .userGuide {
    background: url("/static/app/images/icons/UserGuide.svg");
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 20px 20px;
    padding-left:35px;
}

.dropdownAbove .userGuide:hover {
    background: #fff url("/static/app/images/icons/UserGuide_hover.svg");
    background-repeat: no-repeat !important;
    background-position: left 10px center !important;
    background-size: 20px 20px !important;
}

/*.dropdownAbove*/ 
.termsAndConditions {
    background: url("/static/app/images/icons/croppedFavicon.png");
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 20px 20px;
    padding-left:35px;
    text-decoration:none;
}

    /*.dropdownAbove*/ 
.termsAndConditions:hover {
    background: url("/static/app/images/icons/croppedFavicon.png");
    background-repeat: no-repeat !important;
    background-position: left 10px center !important;
    background-size: 20px 20px !important;
}

/*.dropdownAbove*/
.privacyPolicy {
    background: url("/static/app/images/icons/PrivacyPolicy.svg");
    background-repeat: no-repeat;
    background-position: left 10px center;
    background-size: 20px 20px;
    padding-left: 35px;
    text-decoration: none;
}

    /*.dropdownAbove*/
.privacyPolicy:hover {
    background: url("/static/app/images/icons/PrivacyPolicy.svg");
    background-repeat: no-repeat !important;
    background-position: left 10px center !important;
    background-size: 20px 20px !important;
}



/* Show the dropdown menu on hover */
.dropdown:hover .config-dropdown { 
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover #btnConfig {
    /*background-color: #3e8e41;*/
}

#getFullAccess {
    /*font-weight: bold;*/
    color: #EFE135 !important;
}


/* Buttons */
body .btn-primary {
    background: #EDAD25 !important;
        
    box-shadow: 5px 8px 10px #00000029;
    border: 1px solid #FFFFFF;
    border-radius: 5px;
    
    text-align: left;
    font: normal normal normal FundamentalBrigadeSchwer;
    letter-spacing: 0px;
    color: #FFFFFF;
}

body .btn-primary:hover {
    background: #EDAD25 !important;
    box-shadow: 5px 8px 10px #00000029;
    border: 1px solid #FFFFFF;
    border-radius: 5px;
    text-align: left;
    font: normal normal normal FundamentalBrigadeSchwer;
    letter-spacing: 0px;
    color: #FFFFFF;
}


.clearBoth {clear:both;}


#gettingStartedContainer {
    max-width: 1220px;
    margin: 0 auto;
}

#userGuide {
    max-width: 1220px;
    margin: 0 auto;
    padding-top: 40px;
}

#userGuide h1 {
    margin-top:20px;
}

#userGuide .bold {
    font-weight: bold;
}

#userGuide .redHighlight {
    color: #d81818 !important;
}

#userGuide .amberHighlight {
    color: #ea8a03 !important;
}

#userGuide .greenHighlight {
    color: #01b201 !important;
}

#userGuide .blueHighlight {
    /*color: #278ec4 !important;*/
}

#userGuide .textAlignCentre {
    text-align: center;
}

#userGuide .centre {
    margin: 0 auto;
    display: block;
}


#userGuideLastUpdated ul {
    list-style: none;
}

#userGuide .numericList {
    list-style: decimal !important;
}


/* Table of contents */
#tableOfContents {
    /*background: #edf6ff;
    border: solid 1px #aaaaaa;*/
    width: 700px;
    display: block;
    margin: 0 auto;
}

#tableOfContents h2 {
    margin: 0;
    padding: 10px;
}

#tableOfContents a {
    color:#fff;
}

#tableOfContents ul {
    list-style: none;
    margin: 0;
    padding: 10px;
}

#tableOfContents ul li ul li {
    margin: 0;
    padding: 3px 0;
}



#userGuide #guideContent {
    width: 700px;
    display: block;
    margin: 0 auto;
}

#userGuide .tip {
    background: #fcf78d;
    font-weight: bold;
    font-style: italic;
    color: #000;
    padding: 5px;
    margin-bottom: 20px;
    margin-top: 20px;
}


#userGuide #btnBackToTop {
    position: fixed;
    bottom: 20px;
    right: 20px;
}

#userGuide #btnBackToTop:hover {
    cursor: pointer;
}

#backToDashboard{
    color:#fff;
}