/* @override 
	http://localhost:8888/sts/css/bootstrap-theme.css */

/* Global Styles */

html, body {
height: 100%;
}

body {
/*background: #5bc0de;*/
/*background: #444;*/
/*padding-top: 50px;*/
/* body padding for fixed top nav */
}

/* @group typography */
h1	{
color: #428bca;
font-size: 32px;
margin: 0 0 10px 0;
}
h2	{
color: #428bca;
font-size: 28px;
margin: 0 0 6px 0;
}
h3	{
color: #428bca;
font-size: 18px;
margin: 0 0 6px 0;
}
h3.fixed-height	{
height: 30px;
}

hr {
margin-top: 20px;
margin-bottom: 20px;
border: 0;
border-top: 1px solid #ccc;
}
/* @end */

/* @group font-awesome */
i.fa-check-circle	{
color: #428bca;/* blue */
color: #f0ad4e;/* orange */
color: #5cb85c;/* green */
font-size: 30px;
}
i.fa-quote-left,
i.fa-quote-right	{
color: #f0ad4e;/* orange */
color: #5cb85c;/* green */
color: #428bca;/* blue */
}
/* @end */

/* @group images */
.img-grid	{
margin: 0 0 10px 0;
}

.img-home-portfolio,
.img-customer,
.portfolio-item {
margin-bottom: 30px;
}

/* @end */

.tab-pane {
margin-top: 15px;
}



/* @group navbar */
.navbar-wrapper	{
background: #ffcc00;
}
.navbar	{
background: #428bca;
border: none;
border-radius: 0px;
margin: 0 0 10px 0;
}
.navbar-header a.navbar-brand	{
color: #fff;
font-weight: bold;
padding-right: 30px;
}

/*.navbar .brand {
max-height: 40px;
overflow: visible;
padding-top: 0;
padding-bottom: 0;
}*/

/*ul.nav	{
float: right;
margin: 0 20px 0 0;
}
.collapse.navbar-collapse ul	{
float: none;
}*/
.navbar .navbar-nav li a	{
color:  #fff;
}
.navbar .navbar-nav li a:hover,
.navbar .navbar-nav li.active a:hover,
.navbar .navbar-nav li.active a	{
/*background: #f0ad4e;*/
background: none;
color:  #fff;
text-decoration: underline;
}
.navbar-inverse button.navbar-toggle span.icon-bar	{
color: #ffcc00;
}
.navbar-inverse button.navbar-toggle	{
border-color: #fff;
}

/* @end */

/* @group cycle2 slideshow */
.slideshow-wrapper	{
background: #fff;
position: relative;
margin: 0 0 20px 0;
overflow: hidden;
padding: 0px;
/*height: 220px;
width: 980px;*/
z-index: 1;
}
.cycle-slideshow,
.cycle-slideshow * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
position: relative;
z-index: 1;
}
.cycle-slideshow img { 
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
/*width: auto;*/
height: auto;
}
/* in case script does not load */
.cycle-slideshow img:first-child {
position: static;
z-index: 100;
}
.cycle-caption {
position: absolute;
color: white;
bottom: 15px;
right: 15px;
z-index: 700;
}
.cycle-overlay { 
font-family: tahoma, arial;
position: absolute;
bottom: 0;
width: 100%;
z-index: 600;
background: black;
color: white;
padding: 15px;
opacity: .5;
}
.slide-title	{
background: #192E43;
display:  block;
position: absolute;
right: 0;
bottom: 70px;
height: 50px;
padding: 0 40px 0 20px;
z-index: 600;
}
.slide-title p	{
color: #fff;
font-size: 36px;
font-weight: normal;
letter-spacing: 1px;
line-height: 50px;
margin: 0;
}
.slide-caption	{
background: #192E43;
height: 34px;
position: absolute;
right: 0;
bottom: 15px;
padding: 0px 20px;
z-index: 700;
}
.slide-caption p	{
color: #fff;
font-size: 24px;
font-weight: normal;
letter-spacing: 1px;
line-height: 34px;
text-shadow: 1px 1px 0 #000;
}
.cycle-slideshow .item .readmore	{
position:  absolute;
right: 22%;
bottom: 10%;
}
.cycle-slideshow .item .readmore img:hover	{
}

/*.cycle-pager2 { 
display: block;
}*/
.cycle-pager2 { 
display: block;
height: 35px;
line-height: 35px;
text-align: right; 
/*width: 50%;*/ 
z-index: 100; 
position: absolute; 
left: 15px;
bottom: 10px; 
overflow: hidden;
}
.cycle-pager2 span { 
font-family: arial;
font-size: 70px;
width: 25px;
height: 35px; 
display: inline-block;
color: #fff;
cursor: pointer; 
}
.cycle-pager2 span.cycle-pager-active { 

color: #428bca;
}
.cycle-pager2 > * {
/*border: 4px solid #333;
border-radius: 10px;*/
cursor: pointer;
}


