/*

   Template Name: LIVID html template
   Template URI: http://blackythemes.com
   Description: This is html5 template
   Author: blackyThemes
   Author URI: http://blackythemes.com
   Version: 1.0

	----------------------------------------
    
   CSS INDEX
	
	1. - General 
		1.1. - Various classes
		1.2. - Grid system
		1.3. - Wrap
		1.4. - H2 section
	2. - Mobile Container
	3. - Header section 
		3.1. - Navbar
		3.2. - Logo
		3.3. - OWL carousel elements (global)
		3.4. - OWL carousel in header
		3.5. - Navicon
	4. - Navigation menus
	5. - NAvigation mobile menus
	6. - Blue line section (on home or page title)
	7. - Main section
		7.1. - Blog list on homepage
		7.2. - Blog single post
		7.3. - Tags
		7.4. - Blog list - Classic
		7.5. - Blog list - Grid
	8. - Sidebar
	9. - Portfolio items
	10. - Our Teams Section
	11. - Footer
	12. - Other elements
		12.1. - Buttons
		12.2. - 404 page
		12.3. - Coming Soon page
		12.4. - Subscribe div on home
		12.5. - Our clients logo
		12.6. - Service items
		12.7. - Scroll to top icon
		12.8. - Browser upgrade notofocation
		12.9. - Social icons
		12.10. - Pagination
		12.11. - Forms
		12.12. - Alert box
    
    BLUE : 0078BF
    
    
*/


/* general *****/
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 12px;
    color: #242424;
    font-weight: 300;
	text-shadow: 2px 2px 2px rgba(0,0,0, 0.5)
}

h1, h2, h3, h4, h5, h6 text-color {
    color: #0078BF;
}


h1 { font-size: 38px; line-height: 1.8em; }
h2 { font-size: 34px; line-height: 1.7em; }
h3 { font-size: 28px; line-height: 1.6em; }
h4 { font-size: 24px; line-height: 1.5em; }
h5 { font-size: 20px; line-height: 1.4em; }
h6 { font-size: 18px; line-height: 1.3em; }

body, input, textarea, button, select, label
{ font-family: 'raleway', sans-serif; font-weight:400; font-size:14px; line-height: 1.0em; }

a{
  text-decoration: none;
  color:#333;
}


iframe{
	margin:0;
	padding:0;
}

.clear{
	clear:both;
}

.center{
	text-align:center;
}
.left{
	text-align:left;
}
img.left{
	float:left;
	margin:0 20px 10px 0;
}

.pull-left {
  float: left !important;
}

.pull-center {
  text-align: center !important;
}

.pull-right {
  float: right !important;
}

.padding{
	padding:30px 0;
	position:relative;
}

.text-white,
.text-white h1{
	color:#fff;
}

.text-color {
    color: #0078BF;
}


.bg-white{
	background:#fff;
}

.block{
	display:block;
	padding:25px 0;
}
.block.light-gray{
	background:#ddd;
}

.overlay{
	position:absolute;
	z-index:2;
	top:0;
	left:0;
	right:0;
	bottom:0;    
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 40%);
}
.overlay-dark{
	position:absolute;
	z-index:-1;
	top:0;
	left:0;
	right:0;
	bottom:0;    
	background:rgba(0, 0, 0, 0.8);
}

.circle{
	border-radius:50%;
	border:4px solid #fff;
}


/* H2 Home sections */
h2.section{
	display:block;	
	position:relative;
	margin:0;
	padding:20px;
	font-size:32px;
}
h2.section.center{
	text-align:center;
}
h2.section:after{
	display:block;
	position:absolute;
	content:"";
	width:50px;
	border-bottom:2px solid #0078BF;
	margin:10px 0;
}
h2.section.center:after{
	left:50%;
	margin-left:-25px;
}


	hr {
	display: block;
	clear: both;
	border-top: solid 1px #0078BF;
	margin: 20px 0 20px 0;
}



