@import "https://fonts.googleapis.com/css?family=Roboto:Regular,Medium,Bold,light,bolditalic,italic";

/* Set default font (Roboto from Google Fonts), background image and positioning */
body {
    font-family: 'Roboto',sans-serif !important;
    font-size: 13px;
    line-height: 1.2;
    /*padding-top: 50px;*/
    padding-bottom: 20px;
    background-image: url(../images/Background.jpg);
    margin: 0;
    background-position: left center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    position: relative;
    left: 0;
	/*width: 1000px;*/ 
    margin-left: auto;
    margin-right: auto;
	color: #506070;
}

label.error {
    color: #FF0000;
}

h4 {
    font-size: 20px;
	color: #506070;
}

.text-small {
    font-size: 0.95em;
}

.header-logo {
    height: 53px;
    margin-left: -7px;
}

.background-forest {
    background-image: url(../images/Background_Forest.jpg);
    background-repeat: no-repeat;
}

.extra-vertical-padding {
    padding-top: 50px;
    padding-bottom: 50px;
}

.img-startpage {
    height: 75px;
    margin-right: 15px;
    margin-top: 20px;
    margin-bottom: 8px;
}

span.header-startpage {
    font-family: 'Roboto Light','Roboto';
    font-weight: 300;
    font-size: 30px;
    color: #fff;
    padding-top: 70px;
}

    .img-startpage:hover {
        background-color: #283038;
        opacity: 0.5;
    }

.text-shadow {
    -ms-text-shadow: black 1px 1px 10px;
    text-shadow: black 1px 1px 10px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 20px;
    min-height: 40vh;
}

#page-wrap {
	width: 1000px;
	margin: 0 auto;
	position: relative;
}

.login-container {
    margin-top: 16vh;
}

#ajax-loader {
    display: none;
    position: fixed;
    top: 35%;
    left: 45%;
    z-index: 999999;
}
    
/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}

.panel-lg footer {
    background-color: #3C4854;
    text-align: center;
    padding: 6px;
}

/* Set footer font color and size */
footer p {
    color: #B5BFCA;
    font-size: 11px;
    margin: 0;
}


.panel-body p {
    display: block;
	color: #506070;
}

/*.panel-body ul, .panel-body table {
	color: #506070;
}*/

.panel-title {
    font-size: 14px;
}

/* Set margin bottom for elements in form group to smaller than default */
.panel-body .form-group {
    margin-bottom: 5px;
}

/* Set background and text color on btn-primary instead of default */
.btn {
    border: none;
    padding: 4px 12px;
    min-width: 70px;
    font-size: 13px;
}
.btn-primary {
    background-color: #0090D0;
    color: #FFF;
    border: none;
}

.panel-default {
    padding: 12px;
    background-color: #f1f3f5;
    border: none;
}

    /* Set white background color instead of default gray */
    .panel-default > .panel-heading {
        background-color: #f1f3f5;
    }

.panel-heading {
    padding: 0 0 10px;
    border-color: #ddd;
    margin-bottom: 10px;
}

.login-panel-heading {
    padding: 0 0 10px;
    border-color: #ddd;
}

.panel-body {
    padding: 5px 0 0;
}

    .panel-body .dl-horizontal dd {
        margin-bottom: 10px;
    }

/* Define different versions of span to use with class=bold/regular/header/medium*/
span.bold {
    font-family: 'Roboto';
	font-style: normal;
    font-size: 13px;
    font-weight: 700;
    color: #506070;
}

span.italic {
    font-family: 'Roboto';
    font-weight: 400;
    font-style: italic;
}

span.regular {
    font-family: 'Roboto';
	font-style: normal;
    font-size: 13px;
    font-weight: 400;
    color: #506070;
}

span.header {
    font-family: 'Roboto';
	font-style: normal;
    font-weight: 300;
    font-size: 20px;
    color: #506070;
}

span.header-main {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-size: 20px;
    color: #506070;
}

span.medium {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    color: #0090D0;
}

.RobotoMedium {
    font-family: 'Roboto';
	font-style: normal;
    font-weight: 500;
}

.RobotoBold {
    font-family: 'Roboto';
	font-style: normal;
    font-weight: 700;
}

.RobotoItalic {
    font-family: 'Roboto';
	font-style: italic;
    font-weight: 400;
}

.RobotoItalicSmall {
    font-family: 'Roboto';
	font-style: italic;
    font-weight: 400;
	font-size: 12px;
}

.blue-input {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 16px !important;
    color: #0090D0 !important;
    /*border: none !important;*/
}