/*@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
.cycle-slideshow { width: 200px;}
.cycle-overlay { padding: 4px }
.cycle-caption { bottom: 4px; right: 4px }
}*/

/* @end */

/* @group container */
/*@media (min-width: 1200px) {
  .container {
    width: 970px;
  }
}*/

.container-top	{
background: orange;
}

.container	{
background: #fff;
}
.navbar .container	{
background: none;
}
/* @end */

/* Page Sections */
.section,
.section-colored {
padding: 20px 0;
}

.section-colored {
background-color: #e1e1e1;
/* change this to change the background color of a colored section */
}

.sidebar {
/*margin-top: 40px;*/
}

.sidebar ul {
border-radius: 5px;
padding: 5px;
border: 1px solid #cccccc;
}

/* @group Formbuilder: Forms */
/* @group CSS Form */
.contactform {
background: #eee;
box-shadow: 0px 0px 4px #888;
box-radius: 4px;
margin: 20px auto;
overflow: hidden;
padding: 10px;
width: auto;
}
.contactform fieldset {
margin: 0 0 10px 0;
border-top: none;
border-left: none;
border-right:none;
border-bottom: none;
border: 2px solid #006699;
padding:10px;
}
.contactform legend {
font-size: 16px;
font-weight: bold;
color: #006699;
margin-bottom:0.5em;
padding:0.5em;
width:auto;
}
.contactform div,
.contactform div.required,
.contactform.statictext {
/*border: 1px solid #444;*/
float: left;
width: 600px;
margin: 0 0 15px 0;
padding: 0;
}
.contactform div label {
float: left;
padding: 0 0 5px 0;
font-size: 14px;
font-weight: bold;
width: 150px;
}
.contactform div.required label {
color: #333;
}
.contactform input,
.contactform textarea {
font-size: 14px;
color: #666;
}
.contactform input {
float: left;
height: 22px;
width: 426px;
padding: 2px;
border: 1px solid #ccc;
}
.contactform textarea {
font-family: arial, sans-serif;
float: left;
height: 90px;
width: 426px;
background-color: #fff;
border: 1px solid #ccc;
padding: 2px;
}
.contactform .styled-select select	{
	height: 30px;
}
.contactform div.statictext	{
/*float: none;*/
margin: 0 0 0 0;
}
.contactform div input.cms_checkbox	{
float: left;
height: 16px;
width: 16px;
}
.contactform div.checkboxgroup {/*checkbox label and input wrapper*/
margin: 0;
}
.contactform div.checkboxgroup label	{
/* overall checkboxgroup label */
background: aqua;
display: block;
height: 200px;
}
.contactform div.checkboxgroup div {/*checkbox label and input wrapper*/
/*float: left;*/
position: relative;
height: 30px;
margin: 0;
padding: 0;
width: 200px;
}

.contactform div.checkboxgroup  div label {/*individual checkbox label*/
background: orange;
height: 30px;
position: absolute;
left: 20px;
top: 4px;
/*width: 1000px;*/
}
.contactform div div input {/*checkbox*/
position: absolute;
left: 0px;
top: 0px;
width: auto;
}

*html .contactform div div label {/* ie6 */
position:absolute;
left:0px;
top:4px;
line-height: normal;
}
*html .contactform div div input {/* ie6 */
position:absolute;
left:230px;
top:4px;
}
*+html .contactform div div label {/*ie7 */
/*position:absolute;
left:0px;
top:4px;
line-height: normal;*/
}
*+html .contactform div div input {/*ie7 */
/*position:absolute;
left:230px;
top:4px;*/
}
.contactform .message {
line-height: 16px;
padding: 0 0 8px 0;
}
.contactform div.captcha	{
/*float: right;*/
/*height: 140px;*/
width: 200px;
margin: 0 0 0 150px;
text-align: left;
}
.contactform .captcha .col1	{
float: left;
width: 200px;
}
.contactform .captcha .col2	{
float: right;
width: 200px;
}
.contactform .captcha img	{
border: 1px solid #999;
margin: 0 0 0 0px;
}
.contactform .captcha p	{
/* hide the captcha image alt tage when using jcaption */
display: none;
}
.contactform .captcha input	{
margin: 0 0 0 0px;
/*float: left;*/
width: 194px;
border: 1px solid #ccc;
}
.contactform .captcha div.captchatext	{
font-weight: normal;
margin: 0 0 0px 0;
padding: 0px 0 5px 0;
text-align: center;
width: 200px;
}

.error_message, 
.contactform 
.error_message, 
.fb_invalid {
color:#cc0000;
font-weight:bold;
}
.contactform div.submit	{
clear: both;
display: block;
width: 430px;
}
.contactform input.cms_submit {
height: 30px;
line-height: 30px;
width: 120px;
margin: 20px 0 0 150px;
padding: 0px 8px;
color: #fff;
background: orange;
border-radius: 4px;
border: none;
font-size: 16px;
}
.contactform input.cms_submit:hover {
background: #8BA542;
border: none;
color: #fff;
cursor: pointer;
}
/* @end CSS Form */


