/********styles for /EN/residents/transit/riding-with-us/Pages/See%20Something,%20Hear%20Something,%20Say%20Something.aspx***********/
.pageBanner{
	margin-bottom:0px!important
}
.ms-rteElement-cobHighlight{
	border-radius:5px;
	padding-top:10px;
	padding-bottom:10px;
}

@media (min-width:768px){
.ms-rteElement-cobHighlight{width:70%;
}
}
@media (min-width:999px){
.ms-rteElement-cobHighlight{width:60%;
}
}
/************general styles**********/
h2 i.fa{color:#0056AC; margin-right:6px;} /*font awesome icons*/
.line-divider{
	border-top:1px solid #E8E8E8; padding-top:15px; margin-top:15px;
}

/********service improvments**********/
.container .transit.jumbotron{
	padding:30px;
	border-radius:3px;
}
.container .transit.jumbotron.text-center h2{margin-top:0px;}
.container .transit.jumbotron.text-center p:first-line{font-size:150%;}
.container .transit.jumbotron.text-center p{
	font-weight:600
}
.row.jumbos{margin-top:30px;}
.container .jumbos .transit.jumbotron{padding:15px;}
@media (min-width:768px){.jumbos .transit.jumbotron{height:210px;}}
@media (min-width:999px){.jumbos .transit.jumbotron{height:180px;}}
@media (min-width:1200px){.jumbos .transit.jumbotron{height:auto;}}

/*************veterans pass button**************/
.veteranPass.btn { 
	width:100%;
    border-radius: 3px;
    margin-top:15px;
    margin-bottom:15px;
    -webkit-box-shadow: inset 110px 0px 289px -88px rgba(0,0,0,0.5);
    -moz-box-shadow: inset 110px 0px 289px -88px rgba(0,0,0,0.5);
    box-shadow: inset 110px 0px 289px -88px rgba(0,0,0,0.5);

}
@media (min-width:480px){
	.veteranPass.btn {
	float:right;
    text-align: left;
    width:auto;
}

}

/*****************next ride page*************/
#tabbedLinks
{margin-bottom:-12px; padding-top:15px;
border-bottom:3px solid #062c6a;}

#tabbedLinks a
{display:inline-block;
color:#092d62!important;
text-align:center;
font-size:12px!important;
font-weight:bold;
text-align:center;
background-color:#c8dff3;
border:1px solid #89b3cc;
border-left:none;
border-bottom:none;
background-image: url("/_layouts/images/selbg.png") !important; 
background-repeat:repeat-x!important;
background-position:center -5px;
padding:7px 20px 10px 20px;
text-decoration:none!important;}

#tabbedLinks a:hover
{text-decoration:underline!important;
background-color: #97C1E8;}

#tabbedLinks a:first-child{
	border-left:1px solid #89b3cc;
}
/*******************service alerts pages***********/
#alertView .newsItem{
	margin-bottom:8px;
}
#alertView .newsItem .date{
width:130px;
font-size:85%;
text-align:center; 
background:#f0f0f0;
border-radius:3px 3px 0 0;
margin-right:6px;
line-height:1.75
}
#alertView .newsItem:hover .date{
	background-color:#0056AC;
	color:#fff;
}    

#alertView .newsItem .date span{
	display:inline;
}
#alertView .newsItem .newsBody{
	display:block;
	padding:5px;
	padding-bottom:25px; 
	background-color:#f6f6f6;
	padding:15px;
	border-radius:3px;	
}

#alertView .newsItem .newsBody h2{
	margin-top:0px;
	font-weight:600;
	font-size:120%
}
#alertView .newsItem h3{
	margin-top:10px;
	font-weight:300;
	font-size:130%
}
#alertView .newsDesc{
	border-top:1px solid #ccc
}
.newsBody .table>thead>tr>th {
    background-color: #f0f0f0;
    border-bottom: none;
}
@media (min-width:768px){
#alertView{
	margin-right:-15px;
}
#alertView .newsDesc{
	border-top:none;
	border-left:1px solid #ccc
}
	#alertView .newsItem .newsBody{
	font-size:90%
	}
	#alertView .newsItem .newsBody h2,
	#alertView .newsItem h3{font-size:170%}
	#alertView .newsItem .newsBody h2{
		font-weight:400;
	}
}


.emptyView	{
	padding:15px 15px 15px 60px;
	font-size:110%;
	background-repeat: no-repeat;
	border-radius:3px;
}
.emptyView i{
	margin-right:10px;
}
.emptyView p{
	margin-bottom:4px;
}


