/* screen reader only */
.sr-only {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.body.reports {
	margin-left: auto;
	margin-right: auto;
	padding-top: 10px;
}

.print-only {
	display: none
}

.container-fluid {
	max-width: 1400 !important;
	margin-left: auto;
	margin-right: auto;
	padding-right: 15px;
	padding-left: 15px;
	/*margin-bottom: 2em;*/
}

@media ( min-width : 768px) {
	.container-fluid {
		padding-left: 15px;
		padding-right: 15px;
	}
}

/* ------------- headings  -------------*/
H1, H2, H3, H4, H5 {
	margin-top: 10px;
	margin-bottom: 10px
}

h1, h2 {
	font-size: 150%
}

 h2.sectionName{padding-top:30px; margin-top:20px; border-top:1px solid #ddd}

h3 {
	font-size: 125%
}

h4, h5 {
	font-size: 100%
}

h3, h3.rp-header {
	font-weight: bold;
	font-size: 1em
}

/* ------------- buttons  -------------*/
#actions button, .actions button, .actions input[type="button"],.actions input[type=button]:not(:disabled), .actions button:not(:disabled) {
	
	font-weight: 400;
	background-position: right 12px center;
	background-repeat: no-repeat;
	background-size: auto 1rem;
	margin-top:10px;
	background-color:#fff;
	border:1px solid #ccc!important;
	padding:7px 8px 9px 8px;
	border-radius:5px;
}
/*.report #actions #sharebutton button.btn.btn-share{margin-top:0px;}*/
.report #actions, .report .actions{display:inline-block}

#actions #sharebutton button.btn.btn-share{padding-right: 36px; padding-top:6px;padding-bottom:6px;}

#actions .btn-print{border:1px solid #ccc!important;
	padding:7px 8px 9px 8px;
	border-radius:5px;}

#actions button:hover, .actions button:hover, .actions input[type="button"]:hover,.actions input[type=button]:not(:disabled):hover, .actions button:not(:disabled):hover,#actions #sharebutton button.btn.btn-share:hover{ background-color:#e6e6e6}

.actions input[type="button"].increase-text, .actions input[type="button"].decrease-text{
	padding:7px 7px 7px 7px;
	margin-bottom:0px;
	border-radius:5px;}

.addthis_counter .atc_s {
	padding: 20px
}


.btn-primary {
	background-color: #165788;
	border-color: #165788;
	color:#fff
}
 
.btn-primary:hover, .btn-primary:active{
    background-color:#337ab7 !important;
    border-color: #337ab7 !important;
}

.btn-secondary {
	background-color: #0f7acb;
	border-color: #0f7acb;
	margin-bottom:10px;
}

#sharebutton {
    display: inline-block;
}
/* ------------- header  ------------- */
.header {
	background-color: #165788;
	color: #fff;
	margin-top: 0;
	top: 0px;
	padding: 1em 1em 0.1em 0em;
	height:80px;
}

.header .logo {
	display: inline-block;
}

.header .logo-img {
	width: 180px;
}

.header .logo h1 {
	text-align: center; /*display:inline-flex;*/
	width: 50%;
	vertical-align: bottom;
	font-size: 1.2em
}

.header .col-md-9 h1 { /*display:inline-block;*/
	text-align: center;
}

.centered {
	margin-left: auto;
	margin-right: auto
}

/*------------------ mimic-cot -----------------*/
#actions{padding-bottom:0px;!important}
#actions button {
    padding-right: 36px;
    font-weight: 400;
    background-position: right 12px center;
    background-repeat: no-repeat;
    background-size: auto 1rem; 
    border: 1px solid #ddd}

#actions button#btPrint {
    padding-right: 10px;
    font-weight: 400;
    background-position: right 12px center;
    background-repeat: no-repeat;
    background-size: auto 1rem; 
    border: 1px solid #ddd; 
    padding-top:7px;
    padding-bottom:5px;
    }
    
#actions input[type="button"].increase-text, #actions input[type="button"].decrease-text  {
    padding-top:9px;
    padding-bottom:7px;
    margin-bottom:-50px;    
    position:relative;
    top:7px;
    }    

.mimic-cot.container-fluid, .container {
  max-width: 1000!important;  
  margin-left: auto;
  margin-right: auto;
  padding-right: 15px;
  padding-left: 15px;
  margin-top:2em;
  /*margin-bottom: 2em;*/
}

