body{
    font-family: 'Roboto', sans-serif;
}
/*-----------------------------------------------------------------------------------*/
/*  LOADER
/*-----------------------------------------------------------------------------------*/
#loader {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-image: url('../img/page-loader.gif');
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-color: rgb(255,255,255);
}
/*-----------------------------------------------------------------------------------*/
/*  CUSTOM NAVBAR
/*-----------------------------------------------------------------------------------*/
#custom-navbar.navbar{
	background: transparent;
	border: none;
	min-height: 80px;
	-webkit-transition: background 0.2s ease-in-out;
    -moz-transition: background 0.2s ease-in-out;
    -ms-transition: background 0.2s ease-in-out;
    -o-transition: background 0.2s ease-in-out;
    transition: background 0.2s ease-in-out;
}
#custom-navbar.navbar-default .navbar-brand img{
	width: 50px;
}
#custom-navbar.navbar-default li a{
	color: #ffffff;
}
#custom-navbar.navbar-default li a:hover,
#custom-navbar.navbar-default li a:focus{
	color: #ff6600;
}
#custom-navbar.navbar-default li.active a{
	background-color: transparent;
  	color: #ff6600;
}
#custom-navbar.navbar-default .navbar-nav{
	padding-top: 15px;
}

#home{
    background-image: url("../img/home.jpg");
    height:100vh;
    width:100%;
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    padding-top: 190px;
}
/*=======================================================
            Row Same Height
========================================================*/
.row-eq-height {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
    flex-wrap: wrap;
}
.row-eq-height > [class*='col-'] {
    display: flex;
    flex-direction: column;
}
/*-----------------------------------------------------------------------------------*/
/*  DOWNLOAD PROFILE
/*-----------------------------------------------------------------------------------*/
.jumbotron{
	background: transparent;
	text-align: center;
}
.jumbotron h1{
	color: #ffffff;
	font-family: 'Anton', sans-serif;
	padding-bottom: 10px;
}

.btn-orange{
	background-color: #ff6600;
	color: #ffffff;
}
.btn-orange:hover,
.btn-orange:focus{
	-webkit-filter: brightness(80%);
	color: #ffffff;
}
/*-----------------------------------------------------------------------------------*/
/*  ABOUT US SECTION
/*-----------------------------------------------------------------------------------*/
#about-us {
	padding: /*top*/40px /*right*/80px /*bottom*/40px /*left*/80px;
}
#about-us h1{
	color: #ff6600;
	font-family: 'Anton', sans-serif;
}
#about-us h4{
	color:#000000;
	font-size: 14px;
	text-align: center;
	font-weight: bold;
}
#about-us p{
	text-align: center;
	color: #000000;
}
/*-----------------------------------------------------------------------------------*/
/*  OUR TEAM SECTION
/*-----------------------------------------------------------------------------------*/
#our-team{
    background-image: url("../img/team.jpg");
    width:100%;
    background-attachment: fixed;
    background-size: 100% 100%;
    background-position: center;
	padding: /*top*/40px /*right*/25% /*bottom*/30px /*left*/25%;
}
#our-team h1{
	color: #ff6600;
	font-family: 'Anton', sans-serif;
	padding-bottom: 20px;
}
.panel{
	background-color: rgba(255, 255, 255, 0.7);
	border-radius: 0;
}
.photo img{
	display: block;
	margin: auto;
	max-width: 100%;
	display:block;
}
.name{
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	color: #003399;
}
.name p{
    margin-bottom: 0;
}
.about-team{
	text-align: left;
	color: #000000;
}
.about-team ul{
	padding: 20px;
}
/*-----------------------------------------------------------------------------------*/
/*  PRODUCT SECTION
/*-----------------------------------------------------------------------------------*/
#products{
	padding: /*top*/40px /*right*/80px /*bottom*/40px /*left*/80px;
}
#products h1{
	color: #ff6600;
	font-family: 'Anton', sans-serif;
	padding-bottom: 20px;
}
.product-content{
	padding:10px;
}
.logo{
	text-align: center;
	display: block;
	margin: auto;
}
.logo a{
	text-decoration: none;
	color: #ff6600;
}
.logo a:hover{
	opacity: 0.8
}
.logo-title{
	color: #1f64ac;
	font-family: 'Anton', sans-serif;
	text-align: center;
	font-size: 20px;
	padding: /*top*/5px /*right*/0 /*bottom*/15px /*left*/0;
}
.detail{
	color: #000000;
	text-align: center;
}
/*-----------------------------------------------------------------------------------*/
/*  CLIENTS SECTION
/*-----------------------------------------------------------------------------------*/
#clients{
	background-color: #e6e6e6;
	padding: /*top*/40px /*right*/80px /*bottom*/40px /*left*/80px;
}
#clients h1{
	color: #ff6600;
	font-family: 'Anton', sans-serif;
	padding-bottom: 20px;
}
#clients .owl-carousel img{
	background-color: #ffffff;
	padding: 15px;
	width: 210px;
	height: 80px;
}
/*-----------------------------------------------------------------------------------*/
/*  CONTACT US SECTION
/*-----------------------------------------------------------------------------------*/
#contact-us{
    background-image: url("../img/contact.jpg");
    width:100%;
    background-attachment: fixed;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
	padding: /*top*/40px /*right*/80px /*bottom*/30px /*left*/80px;
}
#contact-us h1{
	color: #ff6600;
	font-family: 'Anton', sans-serif;
	padding-bottom: 20px;
}
#contact-form{
	padding: 70px;
}
#yourMessage{
	resize: none;
}
#btn{
	text-align: right;
}
#submit-message{
	padding: /*top*/10px /*right*/30px /*bottom*/10px /*left*/30px;
}