/* @group Table Form */
table.tableform	{	
border: none;
width: 630px;
}
table.tableform td	{
border: none;
padding: 10px 5px;
/*width: 120px;*/
text-align: left;	
}

table.tableform input,
table.tableform textarea	{
background: #fff;
border: 1px solid #999;
padding: 4px;
width: 400px;	
}

table.tableform input.cms_checkbox,
table.tableform input[type="radio"]	{
width: 16px;
}


table.tableform td table	{
border: none;
margin: 0;
padding: 0;
}
table.tableform td table td	{
border: none;
font-size: 12px;
margin: 0;
padding: 5px 10px 5px 0;
}

.tableform input.cms_submit	{
background: #ccc;
border: none;
border-radius: 6px;
font-weight: bold;
height: 36px;
line-height: 36px;
padding: 0 10px;
width: auto;
}
.tableform input.cms_submit:hover	{
background: #006699;
color: #fff;
}

/* @end Table Form */

/* @end forms */

/* @group ListIt2 Testimonuals */
.testimonial-item	{
margin: 0 0 30px 0;
}
.testimonial-quote p	{
display: inline;
}
.testimonial-author	{
font-weight: bold;
margin: 10px 0 0 0;
}
/* @end */



/*@group  Social Icons Styles */
.list-social-icons {
margin-bottom: 45px;
}
.tooltip-social a {
text-decoration: none;
color: inherit;
}
.facebook-link a:hover {
color: #3b5998;
}
.linkedin-link a:hover {
color: #007fb1;
}
.twitter-link a:hover {
color: #39a9e0;
}
.google-plus-link a:hover {
color: #d14836;
}
/* @end */

/* Service Page Styles */
.service-icon {
font-size: 50px;
}

/* 404 Page Styles */
.error-404 {
font-size: 8em;
}

/*@group Footer Styles */
footer {
margin: 50px 0;
}
/* @end */



/*@group  Additional Responsive Styles */
@media (max-width: 767px) {

.carousel {
height: 70%;
/* increases the carousel height so it looks good on phones */
}
}




/* navbar */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
position: absolute;
top: 0;
right: 0;
left: 0;
z-index: 20;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper .container {
padding-right: 0;
padding-left: 0;
}
.navbar-wrapper .navbar {
padding-right: 15px;
padding-left: 15px;
}
/* @end additional responsive */


/* @group Carousel */

/* Carousel base class */
.carousel {
/*height: 500px;*/
height: 550px;
margin-bottom: 20px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
background: #428bca;
border-radius: 6px;;
opacity: 0.8;
position: absolute;
bottom: 20px;
left: 12%;
right: 0;
width: 200px;
/*height: 160px;*/
padding: 10px;
text-align: left;
z-index: 10;
}
.carousel-caption h3	{
color: #fff;
font-size: 30px;
text-shadow: 1px 1px 0 #000;
}


/* Declare heights because of positioning of img element */
.carousel .item {
/*height: 500px;*/
height: 550px;
background-color: #777;
}
.carousel-inner > .item > img {
position: absolute;
top: 0;
left: 0;
/*min-width: 100%;*/
height: 550px;
}

span.icon-prev,
span.icon-next	{
font-size: 120px;
text-shadow: 1px 1px 0 #000;
}
.carousel-control .icon-prev::before,
.carousel-control .icon-next::before	{
content: none;
}
/* @end carousel */


/* MARKETING CONTENT
-------------------------------------------------- */

/* Pad the edges of the mobile views a bit */
.marketing {
padding-right: 15px;
padding-left: 15px;
}

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
margin-bottom: 20px;
text-align: center;
}
.marketing h2 {
font-weight: normal;
}
.marketing .col-lg-4 p {
margin-right: 10px;
margin-left: 10px;
}


/* Featurettes
------------------------- */

.featurette-divider {
margin: 80px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
font-weight: 300;
line-height: 1;
letter-spacing: -1px;
}



/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {

/* Remove the edge padding needed for mobile */
.marketing {
padding-right: 0;
padding-left: 0;
}

/* Navbar positioning foo */
.navbar-wrapper {
margin-top: 10px;
}
.navbar-wrapper .container {
padding-right: 15px;
padding-left:  15px;
}
.navbar-wrapper .navbar {
padding-right: 0;
padding-left:  0;
}

/* The navbar becomes detached from the top, so we round the corners */
.navbar-wrapper .navbar {
/*border-radius: 4px;*/
}

/* Bump up size of carousel content */
.carousel-caption p {
margin-bottom: 20px;
font-size: 21px;
line-height: 1.4;
}

.featurette-heading {
font-size: 50px;
}
}

@media (min-width: 992px) {
.featurette-heading {
margin-top: 120px;
}
}