@charset "utf-8";
/* CSS Document */
/* CSS Document */
/*=======================
Theme: Awesome Photography/Portfolio Template
Author: JLP Media
Email: jennpereira13@gmail.com / lianplameras@gmail.com
Version: 1.1
Date Created: August 11, 2014
Updated : August 23, 2014
=======================
CSS Style Structure
- General
- Preloader
- Navigation
- Header
- Vision/Mission
- Blog Page
- Post Page
- Portfolio
- Portfolio Effects
- Call-to-action
- About Section
- Social Connect
- Footer Section
- Contact Section

Update
- Home Video
=======================*/
/***********************
******* General ********
***********************/

/**************************
******** Preloader ********
**************************/

/**************************
********** Header *********
**************************/

/**************************
***** Vision/Mission ******
**************************/

/**************************
********** Blog ***********
**************************/

/**************************
*** Single Blog Section ***
**************************/

/**************************
******** Portfolio ********
**************************/
.grid {
	overflow: hidden;
	margin: 0;
	padding: 0;
	width: 100%;
	list-style: none;
	text-align: center;
	height: 100%;
}
/* Common style */
.grid figure {
	position: relative;
	z-index: 1;
	display: inline-block;
	overflow: hidden;
	margin: -0.2em;
	width: 33.433%;
	height: 33.433%;
	background: #3085a3;
	text-align: center;
	cursor: pointer;
}
.grid figure img {
    position: relative;
    display: block;
    min-height: 100%;
    opacity: 0.8;
}
.grid figure figcaption {
    padding: 2em;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.grid figure figcaption,
.grid figure a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}
.grid figure h2 {
    word-spacing: -0.15em;
    font-weight: 300;
}
.grid figure h2 span { font-weight: 800 }
.grid figure h2,
.grid figure p { margin: 0 }
.grid figure p {
    letter-spacing: 1px;
    font-size: 100%;
    margin-top: 40px;
}
/**************************
**** Portfolio Effects ****
**************************/
figure.effect-portfolio { background: rgba(0, 0, 0, 1) }
figure.effect-portfolio img { 
    min-width: 100%;
    height: -webkit-calc(100% + 40px);
    height: calc(100% + 40px);
}
figure.effect-portfolio figcaption { padding: 3em }
figure.effect-portfolio figcaption::before,
figure.effect-portfolio figcaption::after {
    position: absolute;
    content: '';
    opacity: 0;
}
figure.effect-portfolio figcaption::before {
    top: 50px;
    right: 30px;
    bottom: 50px;
    left: 30px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: scale(0,1);
    transform: scale(0,1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
figure.effect-portfolio figcaption::after {
    top: 30px;
    right: 50px;
    bottom: 30px;
    left: 50px;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
    -webkit-transform: scale(1,0);
    transform: scale(1,0);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
}
figure.effect-portfolio h2 {
    padding-top: 26%;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
}
figure.effect-portfolio p {
    padding: 0.5em 2em;
    text-transform: none;
    opacity: 0;
    -webkit-transform: translate3d(0,-10px,0);
    transform: translate3d(0,-10px,0);
}
figure.effect-portfolio img,
figure.effect-portfolio h2 {
    -webkit-transform: translate3d(0,-30px,0);
    transform: translate3d(0,-30px,0);
}
figure.effect-portfolio img,
figure.effect-portfolio figcaption::before,
figure.effect-portfolio figcaption::after,
figure.effect-portfolio p {
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
}
figure.effect-portfolio:hover img {
    opacity: 0.7;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
figure.effect-portfolio:hover figcaption::before,
figure.effect-portfolio:hover figcaption::after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
figure.effect-portfolio:hover h2,
figure.effect-portfolio:hover p {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
figure.effect-portfolio:hover h2 { color: #fed136 }
figure.effect-portfolio:hover figcaption::after,
figure.effect-portfolio:hover h2,
figure.effect-portfolio:hover p,
figure.effect-portfolio:hover img {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}
@media screen and (max-width: 69.5em) { 
    .grid figure { width: 50% }
    .grid figure figcaption { font-size: 120% }
}
@media screen and (max-width: 41.5em) { 
    .grid figure { width: 100% }
}

.nivo-lightbox-theme-default .nivo-lightbox-title {
    font: 18px/30px "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased !important;
    font-style: normal;
    font-weight: normal;
    text-transform: uppercase;
    background: #000;
    color: #fff;
    width: 100%;
    padding: 7px 15px;
    border-radius: 0;
    letter-spacing: 3px;
    color: #fec503;
}

.carousel-control.right span.fa, .carousel-control.left span.fa {
    border: 1px solid #fff;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    padding: 2px 15px;
}
.carousel-control.right span.fa:hover,
.carousel-control.left span.fa:hover{
    border: 1px solid #FFBE00;
}

/**************************
***** Portfolio Modal *****
**************************/

/**************************
***** Call-to-action ******
**************************/

/**************************
****** About Section ******
**************************/

/**************************
***** Social Connect ******
**************************/

/**************************
***** Footer Section ******
**************************/
/**************************
#footer {
    background-color: #000000;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: auto;
    min-height: 320px;
    max-height: 1000px;
    text-align: center;
    padding-top: 5%;
    padding-bottom: 2%;
}
#footer h2 {
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    font-size: 46px;
    width: 480px;
    line-height: 30px;
    text-transform: uppercase;
    border: 2px solid #ffffff;
    color: #ffffff;
    padding: 20px;
    margin: 0 auto;
    -webkit-font-smoothing: antialiased !important;
}
#footer h2:hover {
    border: 2px solid #fec503;
    color: #fec503;
    -webkit-transition: all ease .8s;
    -moz-transition: all ease .8s;
    transition: all ease .8s;
}
#footer p {
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    letter-spacing: 2px;
    color: #ffffff;
    line-height: 10px;
    text-transform: none;
    -webkit-font-smoothing: antialiased !important;
}
#footer-nav {
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    letter-spacing: 2px;
    padding-top: 45px;
    background-color: #161616;
    height: 95px;
    color: #ffffff;
    font-size: 10px;
    text-align: center;
}
**************************/
/**************************
****** Contact Form *******
**************************/
.btn-send {
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    font-size: 16px;
    width: 180px;
    line-height: 10px;
    text-transform: uppercase;
    border: 1px solid #ffffff;
    color: #ffffff;
    padding: 15px;
    margin: 0 auto;
    -webkit-font-smoothing: antialiased !important;
    background: transparent;
    border-radius: 0px;
}
.btn-send:hover,
.btn:focus {
    border: 1px solid #fec503;
    color: #fec503;
    -webkit-transition: all ease .8s;
    -moz-transition: all ease .8s;
    transition: all ease .8s;
}
.btn:focus { text-decoration: none }
.btn:focus,
.btn:active:focus,
.btn.active:focus {
    outline: none;
    outline: 0px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}
#contact {
    color: #fff;
    padding-bottom: 80px;
}
.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #FFF;
    background-color: rgba(255, 255, 255, 0);
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
section#contact {
    background-color: #000;
    background-position: center;
    background-repeat: no-repeat;
}
section#contact .section-heading { color: #fff }
section#contact .form-group { margin-bottom: 25px }
section#contact .form-group input,
section#contact .form-group textarea { padding: 20px }
section#contact .form-group input.form-control { height: auto }
section#contact .form-group textarea.form-control { height: 236px }
section#contact .form-control:focus {
    border-color: #fec503;
    box-shadow: none;
}
section#contact::-webkit-input-placeholder {
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}
section#contact:-moz-placeholder {
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}
section#contact::-moz-placeholder {
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}
section#contact:-ms-input-placeholder {
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}
section#contact .text-danger { color: #fec503 }
.alert-danger {
    color: #fec503;
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    background-color: rgba(242, 222, 222, 0);
    letter-spacing: 1px;
    font-weight: lighter;
    border-color: #FFFFFF;
    border-radius: 0px;
}
#contact .close {
    color: #fec503;
    opacity: .5;
}
.alert-success {
    color: #000000;
    font-family: Futura, "Trebuchet MS", Arial, sans-serif;
    letter-spacing: 1px;
    background-color: #FFFFFF;
    border-color: #FFFFFF;
    border-radius: 0px;
}
.hide-first{
    display: none;
}
/**************************
** Home Video Background **
**************************/
.pagination > .active > a, 
.pagination > .active > span, 
.pagination > .active > a:hover, 
.pagination > .active > span:hover, 
.pagination > .active > a:focus, 
.pagination > .active > span:focus {
z-index: 2;
color: #fff;
cursor: default;
background-color: #E3B106;
border-color: #E3B106;
}
.header-text-overlay {
    position: absolute;
    z-index: 10;
    color: #fff;
    text-align: center;
    left: 0;
    right: 0;
    top: 30%;
    bottom: 0;
}

#video{
    margin-top: -90px;
}
#video .videoWrapper {
    margin-bottom: 0;
    margin-top: 70px;
    position: relative;
    padding-bottom: 56.25%; /* 16: 9 */;;;
    padding-top: 25px;
    height: 0;
    overflow: hidden;
}
#video .videoWrapper iframe{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border: 0px;
}
#video .videoWrapper video{
    margin-bottom: -15px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
     width: 110%;
    height: 110%;
}
/**************************
****** Home Parallax *****
**************************/
.bcg {
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  height: 100%;
  width: 100%;
}

/* Slide 1 */
#parallax .bcg {background-image:url('../img/08_parallax.jpg')}

/* Slide 2 */
#about-parallax .bcg {
    background-image:url('../img/09_about_parallax.jpg');
    color: #ffffff;
}