/*------------------------------
    Table of Contents
---------------------------------
    I. Defaul Selectors
    II. Header
	III. About Us
	IV. Skills
	V. Services
	VI. Pricing
	VII. Portfolio
	VIII. Testimonials
	IX. Contact
	X. Preloader

 
*/

	
/*   I. Defaul Selectors
==============================*/


*,
*:after,
*::before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html,
body {
font-family: 'Open Sans', sans-serif;
font-weight: normal;
font-size: 13px;
word-spacing: normal;
color: #626262;
overflow-x: hidden;
}

ol, ul {
list-style: none;
}
ol, ul, ul ol, ul ul, ol ol {
padding:0;
}

section {
text-align:center;
}
section h1, section h2, section h3, section h4, section h5, section h6 {
font-weight: 100;
font-family: 'Open Sans', sans-serif;
letter-spacing: 1px;
}

section h1 {
color: #1f1f1f;
font-family: 'Open Sans', sans-serif;
font-weight: 300;
font-style: normal;
font-size: 28px;
margin: 28px 0;
position: relative;
text-transform:capitalize;
}

section p {
font-size:16px;
}

hr {
border-style: none;
height: 1px;
display: block;
position: relative;
border: none;
padding: 0;
margin-bottom: 2em;
width: 250px;
}

hr:before {
content: "";
width: 5px;
height: 5px;
position: absolute;
right: 100%;
margin-top: -2px;
border-radius: 50%;
}
hr:after{
content: "";
width: 5px;
height: 5px;
position: absolute;
left: 100%;
margin-top: -2px;
border-radius: 50%;}

.underline {
border-top: 1px #313249 solid;
width: 250px;
height: 2px;
margin: 0 auto;
display: block;
}

.slide.underline {
border-top: 1px #fff solid;
}


.content-section {
padding:0 0 28px;
}

/* Color Variations */
.green hr, .green hr:before, .green hr:after {
background-color: #2ecc71;
}
.green .navbar-default .navbar-nav>.active>a{
background:#2ecc71;
color:#fff;
}
.green .navbar-nav li a:after {
	width: 100%;
	height: 0;
	top: 0;
	left: 0;
	background: #2ecc71;
}

.green .underline{
border-top:1px #2ecc71 solid;
padding-bottom: 28px;
}
.emarald .about-content .icon {
background-color: #2ecc71;
}

.emarald .icon-effect .services-icon:hover {
background: #2ecc71;
color: #fff;
}
.emerald .icon-effect .services-icon:after {
box-shadow: 0 0 0 4px #4eb3f4;
}

.green .about-content {
border: 4px solid #2ecc71;
}
.green .progress-bar-success {
background-color: #2ecc71;
}
.green .services-icon {
color: #2ecc71;
}

.green .price_item{
background: #2ecc71;
}

.green #testimonials{
background:url('../img/green.jpg');
}

.blue hr, .blue hr:before, .blue hr:after {
background-color: #4eb3f4;
}
.blue .navbar-default .navbar-nav>.active>a{
background:#4eb3f4;
color:#fff;
}
.blue .navbar-nav li a:after {
	width: 100%;
	height: 0;
	top: 0;
	left: 0;
	background: #4eb3f4;
}

.blue .underline{
border-top:1px #4eb3f4 solid;
padding-bottom: 28px;
}
.blue .about-content .icon {
background-color: #4eb3f4;
}

.blue .icon-effect .services-icon:hover {
background: #4eb3f4;
color: #fff;
}
.blue .icon-effect .services-icon:after {
box-shadow: 0 0 0 4px #4eb3f4;
}

.blue .about-content {
border: 4px solid #4eb3f4;
}
.blue .progress-bar-success {
background-color: #4eb3f4;
}
.blue .services-icon {
color: #4eb3f4;
}

.blue .price_item{
background: #4eb3f4;
}

.blue #testimonials{
background:url('../img/blue.png');
}


.red hr, .red hr:before, .red hr:after {
background-color: #f43232;
}
.red .navbar-default .navbar-nav>.active>a{
background:#f43232;
color:#fff;
}
.red .navbar-nav li a:after {
	width: 100%;
	height: 0;
	top: 0;
	left: 0;
	background: #f43232;
}

.red .underline{
border-top:1px #f43232 solid;
padding-bottom: 28px;
}
.red .about-content .icon {
background-color: #f43232;
}

.red .icon-effect .services-icon:hover {
background: #f43232;
color: #fff;
}
.red .icon-effect .services-icon:after {
box-shadow: 0 0 0 4px #f43232;
}

