@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700');

@import url('https://fonts.googleapis.com/css?family=EB+Garamond');

html body{font-family:'EB Garamond', serif;}
html body h1, 
html body h2 , 
html body h3, 
html body h4, 
html body h5, 
html body h6, 
html body h7 {font-family: 'Roboto Condensed', sans-serif;font-weight:900;}
.slide {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

#verticalslider {
    width: 100%;
    height: 100vh;
    position: relative;
}

.bg-media {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

.bg-media img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
	    object-position: left bottom;
}
#bodyholder {/* margin-top: 240px; */transition: all 0.5s ease;

 position: relative;
    min-height: 100vh;
}
.slide {
    position: absolute;
    left: 0;
    right: 0;
    top: -100%;
    bottom: 100%;
    transition: all 0.5s ease;
} 
#verticalslider {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    display: none;
    bottom: 0;
    overflow: hidden;
    display: none;
} 
.slide .bg-media img{
    position:absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height:100%;
    width:100%;
    object-fit:cover;
}
.slide .container {
    position: relative;
    top: 200px;
    /* transform: translateY(-50%); */
    z-index: 200;
    color: #fff;
}
.slidenumber {
    position: absolute;
    z-index: 600;
    color: #fff;
    top: 192px;
    font-size: 22px;
	width: 7%;
}
.slide h1 {
    font-size: 100px;
	text-transform:capitalize;
}
.slidenumber:after {
    content: "";
    height: 2px;
    width: calc(100% - 22px);
    display: inline-block;
    background: #fff;
    top: -4px;
    position: relative;
    left: 6px;
}
#verticalslider>.container{
	position:relative;
}
.slide_1{
	background:#fff;
}