.mimic-cot-header{border-bottom:1px solid #ddd; margin-bottom:0px;padding-bottom:0px;}

h1.mimic-cot-heading{font-size:36px}
.mimic-cot-header .button-bar{margin-bottom:5px}

.loaded #actions button#print, .loaded #actions button#btPrint {
    background-image: url(../img/icon-print.svg);
    
}

/*  ------------- body  ------------- */
.content-page {
	width: 100%;
	max-width: 1400px;
	margin-left: auto;
	margin-right: auto
}



/*buttons*/
.button-bar {
	margin-top: 20px;
	margin-bottom: 20px
}

.button .fas, .button .far {
	margin-right: 6px;
	color: #002883
}
/**/
.title {
	color: #000 !important;
	display: block;
}

.title.close {
	color: #000 !important;
	float: none !important;
	opacity: 1;
}

.title.close:hover {
	color: #000;
	opacity: 1;
}

.title:before {
	content: "\f0fe";
	/* this is your text. You can also use UTF-8 character codes as I do here */
	font-family: "Font Awesome 5 Free";
	margin-right: 8px;
}

.title.close:before {
	content: "\f146";
	/* this is your text. You can also use UTF-8 character codes as I do here */
	font-family: "Font Awesome 5 Free";
	margin-right: 8px;
	font-weight: 300;
}

.title:before, .title.close:before {
	margin-right: 8px;
}

.accordion {
	color: #000 !important
}

.accordion:hover {
	cursor: pointer
}
/* ---------------- tables ----------------*/

/* normal table*/
table.item-box {
	margin-top: 50px;
	width: 700px
}

table.item-box thead {
	background-color: #efefef
}

table.item-box td, table.item-box th {
	border: 1px solid #000 !important;
	margin-top: 50px;
	width: 100px
}

/* css table */
div.css-table {
	border: 1px solid #333;
	margin-top: 20px;
	margin-bottom: 20px
}

div.css-table.grey {
	border: 1px solid #333;
	margin-top: 20px;
	margin-bottom: 20px
}

div.css-table.grey .table-cell {
	display: table-cell;
	border: 1px solid #333;
	width: 20%;
	text-align: center;
	padding: 1rem
}

.css-table {
	display: table;
	width: 640px;
}

.table-row {
	display: table-row;
}

.table-cell {
	display: table-cell;
	border: 1px solid #333;
	width: 20%;
	text-align: center;
	padding: 1rem
}

.table-cell.heading {
	background-color: #ddd !important;
	color: #000
}

.table-cell.heading .blue, .table-cell.heading strong.blue, .blue {
	color: #0f7acb;
}

.status-block {
	width: 1em
}

/* left aligned */
.css-table.left-aligned .table-cell {
	text-align: left
}

strong {
	font-family: arial;
}
/*-------------- rpt block--------------*/
.content .rpt-text-center.rpt-container__tabular-row {
	display: block;
}

.margin-bottom {
	margin-bottom: 10px
}

/* ------------- text  ----------------*/
.wep p, ul li, .rpt-header-lg, h1, h2, h3, div, .rpt-text-ti {
	font-family: arial !important
}

.wep, .wep p, p, ul li, div {
	font-size: 1em !important
}

.box-label {
	width: 100%
}

.italics, h3 .italics {
	font-style: italic;
}

.bold {
	font-weight: bold
}

/* ------------- rpt  -------------*/
.accordion{margin-top:25px;}
button.btn.accordin-heading{border:0!important, padding:.7rem}

#agenda-item-accordion h2 .publishing-status{font-size:70%;}

/* to remove separator line when it is in council context (within accordion)*/
.accordion#agenda-item-accordion .card-body .item-separator.no-print:first-child{display:none;}
/* ------------- footer  -------------*/
.footer {
	background-color: #165788 !important;
	color: #fff !important;
	margin-bottom: 0;
	bottom: 0px;
	width: 100% !important;
	text-align: left;
	padding: 1em 2em;
	bottom: 0;
	margin-top: 0;
	height:80px;
	font-weight:500;
}


.footer a, .footer a:link, .footer a:visited, .footer a:active {
	color: #fff !important;
}

.footer .container-fluid{padding:0; margin-top:0;margin-bottom:0;}


.skiptranslate.goog-te-gadget {
	color: #000;
}

/* smaller screens*/

/*--------------------- ipad landscape/ portrait res -----------------*/

