/*
Theme Name: Twenty Twelve Guelph
Theme URI: htp://guelph.ca
Description: Child theme of Twenty Twelve theme
Author: Greg and Kim
Author URI: http://guelph.ca
Template: twentytwelve
Version: 1.0
*/


@import url("../twentytwelve/style.css");

/*iframed*/
iframe{display:block;margin:0 auto;}
/* ######### CSS for Shade Tabs. Remove if not using ######### */

.site {
    margin: 2px auto;
    max-width: 100%;
    overflow: hidden;
padding: 0px;
}

@media screen and (min-width: 600px){
#primary-fullwidth {
float: none;
    width: 100%;
}
}

#main.wrapper-fullwidth {
    margin: 0 auto;
    max-width: 100%;
    overflow: hidden;
}

.row {
    margin-right: -3px;
    margin-left: -3px;
}

#masthead {
background-color: #00a6e5;
}

body.mceContentBody {
	background-color:#FFF !important;
	padding: 0.6em;
	margin: 0;
}

.site-header {
margin: 0px !important;
}

#main.wrapper {
    margin: 0 auto;
    max-width: 1200px;
    overflow: hidden;
}

img#site-logo {
padding-left: 10px;
}

/* fonts */
body {
color: #474747;

}


h1.entry-title {
font-weight:bold !important;
font-size: 28px;
}


@media screen and (min-width: 600px) {
.entry-header .entry-title {
    font-size: 30px;
font-size: 1.875rem
}
}

/* Hides sidebar on mobiles in Potrait mode */
@media only screen 
and (max-width : 320px) {
	.widget-area {
		display:none;
	}
}
 
 
/* Hides sidebar on mobiles in landscape mode */
@media only screen 
and (min-width : 321px) 
and (max-width : 480px) {
	.widget-area {
		display:none;
	}
}

.et_divi_builder #et_builder_outer_content .et_pb_title_container h1 {
  font-size: 64px !important;
} 


h2 {
font-size:160% !important;
font-weight:bold;
}

h3 {
font-size:130% !important;
font-weight:bold;
}

h4 {
font-size:120% !important;
font-weight:bold;
}

h5 {
font-size:100% !important;
font-weight:bold;
}

h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
color: #474747;
font-size:80%;
}

h2.panel-title {
margin: 12px 24px;
font-size:140% !important;	
}

.panel-default{
background-color: #f0f0f0;
}

.panel-default>.panel-heading {
    color: #333;
    background-color: #f0f0f0;
    border-color: #ddd;
padding: 0px 15px !important; 
}

.panel-heading a:after {
    font-family:'Glyphicons Halflings';
    content:"\e114";
margin-top:5px;
    float: right;
    color: #000;
}
.panel-heading a.collapsed:after {
    content:"\e080";
}

.panel-title a {
color:##1b6181 !important;
}

.widget-title, .entry-content th, .comment-content th {
    text-transform: none !important;

}

.entry-content table {
color: #474747;
}

.entry-content table caption {
color: #474747;
}

ol.d {list-style-type: lower-alpha;}

.entry-content ol,
.comment-content ol {
	list-style: disc outside none;
}

.widget-title a:visited {
    color: #337ab7 ;
}


.widget-area .widget a:visited {
    color: #337ab7;
}

.widget-area .widget a {
    color: #337ab7;
}

.btn {
font-weight: 600;
border-radius:0px;
}

.btn .btn-success a:visited {
    color: #fff !important;
}



/* post snippets label position */

#post-snippets-dialog label {
width: 100px !important;
}


/* bootstrap pagination colours */
	
.orangeNav .pagination>li>a,
.orangeNav .pagination>li>span {
  border: 1px solid #d24728;
  border-color: #d24728;
  color:#d24728;
}

.orangeNav .pagination>.active>a, 
.orangeNav .pagination>.active>a:focus, 
.orangeNav .pagination>.active>a:hover, 
.orangeNav .pagination>.active>span, 
.orangeNav .pagination>.active>span:focus, 
.orangeNav .pagination>.active>span:hover {
  background: #d24728;
  color: #fff;
}

.blueNav .pagination>li>a,
.blueNav .pagination>li>span {
  border: 1px solid #018ec6;
  border-color: #018ec6;
  color:#018ec6;
}

