/*

Theme Name: Avada Plus

Theme URI: http://themewagon.com/

Author: ThemeWagon

Author URI: http://themewagon.com/

Description: Slick One page HTML 5 template powered by Bootstrap 3.

Version: 1.14.11

License: GNU General Public License v3

License URI: http://www.gnu.org/licenses/gpl-3.0.txt

Tags: blur, white, one page, parallax, responsive-layout, full-width-template

Text Domain: flusk

*/



/**

* Table of Contents:

*

* 01.0 - Global

* 02.0 - Header

* 03.0 - Drawer with menu

* 04.0 - Parallax styles

* 05.0 - Recent works

* 06.0 - Services

* 07.0 - Blog

* 08.0 - Testimonials

* 09.0 - Contact

* 10.0 - Footer

* 11.0 - Responsive styles

* -----------------------------------------------------------------------------

*/





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

//  01 - Global 

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



* {outline: none !important;}



::selection {

  background-color: #475B6F;

  color: #fff;

}



html {

  -webkit-font-smoothing: antialiased;

  text-rendering: optimizeLegibility;

  -webkit-text-size-adjust: none;

  -ms-text-size-adjust: none;

  overflow-y: scroll;

}



body {

  color: #6a6a6a; 

  background: #f1f0f0;

}



p {

  margin: 0 0 20px 0;

    font-family: 'Open Sans', sans-serif;

  }



img {max-width: 100%;}



a {

  text-decoration: none;

  outline: none;

}



a{  

  color: #4da7ca;

  -o-transition: all .4s;

  -ms-transition: all .4s;

  -moz-transition: all .4s;

  -webkit-transition: all .4s;

  transition: all .4s;

}



a:hover {

  color: #4290ae; 

}





h1, h2, h3, h4, h5, h6{   

  margin: 0 0 15px 0; 

  color: #3A4F52;

  font-family: 'Raleway';

}



.btn{border-radius: 0;}

.btn-o {

    border: 1px solid #3A4F52;

    color: #3A4F52;

}

.btn-o:hover {

    background: #3A4F52;

    color: white;

}

.btn.btn-o-white {

    border: 1px solid white;

    color: white;

    background: transparent;

    

}

.btn.btn-o-white:hover {

    background: white !important;

    color: #6a6a6a; 

}



.title-page {

  display: inline-flex;

  margin-bottom: -20px;

}

p.main-header {

  font-size: 27px;

  font-family: 'Raleway';

  font-weight: 500;

}

p.main-header:after {

  content: " ";   

  font-size: 27px;

  font-family: 'Raleway';

  font-weight: 500;

}

p.sub-header {

  font-size: 27px;

  font-family: 'Raleway';

  font-weight: 100;

  margin-left: 10px;

}

p.sub-header:before {

  content: " ||| ";

  font-size: 27px;

  font-family: 'Raleway';

  font-weight: 300;

}

li{

  list-style: none;

}



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

//  02 - Header

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

 

    



header.top-header {

  position: fixed;

  z-index: 999;

  width: 100%;

}

.shows {

 background: rgba(43, 62, 81, 0.77);

 transition: all .6s;

}

.shows .navbar-default {

  /* background-color: #f8f8f8; */

  /* border-color: #e7e7e7; */

  margin-bottom: 10px;

  transition: all .6s;

}

.shows .navbar-nav {

  float: right;

  margin: 15px 0 0;

  color: white;

}

.shows h1.logo {

  margin-top: 0px;

  color: white;

}



h1.logo {

  margin-top: 11px;

  color: white;

  display: inline-flex;

}

#header{  

  position: relative;     

  text-align: center;

  padding: 0 !important;

}

.navbar-nav {

  float: right;

  margin: 31px 0 0;

  color: white;

}

#header .top {

  position:fixed;

  top:0;

  width: 100%;

  padding: 30px;

  height: auto;

  z-index: 500;

  -o-transition: all .5s;

  -ms-transition: all .5s;

  -moz-transition: all .5s;

  -webkit-transition: all .5s;  

  transition: all .5s;    

}

#header .top.solid {

    background: #475B6F;

    padding-top: 15px;

    padding-bottom: 15px;

}



#header .top h1{

  margin-bottom: 0;

}

#header .top.solid .toggleDrawer i {

    padding-top: 8px;

}



#header .logo, #header .toggleDrawer{

  font-family: 'Raleway', sans-serif;

  color: white;

}