/* Set header properties */
.masthead {
    /*height: 82px;*/
    background-color: #FFF;
    padding-left: 42px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.login-details {
    line-height: 1.4em;
    margin-left: 50px;
}

/* Small area designated for user profile links in header */
.header-profile {
    width: 90px;
    display: inline-block;
    background-color: #DADFE4;
    border-radius: 5px;
    color: #506070;
    padding-top: 5px;
    padding-bottom: 4px;
}

    .header-profile a {
        color: #506070;
    }

        .header-profile a:hover {
            color: #0090D0;
        }

    .header-profile .btn {
        padding: 0;
        background-color: #DADFE4;
        /*margin-left: -8px;*/
        line-height: 1;
        vertical-align: bottom;
    }

        .header-profile .btn:hover {
            color: #0090D0;
        }
.header-profile-buttons {
    padding-left: 23px;
}

.logoutButton {
    color: #506070;
    background-color: transparent;
    border: none;
    cursor: pointer;
    padding-right: 12px;
}

.logoutButton .glyphicon {
    margin-right: 4px;
}

    .logoutButton:focus, .logoutButton:hover {
        color: #0090D0;
        text-decoration: underline;
    }

/* Define large main panel to be used on all pages with panel except login pages */
.panel-lg {
    position: absolute;
    left: 0;
    top: 0;
    width: 1000px;
    background-color: #fff;
    border: none;
    border-radius: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

/* Define smaller, centered main panel to use on login pages */
.panel-login {
    width: 350px;
    margin: auto;
    padding: 0;
}

    /* Set white background color instead of default gray */
    .panel-login > .panel-heading {
        background-color: #FFF;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-bottom: 0;
    }

    /* Set panel body background color and border radius */
    .panel-login .panel-body {
        background: #DADFE4;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        padding-left: 14px;
        padding-right: 14px;
    }

        .panel-login .panel-body a.as-default-text {
            font-size: 11px;
	        font-family: 'Roboto Regular', 'Roboto';
        }

        .panel-login .panel-body .form-group {
            margin-bottom: 5px;
        }

/* Navbar properties to override default */
.navbar {
    background-color: #3C4854;
    margin-bottom: 0 !important;
    border-radius: 0;
    border: none;
}

.navbar-inner {
    min-height: 0px;
}

.navbar,
.navbar-nav li a {
    line-height: 25px;
    height: 25px;
    padding-top: 0;
    min-height: 25px;
    color: #dadfe4;
}

.navbar-nav > li.active {
    background-color: #000;
    color: #FFF;
}

ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;    
}

.navbar .dropdown-menu {
    margin-top: 0;
}

/* Navbar properties to override default */
.navbar .navbar-nav > li > a {
    color: #DADFE4;
}

/* Navbar properties to override default */
.navbar .navbar-nav > li > a:hover, .navbar .navbar-nav > li > a:focus, .navbar .navbar-nav > li > a:active {
    background-color: #000 !important;
    color: #FFF !important;
}

.navbar-nav > li > .dropdown-menu {
    background-color: #3c4854;
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: #000 !important;
    color: #FFF !important;
}

.breadcrumb>li+li:before {
	padding: 0 12px; color: #ccc; content: "|";
}

/* Class to center divs vertically in row*/
.center-vertical {
    align-items: center;
    display: flex;
}

@media all and (min-width:1200px) {
    .container {
        width: 970px;
    }
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
}

.form-horizontal .control-label {
    padding-top: 5px;
    /* text-align:right; */
    text-align: left;
}

.input-sm {
    height: 27px;
    padding: 5px 10px;
    font-size: 13px;
    line-height: 1.5;
    border-radius: 3px;
}

select.input-sm {
    height: 31px;
    line-height: 30px;
}

label.medium {
    font-family: 'Roboto';
    font-weight: 500;
    font-style: normal;
    font-size: 13px;
    color: #506070;
}

label.italic {
    font-family: 'Roboto';
    font-weight: 400;
    font-style: italic;
    font-size: 11px;
	color: #506070;
}

.table > tbody > tr > td {
    font-size: 13px;
    border-top: 0;
}

.table > thead > tr > th {
    font-family: 'Roboto';
    font-weight: 500;
    font-style: normal;
    font-size: 13px;
    line-height: 15px;
    color: #506070;
}

@media all and (min-width:768px) {
    .navbar-right {
        float: right !important;
        margin-right: 0px;
        margin-left: -20px;
    }
}

/*@media all and (min-width:768px)*/
.container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse {
    margin-right: 0;
}

.no-side-padding {
    padding-left: 0;
    padding-right: 0;
}


.validation-errors {
    color: red;
    font-size: 12px;
}

/* Set font size and color for links */
a.as-link {
    font-family: 'Roboto';
	font-style: normal;
    font-weight: 500;
    color: #0090D0;
    cursor: pointer;
}

a.as-default-text {
    font-family: 'Roboto';
	font-style: normal;
    font-weight: 500;
    color: #506070;
    cursor: pointer;
}

    a.as-default-text:hover {
        color: #0090D0;
    }

.tab-content {
    background-color: #f1f3f5;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
}

.nav-tabs {
    border-bottom: none;
}

    .nav-tabs > li > a {
        border: none;
        background-color: #dadfe4;
        border-radius: 0;
        margin-right: 5px;
        border-top-right-radius: 5px;
        border-top-left-radius: 5px;
    }

        .nav-tabs > li > a:hover {
            border: none;
            color: #506070;
            background-color: #90a0b0;
        }

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
        background-color: #fff;
        border: none;
    }

