/*
Author       : Belal Hoossain
Template Name: Formula - Material Design Agency Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. START GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. START HEADER DESIGN
    03. START HOME DESIGN
    04. START ABOUT DESIGN
    05. START SERVICE DESIGN
    06. START PORTFOLIO DESIGN
	07. START COUNTER DESIGN
    08. START TEAM DESIGN
    09. START PRICING TABLE DESIGN
    10. START TESTIMONIAL DESIGN
    11. START BLOG DESIGN
    12. START CONTACT DESIGN
    13. START FOOTER DESIGN
    14. START COPYRIGHT DESIGN
  =============================================================*/
  
/*
* ----------------------------------------------------------------------------------------
* 01. START GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body{
	font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    color: #555;
    line-height: 28px;
    font-weight: 400;
	margin: 0;
	padding: 0;
    background: #ffffff;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6{
	font-family: 'Montserrat', sans-serif;
    padding: 0px;
    margin: 0px;
}
p{
	font-size: 14px;
	font-weight: 300;
	color: #888;
	font-family: 'Open Sans', sans-serif;
}
img{
	height: auto;
	max-width: 100%;
}
a:hover,
a:focus{
	outline: none;
	text-decoration: none;
}
ul {
    list-style: none;
    padding: 0;
}
.gray_bg{
	background: #f8f8f8;
}
.white{
	color: #fff !important;
}

/*START PRELOADER DESIGN*/
.preloader {
	background:#fff;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;	
}
.spinner {
	width: 50px;
	height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	font-size: 10px;
	text-indent: -12345px;
	z-index: 10000;
}

.double-bounce1, .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #ffa733;
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}
/* END PRELOADER DESIGN */

/* START BUTTON STYLE */
.main_btn{
	padding: 12px 24px;
	color: #fff;
	font-size: 14px;
	letter-spacing: 0.5px;
    text-transform: capitalize;
	margin-bottom: 30px;
	border-radius: 30px;
	background: #ffa733;
	transition: all 0.2s ease-in-out 0s;
}
.main_btn:hover{
	background: #222;
	color: #fff;
}
/* END BUTTON STYLE */

/* START SECTION-HEADING DESIGN */
.section_padding{
	padding: 100px 0;
}
.section_heading{
	margin-bottom: 50px;
}
.section_heading h2{
	color: #222;
	font-size: 30px;
	font-weight: 600;
	line-height: 30px;
    text-transform: uppercase;
}
.section_heading h2 span{
	color: #ffa733;
}
.section_heading p{
	margin: 15px;
}
/* END SECTION-HEADING DESIGN */

/*
* ----------------------------------------------------------------------------------------
* 02. START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.navbar-default{
    border: none;
    border-radius: 0;
    margin-bottom: 0;
    width: 100%;
    padding: 20px 0;
    background: transparent;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus{
    color: #ffa733 !important;
    background-color: transparent;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus{
    color: #ffa733 !important;
    background-color: transparent;
}
.navbar-brand {padding: 0px}
.navbar-brand img {margin-left:10px;}
.navbar-default .navbar-collapse, .navbar-default .navbar-form{
  border-color: #fff;
}
.menu-top{background: rgba(0, 0, 0, 0) none repeat scroll 0 0}
.menu-top li a{
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
	transition: 0.5s;
}
.navbar-default.menu-shrink{
    background: #ffa733;
    box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
    padding: 10px 0;
    width: 100%;
}
.navbar-default.menu-shrink li a{color: #fff!important}
.navbar-default .navbar-toggle{background: #fff none repeat scroll 0 0}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus{background: #fff none repeat scroll 0 0;}
.navbar-default .navbar-toggle .icon-bar{background-color: #ffa733}
/*
* ----------------------------------------------------------------------------------------
* END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/

/* START HEADER */
#header-area {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	margin-bottom: 0;
	padding: 10px 0;
	border-color: transparent;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;	
}
.navbar-brand{
	height: auto;
	padding: 0;
}
.navbar-brand p{
	color: #fff;
	font-weight: 600;
	font-size: 30px;
	text-transform: uppercase;
	margin: 15px 0px 0px 13px;
}
.menu_iteam li{
	color: #fff;
}
.menu_iteam li a{
	font-size: 14.3px;
	font-weight: 500;
	text-transform: uppercase;
	transition: 0.5s;
	font-family: 'Poppins', sans-serif;
}
.navbar-nav{
	border-color: none;
}
.navbar-default .navbar-nav > li > a{
	color: #fff;
}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover,
#nav li.current a {
	background-color: transparent;
}
/* END HEADER */

