/*-- Some common issue --*/
@white: #fff;
@link_color: #07AD87;
@transparent_linkcolor: rgba(7, 173, 135, 0.7);

/*-- subtitle --*/
.common_subtitle{
    padding-bottom: 25px;
}

/*-- heading --*/
.common_main_heading {
    margin: 20px 0 10px;
    text-transform: uppercase;
}

/*--- Common carousel style ---*/
.carousel-control.right,
.carousel-control.left{
    i{
        color: #fff;
        font-size: 25px;
        text-shadow: none;
    }
    background: @link_color;
    right: -25px;
    left: auto;
    height: 40px;
    width: 40px;
    line-height: 42px;
}
.carousel-control.right{
    top: 40px;
}
.carousel-control{
    opacity: .75;
    filter: alpha(opacity=50);
}


/********************* main footer area style *********************************/
#footer{
    /*-- widget stye --*/
    h3.widget-title{
        span{
            color: @white;                
            font-size: 20px;      
         }
         padding: 10px 0px 20px;
         margin: 10px 0px 20px;
     }
    
     ul.footer-addres{
         li{
             i{
                 color: @white;
                 padding-right: 5px;
             }
             a{
                 color: @link_color;
             }
            color: @white; 
            padding-bottom: 20px;
            font-size: 13px;
         }
     } 
     
    p{
        color: @white;
        padding: 10px 0px 7px 0px;
        line-height: 22px;
        font-size: 14px;
        font-weight: 500;
    }
    
    .widget{        
        /*-- Tag cloud style for footer --*/
        .tagcloud{
            a{
                &:hover{
                    background: darken(@link_color, 5%);
                }
                color: @white !important;
                padding: 8px 20px;
                background: @link_color;
                font-size: 14px !important;
                line-height: 42px;
                margin-right: 4px;
                font-weight: 200;
                transition: all 700ms;
            }
        }
        
        /*-- Flickr gallery --*/
        #flickr {
            img{
                border-radius: (4px);
                border: 0px;
                height: 60px;
                width: 80px;
                margin-bottom: 0px;
            }
            text-align: inherit;
        }
        
        color: @white;
    }
    
    /*-- footer social icon list --*/
    ul.footer-social{
        li{
            a{
                i{
                   color: @link_color; 
                   font-size: 19px; 
                }
            }
        }
        padding-top: 10px;
    }
    
    /*-- section style --*/
    background: #000 url('../images/footer.png') repeat;
    padding: 40px 0px;
    width: 100%;
    color: @white;    
}

/*-- bottom footer area style --*/
#bottom-footer{
    p{
        color: @white
    }
    
    /*-- footer area style --*/
    ul.footer-menu{
        li{
            a{
                &::after{
                    content: "/";
                    padding: 0px 2px 0px 5px;
                    color: @white;
                }
                color: @link_color;
                text-transform: uppercase;
            }
            &:last-child{
                a{
                   &::after{
                      content: "";
                  }  
                }
            }
            padding: 0;
        }
        float: right;
    }
    
    /*-- section style --*/
    background-color: #272727;
    border-top: 2px solid @link_color;
    padding: 20px 0;
    font-size: 14px;
    font-weight: 200;
    color: @white;
}

/******************************** End of the footer section *******************/

/****************************** Testimonial ***********************************/
.testimonial {
    background: url("../images/bg2.png") no-repeat scroll center center / 100% 100% #A4AA8C;
    color: #FFFFFF;
    padding: 50px 0;
}

.carousel-indicators{
    li {
        background-color: #FFFFFF;     
        margin: 1px 4px;       
    }
    li.active {
        background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
        border: 2px solid #FFFFFF;
        height: 13px;
        width: 13px;
        margin: 1px 2px 0px;
    }
    bottom: -20px;
    font-size: 14px;
    line-height: 20px;
}
.carousel.carousel-fade .item {
    opacity: 0;
    transition: opacity 0.5s ease-in-out 0s;
}
.carousel.carousel-fade .active.item {
    opacity: 1;
}
.client-image {
    img{
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        height: 130px;
    }
    border: 4px solid #F9F9F9;
    height: 144px;
    margin-bottom: 20px;
    margin-top: 20px;
    padding: 3px;
    width: 140px;
}

