/*
  css for the entire wxo site
*/

@media print{
   a[href]:after { content: "" !important;}
	abbr:after { content: "" !important;}
	aside.gc-nttvs { display: none !important;}
	.gc-prtts {display: none !important;}

   /* 3822 fix FF - print truncated table */
   .wb-tabs > .tabpanels > .fade.in  { overflow: visible !important;}
   .wb-tabs > .tabpanels > .fade.out { display: none !important; }

	/* chrome print fade-in, not inherit hidden-print */
	aside.hidden-print {display: none !important; }

    #wb-dtmd dd, #wb-dtmd dt { display:inline;}

	/* fix IE - print xs version in print view */
  	body {
    margin: 0;
	 padding: 0 !important;
    min-width: 768px;
  	}
  	.container {
    width: auto;
    min-width: 750px;
  	}

	/*  removed double header if it has been at xs before printing  */
	details[open] > summary.wxo-summ {
		display:none !important;
	}

	/* 4308 */
	.list-group { margin-bottom:5px; }

  details.hidden-details-print-close:not([open]) {
    display: none;
  }
} /* MEDIA PRINT */

/* deleted in template 4.0.22 */
details > *:not(summary) { margin-left:1.1em; }

/*  gc-nttvs changed on wet4.0.12 themse.css  */
.gc-nttvs  img.pull-right {
	float:right;
	margin: auto;
}

.gc-nttvs  img.center-block {
   float:none;
   margin: auto;
}

/*  details/summary changed on wet4.0.12 wet-boew.css  */
details	{padding-left: 0;}
details > summary {margin-left:auto;}

/* table css deleted from wet4.0.10 theme.css */
table {
    border: 1px solid #ddd;
    margin-bottom: 20px;
    width: 100%; }
th {
    background-color: #ccc;
    border: 1px solid #ddd;
    color: #000;
    font-weight: normal;
    padding: 8px; }
th a {
      color: #000; }
th a:hover, th a:focus {
      color: #000;
      text-decoration: none; }
td {
    border: 1px solid #ddd;
    padding: 8px; }
caption {
    font-weight: bold; }

/* table css  */

/*5.0.1 */
abbr, abbr[title] {
	border:none !important;
	text-decoration: none;
}

body {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
body main {font-size:16px; line-height:1.4375;}

.media-body {width:auto;}

@media (max-width: 767px) {
  .pull-left[class*=col-sm], .pull-left[class*=col-md], .pull-left[class*=col-lg],
  .pull-right[class*=col-sm],
  .pull-right[class*=col-md],
  .pull-right[class*=col-lg] {
    float: none !important; } }

@media (min-width: 768px) and (max-width: 991px) {
  .pull-left[class*=col-md], .pull-left[class*=col-lg],
  .pull-right[class*=col-md],
  .pull-right[class*=col-lg] {
    float: none !important; } }

.secondary .h1, .home .h1 {
  border-bottom: 1px solid #af3c43;
  font-size: 27px;
  margin-bottom: 0.2em;
  padding-bottom: 0.2em; }

/*5.0.1 */

.wxo-pddng-sm { padding:2px; }

.wxo-dpl-inline { display:inline; }

.wxo-btn a { text-align: left; padding: 3px 5px; }

.wxo-mrgn-hurr { margin-top:-4.5em; margin-left:3em; }

.wxo-pddn-tp-md { padding-top:5px; }

.wxo-th-bkg {background-color:#ccc !important;}

.wxo-tb-head {font-weight:600; text-align:center;}
.wxo-tb-head_marine {font-weight:600;}

.wxo-media tr td { white-space:normal !important ;}



/* City Warning Banner Styling */
div#noalert {
   border:2px solid black;
   margin:1em 0 .5em;
   /*height: 100%;*/
   padding:4px 0 5px;
}

div#noalert h2 {
	 font-size:1em;
	 font-weight: bold;
	 margin:0 0 0 5px;
	 text-decoration:none;
}

div#noalert a:link,
div#noalert a:visited
{
   color:black;
   text-decoration: none;
}

div#noalert a:hover {
   text-decoration: underline;
}