.logo-head{

  font-family: 'Raleway', sans-serif;

  font-size: 12px;

  font-weight: 300;

}

.logo:hover{

  text-decoration: none;

}



#header .slogan{

  font-size: 4em;

  margin-bottom: 15px;

  line-height: 1em;

  font-family: 'Raleway', sans-serif;

  color: white;

  font-weight: bold;

}



#header .secondary-slogan{

  font-size: 1.6em;

  color: rgba(255,255,255,.5);

  line-height: 1em;

  font-family: 'Raleway', sans-serif;

}



#header > .bottom {

    position: absolute;

    bottom: 75px;

    text-align: center;

    width: 100%;

}

#header > .bottom a img {

    width: 50px;

}

#header > .bottom a {

    opacity: 0.7;

}

#header > .bottom a:hover {

    opacity: 1;

}





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

//  03 - Drawer with menu

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



#drawer-right {

    position: fixed;

    right: 0;

    top: 0;

    bottom: 0;

    margin-right: -300px;

    background: #2B3E51;

    width: 300px;

    padding: 20px;

    z-index: 999;

}



#drawer-right h1, #drawer-right h2{color: white;}



#drawer-right .nav-pills>li>a {

  font-size: 18px;

  border-radius: 0;

}



#drawer-right .social{margin-top: 30px}

#drawer-right .social ul {

    list-style: none;

    padding-left: 20px;

}

#drawer-right .social ul > li {

    display: inline-block;

}

#drawer-right .social ul > li > a:hover{

  color: white;

}







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

//  04 - Parallax styles

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



.content-block{

  background:transparent no-repeat center center fixed;

  -webkit-background-size:100%;

  -moz-background-size:100%;

  -o-background-size:100%;

  background-size:100%;

  background-size:cover;

  -webkit-background-size:cover;

  -moz-background-size:cover;

  -o-background-size:cover;

  overflow:hidden;

  padding: 60px 0;

}

.parallax{

  padding: 80px 0;

}



.block-body {

  margin-top: 60px;

}



#header {

  background-image: url(../images/header-bg.jpg);

  box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.8);

}

#services {

  background:white;

}

#parallax {

  /* background-image: url(../images/blue_mac2.jpg); */

  color: white;

  background: #db5252;

}

#contact {

  background-image: url(../images/newsletter-bg.png);

  color: white;

  background-color: #405162;

}

#parallax h1{

  margin-bottom: 60px;

  color: white;

}









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

//  05 - Recent works

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



.recent-work {

    width: 100%;

    padding-bottom: 27%;

    background: #C3C9CC;

    display: table;

    text-align: center;

    vertical-align: middle;

    padding-top: 27%;

    background-size: 100%;

    background-repeat: no-repeat;

    background-position: center;

    position: relative;

    margin-bottom: 30px;

}



.recent-work span{

  margin-top: -18px;

  opacity: 0;

  position: relative;

  z-index: 1;

}

.recent-work:before {

    background: rgba(2, 56, 58, 0.7);

    height: 100%;

    width: 100%;

    position: absolute;

    left: 0;

    top: 0;

    content: '';

    opacity: 0;

    -o-transition: all .2s;

  -ms-transition: all .2s;

  -moz-transition: all .2s;

  -webkit-transition: all .2s;

  transition: all .2s;

}

.recent-work:hover {

    background-size: 200%;

    background-position: center;

}

.recent-work:hover:before, .recent-work:hover span {

    opacity: 1;

}











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

//  06 - Services

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





.service i {

    font-size: 23px;

    padding: 0 5px;

}

.bar:before{

  font-family: 'Raleway', sans-serif;

  content: "||| " ;

  font-size: 23px;

  font-weight: 100;

}



.bar:after {

  font-family: 'Raleway', sans-serif;

  content: "||| " ;

  font-size: 23px;

  font-weight: 100;

}

.service h2.service-head{

  font-family: 'Raleway', sans-serif;

  margin-top: 15px;

  font-weight: 100;

}

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

