/* Generic styles
 * -------------------------- */
body {
	background-color: #888;
}	

body.page-about-us {
	background-color: #53595c;	
}


/*
#main-content p,
#main-content .lead {
	color:#333 !important;
}
*/
/* #676f7a*/

.dark {
	color:#333;
}

.panel {
	border-color:#e3e3e3 !important;
}

.panel-title {
	/*	color:#8dc153;*/
	color:rgb(141, 193, 83);
}

.blockquote.noborder {
	border:none;
}

.blockquote.noborder small {
	display:inline-block;
}

.hl {
/*	border-bottom:1px dotted #333;*/
	font-weight:600;
}

hr {
    border-color: #e3e3e3;
    border-top-width: 2px;
    margin-top: 50px;
    margin-bottom: 50px;
}

/*
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
	color:#333;
}
*/

.page-header h2 small {
	line-height:1.4em;
}

.green {
	color: #8dc153;
}

/* Carousel styles
 * -------------------------- */
 /*
.carousel-contrast .big {
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.8);
}

.carousel-contrast .normal {
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.8);
}

.carousel-contrast .big span,
.carousel-contrast .normal {
	background-color: rgba(0, 0, 0, 0.6);	
}
*/

.carousel-contrast-arrows .flex-direction-nav .flex-prev:before {
	content: "\f137";
	font-size: 3em !important;
}

.carousel-contrast-arrows .flex-direction-nav .flex-next:before {
	content: "\f138";
	font-size: 3em !important;
}


/* Header styles
 * -------------------------- */
#header {
	/*background-color: rgba(0, 0, 0, 0.45);*/
	/*

	background-color: #999;	
	background-color: rgba(102, 102, 102, 0.9);	
	*/

}

#header .navbar-default.navbar-collapsed-sm .navbar-collapse {
	border-radius:0 !important;
}

#header .navbar-default.navbar-collapsed-sm li {
}

#header .navbar-default.navbar-collapsed-sm {
	/*
	border-bottom:none;
	*/
}

/* Page header styles
 * -------------------------- */

#wrapper {
	background-image:none;
	/*
    background-repeat: no-repeat;
    background-position: center 0;		
    background-image: url(/images/bg_wrapper.jpg);
		*/
		
	background-size: auto !important;
}

body.page-what-we-do  #wrapper {
	background-image:url(/sj/img/header/skipjack_header_grey.jpg);
	background-position:0 -215px;
	/* background-size: 1920px 535px; */
}

body.page-our-work  #wrapper {
	background-image:url(/sj/img/header/skipjack_header_blue.jpg);
	background-position:0 -260px;	
}

body.page-our-work-project  #wrapper {
	background-image:url(/sj/img/header/skipjack_header_blue.jpg);
	background-position:0 -260px;	
}

body.page-about-us  #wrapper {
	background-image:url(/sj/img/header/skipjack_header_grey.jpg);
	background-position:0 -180px;
}

body.page-skipjack-tuna  #wrapper {
	background-image:url(/sj/img/header/skipjack_header_blue.jpg);
	background-position:0 -240px;		
}

body.page-careers  #wrapper {
	background-image:url(/sj/img/header/skipjack_header_grey.jpg);	
	background-position:0 -240px;	
}

body.page-contact-us  #wrapper {
	background-image:url(/sj/img/header/skipjack_header_blue.jpg);	
	background-position:0 -230px;		
}


/* Carousel styles
 * -------------------------- */
.carousel-contrast .big span,
.carousel-contrast .carousel-blur .normal span,
.carousel-blur .carousel-contrast .normal span,
.carousel-contrast .carousel-image .normal span,
.carousel-image .carousel-contrast .normal span {
	background-color: rgba(0, 0, 0, 0.6);	
	background-color: rgba(0, 0, 0, 0.75);
}

.carousel-contrast .normal {
	background-color: rgba(0, 0, 0, 0.6);
	background-color: rgba(0, 0, 0, 0.7);	
	background-color: rgba(0, 0, 0, 0.75);	
}
 
#carousel-spinner {
	color:#fff;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left:-2em;	
}

.hero-carousel:before {
		content: none !important;
}
 