.address{
	padding-bottom: 10px;
}
.address h2{
	color: #003399;
	font-family: 'Anton', sans-serif;
	font-size: 20px;
}
.address p{
	color: #000000;
}

#map{
	width: 100%;
	height: 350px;
}
iframe {
    display:block;   
}
/*=======================================================
            Footer Section
========================================================*/
.footer {
    padding: /*top*/10px /*right*/0 /*bottom*/10px /*left*/0;
    background-color: #000000;
    font-size: 12px;
    color:#b0b0b0;
}
.copyright{
    padding-top: /*top*/10px;
}
.copyright ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-align: left;
    font-size: 15px;
}
.copyright ul li{
    display: inline-block;
}
.copyright ul li span{
    padding-right: 10px;
    color: #ffffff;
}
.copyright ul li a{
    border-left: 1px #ffffff solid;
    padding: 10px;
    color: #ffffff;
    text-decoration: none;
}
.copyright ul li a:hover {
    color: #ff6600;
}

/*-----------------------------------------------------------------------------------*/
/*  BUTTON TO TOP
/*-----------------------------------------------------------------------------------*/
.scrolltop {
  	display:none;
  	width:100%
  	margin:0 auto;
  	position:fixed;
  	bottom:40px;
  	right:2px;	
}
.scroll {
  	position:absolute;
  	right:20px;
  	bottom:20px;
  	background:rgba(255, 102, 0, 0.7);;
  	padding:15px;
  	text-align: center;
  	margin: 0 0 0 0;
  	cursor:pointer;
  	transition: 0.5s;
  	-moz-transition: 0.5s;
  	-webkit-transition: 0.5s;
  	-o-transition: 0.5s; 		
}
.scroll:hover {
  	background:rgba(255, 102, 0, 1);;
  	transition: 0.5s;
  	-moz-transition: 0.5s;
  	-webkit-transition: 0.5s;
  	-o-transition: 0.5s; 		
}
.scroll:hover .fa {
	 padding-top:-10px;
}
.scroll .fa {
	color: #ffffff;
  	font-size:30px;
  	margin-top:-5px;
  	margin-left:1px;
  	transition: 0.5s;
  	-moz-transition: 0.5s;
  	-webkit-transition: 0.5s;
  	-o-transition: 0.5s; 	
}
/*-----------------------------------------------------------------------------------*/
/*  ANIMATION MOUSE SCROLL
/*-----------------------------------------------------------------------------------*/
.icon-scroll,
.icon-scroll:before {
  	position: absolute;
  	left: 50%;
}
.icon-scroll {
 	width: 30px;
  	height: 55px;
  	margin-left: -20px;
  	top: 92%;
  	margin-top: -35px;
  	box-shadow: inset 0 0 0 2px #fff;
  	border-radius: 25px;
    -webkit-animation-duration: 1.7s;
          	animation-duration: 1.7s;
    -webkit-animation-iteration-count: infinite;
         	animation-iteration-count: infinite;
    -webkit-animation-name: scroll;
          	animation-name: scroll;
}
.icon-scroll:before {
	content: '';
	width: 4px;
	height: 15px;
	background: #fff;
	margin-left: -3px;
	top: 7px;
	border-radius: 3px;
}
@-webkit-keyframes scroll {
	0% {
	    opacity: 0;
	}
	10% {
	    opacity: 0;
	}
	50% {
	   	opacity: 0.8;
	}
	90% {
	  	opacity: 0;
	}
	100% {
	    opacity: 0;
	    -webkit-transform: translateY(30px);
	            transform: translateY(30px);
	}
}
@keyframes scroll {
  	0% {
   	 	opacity: 0;
  	}
  	10% {
    	opacity: 0;
  	}
  	50% {
    	opacity: 0.8;
  	}
  	90% {
   		opacity: 0;
  	}
  	100% {
   	 	opacity: 0;
        -webkit-transform: translateY(30px);
            	transform: translateY(30px);
  	}
}

/*xs*/
@media (max-width: 767px) {
	#custom-navbar.navbar{
		min-height: 50px;
	}

	#custom-navbar.navbar-default .navbar-nav{
		padding-top: 0px;
	}
	#custom-navbar.navbar-default .navbar-brand img{
		width: 30px;
	}
	#home,
	#our-team,
	#contact-us{
	    background-size: cover;
	}

	#about-us,
	#our-team,
	#products,
	#clients,
	#contact-us{
		padding: /*top*/20px /*right*/20px /*bottom*/30px /*left*/20px;
	}

    #contact-form{
		padding: 0;
	}
	.address{
		padding-top: 20px;
	}

	/*Animation Mouse Scroll*/
	.icon-scroll{
		display: none;
	}
}

/*sm*/
@media (min-width: 768px) and (max-width: 991px) {
	#home{
	    background-size: cover;
    	/*padding-top: 350px;*/
	}

	#our-team,
	#contact-us{
	    background-size: cover;
	}

	#about-us,
	#our-team,
	#products,
	#clients,
	#contact-us{
		padding: /*top*/20px /*right*/20px /*bottom*/20px /*left*/20px;
	}

	#contact-form{
		padding: 0;
	}
	.address{
		padding-top: 20px;
	}

	/*Animation Mouse Scroll*/
	.icon-scroll{
		display: none;
	}
}

/*md*/
@media (min-width: 992px) and (max-width: 1199px) {
}

/*lg*/
@media (min-width: 1200px) {
	#home{
	    background-size: cover;
    	/*padding-top: 330px;*/
	}
}

@media (min-width: 1200px) and (max-height: 800px) {
	#home{
	    background-size: cover;
    	/*padding-top: 300px;*/
	}
}