.rms_caption {
    bottom: inherit;
    left: 24%;
    text-align: left;
	color: #FFFFFF;
	padding-top: 20px;
	position: absolute;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
	z-index: 10;
}
.rms_caption i {
    font-size: 35px;
    color: #fff;
}
.rms_caption p {
    color:#fff;
    line-height: 22px;
    padding-top: 10px;
}
.rms_caption ul.client-description {
    line-height: 22px;
    padding-left: 10%;
    padding-top: 10px;
}
ul.client-description li{
    color: #fff;
}
.rms_caption ul.client-description li:last-child {
    padding-left: 25px;
}

/*********************** End of Testimonial **********************************/

/*********************** Recent blog post shortcode **************************/
/****************************Recent Blog*****************************/
#blog-upadet {
    padding: 25px 0;
}
.heading h2 {
    font-weight: 100;
    padding-bottom: 20px;
    text-transform: uppercase;
}
.thumbnail {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: 0 none;
    padding: 0;
    position: relative;
}
.blog-image {
	position: relative;
	transition: all 700ms;
	.blog-image-hover {
		background: none repeat scroll 0 0 rgba(7, 173, 135, 0.7);
		left: 0;
		position: absolute;
		text-align: center;
		width: 100%;
		display: none;
		height: 100%;
	}
	&:after{
		border-left: 8px solid rgba(0, 0, 0, 0);
		border-right: 8px solid rgba(0, 0, 0, 0);
		border-top: 10px solid #07AD87;
		left: 48%;
		position: absolute;
		content: "";
	}
}
.blog-image .date {
    background-color: #07AD87;
    color: #FFFFFF;
    line-height: 25px;
    padding: 5px 15px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    z-index: 10;
}
.blog-image .date ul li{
    color: #fff;
	font-family: PT Sans;
	&:first-child{
		font-weight: 700;
	}
	&:last-child{
		font-size: 12px;
	}
}
.down-arrow {
    border-left: 8px solid rgba(0, 0, 0, 0);
    border-right: 8px solid rgba(0, 0, 0, 0);
    border-top: 10px solid #07AD87;
    bottom: -10px;
    left: 48%;
    position: absolute;
}
.thumbnail .caption {
    background: none repeat scroll 0 0 #F8F8F8;
    color: #333333;
    margin-top: 10px;
    padding: 15px;
}
.thumbnail .caption p {
    color: #747474;
    line-height: 22px;
}
.thumbnail .caption p a {
    color: #606060;
}
.blog-image img {
  border-bottom: 5px solid #07AD87;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  transition: all 0.5s ease 0s;
  width: 100%;
}

/*********************** End of the Recent blog post shortcode ***************/

/*********************** Pricing table ***************/

.price_table{
    .price_head,
    .price_amount,
    .price_data,
    .price_footer{
        text-align: center;
        color: #757575;
        font-weight: 100;
        font-size: 13px;
        border: 0px;
    }
    .price_head{
        background: @link_color;
        color: #ffffff;
        padding: 20px 0px;
        font-weight: 500;
        font-size: 22px;
    }
    .price_amount{
        .price_text{
            span{
                color: #ffffff;      
                text-transform: uppercase;
            }
            span.amounta{
                font-size: 25px;
                font-weight: 400;
                padding-bottom: 5px;
            }
            width: 81px;
            height: 81px;
            margin: 0 auto;
            padding: 20px 15px;
            background: #07ad87;
            border-radius: 100%;
            -webkit-border-radius: 100%;
            -moz-border-radius: 100%;
            -o-border-radius: 100%;
            -ms-border-radius: 100%;
        }
        background: #4F4F4F;
        padding: 20px 0px;
    }
    .price_data{
        padding: 10px 0px;
        border-bottom: 1px solid #D8D8D8;
    }
    .price_footer{
        a{	
			-webkit-transition: all 500ms ease 0s;
			-moz-transition: all 500ms ease 0s;
			-o-transition: all 500ms ease 0s;
			transition: all 500ms ease 0s;
            &:hover{
                background: #ffffff !important;
                color: #07ad87 !important;
				-webkit-transition: all 500ms ease 0s;
				-moz-transition: all 500ms ease 0s;
				-o-transition: all 500ms ease 0s;
				transition: all 500ms ease 0s;
            }
            color: #ffffff;
            background: #07ad87;
            padding: 10px 30px;
            transition: all 700ms;
            -o-transition: all 700ms;
            -moz-transition: all 700ms;
            -webkit-transition: all 700ms;
        }
        background: #4F4F4F;
        padding: 40px 0px;
    }
    background: #ffffff;
    border: 0px;
	margin-bottom: 30px;
	-webkit-transition: all 700ms ease 0s;
	-moz-transition: all 700ms ease 0s;
	-o-transition: all 700ms ease 0s;
	transition: all 700ms ease 0s;
	opacity: .85;
	&:hover{
		-webkit-transform: scale(1.1, 1.1);
		-moz-transform: scale(1.1, 1.1);
		-o-transform: scale(1.1, 1.1);
		transform: scale(1.1, 1.1);
		-webkit-transition: all 700ms ease 0s;
		-moz-transition: all 700ms ease 0s;
		-o-transition: all 700ms ease 0s;
		transition: all 700ms ease 0s;
		opacity: 1;
	}
}

