
/*
====================================================
* 	[Master Stylesheet]
	
	Theme Name :  
	Version    :  
	Author     :  
	Author URI :  
====================================================
	TOC
	1. PRIMARY STYLES
	2. COMMONS FOR PAGE DESIGN
		JQUERY LIGHT BOX
	3. MAIN SECTION
====================================================
/* ---------------------------------
1. PRIMARY STYLES
--------------------------------- */

html    { 
            font-size: 100%; 
            height: 100%;
            width: 100%;     
            margin: 0px;  
            padding: 0px;      
            overscroll-behavior-x: none;
        }

@font-face  {
                font-family: gillsLight;
                src: url('fonts/GillSans-Light-08.woff') format('woff'),
                url('fonts/GillSans-Light-08.ttf') format('truetype');
            }

@font-face  {
                font-family: gillsReg;
                src: url('fonts/GillSans-01.woff'), format('woff'),
                url('fonts/GillSans-01.ttf') format('truetype');
                font-weight: 200;
}
  
body    {   
        font-size: 10px;     
        font-family: 'gillsLight', sans-serif; 
        font-style: normal; 
        font-variant: normal;
        width: 100%; 
        height: 100%; 
        margin: 0; 
        overflow-x:hidden!important;
        color: #333;            
        overscroll-behavior-x: none;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        }

h1, h2, h3, h4, h5, h6, p, a, ul, span, li, inpot, button   {
                                                            margin: 0; 
                                                            padding: 0; 
                                                            }

h1,h2,h3,h4,h5,h6   { 
                    line-height: 1.5; 
                    }

h1,h2,h3    {        
            font-family: 'gillsLight', sans-serif;
            }

p   { 
    padding-bottom: 20px;
    color: white; 
    vertical-align: top; 
    font-family: 'gillsLight', sans-serif;  
    }

h1  { 
    font-size: 3.5em;
    line-height: 1; 
    }

h2  { 
    font-size: 4em;    
    line-height: 1.1;
    padding-top: 10px; 
    letter-spacing: 15px; 
    text-indent:20px; 
    }

h3  { 
    font-size: 4em; 
    letter-spacing: 15px;
    padding-top: 10px;
    }

h4  { 
    font-size: 3.5em; 
    color:white; 
    font-family: 'gillsLight', 
    sans-serif; 
    }

h5  { 
    font-size: 2.0em;
    color:white; 
    letter-spacing: 2px; 
    font-family: 'gillsLight', sans-serif; 
    }

h6  { 
    font-size: .9em; 
    letter-spacing: 1px; 
    font-family: 'gillsLight', sans-serif; 
    }

a, button   { 
    display: inline-block; 
    text-decoration: none; 
    color: inherit;
    transition: all .3s; 
    line-height: 1; 
    }