.red .about-content {
border: 4px solid #f43232;
}
.red .progress-bar-success {
background-color: #f43232;
}
.red .services-icon {
color: #f43232;
}

.red .price_item{
background: #f43232;
}

.red #testimonials{
background:url('../img/red.jpg');
}



/* II. Header
==============================*/
.sticky {
position:fixed;
top:0;
width: 100%;
border-radius: 0;
}
.navbar {
border:0;
-webkit-transition: height 0.3s;
-moz-transition: height 0.3s;
transition: height 0.3s;
}
.navbar-collapse {
-webkit-box-shadow: 0 1px 0 rgba(0,0,0,.05);
-moz-box-shadow: 0 1px 0 rgba(0,0,0,.05);
box-shadow: 0 1px 0 rgba(0,0,0,.05);
}
.navbar-collapse li a {
transition: all 0.65s ease 0s;
}

.navbar-nav a:after {
content: '';
position: absolute;
z-index: -1;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.navbar-nav li a:after {
	width: 100%;
	height: 0;
	top: 0;
	left: 0;
	background: #2ecc71;
}

.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
color: #fff;
}

.navbar-nav li a:hover:after,
.navbar-nav li a:active:after {
	height: 100%;
}

.banner-inner {
background: url('http://unsplash.s3.amazonaws.com/batch%205/unsplash-kitsune-4.jpg') no-repeat;
background-size:cover;
}

.slider-overlay-1 {
background-image: url('../img/overlay-pattern.png');
}
.slider-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: repeat;
background-attachment: scroll;
z-index:2;
}


section .hero-text {
font-family:'Lato',sans-serif;
font-size: 60pt;
color:#fff;
text-transform: capitalize;
font-weight: 100;
}
.hero-caption {
font-family:'Lato',sans-serif;
position: absolute;
right: 15%;
left: 15%;
z-index: 10;
padding-top: 20px;
padding-bottom: 20px;
color: #fff;
bottom:50%;
margin-bottom:-140px;
}
.hero-caption hr, .hero-caption hr:before, .hero-caption hr:after {
background-color:#fff;
}

.hero-caption p {
font-size: 24px;
line-height: 36px;
font-family:'Lato',sans-serif;
font-weight: 100;
margin:10px 0;
}


/*   III. About Us
==============================*/
.about-content {
padding: 4px 30px 24px 51px;
border:4px solid #2ecc71;
margin: 0 20px 20px 70px;

}
.about-content .icon {
background-color: #2ecc71;
position: absolute;
top: 24%;
padding-top: 22px;
left: 34px;
z-index: 2;
width: 100px;
height: 100px;
background-repeat: no-repeat;
border: 4px solid #fff;
border-radius: 50%;
font-size: 50px;
color: #fff;
}


/* Meet the Team */
.bl_author .widget-body{
  position: relative;
  text-align: center;
}
.bl_author > img + .widget-body .bl_author_img + .bl_author_bio{
  padding-top: 50px;
}
.bl_author .bl_author_bio{
  padding-left: 25px;
  padding-right: 25px;
  padding-bottom: 15px;
  color: #333;
}
.bl_author .bl_author_bio > h3{
  margin-top: 0;
}

#footer-body .bl_author .bl_author_bio{
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
}
.bl_author .bl_author_bio p{
  margin: 0;
}
.bl_author_img {
  -moz-border-radius: 500px;
  -webkit-border-radius: 500px;
  border-radius: 500px;
  height: 100px;
  width: 100px;
  background: #fff;
  padding: 5px;
  overflow:hidden;
}
.bl_author_img img{
-webkit-transition: all 150ms ease-in-out;
-moz-transition: all 150ms ease-in-out;
-o-transition: all 150ms ease-in-out;
transition: all 150ms ease-in-out;
}


.bl_author > img + .widget-body .bl_author_img {
  left: 50%;
  margin: 0 -50px;
  position: absolute;
  top: -45px;
  overflow: hidden;
}
.bl_author > img + .widget-body .bl_author_img img{
  -moz-border-radius: 500px;
  -webkit-border-radius: 500px;
  border-radius: 500px;
  height: 90px;
  max-width: none;
  width: 90px;
}

.bl_author > img {
width: 100%;
-moz-border-radius: 2px 2px 0 0;
-webkit-border-radius: 2px 2px 0 0;
border-radius: 2px 2px 0 0;
}


/*   V. Services
==============================*/

/* Services Icons */
.services-icon {
	display: inline-block;
	font-size: 0px;
	cursor: pointer;
	margin: 15px 21px;
	width: 90px;
	height: 90px;
	border-radius: 50%;
	text-align: center;
	position: relative;
	z-index: 1;
	color: #2ecc71;
}

