/*
* Template Name: Tri Networks Multipurpose Bootstrap Design
* Author: Design Gurus
* Author URL: https://themeforest.net/user/design_gurus
* Version: 1.0
*/

/* =============================================================================

1. Fonts
2. Common Styles(Margins Paddings Colors backgrounds)
3. Pre-Loader(Page Loader)
4. Nice Scroll (Custom Scroll)
5. Form|Inputs|Text-AreaS| Styles
6. Buttons
7. Navbar | Navigation Bar | Top Bar
8. Banner | Slider | Top Section
9. Services Section
10. Who We Are Section
11. Counters Section
12. Features Section
13. Reasons Section
14. Our Team Section
15. Footer Section

============================================================================= */


/* ============================================================================= 
1. Fonts
============================================================================= */

@font-face {
    font-family: robo-light;
    src: url("../fonts/roboto/Roboto-Light.ttf");
}
@font-face {
    font-family: robo-medium;
    src: url("../fonts/roboto/Roboto-Medium.ttf");
}
@font-face {
    font-family: robo-bold;
    src: url("../fonts/roboto/Roboto-Bold.ttf");
}


/* ============================================================================= 
3. Pre-Loader
============================================================================= */
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999999;
    background: url('../index_images/preloader.gif') center no-repeat #fff;
}

/* =============================================================================
4. Nice-Scrolls
============================================================================= */
.nicescroll-rails div{
    width: 5px !important;
    height: 25px;
    border-radius: 2px;
    border: none !important;
    background: #F86A3A !important;;
}

/* =============================================================================
5. Form|Inputs|Text-AreaS| Styles
============================================================================= */
.form-group{
    position: relative;
}
.register{
	margin-top:-10px;
	}
.form-group .registerInput{
    width: 100%;
    border: 0;
    border-radius: 0px;
	border-bottom-right-radius:0px;
    background: #000;
    height: 40px;
    font-size: 16px;
    padding-left: 50px;
	border-right:0px dotted #FFF;
	border-bottom:1px dashed #FFF;
	margin:8px 5px 0 0px;
	color:#FFF;
}
.register-input-icon{
    color: #FFF;
}
.register-input-icon-error{
    color: #F00;
}
.registerInput::placeholder{
    color: #CCC;
    opacity: .7;
}

.form-group .registerInput:focus{
    background: #333;
    color: #F86A3A;
}

.form-group .register-input-icon{
    color: #CCC;
    font-size: 16px;
    position: absolute;
    z-index: 1;
    top: 11px;
    left: 25px;
}
.form-group .register-input-icon-error{
    color: #F00;
    font-size: 16px;
    position: absolute;
    z-index: 1;
    top: 11px;
    left: -25px;
}

.form-group .registerInput:focus + .register-input-icon{
    color: #F86A3A;
}





.form-group .myInput{
    width: 100%;
    border: 0;
    border-radius: 0;
    background: #25262B;
    height: 70px;
    font-size: 20px;
    padding-left: 50px;
	border-right:0px dotted #FFF;
	border-bottom:1px dashed #FFF;
	color:#FFF;
}

.myInput::placeholder{
    color: #CCC;
    opacity: .9;
}

.form-group .myInput:focus{
    background: #28272b;
    color: #F86A3A;
}

.form-group .input-icon{
    color: #CCC;
    font-size: 20px;
    position: absolute;
    z-index: 1;
    top: 21px;
    left: 15px;
}

.form-group .myInput:focus + .input-icon{
    color: #F86A3A;
}


/* =============================================================================
6. Buttons
============================================================================= */
.register-orange-btn{
    background: #FFFFFF;
    border: 1px solid #FFF;
    border-radius: 0px;
    color: #777777;
    font-size: 15px;
    font-family: robo-medium;
    padding: 14px 35px;
    transition: all 0.25s;
	margin-left:0px;
}
.register-orange-btn:hover{
    background: #FFF;
    color: #F86A3A;
    transition: all 0.3s;
}

.orange-btn{
    background: #F86A3A;
    border: 0;
    border-radius: 0px;
    color: #fff;
    font-size: 15px;
    font-family: robo-medium;
    padding: 14px 35px;
    transition: all 0.25s;
}
.orange-btn:hover{
    background: #fff;
    color: #F86A3A;
    transition: all 0.3s;
}

/* =============================================================================
7. Navbar | Navigation Bar | Top Bar
============================================================================= */
.navbar.navbar-default{
    background: transparent;
    border: none;
    border-radius: 0;
    margin: 15px 0 0;
    padding: 10px 0;
    /*-------*/
    width: 100%;
    position: absolute;
    z-index: 999;
}

.navbar-default .navbar-right{
    margin-top: 9px;
}

.navbar-brand{
    height: auto;
    padding: 5px;
}
.navbar-brand img{
    max-width: 250px;
}

.navbar-default .navbar-nav li{
    padding: 0 12px;
}

.navbar-default .navbar-right .btn{
    padding: 10px 30px;
}

.navbar-default .navbar-nav li a{
    color: #fff;
    font-size: 14px;
    font-family: robo-medium;
    text-transform: uppercase;
    letter-spacing:1px;
    padding: 14px 6px;
    transition: color 0.25s;
}

.navbar-default .navbar-nav li a:hover{
    color: #F86A3A;
    transition: color 0.3s;
}

.navbar-default .navbar-nav li a.active,
.navbar-default .navbar-nav li a:focus{
    color: #F86A3A;
}

.navbar.navbar-default .navbar-brand .lWhite{
    display: block;
}
.navbar.navbar-default .navbar-brand .lBlack{
    display: none;
}

.navbar.navbar-default.nav-fixed{
    position: fixed;
    margin-top: 0;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.navbar.navbar-default.nav-fixed .navbar-brand img{
    max-width: 200px;
}
.navbar.navbar-default.nav-fixed .navbar-brand .lWhite{
    display: none;
}
.navbar.navbar-default.nav-fixed .navbar-brand .lBlack{
    display: block;
}
.navbar.navbar-default.nav-fixed .navbar-nav li a {
    color: #666;
    padding: 11px 6px;
}

.navbar.navbar-default.nav-fixed .navbar-nav li a:hover{
    color: #F86A3A;
    transition: color 0.3s;
}

.navbar.navbar-default.nav-fixed .navbar-nav li a.active,
.navbar.navbar-default.nav-fixed .navbar-nav li a:focus{
    color: #F86A3A;
}


/* =============================================================================
8. Banner | Slider | Top Section
============================================================================= */
/*banner-bg-image*/
.main-banner{
    background: url('../../../../../img/head_bg2.jpg') center fixed;
    background-size: cover;
    min-height: 120vh;
}

.main-banner .bg-gradient{
    background: rgba(32,34,38,0.7);
    background: -moz-linear-gradient(top, rgba(32,34,38,0.7) 0%, rgba(32,34,38,0.98) 74%, rgba(32,34,38,1) 100%);
    background: -webkit-linear-gradient(top, rgba(32,34,38,0.7) 0%, rgba(32,34,38,0.98) 74%, rgba(32,34,38,1) 100%);
    background: -o-linear-gradient(top, rgba(32,34,38,0.7) 0%, rgba(32,34,38,0.98) 74%, rgba(32,34,38,1) 100%);
    background: -ms-linear-gradient(top, rgba(32,34,38,0.7) 0%, rgba(32,34,38,0.98) 74%, rgba(32,34,38,1) 100%);
    background: linear-gradient(to bottom, rgba(32,34,38,0.7) 0%, rgba(32,34,38,0.98) 74%, rgba(32,34,38,1) 100%);
    padding: 100px 10px 100px 10px;
    height: 120vh;
}
.fullscreen-video-wrap{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:120vh;
	overflow:hidden;
}
.fullscreen-video-wrap video{
	min-width:100%;
	min-height:120vh;
}
.header-overlay{
	width:100%;
	height:120vh;
	position:absolute;
	top: 0px;
	left: 0px;
	right:0px;
	bottom:0px;
	background:#000000;
	opacity:.7;
}
.header-content{
	z-index:2;
	}


/*banner-text*/
.banner-text{
	z-index:2;
    margin-top: 50px;
}
.banner-text .big-text{
    color: #fff;
    font-size: 34px;
    margin: 0;
	font-weight:bold;
}
.banner-text .content{
	z-index:2;
    color: #CCC;
    font-size: 19px;
    font-family: robo-light;
    margin-top:25px;
}
.banner-text .btn{
    margin-top: 30px;
}

/*login-div*/
.calculatorDiv{
    max-width: 100%;
    margin: 10px auto;
}
.calculatorDiv .login-title{
    color: #000;
    font-size: 22px;
    font-family: Tahoma, Geneva, sans-serif;
    border-left: 3px solid #F86A3A;
    padding-left: 10px;
	font-weight:bold;
    margin: 15px 0 !important;
}
.calculatorDiv .form-group{
    margin-bottom:0;
}
.calculatorDiv .form-group:first-child .myInput{
    border-bottom: 1px solid rgba(255,255,255,0.02);
}


.calculatorDiv button{
    color: #fff;
    font-size: 16px;
    font-family: Tahoma, Geneva, sans-serif;
    background: transparent;
    border: 0;
    border-radius: 0;
    text-align: center;
    padding: 25px;
    width: 100%;
    transition: all 0.25s;
}
.calculatorDiv button:hover{
    color: #f86a3a;
    transition: all 0.3s;
}





/*login-div*/
.loginDiv{
    background: rgba(22,24,27,.35);
    max-width: 390px;
    margin: 30px auto;
}
.registerDiv{
    background: rgba(22,24,27,.35);
    max-width: 390px;
    margin: 30px auto;
}
.loginDiv .login-title{
    color: #fff;
    font-size: 22px;
    font-family: "Arial", Helvetica, sans-serif;
    border-left: 3px solid #F86A3A;
    padding-left: 10px;
	font-weight:bold;
    margin: 15px 0 !important;
}
.registerDiv .register-title{
    color: #fff;
    font-size: 22px;
    font-family: "Arial", Helvetica, sans-serif;
    border-left: 3px solid #F86A3A;
    padding-left: 10px;
	font-weight:bold;
    margin: 15px 0 !important;
}
.loginDiv .form-group{
    margin-bottom:0;
}
.loginDiv .form-group:first-child .myInput{
    border-bottom: 1px solid rgba(255,255,255,0.02);
}


.loginDiv button{
    color: #fff;
    font-size: 16px;
    font-family: Tahoma, Geneva, sans-serif;
    background: transparent;
    border: 0;
    border-radius: 0;
    text-align: justify;
    padding: 25px;
    padding-left: 50px;
    width: 100%;
    transition: all 0.25s;
}
.loginDiv button:hover{
    color: #f86a3a;
    transition: all 0.3s;
}

.registerDiv button{
    color: #fff;
    font-size: 16px;
    font-family: Tahoma, Geneva, sans-serif;
    background: #333;
    border: 0;
    border-radius: 0;
    text-align: center;
    padding: 25px;
    width: 100%;
    transition: all 0.25s;
}
.registerDiv button:hover{
    color: #f86a3a;
    transition: all 0.3s;
}