﻿.ValidationErrors
{
	background-color: #FFE5F9;
	padding: 0px 0px 0px 0px;
	border: solid 1px #FFB3EC;
	width: 100%;
    font-family: Arial;
}
ul.ErrorBullets li
{
	margin-top:0px;
	vertical-align:text-bottom;
    padding: 0px 0px 0px 10px;
    list-style-type:none;
}
.txterr
{
	font-family: Arial;
	font-size: 13px;
	color: Red;
	font-weight: bold;
}

/*Clear fix*/
.clearfix:after {
    content: ".";
    visibility: hidden;
    display: block;
    height: 0;
    clear: both;
}

/*remove borders by default for IE*/
img, input[type=image] {
    border: none;
}

.floatRight {
    float: right;
}

.floatLeft {
    float: left;
}

.centered {
    margin: 0 auto;
    text-align: center;
}

.italic {
    font-style: italic;
}

.padded {
    padding: 10px 20px;
}

.lightpadded {
    padding: 4px !important;
}

.alignLeft {
    text-align: left !important;
}

    .alignLeft td {
        text-align: left !important;
    }

.alignRight, .alignRight td, table.dataTable tfoot tr td.alignRight {
    text-align: right !important;
}

.alignCenter {
    text-align: center !important;
}

    .alignCenter td {
        text-align: center !important;
    }

p + p {
    margin-top: 10px;
}

.hidden {
    display: none;
}

.readonly {
    border: 0;
    background-color: transparent;
    width: 50px;
    text-align: center;
}

    .readonly:focus {
        border: 0;
    }

.highlightError {
    border: 2px solid red !important;
}

.highlightErrorPadded {
    border: 2px solid red !important;
    padding: 4px 30px;
}

/*Our links*/
.blockLink {
    padding: 5px 10px;
    display: inline-block;
}

    .blockLink img {
        height: 50px;
        width: auto;vertical-align:middle;
    }


    .blockLink:hover {
        padding: 4px 9px;
        border: 1px solid blue;
        cursor: pointer;
    }

    .blockLink img + p {
        font-size:14px;
    }

/* More styles */
.inline {
    display: inline-block;
}

.large {
    font-size: 25px;
    font-weight: bold;
    padding: 0 3px;
}

.medium {
    font-size: 22px;
    font-weight: bold;
    padding: 0 3px;
}

.bigBold {
    font-size: 18px;
    font-weight: bold;
}

.bold {
    font-weight: bold !important;
}

.underline {
    text-decoration: underline;
}

.centerNowrap {
    text-align: center;
    white-space: nowrap;
}

/* --------------------------------------- */
/* Colors */
/* --------------------------------------- */

/* Modal Close Button Primary Colors */
.grey .close {
    background-color: white !important;
    color: #7F7F7F;
}

.lightGrey .close {
    background-color: lightgray !important;
    color: white;
}


.green .close {
    background-color: white !important;
    color: #27AE60;
}

.red .close {
    background-color: white !important;
    color: #E74C3C;
}

.purple .close {
    background-color: white !important;
    color: #8E44AD;
}

/* Modal Close Button System Specific */
.lightOrange .close {
    background-color: white !important;
    color: #F0A30A;
}

.orange .close {
    background-color: white !important;
    color: #F39C12 !important;
}

.darkOrange .close {
    background-color: white !important;
    color: #E67E22 !important;
}


/* Primary Colors */

.white, .white td {
    background-color: #fff !important;
    color: black;
}

.black, .black td {
    background-color: #000 !important;
    color: white;
}

.lightGrey, .lightGrey td {
    background-color: lightgray !important;
    color: white;
}

.grey, .grey td {
    background-color: #7F7F7F !important;
    color: white;
}

.lightGreen, .lightGreen td {
    background-color: #59ca5b !important;
    color: white;
}

.green, .green td {
    background-color: #27AE60 !important;
    color: white;
}

.darkGreen, .darkGreen td {
    background-color: darkGreen !important;
    color: white;
}

.lightRed, .lightRed td {
    background-color: #dc5252 !important;
    color: white;
}

.red, .red td {
    background-color: #E74C3C !important;
    color: white;
}

.darkRed, .darkRed td {
    background-color: darkRed !important;
    color: white;
}

.blue, .blue td {
    background-color: #2980B9 !important;
    color: white;
}

.lightBlue, .lightBlue td {
    background-color: #5dade2 !important;
    color: white;
}

.darkBlue, .darkBlue td {
    background-color: darkBlue !important;
    color: white;
}

.lightPurple, .lightPurple td {
    background-color: palevioletred !important;
    color: white;
}

.purple, .purple td {
    background-color: #8E44AD !important;
    color: white;
}

