/*##################################################################################
                default values
        font-family: 'Roboto Condensed', sans-serif;

        grenish Blue : #34c6d3 (buttons, icons, links, lines & Backgrounds
        Steel Grey  : #41464b  (headings)
        Blue Bayoux  : #64707b  (paragraphs)
        White : #fff  (text with Black Backgrounds)
        black : #000  

#######################################################################################*/
/*-------------------------GERAL-----------------------------------*/
body {
  font-family: 'Lato', sans-serif;
  background-color: rgb(239, 240, 240);
}

p {
  color: #64707b;
  font-size: 16px;
  font-weight: 300;
}

h3 {
  color: #41464b;
  text-transform: uppercase;
}

/*-------------------------HOME-----------------------------------*/
html,
body {
  height: 100%;
}

#home {
  height: 100%;
}

#home .parallax {
  content: "";
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  background: no-repeat top center / cover;
  background: linear-gradient(45deg, 
  rgba(179, 169, 171, 0.3), 
  rgba(35, 90, 102, 0.5), 
  rgba(81, 83, 41, 0.3), 
  rgba(71, 69, 69, 0.3), 
  rgba(32, 104, 102, 0.5)) 0 0 / 1500%;
    -webkit-animation: gradientAnimation 25s ease infinite;
    -moz-animation: gradientAnimation 25s ease infinite;
    -o-animation: gradientAnimation 25s ease infinite;
    animation: gradientAnimation 25s ease infinite;
  }
  
  @-webkit-keyframes gradientAnimation {
    0%   
    {  -moz-background-position: 0% 30%, 0 0;
       -webkit-background-position: 0% 30%, 0 0;
       -ms-background-position: 0% 30%, 0 0;
       background-position: 0% 30%, 0 0;
    }
    50%  {
       -moz-background-position: 100% 70%, 0 0;
       -webkit-background-position: 100% 70%, 0 0;
       -ms-background-position: 100% 70%, 0 0;
       background-position: 100% 70%, 0 0;
    }
    100% { 
      -moz-background-position: 0% 30%, 0 0;
      -webkit-background-position: 0% 30%, 0 0;
      -ms-background-position: 0% 30%, 0 0;
      background-position: 0% 30%, 0 0;
    }
  }

  @keyframes gradientAnimation {
    0%   
    {  -moz-background-position: 0% 30%, 0 0;
       -webkit-background-position: 0% 30%, 0 0;
       -ms-background-position: 0% 30%, 0 0;
       background-position: 0% 30%, 0 0;
    }
    50%  {
       -moz-background-position: 100% 70%, 0 0;
       -webkit-background-position: 100% 70%, 0 0;
       -ms-background-position: 100% 70%, 0 0;
       background-position: 100% 70%, 0 0;
    }
    100% { 
      -moz-background-position: 0% 30%, 0 0;
      -webkit-background-position: 0% 30%, 0 0;
      -ms-background-position: 0% 30%, 0 0;
      background-position: 0% 30%, 0 0;
    }
  }

#home-content-box {
  position: absolute;
  width: 100%;
  height: 100%;
  display: table;
}

#home-content-box-inner {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

#home-heading h3 {
  color: #fff;
  font-size: 45px;
  padding:0 20px;
  line-height: 50px;
  font-weight: 300;
  margin: 20px 0 20px 0;
}


/*-------------------------BUTTONS-----------------------------------*/
.btn-general {
  border-color: #fff;
  border-width: 2px;
  border-radius: 0;
  padding: 12px 26px;
  font-size: 16px;
  font-weight: 400;
  text-transform: uppercase;
}

.btn-white {
  border-color: #fff;
  color: #fff;
  -webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

.btn-white:hover,
btn-white:focus {
  border-color: rgba(255, 255, 255,0.0);
  background: rgba(255, 255, 255, 0.4);
  color: rgb(8, 24, 59);
}

.btn-blue {
  border-color: #34c6d3;
  color: #34c6d3;
  -webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

.btn-blue:hover,
btn-blue:focus {
  background: #34c6d3;
  color: #fff;
}

.btn-back-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 22px;
  padding: 3px 15px;
  border-radius: 0;
  display: none;
}

/*-------------------------ANIMATIONS-----------------------------------*/
#bome-cover,
#bome-heading,
#bome-btn {
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  -o-animation-duration: 0.5s;
  animation-duration: 0.5s;
}

#bome-cover {
  -webkit-animation-delay: 0.1s;
  -moz-animation-delay: 0.1s;
  -o-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

#bome-heading {
  -webkit-animation-delay: 0.5s;
  -moz-animation-delay: 0.5s;
  -o-animation-delay: 0.5s;
  animation-delay: 0.5s;
}

#bome-btn {
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  -o-animation-delay: 1s;
  animation-delay: 1s;
}

/*-------------------------Content-box generic-----------------------------------*/
.content-box {
  padding: 55px 0;
}

.content-title h3 {
  text-align: center;
  font-size: 30px;
  font-weight: 300;
  margin: 20px 0 30px 0;
}