.middle-align {
    vertical-align: middle;
}

/* Button styling */
.btn-default {
    background-color: #90A0B0;
    color: #ffffff;
}

    .btn-default:hover {
        background-color: #506070;
        color: #ffffff;
    }

    .btn-default:active, .active.btn-default {
        background-color: #506070;
        color: #ffffff;
    }

    .btn-default:focus, .focus.btn-default {
        background-color: #90A0B0;
        color: #ffffff;
    }

.btn:hover {
    color: #fff;
}
.btn-success {
    background-color: #60c030;
}

    .btn-success:hover {
        background-color: #489024;
    }

.btn-warning {
    background-color: #f6bb42;
}

    .btn-warning:hover {
        background-color: #e19b0b;
    }

.btn-approve {
    background-color: #00b0b0;
    color: #FFF;
    border: none;
}

    .btn-approve:hover {
        background-color: #058888;
    }
    
.btn-danger {
    background-color: #da4453;
}

    .btn-danger:hover {
        background-color: #af2331;
    }


    .action-link {
        cursor: pointer;
    }

.blue-hover:hover {
	color: #0090D0;
    text-decoration: none;
}

.primary-contact-radio-label {
    top: -2px;
    position: relative;
}

.form-control-static {
    min-height: 24px;
    padding-top: 7px;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

.glyphicon-danger {
    color: #da4453;
}

.glyphicon-primary {
    color: #0090D0;
}

.glyphicon-warning {
    color: #f6bb42;
}

.glyphicon-success {
    color: #60c030;
}

.glyphicon-grey {
    color: #90a0b0;
}

.glyphicon-remove-sign {
	color: #d9534f;
}

.glyphicon-remove-sign:hover {
	color: #873633;
}

hr {
    margin-bottom: 10px;
    margin-top: 10px;
    border: 1px;
    border-top-style: solid;
    border-color: #ddd;
}

.form-inline {
    margin-bottom: 10px;
}

.extra-vertical-padding {
    padding-top: 50px;
    padding-bottom: 50px;
}

ul, ol {
    margin-top: 0px;
    margin-bottom: 10px;
    padding-left: 12px;
}
.help-page-panel-body ul, .help-page-panel-body ol {
    margin-top: 10px;
    margin-bottom: 10px;
    padding-left: 24px;
}
.breadcrumb {
    background-color: #DADFE4;
    margin-bottom: 15px;
    margin-left: -15px;
    padding-left: 30px;
    padding-bottom: 4px;
    padding-top: 4px;
    margin-right: -15px;
    border-radius: 0;
}

.breadcrumb a {
    color: #3C4854;
}

.breadcrumb .active {
    font-family: 'Roboto';
	font-style: normal;
    font-size: 13px;
    font-weight: 500;
}


.alert {
    color: #ffffff;
    padding: 5px;
}

.alert-success {
    background-color: #60c030;
}

.alert-warning {
    background-color: #f6bb42; 
}

.alert-danger {
    background-color: #da4453;
}

.alert-info {
    color: #42555f;
    background-color: #bce5fa;
}

.prs-alert .glyphicon {
    font-size: 16px;
    padding-right: 8px;
    vertical-align: text-bottom;
    color: #fff;
}
.prs-alert ul {
    margin-left: 34px;
}

.close {
    font-weight: normal;
    font-size: 18px;
    color: #fff;
    opacity: 1;
    position: relative;
    top: -2px;
}

.modal-header, .modal-body, .modal-footer {
    background-color: #f1f3f5;
    border-radius: 4px;
}

.modal {
    color: #506070;
}

.modal .close {
    color: #506070;
}

/*Help page view*/
.help-page-panel-heading:hover { background-color: black !important; }
.help-page-panel-default {
            border-color: #ccc;
}

.help-page-panel-heading {
         padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: rgba(80, 96, 112, 1);
    color: white;


}


/*Tooltip overrides*/
.tooltip-inner {
    background-color: #3c4854;
    text-align: left;
}

.tooltip-inner {
    background-color: #3c4854;
}


.help-page-panel-body {
     padding: 15px;
}

.top-5 {
    margin-top: 5px;
}

.top-10 {
    margin-top: 10px;
}

.top-20 {
    margin-top: 20px;
}

.bottom-10 {
    margin-bottom: 10px;
}

.bottom-20 {
    margin-bottom: 20px;
}

.space-10 {
    display: block;
    height: 1px;
    margin-bottom: 10px;
    clear: both;
}

.space-15 {
    display: block;
    height: 1px;
    margin-bottom: 15px;
    clear: both;
}

.space-20 {
    display: block;
    height: 1px;
    margin-bottom: 20px;
    clear: both;
}

.space-40 {
    display: block;
    height: 1px;
    margin-bottom: 40px;
    clear: both;
}

.space-80 {
    display: block;
    height: 1px;
    margin-bottom: 80px;
    clear: both;
}

/*File upload button*/
.btn-file {
    position: relative;
    overflow: hidden;
}

.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}
/*End*/
.body-layout-without-logging {
    background-color: rgba(241, 243, 245, 1);
}

