/*
Theme Name: ICHI - Version: 1
Description:  Designed by josweb.
Author:  Jo
Purchase:  http://themeforest.net/user/josweb

01. GENERAL STYLING
02. SECTIONS
03. MENU
04. STACK SLIDER
05. PIE CHARTS
06: TEAM
07: TEAM - MODAL BOX
08. TEAM - SKILL BARS
09. WORK
10. PRICING TABLES
11. CONTACT SECTION
12. FOOTER + SMALL HOVER IMG
13. BLOG
14. BUTTONS
15. CSS3 ANIMATIONS
16. MEDIA QUERIES
*/

/*-----------------------------------------------------------------------------------*/
/*	01: GENERAL STYLING
/*-----------------------------------------------------------------------------------*/	
@font-face {
font-family: "Avgr";
src: url ("css/avgr46w.ttf");
}

@font-face {
  font-family: 'HelveticaB';
  src: local('css/Helvetica-Bold-Font.ttf');
}

.helvib {
    font-family: 'HelveticaB';
}

@font-face {
  font-family: 'CGR';
  src: local('css/GOTHIC.TTF');
}

.cgr {
    font-family: 'CGR';
}
@font-face {
  font-family: 'CGB';
  src: local('css/GOTHICB.TTF');
}

.cgb {
    font-family: 'CGB';
}