/*********************** End of the Pricing table ***************/

/*********************** Client logo slider ***************/
.client_slider{
    .carousel{
        .single_client{
            img{
                display: block;
                margin: 0 auto;
            }
            background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
            display: inline-block;
            margin: 0px 5px;
        }
    }
}

/*********************** End of the Client logo slider ***************/

/*********************** Client logo slider **************************/

/*-- for video --*/
video{
    position: absolute;
    width: 100%;
    z-index: -999;
    top: 0;
    left: 0;
}

/*-- Client logo slider --*/
ul.clients-logo{
    li{
        display: inline-block;
        padding: 5px;
        img{
            background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
        }
    }
}

/*-- Client logo slider --*/
.client_slider{
    .carousel-inner{
       left: 10px;
    }
    .carousel-control.right,
    .carousel-control.left{
        right: -15px;
    }
    padding: 50px 0;
}
/****************** End of the Client logo slider ********************/


/****************** Work portfolio ********************/
.work_portfolio_menu{
    ul{
        margin-left: 15px;
        margin-bottom: 20px;
        display: inline-block;
        li.filter{
                display: inline;
                float: left;
                padding: 10px 25px;
                border: 2px solid @link_color;
                margin-bottom: 15px;
                margin-right: 10px;
                font-weight: 600;
                background: none;
                text-transform: uppercase;
                transition: all 700ms;
                position: relative;
                a{
                    text-decoration: none;
                    color: #a2a2a2;
                }
            &:hover{
                background: @link_color;					
                 &:after{
                    position: absolute;
                    content: "";
                    border-width: 8px 8px 0px;
                    border-color: @link_color transparent transparent;
                    border-style: solid;
                    height: 0px;
                    width: 0px;
                    left: 0;
                    right: 0;
                    bottom: -10px;
                    margin: 0 auto;
                }
                a{
                    color: @white;
					&:hover{
						color: @white;					
					}
                }
            }                
        }
        li.active{
                position: relative;
                background: @link_color;
                &:after{
                    position: absolute;
                    content: "";
                    border-width: 8px 8px 0px;
                    border-color: @link_color transparent transparent;
                    border-style: solid;
                    height: 0px;
                    width: 0px;
                    left: 0;
                    right: 0;
                    bottom: -10px;
                    margin: 0 auto;
                }
                a{
                    color: @white;
					&:hover{
						color: @white;					
					}					
                }
        }
    }
}

