html, body{height: 100%; margin:0; padding:0; }

/*Background CSS for desktop.  Breaks with iPhone - background expands beyond viewport/scrolls with content.*/


/*Cross-browser/device background solution - zero size for normal browsers*/

.background-div {
width:0; height:0;
}

.background-div img {
background:url(images/blank.jpg) no-repeat center center fixed;
width: 0;
height: 0;
}

/*Global font declaration*/
html{font-family: Helvetica, Arial, sans-serif; font-size:16px; font-weight:normal;}
p {font-size:1.4em}
 
/*Header */
header {position:fixed; width:100%;height:140px; top:20px; /*background:#f6f6f6; border-bottom:4px solid black;*/ z-index:10; overflow:visible; opacity: 1;
background-image:url(images/system/logo.png); background-repeat:no-repeat; background-size:500px; background-position:40px top}
.headtext{font-size: 4em; color:#9f1c00; float:left; margin:12px 0 0 80px}
.headpad{height:calc(50% - 184px); height:-webkit-calc(50% - 184px); display:block;}/*Firefox won't accept 'Top: 150px' on #scrollerbanner*/

/*Footer*/
footer {position:fixed; bottom:34px; height:30px; width:100%; background: rgba(159, 28, 0, 0.5);/*background:#f6f6f6;*/ border:none; z-index:10;}
.foottext {font-size: 0.9em; line-height:30px; font-weight:bold; color:#eee; margin-left:44px; float:left;}
.captiontext{font-size: 0.9em; line-height:30px; font-weight:normal; color:#ccc; margin-right:44px; float:right; font-style:italic}

/* Page content.*/

#scrollbanner {height:360px; position:relative;/*background: rgba(159, 28, 0, 0.5);*/ z-index:1; display:table-cell; vertical-align:middle; 
/*width:7000px;*/ overflow:hidden;}
.padright{width:calc(100% - 400px);}

/*Menu*/
#menu{margin-left:30px; float:left;}
#menu ul {margin:0; padding:0; font-size:0;}/*Zero font-size so no white space from inline-block display of li items*/
#menu li{list-style:none; margin:0; padding:0; display:inline-block;}
#menu ul li a{color:#fff; font-size:15px; line-height:30px; padding:0 12px 0 12px; text-decoration:none; transition: color 0.3s}
#menu ul li a:hover{color:#ccc; transition: color 0.7s}
#menu ul li a.selected{color:#ccc;}

.title{position:absolute; top:8px; width:100%; font-size: 44px; margin-left:14px;}
.pr{position:absolute; top:8px; width:100%;  font-size: 34px; margin-left:14px;}
.tiletext{position:absolute; bottom:0px; width:94%; font-size:1em; padding:10px 3% 10px 3%; background:rgba(0,0,0,0.5); color:#fff; }

.clear{clear:both; display:block;}
.spc8{height:8px; display:block}

#scrollbanner table, #scrollbanner tr, {border:none; margin:0; padding:0}
#scrollbanner td.band{border:4px solid white; margin:0;padding:0}
#scrollbanner table{table-layout:fixed; width:100%; margin-left:22px; padding-right:30px; border-collapse:separate; border-spacing:60px 0px;}
#scrollbanner td.band {width:500px; height:300px; background-repeat:no-repeat; background-size:100%; text-align:left; color:#fff;}
#scrollbanner td.text {width:460px; height:300px; background-repeat:no-repeat; text-align:left; color:#fff; font-size:2.8em;
 line-height:1.5;  background: rgba(159, 28, 0, 0.5); padding:0 20px 0 20px;}
#scrollbanner td.contact {width:460px; height:260px; background-repeat:no-repeat; text-align:left; color:#fff; font-size:2.0em;
 line-height:1.2;  background: rgba(159, 28, 0, 0.5); padding:20px;}
#scrollbanner td.improv {width:770px; height:300px; background-image:url(images/system/strap.png); background-position:30px 104px; background-repeat:no-repeat; text-align:left; color:#9f1c00; font-size:2.8em;
 line-height:1.5;   padding-left:30px; }

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {#scrollbanner td.improv {width:770px; height:300px; background-image:url(images/system/strap.png); background-position:30px 104px; background-repeat:no-repeat;padding-right:300px}}
@media only screen and (min-device-width: 1025px) and (max-device-width: 1280px) {#scrollbanner td.improv {width:770px; height:300px; background-image:url(images/system/strap.png); background-position:30px 104px; background-repeat:no-repeat;padding-right:500px}}
@media only screen and (min-device-width: 1281px) and (max-device-width: 1480px)  {#scrollbanner td.improv {width:770px; height:300px; background-image:url(images/system/strap.png); background-position:30px 104px; background-repeat:no-repeat;padding-right:700px}}
@media only screen and (min-device-width: 1481px)   {#scrollbanner td.improv {width:770px; height:300px; background-image:url(images/system/strap.png); background-position:30px 104px; background-repeat:no-repeat;padding-right:900px}}

td a {
  display: inline-block;
  height:100%;
  width:100%;
  color:#fff;
  text-decoration:none;
  vertical-align:middle;
}

/*Hack to enable div positioning in table cell*/
.celldiv{position:relative; height: 100%; width:100%; margin:0 auto;}

/*Arrow buttons*/
input {outline:none; position:fixed; top:calc(50% - 42px); top:-webkit-calc(50% - 42px); z-index:100; display:inline;}