/*  grid system & container system */
.container{
	display:block;
	width:1170px;
	margin:0 auto;
}
.rows{
  display:block;
}
.rows:after{
  content: "."; 
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
.rows > .cols-full{
  float:left;
  width:100%;
}
.rows > .cols-half{
  float:left;
  width:50%;
}
.rows > .cols-third{
  float:left;
  width:33.333%;
}
.rows > .cols-twothird{
  float:left;
  width:66.666%;
}
.rows > .cols-quarter{
  float:left;
  width:25%;
}
.rows > .cols-eight{
  float:left;
  width:12.5%;
}
.rows > .cols-threequarter{
  float:left;
  width:75%;
}
.rows > .cols-padd{
  padding:0 10px;
}
.rows > .cols-padd2{
  padding:0 10px;
}
.rows > .cols-padd20{
  padding:0 20px;
}
.rows > .cols-padd3{
  padding:0 0 10px;
}
.rows > .cols-padd30{
  padding:0 0 20px;
}
.rows > .cols-padd-r{
  padding:0 10px 0 0;
}
.rows > .cols-padd-l{
  padding:0 0 0 10px;
}

.rows > .cols-center{
	text-align:center ;
}


/* WRAP **********/
.wrap{
	display:block;
	width:100%;
	min-height:100%;
	height:100%;
	position:relative;
	right:0;
	transition: all 0.3s ease;
}
.wrap.moved{
	position:fixed;
	right:240px;
	overflow:hidden;
	transition: all 0.3s ease;
}


/* MOBILE CONTAINER **********/
.mobile-container{
	display:block;
	position:fixed;
	width:240px;
	top:0;
	right:0;
	bottom:0;
	background:#333;
	overflow-y:auto;
	box-shadow:inset 7px 0 10px rgba(0,0,0,0.2);
	transition: all 0.3s ease;
}
.mobile-container.closed{
	width:0;
	overflow:hidden;
	transition: all 0.3s ease;
}


/* HEADER section **********/
.header{
	display:block;
	position:relative;
	height:655px;
}
.header.big{
	height:100%;
}
.header.short{
	height:200px;
}


/* NAVBAR */
.navbar{
	display:block;
	position:relative;
	z-index:99;
	line-height:60px;
	background:rgba(255,255,255,0);
	transition: all 0.3s ease;
}
.navbar.fixed{
	position:fixed;
	top:0;
	left:0;
	right:0;
	background:rgba(255,255,255,1);
	transition: all 0.3s ease;
}


/* LOGO */
.logo{
	margin:0;
	padding:5px 0;
	color:#fff;
	font-size:42px;
	font-weight:300;
	line-height:38px;
}
.logo a{
	display:inline-block;
	margin:0;
	padding: 0;
	width:100px;
	height:40px;
	background:url(../images/logo.png) bottom center no-repeat;
	background-size:100% auto;
	color:#fff;
}
.navbar.fixed .logo a{
	background:url(../images/logo_dark.png) bottom center no-repeat;
	background-size:100% auto;
	margin:0;
	padding: 0;
}
.footer .logo a{
	width:150px;
	height:56px;
}
.logo small{
	display:inline-block;
	margin:0;
	padding: 0;
	font-size:12px;
	padding-left:10px;
	line-height:10px;
	text-transform:uppercase;
}
.navbar.fixed .logo{
	color:#666;
}
.logo.center{
	text-align:center;
}
.logo.center small{
	display:block;
	padding:0;
}



/* OWL ELEMENTS */
.owl-controls{
	position:relative;
	z-index:999;
}
.owl-next,
.owl-prev{
	position:absolute;
	z-index:99;
	top:50%;
	margin-top:-25px;
	width:42px;
	height:54px;
	font-family:FontAwesome;
	font-size:48px;
	text-align:center;
	background:rgba(255,255,255,0.3);
	line-height:50px;
}
.owl-next{
	opacity:0;
	filter:alpha(opacity=0);
	right:0;
	transition: all 0.2s ease;
}
.owl-next:after{
	content:"\f105";
}
.owl-prev{
	opacity:0;
	filter:alpha(opacity=0);
	left:0;
	transition: all 0.2s ease;
}
.owl-prev:after{
	content:"\f104";
}
.owl-carousel:hover .owl-next{
	opacity:1.0;
	filter:alpha(opacity=100);
	transition: all 0.2s ease;
}
.owl-carousel:hover .owl-prev{
	opacity:1.0;
	filter:alpha(opacity=100);
	transition: all 0.2s ease;
}
.owl-dots{
	position:absolute;
	top:-50px;
	text-align:center;
	width:100%;
}
.owl-dots .owl-dot{
	display:inline-block;
	width:14px;
	height:14px;
	background:#fff;
	box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
	border-radius:50%;
	margin:3px;
}
.owl-dots .owl-dot.active{
	background:#0078BF;
}


/* HEADER OWL carousel */
.header > .owl-carousel{
	position:absolute;
	background:#000;
}
.header .owl-home{
	position:relative;
	height:655px;
}
.header .owl-home .overlay{
	z-index:1;
}
.header .owl-home .title,
.home-title{
	display:block;
	position:absolute;
	z-index:99;
	text-align:center;
	width:100%;
	font-weight:300;
	font-size:60px;
	top:45%;
	left:-100%;
    color: #0078BF;
    opacity:0;
	filter:alpha(opacity=0);
    text-shadow: 3px 3px 3px rgba(0,0,0, 0.9)
}
.header .owl-item.active .owl-home .title,
.home-title{
	visibility:visible;
	left:0;
	opacity:1;
	filter:alpha(opacity=100);
	transition: all 0.9s ease;
    text-shadow: 3px 3px 3px rgba(0,0,0, 0.9)
}
.header .owl-home .desc,
.home-desc{
	display:block;
	position:absolute;
	z-index:99;
	text-align:center;
	width:100%;
	font-weight:700;
	font-size:20px;
	top:55%;
	right:-100%;
	color:#fff;
	visibility:hidden;
    text-shadow: 3px 3px 3px rgba(0,0,0, 0.9)
}
.header .owl-item.active .owl-home .desc,
.home-desc{
	visibility:visible;
	right:0;
	opacity:1;
	filter:alpha(opacity=100);
	transition: all 0.9s ease;
}
.header .owl-home .btn,
.home-btn{
	display:block;
	position:absolute;
	bottom:0;
	left:50%;
	margin-left:-60px;
	opacity:0;
	filter:alpha(opacity=0);
	transition: all 0.9s ease;
}
.header .owl-item.active .owl-home .btn,
.home-btn{
	visibility:visible;
	z-index:99;
	bottom:30%;
	opacity:1;
	filter:alpha(opacity=100);
	transition: all 1s ease;
}
.header .owl-next,
.header .owl-prev{
	top:-350px;
	margin-top:0;
}


/* navicon */
.navicon{
	display:none;
	float:right;
	width:60px;
	font-size:32px;
	color:#fff;
	text-align:center;
	line-height:60px;
	margin-top:10px;
}
.navbar.fixed .navicon{
	color:#333;
	margin-top:0;
}
.navicon:hover{
	background:rgba(0,0,0,0.2);
	cursor:pointer;
}


/* Navigation menus **********/
.navigation, .navigation > ul{
	margin:5px 0;
	padding:0;
	list-style-type:none;
	list-style-position:outside;
	position:relative;
	z-index:659;
	float: right;
	line-height:60px;
}
.navbar.fixed .navigation, .navbar.fixed .navigation > ul{
	margin:0;
}
.navigation ul a{
	display:block;
	font-weight:400;
	font-size:14px;
	padding:0 20px;
	color:#fff;
	text-decoration:none;
	transition: all 0.4s ease;
	text-transform:uppercase;
}
.navigation ul a i{
	padding-left:10px;
}
.navigation ul li ul a i{
	float:right;
	padding-top:7px;
}
.navbar.fixed .navigation ul a{
	color:#333;
}
.navbar.fixed .navigation ul li ul a{
	color:#fff;
}
.navigation ul li{
	display:block;
	float:left;
	position:relative;
}
.navigation ul li:hover a{
	background:#0078BF;
	color:#fff;
}
.navbar.fixed .navigation ul li:hover a{
	color:#fff;
}
.navigation ul li.current{
  	background:rgba(0,0,0,0.2);
}
.navigation li.current a{
	font-weight:700;
}
.navigation ul ul {
	position:absolute;
	display:none;
	width:225px;
	top:60px;
	left:0px;
	padding:10px;
	margin:0;
	background:#0078BF;
}
.navigation ul li ul li{
	display: block;
	width:100%;
	margin:0;
}
.navigation ul li:hover ul li a{
	display: block;
	width:100%;
	padding:5px 10px;
	margin:0;
	font-size:14px;
	line-height: 30px;
	font-weight:400;
	text-transform:none;
	height:auto;
	background:none;
	text-decoration:none;
	color: #fff;
	text-align:left;
}
.navigation ul ul ul{ 
	top:auto;
}	
.navigation ul li ul ul {
	left:195px;
	margin:0px 0 0 10px;
	top:0;
	background:#333;
	border-top:none;
}
.navigation ul li ul ul ul {
	background:#0078BF;
}
.navigation ul li ul li:hover{
	background:#333;
}
.navigation ul li ul li ul li:hover{
	background:#0078BF;
}
.navigation ul li ul li ul li ul li:hover{
	background:#333;
}
.navigation ul li ul li:hover a{
	color:#fff;
}
.navigation > ul li:hover ul ul, 
.navigation > ul li:hover ul ul ul, 
.navigation > ul li:hover ul ul ul ul{
	display:none;
}
.navigation > ul li:hover ul, 
.navigation > ul li li:hover ul, 
.navigation > ul li li li:hover ul{
	display:block;
}


/* Navigation mobile menus **********/
.navigation_mob{
	list-style-type:none;
	display:block;
	margin:0;
	padding:0;
	border-bottom:1px solid rgba(255,255,255,0.1);
}
.navigation_mob li{
	display:block;
	line-height:40px;
	border-top:1px solid rgba(255,255,255,0.1);
}
.navigation_mob li i{
	float:right;
	padding:0 10px;
	line-height:40px;
}
.navigation_mob li a{
	display:block;
	color:#ddd;
	padding:0 15px;
}
.navigation_mob li a:hover{
	color:#fff;
	background: rgba(0,0,0,0.1);
}
.navigation_mob ul{
	margin:0;
	padding:0;
	border-bottom:none;
	background: rgba(0,0,0,0.2);
}
.navigation_mob ul li a{
	padding-left:35px;
}
.navigation_mob ul ul li a{
	padding-left:55px;
}
.navigation_mob ul ul ul li a{
	padding-left:75px;
}



/* BLUE section - Blue line with content or title **********/
.blue{
	display:block;
	padding:25px 0;
	background:#0078BF;
	color:#fff;
	text-align:center;
}
.blue h3{
	color:#fff;
	font-weight:700;
	margin:20px 0;
	padding:0;
}
.blue .meta{
	display:block;
	margin-top:-5px;
	margin-bottom:15px;
}
.blue h1{
	color:#fff;
	font-weight:300;
	margin:-25px 0 -10px 0;
	padding:0 0 10px 0;
	font-size:42px;
	border-bottom:1px solid #fff;
}
.blue h1:after{
	content:"";
	display:block;
	width:120px;
	height:45px;
	background:url(../images/h1.png) center no-repeat;
	position:absolute;
	left:50%;
	margin:4px 0 0 -60px;
}
.blue h2{
	color:#fff;
	font-weight:700;
	margin:0;
	padding:0;
	font-size:42px;
	text-transform:uppercase;
}


/* MAIN section **********/
.content{
	display:block;
	padding:0;
	color:#333;
}
.content h1{
	font-size:32px;
	line-height:38px;
	font-weight:700;
}
.content h2{
	font-size:26px;
	line-height:32px;
	font-weight:700;
}
.content h3{
	font-size:20px;
	line-height:24px;
	font-weight:700;
}
.content blockquote{
	display:block;
	margin:10px 0;
	padding:5px 20px;
	border-left:10px solid #eee;
	border-radius:5px;
	color:#666;
	font-style:italic;
	font-size:16px;
}

/* Blog on home */
.blog-home-container{
	display:block;
}
.blog-home-container:after{
  content: "."; 
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
.blog-home{
	display:block;
	position:relative;
	float:left;
	margin:0;
	padding:0;
	overflow:hidden;
}
.blog-home .overlay{   
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.5) 100%);
	transition: all 0.3s ease;
}
.blog-home.big{
	width:50%;
	height:500px;
}
.blog-home.small{
	width:25%;
	height:220px;
}
.blog-home img{
	position:absolute;
	width:100%;
	height:auto;
}
.blog-home h2{
	position:absolute;
	z-index:3;
	right:40px;
	top:25px;
	color:#fff;
	margin:0;
	padding:0;
	font-weight:700;
}
.blog-home .title{
	position:absolute;
	z-index:3;
	left:25px;
	right:25px;
	bottom:25px;
	color:#fff;
	transition: all 0.3s ease;
}
.blog-home:hover .title{
	bottom:80px;
	transition: all 0.3s ease;
}
.blog-home .btn{
	position:absolute;
	z-index:3;
	bottom:-125px;
	left:25px;
	transition: all 0.3s ease;
}
.blog-home:hover .btn{
	bottom:25px;
	transition: all 0.3s ease;
}
.blog-home.big .title,
.blog-home.big .btn{
	left:40%;
}
.blog-home:hover .overlay{   
	background: rgba(0, 0, 0, 0.7);
	transition: all 0.3s ease;
}
.blog-home .title .cat{
	display:block;
	font-size:12px;
	text-transform:uppercase;
}
.blog-home .title a{
	display:block;
	line-height:32px;
	font-size:28px;
	font-weight:300;
	color:#fff;
}
.blog-home .title a:after{
	display:block;
	content:"";
	width:100px;
	border-bottom:2px solid #fff;
	margin:10px 0;
}
.blog-home.small .title a{
	line-height:26px;
	font-size:22px;
}
.blog-home.small .title a:after{
	border-bottom:1px solid #fff;
	margin:7px 0;
}
.blog-home .title .meta{
	display:block;
	font-size:12px;
}