/***************sites welcome pages*************/
#pageListing {
	background-image:url('../images/logos/BTLogo-lightGray.png');
	background-repeat:no-repeat;
	margin-bottom:-15px;
	padding-bottom:60px;
	background-position:5px bottom;
	background-size:300px;
}
#pageListing .pageItem{
	padding-right:5px;
	padding-left:5px;
}

#pageListing .pageItem .itemWrap{
	display:block;
	background-color:#f6f6f6;
	border-radius:3px;
	margin-bottom:5px;
	padding:20px 10px;
}
#pageListing .pageItem a,
#pageListing .pageItem a:link,
#pageListing .pageItem a:hover{
	text-decoration:none;
	color:#000;
}
#pageListing .pageItem h2{
	font-size:140%;
	color:#0056AC;
	margin-top:0px;
}
#pageListing .pageItem a:hover h2{
	text-decoration:none;
	color:#000;
}
#pageListing .pageItem img{
	float:left;
	width:90px;
}
#pageListing .pageDetails{
	border-left:1px solid #ccc; padding-left:10px;
	height:100%;
	margin-left:89px;
	background-image:url('../images/icons/transitArrow-white.png');
	background-repeat:no-repeat;
	background-position:right bottom;	
	padding-bottom:30px;
	padding-right:20px;
	min-height:90px;
	
}
#pageListing .pageItem a:focus .pageDetails,
#pageListing .pageItem a:hover .pageDetails{
	background-image:url('../images/icons/transitArrow-blue.png');
}

@media (min-width:600px){
	#pageListing {
		padding-top:76px;
		background-position:right 5px;
		background-size:360px;
	}
}
@media (min-width:768px){

	#pageListing .pageItem{
		padding-left:0px;
		padding-right:10px;
	}
	#pageListing .pageItem .itemWrap{
		margin-bottom:10px;
	}	
	
	#pageListing .pageItem img{
		    width:auto;
	}
	#pageListing .pageDetails{
		margin-left:120px;
		min-height:120px;
	}
	#pageListing .pageDetails{
	font-size:90%
}
}

@media (min-width:960px){
	#pageListing .pageItem{
		float:left;
		width:50%;
	}
	#pageListing .pageDetails {
		height:250px;
	}
	#pageListing .pageItem img{
		    border-right:none;
	}

	
}
@media (min-width:1200px){
	#pageListing .pageDetails {
		height:235px;
	}
}

/*#pageListing.fares .pageItem:first-child,*/
#pageListing.zum .pageItem:last-child:nth-child(odd),
#pageListing.plan .pageItem.embedTerm{width:100%;}
#pageListing.fares .pageItem.embed .pageDetails,
#pageListing.zum .pageItem:last-child:nth-child(odd) .pageDetails,
#pageListing.plan .pageItem.embedTerm .pageDetails{height:auto}