.services-icon:after {
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	content: '';
	-webkit-box-sizing: content-box; 
	-moz-box-sizing: content-box; 
	box-sizing: content-box;
}

.services-icon:before {
	speak: none;
	font-size: 48px;
	line-height: 90px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	display: block;
	-webkit-font-smoothing: antialiased;
}

.icon-effect {
display: block;
clear: both;
margin: 20px 0;
}
.icon-effect .services-icon {
	background: rgba(255,255,255,0.1);
	-webkit-transition: background 0.2s, color 0.2s;
	-moz-transition: background 0.2s, color 0.2s;
	transition: background 0.2s, color 0.2s;
}
.icon-effect .services-icon:after {
	top: -7px;
	left: -7px;
	padding: 7px;
	box-shadow: 0 0 0 4px #2ecc71;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
	-webkit-transform: scale(.8);
	-moz-transition: -moz-transform 0.2s, opacity 0.2s;
	-moz-transform: scale(.8);
	-ms-transform: scale(.8);
	transition: transform 0.2s, opacity 0.2s;
	transform: scale(.8);
	opacity: 0;
}


.icon-effect .services-icon:hover {
	background: #2ecc71;
	color: #fff;
}

.icon-effect .services-icon:hover:after {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/*   VI. Pricing
==============================*/
.price_item {
background: #2ecc71;
margin-bottom:20px;
}

.price_col_head strong {
display: block;
background: #bbb;
background: rgba(0,0,0,0.05);
padding: 25px 10px;
font-size: 20px;
font-weight: 600;
color: #fff;
text-transform: uppercase;
}

.pricing_box .price {
display: inline-block;
position: relative;
font-size: 60px;
font-weight: 400;
color: #fff;
}

.pricing_box .price em {
font-size: 0.6em;
font-weight: 300;
font-style: normal;
top: 0.32em;
left: -0.6em;
}

.pricing_box .price * {
position: absolute;
}

.pricing_box .price sup {
font-size: 0.44em;
top: auto;
left: 103%;
bottom: 2.10em;
}

.pricing_box .price * {
position: absolute;
}

.pricing_box .price sub {
font-size: 0.24em;
font-weight: 300;
left: 100%;
bottom: 2.2em;
}

.price_body_top {
padding: 35px 15px 45px 10px;
border-bottom: 1px solid #888;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.price_col_body li {
font-size: 18px;
font-weight: 600;
color: #fff;
line-height: 24px;
padding: 22px 10px 23px;
border-bottom: 1px solid #888;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.price_col_foot {
background: #bbb;
background: rgba(0,0,0,0.05);
padding: 12px 0 13px;
}
.btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: normal;
line-height: 1.428571429;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
border: 1px solid transparent;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
.btn {
display: inline-block;
padding: 0;
border: 0 none;
border-radius: 0;
}
.btn span, .btn input, .btn:active {
    -webkit-box-shadow: none;
    box-shadow: none;
display: block;
height: 45px;
line-height: 45px;
padding: 0 16px;
font-size: 14px;
font-weight: 400;
color: #fff;
white-space: nowrap;
text-shadow: none;
background-color: transparent;
border: 0 none;
background-repeat: no-repeat;
background-position: -300px -300px;
}

.price_item.red {
background: #e87352;
}

/*   VII. Portfolio
==============================*/
.tt-grid {
	position: relative;
	margin: 20px auto;
	padding: 0;
	max-width: 960px;
	list-style: none;
	text-align: center;
	font-size: 0px;
}

.tt-grid:before,
.tt-grid:after {
	display: table;
	content: ' ';
}

.tt-grid:after {
	clear: both;
}

.tt-grid li {
	position: relative;
	display: inline-block;
	margin: 10px;
	width: 300px;
	height: 200px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tt-grid li a,
.tt-grid li a img {
	display: block;
	margin: 0 auto;
	border: none;
}

.tt-grid li a {
	background: #000;
	position: absolute;
	top: 0;
	left: 0;
}

.tt-grid li a:nth-child(2) {
	z-index: 1;
	visibility: hidden;
}

/* Navigation */
.tt-grid-wrapper nav {
	text-align: center;
}

.tt-grid-wrapper nav a {
	display: inline-block;
	margin: 0 8px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #363636;
	cursor: pointer;
	opacity: 0.7;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}

.touch .tt-grid-wrapper nav a {
	width: 30px;
	height: 30px;
}

.tt-grid-wrapper img{ 
-webkit-filter: grayscale(100%);
-ms-filter: grayscale(100%);
filter: grayscale(100%);
-moz-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
.tt-grid-wrapper img:hover {
-webkit-filter: grayscale(0%);
-ms-filter: grayscale(0%);
filter: grayscale(0%);
-webkit-transition: all 200ms ease-in-out;
-moz-transition: all 200ms ease-in-out;
-o-transition: all 200ms ease-in-out;
transition: all 200ms ease-in-out;
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
cursor: -moz-zoom-in;
cursor: -webkit-zoom-in;
cursor: zoom-in;
}

.tt-grid-wrapper nav a:hover {
	opacity: 1;
}

.tt-grid-wrapper nav a.tt-current {
	opacity: 1;
	box-shadow: 0 0 0 5px rgba(255,255,255,0.4);
}

.tt-grid.tt-effect-active li a {
	pointer-events: none;
}

/* Individual grid effects */

/* Fall down / scale up */
.tt-effect-fall.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-animation: fallDown 0.6s forwards;
	animation: fallDown 0.6s forwards;
}

.tt-effect-fall.tt-effect-active li a:nth-child(2),
.tt-effect-fall.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-animation: scaleUpFadeIn 0.6s forwards;
	animation: scaleUpFadeIn 0.6s forwards;
}

/* Slide and reveal */
.tt-effect-slide.tt-effect-active li:not(.tt-empty) a:first-child {
	z-index: 100;
	overflow: hidden;
	margin: 0;
	-webkit-animation: slideOut 0.5s forwards;
	animation: slideOut 0.5s forwards;
}

.tt-effect-slide.tt-effect-active a:nth-child(2) {
	visibility: visible;
}

.tt-effect-slide.tt-effect-active li:not(.tt-empty) a:only-child {
	-webkit-animation: fadeOut 0.5s forwards;
	animation: fadeOut 0.5s forwards;
}

.tt-effect-slide.tt-effect-active li.tt-empty a {
	-webkit-animation: fadeIn 0.5s forwards;
	animation: fadeIn 0.5s forwards;
}

/* Fall and rotate */
.tt-effect-fallrotate.tt-effect-active li:not(.tt-empty) a:first-child {
	z-index: 10;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-animation: fallRotate 0.6s ease-in forwards;
	animation: fallRotate 0.6s ease-in forwards;
}

.tt-effect-fallrotate.tt-effect-active li a:nth-child(2),
.tt-effect-fallrotate.tt-effect-active li.tt-empty a {
	visibility: visible;
}

.tt-effect-fallrotate.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-animation: fadeIn 0.6s forwards;
	animation: fadeIn 0.6s forwards;
}