/* Blog - single post */
.meta{
	font-size:12px;
}
.meta span,
.meta a{
	font-weight:700;
	color:#fff;
}
.meta.dark span,
.meta.dark a{
	color:#666;
}
.post{
	display:block;
}
.post .meta{
	display:block;
	margin:20px 0 30px 0;
}
.post .meta a,
.post .meta span{
	color:#666;
}
.post img{
	max-width:100%;
	width:auto;
	height:auto;
}
.post .share{
	display:block;
	margin:10px 0;
	text-align:center;
}
.post .share h3{
	margin:30px 0 5px 0;
	padding:0;
	font-weight:300;
}
.post .share a{
	background:#eee;
}
.post .share a:hover{
	background:#0078BF;
}
.post .comments{
	display:block;
	margin:30px 0;
	padding:20px 0;
	border-top:1px solid rgba(0,0,0,0.1);
}
.post .comments .item{
	display:block;
	margin:10px 0;
}
.post .comments .item.sub{
	margin-left:100px;
}
.post .comments .item .user{
	display:block;
	padding:0 10px;
	text-align:center;
}
.post .comments .item .user img{
	display:block;
	margin-left:auto;
	margin-right:auto;
	width:100px;
	height:100px;
	border-radius:50%;
}
.post .comments .item .user span{
	display:block;
	font-size:12px;
}
.post .comments .item p{
	display:block;
	padding:15px;
	background:#fafafa;
}
.post .comments .item .btn{
	color:#ccc;
	border-color:#ccc;
}
.post .comments .item .btn:hover{
	color:#0078BF;
	border-color:#0078BF;
}
.post .comments-form{
	display:block;
	margin:30px 0 0 0;
	padding:10px 0;
	border-top:1px solid rgba(0,0,0,0.1);
}