.hero-carousel .slides li {
	background-repeat:no-repeat;
}

.hero-carousel .first {
	background-position: center;
	background-image:url(/sj/img/carousel/skipjack_carousel_01.jpg);
	/* background-image:url(/sj/img/carousel/orig/forest.jpg); */
}

.hero-carousel .second {
	background-position: center;
	background-image:url(/sj/img/carousel/temp/02.jpg);
	background-image:url(/sj/img/carousel/temp/14.jpg);
	background-image:url(/sj/img/carousel/05.jpg);
	background-image:url(/sj/img/carousel/skipjack_carousel_02.jpg);	
	background-position:center -180px;
	/* background-image:url(/sj/img/carousel/orig/sea.jpg); */
}

.hero-carousel .third {
	background-position: center;
	background-image:url(/sj/img/carousel/temp/13.jpg);
	background-image:url(/sj/img/carousel/03.jpg);	
	background-image:url(/sj/img/carousel/04.jpg);		
	background-image:url(/sj/img/carousel/skipjack_carousel_03.jpg);		
}

/*
.hero-carousel .forest {
	background-position:center;
	background-image:url("/images/demo/carousels/forest.jpg")
}

.hero-carousel .sea {
	background-image:url("/images/demo/carousels/sea.jpg")
}

.hero-carousel .bokeh {
	background-position:center;
	background-image:url("/images/demo/carousels/bokeh.jpg")
}





/* Equal panels
 * -------------------------- */
.equal {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.equal div[class*='col-'] {
  flex:1 1 auto;
  display: flex;
}
.equal .panel {
  flex:1 0 100%;
}
 
/* Navbar brand logo
 * -------------------------- */
.navbar-brand.logo,
.skipjack-logo {
  font-family: "Roboto";
  font-size: 44px;
  line-height: 48px;
  font-weight: bold;
	letter-spacing:.01em;
}

.navbar-brand.logo .skip,
.skipjack-logo .skip {
	color:#000;
	text-shadow:1px 1px 1px rgba(225, 225, 225, 0.5);			
}

.navbar-brand.logo .jack,
.skipjack-logo .jack {
	color:#ddd;	
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.5);		
}

/* Scroller
 * -------------------------- */
#scroll-to-top {
	color: #01a9e0;
	background-color: rgba(255, 255, 255, 0.1);
	
	color:#fff;
	background-color: rgba(0, 0, 0, 0.35);
}

/* Text shadow styles
 * -------------------------- */  
#footer #footer-main p {
	font-size: 14px;
	line-height: 20px;
	max-width:250px;	
}
 
#footer #footer-main .title {
	text-shadow: 1px 1px 2px #000;
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.8);
	margin-bottom:20px;
}

/* Main content header
 * -------------------------- */
#main-content-header {
    text-align: center;
    padding: 60px 0;
}

#main-content-header .title {
	padding:20px 50px;
	display:inline-block;
	background-color: rgba(0, 0, 0, 0.75);
	text-shadow:1px 1px 1px rgba(0, 0, 0, 1);
	
	/*
	-moz-box-shadow: 1px 1px 100px #bbb;
	-webkit-box-shadow: 1px 1px 100px #bbb;
	box-shadow: 1px 1px 100px #bbb;			
	*/
}

#main-content-header .title small {
	line-height:24px;
}

/* Fact lists
 * -------------------------- */
.fact-list li {
	margin-bottom:.6em;
}

.fact-list li i {
	margin-top:2px;
}

/* Jumbotron
 * -------------------------- */
.container .jumbotron, .container-fluid .jumbotron {
	border-radius:0;
}

/* Rows with top and bottom margins
 * -------------------------- */
.row.margined {
	margin-top:20px;
	margin-bottom:20px;	
}

/* page headers
 * -------------------------- */
.page-header.page-header-with-icon {
	margin: 90px 0 50px 0;	
	border-top: 2px solid #eaedf2;    

	margin: 140px 0 70px 0;			
	border-width:2px 0 0 0;	
	border-style:solid;	
/*	border-color:#01a9e0;*/
	border-color:#e3e3e3 ;
	
}