.darkPurple, .darkPurple td {
    background-color: darkmagenta !important;
    color: white;
}

.lightOrange, .lightOrange td {
    background-color: #F0A30A !important;
    color: white;
}

.orange, .orange td {
    background-color: #F39C12 !important;
    color: white;
}

.darkOrange, .darkOrange td {
    background-color: #E67E22 !important;
    color: black;
}

.lightYellow, .lightYellow td {
    background-color: lightyellow !important;
    color: #555;
}

.yellow, .yellow td {
    background-color: yellow !important;
    color: #555;
}

.darkYellow, .darkYellow td {
    background-color: #f8e610 !important;
    color: #555;
}

.darkOrange h1 {
    text-align: left;
    border-bottom: 1px solid black !important;
    width: 100%;
    margin-bottom: 2px;
    font-size: 20pt !important;
}

.darkOrange p {
    color: black !important;
}



/* Primary Colors */

.whiteText {
    color: #fff !important;
}

.blackText {
    color: #000 !important;
}

.lightGreyText {
    color: lightgray !important;
}

.greyText {
    color: #7F7F7F !important;
}

.lightGreenText {
    color: #59ca5b !important;
}

.greenText {
    color: #27AE60 !important;
}

.darkGreenTest {
    color: darkGreen !important;
}

.lightRedText {
    color: #dc5252 !important;
}

.redText {
    color: #E74C3C !important;
}

.darkRedText {
    color: darkRed !important;
}

.blueText {
    color: #2980B9 !important;
}

.lightBlueText {
    color: #5dade2 !important;
}

.darkBlueText {
    color: darkBlue !important;
}

/* System Specific */
.purpleText {
    color: #8E44AD !important;
}

.orangeText {
    color: #F0A30A !important;
}

.darkOrangeText {
    color: #F39C12 !important;
}


.darkOrangeText {
    color: #E67E22 !important;
}

/* End Colors */

.circle {
    position: relative;
    margin: 0 auto;
    clear: both;
    margin-top: 30px;
    padding: 10px;
    padding-top: 15px;
    height: 125px;
    width: 125px;
    cursor: pointer;
    font-size: 14px;
    /*make a circle*/
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.smallcircle {
    display: inline-block;
    margin: 10px;
    line-height: 40px;
    height: 40px;
    width: 40px;
    cursor: pointer;
    /*make a circle*/
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-weight: bold;
    font-size: 22px;
    border: 1px solid black;
    text-align: center;
}

#tinyBoxes {
    min-width: 260px;
    display: inline-block;
    padding: 10px;
    background-color: #A5A5A5;
    margin: 0 auto;
    margin-top: 50px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding-top: 0;
}

    #tinyBoxes .square {
        height: 80px !important;
        width: 80px !important;
        display: inline-block;
    }
/* --------------------------------------- */
/* End Colors */
/* --------------------------------------- */


/***********************************
    Modal Windows
    ********************************/

#modal-background, .modal-background {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: white;
    opacity: .50;
    -webkit-opacity: .5;
    -moz-opacity: .5;
    filter: alpha(opacity=50);
    z-index: 900;
    overflow: auto;
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#modal-background img, .modal-background img {
    /*spin it*/
    -webkit-animation: spin 1s linear infinite;
    -moz-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    position: fixed;
    left: 50%;
    top: 50%;
    margin-left: -12px;
    margin-top: -12px;
    z-index: 901;
}


.modal {
    position: fixed;
    background-color: white;
    min-height: 200px;
    min-width: 300px;
    max-width: 900px;
    max-width: 70%;
    display: none;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    box-shadow: 0 0 20px 0 #222;
    -webkit-box-shadow: 0 0 20px 0 #222;
    -moz-box-shadow: 0 0 20px 0 #222;
    z-index: 998;
    overflow: auto;
}

.overflowY {
    -webkit-border-radius: 10px;
    -webkit-border-top-right-radius: initial;
    -webkit-border-bottom-right-radius: initial;
    -moz-border-radius: 10px;
    -moz-border-radius-topright: initial;
    -moz-border-radius-bottomright: initial;
    border-radius: 10px;
    border-top-right-radius: initial;
    border-bottom-right-radius: initial;
}

    .overflowY .modalHeader {
        -webkit-border-top-right-radius: initial;
        -moz-border-radius-topright: initial;
        border-top-right-radius: initial;
    }

.modal hr {
    height: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    background-color:#8aabc8;
}