.content-title-white h3 {
  color: #fff;
}

.content-title-underline {
  height: 3px;
  width: 60px;
  background-color: #34c6d3;
  margin: 0 auto 30px auto;
}

/*-------------------------SERVICES-----------------------------------*/

.service-item {
  padding: 20px 0 20px 0;
  margin-bottom: 20px;
}

.service-item-icon i {
  color: #34c6d3;
  float: left;
  padding: 15px;
  margin: 0 25px 35px 0;
  width: 70px;
  height: 70px;
  text-align: center;
  -webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

#services .container .service-item-icon i:hover{
  color: #fff;
  background-color: #34c6d3;
}

.service-item-title h3 {
  font-size: 20px;
  font-weight: 300;
  margin: 0 0 10px 0;
}

.service-item-description p {
  margin: 0;
  padding-left: 15px;
}

/*------------------------ ABOUT----------------------*/

#about-bg-diagonal {
  width: 60%;
  height: 600px;
  float: right;
  background: no-repeat top right / cover;
  border-left: 200px solid rgb(239, 240, 240);
  border-top: 600px solid transparent;
}

#about-content-box {
  float: left;
  height: 600px;
}

#about-content-box-outer {
  width: 100%;
  height: 100%;
  display: table;
}

#about-content-box-inner {
  display: table-cell;
  vertical-align: middle;
}

#about .content-title h3 {
  text-align: left;
}

#about .content-title-underline {
  margin: 0 0 30px 0;
}

#about-desc p {
  margin-bottom: 30px;
}

/*---------------------news-------------------*/

#news .content-box {
  padding: 55px 0 10px 0;
}

/*------------------------ social-icons generic----------------------*/

.social{
  position: absolute;
  width:100%;
  top:85%;
  display:flex;
  flex-wrap: nowrap;
  justify-content: center;
  vertical-align: baseline;
}

.social a{
  position:relative;
  color:#fff;
  padding:10px;
  transition: transform 2s;
  -webkit-transition: transform 2s;
  -o-transition: transform 2s;
  -moz-transition: transform 2s;
  font-size: 18px;
}

.social a:hover{
  color: #daba07;
  transform: translateY(-15px);
}

/*--------------contact section------------------*/
footer {
  background-color: #1f3239;
  padding-top: 30px;
  border-top: 5px solid rgba(0, 0, 0, 0.2);
}

#contact-left h3,
#contact-right h3 {
  color: #fff;
  font-size: 27px;
  font-weight: 300;
}

#contact-left p {
  color: #fff;
  margin-bottom: 30px;
}

#contact-left .bold{
  font-weight:300; 
}

.phone{
  margin-top:40px;
}
.phone a{
  color:#fff;
  font-weight: 300;
  font-family: 'Lato', sans-serif;
  font-size: 16px;
  letter-spacing: 3px;
  text-decoration: none;
}

.phone a:hover{
    color:rgb(223, 198, 9);
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}

.mail{
  width:100%;
  margin:20px auto;
}

#contact-right hr{
  width:80%;
  margin-left: 0;
}


/*-------------footer----------------*/
#footer-bottom {
  background: rgba(0, 0, 0, 0.3);
  padding: 30px 0;
  margin-top: 60px;
}

#footer-copyrights p {
  margin: 0;
  color: #fff;
  font-size: 14px;
}

#footer-menu {
  float: left;
  color: #fff;
  font-size: 16px;
  font-weight: 300;
}

#footer-menu ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

#footer-menu ul li {
  display: inline-block;
}

#footer-menu a {
  color: #fff;
  font-size: 14px;
  font-weight: 300;
  margin: 0 10px;
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#footer-menu a:hover {
  color: #daba07;
}

/*----------------navbar--------------------------*/
.navbar {
  padding: 15px 0;
  -webkit-transition: all 0.8s ease-in-out;
	-moz-transition: all 0.8s ease-in-out;
	-o-transition: all 0.8s ease-in-out;
  transition: all 0.8s ease-in-out;
}


.vesco-top-nav {
  background-color: #1f3239;
  padding: 10px 0;
}


.vesco-nav-wrapper {
  padding: 0 65px;
}

.navbar-brand{
  padding: 5px 0 8px;
}

.navbar-brand img{
  width: 210px;
}

.navbar-nav {
  float: right;
}

.navbar-nav>li>a {
  color: #fff;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 300;
  -webkit-transition: all 0.8s ease;
	-moz-transition: all 0.8s ease;
	-o-transition: all 0.8s ease;
  transition: all 0.8s ease;
}

.navbar-nav>li>a:hover,
.navbar-nav>li>a:focus {
  background: none;
  color: #daba07;
}

.navbar-toggle {
  background: rgba(0, 0, 0, 0.1);
  border: 1px solid #fff;
  border-radius: 0;
}

.navbar-toggle .icon-bar {
  background: #fff;
}

.navbar-collapse {
  max-height: none !important;
}

.vesco-top-nav ul.navbar-nav>li.active>a {
  color: #daba07;
}

