/* Forecast grid styles, used by utils/forecastDisplay.js */

@media only screen and (max-width: 357px) {
  .hgtchg {
    height:37px;
  }
}

table tbody tr td th {width: 58px; min-width: 58px; max-width: 58px; height: 50px;  max-height: 50px; min-height: 50px;}

/* 20px white gap before the first column of each day after the first */
.day2, .day3, .day4, .day5, .day6, .day7, .day8, .day9, .day10, .day11, .day12, .day13, .day14, .day15, .day16 {border-width:0 0 0 20px; border-style:solid; border-color: rgba(255,255,255,1);}
.day2 ~ .day2, .day3 ~ .day3, .day4 ~ .day4, .day5 ~ .day5, .day6 ~ .day6, .day7 ~ .day7, .day8 ~ .day8, .day9 ~ .day9,
.day10 ~ .day10, .day11 ~ .day11, .day12 ~ .day12, .day13 ~ .day13, .day14 ~ .day14, .day15 ~ .day15, .day16 ~ .day16 {
    border: none;
}

@media only screen and (max-width: 768px) {
    #forecastholder {
        padding:0px;
    }
}

@media only screen and (max-width: 680px) {
    .ftable {
        width:auto;
        border-width: 1px 0px 1px 0px;
    }
    .bordertable1{ border-width: 1px 0px 1px 0px;}
}

@media only screen and (min-width: 680px) {
    .ftable {
        width:auto;
        border-width: 1px 1px 1px 0px;
    }
    .bordertable1{ border-width: 1px 0px 1px 1px;}
}

#xtable {margin-left:67px; overflow-x: auto;}

