/*======================================================
  sitecontent.CSS
  ======================================================
    1.  TEXT STYLES
    2.  TABLES
    3.  FORMS
    4.  BUTTONS
    5.  HELPER CLASSES
    6.  ACCORDIONS
    7.  MEDIA QUERIES
			- Tablet
            - Mobile

  ===================================================== */

/*======================================================
  1. TEXT STYLES
  ===================================================== */

body {
    font: 17px/24px "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #000;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.333em;
    font-weight: normal;
}

h1 {
    font-size: 2.000em; /* 34pt */
    font-weight: normal;
    padding: 0;
    margin: 0;
    text-align: left;
}

    h1.hidden {
        height: 1px;
        width: 1px;
        visibility: hidden;
        position: fixed;
        top: 0;
        right: 0;
    }

h2 {
    font-size: 1.529em; /* 26pt */
    margin: 15px 0;
    padding: 0;
}

h3 {
    font-size: 1.294em; /* 22pt */
    margin: 15px 0;
    padding: 0;
}

h4,
h5,
h6 {
    font-size: 1.176em; /* 16pt */
    margin: 15px 0;
    padding: 0;
}

#printArea .intro {
    font-size: 1.125em;
    color: #000;
}

#printArea .caption {
    font-size: 11px;
    font-style: italic;
    line-height: 15px;
}


.eSolutionsGroupPhotoGalleryV2PlaceholderDiv .ad-image-description {
    margin: 0px !important;
}

/* Blockquotes */

blockquote {
}

    blockquote .quoteText {
        font-family: Georgia, sans-serif;
        font-size: 1.25em;
        line-height: 1.25em;
        margin-bottom: 20px;
    }

/* Link Colors */

a, a:link, a:visited {
    color: #005696;
	font-weight: 600;
    text-decoration: none;
}

    a:hover, a:active, a:focus {
        text-decoration: underline;
    }

a[href^=tel] {
	color: #000;
	cursor: default;
}

a[href^=tel]:hover, a[href^=tel]:active, a[href^=tel]:focus {
	text-decoration: none;
}

@media screen and (max-width: 767px) {
	a[href^=tel] {
		color: #005696; 
	}
}


/* Ensuring content-related lists display properly in content areas */
/* list-style-position:inside; for IE */

#printArea ul {
    margin: 10px 0px 10px 30px;
    padding: 0;
}

#printArea ol {
    margin: 10px 0px 10px 30px;
    padding: 0;
}

#printArea li {
    margin: 5px 0px 5px 0px;
}

#printArea li p {
    display: inline;
}


/* fix for showing bullets on photo gallery images */
#contentInt .ad-nav ul li {
    list-style: none !important;
}


/*======================================================
  2. TABLE STYLES
  ===================================================== */

.datatable, .datatableHighlight {
    margin: 0px 0px 15px 0px;
    padding: 0;
    width: 100%;
}

    .datatable td, .datatableHighlight td, .datatable th, .datatableHighlight th {
        padding: 7px 10px;
        color: #333;
    }

   

    .datatable .titlerow, .datatableHighlight .titlerow {
        background: #d0e1ef;
        text-align: left;
        font-size: 1em;
        color: #000;
        font-weight: bold;
    }
	
	.datatableHighlight .titlerow td:first-child{
		background: #c2d7e9;
        font-weight:bold;
	}

        .datatable .titlerow td, .datatableHighlight .titlerow td { 
            color: #000;
        }

        .datatable .titlerow h2, .datatableHighlight .titlerow h2{
            color: #000 !important;
        }

    .datatable caption, .datatableHighlight caption {
        text-align: left;
    }

.datatable .altrow, .datatableHighlight .altrow { background: #e6eff6;  }
	
	.datatableHighlight .altrow td:first-child{ background: #d6e4f0; font-weight:bold;}
	
    .datatable .row, .datatableHighlight .row {
        background: #fff;
    }
	
	.datatableHighlight .row td:first-child{ background: #edf4f9; font-weight:bold; }

    .datatable td p, #printArea .datatable td p, td p, .datatableHighlight td p, #printArea .datatableHighlight td p, td p, #printArea td p {
        margin: 7px 0 0 0;
    }

        .datatable td p:first-child, #printArea .datatable td p:first-child, .datatableHighlight td p:first-child, #printArea .datatableHighlight td p:first-child {
            margin: 0 !important;
        }

        td p:first-child, #printArea td p:first-child {
            margin: 0 !important;
        }

