/*------------------------------------------------------------------

	Theme:			Keyla
	Description: 	Responsive Business Theme
	Version:		1.0
	Designed By:	Klassio

-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[Navbar]
*/


body, content .inner {background: #ccc;}
.navbar .nav > li.active > a,
.navbar .nav > li.active > a:hover {
	color: #fe8a02;
}

.navbar .nav > li > a {
	color: #FFF;	
    text-shadow: 1px 1px 2px rgba(0,0,0,.7);
}

.navbar .nav > li > a:hover {
	color: #bbb;
}

.navbar .btn-navbar {
	margin-top: 3px;
	padding: 15px;
	background:#ff9600;
}
	
.nav-collapse{
	background:rgba(0, 0, 0, .7);
	border-radius:5px;
	margin-right:5px;
	margin-left:10px;
}

/*------------------------------------------------------------------
[#. Header Image & Title / #heading-wrapper]
*/

h1.title, h2.title{
	font-weight:400;
	margin-bottom:20px;
	float:left;
	width:100%;
}

h1.title{
	font-size:32px;
	line-height:90px !important;
}

h2.title{
	font-size:36px;
	line-height:80px !important;
}

#heading-wrapper small{
	line-height:0px;	
}

#heading-wrapper, .hs-container {
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	margin:0 auto;
	overflow:hidden;
}
#heading-wrapper {
	min-height:100px;
	z-index:0;
	margin-bottom:40px;
	border-bottom:3px solid #444;
	box-shadow:0px 0px 5px rgba(0,0,0,0.4);
	/*font-family: "Kreon";*/
}

#heading-wrapper.heading-image .hs-content {
	margin-top:94px;
}

#heading-wrapper.heading-image .center h1{
	text-align:center;
}

#heading-wrapper img{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	z-index: 101;
	display:none;
	max-width:none !important;
}
.hs-loading {
	background:#eee url("../img/bg4.png");
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px; 
    z-index: 1000;
	text-align:center;
}
.hs-loading span{
	position:relative;
	top:65%;
    font-size: 20px;
    color: #000;
	text-shadow:0px 0px 5px rgba(0,0,0,0.4);
	font-weight:800;
}
.outerC{
	position:absolute;
	height:100%;
	width:100%;
	overflow:hidden;
	display: table;
}
.middleC{
	display: table-cell;
	vertical-align: middle;
	width: 100%;
}
.hs-content {
	z-index: 300;
	position:relative;
	display:;
	color:#fff;
}
#heading-wrapper.heading-slider .hs-content {
    text-align:center;	
}
#heading-wrapper .bgc{
	text-shadow:0px 1px 5px rgba(0,0,0,0.4);
	padding-top:45px;
}

.black {
	color:#222;
	text-shadow:0px 1px 5px rgba(0,0,0,0.3) !important;
}

.white {
	color:#fff;
	text-shadow:0px 1px 5px rgba(0,0,0,0.3) !important;
}


.lt-ie10 #heading-wrapper .big {
	box-shadow:none !important;
}
#heading-wrapper .big{
    display: block;
	font-size: 55px;
	line-height:1;
}
#heading-wrapper .text {
	display: block;
	font-size:30px;
	line-height:1;
}
#heading-wrapper a{
    color:#eee;
}
#heading-wrapper a:hover{
	border-bottom:0px;
}


/*------------------------------------------------------------------
[Content]
*/


#content .inner {	
	
	background: #ccc;
}

.thumbnails > li{
	margin-bottom:5px;
}

.dropcap-1{
	background-color: #F89406;
	color: white;
}

.dropcap-2{
	background-color: #222;
	color: #F89406;
}

.dropcap-3{
	background-color: #222;
	color: white;
}

.dropcap-1, .dropcap-2, .dropcap-3 {
display: block;
float: left;
font-size: 35px;
line-height: 35px;
height: 38px;
padding: 0 5px;
margin: 2px 4px 0 0;
text-shadow: 1px 1px 0 #333;
border-radius: 3px;
}

.dropcap-4{
	display: block;
	float: left;
	font-size: 40px;
	line-height: 40px;
	margin: 2px 4px 0 0;
	color: #ff9600;
	text-shadow: 1px 1px 0 #EDEDED;
}

