/*************************** HTML/BODY GLOBALS ***************************/
* {
/*all div widths will include padding and border*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
border: 0;
outline: none;
}

/* set image max width to 100% */
img {
max-width: 100%;
height: auto;
border: 0;
}


html,body {
width: 100%;
height: 100%;
}

body {
background: #000;
font-size: 16px;
line-height: 1.2;
font-family: 'Roboto', sans-serif;
color: #fff;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
}

#page-container {
-webkit-box-flex: 1;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-line-pack: center;
align-content: center;
}

#footer {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
position: relative;
width: 100%;
background: #121212;
padding: 1.25em;
color: #fff;
font-size: 0.90em;
line-height: 1;
}

.bg-main {
background: url(../images/bg-main.jpg) no-repeat center top fixed;
background-size: cover;
}

.content-pad {
padding: 2em 6em;
position: relative;
}

.title-small {
width: 35%;
margin: 0 auto;
}

.flex-column-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;	
	-webkit-box-orient: horizontal;	
	-webkit-box-direction: normal;	
	    -ms-flex-flow: row nowrap;	
	        flex-flow: row nowrap;
}

.flex-container-center {
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}


.black-box-half {
width: 50%;
margin: 15px 20px;
background: rgba(0,0,0,0.85);
-webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.5);
box-shadow: 0 1px 10px rgba(0,0,0,0.5);
padding: 2em;
color: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-flow: column nowrap;
	        flex-flow: column nowrap;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}



.black-box-quarter {
width: 25%;
margin: 15px;
background: rgba(0,0,0,0.85);
-webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.5);
box-shadow: 0 1px 10px rgba(0,0,0,0.5);
padding: 2em;
color: #fff;
}

.column-quarter {
	width: 25%;
margin: 15px;
	display: inline-block;
	vertical-align: top;
	position: relative;
}


.column-half {
	width: 50%;
margin: 15px;
	display: inline-block;
	vertical-align: top;
	position: relative;
}


/*************************** MENU ***************************/
.icon-menu {
background: url(../images/menu-icon.png) no-repeat top center;
width: 22px;
height: 15px;
display: none;
	margin: 5px;
}

#menu {
width: 100%;
background: #121212;
color: #fff;
	padding: 0.5em;
	text-align: left;
	position: relative;
}


#menu-nav {
-webkit-transition: all 0.35s ease;
-o-transition: all 0.35s ease;
transition: all 0.35s ease;
list-style-type: none;
z-index: 8888;
position: relative;
}


#menu-nav li {
display: inline-block;
margin: 0;
padding: 0;
font-size: 0.85em;
text-transform: uppercase;
	color: #ba3104;
}

#menu-nav li a,#menu-nav li span {
-webkit-transition: all 0.15s ease-out;
-o-transition: all 0.15s ease-out;
transition: all 0.15s ease-out;
margin: 0;
padding: 0.75em;
display: block;
font-size: 0.95em;
}

#menu-nav li a {
font-weight: normal !important;
text-decoration: none;
color: #fff;
}


#menu-nav li a:hover {
font-weight: normal;
text-decoration: none;
color: #ba3104;
}

#menu-nav li span {
color: #ba3104;
}




/*************************** TEXT ***************************/

a {
text-decoration: none;
font-weight: normal;
color: #ba3104;
}

a:hover {
color: #d04417;
text-decoration: none;
font-weight: normal;
}


p {
line-height: 1.4;
margin: 10px auto 20px auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: bold !important;
margin: 0;
padding: 0;
line-height: 1.2;
text-transform: uppercase;
}

h1 {
font-size: 2.5em;
}

h2 {
font-size: 2.25em
}

h3 {
font-size: 2em;
}

h4 {
font-size: 1.75em;
}

h5 {
font-size: 1.5em;
}

h6 {
font-size: 1.15em;
}

.center-it {
text-align: center !important;
}

.right-it {
text-align: right !important;
}

.left-it {
text-align: left !important;
}


.bigger {
font-size: 1.25em !important;
}


.smaller {
font-size: 0.90em !important;
}

.smallest {
font-size: 0.70em !important;
}

.tan-light {
	color: #f1e2d2 !important;
}



/*************************** SPACERS/COLUMNS ***************************/
.spacer5 {
margin: 0 !important;
padding: 0 0 5px 0 !important;
line-height: 0;
}

.spacer10 {
margin: 0 !important;
padding: 0 0 10px 0 !important;
line-height: 0;
}

.spacer20 {
margin: 0 !important;
padding: 0 0 20px 0 !important;
line-height: 0;
}

.spacer30 {
margin: 0 !important;
padding: 0 0 30px 0 !important;
line-height: 0;
}

.spacer50 {
margin: 0 !important;
padding: 0 0 50px 0 !important;
line-height: 0;
}
.spacer60 {
margin: 0 !important;
padding: 0 0 60px 0 !important;
line-height: 0;
}

/*************************** BUTTONS ***************************/
.button-main {
display: inline-block;
text-align: center;
margin: 5px;
vertical-align: middle;
position: relative;
z-index: 1;
cursor:pointer;
-webkit-transition: all 0.15s ease-out;
-o-transition: all 0.15s ease-out;
transition: all 0.15s ease-out;
-webkit-appearance: none !important;
border: none;
padding: 0.75em 2em;
color: #fff;
font-size: 1em;
font-weight: normal;
background: #dc3803;
}

.button-main:hover {
color: #fff;
font-weight: normal;
text-decoration: none;
background: #ba3104;
-webkit-transform: scale(0.95);
-ms-transform: scale(0.95);
transform: scale(0.95);
}