.tt-effect-fallrotate li:nth-child(4) { z-index: 1; } /* order for correct overlapping */
.tt-effect-fallrotate li:nth-child(5) { z-index: 2; }
.tt-effect-fallrotate li:nth-child(6) { z-index: 3; }
.tt-effect-fallrotate li:first-child { z-index: 4; }
.tt-effect-fallrotate li:nth-child(2) { z-index: 5; }
.tt-effect-fallrotate li:nth-child(3) { z-index: 6; }

/* Scale and rotate */
.tt-effect-scalerotate.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-animation: scaleRotateOut 0.6s forwards;
	animation: scaleRotateOut 0.6s forwards;
}

.tt-effect-scalerotate.tt-effect-active li a:nth-child(2),
.tt-effect-scalerotate.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-animation: scaleRotateIn 0.6s forwards;
	animation: scaleRotateIn 0.6s forwards;
}

.tt-effect-scalerotate.tt-effect-active li:not(.tt-empty) a:only-child {
	-webkit-animation: fadeOut 0.6s forwards;
	animation: fadeOut 0.6s forwards;
}

.tt-effect-scalerotate li:nth-child(-n+3) { z-index: 2; } /* order for correct overlapping */
.tt-effect-scalerotate li:nth-last-child(-n+3) { z-index: 1; }

/* Stack back 3D */
.tt-effect-stackback li {
	-webkit-perspective: 1000px;
	perspective: 1000px;
}

.tt-effect-stackback li a {
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tt-effect-stackback.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-animation: moveLeft 0.8s forwards;
	animation: moveLeft 0.8s forwards;
}

.tt-effect-stackback.tt-effect-active li a:nth-child(2),
.tt-effect-stackback.tt-effect-active li.tt-empty a {
	z-index: -1;
	-webkit-animation: popUp 0.8s ease-in forwards;
	animation: popUp 0.8s ease-in forwards;
}