.page-header.page-header-with-icon.grey {
	border-top: 2px solid #e3e3e3;	
	border-top: 2px solid #ddd;		
}

/* Homepage panels
 * -------------------------- */
.home-panels .panel {
}

/* Portfolio boxes
 * -------------------------- */
.portfolio-boxes.featured .portfolio-box a {
/*	border:1px solid #ccc;*/
	border-radius: 0 !important;		
}

.portfolio-boxes .portfolio-box {
	margin-bottom:20px;
}

.portfolio-boxes .portfolio-box a.image-link,
.portfolio-boxes .portfolio-box a .image-link,
.portfolio-boxes .portfolio-box a.image-link:before,
.portfolio-boxes .portfolio-box a .image-link:before {
	border-radius: 0 !important;	
}

.portfolio-boxes .portfolio-box a.image-link,
.portfolio-boxes .portfolio-box a .image-link {
	display:inline-block;
	background-color: #fff;
	border-radius: 0;
	border: solid 1px #ddd;
	padding:5px;	
}

.portfolio-boxes .portfolio-box a.image-link img,
.portfolio-boxes .portfolio-box a .image-link img {
	border-radius: 0 !important;	
}

.portfolio-boxes .portfolio-box img {
	border-radius: 0 !important;	
}


/* Skipjack profile boxes
 * -------------------------- */
.profile-boxes.skipjack .name {
	text-transform:uppercase;
}

.profile-boxes.skipjack .copy {
	padding:30px 0 10px 0;
}

.profile-boxes .profile-box {
	margin-bottom: 80px;	
}

.profile-boxes .profile-box .position {
	margin-bottom: 1rem;
}

.profile-boxes .profile-box .links {
	margin-bottom: 1rem;
}

.profile-boxes .profile-box .links i {
	color: #8dc153;
	margin-right: 5px;
}

/* Icon boxes
 * -------------------------- */
.icon-boxes .fa-edit {
	margin-left:4px;
}

.icon-boxes .fa-code {
	margin-left:2px;
}

.icon-boxes .fa-wrench {
	margin-left:2px;
}

.icon-boxes .fa-exchange {
	margin-left:2px;
}

.icon-boxes .content h4.title {
	margin-top:3px;
}


/* Circle stats 
 * -------------------------- */
.circle-stat-small {
	width:100%;
}

.circle-stat-small {
	padding-bottom:40px;
}

/* Form styles 
 * -------------------------- */
.form-control {
	border: 2px solid #ddd;
}

/* Gallery styles 
 * -------------------------- */
.gallery a {
	display:inline-block;
	background-color: #fff;
	border-radius: 0;
	border: solid 1px #ddd;
	padding:5px;
}

.gallery .row > div {
	padding-bottom:10px;
}

.gallery a:hover {
	border: solid 1px #e3e3e3;
	-moz-box-shadow: 1px 1px 2px #bbb;
	-webkit-box-shadow: 1px 1px 2px #bbb;
	box-shadow: 1px 1px 2px #bbb;		
}

.gallery .title {
	text-align:left;
}


a .zoom {
	background: url("/sj/img/magnifier.png") repeat scroll 0 0 transparent;
	display: block;
	height: 30px;
	left: 50%;
	margin-left: -15px;
	margin-top: -15px;
	position: absolute;
	top: 50%;
	width: 30px;
}

a:hover .zoom {
	background-position:0 30px;
}

/* How we work list
 * -------------------------- */
.how-we-work-list {
	text-align:left;
	margin:20px auto;
	display:inline-block;
}

.how-we-work-list li {
	padding:4px 0;
}

.how-we-work-list li i {
	margin-right:0.5em;
}

.how-we-work-list li i.repeat {
	margin:0 0 5px 12px;
}

/* Icons
 * -------------------------- */
.panel-icon i {
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.4);
}

.icon-circle i
/*, .page-header-with-icon > i */
{
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.4);
}

/* Next previous links
 * -------------------------- */
.next-prev-links-bottom {
}

.next-prev-links-bottom .left {
	text-align:left;
}

.next-prev-links-bottom .right {
	text-align:right;
}