.blueNav .pagination>.active>a, 
.blueNav .pagination>.active>a:focus, 
.blueNav .pagination>.active>a:hover, 
.blueNav .pagination>.active>span, 
.blueNav .pagination>.active>span:focus, 
.blueNav .pagination>.active>span:hover {
  background: #018ec6;
  color: #fff;
}

.greenNav .pagination>li>a,
.greenNav .pagination>li>span {
  border: 1px solid #0F8B44;
  border-color: #0F8B44;
  color:#0F8B44;
}

.greenNav .pagination>.active>a, 
.greenNav .pagination>.active>a:focus, 
.greenNav .pagination>.active>a:hover, 
.greenNav .pagination>.active>span, 
.greenNav .pagination>.active>span:focus, 
.greenNav .pagination>.active>span:hover {
  background: #0F8B44;
  color: #fff;
}



.entry-content a:visited, .comment-content a:visited {
    color:#337ab7;
}


div.well {
font-size: 120%;
}

div.well ul li {
margin-bottom: .5em;
}


a {
color: #337ab7;
font-weight:600;
}

a.prettylink {
color: #337ab7 !important;
font-weight:600;
}

/* increases contrast on widget text to meet WCAG standards */


ul#contentnavlist a:visited {
    color: #337ab7;
}


a.btn.btn-success {
color: #fff !important;
background-color: #008A00;
}

.tab-pane {
margin: 0 0 0 0 !important;
}

.tabbable ul li {
margin: 0 0 0 1 !important;
}

.nav-justified>li {
border: 1px solid silver;
}


ul.nav.nav-pills.nav-justified li.active {
background-color:#007fb0;
}

/* breadcrumb style */
#breadcrumbs {
margin-bottom: 20px;
font-size:80%;}


/* adds hidden text in span tag as recommended by W3C - used in views for transit routes, council/committee agendas etc */
.hideStuff{
height:1px;
width: 1px;
position: absolute;
overflow: hidden;
top: -10px;
}

/* fixes spacing and removes title from homepage*/
.site-header {
padding-bottom: 0rem;}

.home .entry-title {
display:none;
}

/* removes shadow around images in content section */
.entry-content img {
box-shadow: 0 0 0 0;
border-radius: 0px;
margin-bottom:10px;
}




/* various box styles */

/* just colour no link */

.colourBox .btn {
color: #fff;
font-size: 1.1em;
background-color: transparent;
box-shadow: none;
border: 0px;
}

.colourBox .btn:hover {
color: #ccc;
box-shadow: none;
background-image: none;
border: 0px;
}

.colourBox .btn:focus {
color: #fff;
box-shadow: none;
background-image: none;
border: 0px;
}

.colourBox .bullet ul li {
list-style: initial;
font-size:90%;
}

.colourBox .bullet ul li ul li {
margin-left:15px;
}

.colourBox {
display:block;
width:97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
color: #fff;
font-size:120%;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-bottom:1.5em;
line-height: 1.5;
}

.colourBox a {
color:#fff;
font-weight: 200;
}

.colourBox a:visited {
color:#fff;
font-weight: 200;
}

.colourBox ul  li {
line-height: 1.5;
margin-left:0px;
}

.colourBox ul  {
list-style:none !important;

}

.colourBox span {
font-weight:200;
font-size:140%;
line-height:30px;
margin: 0;
padding: 0;
}

.colourBoxHeader {
display:block;
width:100%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
color: #fff;
font-size:120%;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-bottom:1.5em;
line-height: 1.5;
}

.colourBoxHeader h2 {
padding-top: 0px;
padding-bottom: 0px;
font-weight:400;
margin: 0px;
}

.boxOrange {
background-color: #d14625;
}

.boxBlue {
background-color: #007fb0;
}

.boxRed {
background-color: #AC193D;
}

.boxPurple {
background-color: #8C0095;
}

.boxGreen {
background-color: #008A00;
}

.boxYellow {
background-color: #b69000;
}

.boxDark-purple {
background-color: #5133AB;
}

.boxTeal {
background-color: #008299;
}

.boxSky-blue {
background-color: #094AB2;
}

.boxPink {
background-color: #d81777;
}

.accordion-body.in.collapse:focus {
outline: 0px !important;
}

/* various colour blocks - entire block is a link */
.orange-block-top {
display:block;
background-color: #d14625;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;
font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}



.orange-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.orange-block-top:hover {
text-decoration:none;
background-color: #DC572E;
color: #fff !important;
cursor: pointer;
}