/* Tags */
.tags{
	display:block;
	margin:10px 0;
	font-size:12px;
	color:#666;
}
.tags a{
	display:inline-block;
	margin:2px;
	padding:2px 8px;
	color:#fff;
	background:#666;
}
.tags a:hover{
	background:#0078BF;
}


/* BLOG CLASSIC *****/
.post-list{
	display:block;
	position:relative;
	margin:30px 0;
}
.post-list:after{
  content: "."; 
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
.post-list .image{
	float:left;
	width:320px;
	height:250px;
	overflow:hidden;
	margin-right:20px;
}
.post-list .image img{
	width:auto;
	height:100%;
}
.post-list .title{
	display:block;
	font-size:26px;
	line-height:30px;
	margin:10px 0;
	color:#444;
}
.post-list .title:hover{
	cursor:pointer;
	color:#0078BF;
}
.post-list .btn{
	position:absolute;
	bottom:0;
	left:340px;
}


/* BLOG GRID *****/
.post-grid{
	display:block;
	position:relative;
	margin:10px 0;
	padding:20px;
	height:500px;
	border:1px solid rgba(0,0,0,0.1);
	text-align:center;
}
.post-grid .image{
	display:block;
	margin:-20px -20px 0 -20px;
	height:200px;
	overflow:hidden;
}
.post-grid .image img{
	width:100%;
	height:auto;
}
.post-grid .title{
	display:block;
	font-size:26px;
	line-height:30px;
	padding:10px 0;
	color:#444;
}
.post-grid .title:hover{
	cursor:pointer;
	color:#0078BF;
}
.post-grid .meta{
	text-align:center;
	margin-bottom:20px;
}
.post-grid .btn{
	position:absolute;
	bottom:20px;
	left:50%;
	margin-left:-60px;
}

/* SIDEBAR section *****/
.sidebar{
	display:block;
	padding-left:10px;
}
.sidebar-widget{
	display:block;
	margin-bottom:30px;
}
.sidebar-widget h3{
	display:block;
	margin:0 0 20px 0;
	padding:10px 0;
	font-weight:300;
	font-size:22px;
	border-bottom:1px solid rgba(0,0,0,0.1);
}
.sidebar-widget h3:after{
	content:"";
	display:block;
	width:100px;
	height:0;
	padding:0;
	margin:10px 0 -11px 30px;
	border-bottom:1px solid #0078BF;
}
.sidebar-widget h3 .fa{
	color:#ccc;
}

.sidebar-widget.search input{
	display:block;
	width:95%;
	border:1px solid #ccc;
	line-height:30px;
	padding:0 10px;
}
.sidebar-widget.search input:focus{
	outline:none;
	background:#eee;
}
.sidebar-widget.search button{
	display:block;
	width:90%;
	height:30px;
	background:#0078BF;
	color:$FFF;
	border:1px solid #ddd;
	line-height:40px;
	padding:0 10 0 10px;
}

.sidebar-widget.categories{}
.sidebar-widget.categories ul{
	display:block;
	margin:0;
	padding:0;
	list-style-type:none;
}
.sidebar-widget.categories ul li{
	display:block;
	line-height:40px;
	border-bottom:1px solid rgba(0,0,0,0.1);
}
.sidebar-widget.categories ul li a{
	display:block;
	color:#666;
	padding:0 10px;
}
.sidebar-widget.categories ul li:hover{
	border-color:#0078BF;
}
.sidebar-widget.categories ul li:hover a{
	color:#0078BF;
}

.sidebar-widget.latest{}
.sidebar-widget.latest .item{
	margin:15px 0 0 0;
}
.sidebar-widget.latest .item:after{
  content: "."; 
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
.sidebar-widget.latest .item > img{
	width:100px;
	height:100px;
	float:left;
	margin:0 10px 0 0;
}
.sidebar-widget.latest .item .title{
	display:block;
	line-height:18px;
	margin-bottom:4px;
	font-size:14px;
	color:#666;
	font-weight:600;
}
.sidebar-widget.latest .item .title:hover{
	cursor:pointer;
	color:#000;
}

.sidebar-widget.tags a{
	color:#aaa;
	border:1px solid #ccc;
	background:#fff;
	font-size:14px;
}
.sidebar-widget.tags a:hover{
	background:#0078BF;
	border-color:#0078BF;
	color:#fff;
}

.sidebar-widget.twitter{}
.sidebar-widget.twitter .item{
	margin:15px 0 0 0;
	color:#333;
}
.sidebar-widget.twitter .item .fa{
	color:#0078BF;
	padding-right:10px;
}
.sidebar-widget.twitter .item small{
	display:block;
}


/* PORTOFLIO ITEMS */
.portfolio-item{
	display:block;
	width:23%;
	height:200px;
	background:#ccc;
	margin:1%;
	overflow:hidden;
}
.portfolio-item img{
	position:absolute;
	width:auto;
	height:100%;
}
.portfolio-item .group{
	position:absolute;
	bottom:10px;
	left:0;
	padding:4px 10px;
	color:#fff;
	background:#0078BF;
	transition: all 0.5s ease;
}
.portfolio-item:hover .group{
	left:-100%;
	transition: all 0.5s ease;
}
.portfolio-item .overlay{
	position:absolute;
	top:-500px;
	bottom:300px;
	left:0;
	right:0;
	background: rgba(0,0,0,0.7);
	padding:10px;
	color:#fff;
	text-align:center;
	padding:50px 20px;
	font-size:18px;
	font-weight:700;
	transition: all 0.5s ease;
}
.portfolio-item .overlay small{
	display:block;
	font-weight:400;
	margin-top:10px;
}
.portfolio-item:hover .overlay{
	top:0;
	bottom:0;
	transition: all 0.5s ease;
}
.portfolio-item.full{
	margin:0;
	width:25%;
	height:300px;
	border:1px solid #fff;
}
.portfolio-item.full img{
	width:auto;
	height:120%;
}
.portfolio-item.full .overlay{
	font-size:22px;
	padding-top:100px;
}
.portfolio-item.size1{
	width:31.333%;
	height:250px;
}
.portfolio-item.size1 img{
	width:auto;
	height:110%;
}
.portfolio-item.size1 .overlay{
	font-size:20px;
	padding-top:100px;
}
.portfolio-item.full.size1{
	width:33.333%;
	height:400px;
}
.portfolio-item.full.size1 img{
	width:auto;
	height:120%;
}
.portfolio-item.full.size1 .overlay{
	bottom:400px;
	font-size:26px;
	padding-top:170px;
}
.portfolio-item.full.size1:hover .overlay{
	bottom:0;
}


/* Our Team - sction */
.team-item{
	display:block;
	text-align:center;
	margin:20px 0;
}
.team-item img{
	display:block;
	width:200px;
	margin-bottom:20px;
	margin-left:auto;
	margin-right:auto;
}
.team-item .title{
	display:block;
	font-weight:300;
	font-size:20px;
}
.team-item .title small{
	font-size:11px;
	color:#000;
	text-transform:uppercase;
	font-weight:700;
}


/* FOOTER section **********/
.footer{
	display:block;
	padding:25px 0;
	background:#333;
	color:#ccc;
	font-size:13px;
}
.footer h3{
	margin:0;
	padding:20px 0 10px 0;
	color:#fff;
}
.footer ul{
	display:block;
	list-style-type:none;
	margin:0 10px;
	padding:0;
}
.footer ul li{
	display:block;
	line-height:30px;
}
.footer ul li:hover{
	background:rgba(0,0,0,0.3);
}
.footer ul li a{
	display:block;
	color:#ccc;
	padding:0 10px;
}
.footer ul li a i{
	font-size:12px;
	padding-right:5px;
}
.footer .social{
	background:#000;
	color:#fff;
}
.footer .social:hover{
	background:#0078BF;
	color:#fff;
}


/* OTHER ELEMENTS  **********/
/* Buttons */
.btn{
	display:inline-block;
	width:125px;
	line-height:40px;
	border-radius:20px;
	border:1px solid #fff;
	color:#fff;
	text-align:center;
	font-size:13px;
	transition: all 0.5s ease;
}
.btn.btn-gray{
	border-color:#aaa;
	color:#aaa;
}

.btn.btn-color{
	color:#fff;
	background:#0078BF;
	border-color:#555;

}

.btn:hover{
	color:#0078BF;
	background:#fff;
	border-color:#0078BF;
	transition: all 0.5s ease;
	cursor:pointer;
}
.btn.btn-sm{
	line-height:25px;
	width:90px;
}

.btn.btn-sm-color{
	line-height:25px;
	width:90px;
	color:#fff;
	background:#0078BF;
	border-color:#555;
}

/* 404 Page */
.page404-title{
	display:block;
	padding:144px 0 0 0;
	font-size:144px;
	text-align:center;
	color:#0078BF;
}
.page404-desc{
	display:block;
	margin:100px 0 100px 0;
	padding:0 25px;
	text-align:center;
}
.page404-desc b{
	font-size:16px;
}

/* COMING SOON Page */
.comingsoon{
	display:block;
	position:relative;
	width:100%;
	height:100%;
	min-height:575px;
	background:#000;
}
.comingsoon > img{
	position:absolute;
	width:auto;
	height:100%;
}
.comingsoon > .overlay{  
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.9) 100%);
}
.comingsoon > .content{
	position:absolute;
	z-index:10;
	width:700px;
	top:100px;
	left:50%;
	margin-left:-350px;
	text-align:center;
	color:#ddd;
}
.comingsoon > .content h3{
	color:#fff;
}
.comingsoon > .content .clock{
	text-transform:uppercase;
	font-weight:300;
	font-size:16px;
	margin:40px auto;
	padding-bottom:40px;
	border-bottom:1px solid rgba(255,255,255,0.4);
}
.comingsoon > .content .clock span{
	display:block;
	color:#fff;
	font-size:64px;
	line-height:74px;
	font-weight:700;
}
.comingsoon > .content .form{
	display:block;
	width:400px;
	margin:0 auto 50px auto;
}
input.subscribe{
	background:rgba(0,0,0,0.5);
	border:none;
	padding:0 10px;
	line-height:40px;
	color:#fff;
	width:100%;
}
input.subscribe:focus{
	outline:none;
	background:rgba(0,0,0,0.9);
}