.active_slide_1 .slide.slide_1 , 
.active_slide_2 .slide.slide_2, 
.active_slide_3 .slide.slide_3, 
.active_slide_4 .slide.slide_4, 
.active_slide_5 .slide.slide_5, 
.active_slide_6 .slide.slide_6, 
.active_slide_7 .slide.slide_7, 
.active_slide_8 .slide.slide_8, 
.active_slide_9 .slide.slide_9 , 
.active_slide_10 .slide.slide_10{
    top: 0;
    bottom: 0;
}
.active_slide_1 .slide {
    top: -100%;
    bottom: 100%;
}
.active_slide_1 .slide_1 ~ .slide ,
.active_slide_2 .slide_2 ~ .slide ,
.active_slide_3 .slide_3 ~ .slide ,
.active_slide_4 .slide_4 ~ .slide ,
.active_slide_5 .slide_5 ~ .slide ,
.active_slide_6 .slide_6 ~ .slide ,
.active_slide_7 .slide_7 ~ .slide ,
.active_slide_8 .slide_8 ~ .slide ,
.active_slide_9 .slide_9 ~ .slide ,
.active_slide_10 .slide_10 ~ .slide {
    top: 100%;
    bottom: -100%;
}
.bg-media{
	opacity:0;
	transition:all 1s ease;
}
.active_slide_1 .slide.slide_1 .bg-media ,
.active_slide_2 .slide.slide_2 .bg-media ,
.active_slide_3 .slide.slide_3 .bg-media ,
.active_slide_4 .slide.slide_4 .bg-media ,
.active_slide_5 .slide.slide_5 .bg-media ,
.active_slide_6 .slide.slide_6 .bg-media ,
.active_slide_7 .slide.slide_7 .bg-media ,
.active_slide_8 .slide.slide_8 .bg-media ,
.active_slide_9 .slide.slide_9 .bg-media ,
.active_slide_10 .slide.slide_10 .bg-media
{
	opacity:1;
}
.slide.slide_1 .container{
    height: 100%;
    top: 0;
    bottom: 0;
}
.slide_1 h1{
    color: #000;
    text-align: center;
    font-size: 240px;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.slide_1 p{
    color: #000;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 70px;
    margin:0;transition:all 1s ease;opacity:0
} 

.active_slide_1 .slide_1 p{
	opacity:1;
	font-weight:700;
	font-size:24px;
}
.slide.slide_1 h1.hidemobile {
    display: block;
}

.slide.slide_1 h1.hidemobile img {
    max-width: 100%;
}

.slide.slide_1 h1.showmobile {
    display: none;
}
.active_slide_1 .slide_1 p:after{
	height:50px;
}
.slide h2{
	font-size:80px;
	text-transform: capitalize;
}
.slide hr {
    border-color: #fff;
    max-width: 100px;
    text-align: left;
    margin-left: 0;
}
.subheading {
    font-size: 24px;
    line-height: 18px;
    text-transform: capitalize;
}
.slide p{
	font-size:21px;
}
.hidemobile{display:initial}
.showmobile{display:none}
@media(max-width:767px){
.hidemobile{display:none}
.showmobile{display:initial}
.slide h1 {
    font-size: 50px;
}
.slide_1 h1 {
    font-size: 200px;
}
}


/*css for inner pages*/
#work, #jobs , #about , #contact , #team_member{background: #151515;color:#fff;}
.header .bg-media{opacity:1;position: absolute;}
section.header{
    height: 80vh;
    position: relative;
}
.header h1 {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 20px;
    z-index: 100;
    font-size: 180px;
    text-align: left;
    line-height: 1;
    padding-top: 150px;
}
@media(min-width:768px){
	section.header {
    min-height: 500px;
}
}
.portfoliorow > div  > a{
    display: block;
}
.portfoliorow > div  > a:after{content:"";background: rgba(0,0,0,0.5);position: absolute;z-index: 50;left: 0;right: 0;transition: all 0.25s ease;top: 0;bottom: 0;opacity: 0;}
.portfoliorow > div:hover  > a:after{content:"";opacity: 1;}
.portfoliorow > div{
    cursor: pointer;
}
.portfoliorow > div img{
    max-width: 100%;
}
section.sideheading.portfolioheader:first-of-type {
    padding-top: 150px;
}
.portfoliorow > div:hover{}
.portfoliorow > div h3{
    position: absolute;
    bottom: 30px;
    font-size: 38px;
    line-height:40px;
    left: 20px;
    right: 20px;
    color: #fff;
    z-index: 100;
    transition: all 0.25s ease;
}
.portfoliorow > div:hover h3{
    bottom: 60px;
}
.portfoliorow > div i{
    position: absolute;
    bottom: 30px;
    left: 20px;
    right: 20px;
    color: #fff;
    z-index: 100;
    font-size: 25px;
    opacity: 0;
    transition: all 0.25s ease;
}
.portfoliorow > div:hover i{
    opacity: 1;
}
.portfoliorow{}

h2.text-capitalize{
	margin:0px 0 50px;
	font-family: inherit;
	font-size: 60px;
}
.portfolio-tiles .container{
	width:90%;
	max-width:90%;
}
.sideheading .container{
	width:75%;
	max-width:75%;
}
.sideheading a:not(.btn){
	color:inherit;
}

.sideheading a:not(.btn):hover{
	color:#bf1f26;
	text-decoration:none;
}
.sideheading .btn-dark.btn{
    border-radius: 0;
    padding: 15px 30px;
    font-size: 22px;
    margin: 20px 0;
}
.sideheading {
    padding-bottom: 80px;
    padding-top: 80px;
    background: #000;
    color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.biggap{height:300px}

section.portfolio-tiles {
    overflow: hidden;
    padding-top: 60px;
    padding-bottom: 100px;
}

.sideheading .row .row > div{}
.sideheading .row .row > div img{max-width:100px;margin:auto;}
.sideheading hr{border-color:#fff;}
.sideheading h3{font-size:24px;margin: 10px 0 30px;}
.sideheading h4{font-size:36px;margin: 0 0 30px;}
.bg-media video{
object-fit: cover;
object-position: center center;
}
.sideheading.white{
background: #fff;
color: #000;
}
.sideheading h3 {

}
.sideheading h4 {

}
.sideheading h5 {

margin: 20px 0 30px;

font-size: 28px;
}
ul.links-colums {
padding: 0;
list-style: none;
font-size: 22px;
}
ul.links-colums li:last-child{
	border-bottom:0 none transparent;
}
ul.links-colums li{
padding: 20px 0px;
border-bottom: 1px solid #515151;
}
ul.links-colums li  a{

color: inherit;
}
.sideheading img {
max-width:100%;
}
.gap{height:30px}
.sideheading.white hr {
border-color: #343434;
}
.row.row-tight{
	margin-right:-5px;
	margin-left:-5px;
}
.row.row-tight > div{
	padding: 0 5px 0;
}
.row.row-tight.linksrow > div:before{content:"";border-bottom: 1px solid;display: block;margin: 10px 0 20px;}
.row.row-tight.linksrow > div{
	padding: 20px 5px 40px;
}
.row.row-tight.linksrow > div a{
    font-family: 'Roboto Condensed', sans-serif;
    display: block;
    font-size: 24px;
	font-weight:700;
}
.row.row-tight.linksrow > div span{
    color: #7e7e7e;
    font-size: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block;
}
@media(min-width:768px){
.splitpara{
    column-gap: 30px;
    column-count: 2;
}
}

.sideheading p {font-size: 24px;margin: 0 0 50px;}
.row.addresses-to-contact p{
	margin:30px 0 100px
}
.sideheading.white p {

}
.header .btn.btn-danger{
    position: absolute;
    z-index: 500;
    font-size: 40px;
    padding: 19px 23px;
    left: 50%;
    top: 50%;
    border-radius:0px;
    transform: translate(-50% , -50%);
	    opacity: 0.6;
    background: #bf1f26;
}
@media(max-width:767px){
.header .btn.btn-danger{
    font-size: 30px;
    padding: 9px 12px;
}
.header h1 {
    font-size: 50px;
}	
h2.text-capitalize ,
.sideheading h2.text-capitalize{
    font-size: 30px;
}	

.portfolioheader h2, .largeheadingswithnumbers h2 {
    font-size: 35px !important;
}
section.portfolio-tiles {
    padding-left: 20px;
    padding-right: 20px;
}

}
.sideheading h2.text-capitalize{}
.sideheading h2.text-capitalize{
	margin: 0px 0 30px;
}

.portfolioheader h2 ,
.largeheadingswithnumbers h2{
	font-size:70px;
}
.largeheadingswithnumbers small{
	font-size:20px;
}
.sideheading.portfolioDetals {
    background: #b7b7b7;
    position: relative;
}

.sideheading.portfolioDetals .hangleft{
    position: absolute;
    left: 0;
    bottom: 0;
    max-width: 30%;
    max-height: 100%;
}
.sideheading.portfolioDetals .hangright{
    max-width: 35%;
    right: 20px;
    top: 60px;
    position: absolute;
    z-index: 1;
}
.largeReadingFont{
	font-size: 80px;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:700;
}
.sideheading.portfolioDetals .container .row >  div{
	position:relative;
	z-index:100;
	margin-bottom: 30px;
}
.sideheading.portfolioDetals h2{}
.sideheading.portfolioDetals p{}
.largeheadingswithnumbers > div{
	margin-bottom:60px;
}
.contact .portfoliorow > div .whiteaquareholder h3{
position: static;
color: inherit;
margin: 0 0 40px;
}
.portfoliorow > div .whiteaquareholder h5
{
	
}
.whiteaquareholder > a{
	display:block;
}
.whiteaquareholder a{color:inherit;}
.whiteaquareholder a:hover{color:inherit;text-decoration:none;}
.whiteaquareholder{
	font-size:20px;
	display: block;
	background: #fff;
	margin: 0 1px 1px 0px;
	color: #343434;
	padding: 80px 50px;
}
.whiteaquareholder:after {
    content: "";
    display: block;
    position: absolute;
    height: 40px;
    width: 40px;
    border: 3px solid;
    right: 20px;
    bottom: 20px;
    border-radius: 50%;
}
.whiteaquareholder:hover{
	background:#888;
	transition:all 0.25s ease;
}


@media(min-width:768px){
section.photoholder .twocol{
	column-count:2;
	column-gap:20px;
}
}
section.photoholder img{
	width:100%;
	margin:0 0 20px
}
.formholder .form-row{
	margin-bottom:20px;
}
.formholder .form-control{
	padding:10px;
	border-radius:0;
}
.formholder label{
	font-weight:900;
	font-size:20px
}

.carosalholder .carousel{
	position : relative;
	top:-80px;
}


.white ul.links-colums li {
    border-bottom: 0 none transparent;
    position: relative;
}

.white ul.links-colums li:after {
    content: "";
    display: block;
    border-bottom: 1px solid #ddd;
    bottom: -20px;
    position: relative;
    max-width: 220px;
}


@media(max-width:992px){
	.sideheading.portfolioDetals .hangleft,
.sideheading.portfolioDetals .hangright{
	display:none;
}
}

/*footer css*/
div#bodyholder.home {}

div#bodyholder.home+.global-footer {
    display: none;
}

div.global-footer {
    background: #151515;
    padding: 60px 20px;
}

.global-footer__wrapper {
    max-width: 1170px;
    margin: auto;
}

a.global-footer {
    float: left;
}

a.global-footer img {
    max-width: 40px;
}

.global-footer__mantra {
    display: inline-block;
    color: #fff;
    border-left: 1px solid #fff;
    line-height: 40px;
    margin-left: 20px;
    padding-left: 20px;
    font-family: 'Lato', sans-serif;
    font-size: 40px;
}

.global-footer__branding {margin: 0 0 30px;}

nav.global-footer__nav > a {
    color: #fff;
    font-family: 'lato' , sans-sarif;
    padding: 6px;
}

aside.global-footer__copyright {color: #b7b7b7;font-family: lato;}
.sideheading.clientssection {
    background: black;
}
.sideheading.clientssection .col-sm-8.offset-sm-1 > div > div {
    padding: 20px 15px;
    text-align: center;
}
nav.global-footer__nav {
    margin: 0 0 30px;
}
@media(min-width:992px){
.global-footer__branding {
    float: left;
}

nav.global-footer__nav {
    float: right;
}

aside.global-footer__copyright {
    float: right;
    clear: left;
}



}
	.slide .bg-media img {
    object-position: center right;
    /* object-fit: cover; */
}
.header .bg-media img {
    object-position: center;
}

.slide.slide_7 h1 i {
    font-family: cursive;
    font-size: 50%;
	text-transform:lowercase;
}
@media(max-width:575px){
	.slide h2 {
    font-size: 30px;
}
.portfolioheader h2 {
    font-size: 35px;
    text-align: center;
}

.sideheading:first-of-type h3 {
    text-align: center;
}

.header h1 {
    font-size:30px;
}	
section.sideheading.portfolioheader {
    text-align: center;
}
}




/*slider disable on mobies and small devices*/
img.mobileimage{display:none;}
@media(max-width:767px){
	.home #verticalslider {
    position: relative;
    height: auto;
}

.slide .bg-media {
    opacity: 1;
    position: absolute;
}

.slide {
    height: auto;
    min-height: 100%;
    min-height: 100vh;
    position: relative;
}

.slide.slide_1 .container {
    height: 100vh;
}

.slide_1 p {z-index: 1000;opacity: 1;}

button.btn.btn-link.downarrow {
    display: none;
}

.slidenumber {
    display: none;
}

.slide:after {
    content: "\f103";
    font-family: fontawesome;
    color: #fff;
    position: absolute;
    bottom: 0;
    font-size: 30px;
    width: 100%;
    text-align: center;
    display: block;
    -webkit-animation: bounce 6s infinite;
    animation: bounce 6s infinite;

}

.slide.slide_1:after {
    color: #000;
}

.slide.slide_7:after {
    content:"";
}
.subheading:before {content: "0"counter(section)" ";padding-left: 0;}

div#verticalslider {
    counter-reset: section;
}

.slide {
    counter-increment: section;
}
.slide .container {
    position: relative;
    top: 0;
    padding-top: 200px;
}
img.mobileimage {
    z-index: 50;
    object-position: center !important;
    display: block;
    top: 0px;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    object-fit: cover;
}

img.mobileimage + img {
    display: none;
}
section.sideheading.portfolioheader {
    position: relative;
}

section.sideheading.portfolioheader .container {
    position: relative;
    z-index: 100;
}

.clearfix.biggap {
    height: 60px;
}
}



/*removeable script after vue integration*/
#work, #jobs , #about , #contact , #team_member , #location , #apply ,
#how-we-do {display: none;}
.home #verticalslider {display:block}
.work #work{display: block;}
.jobs #jobs{display: block;}
.about #about{display: block;}
.contact #contact{display: block;}
.team_member #team_member{display:block}
.location #location{display:block;}
.apply #apply{display:block;}
.how-we-do #how-we-do{display:block}
/*removeable script after vue integration end*/