sub {
    font-size: 80%;
}

sup {
    font-size: 80%;
}

hr {
    display: block;
    border: none;
    height: 1px;
    color: #ccc;
    background-color: #ccc;
    margin: 20px 0;
}

/*======================================================
  3. FORM STYLES (DEFAULT STYLES IN BASE.CSS)
  ===================================================== */

::-webkit-input-placeholder {
    color: #000;
	opacity: 1;
}

:-moz-placeholder { /* Firefox 18- */
    color: #000;
	opacity: 1;
}

::-moz-placeholder { /* Firefox 19+ */
    color: #000;
	opacity: 1;
}

:-ms-input-placeholder {
    color: #000;
	opacity: 1;
}

.formField {
    width: 100%;
    margin: 6px 0;
}

input[type="text"], input[type="date"], select {
    width: 100%;
    height: 30px;
    padding: 3px 7px;
    -webkit-appearance: none;
    border: solid 1px #ccc;
}

textarea {
    width: 100% !important;
    min-height: 144px;
    padding: 7px;
    border: none;
    outline: none;
    -webkit-appearance: none;
    border: solid 1px #ccc;
}

input[type="button"] {
    border: none;
    outline: none;
    box-shadow: none;
    -webkit-appearance: none;
}

select[multiple] {
    min-height: 185px;
}


/*======================================================
  4. BUTTONS
  ===================================================== */

.button, a.button, button {
    cursor: pointer;
    border: none;
    display: inline-block;
    padding: 10px;
    margin: 3px 3px 3px 0;
    color: #fff !important;
    text-align: center;
    font-size: .9em;
    font-weight: 700;
    background: #005696;
    -webkit-transition: background 0.1s ease-in;
    -moz-transition: background 0.1s ease-in;
    -ms-transition: background 0.1s ease-in;
    -o-transition: background 0.1s ease-in;
    transition: background 0.1s ease-in;
    -webkit-backface-visibility: hidden;
    -webkit-appearance: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.myZone .button.arrowButton {
    clear: both;
    text-align: left;
    background-image: url(../images/structure/chevron-right-white.png); 
    background-position: 95% center;
    background-repeat: no-repeat;
    display: block;
    margin: 5px 0;
    padding-right: 40px;
}

    .button:hover, .button:active, a.button:hover, a.button:active, button:hover, button:active {
        text-decoration: none;
    }

/* Page Subscription */

#pageSubscription{
	float: left;
	display: block;
	width: 100%;
	clear: both;
	padding: 10px 20px 10px 40px;
	color: #FFF !important;
	font-weight: bold;
	margin: 20px 0 0 0;
	overflow: hidden;
	box-shadow: 1.5px 2.598px 3px 0px rgba(0, 0, 0, 0.30);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-image: url(../images/actions/icon_subscribe2x.png);
	background-position: 13px center;
	background-repeat: no-repeat;
	background-size: auto 13px;
	background-color: #ae0a0a;
}

.no-backgroundsize #pageSubscription{
	background-image: url(../images/actions/icon_subscribe.png);
}


/*======================================================
  5. HELPER CLASSES
  ===================================================== */

/*======required (MUST SUPPORT WHITE TEXT) ======= */

.headingBackgroundColour { background-color: #005696 !important; }

/*=============================================== */

#printAreaContent img {
    max-width: 100%;
    height:auto;
}

img.ImageLeft, img.imageLeft, img.Left, .Left iframe {
    float: left;
    margin: 0 20px 20px 0;
    padding: 1px;
}

img.ImageRight, img.imageRight, img.Right, .Right iframe {
    float: right;
    margin: 0 0 20px 20px;
    padding: 1px;
}

img.Center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    clear: both;
}

.Center, .alignCenter {
    text-align: center;
}

.Left, .alignLeft {
    text-align: left;
}

.Right, .alignRight {
    text-align: right;
}

table.Left {
    margin-right: auto;
}

table.Right {
    margin-left: auto;
}

table.Centre {
    margin-right:auto;
    margin-left:auto;
}

.inline {
    display: inline;
}

.inlineBlock {
    display: inline-block;
}

.noMarginTop {
    margin-top: 0;
}

.noMarginBottom {
    margin-bottom: 0;
}