/*
* ----------------------------------------------------------------------------------------
* START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
.welcome-area,
.welcome-slider-area,
.welcome-slider-area div{
    height: 700px;
}
.welcome-slider-area div.single-slide-item-tablecell,
.welcome-slider-area div.single-slide-item-tablecell div{
    height: auto;
}
.single-slide-item-table{
    display: table;
    text-align: center;
    width: 100%;
}
.single-slide-item-tablecell{
    display: table-cell;
    vertical-align: middle;
}
.single-slide-item{
    position: relative;
    z-index: 1;
}
.single-slide-item:after{
    position: absolute;
    background: rgba(0, 0, 0, 0.7);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1;
}
.carousel-fade .carousel-inner .item{
    -webkit-transition-property: opacity;
    transition-property: opacity;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right{
    opacity: 1;
    filter: alpha(opacity=0);
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right{
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right{
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.single-slide-item h1{
	color: #fff;
	font-size: 60px;
	font-weight: 700;
	margin-bottom: 20px;
	margin-top: -10px;
	text-transform: uppercase;
	line-height: 50px;
}
.single-slide-item span{
	color: #ffa733;
}
.single-slide-item p{
	color: #fff;
	font-size: 15px;
	font-weight: 300;
	text-transform: capitalize;
}
.single_slide_item_button{
	position: absolute;
	z-index: 5;
	margin: 0 auto;
	margin-top: 0px;
	margin-top: 50px;
	left: 0;
	right: 0;
}
.single-slide-item .slider_btn{
	background: transparent;
	border: 2px solid #ffa733;
	margin: 0 10px;
	margin-bottom: 30px;
	border-radius: 30px;
	color: #fff;
	font-size: 13px;
	padding: 14px 30px;
	text-transform: uppercase;
	font-weight: 400;
	letter-spacing: 1px;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.2s ease 0s;
}
.single-slide-item .slider_btn:hover{
	color: #fff;
	background: #ffa733; 
	border-color: #ffa733;
	text-decoration: none;
}
.carousel-control{
	z-index: 1;
	background-image: none !important;
	top: 46.6%;
	width: 50px;
	height: 50px;
	line-height: 46px;
	border: 1px solid #fff;
	opacity: 1;
	color: #fff;
	font-size: 20px;
	font-weight: 400;
}
#welcome-slide-carousel .carousel-indicators li{
	width: 15px;
	height: 15px;
	margin: 0 5px;
}
#welcome-slide-carousel .carousel-indicators .active{
	background: #ffa733;
	border-color: #ffa733;
	color: #fff;
}
.carousel-control.left{
	margin-left: 25px;
	border-radius: 30px;
}
.carousel-control.right{
	margin-right: 25px;
	border-radius: 30px;
}
.carousel-control:hover{
	background: #ffa733;
	border-color: #ffa733;
}
.carousel-fade .carousel-inner .item{
    -webkit-transition-property: opacity;
    transition-property: opacity;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right{
    opacity: 0;
    filter: alpha(opacity=0);
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right{
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right{
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
/*
* ----------------------------------------------------------------------------------------
* END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/

/* START ABOUT US */
.about_content{
	padding: 10px 10px;
    text-align: center;
	transition: all 0.3s ease 0s;
	box-shadow: 0 0 8px 0 rgba(255, 167, 51, 0.3);
}
.about_content:hover{
	background: #ffa733;
	color: #fff;
	box-shadow: none;
}
.about_content:hover p{
	color: #fff;
}
.about_icon{
	width: 60px;
	height: 60px;
	font-size: 35px;
	line-height: 60px;
	margin-top: 0px;
	background: transparent;
	color: #ffa733;
	display: inline-block;
}
.about_icon i{
	border: 1px solid #ddd;
	background: #fff;
	border-radius: 50%;
	display: inline-block;
	font-size: 25px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	text-decoration: none;
	transition: all 0.3s ease 0s;
	width: 50px;
}
.about_content:hover i{
	background: #fff;
	color: #ffa733;
}
.about_content h3{
	font-weight: 700;
	letter-spacing: 1px;
	font-size: 20px;
	margin-top: 15px;
}
.about_content:hover h3{
	color: #fff;
}
.about_content p{
	font-size: 15px;
    line-height: 25px;
    margin-top: 15px;
}
/* END ABOUT US */

/* START SERVICE */
#service {
    background-image: url(../images/service-bg.jpg);
	background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 1;
}
#service:after{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	position: absolute;
	background: rgba(0, 0, 0, 0.7);
	z-index: -1;
}
.serviceBox{
	margin-top: 20px;
    text-align: center;
    border: 1px solid #fff;
    position: relative;
    padding-bottom: 30px;
    margin-bottom: 30px;
    transition: all 0.3s ease 0s;
}
.serviceBox:hover{
	background: #ffa733;
	border: 1px solid #ffa733;
} 
.serviceBox .service-icon{
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 50%;
	background: #ffa733;
    border: 1px solid #ffa733;
    margin: -40px 0px 20px;
    font-size: 30px;
    color: #fff;
	transition: all 0.3s ease 0s;
}
.serviceBox:hover i{
	background: #fff;
	border: 1px solid #fff;
	color: #ffa733;
}
.serviceBox .title{
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    margin: 0 0 20px 0;
    transition: all 0.3s ease 0s;
}
.serviceBox .description{
    font-size: 14px;
    color: #fff;
    line-height: 25px;
    margin: 5px;
    transition: all 0.3s ease 0s;
}
/* END SERVICE */