.tt-effect-stackback.tt-effect-active li:not(.tt-empty) a:only-child {
	-webkit-animation: fadeOut 0.8s forwards;
	animation: fadeOut 0.8s forwards;
}

.tt-effect-stackback.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-animation: fadeIn 0.8s forwards;
	animation: fadeIn 0.8s forwards;
}

/* 3d flip */
.tt-effect-3dflip li {
	-webkit-perspective: 1000px;
	perspective: 1000px;
}

.tt-effect-3dflip li a {
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tt-effect-3dflip.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-transform-origin: 0% 50%;
	transform-origin: 0% 50%;
	-webkit-animation: rotateOutLeft 0.6s forwards;
	animation: rotateOutLeft 0.6s forwards;
}

.tt-effect-3dflip.tt-effect-active li a:nth-child(2),
.tt-effect-3dflip.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-transform-origin: 100% 50%;
	transform-origin: 100% 50%;
	-webkit-animation: rotateInRight 0.6s ease-in forwards;
	animation: rotateInRight 0.6s ease-in forwards;
}

/* Bring back */
/* From https://github.com/hakimel/kontext by Hakim El Hattab, http://hakim.se */
.tt-effect-bringback li {
	-webkit-perspective: 1000px;
	perspective: 1000px;
}

.tt-effect-bringback li a {
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tt-effect-bringback.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-animation: hideLeft 0.8s forwards;
	animation: hideLeft 0.8s forwards;
}

.tt-effect-bringback.tt-effect-active li a:nth-child(2) {
	z-index: -1;
	-webkit-animation: showRight 0.8s forwards;
	animation: showRight 0.8s forwards;
}

.tt-effect-bringback.tt-effect-active li:not(.tt-empty) a:only-child {
	-webkit-animation: fadeOut 0.8s forwards;
	animation: fadeOut 0.8s forwards;
}

.tt-effect-bringback.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-animation: fadeIn 0.8s forwards;
	animation: fadeIn 0.8s forwards;
}

/* Superscale */
.tt-effect-superscale.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-animation: scaleDown 0.6s ease-in-out forwards;
	animation: scaleDown 0.6s ease-in-out forwards;
}

.tt-effect-superscale.tt-effect-active li a:nth-child(2),
.tt-effect-superscale.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-animation: scaleIn 0.6s ease-in-out forwards;
	animation: scaleIn 0.6s ease-in-out forwards;
}

/* Center flip */
.tt-effect-flip li {
	-webkit-perspective: 1500px;
	perspective: 1500px;
}

.tt-effect-flip li a {
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.tt-effect-flip.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-animation: flipOut 0.8s ease-in forwards;
	animation: flipOut 0.8s ease-in forwards;
}

.tt-effect-flip.tt-effect-active li a:nth-child(2),
.tt-effect-flip.tt-effect-active li.tt-empty a {
	opacity: 0;
	-webkit-animation: flipIn 0.8s ease-in forwards;
	animation: flipIn 0.8s ease-in forwards;
}

/* Front row */
.tt-effect-frontrow li {
	overflow: hidden;
}

.tt-effect-frontrow.tt-effect-active li:not(.tt-empty) a:first-child {
	-webkit-animation: moveToBack 0.8s forwards;
	animation: moveToBack 0.8s forwards;
}

.tt-effect-frontrow.tt-effect-active li a:nth-child(2),
.tt-effect-frontrow.tt-effect-active li.tt-empty a {
	-webkit-animation: moveToFront 0.8s forwards;
	animation: moveToFront 0.8s forwards;
}

.tt-effect-frontrow.tt-effect-active li.tt-empty a {
	opacity: 0;
}

.tt-effect-frontrow.tt-effect-active li:not(.tt-empty) a:only-child {
	-webkit-animation: fadeOut 0.5s forwards;
	animation: fadeOut 0.5s forwards;
}


/* Animation delays */
.tt-grid-wrapper .tt-effect-delay.tt-effect-active li:nth-child(2) a {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s;
}