.noMarginLeft {
    margin-left: 0;
}

.noMarginRight {
    margin-right: 0;
}

.width100 {
    width: 100%;
}

.HighlightOrange, .HighlightPurple, .HighlightGreen, .ServiceOshawaOnline {
	padding: 8px 20px;
	width: auto;
	overflow: hidden;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.HighlightOrange img.ImageLeft, .HighlightOrange img.imageLeft, .HighlightOrange img.Left, .HighlightOrange .Left iframe,
.HighlightPurple img.ImageLeft, .HighlightPurple img.imageLeft, .HighlightPurple img.Left, .HighlightPurple .Left iframe,
.HighlightGreen img.ImageLeft, .HighlightGreen img.imageLeft, .HighlightGreen img.Left, .HighlightGreen .Left iframe,
.ServiceOshawaOnline img.ImageLeft, .ServiceOshawaOnline img.imageLeft, .ServiceOshawaOnline img.Left, .ServiceOshawaOnline .Left iframe {
    float: left;
    margin: 0 20px 0px 0;
    padding: 1px;
}

.HighlightOrange img.ImageRight, .HighlightOrange img.imageRight, .HighlightOrange img.Right, .HighlightOrange .Right iframe,
.HighlightPurple img.ImageRight, .HighlightPurple img.imageRight, .HighlightPurple img.Right, .HighlightPurple .Right iframe,
.HighlightGreen img.ImageRight, .HighlightGreen img.imageRight, .HighlightGreen img.Right, .HighlightGreen .Right iframe,
.ServiceOshawaOnline img.ImageRight, .ServiceOshawaOnline img.imageRight, .ServiceOshawaOnline img.Right, .ServiceOshawaOnline .Right iframe {
	float: right;
    margin: 0 0 0px 20px;
    padding: 1px;
}

.HighlightOrange { background: #fef2e3; }
.HighlightPurple { background: #ede4ef; }
.HighlightGreen { background: #ecefc7; }
.ServiceOshawaOnline {background: #e6eff6;}

/*======================================================
  6. ACCORDIONS
  ===================================================== */

.accordionButtons {
    display: flex;
    justify-content: flex-end;
    margin-top: 34px;
    margin-bottom: 15px;
}

.accordionButtons .expandBtn,
.accordionButtons .collapseBtn {
    font-size: 0.824em;
    font-weight: 600;
    color: #030303 !important;
    display: inline-flex;
    align-items: center;
    background-color: transparent;
    border: 1px solid #bfbfbf;
    padding: 8px 11px;
    margin: 0;
    line-height: 1.3;
    border-radius: 2px;
    -webkit-appearance: none;
    -moz-appearance: none;
    box-shadow: none;
    transition: ease background-color 0.3s;
}

.accordionButtons .expandBtn:before,
.accordionButtons .collapseBtn:before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background-size: 18px 18px;
    margin-right: 11px;
}

.accordionButtons .expandBtn:hover,
.accordionButtons .expandBtn:focus,
.accordionButtons .collapseBtn:hover,
.accordionButtons .collapseBtn:focus {
    background-color: #f7f7f7;
}

.accordionButtons .expandBtn {
    margin-right: 12px;
}

.accordionButtons .expandBtn:before {
    background-image: url(../images/structure/Accordion-open.png);
}

.accordionButtons .collapseBtn:before {
    background-image: url(../images/structure/Accordion-close.png);
}

.Accordion {
    margin-bottom: 5px;
}

.AccordionTrigger {
    display: block;
    padding: 8px;
    overflow:hidden;
    padding-right: 60px;
    position: relative;
    border: solid 1px #999;
    background: #fff url(../images/structure/Accordion-open.png) 99% center no-repeat;
    -webkit-box-shadow: 0 3px 3px #999; 
    -moz-box-shadow: 0 3px 3px #999;
    box-shadow: 0 2px 3px #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    .AccordionTrigger:hover,
    .AccordionTrigger:focus
    {
        background-color: #f7f7f7;   
        text-decoration: none;
        cursor: pointer;
    }

    .AccordionTrigger:active {
        background-color: #f7f7f7;   
        text-decoration: none;
        cursor: pointer;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;   
    }
    .AccordionTrigger.open {
        border: solid 1px #ccc;
        background: #fff url(../images/structure/Accordion-close.png) 99% center no-repeat;
        -webkit-border-radius: 3px 3px 0 0;
        -moz-border-radius: 3px 3px 0 0;
        border-radius: 3px 3px 0 0; 
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;   
    }
.AccordionContent {
    padding: 10px;
    border: solid 1px #ccc;
    border-top: none;
    overflow:hidden;
    display: none;
    background: #e6eff6;
    -webkit-border-radius: 0 0 3px 3px;
    -moz-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
}


/* Nested Accordion */

.AccordionContent .AccordionContent {
    background: #fff !important;
}


p.ic-EmptyContent { 
    display:none;
}


/*======================================================
  7. DIRECTORY TABLES
  ===================================================== */

table.DirectoryBoxes {
    table-layout: fixed;
    border-collapse: separate;
    clear: both;
    margin-bottom: 30px;
}

    /* Clear Table */
    table.DirectoryBoxes:before,
    table.DirectoryBoxes:after {
        content: " "; /* 1 */
        display: table; /* 2 */
    }

    table.DirectoryBoxes:after {
        clear: both;
    }

	table.DirectoryBoxes {
		*zoom: 1;
	}
    /* End Clear Table */

    table.DirectoryBoxes td {
        background: #eff1d7;
        vertical-align: top;
        border-right: 8px solid #FFF;
        border-left: 8px solid #FFF;
    }

table.DirectoryBoxes td p {
    margin: 0 !important;
	padding: 8px 10px 8px 15px !important;
}

table.DirectoryBoxes td p.DirectoryImage {
	padding: 0 !important;
}

table.DirectoryBoxes td img {
    width: 100%;
    height: auto;
}

table.DirectoryBoxes .DirectoryTitle {
    width: 100%;
    background: #c2cd24;
    margin: 0 !important;
    padding: 10px 10px 10px 15px !important;
    color: #000;
    font-size: 1em !important;
    font-weight: 600 !important;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-topright: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    overflow: hidden;
}

table.DirectoryBoxes td ul, table.DirectoryBoxes td ol {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    float: left;
    width: 100%;
}

table.DirectoryBoxes td ul a, table.DirectoryBoxes td ol a{
	font-weight: normal;
	color: #000;
}

table.DirectoryBoxes td li {
    margin: 0 !important;
    border-top: 1px solid #d3d3d3;
	overflow: hidden;
}

table.DirectoryBoxes td li a{
	display: block;
	padding: 8px 35px 8px 15px !important;
	background: url(../images/structure/chevron-right-directory2x.png) 95% 15px no-repeat;
	background-size: auto 10px;
}

.no-backgroundsize table.DirectoryBoxes td li a{
	background: url(../images/structure/chevron-right-directory.png) 95% 15px no-repeat;
}

/*
    WIDTH CSS CLASSES
    */
table.DirectoryBoxes-Col33 {
    width: 33%;
}

table.DirectoryBoxes-Col66 {
    width: 66%;
} 
table.DirectoryBoxes-Col100 {
    width: 100%;
}    

/*======================================================
  8. MEDIA QUERIES
  ===================================================== */

/*==================
  Tablet
====================*/

@media only screen and (max-width : 991px) {
    select[multiple] {
        min-height: 0;
    }
	
	#footerWrapper a[href^=tel] {
        color: #fff;
    }
}


/*==================
  Wide Mobile
====================*/

@media only screen and (max-width : 767px) {
	
	a, a:hover {
        text-decoration: none !important;
    }
	
    .ic-form-group {
        text-align: left;
    }

    .xsPadding40 {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .xsPadding20 {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .xsNoGutter {
        padding-left: 0;
        padding-right: 0;
    }

    #footerWrapper a[href^=tel] {
        color: #fff;
    }

    .hideXs {
        display: none;
    }
	
	/*================= IFRAMES */
	  
	  iframe[src*="youtube"] {
		max-width: 100%;
		height: auto !important;
		width: auto !important;
	  }
	  
	 /*=================DIRECOTORY TABLES */
	
    table.DirectoryBoxes {
        margin: 0 !important;
    }

        table.DirectoryBoxes, table.DirectoryBoxes tbody, table.DirectoryBoxes tr, table.DirectoryBoxes td {
            display: block;
            width: 100% !important;
        }

            table.DirectoryBoxes td {
                border: none !important;
                float: left;
                margin: 15px 0 !important;
            }

                table.DirectoryBoxes td img {
                    display: none;
                }
}