﻿/* ----------------------------------- */

h1 {
    margin-top: 0em;
    margin-bottom: 0em;
    margin-top: 0em;
}

h2 {
    margin-top: 0em;
    margin-bottom: .5em;
    margin-top: 0em;
}

div.topbox {
    background-color: rgb(219, 230, 219);
    padding: 1em;
}

div.fronttopbox {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(40,103,79);
    background-color: rgb(254,255,226);
    padding: 1em;
}

div.frontbox {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(40,103,79);
    background-color: rgb(219, 230, 219);
    padding: 1em;
}

div.spacing {
    padding: 0em 1em 1em 1em;
}

h3.centertext {
    text-align: center;
}

/*input.submitButton {
    margin-top: 8px;
    margin-bottom: 8px;
}*/


div.button_padding {
    padding-right: 0em;
    margin: 0em;
}

span.reporttitle {
    font-size: 1.2em;
    font-weight: bold;
    display: block;
}

span.reportdescription {
    font-size: 1em;
    font-weight: normal;
}

#searchbillsummary {
    display:table; 
    border: 0em; 
    padding: 0em; 
    margin: 0em;
}

div.searchbillsummarycell {
    display: inline-block;
    padding-right: 0.5rem; 
    margin: 0rem; 
    padding-left:0em; 
    padding-top:0em; 
    padding-bottom:0em;
    vertical-align:top;
}

.custom-input {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    vertical-align: bottom;
}

#bottomnote {
    padding: 0em 1em 1em 1em;
}

@media (min-width:12em) 
{
    #standardreports {
        padding: 0em 0em 0em 0em ;
    }
    #advancedreports {
        padding: 0.5em 0em 0em 0em ;
    }
    #leftsection {
        padding: 0em 0em 0em 0em ;
    }
    #rightsection {
        padding: 0.5em 0em 0em 0em ;
    }
    #ctl00_ContentPlaceHolder1_billNumber {
        min-height: 2.5em
    }
    div.button_padding {
        padding-right: 1em;
    }
    #topnote {
        display: none;
    }
    #bottomnote {
        display: block;
    }
    h3.collapsible_title + div {
        padding: 0em;
    }
    .report_title {
        display: none;
    }
    h3.centertext {
        margin-top: 0em;
    }
}

@media (min-width:37.5em) 
{
    #standardreports {
        padding: 0em 0em 0em 0em ;
    }
    #advancedreports {
        padding: 0em 0em 0em 1em ;
    }
    #leftsection {
        padding: 0em 0em 0em 0em ;
    }
    #rightsection {
        padding: 0em 0em 0em 1em ;    
    }
    #ctl00_ContentPlaceHolder1_billNumber {
        min-height: 2.5em;
        min-width: 3em;
    }
    div.button_padding {
        padding-right: 0em;
    }       
    .collapsible_title {
        display: none;
    }
    #topnote {
        display: block;
    }
    #bottomnote {
        display: none;
    }
    h3.collapsible_title + div {
        display: block;
        padding: 0em;
    }
    .report_title {
        display: block;
    }
    h3.centertext {
        margin: .5em;
    }
}

@media (min-width:47.5em) 
{
    #standardreports {
        padding: 0em 0em 0em 0em ;
    }
    #advancedreports {
        padding: 0em 0em 0em 1em ;
    }
    #leftsection {
        padding: 0em 0em 0em 0em ;
    }
    #rightsection {
        padding: 0em 0em 0em 1em ;
    }
    #ctl00_ContentPlaceHolder1_billNumber {
        min-height: 2.4em;
        min-width: 3em;
    }
    .collapsible_title {
        display: none;
    }
    #topnote {
        display: block;
    }
    #bottomnote {
        display: none;
    }
    h3.collapsible_title + div {
        display: block;
        padding: 0em;
    }
    .report_title {
        display: block;
    }
}

@media (min-width:64em) 
{
    #standardreports {
        padding: 0em 0em 0em 0em ;
    }
    #advancedreports {
        padding: 0em 0em 0em 1em ;
    }
    #leftsection {
        padding: 0em 0em 0em 0em ;
    }
    #rightsection {
        padding: 0em 0em 0em 1em ;
    }
    #ctl00_ContentPlaceHolder1_billNumber {
        min-height: 2.4em;
        min-width: 3em;
    }
    div.searchbutton > div  {
        margin-top: 6px;
    }
    div.searchbutton {
        padding-right: 0em;
    }
    .collapsible_title {
        display: none;
    }
    #topnote {
        display: block;
    }
    #bottomnote {
        display: none;
    }
    h3.collapsible_title + div {
        display: block;
        padding: 0em;
    }
    .report_title {
        display: block;
    }
}




/* ----------------------------------- */

#pageContent {
    padding: 15px;
}

/*Note - not using a full css reset since we are using a css framework*/
ul {
    list-style:none;
    margin:0;
    padding:0;
}

img {
    max-width: 100%;   
    max-height: 100%;   
}


/* #region Header */

.templateHeader {
    font-weight:bold;
    font-size:1em;
    text-align:left;
}

/* #endregion Header */

/* #region Validation */ /*delete if don't use*/
.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;
}

.validationred {
    color: red;
}
/* #endregion Validation */

/* #region jquery toggle sort classes */  /*delete if don't use*/
.sortable th /*make columh headers look like links for sorting*/
{
    cursor:pointer;
    text-decoration:underline;
}

.tablesorter-header, .tablesaw-sortable-head {
    background-color: #2b674d;
    color: white;
}

.table-stripe tbody tr:nth-child(2n+1) td {
    background-color: white;
}

.tablesaw tbody tr:nth-child(2n+1) td {
    background-color: #DBE6DB;
}

.tablesaw-sortable th.tablesaw-sortable-head button {
    padding: 0.5em 1.6em 0.5em 0.6em ;
}

.tablesaw-sortable th.tablesaw-sortable-head button span {
    text-decoration: underline;
}

/* #endregion jquery toggle sort classes */

#mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
	font-family: "xsmall"; /*work around for IE8, delete when we don't support it anymore*/
}
#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
    content: "xsmall";
    display: none;
}





/** Printing */

/*Phone/Landscape STYLES*/
@media (min-width:26.25em), print /*420/16*/
{
    #mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
		font-family: "small"; /*work around for IE8, delete when we don't support it anymore*/
	}
	#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
        content: "small";
        display: none;
    }
}

/* tablet STYLES*/
@media (min-width:37.5em), print /*600/16*/
{
    #mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
		font-family: "medium"; /*work around for IE8, delete when we don't support it anymore*/
	}
	#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
        content: "medium";		
    }    
}

/*DESKTOP STYLES*/
@media (min-width:64em)  /* 1024/16 breakpoint four */
{
    #mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
		font-family: "large"; /*work around for IE8, delete when we don't support it anymore*/
	}
	#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
        content: "large";
    }   
    /* #region Footer */
    
    /* #endregion Footer */
}

/* Large screens ----------- */
@media (min-width : 114em) /*1824/16*/
{
    #mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
		font-family: "xlarge"; /*work around for IE8, delete when we don't support it anymore*/
	}
	#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
        content: "xlarge";		
    }
}