a:focus, a:active, a:hover,
button:focus, button:active, button:hover,
a b.light-color:hover{ text-decoration: none; color: #125688; }

img.logo {width:60%; max-width: 600px; min-width:200px; vertical-align: inherit; z-index:1; transition: .5s ease;}

img.playicon {position:block; width: 70%; max-width:200px; min-width:50px; padding-top:80px; transition: .5s ease; }
img.playiconhover {position:block; width: 70%; max-width:200px; min-width:50px; padding-bottom:54px; transition: .5s ease;  }

.scrolldiv {width:100%; position:absolute; bottom:20px; transition: .5s ease; -webkit-animation: bounce 4s infinite;}

img.scrollicon { width:60px; align-content: center; vertical-align: inherit; transition: .5s ease;
}

@-webkit-keyframes bounce {
    0%          {   bottom:25px;}
    5%,    15%  {   bottom:35px;}
    10%         {   bottom:40px;}
    20%         {   bottom:20px;}
    50%         {   bottom:20px;}
    100%        {   bottom:20px;}
}


/* --------------------------------- MAIN SECTION --------------------------------- */

main-area   {   position: relative; 
    width:100%; 
    z-index: 1; 
    padding:0px; 
    background-size: cover; 
    color: #fff; 
    overflow-x:hidden; 
    text-align: center;
    min-height:100%;
    background-position: center;
}

.main-area:after    {   content:''; 
            position: relative;  
            z-index: -1;  
            opacity: .4;   
            background: #000; 
        }

/*---------------------------- Navigation Bar -------------------------------*/

.navBar a:not(:first-child) {
                            display: none;
                            }

.navBar {
        margin: 0px;
        overflow: hidden;
        position: fixed;
        display: block;
        width:100%;
        text-align: center;
        z-index: 3;
        padding-bottom:0px;   
        }

.navBar a   {
            margin: 0px;
            width:110px;
            display: inline-block;
            color: #f2f2f2;
            text-align: center;
            padding: 50px 50px 50px 0px;
            text-decoration: none;
            font-size: 15px;
            font-family: 'GillsReg' sans-serif;
            }       

.navBar a:hover {
                margin:0px;
                color: #7da8c7;
                }

.navBar .navitem:hover  {
                        color: #7da8c7; 
                        }


.navBar .icon2 {
                margin: 0px;
                float:right;
                right:50px;
                text-align: right;
                top: 50px;
                position:relative;
                height:auto;
                }

.navBar.responsive  {
                    position: fixed;  
                    padding-bottom:150px; 
                    background: rgba(22,29,42,0.7); 
                    }

.navBar.responsive .icon2   { 
                            margin: 0px;
                            float:right;
                            right:50px;
                            text-align: right;
                            position: absolute;
                            padding: 50px 50px 0px 0px;
                            z-index: 0;
                            }   
  
.navBar.responsive a    {
                        margin: 120px 50px 50px 0px;
                        float: right;
                        display: block;
                        text-align: right;
                        width:100%;
                        margin-bottom:-150px;
                        z-index: 1;
                        color:white;
                        font-weight: 500;
                        }   

.navBar.responsive a:hover  {
                            color:#7da8c7;
                            }

/*---------------------------- SECTION 1 -------------------------------*/

#S1_video   {
            display: block;
            height:100%;
            overflow-x:hidden;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            z-index: -1;
            }

.S1_videoContainer  {
                    position:absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100vh;
                    min-height:1000px;
                    overflow-x:hidden;
                    }

.S1-display-table-cell  {   
                        position:relative;
                        vertical-align: middle; 
                        width:100%; 
                        height:100%;
                        }   

.S1_bg  {   
        position:absolute; 
        top:0; 
        right:0; 
        bottom:0; 
        left:0;
        display:table-cell; 
        vertical-align: middle; 
        width:100%; 
        height:100vh; 
        opacity:0.8; 
        z-index:-0.5;  
        background-color:#161d2b;
        min-height:1000px;
        }

.S1_logoContainer  { 
                position:relative; 
                width:60%; 
                height:auto; 
                left:20%; 
                top:20%;
                margin-right: -50%; 
                z-index:1; 
                vertical-align: middle; 
                align-content: center;
                }
         
        








.playiconoverlay    { 
                    transition: .5s ease;
                    opacity: 0;
                    position: absolute;
                    bottom:0;
                    }

.playtext   {
            width:100%;
            text-align:center;
            }

h4  { 
    letter-spacing: 10px; 
    width:100%;
    text-align:center;
    }

.title  { 
        z-index :2;
        padding-top:20px;
        }

.title:hover   {
    color:#7da8c7;
    transition: all .2s;
    font-family: 'GillsReg' sans-serif;
}

img.section2image {width:100%; vertical-align: inherit;  transition: .5s ease;}



.scroll-container {
    height: 100%;
    width:100%;
    overflow-y: scroll;
    overflow-x: hidden;
    min-height:500px;

}

.display-table-section-2::-webkit-scrollbar {
    display:none; 
    display:hidden;
    width: 0px;
    background: transparent;
}

.scroll-container::-webkit-scrollbar {
    display:none; 
    display:hidden;
    width: 0px;
    background: transparent;
}



.product-image {
    position: absolute; 
    overflow-y: scroll;
    overflow-x: hidden;
    height: 100%;
    min-height:600px;
    width:100%;
    align-items: center;
    justify-content: center;
    background-image: url('../images/background2_light.png');
    background-size: cover; 
    float: left;
    z-index: -1;
}



.productimage {
    width:100%;
    height:auto;
    float:left;
    position: absolute;
   
    opacity: 0;
    transition: all 1s;
    left: 50%;
    margin-left: -50%;
    top: 50%;
    margin-top: -50%;
    
}