/* Portrait and Landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1180px) {
	.report #sharebutton .btn.btn-share
	{
	position:fixed; 
	right:5px;
	top:85px; 
	
	}
	
    #btPrint,input[type=button].increase-text,input[type=button].decrease-text {
         display:none
    }
    
    .mimic-cot-header{padding-bottom:10px;}
    

}


@media ( min-width : 992px) {
}
/*--------------------- Ipad Pro media queries -------------------*/
/* ----------- iPad Pro ----------- */
/* Landscape*/
@media only screen and (min-device-width: 1366px) and
	(max-device-height: 1024px) and (-webkit-min-device-pixel-ratio: 2) and
	(orientation: landscape) {
}
/* Portrait*/
@media only screen and (min-device-width: 1024px) and
	(max-device-height: 1366px) and (-webkit-min-device-pixel-ratio: 2) and
	(orientation: portrait) {
}
/* ------------------ small screen ------------------------------*/

@media only screen and (min-device-width: 320px) and (max-device-width:
	768px) {
	.button-bar{margin-top:5px;}
	.report #sharebutton .btn.btn-share
	{
	position:fixed; 
	right:5px;
	top:85px; 
	}
	#btPrint{display:none;}
	.mimic-cot-header .button-bar{height:0}

.report-table dd{padding:10px;}
.report-table .col-md-6 {
margin-bottom:5px; 
padding-left:0px;!important
}
.report-table .col-md-6 dd{line-height:150%;}
	
	.footer{
	height:56px;
}
	
}

@media only screen and (min-device-width: 320px) and (max-device-width:
	600px) {

	.header h1 {
		font-size: 2rem;
		display: inline-block;
		text-align: left;
	}
	.logo-img {
		display: inline-block;
		width: 30% !important;
	}
	.css-table {
		width: 100%
	}
	.btn {
		margin-bottom: 10px
	}
	a {
		word-break: break-all;
	}
	.actions button, .actions input[type="button"], .actions input[type=button]:not(:disabled), .actions button:not(:disabled){display:none}
		.footer {
	height:56px;
}
}

@media ( max-width : 600px) {
.actions button, .actions input[type="button"], .actions input[type=button]:not(:disabled), .actions button:not(:disabled){display:none}
	
}

/*ipad and iphone*/
@media only screen and (min-device-width: 0px) and (max-device-width:1024px) {
	
}
/*ipad and iphone not including pro*/
@media only screen and (min-device-width: 0px) and (max-device-width:1000px) {
	.actions button, .actions input[type="button"], .actions input[type=button]:not(:disabled), .actions button:not(:disabled){display:none}{display:none}
}

/* iphone portrait*/
@media only screen and (max-width:460px),(min-device-width:0px) and (max-device-width:460px) {

/* heading*/

/**/
.header {
	background-color: #165788;
	color: #fff;
	margin-top: 0;
	top: 0px;
	padding: 2em 0em 0em 0em;
}

header.header .header-text h1 {
	padding-top: 0.5em;
	text-align: left;
}

.header .col-xs-5 {
	float: right
}

/* report heading */
.header.report-header .cot-logo{margin-bottom:10px; margin-top:10px;}

.header.report-header .heading-title h1 {
	text-align: left!important;
}

.header.report-header .heading-title h1 small.text-muted{margin-top:0.2em}


/* content */
/* this is to change the table to read vertically in small screen */
div.css-table {
	border: 1px solid #ddd;
	margin-top: 20px;
	margin-bottom: 20px;
}

.css-table {
	display: block;
	width: 100%;
	text-align: left;
	border: 0px;
	background-color: #fff;
}

.table-row {
	display: block;
	border: 0px
}

.table-cell {
	display: block;
	text-align: left;
	padding: 20px;
	width: 100%;
	border: 1px solid #ddd;
}

.status-block {
	width: 1em
}

}

/**/

/* ------------- print  -------------*/
.content {
	width: 100%;
}

@media print {
	main {
	width: 1050px;
}
	
	.content-page {
	
}
	.wep p, ul li, .rpt-header-lg, div {
		font-size: 16pt;
		font-family: arial !important
	}
	.actions{display:none}
	.wep, .wep p, p, ul li, div {
		font-size: 16pt !important
	}
	.report-header h1{font-weight:bold;display:block; padding-bottom: 30px;}
	.btn, .button, .addthis_toolbox.hidden-print, .footer, header, .no-print {
		display: none
	}
	.d-print-block, .print-only {
		display: block
	}
	.table-cell.heading .blue, .table-cell.heading strong.blue, .blue {
		color: #000
	}
	th {
		background-color: #fff
	}
	.table-cell.heading {
		background-color: #fff !important
	}
	
	  .mimic-cot-header{padding-bottom:10px}
	  .button-bar{height:5px;}
	
}