/* TBS optimization  alerts banner */
.alert-item { display:block; padding:10px 5px; border:1px solid #ddd; margin:0 0 3px 0; }
.alert-item .col-xs-1 { padding: 0 5px; }
.bg-alerts { background:#bb0000; }
.bg-veille { background:#ffff00; }
.bg-bulletin { background:#707070; }
div.bg-alerts > a:link, div.bg-alerts > a:visited, div.bg-bulletin > a:link, div.bg-bulletin > a:visited { color:#ffffff; text-decoration:underline; font-weight:700; }
div.bg-veille > a:link, div.bg-veille > a:visited { color:#000000; text-decoration:underline; font-weight:700; }
div.bg-alerts > a:link > div.text-center, div.bg-alerts > a:visited >  div.text-center, div.bg-bulletin > a:link > div.text-center, div.bg-bulletin > a:visited > div.text-center { color:#ffffff; text-decoration:underline; font-weight:700; }
div.bg-veille > a:link > div.text-center, div.bg-veille > a:visited >  div.text-center { color:#000000; text-decoration:underline; font-weight:700; }

details > summary.alert-item {
  font-weight: 700;
  list-style: none;
  border-radius: 0;
  margin-bottom: 0;
}
details > summary.bg-alerts, details > summary.bg-bulletin { color: #ffffff; }
details > summary.bg-veille { color: #000000; }
details > summary.bg-alerts:hover, details > summary.bg-alerts:focus { background:#bb0000; }
details > summary.bg-veille:hover, details > summary.bg-veille:focus { background:#ffff00; }
details > summary.bg-bulletin:hover, details > summary.bg-bulletin:focus { background:#707070; }

details:not([open]) > summary .hidden-details-close,
details[open] > summary .hidden-details-open {
  display: none;
}
details > summary.alert-item::-webkit-details-marker,
details > summary.alert-item::marker {
  display: none;
}

/* wet-boew polyfill */
.no-details details > summary.row::before {
  content: " " !important;
}
.no-details details:not([open]) > *,
.no-details details:not([open]) > details {
  display: none;
}

.padding-lft-0 {
  padding-left:0;
}
.padding-rght-0 {
  padding-right:0;
}

/* TBS optimization */

/*  trends table  */

.highTemp {
   background-color:#ffaaaa !important;
}

.lowTemp {
   background-color:#aaaaff !important;
}

/* home */
.hurrHome{
  position:absolute;
  right:10px;
  bottom:10px;
  z-index:100;
  width:35px;
}

.wxo-no-pad {
	padding-left: 0px;
	padding-right: 0px;
}
h1{
   margin-top:0 !important;
}
.h1{
   margin-top:0 !important;
}
#cityjump {
  height: 3.3em;
  text-align: right !important;
}
@media (min-width: 480px) {
  #cityjump {
    height: 2.7em;
  }
}
p + #cityjump, ul + #cityjump{
   margin-top: 0;
}

#cityjump label{
   text-decoration:underline;
   color:#295376;
   cursor:pointer;
   font-weight:300;

}

#cityjump #city {
   width: 10em;
   margin: 0;
}

#cityjump #jump, #cityjump #jumpnojs {
   width: 5em;
   display: inline;
}

#jumpmsg {
   text-align: right;
   color: #A00;
}

#jumpmsg p{
   margin: 0;
}

#jumpresults #cityjump {
   height: auto;
   margin-top:2em;
   text-align:left;
}

.white {
   background-color:transparent;
   color:inherit;
}

#invalid-city{
   display:none;
 background:none;
   border:none;
   color:#B00;
}

#container label[for=city], #container label[htmlFor=city]{
   text-decoration:underline;
   color:#295376;
   cursor:pointer;
   font-weight:300;
}

.no-js label[for=city], .no-js label[htmlFor=city]{
   text-decoration:none !important;
   color:#000000 !important;
   cursor:text !important;
}

/* Bottom - 3 Column Navigation */

/* Make sure pre tag does not wrap text */

pre {
	word-wrap: normal !important;

}

/*  warning hurricane */
div.centrebar {
   clear:both;
   background-color:#ccc;
   color:#ccc;
   height:1px;
   width:60%;
   text-align:center;
   font-size:1px;
   line-height:0px;
   margin:20px auto;
   padding:0;
   border:0 none;
}
/*responsive data table has scroll bar on large screen*/
.dataTables_wrapper {width:99.5% !important}

.vertical-center {
  vertical-align: middle !important
}

.extreme-temp {
  font-size: 0.7em;
  margin-left: 5px;
}

/* Alert box */
details#alertbox {padding-left:2px; padding-right:15px; border-width:0 0 0 20px; background: #f3e9e8 none repeat scroll 0 0;}
details.warning { border-color: #b00; }
details.watch { border-color: #ff0; }
details.statement { border-color: #83837f; }
details#alertbox {padding-top:0; padding-bottom:0;}
details#alertbox .h3 h2 {padding-top:0; padding-bottom:0;}
details#alertbox ul {padding-bottom:5px;}
details#alertbox summary {border:0;}
details[open]#alertbox summary {border-bottom:1px solid #ddd;}


/* hack! Should fix later */
@media screen and (min-width: 768px) {
    .uniform_width {width:193px !important;}
}
@media screen and (max-width: 767px) {
    .uniform_width {width:90px !important;} /* 4123 */
}

@media screen and (max-width: 767px) {
    #invalid-city {font-size:14px;}  /* 4179 */
}


/* Fix alert banner */
.alert summary
{
    text-decoration: none !important;
}
.alert summary h1:hover,
.alert summary h2:hover,
.alert summary h3:hover,
.alert summary h4:hover,
.alert summary h5:hover,
.alert summary h6:hover
{
    text-decoration: underline !important;
}
/* wet-boew gcweb v9 overrides */
/* Override .alert background */
.alert-success {
  background: #d8eeca;
}
.alert-info {
  background: #d7faff;
}
.alert-warning {
  background: #f9f4d4;
}
.alert-danger {
  background: #f3e9e8;
}
.alert {
  min-height: 4em;
}
details.alert-success,
details.alert-info,
details.alert-warning,
details.alert-danger {
  border-image: initial;
}
details.alert::before, details[open].alert::before {
  top: 2px;
}
/* Keep panel border color */
details[open].panel-default {
  border-color: #8e8e8e;
}
details[open].panel-warning {
  border-color: #ba8312;
}
details[open].panel-info {
  border-color: #2392a9;
}

.dataTables_length select
{
    width: 72px;
}

#favourites-panel
{
	width: 380px;
}

#confirm-favourites.modal-dialog
{
	width: 95%;
}

.linkwrap { word-wrap:break-word; margin:2px 10px; }

@media screen and (max-width:767px) {
	#favourites-div-addorg > .btn {width:49%;}
}

.sortable-selected {
	background-color: #3399FF !important;
	color: #FFFFFF !important;
}
#favourites-inp-renaming {
	color: #000000 !important;
}

.sortable {
	padding: 0;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	list-style: none;
}
.sortable li {
	cursor: move;
	border: 1px solid #CCC;
	background-color: #FFF;
	margin: 5px;
	padding-left: 20px;
	padding-bottom: 3px;
	padding-top: 3px;
	width: 100%;
}

.sortable li:hover {
	background-color: #CCCCCC;
	color: #000000;
}

#favourites-inp-renaming {
	width: 90%;
}

#favourites-list {
	word-wrap: break-word;
}

.favourites-body {
	padding-top: 0px;
}

.favourites-add-body {
	margin-bottom: 40px;
}
.favourites-add-text {
	width:80%; float:right;
}

.float-left {
	float:left;
}

.underline_text {
	text-decoration: underline;
}

.panel-greybkd {
	background-color: #F6F6F6;
}

/** Modal Styling **/
.popup-modal {
	display: none;
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
    background-color: rgba(0,0,0,0.4);
}
.popup-modal-active {
	display: block !important;
}
.popup-modal-div {
	background-color: #FEFEFE;
	margin: 15% auto;
	border-radius: 4px;
	border: 2px solid #d3080c;
	width: 300px;
	box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
	-webkit-animation-name: popup-animatetop;
    -webkit-animation-duration: 0.4s;
	-moz-animation-name: popup-animatetop;
	-moz-animation-duration: 0.4s;
    animation-name: popup-animatetop;
    animation-duration: 0.4s;
}
.popup-modal-header {
	background-color: #d3080c;
	color: #FFF !important;
}
.popup-modal-header-text {
	margin: 10px;
	display: inline-block;
}
.popup-modal-content {
	margin: 10px;
}
.popup-modal-close {
	font-size: 28px;
	font-weight: bold;
	cursor: pointer;
	margin-right: 10px;
}
.popup-modal-close:hover,
.popup-modal-close:focus {
	color: #e5e5e5;
	text-decoration: none;
}
@-moz-keyframes popup-animatetop {
	from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}
@-webkit-keyframes popup-animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}
@keyframes popup-animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/** End Modal Styling **/

/* Bug in WET, overlay overrides panel styling */
.overlay-def header.panel-heading {
	padding: 10px 15px;
}

/* 4132 image scaled down to give space for border & padding */
img[usemap] {width:auto;}

.normalfont {font-weight:normal;}

/* 4175 IE vertical scroll bar overlap */
body{
	  -ms-overflow-style: scrollbar;
}

/* contactus css */
.wxoerror {
	display:inline-block;
	width:100%;
}
.wxoerror .label {
	font-size:100%;
}

/* astro, aqfm, firework, model_forecast */
.side-select-box {
  margin: auto;
  display: inline-block;
}
  .header-min-height {
  min-height: 38px;
}

.vertical-top {
   vertical-align:top;
}

ul.province-nav-desktop {
  padding: 10px 0;
  text-align: center;
}
ul.province-nav-desktop > li {
  padding: 0;
  margin: 0;
}

ul.province-nav-desktop > li > a {
  color: black;
  text-decoration: none;
  padding: 10px;
}
ul.province-nav-desktop > li.active > a {
  cursor: not-allowed;
  font-weight: bold;
  background-color: #e0e0e0;
}
ul.province-nav-desktop > li.active > a > u {
  padding-bottom: 5px;
  text-decoration: none;
  border-bottom: 4px solid #2954ab;
}

ul.province-nav-desktop > li + li::before {
  content: '|';
  padding-right: 5px;
  color: #909090;
}

nav#wb-bc {
  border-top:3px solid #38414d;
}