.active {
    opacity: 1;
}

.image-container {
    width:50%;
    height: 100%;
    position:relative;
    float:left;

}

.text-container {
    display: relative;
    align-items: center;
    justify-content: center;
    float: right;
    height:100%;
    width:50%;

}

.sec1-container {
    max-width:600px;
    padding-left:15px;
    padding-right:15px;
}

.sec4-container {
    
    height:auto;
    padding-top: 100px;
    opacity:0.8;
    background-color:#161d2b;
    width:100%;


}

.section1 {
    height: 100%;
    width:100%;
    display: flex;
    align-items: center;
    justify-content: center;
    float: right;
}

.section2 {
    height: 80%;
    width:100%;
    padding: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    float: right;
    background-size: cover; 
}


.text {
    color:white;
    display:block;
    width:100%;
    word-wrap: normal;
}

.paragraph {
    display:block;
    width:100%;
    font-size: 2.5em; 
    word-wrap: normal;
    line-height: 1.5;
    letter-spacing:1px;
    
}

.paragraph2 {
    display:block;
    width:90%;
    font-size: 1.8em; 
    word-wrap: normal;
    line-height: 1.5;
    letter-spacing:1px;
    padding-left:5%;
   text-align: left;

}

.paragraph3 {
    display:block;
    width:90%;
    font-size: 1.7em; 
    word-wrap: normal;
    line-height: 1.5;
    letter-spacing:1px;
    padding-top:20px;   
    padding-left:5%;
}

.whoweare_div1 {
    width:49.9%; 
    height:800px; 
    position:relative; 
    float:left;
    padding-bottom:10px; 
    border-right:1px solid lightgray;


}

.whoweare_div2 {
    width:49.9%; 
    padding-top:10px; 
    height:800px;  
    position:relative; 
    float:left;
}

.whoweare_img1 {
    height:110px; 
    left:25%;
}

.whoweare_hsimg {
    width:100%;
    bottom:0px;
    position: absolute;
    left:0;

}
.whoweare_nuvechimg {
    width:100%;
    bottom:0px;
    position: absolute;
    left:0;

}
.whoweare_img2 {
    height:90px; 
    padding-bottom:10px; 
    left:25%;
}


.proddoctext {
    display:block;
    width:100%;
    font-size:0.7em;
    letter-spacing: 10px;
    word-wrap: normal;
    line-height: 1.7;
    color:white;
    font-family: 'gillsLight', sans-serif; 
}

.proddoctext:hover{
    color: #161d2b;
    font-weight: bold;
}

.fade-in {
    opacity : 0;
    transition: opacity 250ms ease-in;
}

.fade-in.appear {
    opacity : 1;
}

li { 
    list-style: none; 
    display: inline-block;
}

.fa-instagram {
    color: white; 
}

.contacticon {
    width:100px;
    padding-top:20px;
}

  
.fa {
  padding-top: 30px;
  padding-bottom: 30px;

  
  font-size: 30px;
  width: 40px;
  text-align: center;
  text-decoration: none;
  color: white;
}

span { 
    display: inline-block; 
}

.contactdetail {
    width:100%;
    float:left;
}

.details {
    padding: 20px;
}

.socailmedia {
    width:50%;
    float:right;
}

.contact {
    font-size:5em;
}

.iconcontainer {
    width:100%;
}

hr {
    display: block;
    width:30%;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    align-content: center;
    margin-left:35%;
}

.hr2 {
    display: block;
    width:25%;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    align-content: center;
}

hr.l3 {
    display: block;
    width:80%;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    align-content: center;
    margin-left: 10%;
}



.icon{ font-size: 1.1em; display: inline-block; line-height: inherit; }

[class^="icon-"]:before, [class*=" icon-"]:before{ line-height: inherit; }

*, *::before, *::after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

*, *::before, *::after {
    -webkit-box-sizing: inherit;
	box-sizing: inherit;} 

.center-text    { 
                    text-align: center; 
                } 

.display-table-section-1 { 
    display:inline-block;
    width:100%;
    background-position: center;  
    vertical-align: middle;
    height: 100vh; 
    min-height:1000px;
}