input.subscribe-dark{
	background:rgba(255,255,255,0.8);
	border:none;
	padding:0 10px;
	line-height:40px;
	color:#222;
	width:100%;
}



button.subscribe{
	background:rgba(255,255,255,0.5);
	border:none;
	padding:0 10px;
	line-height:40px;
	color:#fff;
	font-weight:700;
	font-size:12px;
	text-transform:uppercase;
	width:100%;
}
button.subscribe:focus{
	outline:none;
	background:rgba(255,255,255,0.9);
	color:#000;
}

/* Subscribe on home */
.form-home{
	width:500px;
	margin: auto;
}


/* Our Clients LOGO */
.clients-logo{
	width:100%;
	height:auto;
	border:1px solid #eee;
	margin:10px 0;
	padding:20px;
   filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter ….3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
	filter: grayscale(100%);
   -webkit-filter: grayscale(100%);
   -webkit-transition: all .6s ease;
}
.clients-logo:hover{
	border-color:#0078BF;
	filter:none;
	-webkit-filter:grayscale(0%);
}


/* Service items */
.service-item{
	display:block;
	font-weight:300;
	padding:20px 10px;
}
.service-item h4{
	font-size:16px;
	text-transform:uppercase;
	font-weight:700;
	margin:0;
	padding:0;
}
.service-item i{
	font-size:24px;
	color:#0078BF;
	padding-right:10px;
}


