/**** LAYOUT ****/
html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}

#header { background-color: #f8f8f8; box-shadow: 0 2px 3px rgba(0,0,0,0.1); position: relative; z-index: 10; }
#main { min-height: 300px; padding-top: 10px; }
#footer { padding-top: 20px; background-color: #f8f8f8; box-shadow: 0 -2px 3px rgba(0,0,0,0.1); position: absolute; bottom: 0; width: 100%; height: 50px;}

.navbar-default { background-color: transparent; border: none; margin: 0px; /* padding: 10px 0px;*/  }
.navbar-brand { height: auto; padding: 10px 10px 10px 0px; }



/**** LANDING PAGE ****/
.landing-section1 { padding-top: 50px; background-image: linear-gradient(to top right, #11a639, #66b3ff 95%); box-shadow: 0 2px 3px rgba(0,0,0,0.1); position: relative; z-index: 9; }
.landing-section2 { padding-top: 50px; box-shadow: 0 2px 3px rgba(0,0,0,0.1); position: relative; z-index: 8; }
.landing-section3 { padding-top: 50px; background-color: #f7f7f7; box-shadow: 0 2px 3px rgba(0,0,0,0.1); position: relative; z-index: 7; }
.landing-section4 { padding-top: 50px; background-color: #ffffff; }

.section-intro { text-align: center; }
.section-intro h2 { text-transform: uppercase; letter-spacing: .1em; font-size: 24px; font-weight: 400; color: #11a639; }
.section-intro p { margin-bottom: 50px; font-size: 18px; }

.login-form { box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.75); background: #ffffff; padding: 15px 20px 20px 20px; max-width: 350px; margin: 0px auto 50px auto; }
.login-form h3 { margin: 0 0 15px 0; }
.login-form h3 span { color: #ddd; }
.login-form .checkbox { font-size: 16px; margin: 0 0 10px 0; }
.login-form input[type="email"], 
.login-form input[type="password"] { width: 100%;  margin-bottom: 20px; padding: 0 15px; height: 50px; border-radius: 0; font-size: 15px; color: #000; border: 2px solid #ddd; }
.login-form .splitter { display: block; text-align: center; overflow: hidden; white-space: nowrap; margin: 1em auto; }
.login-form .splitter > span { position: relative; display: inline-block; color: #bbb; }
.login-form .splitter > span:before, 
.login-form .splitter > span:after { content: ""; position: absolute; top: 50%; width: 9999px; height: 1px; background: #ddd; }
.login-form .splitter > span:before { right: 100%; margin-right: 15px; }
.login-form .splitter > span:after { left: 100%; margin-left: 15px; }

.sale-pitch { text-align: center; }
.sale-pitch h2 { color: #FFFFFF; font-weight: bold; font-size: 48px; margin: 0 auto 20px auto; text-shadow: 1px 1px 2px rgba(90, 90, 90, 1); }
.sale-pitch p { color: #FFFFFF; font-size: 27px; margin-bottom: 40px; }

.landing-screenshot { width: 100%; text-align: center; overflow: hidden; }
.landing-screenshot img { width: 90%; position: relative; bottom: -30px; box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.75); }

.feature { margin-bottom: 50px; padding: 0 25px; text-align: center; }
.feature h2 { font-size: 24px; color: #66b3ff; }

.plan { background-color: #FFF; border: 1px solid #EBEBEB; text-align: center; margin-bottom: 50px; padding: 15px 10px; box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.75); }
.plan h3 { margin: 0; font-size: 18px; }
.plan .price { font-size: 38px; margin: 30px auto; color: #66b3ff;  }
.plan .price-enquire { margin: 34px auto; }
.plan .btn-default { color: #66b3ff; }
.plan ul { padding-left: 25px; }
.plan li { text-align: left; font-size: 14px; }

.about { margin-bottom: 50px; }
#carousel-about-spraylog { box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.75); }
#carousel-about-spraylog .carousel-caption { width: 100%; left: 0; padding: 0px 30px 10px 30px; margin-bottom: 40px; background: rgba(0,0,0,0.5); }
#carousel-about-spraylog .carousel-indicators li { border: 1px solid #666; box-shadow: 0 1px 2px rgba(0,0,0,.6); }
#carousel-about-spraylog .carousel-indicators li.active { background-color: #666; }

/**** GENERIC ****/
.pointer { cursor: pointer; }
.glyphicon.spinning { animation: spin 1s infinite linear; -webkit-animation: spin2 1s infinite linear; }
.table-form th { text-align: right; }
.strikethrough, .text-deleted { text-decoration: line-through; }
.deleted { display: none; }
.cell-border-left { border-left: 1px solid #ddd; }
.cell-border-right { border-right: 1px solid #ddd; }
/* prevent element for having border radius */
.no-border-radius { border-radius: 0px; }






/* text area read only */
.static-notes { width: 100%; resize: none; }
.static-notes:focus { outline: none; }

/* table column action buttons to prevent them from wrapping */
.actions-1 { width: 50px; min-width: 50px; }
.actions-2 { width: 85px; min-width: 85px; }
.actions-3 { width: 110px; min-width: 110px; }
.actions-4 { width: 140px; min-width: 140px; }
.actions-5 { width: 160px; min-width: 160px; }
.actions-6 { width: 205px; min-width: 205px; }

/* table filter form */
.filter-box { margin-bottom: 1em; }
.filter-box .title { font-size: 18px; margin: 0; line-height: 50px; padding: 0 0 0 8px; }
.filter-box .filter-submit { height: 50px; padding: 0 20px; font-size: 18px; border: 0; }
.filter-box .filter-inputs { padding: 8px 0; }
.filter-box .filter-inputs div { padding-left: 0; } /* hack to remove bootstrap column left-padding */
.filter-box .filter-clear { cursor: pointer; color: #AAA; }

.hide-deleted { display: none; }

/**** ANIMATION ****/
@keyframes spin {
  from { transform: scale(1) rotate(0deg); }
  to { transform: scale(1) rotate(360deg); }
}
@-webkit-keyframes spin2 {
  from { -webkit-transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); }
}



/**** BOOTSTRAP OVERRIDE/APPEND ****/

/* hack to colour button group with input state class */
.has-success .input-group-btn .btn.btn-default { color: #3c763d; background-color: #dff0d8; border-color: #3c763d; }
/* hack to colour button group with input state class - for clear filter button */
.has-success .input-group-btn .btn.filter-clear { color: #a94442; background-color: #f2dede; border-color: #a94442; }







#panel-blocks .panel-heading { font-size: 20px; }
#table-blocks tbody tr { cursor: pointer; }

#panel-sprays .panel-heading { font-size: 20px; }
#table-sprays tbody tr { cursor: pointer; }



.row-checkbox-click tbody { cursor: pointer; }


#panel-sprays { margin: 0px; }

#product-lookup-list {
  overflow-y: auto;
  margin-top: 10px;
  margin-bottom: 0px;
  border-top: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
}
#product-lookup-list a:first-child {
  border-top: none;
  border-radius: 0px;
}
#product-lookup-list a:last-child {
  border-bottom: none;
  border-radius: 0px;
}
#product-lookup-info h4 {
  margin-top: 0px;
}

.spray-wizard-well {
  overflow-y: auto;
}