.imgcont {
    position: relative;
    z-index:-1;
}


.display-table-section-2 { 
    display: inline-block; 
    width: 100%;
    background-position: 
    center;
    vertical-align: middle; 
    height: 100vh;
    min-height:500px;
    overflow:hidden;
}

.display-table-section-4 { 
    display:inline-block;
    background-color:#161d2b;
    width:100%;
    background-position: center;  
    vertical-align: middle;
    height: auto;
    max-height:550px; 
}

.display-table-section-3 { 
    width:100%;
    display:inline-block;
    background-position: center;  
    vertical-align: middle;
    justify-content: center;
    height:auto;
    max-height:800px; 

}

.display-table-section-5 { 
    width:100%;
    display:inline-block;
    background-position: center;  
    vertical-align: middle;
    justify-content: center;
    position: relative;
}

.display-table-section-6 { 
    width:100%;
    height:auto;
    display:inline-block;
    background-position: center;  
    vertical-align: middle;
    justify-content: center;
}


.whoweare-div {width:50%; height:100%;  position:relative;}

.scenario-img1 {
    width:100%;
    overflow-y:hidden;
    position:absolute;
    z-index:1;  
    top:0px; 
    right:0; 
    bottom:0; 
    left:0;
}

.carousel-inner {
    height:auto;
    padding-bottom:80px;
    background-color: #161d2b;
}

.item {
    width:100%;
}

.carousel-img{
    max-width:1400px;
    width:100%;
   
}
.carousel-img2{
    max-width:1200px;
    width:100%;
   
}

.scenario_title {
    font-size: 2.7em;
}


.caption{
    width:100%; height:170px; padding-top:20px;
}

.caption_title{
    width:29%; height:100%; position:relative; 
    float:left;

}

.caption_paragraph {
    width:70%; 
    text-align: left;
    float:right;    
    border-left:1px solid lightgray;
}

.sec4-textbackground {
    width:100%;
    position: relative;
    display: flex;
    background-image: url('../images/background2_light\ -\ Copy.png');
    background-size: contain; 

}

.buttonImage-container{
    width:70%;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

.CountingText {
    font-size: 2.4em;
    font-weight: bold;
}

#buttonImage {
    transition: all 0.5s;
    float:right; 
    height:auto;
    width:100%;
    -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;

    }

#CompanyLogo {
    width:30%;
    padding-bottom: 20px;

}

#SupportedText {
    font-size: 1.4em;
    padding-top: 0px;

}

.toggleButton {
    padding:10px;
    background-color: transparent;
    border-color: white;
    font-size: 1.5em;
    color:white;
    margin-left:5px;
    width:25%;
    z-index: 1;
    cursor: pointer;
    transition: all 0.5s;

}

.toggleButton2 {
    padding:10px;
    background-color: transparent;
    border-color: white;
    font-size: 1.5em;
    color:white;
    background-color: #161d2b;
    width:100%;
    z-index: 1;
    cursor: pointer;
    transition: all 0.5s;
 

}

.toggleButton span {
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: 0.5s;
  }
  
  .toggleButton span:after {
    content: '\00bb';
    position: absolute;
    opacity: 0;
    top: 0;
    right: -20px;
    transition: 0.5s;
  }
  
  .toggleButton:hover span {
    padding-right: 25px;
  }
  
  .toggleButton:hover span:after {
    opacity: 1;
    right: 0;
  }

.howitworks-text {
    font-size:2em;
}

.email:hover h4 {
                color:#7da8c7;
                transition: all .2s;
                }

.display-table-cell2    {      
                        position:relative;
                        vertical-align: middle; 
                        width:100%; 
                        height:100%;
                        }


.table{ display:table; vertical-align: middle; width: 100%; }



.certificate {width:100%;display:table-cell; float:middle; }

::-webkit-input-placeholder { font-size: .9em; letter-spacing: 1px; }

::-moz-placeholder { font-size: .9em; letter-spacing: 1px; }

:-ms-input-placeholder { font-size: .9em; letter-spacing: 1px; }

:-moz-placeholder { font-size: .9em; letter-spacing: 1px; }


.full-height{ height: 100%; }

.position-static{ position: static; }

.font-white{ color: #fff; }