.orange-block {
display:block;
background-color: #d14625;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;
font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.orange-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.orange-block:hover {
text-decoration:none;
background-color: #DC572E;
color: #fff !important;
cursor: pointer;
}

.pink-block-top {
display:block;
background-color: #d81777;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.pink-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.pink-block-top:hover {
text-decoration:none;
background-color: #e82788;
color: #fff !important;
cursor: pointer;
}

.pink-block {
display:block;
background-color: #d81777;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;
font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.pink-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.pink-block:hover {
text-decoration:none;
background-color: #e82788;
color: #fff !important;
cursor: pointer;
}

.blue-block-top {
display:block;
background-color: #007fb0;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.blue-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.blue-block-top:hover {
text-decoration:none;
background-color: #2e8def;
color: #fff !important;
cursor: pointer;
}

.blue-block {
display:block;
background-color: #008ec6;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.blue-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.blue-block:hover {
text-decoration:none;
background-color: #2e8def;
color: #fff !important;
cursor: pointer;
}

.red-block-top {
display:block;
background-color: #AC193D;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.red-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.red-block-top:hover {
text-decoration:none;
background-color: #BF1E4B;
color: #fff !important;
cursor: pointer;
}

.red-block {
display:block;
background-color: #AC193D;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.red-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}



.red-block:hover {
text-decoration:none;
background-color: #BF1E4B;
color: #fff !important;
cursor: pointer;
}

.purple-block-top {
display:block;
background-color: #8C0095;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.purple-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.purple-block-top:hover {
text-decoration:none;
background-color: #A700AE;
color: #fff !important;
cursor: pointer;
}


.purple-block {
display:block;
background-color: #8C0095;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.purple-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.purple-block:hover {
text-decoration:none;
background-color: #A700AE;
color: #fff !important;
cursor: pointer;
}

.green-block-top {
display:block;
background-color: #008A00;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.green-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.green-block-top:hover {
text-decoration:none;
background-color: #00A600;
color: #fff !important;
cursor: pointer;
}

.green-block {
display:block;
background-color: #008A00;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.green-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.green-block:hover {
text-decoration:none;
background-color: #00A600;
color: #fff !important;
cursor: pointer;
}

.yellow-block-top {
display:block;
background-color: #b69000;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.yellow-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.yellow-block-top:hover {
text-decoration:none;
background-color: #c39a00;
color: #fff !important;
cursor: pointer;
}


.yellow-block {
display:block;
background-color: #987700;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.yellow-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.yellow-block:hover {
text-decoration:none;
background-color: #c39a00;
color: #fff !important;
cursor: pointer;
}

.dark-purple-block-top {
display:block;
background-color: #5133AB;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.dark-purple-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.dark-purple-block-top:hover {
text-decoration:none;
background-color: #643EBF;
color: #fff !important;
cursor: pointer;
}

.dark-purple-block {
display:block;
background-color: #5133AB;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.dark-purple-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.dark-purple-block:hover {
text-decoration:none;
background-color: #643EBF;
color: #fff !important;
cursor: pointer;
}

.teal-block-top {
display:block;
background-color: #008299;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.teal-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.teal-block-top:hover {
text-decoration:none;
background-color: #00A0B1;
color: #fff !important;
cursor: pointer;
}

.teal-block {
display:block;
background-color: #008299;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}



.teal-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.teal-block:hover {
text-decoration:none;
background-color: #00A0B1;
color: #fff !important;
cursor: pointer;
}

.sky-blue-block-top {
display:block;
background-color: #094AB2;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
}

.sky-blue-block-top span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.sky-blue-block-top:hover {
text-decoration:none;
background-color: #0A5BC4;
color: #fff !important;
cursor: pointer;
}

.sky-blue-block {
display:block;
background-color: #094AB2;
width: 97%;
padding-top: 15px;
padding-bottom: 15px;
padding-left:15px;
font-weight:normal;
color: #fff !important;

font-size:120%;
cursor: default;
-webkit-transition: 0.1s all;
-moz-transition: 0.1s all;
-ms-transition: 0.1s all;
transition: 0.1s all;
margin-top:1.5em;
}

.sky-blue-block  span {
font-weight:200;
font-size:140%;
line-height:30px;
}


.sky-blue-block:hover {
text-decoration:none;
background-color: #0A5BC4;
color: #fff !important;
cursor: pointer;
}

a:visited.red-block-top, a:visited.red-block, a:visited.purple-block, a:visited.purple-block-top,a:visited.yellow-block, a:visited.sky-blue-block, a:visited.sky-blue-block-top, a:visited.blue-block, a:visited.blue-block-top, a:visited.green-block, a:visited.green-block-top, a:visited.orange-block, a:visited.teal-block, a:visited.teal-block-top, a:visited.dark-purple-block, a:visited.dark-purple-block-top, a:visited.orange-block-top, a:visited.pink-block {
color: #fff !important;
}

/* ===[ footer area for widgets ]=== */

#footer-wrapper {
border-top: none;
background: #282828;
height: 100%;
padding-left: 40px;
padding-right: 40px;
bottom: 0;
}


.site-info { clear: both; }

#footer-widgets {
width: 100%;
border-top: none;
}

#footer-widgets .widget li { list-style-type: none; }
.template-front-page #footer-widgets { padding-top: 0; }

@media screen and (min-width: 600px) {

#footer-widgets.three .widget {
float: left;
margin-right: 3.7%;
width: 30.85%;
clear: none;
}

#footer-widgets.three .widget + .widget + .widget { margin-right: 0;}

footer[role="contentinfo"] {
border-top: 0;
font-size:100%;
margin-top: 0px;
line-height: 1.5em;
color: #ffffff;
}

footer[role="contentinfo"] a {
color: #f28433;
}

footer[role="contentinfo"] a:hover {
color: #ffffff;
}
}

/*side navigation widget */
#contentnav
{

margin:30px 0 0;
padding: 0;
  -webkit-border-radius: 0px;
     -moz-border-radius: 0px;
          border-radius: 0px;
			
}

#contentnavlist li ul
{margin-left:0
}


h3.widget-title .content_nav_header {
font-size:120%;
}

.level_1.active_section {
font-size: 115%;
background-color:#222 !important;
color: #fff !important;
display:block;
margin: 0 0 -1px;
padding: 8px 14px;
border: 1px solid #e5e5e5;
font-weight: bold;
  -webkit-border-radius: 0px;
     -moz-border-radius: 0px;
          border-radius: 0px;
list-style: circle;
}

.level_1.active_section:hover {
background-color:#f5f5f5;
color:#222;
}

.level_1.active {
color: #fff !important;
background-color:#222 !important;
font-size: 115%;
display:block;
margin: 0 0 -1px;
padding: 8px 14px;
border: 1px solid #e5e5e5;
font-weight: bold;
  -webkit-border-radius: 0px;
     -moz-border-radius: 0px;
          border-radius: 0px;
}




.smallerheader {
font-size: 14px !important;
margin: 3px !important;
}



li.page_item .level_2  {
font-size: 100%;

			
display:block;
margin: 0 0 -1px;
padding: 8px 14px;
border: 1px solid #e5e5e5;

}

li.page_item .level_2:hover  {
background-color:#f5f5f5;
}

.page_item .current_page_item .level_2.active
{
background-color:#007fb0;
color:white !important;
}

.page_item .current_page_item .level_2.active:hover
{
background-color:#007fb0;
color:#fff !important;
}

.widget-area .widget li.page_item .current_page_item
{
color:white;
}

.nobullet li {
list-style:none;
margin-left:5px;
}

.nobullet li ul li {
margin-left:10px;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 5px;
    padding-left: 5px; 
}

/* Special responsive grid spacing styles - social media accounts page
-------------------------------------------------- */

.show-grid {
  margin-top: 15px;
  margin-bottom: 0px;
  border-bottom: 1px dotted silver;
}
.show-grid [class*="span"] {
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;

}
.show-grid [class*="span"]:hover {

}
.show-grid .show-grid {
  margin-top: 0;
  margin-bottom: 0;
}
.show-grid .show-grid [class*="span"] {
  margin-top: 2px;
}


.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {
    color: #fff;
    background-color: #007fb0;
}



/* Minimum width of 960 pixels. */
@media screen and (min-width: 960px) {

	body .site {
		padding: 0 0px;
		padding: 0 0rem;
		margin-top: 0px;
		margin-top: 0rem;
		margin-bottom: 0px;
		margin-bottom: 0rem;
		box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
	}

.st-ui-search-input, .st-default-search-input {
    width: 500px !important;
    height: 36px !important;
     font-size: 24px !important;
        }

}

/* css for text homepage (greg_test)
-------------------------------------------------- */
ul#home_menu {
    padding-top: 12px;
padding-bottom: 12px;
margin: 0;
background-color: #E8E8EE;
margin-top: 2px solid #ccc;
}

