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

/******************************

COLOR PALETTE




[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Logo
	3.2 Main Navigation
	3.3 Hamburger Menu
	3.4 Full Screen Menu
4. Main Slider
	4.1 Main Slider Dots
	4.2 Main Slider Nav
5. Home Social
6. Features
7. About
	7.1 About Progress Bars
8. Testimonials
	8.1 Testimonials Navigation
9. Services
10. Clients
	10.1 Clients Slider
11. Contact
12. Footer



******************************/

/***********
1. Fonts
***********/



/*********************************
2. Body and some general stuff
*********************************/

*
{
	margin: 0;
	padding: 0;
}
body
{

	
}
div
{
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.
ul
{
	list-style: none;
	margin-bottom: 0px;
}
p
{

	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a
{
	display: inline;
	position: relative;
	color: inherit;
	border-bottom: solid 1px #ffa07f;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
a, a:hover, a:visited, a:active, a:link
{
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a:active
{
	position: relative;
	color: #FF6347;
}
p a:hover
{
	color: #FFFFFF;
	background:#990000;
}
p a:hover::after
{
	opacity: 0.2;
}
::selection
{
	background: #990000;
	color: #ff4200;
}
p::selection
{
	background: #7F0000;
}
h1{font-size: 82px;}
h2{font-size: 30px;}
h3{font-size: 18px;}
h4{font-size: 14px;}
h5{font-size: 11px;}
h1, h2, h3, h4, h5, h6
{
	color: #282828;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
h1::selection, 
h2::selection, 
h3::selection, 
h4::selection, 
h5::selection, 
h6::selection
{
	
}
::-webkit-input-placeholder
{
	font-size: 16px !important;
	font-weight: 500;
	color: #777777 !important;
}
:-moz-placeholder /* older Firefox*/
{
	font-size: 16px !important;
	font-weight: 500;
	color: #777777 !important;
}
::-moz-placeholder /* Firefox 19+ */ 
{
	font-size: 16px !important;
	font-weight: 500;
	color: #777777 !important;
} 
:-ms-input-placeholder
{ 
	font-size: 16px !important;
	font-weight: 500;
	color: #777777 !important;
}
::input-placeholder
{
	font-size: 16px !important;
	font-weight: 500;
	color: #777777 !important;
}
.form-control
{
	color: #db5246;
}
section
{
	display: block;
	position: relative;
	box-sizing: border-box;
}
.clear
{
	clear: both;
}
.clearfix::before, .clearfix::after
{
	content: "";
	display: table;
}
.clearfix::after
{
	clear: both;
}
.clearfix
{
	zoom: 1;
}
.float_left
{
	float: left;
}
.float_right
{
	float: right;
}
.trans_200
{
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.trans_300
{
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.trans_400
{
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.trans_500
{
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.fill_height
{
	height: 100%;
}
.super_container
{
	background-color:black;
	width: 100%;
    height:100%;

}
.super_containert
{

	width: 100%;
      height:100%;

}
.button
{
	width: 187px;
	height: 66px;
	background: #ff4200;
	overflow: hidden;
}
.button a
{
	display: block;
	width: 100%;
	color: #FFFFFF;
	font-size: 11px;
	font-weight: 300;
	line-height: 66px;
	text-transform: uppercase;
	letter-spacing: 6.7px;
	
}
.button a img
{
	display: inline-block;
	width: 13px !important;
	height: 7px;
	margin-left: 4px;
}
.button a::after
{
	display: block;
	position: absolute;
	top: -50%;
	left: -70px;
	width: 60px;
	height: 200%;
	background: rgba(255,255,255,0.1);
	content: '';
	-webkit-transform: rotate(12.5deg);
	-moz-transform: rotate(12.5deg);
	-ms-transform: rotate(12.5deg);
	-o-transform: rotate(12.5deg);
	transform: rotate(12.5deg);
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
	z-index: 0;
}
.button a:hover::after
{
	left: calc(100% + 70px);
}
.prlx_parent
{
	overflow: hidden;
}
.prlx
{
	height: 130% !important;
}

/*********************************
3. Header
*********************************/

.header
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 110px;
	padding-left: 48px;
	padding-right: 48px;
	z-index: 20;
	background: #FFFFFF;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

/*********************************
3.1 Logo
*********************************/

.logo_container
{
	flex-basis: 50%;
}
.logo
{
	margin-left: 7px;
}
.logo a
{
	font-family: 'Montserrat', sans-serif;
	font-size: 30px;
	font-weight: 700;
	color: #171717;
	text-transform: uppercase;
}
.logo span:first-of-type
{
	position: absolute;
	top: 0;
	left: -5px;
	color: #ff4200;
	z-index: -1;
}
.logo span:last-of-type
{
	color: #ff4200;
}

/*********************************
3.2 Main Navigation
*********************************/

.main_nav
{
	margin-right: -3px;
	height: 100%;
	flex-basis: 200%;
	text-align: right;
}
.nav_items
{
	height: 100%;
}
.nav_items li
{
	display: inline-block;
	margin-left: 35px;
	height: 100%;
}
.nav_items li a
{
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	color: #0b1033;
	letter-spacing: 3.5px;
	height: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding-left: 14px;
	padding-right: 10px;
}
.nav_items li.active
{
	background: gray;
}
.nav_items li.active a
{
	color: #FFFFFF;
}
.nav_items li:hover
{
	background: gray;
}
.nav_items li:hover a
{
	color: #FFFFFF;
}

/*********************************
3.3 Hamburger Menu
*********************************/

.hamburger_container
{
	display: none;
	cursor: pointer;
	padding: 10px;
	margin-right: -10px;
	flex-basis: 50%;
	text-align: right;
}
.hamburger_text
{
	display: inline-block;
	margin-right: 7px;
	font-weight: 400;
	color: #171717;
}
.hamburger_icon
{
	position: relative;
	display: inline-block;
	width: 22px;
	height: 3px;
	background: #171717;
	margin-bottom: 4px;
}
.hamburger_icon::before,
.hamburger_icon::after
{
	display: block;
	position: absolute;
	left: 0;
	width: 22px;
	height: 3px;
	background: #171717;
	content: '';
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.hamburger_icon.active
{
	background: transparent;
}
.hamburger_icon.active::before
{
	top: -9px;
	transform: translateY(9px) rotate(45deg);
}
.hamburger_icon.active::after
{
	top: 9px;
	transform: translateY(-9px) rotate(-45deg);
}
.hamburger_icon::before
{
	top: -6px;
}
.hamburger_icon::after
{
	top: 6px;
}
.hamburger_container:hover .hamburger_icon::before
{
	top: -8px;
}
.hamburger_container:hover .hamburger_icon::after
{
	top: 8px;
}
.hamburger_container:hover .hamburger_icon.active::before
{
	-webkit-transform: none;
	-moz-transform: none;
	-ms-transform: none;
	-o-transform: none;
	transform: none;
	top: 0;
}
.hamburger_container:hover .hamburger_icon.active::after
{
	-webkit-transform: none;
	-moz-transform: none;
	-ms-transform: none;
	-o-transform: none;
	transform: none;
	top: 0;
}

/*********************************
3.4 Full Screen Menu
*********************************/

.fs_menu_container
{
	position: fixed;
	top: -100vh;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: #FFFFFF;
	z-index: 19;
	-webkit-transition: all 1s 0s cubic-bezier(1,0,0,1);
	-moz-transition: all 1s 0s cubic-bezier(1,0,0,1);
	-ms-transition: all 1s 0s cubic-bezier(1,0,0,1);
	-o-transition: all 1s 0s cubic-bezier(1,0,0,1);
	transition: all 1s 0s cubic-bezier(1,0,0,1);
	padding-left: 48px;
	padding-right: 63px;
	padding-top: 150px;
	text-align: right;
}
.fs_menu_shapes
{
	position: absolute;
	bottom: 32px;
	left: -70px;
	width: 25%;
}
.fs_menu_shapes img
{
	width: 100%;
}
.fs_menu_container.active
{
	top: 0;
}
.fs_menu_list
{
	display: inline-block;
}
.fs_menu_list li
{
	overflow: hidden;
}
.fs_menu_list li a
{
	display: inline-block;
	font-size: 62px;
	font-weight: 700;
	color: #171717;
	line-height: 1.4;
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	-o-transform: translateY(-100%);
	transform: translateY(-100%);
	-webkit-transition: all 600ms 600ms cubic-bezier(.19,1,.22,1);
	-moz-transition: all 600ms 600ms cubic-bezier(.19,1,.22,1);
	-ms-transition: all 600ms 600ms cubic-bezier(.19,1,.22,1);
	-o-transition: all 600ms 600ms cubic-bezier(.19,1,.22,1);
	transition: all 1600ms cubic-bezier(.19,1,.22,1);
}
.fs_menu_list li:first-child a {transition-delay: 600ms;}
.fs_menu_list li:nth-child(2) a {transition-delay: 670ms;}
.fs_menu_list li:nth-child(3) a {transition-delay: 740ms;}
.fs_menu_list li:nth-child(4) a {transition-delay: 810ms;}
.fs_menu_list li:nth-child(5) a {transition-delay: 880ms;}
.fs_menu_list li:nth-child(6) a {transition-delay: 950ms;}
.fs_menu_list li:nth-child(7) a {transition-delay: 900ms;}
.fs_menu_list li:nth-child(8) a {transition-delay: 950ms;}
.fs_menu_list li:nth-child(9) a {transition-delay: 1000ms;}
.fs_menu_list li:nth-child(10) a {transition-delay: 1050ms;}
.fs_menu_container.active .fs_menu_list li a
{
	transform: none;
}
.fs_menu_list li a span
{
	position: relative;
}
.fs_menu_list li a span span
{
	position: absolute;
	top: -1px;
	left: -5px;
	color: gray;
	z-index: -1;
}
.fs_menu_list li a > span::after
{
	display: block;
	position: absolute;
	bottom: 4px;
	left: 0;
	width: 0%;
	height: 3px;
	background: gray;
	content: '';
	-webkit-transition: all 600ms cubic-bezier(.19,1,.22,1);
	-moz-transition: all 600ms cubic-bezier(.19,1,.22,1);
	-ms-transition: all 600ms cubic-bezier(.19,1,.22,1);
	-o-transition: all 600ms cubic-bezier(.19,1,.22,1);
	transition: all 600ms cubic-bezier(.19,1,.22,1);
}
.fs_menu_list li a:hover span::after
{
	width: 100%;
}
.fs_social_container
{
	position: absolute;
	bottom: 0px;
	right: 63px;
	width: auto;
	height: 74px;
	z-index: 11;
}
.fs_social li
{
	display: inline-block;
	margin-left: 10px;
}
.fs_social li a
{
	width: 100%;
	height: 100%;
	padding: 10px;
}
.fs_social li i
{
	font-size: 13px;
	color: rgba(255,66,0,0.6);
}
.fs_social li:hover i
{
	color: rgba(255,66,0,1);
}

/*********************************
4. Main Slider
*********************************/

.home
{
	overflow: hidden;
}
.hero_slider_container
{
	width: 100%;
	height: 840px;
	margin-top: 110px;
}
.main_slider_shapes
{
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 16%;
	max-width: 25%;
	height: auto;
	z-index: 2;
}
.main_slider_item_bg
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.main_slider_content
{
	width: 610px;
	height: 100%;
	margin-top: 240px;
}
.main_slider_content h1
{
	font-weight: 300;
	line-height: 1.15;
	color: #FFFFFF;
}
.main_slider_content h1 span
{
	font-family: 'Myriad Pro Regular', sans-serif;
}
.main_slider_content p
{
	font-size: 16px;
	font-weight: 300;
	color: #FFFFFF;
	padding-left: 5px;
	margin-top: 1px;
}
.discover_button
{
	margin-top: 42px;
	margin-left: 5px;
}

/*********************************
4.1 Main Slider Dots
*********************************/

.main_slider_dots
{
	position: absolute;
	left: 0;
	bottom: 0;
	height: 74px;
	width: 100%;
	z-index: 11;
}
.main_slider_custom_dots li
{
	display: inline-block;
	font-size: 14px;
	font-weight: 300;
	line-height: 74px;
	color: #FFFFFF;
	padding-left: 12px;
	padding-right: 12px;
	cursor: pointer;
	margin-right: -4px;
}
.main_slider_custom_dots li.active
{
	background: #ff4200;
}
.main_slider_custom_dot.active,
.main_slider_custom_dot:hover
{
	background: #ff4200;
}

/*********************************
4.2 Main Slider Nav
*********************************/

.main_slider_nav
{
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 11;
	padding: 10px;
	cursor: pointer;
}
.main_slider_nav_left
{
	left: 39px;
}
.main_slider_nav_right
{
	right: 39px;
}
.main_slider_nav i
{
	color: #FFFFFF;
	font-size: 18px;
}
.main_slider_nav:hover i
{
	color: #ff4200;
}

/*********************************
5. Home Social
*********************************/

.home_social_container
{
	position: absolute;
	top: 110px;
	right: 0px;
	width: auto;
	height: 74px;
	background: #ff4200;
	z-index: 11;
	padding-right: 38px;
	padding-left: 45px;
}
.home_social li
{
	display: inline-block;
	margin-left: 10px;
}
.home_social li a
{
	width: 100%;
	height: 100%;
	padding: 10px;
}
.home_social li i
{
	font-size: 13px;
	color: rgba(255,255,255,0.6);
}
.home_social li:hover i
{
	color: rgba(255,255,255,1);
}

/*********************************
6. Features
*********************************/

.features_col
{
	padding-top: 120px;
	padding-bottom: 120px;
}
.features_item h3
{
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.2em;
}
.features_item img
{
	/*margin-bottom: 35px;*/
}
.features_item p
{
	font-weight: 400;
	margin-bottom: 0px;
	margin-top: 23px;
	max-width: 100%;
}

/*********************************
7. About
*********************************/

.about
{
	padding-top: 195px;
	padding-bottom: 175px;
}
.about_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.about_shapes
{
	position: absolute;
	top: 0;
	left: 0;
}
.section_title h2
{
	display: inline-block;
	position: relative;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #FFFFFF;
	line-height: 1.35;
	margin-bottom: 116px;
}
.section_title h2 span
{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50px);
	-moz-transform: translate(-50%, -50px);
	-ms-transform: translate(-50%, -50px);
	-o-transform: translate(-50%, -50px);
	transform: translate(-50%, -50px);
	font-size: 72px;
	font-weight: 900;
	color: #ff0000;
	opacity: 0.32;
}
.section_title h2::before
{
	display: block;
	position: absolute;
	bottom: 61px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(calc(-50% - 4px));
	width: 2px;
	height: 45px;
	content: '';
	background: #FFFFFF;
}
.about_text
{
	padding-right: 50px;
}
.about_text p
{
	color: #FFFFFF;
	margin-bottom: 0px;
}
.about_text img
{
	margin-top: 20px;
}

/*********************************
7.1 About Progress Bars
*********************************/

.skills_container
{
	padding-top: 10px;
}
.pb_item
{
	margin-bottom: 18px;
}
.pb_item h5
{
	text-transform: uppercase;
	color: #FFFFFF;
	letter-spacing: 0.3em;
	margin-top: 18px;
}
.skill_bars
{
	height: 3px;
}
.progressbar-text
{
	width: 48px;
	font-family: 'Open Sans', sans-serif;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.3em;
	text-align: right;
}


/*********************************
12. Footer
*********************************/

.footer
{
	background: #111111;
}
.footer_content
{
	height: 96px;
}
.footer_social_container
{
	display: inline-block;
}
.footer_social li
{
	display: inline-block;
	margin-left: 6px;
}
.footer_social li:first-child
{
	margin-left: 0px;
}
.footer_social li a
{
	width: 100%;
	height: 100%;
	padding: 10px;
}
.footer_social li i
{
	font-size: 14px;
	color: rgba(110,110,110,0.6);
}
.footer_social li:hover i
{
	color: rgba(255,255,255,1);
}
.cr p
{
	margin-bottom: 0px;
}