@import url('https://fonts.googleapis.com/css?family=Raleway');
body, html {
    height: 100%;
}
.parallax { 
    /* The image used */
   background-image:url(img/contact.jpg);

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.parallaxone{
 /* The image used */
   background-image:url(img/IMG_6986.jpg);

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 20%
}
.parallaxnine{
 /* The image used */
   background-image:url(img/EFI_2-01.jpg);
    

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 20%
}

parallaxotwo{
 /* The image used */
   background-image:url(img/black-and-white-restaurant-lunch-kitche.jpg);

    /* Full height */
    height: 90%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.parallaxthree{
 /* The image used */
   background-image:url(img/pexels-photo-27665.jpg);

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.parallaxfour{
 /* The image used */
   background-color: black;
}
.parallaxfive{
 /* The image used */
   background-image:url(img/BOARD%20ROOM.jpg);

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0px 100px 0px
}
.parallaxsix{
 /* The image used */
   background-image:url(img/Untitled-2-01.jpg);

    /* Full height */
    height: auto; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0px 100px 0px
}

.header-container{
    width: 100%;
    height: 900px;
    border-left: none;
    border-right: :none;
    position: :relative;
 }

.video-container{
    position: absolute;
    top:0%;
    left: :0%;
    height: 100%;
    width: 100%;
    overflow: hidden;

}

video{
    position: absolute;
    z-index: -1;
    width: 100%
}
#video{
    color: #3cbc8d;
    z-index: 1;
    text-align: center;
    margin-right: auto;
    margin-left: 30%;
    margin-top: 13%;
    width: 600px;
}



/* Safari 4.0 - 8.0 */



.popup-content h3{
  border-bottom: 1px solid #fff;
  font-size: 1.2em;
  margin-bottom: .5em;
    
}
/*//////////////////////*/
.popup{
  left: 0;
  position: fixed;
  top: 25%;
  transition: left .5s ease;
    z-index: 1;
    width: 275px;
    
}
.request{
     font-family: 'Montserrat', sans-serif;

 background-color:  #fff200;  
 border-radius: 25px;
  box-shadow:  5px 2px 15px black;   
  float: left;
color: black;
    width: 180px;
    height: 30px;
    font-size: 18px;
 
 animation: shaker 5s infinite;
   animation-name: shaker;
text-align: center
}
.popup-content{
    background-color: black;
    box-shadow:  5px 2px 15px black;
    box-sizing: border-box;    
    color: white;
    float: left;

    padding: 1em;
    width: 275px; 
}

.sticky{
 position: fixed;
}
.sticky-content{
background-color: black;
    box-shadow:  5px 2px 15px black;
    box-sizing: border-box;    
    color: white;
    float: left;

    padding: 1em;
    width: 275px; 
}
.close{
  left: -275px;
}

.button{
  background-color:  #fff200;  
  border-bottom-right-radius: 10px;
  border-top-right-radius: 10px;
  box-shadow:  5px 2px 15px black;   
  float: left;
  height: 70px;
  padding-top: 1.5em;
  
}
.button::after{
    content:"X Close ";
    color: black;
    cursor: pointer;
    font-size: 10px;
    padding: 5px;
  }
.button-closed::after{
    content:"▶ request quote";
    font-family: 'Roboto', sans-serif;
    color: ;
    cursor: pointer;
    font-size: 10px;
width: 85px; 
    height: 100px;
    padding-left: 10px
        
}

.container-image {
  position: relative;
  width: 32%;
    
}
.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  background-color:#FFF200;
   
  overflow: hidden;
  width: 100%;
  height:0;
  transition: .5s ease;
}



.text {
      white-space: nowrap; 
      color: black;
      font-size: 20px;
      position: absolute;
      overflow: hidden;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
}


.trans {
    width: 300px;
    height: 50px;
    background: black;
    -webkit-transition: width 2s; /* Safari *
    -webkit-transition-timing-function: linear; /* Safari */
    transition: width 2s;
    transition-timing-function: linear;
}

.trans:hover {
    width: 500px;
    height: 200px;
}


.buttons{
    background-color:  #fff200;  
 border-radius: 25px;
  box-shadow:  5px 2px 15px black;   
padding: 10px;
color: black;
    width: 180px;
    height: 30px;
    font-size: 18px;
    text-align: center
    

}
.buttonsservice{
      font-family: 'Montserrat', sans-serif;
font-weight: bold;
  color:  black;
     border-radius: 25px;
background-color: #fff200;;
cursor: pointer;
     padding: 5px;
    margin-top: 120px;
}

.buttons:hover{
    text-decoration: none;
    border-style: solid;
    border-width: 2px;
    color:black

}
.awards p{
    color: black
}
.awards h4{
    color: black;
    margin-top: 20px;
}

.contactinfo{
    font-size: 18px
}

.contactinfo h5{

    font-size: 15px
}


.contactmap{

    font-size: 18px
}

.printedproducts h2{
margin-top: 120px
}

.box{
    
    color:black;
    height: auto;
    padding: 10px;
    border-style: none;

    background-color: rgba(255, 255, 255, 0.9);
    margin-top: 20px;
   
}

@keyframes shaker {
  0% {
    transform:rotate(0deg);
  }

  29% {
    transform:rotate(0deg);
  }


  30% {
    transform:rotate(1deg);
  }

  31% {
    transform:rotate(2deg);
  }

  33% {
    transform:rotate(1deg);
  }

  35% {
    transform:rotate(0deg);
  }

  37% {
    transform:rotate(-1deg);
  }

  39% {
    transform:rotate(-2deg);
  }

  41% {
    transform:rotate(-1deg);
  }

  43% {
    transform:rotate(0deg);
  }


  45% {
    transform:rotate(1deg);
  }

  47% {
    transform:rotate(2deg);
  }

  49% {
    transform:rotate(1deg);
  }

  51% {
    transform:rotate(0deg);
  }

  53% {
    transform:rotate(-1deg);
  }

  55% {
    transform:rotate(-2deg);
  }

  57% {
    transform:rotate(-1deg);
  }

  59% {
    transform:rotate(0deg);
  }


  100%{
    transform:rotate(0deg);
  }
}

.services{
 background-color: rgba(0, 0, 0, 0.3);
}

.service{
padding-top: 20px
}
.service h1{
color: black;
    font-size: 70px
}

.servicebox{
margin-bottom: 20px
}

#downloads{
  margin-top: 50px;   
}
#downloads h1{
font-size: 50px;
   
}