ul#home_menu li:first-child {
margin-left:10px;
padding: 0px;
}


ul#home_menu li:first-child a {
font-size:1.2rem;
color: #000;
}

ul#home_menu li:first-child a:hover {
    background-color: transparent;
}

ul#home_menu li {
    display: inline;
}


ul#home_menu li a {
    font-size: 1rem;
   color: #000;
    padding: 5px;
    text-decoration: none;
    border-radius: 4px;
}

ul#home_menu li a:hover {
    border: 1px solid #000;
}

h2.homeheader {
font-size: 1.2rem !important;
font-weight: 600;
margin: 5px 0px 10px 0px;
}


/* css for employee directory on iPhone (contacts page)
-------------------------------------------------- */
.myIframe {
position: relative;
padding-bottom: 65.25%;
padding-top: 30px;
height: 0;
overflow: hidden; 
-webkit-overflow-scrolling:touch; //<<--- THIS IS THE KEY 
border: solid black 1px;
} 

.myIframe iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

@media only screen and (max-device-width: 640px) {
   .myIframe {
   overflow: auto; 
} 
.site-content {
margin:15px;
}
}


/* css for colour blocks for transit
-------------------------------------------------- */

.pink2-block {
    display: block;
    background-color: #ec008c;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.violet-block {
    display: block;
    background-color: #91469b;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.bluegreen-block {
    display: block;
    background-color: #1988B7;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}


.deepred-block {
    display: block;
    background-color: #921B1E;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.muteorange-block {
    display: block;
    background-color: #ED1C24;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.deeppurple-block {
    display: block;
    background-color: #682C91;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}


.bluegreen2-block {
    display: block;
    background-color: #0082B1;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.richpink-block {
    display: block;
    background-color: #A54686;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.richpink-block {
    display: block;
    background-color: #A54686;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.bluegreen2-block {
    display: block;
    background-color: #5C7AAE;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.coolgreen-block {
    display: block;
    background-color: #008290;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.warmpurple-block {
    display: block;
    background-color: #811167;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.greygreen-block {
    display: block;
    background-color: #485E88;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.tan-block {
    display: block;
    background-color: #8F7140;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.richgreen-block {
    display: block;
    background-color: #29712A;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.richorange-block {
    display: block;
    background-color: #CB640A;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.mutegreen-block {
    display: block;
    background-color: #556940;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.seagreen-block {
    display: block;
    background-color: #005689;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}


.olivegreen-block {
    display: block;
    background-color: #405D18;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.green2-block {
    display: block;
    background-color: #4F832E;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}

.blue4-block {
    display: block;
    background-color: #0082b1;
    width: 97%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    font-weight: normal;
    color: #fff !important;
    font-size: 120%;
    cursor: default;
    -webkit-transition: 0.1s all;
    -moz-transition: 0.1s all;
    -ms-transition: 0.1s all;
    transition: 0.1s all;
    margin-top: 1.5em;
}


.blue4-block-block:hover, .violet-block:hover,  .pink2-block:hover, .bluegreen-block:hover, .deepred-block:hover, .muteorange-block:hover, .deeppurple-block:hover, .bluegreen2-block:hover, 
.richpink-block:hover, .bluegreen2-block:hover, .coolgreen-block:hover, .warmpurple-block:hover, .greygreen-block:hover, .tan-block:hover, .richgreen-block:hover, .richorange-block:hover, .mutegreen-block:hover, .olivegreen-block:hover, 
.seagreen-block:hover, .green2-block:hover{
    text-decoration: none;
    opacity: .9;
    color: #fff !important;
    cursor: pointer;
}


.blue4-block span, .violet-block span,  .pink2-block span, .bluegreen-block span, .deepred-block span, .muteorange-block  span, .deeppurple-block span, .bluegreen2-block span, 
.richpink-block span, .bluegreen2-block span, .coolgreen-block span, .warmpurple-block span, .greygreen-block span, .tan-block span, .richgreen-block span, .richorange-block span, .mutegreen-block span, 
.seagreen-block span, .olivegreen-block span, .green2-block span{
font-weight:200;
font-size:140%;
line-height:30px;
}