//  About us

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



    /* Add these styles to include four photos in a row */



    .about-us {

        padding: 60px 0;

    }

    

    .aboutus-item {

        padding: 20px;

        margin-bottom: 30px;

    }

    

    .image-container {

        width: 200px;

        height: 200px;

        margin: 0 auto 20px;

        overflow: hidden;

    }

    

    .circular-img {

        width: 100%;

        height: 100%;

        object-fit: cover;

        border-radius: 50%;

    }

    

    .aboutus-title {

        margin: 15px 0;

        font-size: 18px;

        font-weight: 600;

    }

    

    .aboutus-desc {

        text-align: justify;

        line-height: 1.6;

        margin-bottom: 0;

    }

    

    .justify-text {

        text-align: justify;

        text-justify: inter-word;

    }

    

    .main-header {

        font-size: 36px;

        font-weight: 700;

        margin-bottom: 10px;

    }

    

    .sub-header {

        font-size: 18px;

        color: #666;

        margin-bottom: 30px;

    }



*////End of CCS for 4 Photos in a row*/










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

//  Call to Action

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



h3.call-action.pull-left {

  /*width: 90%; */

  font-size: 27px;

  color: white;

}

 .parallax {

  padding: 61px 0 55px;

}





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

//  07 - Blog

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





#blog .blog-post img {

    margin-bottom: 20px;

}

#blog .date {

    margin-bottom: 15px;

    font-style: italic;

}





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

//  08 - Testimonials

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





ol.carousel-indicators {

  margin-bottom: -50px;

}



#testimonials{

  text-align: center;

}

#testimonials .testimonial {

  padding: 25px;

}

.carousel {

  position: relative;

  margin: 50px 0;

}

.carousel h3 {

  margin: 47px 0 20px;

}



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

//  09 - Contact

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





#contact{

  color: white;

}

#contact h1{color: white}



.form-control-white {

    background: rgb(255, 255, 255);

    /* color: black; */

    padding: 20px 16px !important;

}



.form-control-white::-webkit-input-placeholder { /* WebKit browsers */

    color:    white;

}

.form-control-white:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

    color:    white;

    opacity:  1;

}

.form-control-white::-moz-placeholder { /* Mozilla Firefox 19+ */

    color:    white;

    opacity:  1;

}

.form-control-white:-ms-input-placeholder { /* Internet Explorer 10+ */

    color:    white;

}





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

//  10 - Footer

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





#footer{ background: #2B3E51; color: white; border-top: 1px solid rgba(255, 255, 255, 0.24);}



h2.footer-block {

    color: white;

    font-family: "Raleway" , sans-serif;

}

.form-control{

  border-radius: none !important;

  padding: 20px 26px;

}

.form-group .btn.btn-o-white {

    width: 100%;

    padding: 9px 0;

    background: #db5252;

    border: none;

}

::-webkit-input-placeholder {

   color: #969595 !important;

}



:-moz-placeholder { /* Firefox 18- */

   color: #969595 !important;  

}



::-moz-placeholder {  /* Firefox 19+ */

   color: #969595 !important; 

}



:-ms-input-placeholder {  

   color: #969595 !important;  

}

.footer-bottom {

  padding: 37px 0 30px;

}

.blog-post ul p{

  margin-left: 40px;

}

.blog-post ul li .fa {

  border-radius: 33px 33px;

  background: rgb(219, 82, 82);

  width: 28px;

  /* height: 20px; */

  text-align: center;

  padding: 7px 7px;

  margin-right: 9px;

}

.blog-post ul {

  margin-left: -40px;

}

.blog-post .fa{

  background: rgb(219, 82, 82);

  width: 28px;

  text-align: center;

  padding: 7px 7px;

  cursor: pointer;

}

.blog-post .fa:hover{

  color: rgb(219, 82, 82);

  background:white;

  transition: all .6s;

}

.social {

  margin-left: 40px;

}

.social a i{

  color: #fff;

}

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

//  11 - Responsive styles

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





@media (max-width: 767px){

  .blog-post {

    margin-bottom: 40px;

  }



  .recent-work {

    background-position: center;

  }



  .recent-work:before {

    opacity: 1;

  }



  .recent-work span {

    opacity: 1;

  }

}



@media (max-width: 480px) {

  #drawer-right {

    padding: 10px 20px;

  }



  #drawer-right .nav-pills>li>a {

    font-size: 17px;

  }



  .nav-stacked>li+li {

    margin-top: 0;

  }



  .nav>li>a {

    padding: 8px 15px;

  }



  #drawer-right .social {

    margin-top: 5px;

  }



  #header {

    background-size: cover;

  }

  .service {

  text-align: center;

  }

}

button.navbar-toggle.collapsed {

  margin-top: 40px;

}