.dropcap-5{
	display: block;
	float: left;
	font-size: 40px;
	line-height: 40px;
	margin: 2px 4px 0 0;
	color: #222;
	text-shadow: 1px 1px 0 #EDEDED;
}

.dropcap-6{
	display: block;
	float: left;
	font-size: 40px;
	line-height: 40px;
	margin: 2px 4px 0 0;
	color: #827b71;
	text-shadow: 1px 1px 0 #EDEDED;
}


/*------------------------------------------------------------------
[Screenshots / #screenshots]
*/	

#screenshots {	
	background: #e5e1d7;	
	border-top: 3px solid #e5e1d7;
}

#screenshots .inner {
	border-top: 1px solid #FFF;
}


/*------------------------------------------------------------------
[Pricing Table / #pricing]
*/	

/*-- Pricing Table Container --*/

.pricingtable-container {
    position: relative;
    float: left;    
    
    margin-bottom: 2em;
}

/*-- Pricing Table --*/

.pricingtable {
    margin-right: 6px;
    
    border-radius: 4px;
}


/*-- Pricing Table Header --*/

.pricingtable-header {
    text-align: center;
    color: #FFF;    
    background-color: #686868;    
    -webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;    
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
}

.greentable{
  background-color: #92c64e;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#92c64e), to(#bae383)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #92c64e, #bae383); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #92c64e, #bae383); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #92c64e, #bae383); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #92c64e, #bae383); /* Firefox 16+, IE10, Opera 12.50+ */
}

.bluetable{
  background-color: #92cbe5;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#92cbe5), to(#c5e2f1)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #92cbe5, #c5e2f1); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #92cbe5, #c5e2f1); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #92cbe5, #c5e2f1); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #92cbe5, #c5e2f1); /* Firefox 16+, IE10, Opera 12.50+ */
}

.turquoisetable{
  background-color: #4fbca9;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#4fbca9), to(#b0e1d9)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #4fbca9, #b0e1d9); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #4fbca9, #b0e1d9); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #4fbca9, #b0e1d9); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #4fbca9, #b0e1d9); /* Firefox 16+, IE10, Opera 12.50+ */
}

.greytable{
  background-color: #666666;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#bfbfbf)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #666666, #bfbfbf); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #666666, #bfbfbf); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #666666, #bfbfbf); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #666666, #bfbfbf); /* Firefox 16+, IE10, Opera 12.50+ */
}

.pricingtable-title {
    padding: 10px 0;    
	font-size: 16px;
    color: #FFF;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);    
    border-radius: 4px 4px 0 0;
}