/* START PORTFOLIO */
.portfolio_filter{
	text-align: center;
}
.portfolio_filter ul{
	padding: 0;
	list-style: none;
	margin-bottom: 30px;
}
.portfolio_filter ul li{
    font-weight: 600;
    text-transform: capitalize;
    display: inline-block;
    cursor: pointer;
    border: 1px solid #ddd;
    font-size: 13px;
    padding: 8px 20px;
    letter-spacing: 1px;
    margin: 0 7px 15px;
    transition: all 0.5s ease-in-out;
}
.portfolio_filter ul li:hover{
	background: #ffa733;
	border: 1px solid #ffa733;
	color: #fff;
}
.portfolio_filter .filter.active{
    color: #fff;
    background: #ffa733;
}
.mix{
	display: none;
}
.box{
    text-align: center;
    position: relative;
	margin-bottom: 30px;
}
.box img{
    max-width: 100%;
    height: auto;
}
.box .box-content{
    padding-top: 25%;
    background: rgba(255, 167, 51, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    transform: scaleY(0);
    transition: all 0.5s ease 0s;
}
.box:hover .box-content{
    opacity: 1;
    transform: scaleY(1);
}
.box .title{
    font-size: 22px;
    font-weight: 600;
    color: #fff;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 0 0 10px;
}
.box .icon{
    padding: 10px;
    margin: 0;
    list-style: none;
}
.box .icon li{display: inline-block;}
.box .icon li a{
    display: block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
	border-radius: 50%;
    color: #fff;
    margin-right: 5px;
    position: relative;
	transition: all 0.5s ease 0s;
}
.box .icon li a:before{
    content: "";
    width: 40px;
    height: 40px;
	line-height: 40px;
	border-radius: 50%;
    border: 1px solid #fff;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all 0.3s ease 0s;
}
.box .icon li a:hover{
    background: #ffa733;
	color: #fff;
}
/* END PORTFOLIO */

/* START COUNTERUP */
#counterup{
	background: url(../images/counter.jpg) no-repeat fixed;
	background-size: cover;
	position: relative;
	padding-top: 70px;
	padding-bottom: 70px;
}
#counterup:before{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	top: 0;
}
.single_counter{
	color: #fff;
	border: 1px solid #fff;
	transition: all 0.4s ease-in-out;
	margin-bottom: 30px;
	padding: 20px 10px;
}
.single_counter:hover{
	background: #ffa733;
	border: 1px solid #ffa733;
}
.single_counter .counter:after{
    content: "+";
    font-size: 24px;
    padding-left: 3px;
}
.single_counter i{
	font-size: 40px;
	color: #fff;
	margin-bottom: 30px;
	display: block;
	transition: all 0.3s ease-in-out 0s;
}
.single_counter span{
	font-size: 32px;
	font-weight: 600;
	display: block;
	margin-bottom: 25px;
}
.single_counter h4{
    font-weight: 400;
    margin: 0;
    font-size: 18px;
    color: #fff;
}
/* END COUNTERUP */

/* START TEAM */
.our-team .team-content{
    position: relative;
    overflow: hidden;
}
.our-team .team-content img{
    width: 100%;
    height: auto;
    transition: all 0.3s ease 0s;
}
.our-team:hover .team-content img{
    transform: scale(1.2,1.2);
}
.our-team .social-links{
	padding: 0;
	margin: 0;
	list-style: none;
	position: absolute;
	bottom: 0;
	background: #fff;
}
.our-team .social-links li{
    display: inline-block;
    float: left;
}
.our-team .social-links li a{
    padding: 12px 8px;
    color: #ffa733;
    font-size: 17px;
    background: transparent;
    transition: all 0.3s ease 0s;
}
.our-team:hover .social-links li a{
	background: #ffa733;
	color: #fff;
}
.our-team .social-links li a:hover{
    color: #fff;
    text-decoration: none;
}
.team-prof{
    padding: 20px;
    border: 1px solid #ffa733;
    background: #ffa733;
    color: #fff;
}
.our-team .team-prof h3{
	margin-bottom: 5px;
    font-size: 16px;
    text-align: center;
    text-transform: uppercase;
}
.our-team .team-prof span{
    display: block;
    font-size: 14px;
	text-align: center;
    text-transform: capitalize;
}
/* END TEAM */

