/* ------------------------------
Foundations
------------------------------ */
body { color: #5a5a5a; }
body { margin: 0; padding-top: 50px; padding-bottom: 20px; }

.centre { text-align: center; }
.author { margin: 1em; padding: 1em; border-bottom: 1px solid rgb(230 230 230); border-radius: 10px; }
.list-clean { list-style-type: none; }

/* ------------------------------
Sections
------------------------------ */

/* ----------------------- .navbar ------------------------- */
.navbar-inner { background-color: #fbfbfb; background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#f5f5f5)); background-image: linear-gradient(top,#fff,#f5f5f5); background-image: linear-gradient(to bottom,#fff,#f5f5f5); background-repeat: repeat-x; box-shadow: 0 0 0 rgb(0 0 0/6.5%); min-height: 50px; }
.navbar-inverse .brand,.navbar-inverse .nav > li > a { color: #999; text-shadow: 0 -1px 0 rgb(0 0 0/25%); }
.navbar-inner { background-image: none; background-repeat: no-repeat; border: 0; border-radius: 0; filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); box-shadow: none; }
.navbar-fixed-top .navbar-inner,.navbar-static-top .navbar-inner { box-shadow: 0 2px 4px 0 rgb(0 0 0/15%); }
.navbar-custom { margin: 0; padding: 0; }
.navbar-custom a.navbar-brand { margin: 0.25em 0 0; }
/* .navbar-static-top .container,.navbar-fixed-top .container,.navbar-fixed-bottom .container{width: 980px; }
 */

 a.navbar-brand { width: 219px; max-width: 325px; height: 60px; background: url("../img/logo.png") no-repeat 0 0; text-indent: -2000em; display: block; margin-top: 0.15em; margin-left: -0.25em; }

 /* ----------------------- div#banner ------------------------- */
 div#banner { background: rgb(0 65 128) url(../img/bg-automate.jpg) no-repeat center center; background-size: cover; }
 div.short { min-height: 300px; max-height: 300px; }
 div.tall { min-height: 400px; max-height: 400px; }

.jumbotron { background: none; padding: 0; margin: 4em 0 2em; color: #fff; text-align: left; text-shadow: 0 1px 2px rgb(0 0 0/60%); }
.jumbotron h1 { margin-top: -1em; line-height: 1.25; color: #fff; text-shadow: 0 1px 1px rgb(0 0 0/40%); font-size: 2.25em; }
.jumbotron h3 { font-size: 1em; }
.jumbotron h1,.jumbotron .lead { margin: 0; line-height: 1.25; color: #fff; text-shadow: 0 1px 1px rgb(0 0 0/40%); }


img.focus { padding: 0.15em; background-color: rgb(230 230 230); border: 1px solid rgb(200 200 200); border-radius: 5px; margin-left: 0.5em; }

li.live { border-bottom: none; }
li.live span { background: rgb(204 0 0); border: 1px solid rgb(204 0 0); border-radius: 5px; color: rgb(255 255 255); padding: 0.25em; font-size: 1.25em; }
li.live span strong { text-decoration: blink; }
li.replay { border-bottom: none; }
li.replay span { background: rgb(0 150 0); border: 1px solid rgb(0 150 0); border-radius: 5px; color: rgb(255 255 255); padding: 0.25em; font-size: 1.25em; }
li.replay span strong { text-decoration: blink; }


div.panel-heading { font-size: 1.25em; font-weight: normal; text-align: center; letter-spacing: 1px; background: rgb(0 65 128); color: rgb(255 255 255); border-bottom: none; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px; }
@media (width >= 960px) {
  .panel { margin-top: -3em; }
}
.featurette-divider { margin: 20px 0; /* Space out the Bootstrap <hr> more */ }
div.page-header { margin-top: 0; padding-top: 0; }



/* ------------------------------
Addons
------------------------------ */

/* ------------------------------ div.form ------------------------------ */
div.form form input.btn { width: 275px; padding: 0.5em 0 0.25em; margin: 0.5em auto; font-weight: bold; display: block; text-align: center; font-size: 1.25em; }
div.form form dl dt { clear: both; padding: 0.25em; font-size: 1em; width: 275px; margin: 0 auto; }
div.form form dl dd { clear: both; margin: 0.5em 0; text-align: left; }
div.form form label { font-weight: bold; }
div.form form p { clear: both; padding: 0.25em; font-size: 1em; width: 275px; margin: 0 auto; }
div.form form input[type="text"] { appearance: none !important; -webkit-border-horizontal-spacing: 0 !important; -webkit-border-vertical-spacing: 0 !important; -webkit-font-smoothing: auto !important; -webkit-rtl-ordering: logical !important; transform: none !important; user-select: text !important; background-color: #fafafa !important; background-image: none !important; background-origin: padding-box !important; border-bottom: 1px solid #ddd !important; border-radius: 3px !important; border-collapse: separate !important; border-left: 1px solid #ddd !important; border-right: 1px solid #ddd !important; border-top: 1px solid #ddd !important; box-shadow: none !important; display: block; color: #888 !important; padding: 0.25em; font-size: 1em; width: 275px; margin: 0 auto; }
div.form form select { background-image: none !important; background-origin: padding-box !important; border-bottom: 1px solid #ddd !important; border-radius: 3px !important; border-collapse: separate !important; border-left: 1px solid #ddd !important; border-right: 1px solid #ddd !important; border-top: 1px solid #ddd !important; box-shadow: none !important; display: block; color: #888 !important; padding: 0.25em; font-size: 1em; width: 275px; margin: 0 auto; }
.invisible { display: none; }
.red { color: rgb(204 0 0); }
.black { color: rgb(0 0 0); }
.alert-success h4 { line-height: 1.75em; padding-top: 0.25em; }
.alert-success h4 big span { margin-right: 1em; }
.alert-success h4 big { font-size: 2em; }
.alert p { margin: 0; }

/* ----------------------- .drop-shadow ------------------------- */
.drop-shadow { background: rgb(255 255 255); border: 2px solid rgb(230 230 230); border-radius: 5px; box-shadow: 0 0 16px rgb(0 0 0/30%); }

/* ------------------------------ .videocontainer ------------------------------ */
.videocontainer { min-width: 640px; max-width: 1280px; width: expression(document.body.clientwidth < 640? "640px":document.body.clientwidth > 1280? "1280px": "auto"); margin: 0.5em auto; padding: 0.25em; background: rgb(0 0 0); border: 5px solid rgb(255 255 255); border-radius: 5px; box-shadow: rgb(0 0 0/60%) 0 0 4px,rgb(0 0 0/60%) 0 3px 4px; }
.videowrapper {
  position:relative;padding-bottom:56.25%;/* 16:9 */
  padding-top:25px;height:0;
}
.videowrapper aside { background: rgb(0 0 0); }
.videowrapper aside a,.videowrapper aside iframe { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }