

/* Ensure elements load hidden before ScrollReveal runs */
.scrollReveal { visibility: hidden;}
.sr { visibility: hidden;}


/* Ensure show in CMS */
.is-cms .scrollReveal {visibility: visible !important; }
.is-cms .sr {visibility: visible !important; }

/****** add icons ******/

.add-icon-weblink > a:last-child:after {
    content: "\f08e";
    margin-left: 10px;
}


.add-icon-weblink > a:last-child:after {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/****** add link icon to p > a last child ******/

.add-icon-weblink > p:last-child a:last-child:after {
    content: "\f08e";
    margin-left: 10px;
}


.add-icon-weblink > p:last-child a:last-child:after {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}



.add-icon-download > p:last-child a:last-child:after {
    content: "\f019";
    margin-left: 10px;
}


.add-icon-download > p:last-child a:last-child:after {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}




.add-icon-pdf > a:last-child:after {
    content: "\f1c1";
    margin-left: 10px;
}




/****** Top Nav Active Pages ******/
.menu li.active a {color: #000000 !important; opacity: 0.8;}


/****** Home Page ******/

/* Ensure elements load hidden before animated runs */

#video-modul-01 { visibility: hidden; }
.animated { visibility: visible !important; }


/****** New video tab setup ******/

#video-tabs-home {
  padding-top: 20px;
  padding-bottom: 10px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;

}

#video-tabs-home .tabs {
      padding-bottom: 16px;
      border-bottom: 0px solid #ccc;
      overflow: visible;
}

#video-tabs-home .tab-content {
    padding-top: 30px;
}

@media (max-width: 767px) {

    .cover.fullscreen .slides li #video-tabs-home .tabs li {
        padding: 5px 0 !important;
    }

    .tabbed-content .content .active {
        border-top: 1px solid #ccc;
        opacity: 1;
        visibility: visible;
        display: block;
        padding: 0px 0 0 20px !important;
    }

    .play-button {
      margin-bottom: 20px !important;
    }

}

.play-button {
    width: 50px;
    height: 50px;
    border: 2px solid #fff;
    text-align: center;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 20px !important;
    margin-left: 20px !important;
    z-index: 4;
    border-radius: 50%;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    cursor: pointer;
}


/****** End New video setup ******/

.play-button-not-used {
    width: 80px;
    height: 80px;
    border: 2px solid #fff;
    text-align: center;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -40px;
    margin-left: -40px;
    z-index: 4;
    border-radius: 50%;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    cursor: pointer;
}

/****** New 2018 video setup Masonery ******/

/* .inner-title .title {
    position: absolute;
    width: 100%;
    bottom: 24px;
    z-index: 5;
    padding:20px 20px 30px 20px;

} */


.inner-title .title {
    position: absolute;
    width: 100%;
    bottom: 10%;
    z-index: 5;
    padding:20px 20px 30px 20px;

}

.image-tile {border-right: 1.5px solid #fff; border-bottom: 1.5px solid #fff}

#small-title-intro h4 {font-weight:400; letter-spacing: 3px;}


/****** Our Business Page ******/

.our-business-bg-position { background-position: 50% 70% !important; }

#our-mission-list li, #our-vision-list li {
font-size: 32px !important;
line-height: 40px  !important;
color: #292929;
margin-bottom: 30px
}

#our-mission-list li strong, #our-vision-list li strong{
color: #e3d820 !important;
}

#our-mission-list ul[data-bullet] li i:first-child, #our-vision-list ul[data-bullet] li i:first-child {
    margin-right: 16px;
    transform: scale(0.6);
    -webkit-transform: scale(0.6);
    display: inline-block;

}

#our-mission-list ul li, #our-vision-list ul li {
margin-left: 0em;
 padding-left: 1em;
 text-indent: -0.7em;

}

@media all and (max-width: 767px) {

#our-mission-list li, #our-vision-list li  {
    font-size: 32px !important;
    line-height: 40px !important;
  }

    #our-mission-list ul[data-bullet] li i:first-child, #our-vision-list ul[data-bullet] li i:first-child{
    margin-right: 12px;
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
    display: inline-block;
}


#our-mission-list ul li, #our-vision-list ul li  {
margin-left: 0em;
 padding-left: 1em;
 text-indent: -0.7em;

}



}


.our-business .tabbed-content .content .active {
    -webkit-animation: fadeInUpShort 1s;
    animation: fadeInUpShort  1s;
}


/****** Technology ******/


.black-flex-direction-nav .flex-direction-nav a.flex-next:before, .black-flex-direction-nav .flex-direction-nav a.flex-prev:before {

    color: #000;
}


/* New - The Process Tab */

.technology .tabbed-content .content .active {
    border-top: 2px solid #e3d820;
    opacity: 1;
    visibility: visible;
    display: block;
    padding: 0px 0 0 0px !important;
    -webkit-animation: fadeInLeftShort 1s;
    animation: fadeInLeftShort  1s;
}



.technology .tab-content-inner-text {max-width: 760px; margin: auto}
.technology .tab-content { padding: 40px 30px 0px 30px;  background: #fff; text-align: left}
.technology .tab-content p {  text-align: left}
.technology .tab-content h5 {  text-align: center}


.plant-bg-position { background-position: 70% 50% !important; }



/****** Partnerships Page ******/


.partnerships-bg-position { background-position: 50% 10% !important; }


.accordion-partnerships .accordion li.active .content {
    max-height: 800px !important;
}


/****** News Page ******/


.news-bg-position { background-position: 50% 30% !important; }


/****** Team Page ******/


.team-bg-position { background-position: 50% 10% !important; }

.education-list li {
margin-left: 2em;
 padding-left: 0.8em;
 text-indent: -1em;

}

.plant-img-bg-section { background-position: 60% 50% !important; }


/****** News single Page ******/


.bullets {margin-left: 1em;
 padding-left: 0.8em;
 text-indent: -1em;}



/* contact page */

.contact-bg-position { background-position: 50% 50% !important; }



.centered {margin-left: auto; margin-right: auto; text-align: centered; display:block}

/*=================================================
In CMS Editor Preview Screen
=================================================*/


/* Info  */

body.cms-page-editor-preview .show-in-cms {display:block;}   /* Message Displays in the CMS  */
.show-in-cms {display:none}                                  /* Hides Message in normal browser */

/* fixed the bg black color box on load */
body.cms-page-editor-preview a.click-to-edit-inner-image {background-image:none; background-color: transparent; cursor:pointer; display:none;}

body.cms-page-editor-preview .cms-repeat-bubble { min-width: 177px;}

body.cms-page-editor-preview .cms-repeat-bubble:hover { width: 177px;}


/*=================================================
In Surreal CMS Editor Preview Screen
=================================================*/


.is-cms body .show-in-cms {display:block;}   /* Message Displays in the CMS  */
.show-in-cms {display:none}    				 /* Hides Message in normal browser */


/****** Animation overlay fades in before text ******/


.overlay-fadein:before {  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #292929;
  opacity: 0;
  z-index: 2;}

.overlay-fadein.on:before {
opacity: 0.4;
transition: opacity 2s ease-in-out;
-moz-transition: opacity 2s ease-in-out;
-webkit-transition: opacity 2s ease-in-out;
}

 /* overlay fade in for video slider homepage */

.overlay-vid-fadein .fs-vid-background:before {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #222222;
  opacity: 0;
  z-index: 2;
}

.overlay-vid-fadein.on .fs-vid-background:before {
  opacity: 0.3;
  transition: opacity 2s ease-in-out;
  -moz-transition: opacity 2s ease-in-out;
  -webkit-transition: opacity 2s ease-in-out;
}


/*! SHORT ANIMATIONS NOT INCLUDED IN ANIMATE.CSS */

/*********************
* fadeInUpShort
*********************/

@-webkit-keyframes fadeInUpShort {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes fadeInUpShort {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fadeInUpShort{
    animation-name: fadeInUpShort
}


/*********************
* fadeOutUpShort correct
*********************/

@-webkit-keyframes fadeOutUpShort {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(-20px);
    }
}

@keyframes fadeOutUpShort {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(-20px);
    }
}

.fadeOutUpShort{
    animation-name: fadeOutUpShort
}


/*********************
* fadeInDownShort
*********************/


@-webkit-keyframes fadeInDownShort {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes fadeInDownShort {
    0% {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fadeInDownShort{
    animation-name: fadeInDownShort
}


/*********************
* fadeOutDownShort
*********************/

@-webkit-keyframes fadeOutDownShort {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0px);
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(20px);
    }
}

@keyframes fadeOutDownShort {
    0% {
        opacity: 1;
        transform: translateY(0px);
    }
    to {
        opacity: 0;
        transform: translateY(20px);
    }
}

.fadeOutDownShort{
    animation-name: fadeOutDownShort
}


/*********************
* fadeInRightShort
*********************/

@-webkit-keyframes fadeInRightShort {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes fadeInRightShort {
    0% {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.fadeInRightShort{
    animation-name: fadeInRightShort
}


/*********************
* fadeOutRightShort
*********************/

@-webkit-keyframes fadeOutRightShort {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0px);
    }
    to {
        opacity: 0;
        -webkit-transform: translateX(20px);
    }
}

@keyframes fadeOutRightShort {
    0% {
        opacity: 1;
        transform: translateX(0px);
    }
    to {
        opacity: 0;
        transform: translateX(20px);
    }
}

.fadeOutRightShort{
    animation-name: fadeOutRightShort
}


/*********************
* fadeInLeftShort
*********************/


@-webkit-keyframes fadeInLeftShort {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-20px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes fadeInLeftShort {
    0% {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
         transform: translateX(0);
    }
}

.fadeInLeftShort{
    animation-name: fadeInLeftShort
}


/*********************
* fadeOutLeftShort
*********************/


@-webkit-keyframes fadeOutLeftShort {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
    to {
        opacity: 0;
        -webkit-transform: translateX(-20px);
    }
}

@keyframes fadeOutLeftShort {
    0% {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
         transform: translateX(-20px);
    }
}

.fadeOutLeftShort{
    animation-name: fadeOutLeftShort
}


/****** Delay Animation css */

.delay-1 {
animation-delay: .25s;
-moz-animation-delay: .25s;
-webkit-animation-delay: .25s;
-o-animation-delay: .25s;

animation-duration: 1s;
-moz-animation-duration: 1s;
-webkit-animation-duration: 1s;
-o-animation-duration: 1s;
}
.delay-2 {
animation-delay: .5s;
-moz-animation-delay: .5s;
-webkit-animation-delay: .5s;
-o-animation-delay: .5s;

animation-duration: 1s;
-moz-animation-duration: 1s;
-webkit-animation-duration: 1s;
-o-animation-duration: 1s;
}
.delay-3 {
animation-delay: .75s;
-moz-animation-delay: .75s;
-webkit-animation-delay: .75s;
-o-animation-delay: .75s;

animation-duration: 1s;
-moz-animation-duration: 1s;
-webkit-animation-duration: 1s;
-o-animation-duration: 1s;
}
.delay-4 {
animation-delay: 1s;
-moz-animation-delay: 1s;
-webkit-animation-delay: 1s;
-o-animation-delay: 1s;

animation-duration: 1.5s;
-moz-animation-duration: 1.5s;
-webkit-animation-duration: 1.5s;
-o-animation-duration: 1.5s;
}

.delay-5 {
animation-delay: 2s;
-moz-animation-delay: 2s;
-webkit-animation-delay: 2s;
-o-animation-delay: 2s;

animation-duration: 2.5s;
-moz-animation-duration: 2.5s;
-webkit-animation-duration:  2.5s;
-o-animation-duration:  2.5s;
}

.delay-6 {
animation-delay: 3s;
-moz-animation-delay: 3s;
-webkit-animation-delay: 3s;
-o-animation-delay: 3s;

animation-duration: 3.5s;
-moz-animation-duration: 3.5s;
-webkit-animation-duration:  3.5s;
-o-animation-duration:  3.5s;
}


.delay-7 {
animation-delay: 3.5s;
-moz-animation-delay: 3.5s;
-webkit-animation-delay: 3.5s;
-o-animation-delay: 3.5s;

animation-duration: 3.5s;
-moz-animation-duration: 3.5s;
-webkit-animation-duration:  3.5s;
-o-animation-duration:  3.5s;
}

.duration-05 { -webkit-animation-duration: 1s; animation-duration: .5s;}
.duration-1 { -webkit-animation-duration: 1s; animation-duration: 1s;}
.duration-2 { -webkit-animation-duration: 2s; animation-duration: 2s}
.duration-3 { -webkit-animation-duration: 3s; animation-duration: 3s}