/* START BLOG */
.post-slide{
    margin: 0 10px;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
    transition: all 0.4s ease-in-out 0s;
}
.post-slide:hover{
	box-shadow: none;
}
.post-slide .post-img{
    position: relative;
    overflow: hidden;
}
.post-slide .post-img:before{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.4s linear 0s;
}
.post-slide:hover .post-img:before{
    background: rgba(255, 167, 51, 0.6);
}
.post-slide .post-img img{
    width: 100%;
    height: auto;
}
.post-slide .category{
    width: 20%;
    font-size: 16px;
    color: #fff;
    line-height: 11px;
    text-align: center;
    text-transform: capitalize;
    padding: 11px 0;
    background: #ffa733;
    position: absolute;
    bottom: 0;
    left: -50%;
    transition: all 0.4s ease 0s;
}
.post-slide:hover .category{
    left: 0;
}
.post-slide .post-review{
    padding: 20px 20px;
    background: #fff;
    position: relative;
}
.post-slide .post-title{
    margin: 0;
}
.post-slide .post-title a{
    display: inline-block;
    font-size: 20px;
    color: #555;
    font-weight: bold;
    text-transform: capitalize;
    margin-bottom: 12px;
    transition: all 0.4s ease 0s;
}
.post-slide .post-title a:hover{
    text-decoration: none;
    color: #ffa733;
}
.post-slide .post-description{
    font-size: 15px;
    line-height: 25px;
}
.post-review .post-bar{
    margin-top: 15px;
}
.post-bar span{
    display: inline-block;
    font-size: 14px;
}
.post-bar span i{
    margin-right: 5px;
    color: #555;
}
.post-bar span a{
    color: #555;
	transition: all 0.4s ease 0s;
    text-transform: uppercase;
}
.post-bar span a:hover{
    text-decoration: none;
    color: #ffa733;
}
.post-bar span.comments{
    float: right;
}
/* END BLOG */

/* START CONTACT */
#contact{
	background: url(../images/contact-bg.jpg) no-repeat fixed;
	background-size: cover;
	position: relative;
	z-index: 1;
}
#contact:after{
	background: rgba(0, 54, 107, 0.7);
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	z-index: -1;
}
.contact input[type="text"], 
.contact input[type="email"],
.contact input[type="password"] 
{
	background: transparent;
	border: 1px solid #ddd;
	border-radius: 0;
	box-shadow: none;
	color: #333;
	height: 50px;
	line-height: 50px;
	padding: 10px 15px;
	margin-bottom: 15px;
	opacity: 1;
}
.contact textarea{
	background: transparent;
	border: 1px solid #ddd;
	border-radius: 0;
	box-shadow: none;
	padding: 10px 15px;
	color: #333;
	height: 225px;
	margin-bottom: 15px;
}
.form-group{
	margin-bottom: 20px;	
}
.contact input:focus{
    border-color: #fff;
    box-shadow: none;
    outline: 0 none;
}
.contact textarea:focus{
	border-color: #fff;
    box-shadow: none;
    outline: 0 none;
}
.success{
    background: #fff none repeat scroll 0 0;
    color: #75ceae;
    font-weight: 700;
    padding: 20px;
    text-align: center;
}
.single_contact{
	padding-top: 3px;
	color: #fff;
	margin-left: 70px;
}
.single_contact h4{
	font-size: 26px;
	margin-bottom: 32px;
	margin-top: 0;
	font-weight: 500;
	color: #fff;
}
.single_contact p{
	margin-bottom: 10px;
	letter-spacing: .2px;
	font-size: 14px;
	margin: 0;
	color: #fff;
	margin-bottom: 20px;
	line-height: 20x;
}
.sing_contact_iteam i{
	margin-right: 15px;
	color: #fff;
	width: 45px;
	height: 45px;
	background: #ffa733;
	line-height: 45px;
	text-align: center;
	border-radius: 50%;
}
.single_contact ul{
	list-style: none;
}
#contact-form .actions{
	text-align: center;
    margin-top: 30px;
}
/* END CONTACT */

/* START FOOTER */
.copyright{
	background: #ffa733;
	padding: 12px;
}
.copy_text p {
	color: #fff;
    margin: 0px;
}
/* END FOOTER */

/*START SCROLL TO TOP*/
.scrollup {
    height: 40px;
    width: 40px;
    background: #ffa733;
    text-align: center;
    border-radius: 30px;
	border: 1px solid #ffa733;
    position: fixed;
    right: 15px;
    cursor: pointer;
    bottom: 50px;
    box-shadow: 0 0 10px 1px rgba(255, 167, 51, 0.6);
    z-index: 999;
	transition: all 0.4s ease-in-out;
}
.scrollup i{
	line-height: 35px;
	color: #fff;
	font-size: 24px;
	display: inline-block;
}
/*END SCROLL TO TOP*/