@charset "utf-8";

/* Traffic Box
=======================================*/

div.trafficinfo-box div.main-box-header h2 {
	color: white;
}

div.trafficinfo-box div.main-box-header p span.link-outernal-info {
	color: #CCC;
}

div.trafficinfo-box table tbody tr.irregular {
	background-color: rgba(255,100,100,0.1);
}

div.trafficinfo-box table tbody tr:hover.irregular {
	background-color: rgba(255,100,100,0.25);
}

div.trafficinfo-box table tbody tr th.company {
    width: 175px;
	padding: 3px 0 3px 8px;
	font-size: 108%;
}

div.trafficinfo-box table tbody tr th.company img.twitter-icon {
	width: 16px;
	height: 16px;
	margin: 3px 4px 5px 4px;
	padding: 0;
	vertical-align: middle;
}

div.trafficinfo-box table tbody tr td.predict {
	width: 4em;
	padding: 3px 10px 3px 2px;
	font-size: 93%;
	text-align: left;
	color:#333;

}
/*
div.trafficinfo-box table tbody tr td.predict a {
	color:gray;
}
*/
div.trafficinfo-box table tbody tr td.predict span.rate {
    display: inline-block;
    width: 2.3em;
    text-align: right;
}

div.trafficinfo-box table tbody tr td.certificate {
	width: 3em;
	padding: 3px 10px 3px 2px;
	font-size: 93%;
	text-align: center;
	color:#333;
}

div.trafficinfo-box table tbody tr td.certificate i {
	margin-right: 0.1em;
	margin-left: 0.1em;
}

div.trafficinfo-box table tbody tr td.certificate span {
	border: 1px solid #ddd;
	padding: 1px 4px;
	font-size: 93%;
	background-color: #eee;
}

div.trafficinfo-box table tbody tr td.certificate span a {
	text-decoration: none;
	color: #666;
}

div.trafficinfo-box table tbody tr td:hover.certificate span a {
	color: #000;
}

div.trafficinfo-box table tbody tr td.pictgram {
	width: 85px;
	padding: 3px 3px 3px 3px;
	text-align: center;
}

div.trafficinfo-box table tbody tr td.lines {
    width: 340px;
	padding: 2px 2px 3px 2px;
	font-size: 108%;
	line-height: 1.4;
}


div.trafficinfo-line-box table.main-table {
	width: 100%;
}

div.trafficinfo-line-box thead th {
	font-size: 93%;
	color: gray;
	padding: 0 3px 0 8px;
}

div.trafficinfo-line-box td.disaster {
	width: 2.3em;
	font-size: 80%;
	text-align: right;
}

div.trafficinfo-line-box td.pictgram-official {
	width: 110px;
	padding: 3px 10px 3px 10px;
}

div.trafficinfo-line-box td.pictgram-twitter {
	width: 100px;
	padding: 3px 10px 3px 10px;
}

div.trafficinfo-line-box td.pictgram-twitter span.display-mobile {
	display: none;
}

div.trafficinfo-line-box td.pictgram-twitter span.twitter-count {
	width: 1.3em;
	text-align: center;
	display: inline-block;
}

div.trafficinfo-line-box table.main-table tr td a.main-table-button-light {
	cursor: default;
}

div.trafficinfo-line-box table.main-table tr td a.main-table-button-light-alert,
div.trafficinfo-line-box table.main-table tr td a.main-table-button-light-caution {
	cursor: pointer;
}

div.trafficinfo-line-box table tbody tr td.predict {
	width: 25%;
}

div.trafficinfo-line-box th.predict p,
div.trafficinfo-line-box td.predict p {
	display: inline-block;
}

div.trafficinfo-line-box td.predict p.predict-today {
	margin-right: 1.2em;
}

div.trafficinfo-line-box td.predict span.rate {
	text-align: right;
	width: 2.3em;
	display: inline-block;
}

a.common-tooltip {
     text-decoration: none;
	 color: rgba(0,0,0,0.87);
	 position: relative;
}

a.common-tooltip:hover {
     text-decoration: none;
}

a.common-tooltip span.message {
     display: none;
     padding: 15px;
     font-size: 12px;
     margin-left: 8px;
     line-height: 1.6;
	 position: absolute;
	 top: 2.5em;
	 left: -1.5em;
	 color: rgba(0,0,0,0.87);
}

a.common-tooltip:hover span.message {
	z-index: 100;
     display: inline;
     /*position: absolute;*/
	border: 0;
	border-top: 1px solid rgba(0,0,0,0.25);
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.25);
	-webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.25);
	box-shadow: 0 2px 5px 0 rgba(0,0,0,0.25);	background-color: #fff;
     width: 250px;
}

div.traffic-category-listbox {
	margin: 0 15px 15px;
	padding: 5px 5px 10px;
}

div.traffic-category-listbox h2 {
	font-weight: bold;
	margin: 5px 5px 0;
	letter-spacing: 0.05em;
	font-size: 108%;
}

div.traffic-category-listbox ul {
	margin: 0 10px 10px;
}

div.traffic-category-listbox ul li {
	float:left;
	margin: 10px 0 0;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 108%;
}

div.traffic-category-listbox ul li {
  border-left: 1px solid #CCC;
  border-right: 1px solid #CCC;
}

div.traffic-category-listbox ul li + li {
	border-left: 0;
	border-right: 1px solid #CCC;
}

div.traffic-category-listbox ul li a {
	text-decoration: none;
	color: rgba(0,0,0,0.87);
}

#traffic-popup-box {
    background: #FFF;
    padding: 20px 20px;
    text-align: left;
    max-width: 400px;
	min-height: 500px;
    margin: 40px auto;
    position: relative;
}

#traffic-popup-box-default p.traffic-popup-loading {
	text-align: center;
	margin-top: 150px;
}

#traffic-popup-box-default p.traffic-popup-loading .svg-inline--fa {
	margin-right: 15px;
}

#traffic-popup-box-default p.traffic-popup-message {
	margin-top: 20px;
	text-align: center;
	font-size: 93%;
	color: gray;
}



div.traffic-share-button {
	padding-bottom: 15px;
	padding-right: 5px;
}

div.traffic-share-button div {
	float: right;
	margin: 0 0 0 10px;
}

div.traffic-share-button:after {
	content: ""; 
	display: block;
	clear: both;

}