/*
orange color :
*/

/*-----------------------------*/
/* Basic setup */
/*-----------------------------*/

*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html,body{
	background-color: #fff;
	color: #555;
	font-family: 'Lato','Arial',sans-serif;
	font-weight: 300;
	font-size: 20px;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

.clearfix{zoom: 1}
.clearfix:after{
	content: '.';
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
}

/*-----------------------------*/
/* Reusable Components */
/*-----------------------------*/


.row{
	max-width: 1140px;
	margin: 0 auto 0 auto;
}

/* section {
	padding-top: 80px;
} */

/*-----------------------------*/
/* Header Section */
/*-----------------------------*/


.home-section{
	background-image: linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url(../img/header.jpg);
	background-size: cover;
	/* background-position: center; */
	width: 100%;
	height: 100vh;
	background-attachment: fixed;
}

.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 300%;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 10px;
    word-spacing: 5px;
}


/*-----------------------------*/
/* Better Section */
/*-----------------------------*/
.better-section{
	background-image: linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url(../img/better.jpg);
	background-size: cover;
	/* background-position: center; */
	width: 100%;
	height: 100vh;
	background-attachment: fixed;
}

.better-centered {
  	padding-top: 25%;
	padding-left: 20%;
	padding-right: 20%;
  	font-size: 200%;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    word-spacing: 5px;
	font-weight: 300;
}


/*-----------------------------*/
/* Strong Section */
/*-----------------------------*/
.strong-section{
	background-image: linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url(../img/strong.jpg);
	background-size: cover;
	/* background-position: center; */
	width: 100%;
	height: 100vh;
	background-attachment: fixed;
}

.strong-centered {
  	padding-top: 25%;
	padding-left: 20%;
	padding-right: 20%;
  	font-size: 250%;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    word-spacing: 2px;
}



/*-----------------------------*/
/* shadows Section */
/*-----------------------------*/
.shadows-section{
	background-image: linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url(../img/shadows.jpg);
	background-size: cover;
	/* background-position: center; */
	width: 100%;
	height: 100vh;
	background-attachment: fixed;
}

.shadows-centered {
  	padding-top: 25%;
	padding-left: 20%;
	padding-right: 20%;
  	font-size: 250%;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    word-spacing: 2px;
}


/*-----------------------------*/
/* boredom Section */
/*-----------------------------*/
.boredom-section{
	background-image: linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url(../img/boredom.jpg);
	background-size: cover;
	/* background-position: center; */
	width: 100%;
	height: 100vh;
	background-attachment: fixed;
}

.boredom-centered {
  	padding-top: 25%;
	padding-left: 20%;
	padding-right: 20%;
  	font-size: 250%;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    word-spacing: 2px;
}


/*-----------------------------*/
/* captain Section */
/*-----------------------------*/
.captain-section{
	background-image: linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url(../img/captain.jpg);
	background-size: cover;
	/* background-position: center; */
	width: 100%;
	height: 100vh;
	background-attachment: fixed;
}

.captain-centered {
  	padding-top: 25%;
	padding-left: 20%;
	padding-right: 20%;
  	font-size: 250%;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    word-spacing: 2px;
}