/*******(plan your rip) travel Outside Brampton card***********/
#pageListing .pageItem.doubleLink .pageDetails{ background-image:none; padding-right:0px }
#pageListing .pageItem.doubleLink a span{
	color:#0056AC;
}
#pageListing .pageItem.doubleLink a{
	display:block;
	background-image:url('../images/icons/transitArrow-white.png');
	background-repeat:no-repeat;
	background-position:right bottom;
	background-size:30px;
	padding:3px 25px 3px 3px; 
	border:4px solid #e6e6e6;
	background-color:#e6e6e6;
	border-radius:3px 3px 17px 3px;
	font-size:90%;
	margin-bottom:10px;
}
#pageListing .pageItem.doubleLink a:hover{
	background-image:url('../images/icons/transitArrow-blue.png');
}
/*******(Service Alerts) thumbnail view***********/
@media (min-width:960px){#pageListing.service .pageDetails {height:200px;}}
@media (min-width:1200px){#pageListing.service .pageDetails {height:185px;}}


/*************(passenger safety) rounded icons buttons*********/
.roundedIcons{
	padding-bottom: 20px;
}

.roundedIcons a.thumbLink{
	display:block;
	position:relative;
	margin-bottom:5px;
}

.roundedIcons a.thumbLink{
	background-color:#f2f2f2;
	padding:6px;
	border-radius:3px;
}
.iconsPanel.YoursLife .roundedIcons a.thumbLink{
	background-color:#f2f2f2;
	padding:6px;
	border-radius:3px;
}
.roundedIcons a.thumbLink span{
	display:block;
	position:absolute;
	left:70px;
	bottom:10px;
	line-height:1.25;
}
.iconsPanel.YoursLife .roundedIcons a.thumbLink span{
	display:block;
	position:absolute;
	left:75px;
	bottom:30px;
	line-height:1.25;
}
.roundedIcons a.thumbLink.selected{
	background-color:#e6e6e6;
	color:#000;
}
.roundedIcons a.thumbLink.selected img{
	background-color:#f2f2f2;
}
.roundedIcons a.thumbLink img{
	background-color: #F9F9F9;
	border-radius:50px;
	width:60px; 
	background-clip: padding-box;
	-webkit-background-clip: padding-box;
}
.iconsPanel.YoursLife .roundedIcons a.thumbLink img{
	background-color: #F9F9F9;
	border-radius:0px;
	width:60px; 
	background-clip: padding-box;
	-webkit-background-clip: padding-box;	
}
.roundedIcons a.thumbLink:hover{
	background-color:#e6e6e6;
}
.roundedIcons a.thumbLink:hover img{
	background-color:#f2f2f2;
}
@media (min-width:600px){
	.roundedIcons a.thumbLink{
		float:left;
		text-align:center;
		margin-right:5px;
		width:125px;
		padding:20px 10px 40px 10px;
		font-size:85%;
	}
	.roundedIcons a.thumbLink img{
		border-radius:70px;
		margin-bottom:5px;
		width:100%;
	}
	.iconsPanel.YoursLife .roundedIcons a.thumbLink img{
		border-radius:0px;
		margin-bottom:25px;
		width:100%;		
}
	.iconsPanel.YoursLife .roundedIcons a.thumbLink{
		padding:10px 10px 40px 10px;
}
	.roundedIcons a.thumbLink span{
		left:0px;
		text-align:center;
		width:100%;
	}
	.iconsPanel.YoursLife .roundedIcons a.thumbLink span{
		left:0px;
		text-align:center;
		width:100%;
		bottom:10px;
}
	.safety .roundedIcons a.thumbLink{padding-bottom:70px}
	.guidelines.roundedIcons a.thumbLink{padding-bottom:55px}

}

@media (min-width:999px){
	.roundedIcons a.thumbLink{width:160px;}
	.guidelines.roundedIcons a.thumbLink{padding-bottom:40px}
}


/*************transit fares*************/
.FAQ .well .list-group{
	margin-bottom:0px;
}
.FAQ .well .list-group.singleItem .list-group-item{
	border:none
}
.FAQ .well .list-group .badge{
	background-color:#060;
	font-size: 100%;
    border-radius: 20px;
    font-weight: normal;
}

.FAQ .well .list-group .list-group-item {
    padding: 8px 15px;
    background-color: transparent;
    border: 1px solid #ddd;
}
.FAQ .well .alert{
	margin-top:10px;
}

@media screen and (min-width: 1200px){
#pageButtons.trimmedWidth{
	padding-left: calc((100% - 999px)/2);
	padding-right: calc((100% - 999px)/2);
	margin-left: -15px;
	margin-right: -15px;
	}
}

/********Service Updates*************/
#Announcements .announcementItem{
	padding-top:8px;
	padding-bottom:8px;
}
#Announcements .announcementMark{
	padding-top:0px
}
#Announcements .announcementText h3{
	margin-top:0px;
}
@media screen and (min-width: 768px){
	#Announcements .announcementItem {
	    height: auto;
	}
}
/**********footer****************/
#contactTransit{
	background-color: #e8e8e8;
	padding-top:0px;
	margin-top:30px;
	color: #000;
	text-align:center;
	position:relative;
	padding-bottom: 20px;
}
#contactTransit img{
	width:100%;
	margin-top:30px;
}
#socialPanel {
	width:auto;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
}
#socialPanel .fa{
    background-color: #005dab;
    width: 32px;
    height: 32px;
    text-align: center;
    border-radius: 32px;
    line-height: 32px;
    color: #fff;
    margin-right: 5px;
}

#socialPanel a:hover .fa{
	background-color: black;
	color:#fff;
}
#socialPanel .email {
    background-color: #005dab;
    color: #fff;
    border-radius: 50px;
    display: block;
    padding-left:20px;
    padding-right:20px;
    text-align: center;
    padding-bottom: 3px;
    margin:auto;
    margin-bottom: 10px;
}
#socialPanel .email .fa{margin:0px; margin-left:-5px}
#socialPanel .email:hover .fa{background-color:transparent}
#socialPanel .email:hover {background-color:#000; text-decoration:none}
@media (max-width: 499px){
	#contactTransit .social,#contactTransit .logo{width:100%; float:none}
} 
@media (min-width: 500px){
 	#socialPanel {position:absolute; right:15px; top:0px;text-align:right;margin-top:0px}
 	#socialPanel .fa{
	    margin-left: 5px;
	    margin-right: 0px;
	}
}