/* Scroll to top icon */
.to_top{
	display:none;
	position:fixed;
	z-index:999;
	bottom:5px;
	right:5px;
	width:50px;
	height:50px;
	line-height:50px;
	background:#0078BF;
	color:#fff;
	text-align:center;
}
.to_top:hover{
	cursor:pointer;
	background:rgba(0,0,0,0.5);
}


/* Browser Upgrade notification*/
.browserupgrade{
	display:block;
	padding:10px 20px;
	margin:0;
	background:#dd0000;
	color:#ddd;
	text-align:center;
}
.browserupgrade a{
	color:#fff;
	font-weight:700;
}



/* Social icons */
.social{
	display:inline-block;
	width:40px;
	height:40px;
	text-align:center;
	line-height:40px;
	background:#fff;
	color:#000;
	margin:5px 1px 0 1px;
	border-radius:50%;
	transition: all 0.3s ease;
}
.social:hover{
	border-radius:0;
	color:#fff;
	background:#333;
	transition: all 0.3s ease;
}


/* PAGINATION */
.pagination{
	display:block;
	margin:30px 0;
	text-align:center;
}
.pagination a{
	display:inline-block;
	line-height:34px;
	padding:0 12px;
	text-align:center;
	color:#555;
	border:1px solid #ccc;
	border-radius:2px;
}
.pagination a:hover{
	color:#fff;
	background:#333;
	border-color:#333;
	cursor:pointer;
}
.pagination a.current{
	color:#fff;
	background:#0078BF;
	border-color:#0078BF;
}


/* FORMS */
input[type="text"],
textarea, select{
	display:block;
	width:100%;
	padding:0 2%;
	margin:12px 0;
	line-height:34px;
	background:#eee;
	border:none;
}


input[type="text"]:focus,
textarea:focus,
select:focus{
	outline:none;
	background:#CCC;
}
input[type="text"]:disabled,
textarea:disabled{
	outline:none;
	background:#eee;
}
button.submit{
	border:none;
	background:#0078BF;
	color:#fff;
	font-size:13px;
	font-weight:300;
	text-transform:uppercase;
	line-height:40px;
	padding:0 15px;
}
button.submit.full{
	width:100%;
}


/* ALERT */
.alert{
	display:block;
	color:#fff;
	padding:20px;
}
.alert.alert-success{
	background:#4e9a06;
}
.alert.alert-error{
	background:#a40000;
}

/* GOOGLE MAP */

iframe { 

  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter ….3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
	filter: grayscale(100%);
   -webkit-filter: grayscale(100%);
   -webkit-transition: all .6s ease;

  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
   filter: gray; /* IE 6-9 */
}