.swipearrow:hover {box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color:#333;}
.swipearrow {padding-top:1px; display:block; position:absolute; top: 299px; z-index: 999999; height: 34px; width: 34px; background-color: rgba(255,255,255,0.75); border-color: #a9a9a9; border-width:1px; border-style:solid; border-radius: 50%;cursor:pointer; text-align:center; font-size: 24px; color: #333;line-height:1;}
.prevscroll{left:65px;}
.nextscroll{right:0px;}
.arrow {
  border: solid #636363;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 4px;
}

.arrright {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  margin-left: -4px;
}

.arrleft {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  margin-right: -4px;
}

.arrup {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

.arrdown {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

table {padding:0}

td > div {font-size: 14px;}

/* Layout wrappers */
#forecastholder {height: 575px;}
.fcwrap {position: relative;}
.fclabels {position: absolute; top: 0px; width: 70px; z-index: 999999;}
.fclabels table {table-layout: fixed; width: 100%;}
.fclabels th {padding: 0px 5px; height: 50px; max-height: 50px; min-height: 50px;}
.fclabels #tht {padding: 0px; height: 19px;}
.fclabels #th0 {padding: 0px;}
#fctable {padding:0; table-layout: fixed; margin: 0px; overflow-x: scroll;}
.fcswipe {width: 125px; margin: 5px auto 5px auto;}
.fcswipe img {width: 125px; height: 22px;}

/* Grid cells (previously inline on every td) */
#fctable td {position: relative; height: 50px; padding: 0px 5px;}
#fctable tr.row0 {height: 19px;}
#fctable tr.row0 td {height: 19px; text-align: left; overflow: visible; white-space: nowrap; font-weight: bold;}
#fctable .fcday {position: absolute; top: 0; left: 0; white-space: nowrap; font-weight: bold; z-index: 10; padding-left: 16px;}
#fctable img.wx {height: 36px; width: 36px; max-height: 36px; max-width: 36px;}
#fctable td.fcw {font-size: 13px; line-height: 1;}
#fctable img.wd {display: block; width: 20px; height: 20px; max-height: 20px; max-width: 20px; margin: 0px auto;}
/* Precipitation amount and description share one block (previously two stacked .prec divs) */
#fctable .prec {height: auto; line-height: 16px;}
#fctable .prec .pfc {display: block;}
#fctable .fcc {text-align: center;}
#fctable .camp {padding: 7px 2px;}

/* palette:start (generated by utils/buildforecastgridcss.js, do not edit by hand) */
#fctable .t0{background-color:#bf5ebf}
#fctable .t1{background-color:#bf5ebf}
#fctable .t2{background-color:#bf5ebf}
#fctable .t3{background-color:#bf5ebf}
#fctable .t4{background-color:#c989c9}
#fctable .t5{background-color:#1ca2ff}
#fctable .t6{background-color:#54b9ff}
#fctable .t7{background-color:#79c7fd}
#fctable .t8{background-color:#99d5ff}
#fctable .t9{background-color:#00bc6a;color:#fff}
#fctable .t10{background-color:#00bc1f;color:#fff}
#fctable .t11{background-color:#01db25}
#fctable .t12{background-color:#59ed00}
#fctable .t13{background-color:#99ff33}
#fctable .t14{background-color:#ccff33}
#fctable .t15{background-color:#ccff00}
#fctable .t16{background-color:#ffff00}
#fctable .t17{background-color:#ffcc00}
#fctable .t18{background-color:#ffcc33}
#fctable .t19{background-color:#ff9900}
#fctable .t20{background-color:#ff6600}
#fctable .t21{background-color:#ff3300;color:#fff}
#fctable .t22{background-color:#ff1800;color:#fff}
#fctable .t23{background-color:#ff0000;color:#fff}
#fctable .t24{background-color:#ff0000;color:#fff}
#fctable .t25{background-color:#ff0000;color:#fff}
#fctable .t26{background-color:#ff0000;color:#fff}
#fctable .t27{background-color:#ff0000;color:#fff}
#fctable .t28{background-color:#ff0000;color:#fff}
#fctable .t29{background-color:#ff0000;color:#fff}
#fctable .h0{background-color:#dafffa}
#fctable .h1{background-color:#92dfff}
#fctable .h2{background-color:#9cff92}
#fctable .h3{background-color:#5bfe4a}
#fctable .h4{background-color:#cdfe4a}
#fctable .h5{background-color:#f0ff00}
#fctable .h6{background-color:#ffc600}
#fctable .h7{background-color:#ff9600}
#fctable .h8{background-color:#ff4800;color:#fff}
#fctable .h9{background-color:#ff0000;color:#fff}
#fctable .r0{background-color:#dafffa60}
#fctable .r1{background-color:#92dfff60}
#fctable .r2{background-color:#9cff9260}
#fctable .r3{background-color:#5bfe4a60}
#fctable .r4{background-color:#cdfe4a60}
#fctable .r5{background-color:#f0ff0060}
#fctable .r6{background-color:#ffc60060}
#fctable .r7{background-color:#ff960060}
#fctable .r8{background-color:#ff480060}
#fctable .r9{background-color:#ff000060}
#fctable .k0{background-color:#ffffff}
#fctable .k1{background-color:#eeeeee}
#fctable .k2{background-color:#dddddd}
#fctable .k3{background-color:#cccccc}
#fctable .k4{background-color:#bbbbbb}
#fctable .k5{background-color:#aaaaaa}
#fctable .k6{background-color:#999999}
#fctable .k7{background-color:#888888}
#fctable .k8{background-color:#777777;color:#fff}
#fctable .k9{background-color:#555555;color:#fff}
#fctable .p0{background-color:#ffffff}
#fctable .p1{background-color:#aefeff}
#fctable .p2{background-color:#56d2fb}
#fctable .p3{background-color:#37ef19}
#fctable .p4{background-color:#fcff00}
#fctable .p5{background-color:#ff9600}
#fctable .f0{background-color:#ffffff}
#fctable .f1{background-color:#bf5ebf}
#fctable .f2{background-color:#c989c9}
#fctable .f3{background-color:#1ca2ff}
#fctable .f4{background-color:#54b9ff}
#fctable .f5{background-color:#79c7fd}
#fctable .f6{background-color:#99d5ff}
#fctable .f7{background-color:#00bc6a;color:#fff}
#fctable .f8{background-color:#01db25}
#fctable .f9{background-color:#ccff00}
#fctable .f10{background-color:#ffcc00}
#fctable .f11{background-color:#ff9900}
#fctable .f12{background-color:#ff0000;color:#fff}
#fctable .g0{background-color:#d9d9d9}
#fctable .g1{background-color:#aefeff}
#fctable .g2{background-color:#56d2fb}
#fctable .g3{background-color:#37ef19}
#fctable .g4{background-color:#fcff00}
#fctable .g5{background-color:#ff9600}
/* palette:end */