/*Notes*/
.note-page-panel-heading:hover { background-color: #f1f3f5 !important; }

.note-page-panel-default {
    border-color: #f1f3f5;
    margin-bottom: 8px;
}

.note-page-panel-heading {
    padding: 4px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: rgba(218, 223, 228, 1);
    color: white;
}

.note-panel-title {
    font-size: 13px;
}

.note-page-panel-body {
    padding: 4px;
    padding: 4px;
    padding-top: 4px;
    padding-right: 4px;
    padding-bottom: 4px;
    padding-left: 4px;
}

.note-page-panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
    content: "\e114";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: grey;         /* adjust as needed */
}

.note-page-panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}

.note-color {
    color: #506070;
}

.btn-expand {
	width: 122px;
}

.btn-expand i {
	padding-right: 5px;
} 

.datepickerZIndex {
	position: relative;
	z-index: 10;
}

.ui-button {
    padding:0px !important;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 0px solid #d3d3d3 !important; 
}

.blue-link {
    color: #60c030;
    font-weight: 700;
    cursor: pointer;
}

.uploaded-files-table .glyphicon {
    cursor: pointer;
}

.intl-tel-input.allow-dropdown input, 
.intl-tel-input.allow-dropdown input[type=text], 
.intl-tel-input.allow-dropdown input[type=tel], 
.intl-tel-input.separate-dial-code input, 
.intl-tel-input.separate-dial-code input[type=text], 
.intl-tel-input.separate-dial-code input[type=tel] {
     padding-right: 10px !important; 
}

.intl-tel-input {
    display: inherit !important;
}

.prs-file-upload > .input-sm {
    height: 24px;
}

.question-img-thumbnail {
    display: inline-block;
    padding: 6px;
}

.question-img {
	margin: 6px;
}

textarea { resize: none; }



.node-data-panel {
    border-left: 12px solid;
}
.node-data-panel-bottom {
    border-bottom: 4px solid;
}
.panel-unhandled {
    border-color:  #506070;
}
.panel-requested {
    border-color:  #3390ce;
}
.panel-saved {
    border-color: #f6bb42;
}
.panel-submitted {
    border-color: #60c030;
}
.panel-returned {
    border-color:  #da4453;
}
.panel-approved {
    border-color:  #00b0b0;
}


.log-container {
    font-size: 0.9em;
    font-style: italic;
    line-height: 1.6em;
}

.upload-file-btn {
    padding: 3px 10px;
}

.attachment-list-item {
    margin-top: 2px;
}

.fixedHeader {
    padding-top: 20px;
    padding-bottom: 10px;
    width: 940px;
    background: #f1f3f5;
}

.fixedHeader.stick {
    margin-top: 0 !important;
    position: fixed;
    top: 0;
    z-index: 10000;
}


div.tooltip-inner {
    max-width: 350px;
}

#node-details-container {
    padding-left: 20px;
}

.bordered-img {
    border: 1px solid #3c4854;
    padding: 0;
}