/*************************************

Template Name: Aarong - Personal Portfolio Template
Author: ThemeFusionBD
Version: 1.0
Design and Developed by: ThemeFusionBD

NOTE: This is main stylesheet of the template.

****************************************/


/*================================================
            Table of contents  
==================================================
 
1. BASE CSS
2. PRELOADER
3. SECTION TITLE AND SECTION PADDING
4. INTRO SECTION
    a. HEADER AREA
    b. WELCOME AREA
5. ABOUT SECTION
6. SERVICES SECTION
7. PORTFOLIO SECTION
8. CONTACT INFO SECTION
9. FOOTER SECTION

====================================================
            End table content 
===================================================*/

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700,900');



/************ Base CSS ****************/
.
a:focus { outline: 0 solid }
img {
    max-width: 100%;
    height: auto;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 15px;
    font-weight: 700;
    color: #000;
    letter-spacing: 2px;
}
p{
    color: #666;
}
html,
body { height: 100% }
body {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400;
    position: relative;
    
}
a:hover { text-decoration: none }

/* Remove Chrome Input Field's Unwanted Yellow Background Color */
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}




/****** Preloader ******/
#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#fff;
    z-index:999999999999;
}

#status {
    width:200px;
    height:200px;
    position:absolute;
    left:50%;
    top:50%;
    background-image:url(../images/preloader.gif);
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px;
}

/****** SECTION TITLE AND SECTION PADDING ******/
.section-title {
    text-align: center;
    margin-bottom: 60px;
}

.section-title h2 {
    margin-top: 0;
    font-weight: 700;
    font-size: 42px;
    letter-spacing: 2px;
}
.section-title h2 span {
  display: block;
  font-size: 16px;
  font-style: italic;
  margin-bottom: 5px;
}
.section-padding{
    padding: 80px 0;
}