.tt-grid-wrapper .tt-effect-delay.tt-effect-active li:nth-child(3) a {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

.tt-grid-wrapper .tt-effect-delay.tt-effect-active li:nth-child(4) a {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
}

.tt-grid-wrapper .tt-effect-delay.tt-effect-active li:nth-child(5) a {
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}

.tt-grid-wrapper .tt-effect-delay.tt-effect-active li:nth-child(6) a {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}

/* Reverse delays */
.tt-grid-wrapper .tt-effect-delay-reversed.tt-effect-active li:nth-child(5) a {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s;
}

.tt-grid-wrapper .tt-effect-delay-reversed.tt-effect-active li:nth-child(4) a {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

.tt-grid-wrapper .tt-effect-delay-reversed.tt-effect-active li:nth-child(3) a {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
}

.tt-grid-wrapper .tt-effect-delay-reversed.tt-effect-active li:nth-child(2) a {
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}

.tt-grid-wrapper .tt-effect-delay-reversed.tt-effect-active li:nth-child(1) a {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}


/* Animations */
@-webkit-keyframes fallDown { 
	to { opacity: 0; -webkit-transform: translateY(70%); }
}

@keyframes fallDown { 
	to { opacity: 0; transform: translateY(70%); }
}

@-webkit-keyframes scaleUpFadeIn { 
	from { opacity: 0; -webkit-transform: scale(0.8); }
	to { visibility: visible; opacity: 1; -webkit-transform: scale(1); }
}

@keyframes scaleUpFadeIn { 
	from { opacity: 0; transform: scale(0.8); }
	to { visibility: visible; opacity: 1; transform: scale(1); }
}

@-webkit-keyframes slideOut { 
	from { width: 100%; }
	to { width: 0%; }
}

@keyframes slideOut { 
	from { width: 100%; }
	to { width: 0%; }
}

@-webkit-keyframes fadeOut { 
	from { opacity: 1; }
	to { opacity: 0; }
}

@keyframes fadeOut { 
	from { opacity: 1; }
	to { opacity: 0; }
}

@-webkit-keyframes fadeIn { 
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes fadeIn { 
	from { opacity: 0; }
	to { opacity: 1; }
}

@-webkit-keyframes fallRotate { 
	0% { -webkit-transform: translateY(0%) rotate(0deg); -webkit-animation-timing-function: ease-in;}
	40% { -webkit-transform: translateY(0%) rotate(20deg); -webkit-animation-timing-function: ease-out;}
	60% { -webkit-transform: translateY(0%) rotate(15deg); opacity: 1;}
	100% { -webkit-transform: translateY(150%) rotate(17deg); opacity: 0; }
}

@keyframes fallRotate { 
	0% { transform: translateY(0%) rotate(0deg); animation-timing-function: ease-in;}
	40% { transform: translateY(0%) rotate(20deg); animation-timing-function: ease-out;}
	60% { transform: translateY(0%) rotate(15deg); opacity: 1;}
	100% { transform: translateY(150%) rotate(17deg); opacity: 0; }
}

@-webkit-keyframes scaleRotateOut { 
	100% { opacity: 0; -webkit-transform: scale(0); }
}

@keyframes scaleRotateOut { 
	100% { opacity: 0; transform: scale(0); }
}

@-webkit-keyframes scaleRotateIn { 
	0% { opacity: 0; -webkit-transform: translateX(50%) translateY(100%) rotate(25deg); }
	100% { visibility: visible; opacity: 1; -webkit-transform: translateX(0%) translateY(0%) rotate(0deg); }
}

@keyframes scaleRotateIn { 
	0% { opacity: 0; transform: translateX(50%) translateY(100%) rotate(25deg); }
	100% { visibility: visible; opacity: 1; transform: translateX(0%) translateY(0%) rotate(0deg); }
}

@-webkit-keyframes moveLeft { 
	50% { opacity: 1; -webkit-transform: translateX(-100%) rotateY(35deg) rotateX(10deg); }
	100% { opacity: 1; -webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg); }
}

@keyframes moveLeft {
	50% { opacity: 1; transform: translateX(-100%) rotateY(35deg) rotateX(10deg); }
	100% { opacity: 1; transform: translateX(0%) rotateY(0deg) rotateX(0deg); }
}

@-webkit-keyframes popUp { 
	0% { -webkit-transform: translateZ(-200px); }
	50% { z-index: -1; }
	51% { z-index: 1; }
	70% { z-index: 1; visibility: visible; -webkit-transform: translateZ(50px); -webkit-animation-timing-function: ease-out; }
	100% { z-index: 1; visibility: visible; -webkit-transform: translateZ(0px); }
}

@keyframes popUp { 
	0% { transform: translateZ(-200px); }
	50% { z-index: -1; }
	51% { z-index: 1; }
	70% { z-index: 1; visibility: visible; transform: translateZ(50px); animation-timing-function: ease-out; }
	100% { z-index: 1; visibility: visible; transform: translateZ(0px); }
}

@-webkit-keyframes rotateOutLeft { 
	100% { opacity: 0; -webkit-transform: rotateY(90deg); }
}

@keyframes rotateOutLeft { 
	100% { opacity: 0; transform: rotateY(90deg); }
}

@-webkit-keyframes rotateInRight { 
	0% { opacity: 0; -webkit-transform: rotateY(-90deg); }
	100% { visibility: visible; opacity: 1; -webkit-transform: rotateY(0deg); }
}

@keyframes rotateInRight { 
	0% { opacity: 0; transform: rotateY(-90deg); }
	100% { visibility: visible; opacity: 1; transform: rotateY(0deg); }
}

@-webkit-keyframes hideLeft { 
	0% { -webkit-transform: translateZ(0px); }
	40% { -webkit-transform: translate(-40%, 0) scale(0.8) rotateY(20deg); }
	100% { opacity: 1; -webkit-transform: translateZ(-400px); }
}

@keyframes hideLeft { 
	0% { transform: translateZ(0px); }
	40% { transform: translate(-40%, 0) scale(0.8) rotateY(20deg); }
	100% { transform: translateZ(-400px); }
}

@-webkit-keyframes showRight { 
	0% { -webkit-transform: translateZ(-400px); }
	40% {  z-index: -1; -webkit-transform: translate(40%, 0) scale(0.8) rotateY(-20deg); }
	41% {  z-index: 1; }
	100% { z-index: 1; visibility: visible; -webkit-transform: translateZ(0px); }
}

@keyframes showRight { 
	0% { transform: translateZ(-400px); }
	40% {  z-index: -1; transform: translate(40%, 0) scale(0.8) rotateY(-20deg); }
	41% {  z-index: 1; }
	100% { z-index: 1; visibility: visible; transform: translateZ(0px); }
}

@-webkit-keyframes scaleDown { 
	100% { opacity: 0; -webkit-transform: scale(0); }
}

@keyframes scaleDown { 
	100% { opacity: 0; transform: scale(0); }
}

@-webkit-keyframes scaleIn { 
	0% { opacity: 0; -webkit-transform: scale(1.2); }
	100% { visibility: visible; opacity: 1; -webkit-transform: scale(1); }
}

@keyframes scaleIn { 
	0% { opacity: 0; transform: scale(1.2); }
	100% { visibility: visible; opacity: 1; transform: scale(1); }
}

@-webkit-keyframes flipOut { 
	50% { opacity: 0; -webkit-transform: rotateY(90deg); }
	100% { opacity: 0; -webkit-transform: rotateY(90deg); }
}

@keyframes flipOut { 
	50% { opacity: 0; transform: rotateY(90deg); }
	100% { opacity: 0; transform: rotateY(90deg); }
}

@-webkit-keyframes flipIn { 
	0% { opacity: 0; -webkit-transform: rotateY(-90deg); }
	50% { opacity: 0; -webkit-transform: rotateY(-90deg); }
	75% { visibility: visible; opacity: 1; -webkit-transform: rotateY(15deg); -webkit-animation-timing-function: ease-in; }
	100% { visibility: visible; opacity: 1; -webkit-transform: rotateY(0deg); }
}

@keyframes flipIn { 
	0% { opacity: 0; transform: rotateY(-90deg); }
	50% { opacity: 0; transform: rotateY(-90deg); }
	75% { visibility: visible; opacity: 1; transform: rotateY(15deg); animation-timing-function: ease-in; }
	100% { visibility: visible; opacity: 1; transform: rotateY(0deg); }
}

@-webkit-keyframes moveToBack { 
	100% { -webkit-transform: translateX(-60%) scale(.8); }
}

@keyframes moveToBack { 
	100% { transform: translateX(-60%) scale(.8); }
}

@-webkit-keyframes moveToBack { 
	100% { -webkit-transform: translateX(-60%) scale(.8); }
}

@-webkit-keyframes moveToFront { 
	0% { -webkit-transform: translateX(100%) scale(.8); }
	100% { visibility: visible; opacity: 1; -webkit-transform: translateX(0%) scale(1); }
}

@keyframes moveToFront { 
	0% { transform: translateX(100%) scale(.8); }
	100% { visibility: visible; opacity: 1; transform: translateX(0%) scale(1); }
}

/*   VIII. Testimonials
==============================*/
#testimonials blockquote {
border:none;
}
@-webkit-keyframes loop {
		from {background-position:0 0;}
		to {background-position: 500px 0;}
	}
	
	@-moz-keyframes loop {
		from {background-position:0 0;}
		to {background-position: 500px 0;}
	}
	
	@-ms-keyframes loop {
		from {background-position:0 0;}
		to {background-position: 500px 0;}
	}
	
	@-o-keyframes loop {
		from {background-position:0 0;}
		to {background-position: 500px 0;}
	}
	
	@keyframes loop {
		from {background-position:0 0;}
		to {background-position: 500px 0;}
	}
#testimonials {
background:url(../img/green.jpg) repeat;
-webkit-animation: 10s linear 0s normal none infinite loop;
-moz-animation: 10s linear 0s normal none infinite loop;
-ms-animation: 10s linear 0s normal none infinite loop;
-o-animation: 10s linear 0s normal none infinite loop;
animation: 10s linear 0s normal none infinite loop;
blockquote h1, blockquote p {color:#fff;}
}
#testimonials h1,#testimonials p, #testimonials cite {
color:#fff;
}
#testimonials hr,#testimonials hr:before,#testimonials hr:after {
background-color: #fff;
}
.testi p {
font-style: italic;
}
blockquote hr {
background-color:#fff;
}

