/* ==================================
Default theme
-------------------------------------
Fonts: Raleway & Open sans
-------------------------------------
Colors:
    Moon Yellow: #f4c613
    Grey:        #212226
    White Smoke: #f4f4f4
    White:       #fff
    Black:       #000   


=============== Html Body ===================== */

html,body{
    height: 100%;
}
body{
    color: #212226;
}
h1,
h2,
h3,
h4,
h5,
h6{
    font-family: "Raleway", sans-serif;
}
p{
    font-family:"Open sans",sans-serif;
    font-size: 13px;
    font-weight: 400px;
    line-height: 24px;
}
section{
    background:#fff;
    overflow: hidden;
}

/*=============Preloader============= */
#preloader{
    background-color: white;
    position: fixed;
    top:0;
    bottom: 0;
    left: 0;
    right:0;
    z-index: 9999;
}
#status{
    background-image: url("../img/preloader/preloader.gif");
    background-repeat: no-repeat;
    width:70px;
    height: 70px;
    position: absolute;
    left: 50%;
    top:50%;
    margin-top:-35px;
    margin-left:-35px;
}


/*================== Home ================ */
#home{
    background:none;
    height: 100%;
}
#home-bg-video{
    position: fixed;
    top:50%;
    left:50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -1;
    background: url("/video/solo.jpg") no-repeat;
    background-size: cover;
}
#home-overlay{
    background-color: rgba(0,0,0,0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    top:0;
    left:0;
    z-index: -1;
}
#home-content{
    width: 100%;
    height: 100%;
    display: table;
}
#home-content-inner{
    display: table-cell;
    vertical-align: middle;
}
#home-heading h1{
    color:white;
    font-size: 65px;
    font-weight: 100;
    text-transform: uppercase;
    margin:0;
    display: inline-block;
}
#home-heading h1 span{
    color:#f4c613;
    font-weight: 500;
}
#home-text p{

    color: #fff;
    font-size: 17px;
    font-weight: 100;
    margin:8px 0 30px 0;
}
/*==== Buttons ====== */

.btn-general{
    font-family: 'raleway', sans-serif;
    border-radius: 28px;
    font-size: 13px;
    text-transform: uppercase;
    margin:0 6px;
    padding: 12px 46px 12px 46px;
    transition: all .5s;
}
.btn-home{
    color: white;
    border: 1px solid #fff;
}
.btn-home:hover,.btn-home:focus{
    color:#fff;
    background-color: #f4c613;
    border: 1px solid #f4c613;
}

/*=======Arrow down=======*/
#arrow-down {
    position: absolute;
    left: 50%;
    bottom: 20px;
    color: #fff;
    font-size: 32px;
    width: 32px;
    height: 32px;
    text-align: center;
    margin-left: -16px;
    z-index: 1;
}
#arrow-down:hover,
#arrow-down:focus{
    color: #f4c613;
}

/*======= Content Boxes =======*/

.content-box-lg{
    padding: 120px 0;
}
.content-box-md{
    padding:100px 0;
}

/* =========Vertical Headings======== */

.vertical-heading h5{
    color: #f4c613;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    word-spacing: 9px;
    display: inline-block;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    position: relative;
    top: 60px;
    left: -53px;
    
}
.vertical-heading h2{
    margin: 0 0 0 35px;
    font-size: 42px;
    font-weight: 100;
    line-height: 45px;
}

/* =======About 01 =======*/
#about-right p:first-child{
    margin-bottom: 30px;
}
#about-bottom {
    margin-top: 60px auto;
}
#about-bottom img{
    margin:0 auto;
}

/* =========About 02=========== */

#about-02{
    background-color: #f4f4f4;
}

.about-item{
    background-color: #fff;
    padding: 80px 60px;
    box-shadow: 0 0 10px rgba(0,0,0,.1);
}
.about-item i {
    font-size: 42px;
    margin: 0;
}
.about-item h3{
    font-size:24px;
    margin-bottom:10px;
}
.about-item hr{
    width: 45px;
    height: 3px;
    background-color: #f4c613;
    margin: 0 auto;
    border: none;
}
.about-item p{
    margin-top: 20px;
}

/* Hover state */
.about-item:hover{
    background-color: #f4c613;
}
.about-item:hover i,
.about-item:hover h3,
.about-item:hover p
{
color: #fff;
}
.about-item:hover hr{
    background-color: #fff;
}

.about-item:hover i{
    transform: translateY(-20px);
}

/* smooth transition */
.about-item,
.about-item i,
.about-item hr
{
    -webkit-transition: all 400ms ease-in-out;
    transition: all 400ms ease-in-out;
}

/*=============== Team ==============*/
#team-left .vertical-heading{
    min-height: 160px;
}

.team-member{
    margin:8px;
    position: relative;
}


.team-member-overlay {
    background-color: rgba(33,34,38,.9);
    position:  absolute;
    top:0;
    left:0;
   width: 100%;
   height: 100%;
   overflow: hidden;
   opacity: 0;
   -webkit-transition: all 300ms linear;
   transition: all 300ms linear;
}
.team-member-info{
    width: 100%;
    height: 100%;
    padding: 80px 0;
}

.team-member-info h6{
    color:#f4c613;
    font-size: 16px;
    margin:0;
}

.team-member-info p{
    color:#fff;
}

.team-member:hover .team-member-overlay{
    opacity: 1;
} 



/* Social icons */

ul.social-list{
    padding: 0;
    margin-top:20px;
}
ul.social-list li{
    display: inline;
    padding: 0;
}

ul.social-list li a{
    border:1px solid #fff;
    width:35px;
    height: 35px;
    display: inline-block;
    line-height:35px;
    color:#fff;
    border-radius: 50%;
    -webkit-transition: all 400ms linear;
    transition: all 400ms linear;
}
ul.social-list li:nth-child(1) a:hover{
    background: #3b5998;
    border-color: transparent;
}
ul.social-list li:nth-child(2) a:hover{
    background: #00aced;
    border-color: transparent;
}
ul.social-list li:nth-child(3) a:hover{
    background: #dd4b39;
    border-color: transparent;
}
/* slider buttons */
.owl-theme .owl-nav [class*=owl-]{
    color:#212226;
    font-size:40px;
    background: none;
    /* margin: 0; */
}
.owl-theme .owl-nav [class*=owl-]:hover{
    color:#212226;
    background: none;
}

/* Skill */
.skill{

    margin-bottom: 20px;
}
.skill h4{
    line-height: 62px;
    margin:0;
    font-weight: normal;
}
.progress{
    height:25px;
    border-radius: 0;
    background: #efefef;
    overflow: visible;
}
.progress-bar{
    background-color: #f4c613;
    position: relative;
}
.progress-bar span{
    font-size:11px;
    font-weight:100;
    font-family: "Open Sans",sans-serif;
    background-color: #212226;
    padding: 3px;
    position: absolute;
    left:97%;
    top:-47px;
}
.progress-bar span:before{
    content:"";
    border-top: 8px solid #212226;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    position: absolute;
    bottom: -8px;
    left: 23%;
}