/*************** INTRO SECTION ******************/
.intro-section{
    height: 100%;
}
.welcome-area{
    position: relative;
    background: url(../images/intro-bg.jpg); /*** intro-section background image ***/
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.welcome-area:after{
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    z-index: -1;
}

#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}


.welcome-table{
    display: table;
    width: 100%;
    height: 100%;
    text-align: center;
}
.welcome-cell{
    display: table-cell;
    vertical-align: middle;
}
.welcome-text{
    
}
.welcome-text h1{
    font-size: 45px;
    color: #fff;
    font-weight: 900;
    line-height: 60px;
    letter-spacing: 10px;
    text-transform: uppercase;
}
.welcome-text h4{
    color: #fff;
    margin: 15px 0;
    font-size: 18px;
    letter-spacing: 12px;
    font-weight: 600;
    text-transform: uppercase;
}
.welcome-text h1 span{
    
}
.banner-icon {
    position: absolute;
    left: 50%;
    margin-left: -25px;
    bottom: 30px;
    width: 50px;
  -webkit-animation: 3s ease 0s normal none infinite running bounce;
          animation: 3s ease 0s normal none infinite running bounce;
  font-size: 40px;
  opacity: 0.7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  text-align: center;
  -webkit-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
}
a.banner-icon:focus{
    background: none;
    color: #fff;
}


/*************** HEADER AREA ******************/


.custom-navbar {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 99;
    padding: 10px 0;
    background: rgba(0, 0, 0, 0.8);
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
}

.custom-navbar.hidden{
    -webkit-transform: translate3d(0,-100%,0);
    -moz-transform: translate3d(0,-100%,0);
            transform: translate3d(0,-100%,0);
}

.logo a{
    display: inline-block;
    font-size: 18px;
    color: #fff;
    font-weight: 700;
    margin-top: 12px;
    text-align: center;
    letter-spacing: 4px;
}
.logo a:focus {
    text-decoration: none;
}

.main-menu{
    text-transform: uppercase;
}
.main-menu ul.navbar-nav{
    float: right;
}
.main-menu ul.navbar-nav li.active a{
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.main-menu ul.navbar-nav li a{
    color: #fff;
    font-weight: 700;
    -webkit-transition: all 0.5s ease-in-out 0s;
    transition: all 0.5s ease-in-out 0s;
    font-size: 13px;
    letter-spacing: 1px;
}
.main-menu ul.navbar-nav li a:focus {
    background: none;
    outline: none;
}
.main-menu ul li:hover a{
    background: none;
}







/*************** END INTRO SECTION ******************/



/************** ABOUT SECTION *******************/
.about-section{
    background: #f7f7f7;
}
.author-image {
  text-align: center;
}

.author-image img {
    
}

.social-icon {
   margin-top: 20px;
    margin-left: -5px;
    text-align: center;
}
.social-icon a{
   width: 32px;
    height: 32px;
    color: #fff;
    background: #000;
    display: inline-table;
    text-align: center;
    font-size: 12px;
    margin-left: 5px;
    margin-bottom: 15px;
}
.social-icon a i{
    display: table-cell;
    vertical-align: middle;
}
.social-icon a:hover{

    
}
.about-text {
  padding: 30px 0;
}
.about-text h3{
    font-size: 32px;
    font-weight: 700;
}
.about-text p{
    font-size: 16px;
    line-height: 28px;
}
.btn, a.btn {
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  height: 48px;
  letter-spacing: 0.2em;
  line-height: 48px;
  overflow: hidden;
  padding: 0 30px;
  text-align: center;
  text-transform: uppercase;
  -webkit-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
    margin: 20px 20px 10px 0;
    color: #000;
    outline: none;
}
.btn.extra, a.btn.extra {
  background: #000;
    color: #fff;
}


.btn:focus, a.btn:focus {
    outline: none;
}
.btn:hover, a.btn:hover{
    opacity: 0.9;
}
.btn.extra:hover, a.btn.extra:hover{
    opacity: 0.9;
}



/************** END ABOUT SECTION ********************/





/************ SEVICES SECTION ***********************/
.services-section{
    
}

.single-services{
    color: #666;
    
}

.servise-icon{
    width: 100px;
    height: 100px;
    color: #000;
    font-size: 65px;
    margin: 0 auto;
    display: inline-table;
    text-align: center;
    margin-bottom: 20px;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    
}
.servise-icon i{
    display: table-cell;
    vertical-align: middle;
}
.single-services h4{
    font-size: 18px;
    font-weight: 800;
    text-transform: uppercase;
    line-height: 28px;
}
.single-services p{
    font-size: 16px;
}
/************ END SEVICES SECTION ****************/



/*-----------------------------------
*        QUOTES AREA
*-------------------------------------*/
.quotes-area{
background: #f7f7f7;
}


.quotes-content h3{
    font-size: 42px;
    margin-bottom: 25px;
    font-size: 800;
}
.quotes-content p{
   
}


/************* PORTFOLIO SECTION *******************/

.single-work {
    position: relative;
    margin-bottom: 30px;
    
}
.single-work a{
    position: relative;
    overflow: hidden;
    display: block;
    box-shadow: 0 7px 16px 0 rgba(50, 50, 50, 0.2);
}
.single-work a:focus{
    outline: 0;
}
.single-work img{
	width: 100%;
	height: auto;
	transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
    
}
.itemHover {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	padding-right:20px;
	background:rgba(0,0,0,0.9);
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;

}
.single-work a:hover .itemHover {
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
}
.single-work a:hover img {
	-webkit-transform: scale3d(1.1,1.1,1.1);
    transform: scale3d(1.1,1.1,1.1);
}
.work-table{
    display: table;
    width: 100%;
    height: 100%;
    text-align: center;
    
}
.table-cell{
    display: table-cell;
    vertical-align: middle;
}
.hover-content{
    
}

.hover-content i {
	color:#fff;
	padding-bottom:15px;
	font-size: 65px;
	font-weight: 300;
	letter-spacing: 1px;
	text-align:center;
  	
}
.hover-content h6{
	color:#fff;
	font-size: 14px;
	font-weight: 300;
	letter-spacing: 1px;
}

/************* END PORTFOLIO SECTION ***************/

/************* REVIEW SECTION **********************/
.review-section{
    background: #f7f7f7;
}


.review-full-area{
    position: relative;
}
.review-full-area:before{
    font-family: FontAwesome;
    position: absolute;
    content: "\f10d";
    top: 0;
    left: 50%;
    margin-left: -30px;
    z-index: 3;
    font-size: 35px;
    color: #000;
}

.review-full-area .owl-carousel{
  text-align: center;
}
.single-review {
  padding: 50px 120px 10px;
}
.review-content{
    text-align: center;
}
.review-content p{
    font-size: 16px;
    color: #666;
    line-height: 28px;
}
h5.author{
    position: relative;
    font-size: 14px;
    color: #666;
    text-align: center;
}
.review-list .owl-dots{
    text-align: center;
}
.review-list .owl-dots div {
  background: #000;
  display: inline-block;
  height: 5px;
  margin-right: 6px;
  width: 14px;
    -webkit-transition: all .7s;
    transition: all .7s;
}
.review-list .owl-dots div.active{
    
}

/************ END REVIEW AREA*******************/




/************* CONTACT INFO SECTION *********************/
.contact-area{
    
}
.contact-form{
	position:relative;
}
.contact-form .form-group{
	margin-bottom:20px;
}
.form-control{
	padding:12px 2px;
	height:auto;
	box-shadow:none !important;
	border:none;
	border-bottom:solid 2px #000;
	border-radius:0;
	background:transparent;
}
textarea.form-control{
	resize:vertical;
}
.form-control:focus{
	border-color: 0 solid;
}
.btn.disabled, .btn[disabled], fieldset[disabled] .btn {
  box-shadow: none;
  cursor: not-allowed;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}



/*********** END CONTACT INFO SECTION *******************/
            


/************* FOOTER SECTION *********************/
.footer{
    background-color: #111;
    padding: 80px 0;
}
.footer-text{}
.footer-text p{
    font-size: 16px;
    color: #fff;
    margin-bottom: 0px;
}
/*************** END FOOTER SECTION *****************/