.pricingtable-price {
	padding: 20px 0 10px;	
    font-size: 66px;
    line-height: 0.8em;    
	background-color: #797979;	
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.pricingtable-price span.term {
    display: block;
    margin-bottom: 0;    
    font-size: 13px;
    line-height: 0;
    padding: 2em 0 1em;
}

.pricingtable-price span.note {
	position: relative;
	top: -40px;	
	display: inline;	
    font-size: 17px;
    line-height: 0.8em;
}

/*-- Pricing Table Features --*/

.pricingtable-features {
	border: 1px solid #DDD;	
	border-bottom: none;
}

.pricingtable-features {
	padding-bottom: 1em;
}

.pricingtable-features ul {
	padding: 0;
	margin: 0;
	
	list-style: none;
}

.pricingtable-features li {	
	padding: 1em 0;
	margin: 0 2em;
	
	text-align: center;
	
	border-bottom: 1px dotted #CCC;
}

.pricingtable-features li:last-child {
	border-bottom: none;
}


/*-- Pricing Table Actions --*/

.pricingtable-actions {
	padding: 1.15em 0;	
	background: #F2F2F2;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
	border-color: #E6E6E6 #E6E6E6 #BFBFBF;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:dximagetransform.microsoft.gradient(enabled=false);	
	border: 1px solid #DDD;	
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}

.pricingtable-actions .btn {
	padding: 1em 0;
	margin: 0 2em;	
	display: block;	
	font-size: 16px;
	font-weight: 600;
}

.mostpopular {
	margin-top: -15px;
}

/*-- Columns --*/

.pricing-plans.plans-1 .pricingtable-container {
    width: 100%;
}
.pricing-plans.plans-2 .pricingtable-container {
    width: 50%;
}

.pricing-plans.plans-3 .pricingtable-container {
    width: 33.33%;
}

.pricing-plans.plans-4 .pricingtable-container {
    width: 25%;
}





/*------------------------------------------------------------------
[Thumbnail Hover]
*/
.view-sixth img {
   -webkit-transition: all 0.4s ease-in-out 0.5s;
   -moz-transition: all 0.4s ease-in-out 0.5s;
   -o-transition: all 0.4s ease-in-out 0.5s;
   -ms-transition: all 0.4s ease-in-out 0.5s;
   transition: all 0.4s ease-in-out 0.5s;
}
.view-sixth .mask {
  
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-in 0.4s;
   -moz-transition: all 0.3s ease-in 0.4s;
   -o-transition: all 0.3s ease-in 0.4s;
   -ms-transition: all 0.3s ease-in 0.4s;
   transition: all 0.3s ease-in 0.4s;
}
.view-sixth h2 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   border-bottom: 1px solid rgba(0, 0, 0, 0.3);
   background: transparent;
   margin: 20px 40px 0px 40px;
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -webkit-transition: all 0.3s ease-in-out 0.1s;
   -moz-transition: all 0.3s ease-in-out 0.1s;
   -o-transition: all 0.3s ease-in-out 0.1s;
   -ms-transition: all 0.3s ease-in-out 0.1s;
   transition: all 0.3s ease-in-out 0.1s;
}
.view-sixth p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -webkit-transition: all 0.3s ease-in-out 0.2s;
   -moz-transition: all 0.3s ease-in-out 0.2s;
   -o-transition: all 0.3s ease-in-out 0.2s;
   -ms-transition: all 0.3s ease-in-out 0.2s;
   transition: all 0.3s ease-in-out 0.2s;
}
.view-sixth a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -webkit-transition: all 0.3s ease-in-out 0.1s;
   -moz-transition: all 0.3s ease-in-out 0.1s;
   -o-transition: all 0.3s ease-in-out 0.1s;
   -ms-transition: all 0.3s ease-in-out 0.1s;
   transition: all 0.3s ease-in-out 0.1s;
}
.view-sixth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth:hover img {
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
   opacity:0.6;   
}
.view-sixth:hover h2 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.view-sixth:hover p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
.view-sixth:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.3s;
   -moz-transition-delay: 0.3s;
   -o-transition-delay: 0.3s;
   -ms-transition-delay: 0.3s;
   transition-delay: 0.3s;
}
 
.view {
   position: relative;
   text-align: center;  
   cursor: default;
}
.view .mask,.view .content {
   margin: 0px;
   max-width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
   overflow: hidden;
}
.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
   background: #222;
   background: rgba(0, 0, 0, 0.8);
   margin: 20px 0 0 0;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 13px;
   position: relative;
   color: #000;
   padding: 5px 15px 5px;
   text-align: center;
   background: #eee;
   background: rgba(255,255,255, 0.6);
   margin-bottom:5px;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
   border-radius:10px;   
}
.view a.info:hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}


/*------------------------------------------------------------------
[Subheader]
*/

#subheader {
	color: #EEE;
	
	background: #444;
	
	border-color: #556828;
}

#subheader .inner {
	background: #81994D url(./img/header-bg.png) repeat 0 0;
	
}

/*------------------------------------------------------------------
[Extra]
*/

#extra {	
	border-top: 1px solid #000;
}

#extra .inner {	
	color: #fff;
	
	background-color: #222;
	
	border-top: 1px solid #555;
}



/*------------------------------------------------------------------
[Footer]
*/

#footer {
	border-top: 1px solid #000;
}

#footer .inner {		
	background: #111;
	
	border-top: 1px solid #222;	
}

.footer-links a {
	color: #777;
}



/*------------------------------------------------------------------
[Miscellaneous]
*/

.circle-icon {	
	
	background: #393939;
}

.circle-icon div {	
	color: #fe8a02;	
}

.slash {
	color: #677E30;
}

.sidebar {
	
	background: #EEE;
}



.nav-list > li.active > a,
.nav-list > li.active > a:hover {		
	color: #FFF;	
	background: #fe8a02;
}