/*   IX. Contact
==============================*/

#map_div {
height:300px;
width:100%;
}

@media (min-width: 1200px) {
#map_div {
width:470px;
}
}
@media (min-width: 768px) and (max-width: 979px) {
#map_div {
width:470px;
}
 }

/* Widget Social*/
.widget-social li {
margin:28px 0 0;
float: left;
width: 16.666666666666664%;
padding: 0 5px 5px 0;
color:#fff;
}
.widget-social li.last {
padding-right:0;
}

.widget-social .social-facebook a{background: #3873ae;}
.widget-social .social-twitter a{background: #62c6f8;}
.widget-social .social-dribble a{background: #d74980;}
.widget-social .social-rss a{background: #e67e22;}
.widget-social .social-google a{background: #000;}
.widget-social .social-skype a{background: #51a6d3;}
.widget-social .social-facebook a:hover{background: #4893ce;}
.widget-social .social-twitter a:hover{background: #82e6ff;}
.widget-social .social-dribble a:hover{background: #f769a0;}
.widget-social .social-rss a:hover{background: #EC984E;}
.widget-social .social-google a:hover{background: #333;}
.widget-social .social-skype a:hover{background: #71c6f3;}

.widget-social a {
display: block;
height: 150px;
line-height: 148px;
text-align: center;
background: #3bbec0;
-webkit-transition: background .3s ease-in-out;
transition: background .3s ease-in-out;
}

.widget-social i {
width: 56px;
height: 46px;
margin: 0;
vertical-align: middle;
color: #fff;
font-size: 44pt;
}

/* Widget Social End*/

/* Animation */
.animated{
    opacity: 0;
}
.activate{
	opacity: 1;
}

.animated.delayTwo {
-webkit-animation-duration: 1.2s;
    -moz-animation-delay: 1.2s;
    -o-animation-iteration-count: infinite;
}

.animated.delayThree{
-webkit-animation-duration: 1.3s;
    -moz-animation-delay: 1.3s;
    -o-animation-iteration-count: infinite;
}

.animated.delayLong {
-webkit-animation-duration: 3s;
    -moz-animation-delay: 3s;
    -o-animation-iteration-count: infinite;
}

/*   X. Preloader
==============================*/
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff; /* change if the mask should have another color then white */
	z-index:9999; /* makes sure it stays on top */
}

#status {
	width:200px;
	height:200px;
	position:absolute;
	left:50%; /* centers the loading animation horizontally one the screen */
	top:50%; /* centers the loading animation vertically one the screen */
	background-image:url(../img/loading.gif); /* path to your loading animation */
	background-repeat:no-repeat;
	background-position:center;
	margin:-100px 0 0 -100px; /* is width and height divided by two */
}

/*-------------------
Style Switcher - For Demo only
*/
.styleswitcher{
	position:fixed;
	z-index:999;
	top:90px;
	width:100px;
	background:#999;
	margin-left:-100px;
}
.styleswitcher ul{
	list-style-type:none;
	margin:10px;
	padding:0;
}
.styleswitcher ul li{
	margin:2px 0;
}
.styleswitcher ul a{
	color:#FFF;
}
.styleswitcher a.closer2{
color: #FFFFFF;
z-index: 99;
font-size: 19px;
display: block;
width: 30px;
height: 35px;
background: #999;
position: absolute;
right: -35px;
padding: 5px;
}
.styleswitcher a.closer3{
	color:#FFFFFF;
	z-index:99;
	font-size:19px;
	display:block;
	width:30px;
	height:35px;
	background:#999;
	position:absolute;
	right:-35px;
	padding:5px;
}
@media (max-width: 960px){
	.styleswitcher{
		display:none;
	}
}