.recent-work-item{
	margin-bottom: 30px;
    position: relative;
    overflow: hidden;
    img{
        position: relative;
        height: auto;
		width: 100%;
    }
    .recent-work-item-hover{
        position: absolute;
        top: -100%;
        left: 0;
        width: 100%;
        height: 98.5%;
        text-align: center;
        transition: all 700ms;
        background: @transparent_linkcolor;
        h1{
            font-size: 25px;
            padding: 25px 10px 10px;
            color: #fff;
        }
        button{
            letter-spacing: 2px;
            color: @white;
            border: 1px solid @white;
            box-shadow: 0 0 1px #000;
            background: transparent;
            padding: 4px 15px;
            font-weight: 500;
            border-radius: 0px;
        }
    }
    .recent-work-item-hover-btn{
        background: #4f4f4f;
        text-align: center;
        bottom: -50%;
        left: 0;
        width: 100%;
        position: absolute;
        transition: all 700ms;
        a{
            margin: 0 1px;
            i{
                color: @white;
                font-size: 22px;
                font-weight: inherit;
                padding: 13px 14px;
                transition: all 500ms;
            }
            i.fa-link{
                transform:rotate(90deg);
                -ms-transform:rotate(90deg); /* IE 9 */
                -moz-transform:rotate(90deg); /* IE 9 */
                -webkit-transform:rotate(90deg); /* Opera, Chrome, and Safari */
            }
            &:hover{
                i{
                    background: @link_color;
                }
            }
        }
    }
    &:hover{
        .recent-work-item-hover{
            top: 0;
        }       
        .recent-work-item-hover-btn{
            bottom: 10%;
        }
    }
}
/****************** End of the workportfolio ********************/
       
/*-- Team member --*/
.team-details{
    text-align: center;
    border-radius: 5px;
    background: @white;
    padding: 30px 15px;
    margin-bottom: 30px;
    > div img{
        border: 7px solid @link_color;
        border-radius: 50%;
    }
    .team-detail-title{
        h2{
            font-size: 18px;
            font-weight: 200;
            margin: 20px 0 5px;
        }
        p{
            font-size: 14px;
            line-height: 20px;
        }
    }
    .team-details-social {
        margin-top: 30px;
        padding-bottom: 20px;
        a{
            padding: 13px 20px 10px 20px;
            margin-right: -4px;
            background: @link_color;
            &:hover{
                background: darken(@link_color, 20%);
            }
            i{
                color: @white;
                font-size: 20px;
            }
        }
    }
}


/*-- some shop fixing --*/
.woocommerce .woocommerce-message,
.woocommerce-page .woocommerce-message {
	border-top: 3px solid @link_color;
	&:before{
		background: @link_color;
		padding-top: 0;
	}
}

.woocommerce #content input.button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce-page #content input.button,
.woocommerce-page #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button{
	color: @white;
	text-shadow: none;
	font-weight: 500;
	border-radius: 0;
	box-shadow: none;
	border: 1px solid @link_color;
	background: @link_color;

}


/*---- Contact page -----*/
.contact-info{
	color: #545454;
	h2{
		margin: 0;
		padding-bottom: 30px;
	}
	> div{
		p{
			padding-bottom: 5px;
		}
		address{
			font-size: 15px;
			line-height: 25px;
		}
		text-transform: uppercase;
		width: 50%;
		float: left;
		margin-bottom: 25px;
	}
}


form.wpcf7-form{
	.contact_form{
		.wpcf7-form-control-wrap{
			width: 31.1%;
			display: inline-block;
			margin-right: 20px;
			margin-bottom: 15px;
			input[type="email"],
			input[type="text"]{
				width: 100%; 
				float: left;
				border: 1px solid #07AD87;
				border-radius: 0px;
				height: 34px;
				padding: 6px 12px;
				font-size: 14px;
			}
			&:last-child{
				margin-right: 0;
			}
		}
	}
	.text_area{
		.wpcf7-form-control-wrap{
			width: 100%;
			display: block;		
			textarea{
				width: 100%; 
				float: left;
				border-radius: 0px;
				resize: none;
				margin-bottom: 20px;
				border: 1px solid #07AD87;
			}
		}	
	}
	.submit_text{
		input[type="submit"]{
			background: @link_color url('../images/contact-bottom-icon.png') no-repeat 10px center;
			color: @white;
			float: right;
			padding: 8px 15px 8px 40px;
			border-radius: 0px;
			line-height: 2em;
			font-weight: 400;
			letter-spacing: .5px;
			border: 1px solid #07AD87;
		}
	}
	p{
		input.wpcf7-form-control.wpcf7-submit{
			background: none repeat scroll 0 0 #07AD87;
			margin-top: 30px;
			padding: 5px 35px;
		}
	}
	input,textarea{
		border: 1px solid #07AD87;
		resize: none;
	}
}


/******* Terms page **********/
.terms{
	.common_main_heading{
		padding-bottom: 30px;
	}
	.common_subtitle{
		padding-bottom: 10px;
	}
}