.close {
    background: #8aabc8;
    color: #FFFFFF;
    line-height: 30px;
    float: right;
    text-align: center;
    width: 30px;
    height: 30px;
    text-decoration: none;
    font-weight: bold;
    margin-top: 5px;
    margin-right: 5px;
    /*make a circle*/
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    z-index: 999;
    cursor: pointer;
}

    .close:hover {
        border: 3px solid white;
        line-height: 24px;
        font-weight: bolder;
        color: white !important;
        background-color: red !important;
    }

.modalHeader {
    height: 40px;
    line-height: 40px;
    vertical-align: middle;
    font-size: 16px;
    font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    clear: both;
    text-align:center;
    background-color:#8aabc8;
    color:#fff;
}

.modal label.for {
    display: block;
	width:100%;
    /*min-width: 200px;*/
    border-bottom: 1px solid #555;
    margin-right: 50px;
    margin-bottom: 3px;
}



/* tooltips */
.toolTip, .toolTipStayUp {
    text-decoration: none;
    border-bottom: 1px dashed lightBlue;
}

.toolTipDark, .toolTipDarkStayUp {
    text-decoration: none;
    border-bottom: 1px dashed gray;
}

.nobottomborder {
    border-bottom: 0px;
}

.smallcircleannouncements {
    position: relative;
    top: -18px;
    left: -8px;
    padding: 3px 10px 3px 10px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    text-decoration: none;
    background-color: #00B050;
    color: white;
}


.smallcircleordercomments {
    position: relative;
    top: -34px;
    left: -36px;
    padding: 1px 7px 1px 7px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    text-decoration: none;
    margin-bottom: -30px;
}


/******************************
    Validation*/
.requiredfield:before {
    color: red;
    content: "* ";
    margin-left: -10px;
}
.requiredfield2:before {
    color: red;
    content: "** ";
    margin-left: -10px;
}

.inline-label {
}

.validationText {
	color: red;
	display: block;
}

	.validationText + input {
		clear: both;
	}

.saveMessage {
    color: green;
    clear: both;
}




/* more information stuff, we have a bunch of this stuff */
.smallinfospan {
    color: #548BD4;
    font-size: 9px;
    font-style: italic;
}

/* end information stuff */

.square {
    position: relative;
    margin: 0 auto;
    margin-top: 10px;
    padding: 3px 7px;
    height: 125px;
    width: 125px;
    text-align: left;
    cursor: pointer;
    font-size: 14px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

    .square + .square {
        margin-left: 10px;
    }

    .circle p, .square p {
        display: inline-block;
        vertical-align: middle;
        line-height: normal;
        font-size: 11pt;
    }

/*nudge the circle text to make them look centered*/
.circle p {
    margin-top: 10px;
}

.circle h1, .square h1 {
    text-align: left;
    border-bottom: 1px solid white;
    width: 100%;
    margin-bottom: 2px;
    font-size: 30pt;
}

.squareblackbottom h1 {
    border-bottom: 1px solid black;
}

/* Datatable plugin Col vis */
ul.ColVis_collection {
    width: initial !important;
}


@media only print {

    .noPrint, #pageActions, #fixedFooter, #steps, #systemMessages, .lineWrapper {
        display: none;
    }

    a {
        color: #000;
    }

    body {
        background-color: #fff;
    }

    #header, #sideNav, .FixedHeader_Cloned table.dataTable, #footer, #breadcrumbs, #otherActions, #actionElements, .bottomButtons, .tooltipster-base, div.dataTables_length, div.dataTables_paginate {
        display: none;
    }

    #moduleNameHeader img, #moduleName {
        display: none;
    }

    #workarea {
        margin-left: 0;
        max-width: 100%;
    }

    .dataTables_filter input[type=search] {
        border: none;
        background: none;
        background-image: none;
        display: none;
    }

    .dataTables_wrapper table.dataTable tr th, .dataTables_wrapper table.dataTable tr td {
        color: black !important;
        font-size: 12px;
        padding: 5px;
    }


    h1 {
        color: #000;
        position: relative;
        top: 0;
        font-size: 25px;
        font-family: 'Arial Rounded MT';
        margin-bottom: 15px;
    }
}

/**************************************************
 ********       CSS for the steps*****************/
#steps {
    margin: 0 auto;
    text-align: center;
    position: relative;
}

.smallcircle.step {
    border: none;
    color: #333;
    margin: 0 40px;
    vertical-align: middle;
    position: relative;
    z-index: 2;
    cursor: initial;
}

    .smallcircle.step.current {
        border: 5px solid lightgrey;
        background-color: #fff;
        height: 50px;
        width: 50px;
    }

.lineWrapper {
    z-index: 1;
}

/*Make the entire cell clickable*/
.cellLink, table.dataTable tbody th, table.dataTable tbody td.cellLink {
    padding: 0;
}

    .cellLink a {
        display: block;
        padding: 5px;
    }