#downloads h3{
    margin-bottom: 40px;
    font-size: 20px;
}

.downbuttons{
    background-color:  #fff200;  
 border-radius: 25px;
  box-shadow:  5px 2px 15px black;   
padding: 10px;
color: black;
  
    font-size: 15px;
    text-align: center
    

}

.form-control{
height: 20px;
    background: none;
    border: none
}
.info{
padding-top:20px
}
.info ul{
padding-bottom: 20px
}
.info li{
color:black
}
.info p{
    font-weight: 900;
color: black
}

.submit{
    font-size: 14px;
padding: 10px
}

.reg{background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
   
    height: 100%;
background-image: url(https://static.pexels.com/photos/6335/man-coffee-cup-pen.jpg)
}
.bodycontent{
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
   padding-top:75px;
    height: auto;

    
}

.regheading h1{
    font-size: 40px;
    font-weight: 900;
    color: black;
    padding-top:20px;
    padding-top:20px;
     text-shadow: 1px 1px #fff;
  
    
}
.regheading h4{ 
    padding-bottom: 20px;
    color: black;
     text-shadow: 1px 1px #fff;
    font-size: 16px;
    font-weight: 900;
}
input::-webkit-input-placeholder {
color: #C1C1C1!important;
font-family: 'Raleway', sans-serif;
    font-weight: 600
}
 
input:-moz-placeholder { /* Firefox 18- */
color: #C1C1C1 !important;
   font-family: 'Raleway', sans-serif;
    font-weight: 600
}
 
input::-moz-placeholder {  /* Firefox 19+ */
color: #C1C1C1 !important;  
    font-family: 'Raleway', sans-serif;
    font-weight: 600
}
 
input:-ms-input-placeholder {  
color: #C1C1C1 !important;  
    font-family: 'Raleway', sans-serif;
    font-weight: 600
}
textarea::-webkit-input-placeholder {
color: #C1C1C1 !important;  
    font-family: 'Raleway', sans-serif;
    font-weight: 600 
}
 
textarea:-moz-placeholder { /* Firefox 18- */
color: #C1C1C1 !important;  
    font-family: 'Raleway', sans-serif;
    font-weight: 600
}
 
textarea::-moz-placeholder {  /* Firefox 19+ */
color: #C1C1C1 !important;  
    font-family: 'Raleway', sans-serif;
    font-weight: 600
}
 
textarea:-ms-input-placeholder {  
color: #C1C1C1 !important;  
    font-family: 'Raleway', sans-serif;
    font-weight: 600  
}


<!------------test------------->

#quote-carousel {
    padding: 0 10px 30px 10px;
    margin-top: 60px;
}
#quote-carousel .carousel-control {
    background: none;
    color: #CACACA;
    font-size: 2.3em;
    text-shadow: none;
    margin-top: 30px;
}
#quote-carousel .carousel-indicators {
    position: relative;
    right: 50%;
    top: auto;
    bottom: 0px;
    margin-top: 20px;
    margin-right: -19px;
}
#quote-carousel .carousel-indicators li {
    width: 50px;
    height: 50px;
    cursor: pointer;
    border: 1px solid #ccc;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    opacity: 0.4;
    overflow: hidden;
    transition: all .305s ease-in;
    vertical-align: middle;
}
#quote-carousel .carousel-indicators .active {
    width: 128px;
    height: 128px;
    opacity: 1;
    transition: all .305s;
}
.item blockquote {
    border-left: none;
    margin: 0;
}
.item blockquote p:before {
    content: "\f10d";
    font-family: 'Fontawesome';
    float: left;
    margin-right: 10px;
}

.contactinfo p{
font-size: 20px;
   font-family: 'Raleway', sans-serif;
}
.contactmap p{
font-size:18;
   font-family: 'Raleway', sans-serif;
}

.carousel-control.right{
    background: none}

.carousel-control.left{
    background: none}

.carousel-inner>.item{
 transition: all .15s ease-in;
}