.button-main-small {
display: inline-block;
text-align: center;
margin: 5px;
vertical-align: middle;
position: relative;
z-index: 1;
cursor:pointer;
-webkit-transition: all 0.15s ease-out;
-o-transition: all 0.15s ease-out;
transition: all 0.15s ease-out;
-webkit-appearance: none !important;
border: none;
padding: 1em;
color: #fff;
font-size: 0.80em;
font-weight: normal;
background: #dc3803;
}

.button-main-small:hover {
color: #fff;
font-weight: normal;
text-decoration: none;
background: #ba3104;
-webkit-transform: scale(0.95);
-ms-transform: scale(0.95);
transform: scale(0.95);
}



/*************************** IMAGES ***************************/

.image-brdr-float {
border: 1px solid #fff;
-webkit-box-shadow: 0 1px 15px rgba(0,0,0,0.85);
box-shadow: 0 1px 15px rgba(0,0,0,0.85);
margin: 15px 25px 10px 0 ;
float: left;
}

.image-brdr {
border: 1px solid #fff;
padding: 5px;
margin-bottom: 5px;
}

.photo-thumbs {
display: inline-block;
margin: 10px;
-webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.15);
box-shadow: 0 2px 5px rgba(0,0,0,0.15);
border: 2px solid #fff;
}



/*************************** FORMS ***************************/
#the-form label {
margin: 25px 0 0 0;
display: block;
text-align: left !important;
}

#the-form label.required {
font-weight: bold;
}

#the-form label em {
color: #c83333;
font-style: none;
}

#the-form select {
display: block;
margin: 0 0 5px 0;
height: 30px;
font-size: 1em;
border: 1px solid #c6c6c6;
}

#the-form input[type=text],#the-form input[type=email] {
width: 100%;
display: block;
background: #ffffff;
padding: 9px 15px;
color: #000;
position:relative;
border: 1px solid #c6c6c6;
margin: 5px 0 0 0;
}

#the-form textarea {
width: 100%;
height: 120px;
display: block;
background: #ffffff;
padding: 12px 8px;
border: 1px solid #c6c6c6;
color: #5b5b5b;
margin: 0;
font-size: 1em;
}


#the-form input[type=radio] {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
}

.error {
margin: 5px 0;
line-height: 1.4;
color: #c20505;
font-weight: bold;
font-size: 0.90em !important;
text-align: left;
}

.thepot {
display: none;
}






/*************************** CSS ANIMATIONS***************************/
.hide-it {
opacity: 0;
}

.shrink-it {
-webkit-transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1);
-o-transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1);
transition: all 700ms cubic-bezier(0.19, 1, 0.22, 1);
&:hover {
-webkit-transform: scale(0.95);
-ms-transform: scale(0.95);
transform: scale(0.95);
}
}

.fade-in {
opacity:0;
-webkit-animation: FadeIn 400ms ease-in forwards;
animation: FadeIn 400ms ease-in forwards;
}

.fade-slide-up {
opacity:1;
-webkit-animation: FadeUp 400ms cubic-bezier(0.19, 1, 0.22, 1) forwards;
animation: FadeUp 400ms cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

.fade-slide-down {
opacity:1;
-webkit-animation: FadeDown 400ms cubic-bezier(0.19, 1, 0.22, 1) forwards;
animation: FadeDown 400ms cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

.scale-up {
-webkit-animation: ScaleUp 700ms cubic-bezier(0.19, 1, 0.22, 1) forwards;
animation: ScaleUp 700ms cubic-bezier(0.19, 1, 0.22, 1) forwards;	
}


/*
.fade-in-slow {
opacity:0;
animation: FadeIn 1000ms 1s ease-in forwards;
}

.fade-up {
opacity:0;
animation: FadeUp 700ms 1s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}
.fade-up-sequence-2 {
opacity:0;
animation: FadeUp 700ms 1.1s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}
.fade-up-sequence-3 {
opacity:0;
animation: FadeUp 700ms 1.2s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

.fade-up-sequence-4 {
opacity:0;
animation: FadeUp 700ms 1.3s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

.fade-up-sequence-5 {
opacity:0;
animation: FadeUp 700ms 1.4s cubic-bezier(0.19, 1, 0.22, 1) both;	
}
.fade-up-sequence-6 {
opacity:0;
animation: FadeUp 700ms 1.5s cubic-bezier(0.19, 1, 0.22, 1) both;
}
*/


@-webkit-keyframes FadeUp {
from {
opacity: 0;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}

to {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
z-index: 8000;
}
}


@keyframes FadeUp {
from {
opacity: 0;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}

to {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
z-index: 8000;
}
}



@-webkit-keyframes FadeDown {
from {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}

to {
opacity: 0;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
z-index: 6000;
}
}



@keyframes FadeDown {
from {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}

to {
opacity: 0;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
z-index: 6000;
}
}


@-webkit-keyframes FadeIn {
from {
opacity: 0;
}

to {
opacity: 1;
z-index: 8000;
}
}


@keyframes FadeIn {
from {
opacity: 0;
}

to {
opacity: 1;
z-index: 8000;
}
}



@-webkit-keyframes ScaleUp {
from {
-webkit-transform: scale(0.85);
transform: scale(0.85);
}

to {
-webkit-transform: scale(1);
transform: scale(1);
}
}



@keyframes ScaleUp {
from {
-webkit-transform: scale(0.85);
transform: scale(0.85);
}

to {
-webkit-transform: scale(1);
transform: scale(1);
}
}