@font-face {
    font-family: 'Calibri';
    src: url('css/Calibri-Bold.eot');
    src: local('css/Calibri Bold'), local('css/Calibri-Bold'),
        url('css/Calibri-Bold.eot?#iefix') format('embedded-opentype'),
        url('css/Calibri-Bold.woff2') format('woff2'),
        url('css/Calibri-Bold.woff') format('woff'),
        url('css/Calibri-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Calibri';
    src: url('css/Calibri.eot');
    src: local('css/Calibri'),
        url('css/Calibri.eot?#iefix') format('embedded-opentype'),
        url('css/Calibri.woff2') format('woff2'),
        url('css/Calibri.woff') format('woff'),
        url('css/Calibri.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Calibri';
    src: url('css/Calibri-LightItalic.eot');
    src: local('css/Calibri Light Italic'), local('css/Calibri-LightItalic'),
        url('css/Calibri-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('css/Calibri-LightItalic.woff2') format('woff2'),
        url('css/Calibri-LightItalic.woff') format('woff'),
        url('css/Calibri-LightItalic.ttf') format('truetype');
    font-weight: light;
    font-style: italic;
}

body {
	//font-family: 'HelveticaB', helvib;
	font-size: 18px;
	line-height: 28px;
	//color: #71767d!important;
	color: #ffffff!important;
	font-weight: 400;
	//background: #0f6a61;
	overflow-x: hidden!important;
	overflow-y: scroll;
	margin: 0;
	text-rendering: optimizeLegibility;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	-webkit-font-smoothing: subpixel-antialiased;
	height: 100%;
	width: 100%;
}

html { font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; height:100%;}
a, a:visited, a:hover, a:active, a:focus, input, select, textarea { outline:none; text-decoration:none; }
a, li { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
:focus { outline: 0; }
ul { list-style-type:none; padding:0; margin:0 0 10px 0px;}
ol { padding:0; margin:0 0 20px 20px;}
ul.unstyled,ol.unstyled{margin-left:0;list-style:none; }
ul.inline,ol.inline{margin-left:0;list-style:none;}
ul.inline>li,ol.inline>li{display:inline-block;*display:inline; *zoom:1; padding-left:5px; padding-right:5px; }

code{ color:#384049; }
img { display:block; height:auto; max-width:100%;  vertical-align:top; ms-interpolation-mode:bicubic; opacity:1.0; width: auto\9;}
iframe { border: 0; }
.well { box-shadow:none; border:none; -webkit-border-radius:0px; -moz-border-radius:0px; border-radius:0px; background:transparent; }
.center { margin:0 auto; }
ul { list-style-type: none; }
.pull-left { margin-right:10px; }
.pull-right { margin-left:10px; }
.grey { color:#8e939a; }
.white { color:#f0f0f0!important; }
h3.white { color:#f0f0f0!important; }

#overlay {	
	background: url(../img/overlay1.png) repeat;
	position: absolute;
	z-index: 0!important;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 100%;
	opacity:0.7;
}

/**** PRELOADER ****/
#preloader { position: fixed; top:0; left:0; right:0; bottom:0; background-color:#fff; z-index:10000; }
#status {
	width:200px;
	height:200px;
	position:absolute;
	left:50%; top:50%; 
	background-image:url(../img/status.html);
	background-repeat:no-repeat;
	background-position:center;
	margin:-100px 0 0 -100px; 
}

/****PATTERN OVERLAY ****/
#overlay {	
	background: url(../img/overlay1.png) repeat;
	position: absolute;
	z-index: 0!important;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 100%;
	opacity:0.7;
}
.drop { filter: drop-shadow(8px 10px 5px rgba(0, 0, 0, 0.7)); }
/**** CAROUSEL ****/
.carousel-indicators{ top:0px; }
.carousel-control { 
   position: absolute;
	top: 50%;
	left: 15px;
	width: 50px;
	height: 50px;
	font-size: 25px;
	outline: none; 
	webkit-transition: none;  
    -moz-transition: none;  
    -o-transition: none;
	transition: none;
	 border: 0px none;
	-webkit-border-radius: 0px;
	-moz-border-radius:0px;
	border-radius: 0px;
	z-index:1;
}
.carousel-control.right { right:0px; left:auto; top:45%; background-image: none!important; filter: none!important; }
.carousel-control.left { left:0px; right:auto; top:45%; background-image: none!important; filter: none; }
	
/**** ICONS ****/
.icons li [class^="icon-"],.icons li [class*=" icon-"]{display:inline-block;width:1.2857142857142858em;text-align:center; margin-right:3px;}

/**** TOOLTIP ****/
.tooltip-inner { margin:0 0 10px; padding:7px 12px; color:#fff; font-weight:400; }
.tooltip.top .tooltip-arrow { margin:0 0 10px;  }

/**** BLOCKQUOTE ****/
blockquote { border-left:4px solid #8e939a!important; color:#8e939a!important; padding: 10px; }

/**** VIDEO ****/
.vendor { position: relative; padding:0 0 56.25%; height: 0; margin 0 0; }
.vendor iframe { position:absolute; top:0; left:0; width:100%; height:100%; } 

/**** PADDING ****/
.pad200 { padding-top: 200px; }
.pad90 { padding-top: 90px; }
.pad60 { padding-top: 60px; }
.pad45 { padding-top: 45px; }
.pad30 { padding-top: 30px; }
.pad25 { padding-top: 25px; }
.pad20 { padding-top: 20px; }
.pad15 { padding-top: 15px; }
.pad10 { padding-top: 10px; }
.pad5 { padding-top: 5px; }
.pad-right5 { padding-right: 5px; }
.pad-left5 { padding-left: 5px; }
.pad-bottom5 { padding-bottom: 15px; }
.pad2 { padding-top: 2px; }

/**** TYPOGRAPHY ****/
//h1, h2, h3,h4,h5,h6 { font-family: 'Source Sans Pro', sans-serif; color:#5a5f66!important; }
h1 { 
	font-size: 6.67em;
	font-weight: 200;
	letter-spacing: -2px;
	line-height: 100px;
	margin-bottom: 30px;
}
h2 { 
	font-size: 1.88em;
	font-weight: 400;
	letter-spacing: 0px;
	line-height: 44px;
	margin-bottom: 30px;
	//color:#696f77!important;
}

/*h3 { font-size:32px; line-height:1.2em; margin-bottom: 20px; font-weight:300!important; }*/
h3 { font-family: 'Calibri'; font-size:51px; color:#FFFFFF; font-weight: bold; font-style: normal;}
h4 { font-size:28px; line-height:1.2em; margin-bottom: 20px; font-weight:300!important; }
h5 { font-size:24px; line-height:1.5em; margin-bottom: 20px; font-weight:300!important; }
h6 { 
  font-family: 'Calibri';
    font-size:22px;
	font-weight: bold;
    font-style: normal;
	/*line-height: 1.71em;
	margin: 0px 0 20px 0;
	font-weight: 400;*/
}

h7{font-family: 'Calibri'; font-size:30px; color:#917e19; font-weight: 250; font-style: normal;}
h8{ font-family: 'Calibri'; font-size:30px; color:#010101; font-weight: light; font-style: italic;}
h9{ font-family: 'Calibri'; font-size:36px; color:#FFFFFF; font-weight: bold; font-style: normal;}
h10{ font-family: 'Calibri'; font-size:30px; color:#FFFFFF; font-weight: bold; font-style: normal;}

p {
	font-size: 18px;
	line-height: 28px;
	margin-bottom: 25px;
	font-weight: 400;
	color: #71767d;
}

.lead{
	font-size: 24px;
	line-height: 36px;
	font-weight: 300;
	margin: 20px auto 70px;
	color: #8e939a;
}
	
h2.contact_title {
	font-size: 28px;
	line-height: 38px!important;
	margin: 0 0 20px;
	font-weight: 300!important;
	color:#5a5f66!important;
}
	
h6.skill {
	font-weight: 400!important;
	font-size: 13px;
	color: #8e939a!important;
	line-height: 10px;
}

/*-----------------------------------------------------------------------------------*/
/*	02: SECTIONS
/*-----------------------------------------------------------------------------------*/	
#Section-1 { background:#fff;  background-image: url(../img/fondo25.png); background-position: center center;
  
        /* Make image fixed */
        background-attachment: fixed;
  
        /* Not repeat images */
        background-repeat: no-repeat;
  
        /* Set background size auto */
        background-size: auto;
}  //0f6a61 0a564c
#Section-2 { background:#0f6a61; padding:90px 0 0px; margin-bottom:-20px;   }
#Section-3 { background:#62836c; padding:90px 0 0px;} 
#Section-3X { background:#FFF; padding:60px 0 0px;}  	
#Section-4 { background:#fff; padding-top:90px; } 
#Section-5 { background:#fff; padding:90px 0 90px; margin-top:-90px; } 
#Section-6 { background:#fff; padding:1px 0 1px; } 

/*-----------------------------------------------------------------------------------*/
/*	TOP INTRO SECTIONS
/*-----------------------------------------------------------------------------------*/	
/**** INDEX - PARALLAX INTRO SECTION ****/
#Section-top .well {
	padding:200px 0 100px; 
	background: url(../img/parallax-1.jpg) 50% 0% fixed repeat;
	-webkit-background-size: cover !important; 
    -moz-background-size: cover !important;  
    -o-background-size: cover !important; 
    background-size: cover !important;
	margin-bottom:0px;
}
.parallax-section { position:relative; }

/**** INDEX SLIDER -  INTRO SECTION ****/
.slider, .slides, .flex-viewport, .top-slider { position:relative; height:100%; width:100%; }
#slider { min-height: 1280px; }
.slides li {
	/*min-height:840px;*/
	display: block;
	position: relative;
	-webkit-background-size: cover !important ;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	background-size: cover !important;
	height: 100% !important;
	width: 100% !important;
	background-position:top center !important;
}
.slider { height: 100%; min-height: 100%; position: relative; overflow: hidden; }
.slider .slider-holder {
	display: inline-block;
	position: absolute;
	top: 5%;
	//left: 33%;
	/*-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);*/
	width: 100%;
	z-index:10; 		
}
.slider .slider-holder1 {
	display: inline-block;
	position: absolute;
	top: 70%;
	//left: 33%;
	/*-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);*/
	width: 100%;
	z-index:10; 		
}

/**** INDEX VIDEO - INTRO SECTION ****/
#top_video{
	background: url(../img/top_image.jpg) no-repeat;
	z-index: 1!important;
	width: 100%;
	height: 100%;
	display: block;
	-webkit-background-size: cover !important ;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	background-size: cover !important;
}
#volume { margin: 0 auto; color: #fff; cursor: pointer; font-size: 25px; }
	
/**** TOP INTRO TEXT ****/
.intro {
	height: 100%;
	min-height: 100%;
	position: relative;
	overflow: hidden;
	text-align: center;
	z-index: 50;
}
.intro .intro-container {
	margin: 230px auto;
	width: 840px;
	max-width: 100%;	
	height: 100%;
}
.intro-container h1 { 
	margin: 0 auto;
	font-size: 70px;
	font-weight: 500!important;
	line-height: 65px;
	letter-spacing: 0px;
	color: #fff!important;
	text-shadow:  0px 1px 1px rgba(0,0,0,0.3); 
}
.intro-container .rotate  {
	letter-spacing: 5px;
	font-weight: 500!important;
	margin: 25px auto 55px;
	text-transform: uppercase;
	color: #fff;
	text-shadow:  0px 1px 1px rgba(0,0,0,0.3);
}
.intro-container h1 .rotate  { letter-spacing: 2px; font-weight:200!important; }
.rotate { display:none; }
.intro-container .divider { background: url(../img/divider.png) repeat; width:8%; height:5px; margin:0 auto 30px; }

.circle-link {
   margin: 0px auto 0;
    text-align: center;
   width: 80px;
    height: 80px;
   -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
	-webkit-animation-delay:2s;
	-moz-animation-delay:2s;
	-ms-animation-delay:2s;
	-o-animation-delay:2s; 
	animation-delay: 2s;
}
.circle-link:hover { background: #111; 
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.circle-link a { color: #bbb; }
.circle-link a:hover {  color: #fff; }
.ilink { font-size:65px; margin:13px 0px 0 1px;}

/*-----------------------------------------------------------------------------------*/
/*	OTHER SECTIONS
/*-----------------------------------------------------------------------------------*/	

/**** BIG FIXED IMAGE ****/
#big_image{
	background: url(../img/big_image.jpg) ;
	/*padding:100px 0 170px;*/
	width: 100%;
	height: 100%;
	margin: 0 auto 0px;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	background-attachment: fixed;
	background-repeat: repeat-y;
	background-position: top center;
}
#big_image .lay {	
	background: url(../img/overlay1.png) repeat;
	/*position: absolute;*/
	z-index: 0!important;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 100%;
	/*opacity:0.7;*/
}

/**** SECTION 1 MILESTONES ****/
 #Section-1 .well{ 
	background: url(../img/parallax-2.jpg) 50% 0% fixed no-repeat;
	padding: 120px 0 420px;
	background-position: top center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	margin-bottom: -20px;
}
#Section-1 .well h1 {
	margin:0 auto;
	font-size: 2.5em!important;
	font-weight: 300!important;
	line-height: 60px;
	letter-spacing: 0px;
	text-align: center;
	text-transform: uppercase;
}
.counter { 
	background: url(../img/overlay2.png) repeat;
	padding: 20px 0;
	font-size: 70px;
	font-weight: 700!important;
	line-height: 80px;
	color: #eee;
}
.counter_bottom { margin-bottom:-280px; }

/**** SECTION 2 VIDEO ****/
#Section-2 .well{ 
	background: url(../img/parallax-3.jpg) 50% 0%  fixed no-repeat;
	padding: 20px 0 40px;
	width: 100%;
	height: 100%;
	background-position:top center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
}
.video_section{ margin:50px auto; min-height:320px!important; background:url(../img/overlay1.png) repeat; padding:10px 0 30px; }

/**** BAR - BIG STATS ****/
#bigstats { margin: 0 auto; padding:40px 0; }
#bigstats .text-rotator-fade { color:#fff!important; font-weight:800!important; }
#bigstats .block_font { 	
	color: #2E3138!important;
	font-size: 2.5em!important;
	font-weight: 700!important;
	z-index: 10!important;
	line-height:40px;
	letter-spacing: 0px;
	text-align: center;
	text-transform: uppercase; 
}

/**** SECTION 4 QUOTES/TESTIMONIALS ****/
#Section-4 .well{
	background: url(../img/big_image2.jpg) ;
	padding:150px 0 100px;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	background-attachment: fixed;
	background-repeat: repeat-y;
	background-position: top center;
}
/**** QUOTES/TESTIMONIALS ****/
.carousel2 { padding:30px 20px; margin:0px auto 60px; background: url(../img/overlay1.png) repeat; }
.quote{ margin:10px auto; text-align:center; }
.quote p{ 
	font-size: 35px;
	line-height: 45px;
	margin: 7px auto;
	color: #f1f1f1!important;
	font-weight: 700;
	text-transform: uppercase;
}
.quote-small { margin-top:10px; font-size:18px; line-height:30px; color:#fff; text-align:center; font-weight:400; }
.quote-small a { color:#fff!important; font-size:14px; font-weight:400; text-align:center;}

/****  BAR - CLIENTS ****/
#Section-Colour { margin: 0 auto; }

/**** BOTTOM BIG FIXED IMAGE ****/
#bottom_image{
	background: url(../img/big_image3.jpg) ;
	padding:45px 0px 0px;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	height:380px;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	background-attachment: fixed;
	background-repeat: repeat-y;
	background-position: top center;
}

/*-----------------------------------------------------------------------------------*/
/*	03: MENU
/*-----------------------------------------------------------------------------------*/	
header {
     width: 100%;
    height: 80px;
    position: fixed;
	z-index: 90!important;
	top: 0;
    left: 0;
}
.header {
    width: 100%;
    height: 80px;
   	position: fixed;
    top:0;
    left:0;
    transition: height 500ms, background 500ms;
	/*border-bottom: 1px solid #CAAB25;*/
}
.header.tiny { height:80px;  }
.header.tiny .navbar-nav { margin:-20px 0px 0px;}
.header .navbar-nav { margin:-20px 0px 0px;}

.navbar-brand {
	background-color:transparent!important;
	max-height: 100%;
    max-width: 100%;
	float: left;
	/*margin: 12px 20px 0;*/
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;	
	border-radius: 0px;
	text-align: left;
}
.navbar-brand:hover { opacity:0.9; }
.header.tiny .navbar-brand {  margin:0px 0px 0; }

.navbar {
	background-color: transparent!important;
	-webkit-border-radius: 0px;
	-moz-border-radius:0px;	
	border-radius: 0px;
	text-align: left;
}

.navbar .navbar-toggle {
	z-index: 1;
	color: #9a883f!important;
	-webkit-transition: background-color 0.2s;
	-moz-transition: background-color 0.2s;
	-o-transition: background-color 0.2s;
	transition: background-color 0.2s;
	border:0 none;
}
.navbar .navbar-toggle:hover { background-color:transparent; color:#9a883f!important; }
.navbar .navbar-toggle:focus { background-color:transparent; color:#9a883f!important; }

.navbar .navbar-nav { overflow: hidden!important;  padding:25px 40px 0 0px; }
.navbar .navbar-nav li {padding:0px 0px 5px 20px; }
.navbar .navbar-nav li a {
	font-size:18px;
	color: #5A5E66;
	letter-spacing:0px;
	font-weight:400;
	text-align:left!important;
	background:transparent;
	padding:0;
	/*text-transform:lowercase;*/
	-webkit-transition:color 0.5s;
	-moz-transition:color 0.5s;
	-o-transition:color 0.5s;
	transition:color 0.5s;
}

.navbar .navbar-nav li a:hover { color:#777; background-color:transparent; }
.navbar .navbar-nav li.active a { color:#8e939a; background-color:transparent!important; }
.navbar .navbar-nav li.active a:hover, .navbar .navbar-nav li:hover, .navbar .navbar-nav li.visited { 
	background-color:transparent!important;
	text-decoration:none;
}

/*-----------------------------------------------------------------------------------*/
/*	04: STACK SLIDER
/*-----------------------------------------------------------------------------------*/
.main{
	width: 80%;
	max-width: 1100px;
	margin: 0 auto;
	position: relative;
	padding: 0 30px 50px 30px;
}
.js .st-stack-raw { display: none; }
.st-wrapper {
	width: 100%;
	height: 500px;
	position: relative;
	margin: 0 auto;
	-webkit-perspective: 1200px;
	-webkit-perspective-origin : 50% 100%;
	-moz-perspective: 1200px;
	-moz-perspective-origin : 50% 100%;
	-o-perspective: 1200px;
	-o-perspective-origin : 50% 100%;
	-ms-perspective: 1200px;
	-ms-perspective-origin : 50% 100%;
	perspective: 1200px;
	perspective-origin : 50% 100%;
}
.st-stack {
	position: absolute;
	height: 10px;
	bottom: 0px;
	background-image: url(../img/gradient.png);
	background-image: -webkit-linear-gradient(top, #fff 50%, #999 50%);
	background-image: -moz-linear-gradient(top, #fff 50%, #999 50%);
	background-image: -o-linear-gradient(top, #fff 50%, #999 50%);
	background-image: -ms-linear-gradient(top, #fff 50%, #999 50%);
	background-image: linear-gradient(to bottom, #fff 50%, #999 50%);
	-webkit-background-size: 5px 5px;
	-moz-background-size: 5px 5px;
	background-size: 5px 5px;
	background-position: bottom center;
}
.st-stack:before {
	content: '';
	position: absolute;
	width: 140%;
	left: -20%;
	bottom: -10px;
	height: 20px;
	z-index: -1;
	background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
}
.st-stack-left { left: 0px; }
.st-stack-right { right: 0px; }
.st-wrapper .st-title,
.st-wrapper nav {
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	text-align: center;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.st-wrapper .st-title {
	padding: 0 10% 60px;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
}
.st-wrapper .st-title h2 {
	padding: 0 20px;
	font-size: 20px;
	color: #dc4e2a;
	font-weight: 400;
	letter-spacing: 3px;
	font-family: 'Source Sans Pro', sans-serif;
	line-height: 38px;
}
.st-wrapper nav span {
	color: transparent;
	position: absolute;
	width: 40px;
	height: 40px;
	left: 50%;
	bottom: 0;
	cursor: pointer;
}
.st-wrapper nav span:first-child { margin-left: -45px; }
.st-wrapper nav span:last-child { margin-left: 5px; }
.st-wrapper nav span:before {
	font-family: 'FontAwesome';
	font-style: normal;
	speak: none;
	font-weight: normal;
	line-height: 1;
	font-size: 30px;
	line-height: 40px;
	text-align: center;
	-webkit-font-smoothing: antialiased;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	color: #fff;
	border-radius: 50%;
	cursor: pointer;
	text-shadow: 0 1px 1px rgba(255,255,255,0.5);
	box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}
.st-wrapper nav span:first-child:before { content: "\f0a8"; }
.st-wrapper nav span:last-child:before { content: "\f0a9"; }
.st-wrapper nav span:hover:before { color: #333; }
.st-wrapper .st-item {
	position: absolute;
	-webkit-transform-style : preserve-3d;
	-moz-transform-style : preserve-3d;
	-o-transform-style : preserve-3d;
	-ms-transform-style : preserve-3d;
	transform-style : preserve-3d;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
}
.st-wrapper .st-item.st-center {
	-webkit-transform: rotateZ(0deg) rotateY(0deg);
	-moz-transform: rotateZ(0deg) rotateY(0deg);
	-o-transform: rotateZ(0deg) rotateY(0deg);
	-ms-transform: rotateZ(0deg) rotateY(0deg);
	transform: rotateZ(0deg) rotateY(0deg);
}
.st-wrapper .st-item.st-right,
.st-wrapper .st-item.st-rightflow {
	opacity: 0;
	-webkit-transform: rotateZ(90deg) rotateY(-90deg);
	-moz-transform: rotateZ(90deg) rotateY(-91deg);
	-o-transform: rotateZ(90deg) rotateY(-90deg);
	-ms-transform: rotateZ(90deg) rotateY(-90deg);
	transform: rotateZ(90deg) rotateY(-91deg);
	pointer-events: none;
}
.st-wrapper .st-item.st-left,
.st-wrapper .st-item.st-leftflow {
	opacity: 0;
	-webkit-transform: rotateZ(-90deg) rotateY(90deg);
	-moz-transform: rotateZ(-90deg) rotateY(91deg);
	-o-transform: rotateZ(-90deg) rotateY(90deg);
	-ms-transform: rotateZ(-90deg) rotateY(90deg);
	transform: rotateZ(-90deg) rotateY(91deg);
	pointer-events: none;
}
.st-wrapper .st-item.st-rightflow,
.st-wrapper .st-item.st-leftflow,
.st-wrapper .st-item.st-center { opacity: 1; }
.st-wrapper .st-item a,
.st-wrapper .st-item img { border:none; max-width:100%; display:block; }
.st-wrapper .st-item a { background:#fff; box-shadow:0 0 0 9px #fff, 0 1px 3px 9px rgba(0,0,0,0.3); }

/*-----------------------------------------------------------------------------------*/
/*	05: PIE CHARTS
/*-----------------------------------------------------------------------------------*/
.chart1, .chart2, .chart3 {
  position: relative;
  display: inline-block;
  width: 140px;
  height: 140px;
  margin-top: 50px;
  margin-bottom: 0px;
  text-align: center;
}
.chart canvas { position:absolute; top:0; left:0; }
.percent { position:absolute; display:inline-block; margin:0px auto;  z-index:2; color:#555; left:40%; top:37%; }

/*-----------------------------------------------------------------------------------*/
/*	06: THE TEAM 
/*-----------------------------------------------------------------------------------*/
/**** TEAM ****/
.grida {	
	max-width:1170px;
	margin:40px 20px 0 20px;
	padding:0;
	list-style:none;
	text-align:left;
}
.grida li {
	display:inline-block;
	width:365px;
	margin:0px 13px 10px 0px;
	padding:0px;
	text-align:left;
	position: relative;
}
.grida figure { margin:0; position:relative; }
.grida figure img { max-width:100%; display:block; position:relative; }
.grida figcaption {
	position:absolute;
	top:0;
	left:0;
	padding:10px 20px;
}
.grida figcaption h3 {font-size:60px!important; margin:0 0 0px; padding:0;color:#fff!important;  }
.grida figcaption span {
font-size:15px; line-height:30px!important; 
	padding:0px;
	color:#fff;
	margin:0 0px;
	display:inline-block;
	width:100%;
	font-weight:400; letter-spacing:4px;
	text-transform:uppercase;
}
.grida figcaption span a{ text-transform:none; letter-spacing:0px; color:#222; }
.grida figcaption span a:hover{ color:#fff; }
  
.cs-style figure { overflow: hidden; width: 100%; }
.cs-style img {
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	-o-transition: -o-transform 0.4s;
	transition: transform 0.4s;
}
.no-touch .cs-style figure:hover img,
.cs-style figure.cs-hover img  {
	-webkit-transform: translateY(-50px);
	-moz-transform: translateY(-50px);
	-ms-transform: translateY(-50px);
	transform: translateY(-50px);
}
.cs-style figcaption {
	width:100%;
	top:0%;
	bottom:0;opacity:0.5;
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
	transition: transform 0.4s, opacity 0.1s 0.3s;
}
.no-touch .cs-style figure:hover figcaption,
.cs-style figure.cs-hover figcaption {
	opacity: 1;
	filter: alpha(opacity=100);
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform: translateY(0px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s;
	transition: transform 0.4s, opacity 0.1s;
}

/*-----------------------------------------------------------------------------------*/
/*	07: TEAM - MODAL BOX
/*-----------------------------------------------------------------------------------*/	
.bigmodal { width:100%; height:100%; left:0; margin:0; }
.bigmodal.fade.in { top:0; }
.bigmodal .modal-body { max-height:none; }

.modal {
	background:#fff!important;
	overflow-x:hidden;
	border:0px;
	-webkit-border-radius:0px;
	-moz-border-radius:0px;
	border-radius:0px;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
}
.modal-body { background:#fff!important; padding:20px 0px; }
.modal img { min-width:100%; height:auto; }

.close{
	font-size:38px;
	background:transparent;
	color:#444;
	float:none;
	cursor:pointer;
	border:0;
	-webkit-appearance:none;
	-webkit-transition:0.2s;
	-moz-transition:0.2s;
	-o-transition:0.2s;
	transition:0.2s;
	-webkit-text-shadow: none;
	-moz-text-shadow: none;
	-o-text-shadow:none;
	text-shadow:none;
}
.close:hover {
	color:#555;
	-webkit-transform:rotate(-90deg);
	-moz-transform:rotate(-90deg);
	-ms-transform:rotate(-90deg);
	transform:rotate(-90deg);
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}

.modal-backdrop { display: none !important; }
.modal-backdrop, .modal-backdrop.fade.in { z-index: 0; }

/*-----------------------------------------------------------------------------------*/
/*	08: TEAM - SKILL BARS
/*-----------------------------------------------------------------------------------*/	
.progress{
	float: right;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	height: 10px;
	background: rgba(0,0,0,0.2);
	width: 70%;
	margin: 10px 10px;
	overflow: hidden;
}
.bar {
	float: left;
	background: #555;
	height: 100%;
	-webkit-border-radius: 10px 0px 0px 10px;
	-moz-border-radius: 10px 0px 0px 10px;
	border-radius: 10px 0px 0px 10px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
}
.skill-title {
	float: left;
	color: #8e939a;
	text-align: left;
	margin-bottom: 0px;
	width: 100%;
	font-size: 14px;
}
.percent { float:left; }

/*-----------------------------------------------------------------------------------*/
/*	09: WORK
/*-----------------------------------------------------------------------------------*/
.box { display: none; cursor:pointer;}

/* ***CATEGORY NAVIGATION BAR*** */
.category-navbar{
	font-size: 0px;
	list-style: none;
	margin: 60px 0 10px 0;
	padding: 7px 0 2px 0px;
	width: 100%;
 }
.category-navbar li:first-child{ margin: 0 0 0 0px; }
.category-navbar li{
	display: inline-block;
	line-height: 16px;
	margin: 0 0 0 0px;
	padding: 5px 0 5px 0;
}
.category-navbar li a{
	cursor: pointer;
	color: #8E939A;
	font-size: 16px;
	text-decoration: none;
	margin: 0 10px 10px 0;
	padding: 6px 10px;
	border-radius: 1px;
	moz-border-radius: 1px;
	-webkit-border-radius: 1px;
}
.category-navbar li a:hover{ text-decoration:none; background:#555; color:#fff; }
.category-navbar li.select a{ background:#84919F; color:#fff; }

/* ***CAPTION STYLE*** */
.box{  overflow:hidden; }
.lightbox-text{ display: none; }
.thumbnail-caption{ position:absolute; width:100%; height:100%; display:none; text-transform:uppercase; }
/* The style for centering the caption (vertically and horizontally) */
.thumbnail-caption>div{ height:100%;  width:100%; display:table !important; }
.thumbnail-caption>div>div{
	padding: 15px;
	display: table-cell!important;
    vertical-align: middle;
    text-align:center; 
}
.thumbnail-caption h3{ font-size:14px; letter-spacing:2px; font-weight:600!important; color: #fff!important; }

/* ***LOADING STYLE*** */
.grid-loader{
	padding: 10px 0px;
	background: url(../img/loader.gif) no-repeat;
	background-position: center;
	margin: 20px auto;
	width: 25%;
	color: #bbb!important;
	height: 50px!important;
}
.grid-loadMore{ 
	cursor: pointer;
	margin: 40px auto 0;
	width: 25%;
	text-align: center;
	color: #555;
	background-color: transparent;
	font-weight: 400;
	font-size: 15px!important;
	padding: 10px 0px;
	height: 50px!important;
	font-size: 17px;
	letter-spacing: 2px;
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.grid-loadMore:hover{ text-decoration: none; background:transparent!important; height:50px!important; }

/* ***LIGHT-BOX STYLE*** */
.lightbox-timer{
	height: 1px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: #fff;
}
.lb-loader{
	width: 43px;
	height: 11px;
	background: url(../img/loader.gif);
	margin: 20px auto;
}
.autoGrid-lightbox{
	display: none;
	position: fixed;
	top:0;
	width: 100%;
	height: 100%;
	background: #313131;
	 z-index:9999!important;
	background: rgba(0,0,0,0.90);
	text-align: center;
}
.autoGrid-lightbox img{ margin: 5px auto; max-width: 100%; }
.autoGrid-nav{ margin-top: -56px; height: 56px; width: 100%;  }
.autoGrid-play, .autoGrid-close, .autoGrid-next, .autoGrid-prev, .autoGrid-font {
	width: 88px;
	height: 56px;
	position: relative;
	cursor: pointer;
}
.autoGrid-play:hover, .autoGrid-close:hover, .autoGrid-next:hover, .autoGrid-prev:hover, .autoGrid-font:hover{ background: #313941; }
.autoGrid-lbcaption{
	float: left;
	color: #f0f0f0;
	height: 57px;
	font-size: 17px;
}
.autoGrid-lbcaption span { margin-left: 3px; color: #333; font-size: 14px; }
.autoGrid-lbcaption>div { height: 100%;  width: 100%;display: table !important; }
.autoGrid-lbcaption>div>div{
	padding: 0 15px 0 15px;
	display: table-cell !important;
	vertical-align: middle; /* FOR VERTICAL ALIGN */
	text-align:center; /* FOR HORIZONTAL ALIGN */
}
.autoGrid-play, .autoGrid-close {  float: right; }
.autoGrid-next, .autoGrid-prev { float: right; }
.iconPlay, .iconClose, .iconNext, .iconPrev{
  	font-family: 'FontAwesome';
	speak: none;
	font-size: 26px;
	line-height: 62px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	display: block;
	-webkit-font-smoothing: antialiased;
	color:  #eee;
	-webkit-transition:all .3s;
     -moz-transition:all .3s;
       -o-transition:all .3s;
      -ms-transition:all .3s;
          transition:all .3s;
} 
.iconPlay:hover, .iconClose:hover, .iconNext:hover, .iconPrev:hover{
	color:  #8E939A;
	-webkit-transition:all .3s;
     -moz-transition:all .3s;
       -o-transition:all .3s;
      -ms-transition:all .3s;
          transition:all .3s;
} 
.iconClose:before { content: "\f057"; }
.iconPlay:before { content: "\f144"; }
.iconNext, .iconPrev {  margin: -1px 0 0 0px; }
.iconPrev:before { content: "\f04a"; }
.iconNext:before { content: "\f04e"; }
.selected{ background:  #E84E41; }
.selected .iconPlay:before { content: "\f04c"; color: #eee; }
.selected:hover .iconPlay:before { color:#8E939A; }

/**** Transitions ****/
.transitions-enabled.masonry,
.transitions-enabled.masonry .masonry-brick {
  -webkit-transition-duration: 0.7s;
     -moz-transition-duration: 0.7s;
      -ms-transition-duration: 0.7s;
       -o-transition-duration: 0.7s;
          transition-duration: 0.7s;
}
.transitions-enabled.masonry {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}
.transitions-enabled.masonry  .masonry-brick {
  -webkit-transition-property: left, right, top;
     -moz-transition-property: left, right, top;
      -ms-transition-property: left, right, top;
       -o-transition-property: left, right, top;
          transition-property: left, right, top;
}
/* disable transitions on container */
.transitions-enabled.infinite-scroll.masonry {
  -webkit-transition-property: none;
     -moz-transition-property: none;
      -ms-transition-property: none;
       -o-transition-property: none;
          transition-property: none;
}

/**** Clearfix ****/
.grid-clearfix:before, .grid-clearfix:after { content: ""; display: table; }
.grid-clearfix:after { clear: both; }
.grid-clearfix { zoom: 1; }
.centered { overflow: auto; }

/*-----------------------------------------------------------------------------------*/
/*	10: PRICING TABLE
/*-----------------------------------------------------------------------------------*/
#pricing-table { padding:40px 0 40px; text-align:center; }
#pricing-table .plan { font-size:15px; margin-bottom:40px; }
#pricing-table h3 {
	font-size: 16px;
	font-weight: 700!important;
	padding: 20px;
	margin: -20px -20px 60px -20px;
	color:#5A5E66;
	letter-spacing: 2px;
	text-transform: uppercase;
}
#pricing-table h3 span, #pricing-table #most-popular h3 span {
		display: block;
		font: bold 30px/95px 'Open-Sans', sans-serif;
		color: #fff;
		border: 5px solid #666;
		height: 100px;
		width: 100px;
		letter-spacing:0px;
		font-weight: 700!important;
		margin: 25px auto -50px;
		-moz-border-radius: 100px;
		-webkit-border-radius: 100px;
		border-radius: 100px;
}
#pricing-table #most-popular h3 span {background: #eee; 
color: #5A5E66;}
#pricing-table ul { margin: 20px 0 0 0; padding: 0; list-style: none; }
#pricing-table li { border-top: 1px dashed #ccc; padding: 10px 0; }

/*-----------------------------------------------------------------------------------*/
/*	11: CONTACT SECTION
/*-----------------------------------------------------------------------------------*/
.google-maps { height:450px; margin:20px 0 70px; }

#ajax-contact-form textarea { height:150px!important;}
#ajax-contact-form input, #ajax-contact-form  textarea {
	background:#eee;
	color:#555;important;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	border: 0px none;
	margin-bottom:15px;
	padding:8px 10px 8px;
	font-weight:400;
	font-size:15px;
}

::-webkit-input-placeholder { color:#71767d!important; opacity:1.0; }
:-moz-placeholder { color:#71767F!important; opacity:1.0; }
::-moz-placeholder {  color:#71767d!important; opacity:1.0; }
:-ms-input-placeholder { color:#71767d!important; opacity:1.0; }
focus::-webkit-input-placeholder{color:transparent; opacity:1.0;}

#ajax-contact-form input:focus, #ajax-contact-form  textarea:focus { background:#f0f0f0; color:#555; }
#ajax-contact-form input.btn { 
	margin:5px 5px 0 0;
	padding:12px 20px;
	background:#E84E41;
	color:#fff;
	font-size:13px;
	text-transform:uppercase;
	letter-spacing:2px;
	-webkit-box-shadow: none;
	-moz-box-shadow:none;
	-o-box-shadow: none;
	box-shadow: none; 
	-webkit-border-radius: none!important;
	-moz-border-radius: none!important;
	-o-border-radius:none!important;
	border-radius: none!important;
}
#ajax-contact-form input.btn:hover { background:#24272B; }
.notification_error {
	color: #fff;
	background-color: #333;
	height: auto;
    margin: 0 0 9px 0;
    padding: 10px;
    text-align: left;
}
.notification_ok {
    color: #fff;
	background-color: #333;
	font-weight: 400;
    height: auto;
    margin: 0 0 9px 0;
    padding: 10px;
    text-align: center;
	font-size: 13px;
	text-transform: uppercase;
}

/*-----------------------------------------------------------------------------------*/
/*	12: FOOTER + SMALL HOVER IMG
/*-----------------------------------------------------------------------------------*/
.copyright { font-size:13px; } 
.top { margin:30px auto; }

.letter-container { padding: 0px 10px; }
.letter-container h2 { text-align: center; padding: 20px; text-transform: uppercase; cursor:crosshair; }
.letter-container h2  span{
	display: inline-block;
	position: relative;
//text-indent:-9999px;
	width: 180px;
	height: 180px;
	background: #000;
	line-height: 150px;
	font-size: 60px; 
	margin: 3px;
	background-position: 50% 0%;
	background-size: 200px 267px;
	color: #fff;
	text-shadow: 0px 0px 1px #fff, 2px 2px 5px rgba(0,0,0,0.4);
	border-color: #fff;
	border-style: solid;
	border-width: 10px 10px 10px 10px;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.letter-container h2  span:before{
	content:'';
	position: absolute;
	width: 220px;
	height: 195px;
	top: -10px;
	left: -10px;
	background: transparent;
}
.letter-container h2 span:nth-child(even){
	-webkit-transform: rotate(1deg) translateZ(0);
	-moz-transform: rotate(1deg);
	-o-transform: rotate(1deg);
	-ms-transform: rotate(1deg);
	transform: rotate(1deg);
}
.letter-container h2 span:nth-child(odd){
	-webkit-transform: rotate(-2deg) translateZ(0);
	-moz-transform: rotate(-2deg);
	-o-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
	transform: rotate(-2deg);
}
.letter-container span.char1{
	background-image: url(../img/small/small_1.jpg);
}
.letter-container span.char2{
	background-image: url(../img/small/small_2.jpg);
}
.letter-container span.char3{
	background-image: url(../img/small/small_3.jpg);
}
.letter-container span.char4{
	background-image: url(../img/small/small_4.jpg);
}
.letter-container span.char5{
	background-image: url(../img/small/small_5.jpg);
}
.letter-container h2:hover span:nth-child(even){
	-webkit-transform: scale(0.9) rotate(-2deg) translateZ(0);
	-moz-transform: scale(0.9) rotate(-2deg);
	-o-transform: scale(0.9) rotate(-2deg);
	-ms-transform: scale(0.9) rotate(-2deg);
	transform: scale(0.9) rotate(-2deg);
}
.letter-container h2:hover span:nth-child(odd){
	-webkit-transform: scale(0.9) rotate(3deg) translateZ(0);
	-moz-transform: scale(0.9) rotate(3deg);
	-o-transform: scale(0.9) rotate(3deg);
	ms-transform: scale(0.9) rotate(3deg);
	transform: scale(0.9) rotate(3deg);
}
.letter-container h2 span:nth-child(even):hover,
.letter-container h2 span:nth-child(odd):hover{
	-webkit-animation: moveImg 9s linear infinite forwards;
	-moz-animation: moveImg 9s linear infinite forwards;
	-o-animation: moveImg 9s linear infinite forwards;
	-ms-animation: moveImg 9s linear infinite forwards;
	animation: moveImg 9s linear infinite forwards;
	color: rgba(255,255,255,0.4);
	text-shadow:0px 0px 5px rgba(0,0,0,0.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
	z-index: 10;
	-moz-box-shadow: 2px 2px 20px 4px rgba(0,0,0,0.6), 0px 0px 2px rgba(0,0,0,0.2) inset;
	-webkit-box-shadow: 2px 2px 20px 4px rgba(0,0,0,0.6), 0px 0px 2px rgba(0,0,0,0.2) inset;
	box-shadow: 2px 2px 20px 4px rgba(0,0,0,0.6), 0px 0px 2px rgba(0,0,0,0.2) inset;
}
@-webkit-keyframes moveImg {
    0%{  background-position: 50% 0%; }
	50%{ background-position: 50% 100%; }
	100%{ background-position: 50% 0%; }
}
@-moz-keyframes moveImg {
    0%{  background-position: 50% 0%; }
	50%{ background-position: 50% 100%; }
	100%{ background-position: 50% 0%; }
}
@keyframes moveImg {
    0%{  background-position: 50% 0%; }
	50%{ background-position: 50% 100%; }
	100%{ background-position: 50% 0%; }
}

/*-----------------------------------------------------------------------------------*/
/*	13: BLOG
/*-----------------------------------------------------------------------------------*/
#blog { background:#fff; padding:90px 0 20px; } 
h1.blog-title { font-size: 3.5em; line-height: 0.9em; margin-bottom:20px; } 
h1.blog-title2 { font-size: 5em; line-height: 0.8em; margin-bottom:40px; } 
#blog h6 { font-size: 1.5em; line-height: 1em; margin-bottom:10px; }

.post-meta ul {
	margin:0px 0 35px 0;
	line-height:20px;
	padding: 0 0;
	list-style:none;
	text-transform:uppercase;
	font-size:13px;
	letter-spacing:2px;
	clear:both;
}
.post-meta li { margin:0; display:inline; }
.post-meta a { color:#555; }
.post-meta a:hover { color:#888; }

.post-quote {
	background: #ddd;
	padding: 30px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	margin: 25px 0;
	opacity: 0.8;
}
.post-quote:hover { opacity:1.0;}
.post-quote h3 { font-size:30px; }
	
.pager li a {
	padding:5px 15px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background:#384049;
	border:0 none;
	color:#a3a8af; }
.pager li a:hover,  .pager li a:focus { background:#535d67; border:0 none; color:#b6bdc7; }
#Section-blogfoot { background:#24272B; padding:30px 0 20px; } 

/*-----------------------------------------------------------------------------------*/
/*	14: BUTTONS
/*-----------------------------------------------------------------------------------*/
/**** DEFAULT ****/
.btn {
	border:none;
	//color:#fff!important;
	background:#24272B;
	font-size:14px;
	font-weight:400!important;
	letter-spacing:1px;
	min-width:80px;
	text-decoration:none;
	text-shadow:none;
	-webkit-transition: 0.25s ease-in;
	-moz-transition: 0.25s ease-in;
	-o-transition: 0.25s ease-in;
	transition: 0.25s ease-in;
	-webkit-backface-visibility:hidden;
	-webkit-font-smoothing:subpixel-antialiased;
}
.btn:hover, .btn:focus { 
	background-color:#222;
	color:#fff;
	outline:0; 
	-webkit-transition: 0.25s ease-out;
	-moz-transition: 0.25s ease-out;
	-o-transition: 0.25s ease-out;
	transition: 0.25s ease-out;
}
.btn:active, .btn.active { background-color:#34495e; color:rgba(255, 255, 255, 0.75); }
.btn.disabled, .btn[disabled] { background-color: #95a5a6; color:#fff; }
	
.btn-lg { padding:15px 20px; font-size:18px; line-height:1.33; border-radius:6px; }
.btn-md { padding:15px 20px; font-size:14px!important; line-height:1.33; border-radius:6px; font-weight:400!important; }
.btn-sm, .btn-xs { padding:5px 10px; font-size:12px; line-height:1.5; border-radius:3px; }
.btn-xs {  padding: 1px 5px; }

/**** BLUE ****/
.btn.btn-info { background-color:#3bb3e0; }
.btn.btn-info:hover, .btn.btn-info:focus { background-color:#4dc2ee;  }
.btn.btn-info:active,  .btn.btn-info.active { background-color:#3bb3e0!important; }

/**** RED ****/
.btn.btn-danger { background-color:#E84E41; }
.btn.btn-danger:hover, .btn.btn-danger:focus{ 
background-color:#f45c4d!important; }
.btn.btn-danger:active, .btn.btn-danger.active { background-color: #E84E41!important; }

/**** GREEN ****/
.btn.btn-success { background-color:#2ecc71; }
.btn.btn-success:hover, .btn.btn-success:focus { background-color:#34d879; }
.btn.btn-success:active,  .btn.btn-success.active { background-color:#2ecc71!important; }

/**** YELLOW ****/
.btn.btn-warning { background-color: #ffaa49; }
.btn.btn-warning:hover, .btn.btn-warning:focus { background-color: #f9b05e; }
.btn.btn-warning:active,  .btn.btn-warning.active { background-color: #FFAA49!important; }

/*-----------------------------------------------------------------------------------*/
/*	15: CSS3 ANIMATIONS
/*-----------------------------------------------------------------------------------*/
/**** HIDE ELEMENTS UNTIL SCROLLED TO ****/
.fadeIn, .hi-icon-fade, .grida, .counter, .pricing, .fadeit, .fadeit2, .pie { visibility: hidden; }
	
/**** SLIDE LEFT ****/
.slideLeft{
	animation-name: slideLeft;
	-webkit-animation-name: slideLeft;	
	animation-duration: 2s;	
	-webkit-animation-duration: 2s;
	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		
	visibility: visible !important;	
}
@keyframes slideLeft {
	0% { transform: translateX(150%); }
	50%, 65%, 80%, 95%, 100% { transform: translateX(0%); }
}
@-webkit-keyframes slideLeft {
	0% { -webkit-transform: translateX(150%); }
	50%, 65%, 80%, 95%, 100%{ -webkit-transform: translateX(0%); }
}

/**** SLIDE RIGHT ****/
.slideRight{
	animation-name: slideRight;
	-webkit-animation-name: slideRight;	
	animation-duration: 2s;	
	-webkit-animation-duration: 2s;
	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out	;	
	visibility: visible !important;	
}
@keyframes slideRight {
	0% { transform: translateX(-150%); }
	50%, 65%, 80%, 95%, 100% { transform: translateX(0%); }
}
@-webkit-keyframes slideRight {
	0% { -webkit-transform: translateX(-150%); }
	50%, 65%, 80%, 95%, 100% { -webkit-transform: translateX(0%); }
}

/**** FADEIN  ****/
.fadeIn{
	animation-name: fadeIn;
	-webkit-animation-name: fadeIn;	
	animation-duration: 2.0s;	
	-webkit-animation-duration: 2.0s;
	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		
	visibility: visible !important;	
}
@keyframes fadeIn {
	0% { transform: scale(0); opacity: 0.0;	}
	60% { transform: scale(1); }
	80%, 100% { transform: scale(1); opacity: 1; }	
}
@-webkit-keyframes fadeIn {
	0% { -webkit-transform: scale(0); opacity: 0.0;	}
	60% { -webkit-transform: scale(1); }
	80%, 100% { -webkit-transform: scale(1); opacity: 1; }	
}

/**** BOUNCE ****/
.bounce{
	animation-name: bounce;
	-webkit-animation-name: bounce;	
	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;
	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;	
	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 	
}
@keyframes bounce {
	0% { transform: translateY(0%) scaleY(0.1); }
	60%{ transform: translateY(-30%) scaleY(1.1); }
	70%{ transform: translateY(0%) scaleY(0.95) scaleX(1.05); }
	80%{ transform: translateY(0%) scaleY(1.05) scaleX(1); }	
	90%{ transform: translateY(0%) scaleY(0.95) scaleX(1); }				
	100%{ transform: translateY(0%) scaleY(1) scaleX(1); }	
}
@-webkit-keyframes bounce {
	0% { -webkit-transform: translateY(0%) scaleY(0.1); }
	60%{ -webkit-transform: translateY(-0%) scaleY(1.1); }
	70%{ -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1.05); }
	80%{ -webkit-transform: translateY(0%) scaleY(1.05) scaleX(1); }	
	90%{ -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1); }				
	100%{ -webkit-transform: translateY(0%) scaleY(1) scaleX(1); }		
}

/**** ROTATING ****/
.rotating {
  display: inline-block;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateX(0) rotateY(0) rotateZ(0);
  -moz-transform: rotateX(0) rotateY(0) rotateZ(0);
  -ms-transform: rotateX(0) rotateY(0) rotateZ(0);
  -o-transform: rotateX(0) rotateY(0) rotateZ(0);
  transform: rotateX(0) rotateY(0) rotateZ(0);
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  -webkit-transform-origin-x: 50%;
}
.rotating.flip { position: relative; }
.rotating .front, .rotating .back {
  left: 0;
  top: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}
.rotating .front {
  position: absolute;
  display: inline-block;
  -webkit-transform: translate3d(0,0,1px);
  -moz-transform: translate3d(0,0,1px);
  -ms-transform: translate3d(0,0,1px);
  -o-transform: translate3d(0,0,1px);
  transform: translate3d(0,0,1px);
}
.rotating.flip .front { z-index: 1; }
.rotating .back { display: block; opacity: 0; }
.rotating.spin {
  -webkit-transform: rotate(360deg) scale(0);
  -moz-transform: rotate(360deg) scale(0);
  -ms-transform: rotate(360deg) scale(0);
  -o-transform: rotate(360deg) scale(0);
  transform: rotate(360deg) scale(0);
}
.rotating.flip .back {
  z-index: 2;
  display: block;
  opacity: 1;
  -webkit-transform: rotateY(180deg) translate3d(0,0,0);
  -moz-transform: rotateY(180deg) translate3d(0,0,0);
  -ms-transform: rotateY(180deg) translate3d(0,0,0);
  -o-transform: rotateY(180deg) translate3d(0,0,0);
  transform: rotateY(180deg) translate3d(0,0,0);
}
.rotating.flip.up .back {
  -webkit-transform: rotateX(180deg) translate3d(0,0,0);
  -moz-transform: rotateX(180deg) translate3d(0,0,0);
  -ms-transform: rotateX(180deg) translate3d(0,0,0);
  -o-transform: rotateX(180deg) translate3d(0,0,0);
  transform: rotateX(180deg) translate3d(0,0,0);
}

/**** INTRO TEXT ****/
@-webkit-keyframes fade-in-intro { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fade-in-intro { from { opacity:0; } to { opacity:1; } }
@keyframes fade-in-intro { from { opacity:0; } to { opacity:1; } }
.fade-in-intro { opacity:0; 
	-webkit-animation:fade-in-intro ease-in 1;
	-moz-animation:fade-in-intro ease-in 1;
	animation:fade-in-intro ease-in 1;
 	-webkit-animation-fill-mode:forwards; 
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
	-webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;
	-webkit-animation-delay: 3.5s;
	-moz-animation-delay: 3.5s;
	animation-delay: 3.5s;
}

/**** CIRCLE LINK ****/
.animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;}
@-webkit-keyframes rotateIn {
	0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-360deg); opacity: 0; }
	100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; }
}
@-moz-keyframes rotateIn {
	0% { -moz-transform-origin: center center; -moz-transform: rotate(-360deg); opacity: 0; }
	100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; }
}
@-o-keyframes rotateIn {
	0% { -o-transform-origin: center center; -o-transform: rotate(-360deg); opacity: 0; }
	100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; }
}
@keyframes rotateIn {
	0% { transform-origin: center center; transform: rotate(-360deg); opacity: 0; }
	100% { transform-origin: center center; transform: rotate(0); opacity: 1; }
}
.rotateIn {
	-webkit-animation-name: rotateIn;
	-moz-animation-name: rotateIn;
	-o-animation-name: rotateIn;
	animation-name: rotateIn;
}

/*-----------------------------------------------------------------------------------*/
/*	16: MEDIA QUERIES
/*-----------------------------------------------------------------------------------*/
@media only screen and (max-width : 1024px) {
#Section-top,  #top_video, .well,  #Section-1 .well, #Section-2 .well, #Section-4 .well, #bottom_image { 
	background-attachment: scroll!important;
	background-position: center top !important;
	height: auto;
	margin: 0 auto;		
	width: 100%;
}
.carousel2 { height:auto; }

}
@media only screen and (device-width: 768px) {
.mbYTP_wrapper iframe, #volume {display:none;}
}
@media screen and (max-width: 1023px) {
.mbYTP_wrapper iframe, #volume {display:none;}
}

@media screen and (min-width: 979px) and (max-width: 1200px) {
.grida li { width:30%; margin-left:0px; }
#bottom_image { height:560px; }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
.navbar .navbar-nav li { margin-left:0px; }
.grida li { width:46%; margin-left:0px; }
}

@media screen and (max-width: 767px) {
.container{ padding-right:20px; padding-left:20px; }
#pricing-table .plan.last { border-left:0px solid #f1f1f1;}
}

@media screen and (min-width: 480px) and (max-width: 767px){
.grida { padding: 0px 0px 0px; }
.grida li { width:46%;  }
.grida figcaption h3 { margin:-10px 0 5px; }
.grida figcaption span { margin:-10px 0 0; }
.grid-loader, .grid-loadMore { width:100%; }
}

@media screen and (min-width: 220px) and (max-width: 767px){
/*.navbar-brand{ margin: 0px 20px 0!important; }*/
.navbar-brand{ padding-bottom: 15px !important;; }
.header{ height:60px; }
.header.tiny { height:60px; }
.header.tiny .navbar-nav { margin:0 0;}
.navbar .navbar-nav  { 
	overflow: auto!important;
	margin:0 0;
        position: relative;
        padding:0 0;
	background-color:#fff;
	width:100%;
}
.slider { min-height:300px; }
.navbar .navbar-nav li  { margin:0px 35px; padding: 0 0;}
.navbar .navbar-nav li a {
	line-height:50px;
	margin:10px 0px;
	padding:0px 10px;
	color:#222;
	width:auto;
	/*background-color:#eee;*/
	border-radius:0;
}
.navbar .navbar-nav li a:hover { color:#fff; /*background-color:#262d33;*/ }
.navbar .navbar-nav li.active a { color:#fff; /*background-color:#262d33!important;*/ }
.navbar .navbar-nav li.active a:hover, .navbar .navbar-nav li:hover, .navbar .navbar-nav li.visited { /*background-color:#262d33!important;*/ text-decoration:none; }
.navbar .navbar-collapse { position:absolute; top:59px; width:100%; padding:0 0; }
.navbar .navbar-toggle { top:-5px; }
.intro-container .divider { width:15%!important; }
}

@media screen and (max-width: 480px){
.navbar .navbar-nav  { height:500px; }
.quote { min-height:350px!important; }
/*CSS transitions off*/
.hi-icon-fade, .grida, .counter, .pricing, .fadeit, .fadeit2, .pie{
 -o-transition-property: none !important;
 -moz-transition-property: none !important;
 -ms-transition-property: none !important;
 -webkit-transition-property: none !important;
 transition-property: none !important;
 /*CSS transforms*/
 -o-transform: none !important;
 -moz-transform: none !important;
 -ms-transform: none !important;
 -webkit-transform: none !important;
 transform: none !important;
 /*CSS animations*/
 -webkit-animation: none !important;
 -moz-animation: none !important;
 -o-animation: none !important;
 -ms-animation: none !important;
 animation: none !important; }
 .slider { min-height:300px; }
}

@media screen and (min-width: 321px) and (max-width: 480px){
.intro-container .rotate  { font-size:14px; }
.intro-container h1 {  font-size: 40px; line-height: 40px; }
.intro-container h1 .rotate  { font-size:50px!important; }
.intro-container .divider { width:15%!important; }
.slider .slider-holder { top:55%; }
.slider { min-height:300px!important; }
#Section-3X { height:300px!important; }
}

@media screen and (max-width: 31.5em) {
.quote { min-height:350px!important; }
.grida { padding: 0 0 10px; }
.grida figcaption h3 { margin:-5px 0 10px; }
.grida figcaption span { margin:-10px 0 0; }
.grida li , .grid-loader, .grid-loadMore { width:100%;}
.parallax-section {min-height:700px!important; margin: -130px auto 0!important;}
#top_video .intro-container {min-height:700px!important; margin: 140px auto 0!important;}
.intro-container .rotate { width:220px; font-size:15px; line-height:20px; letter-spacing:1px; }
}

@media screen and (max-width: 320px) {
.grida { padding: 0px 0px 10px; }
.grida li { width:100%; margin-left:-3px; }
.grida figcaption h3 { margin:-5px 0 0; }
.grida figcaption span { margin:0 0 ; }
h1 { font-size:90px; line-height:80px; letter-spacing:0px!important; }
h2 { font-size:30px; line-height:40px; letter-spacing:0px; }
h1.blog-title2, h1.blog-title { font-size: 3em; line-height: 0.9em; margin-bottom:40px; } 
h1.blog-title { margin-bottom:20px; } 
.grid-loader, .grid-loadMore {width:100%;}
.intro-container h1 { font-size:40px!important; line-height:40px!important; letter-spacing:0px; }
.intro-container .rotate { width:220px; font-size:15px; line-height:20px; letter-spacing:0px; }
.intro-container h1 .rotate { font-size:40px; }
.intro-container .divider { width:15%!important; }
.slider { min-height:600!important; }
#Section-3X { height:300px!important; }
.slider .slider-holder { top: 40%;}
.navbar .navbar-nav  { height: 600px; }
/*.navbar-brand{ margin: 0 10px 0 0!important; }*/
.navbar .navbar-toggle { margin: 8px 0 0 0!important; }
}

/**** STACK SLIDER ****/
@media screen and (max-width: 1310px){
.st-wrapper .st-item { width: 300px; margin:-10px auto; }
.st-wrapper .st-title { bottom: 20px; }
.st-wrapper { height: 460px; }
}
@media screen and (max-width: 1050px){
.st-wrapper .st-item { width: 300px; margin:-140px auto; }
.st-wrapper .st-title { bottom:50px; } .st-wrapper { height: 520px; }
.st-stack { bottom:20px; }
.st-wrapper nav { bottom:-70px; }
.slider { min-height:400px; }
}
@media screen and (max-width: 935px){
.st-wrapper .st-item { width: 400px;margin:-270px auto 0; }
.st-wrapper { height: 500px; }
.st-wrapper .st-title { bottom: 20px; }
.slider { min-height:400px; }
}
@media screen and (max-width: 880px){
.st-wrapper .st-item { width: 300px;margin:-130px auto 0; }
.st-wrapper .st-title { bottom: 280px; }
.st-wrapper { height: 420px; }
.slider { min-height:400px; }
}
@media screen and (max-width: 740px){
.st-wrapper .st-item { width: 300px; margin:-130px auto 0; }
.st-wrapper .st-title { bottom: 250px; }
.st-wrapper nav { bottom:-90px; }
.st-stack { bottom:-30px; }
.st-wrapper { height: 390px; }
}
@media screen and (max-width: 650px){
.st-stack { display: none; }
.st-wrapper nav { bottom:270px; }
}
@media screen and (max-width: 450px){
.st-wrapper .st-item { width: 200px;margin:-120px 0!important; }
.st-wrapper .st-title { display:none; }
.st-wrapper .st-title h2 { font-size: 22px; line-height: 32px;text-align:center; margin:0 auto; }
.st-wrapper nav { bottom:-50px; }
.st-wrapper { height: 200px; }
}
