@import url('https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed');
@import url('../fonts/verdana.ttf');



/*IDs*/

#nav-service {
	z-index: 100;
	position: fixed;
	padding: 50px;
	right: -10px;
	top: 20%;
	width: 165px;
	color: white;
	background-color: rgba(0, 0, 0, 0.5);
	border-radius: 10px;
	text-align: left;

}

#nav-service ul {
	margin-left: -55px;
}

#nav-service-ul li {
	padding: 2px 0; 
	transition: 0.2s ease;
}

#nav-service-ul li:hover {
	color: skyblue;
}


body {
	margin: 0;
	background-color: white/*#505153*/;
}

/*FONTS*/
* {
	font-family: 'Barlow Semi Condensed', sans-serif;
	/*font-family: 'verdana';*/
}

/*COLOR & BACKGROUND*/
.blue {color: #2478da;}
.white {color: white;}
.black {color: black}
.grey {color: #505153;}
.red {color: #ff4d4d;}

.background-white {background-color: white;}
.background-grey {background-color: rgb(30,30,30);}
.background-blue {background-color: #2478da;}
.background-products {background-color: #3d4247}

/*NAV*/
.navigation {
	
}

/*SHADOW & BORDER*/
.text-shadow-home {
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}

.text-shadow {
	text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
}

.text-shadow-2 {
	text-shadow: 2px 2px 2px rgba(0,0,0,0.3);
}

.shadow {
	/*box-shadow: 10px 10px 20px rgba(0,0,0,0.3);*/
	box-shadow: 0 0 15px 2px rgba(0,0,0,0.5);
}

.border-shadow {
	/*box-shadow: 10px 10px 20px rgba(0,0,0,0.3);*/
	box-shadow: 0 0 10px 1px rgba(0,0,0,0.3);
}

.shadow-bottom {
	box-shadow: 0 0px 20px rgba(0,0,0,0.5);
}

.border-vertical {
	border-right: 2px #2478da solid;
	border-left: 2px #2478da solid;
}

.border-top {
	border-top: 2px #2478da solid;
}
.border-bottom {
	border-bottom: 1px #2478da solid;
}

.border-bottom-white {
	border-bottom: 1px white solid;
}

.border-red {border-bottom: 2px red solid;}


.border-nav {
	border-bottom: 2px #2478da solid;
}

.border-top-lg {
	width: 80%;
	margin: 0 10% 0 10%;
	margin-top: 40px;
	margin-bottom: 40px;
	border-bottom: 2px #2478da solid;
}

.border-bottom-home {
	width: 80%;
	margin: 0 10% 0 10%;
	margin-top: 40px;
	margin-bottom: 40px;
	border-bottom: 1px #2478da solid;
}

.border-bottom-product {
	margin-top: 50px;
	margin-bottom: 50px;
	width:100%;
	/*margin: 0 10% 0 10%;*/
	border-bottom: 2px #2478da solid;
}


.border-sm {
	width: 30%;
	margin-left: auto;
	margin-right: auto;
	border-bottom: 1px #2478da solid;
}

.border-header {
	width: 100%;
	border-bottom: 1px #2478da solid;
}

/*CONTAINERS*/

.container-dropdown-40 {
	width: 40%;
	margin: 0 auto
}

.container-dropdown-70 {
		width: 70%;
		margin: 0 auto;
}

.container-dropdown-90 {
		width: 90%;
		margin: 0 auto;
}

/*BUTTON*/

.button-dropdown {
	background: none;
	border: none;
}


/*MANIPULATION*/
.transition {
	transition: .2s ease;
}

.margin-none {
	margin-left: 0px;
	margin-right: 0px; 
}

.box {
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}

.li {
	list-style-type: none;
}

.hyperlink {

	text-decoration: none;
	color: inherit;
}

.hyperlink:hover {
	text-decoration: none;
	color: inherit;
}

.hyperlink:focus {
	text-decoration: none;
	color: inherit;
}

.margin {
	margin: 50px;
}

.margin-products {
	margin: 50px 200px;
}

.margin-center {
	margin: 0 auto;
}

.margin-top-30 {
	margin-top: 30px;
}

.margin-top-50 {
	margin-top: 50px;
}

.margin-home{
	margin-top: 50px; 
}

.box-fit {
	margin-top: 30px;
	width: 70%;
	margin-left: auto;
	margin-right: auto; 
}

.box-fit-products {
	margin-bottom: 50px; 
}

.inline {
	display: inline;
}

/*IMAGE*/
.image-brand {
	margin: 8px 0 0 5px;
	max-width:100px;
	max-height: auto;
}

.image-icon-about {
	padding: 20px;
	max-width:100px;
	max-height: auto;
}

.image-product {
	height: 300px;
	width: 100%;
	
	background-image: url(../img/home.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: .2s ease;
}

.image-product-second {
	height: 400px;
	width: 100%;
	

	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: .2s ease;
}


.image-hi-speed-home {background-image: url(../img/hi-speed-home.jpg);
}

.image-private-ta-home {background-image: url(../img/private-ta-home.jpg);
}

.image-industrie-ta-home {
	background-image: url(../img/industrie-ta.jpg);
	background-position: bottom;
}



/*.image-product:hover {
	box-shadow: 0 0 20px 10px #2478da;
}*/

.image-box {
	margin: 50px 0 0 0;
	width: 250px;
	height: auto;
}

.hotfix {
	padding-left: 0;
	padding-right: 0;
}

/*TEXT*/

.uppercase {
	text-transform: uppercase;
}

.text-width-70 {
	margin: 0 15% 0 15%;
	width: 70%;
}

.text-center {
	text-align: center;
}

.text-justify { 
	text-align: justify; 
}

.text-right {
	text-align: right;
}

.text-left {
	text-align: left;
}
/*FOOTER*/
.icon-footer {
	padding-right: 20px;
	height: 15px;
	width: auto;
	
}

footer {
	margin-top: 100px;
	padding: 0 0 50px 0;
	height: 100%;
}


.home {
	height: 750px;
	background-image: url(../img/home1.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.home-image {
	height: 300px;
	background-image: url(../img/test.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	/*margin-top: -80px*/;
	margin-bottom: -100px;
	/*margin-left: 10%;
	margin-right: 10%;
	width: 80%; */
	
}

.why-we {
	min-height: 580px;
	background-image: url(../img/why-we.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: .2s ease;
}

.partners {
	height: 300px;
	background-image: url(../img/logo/brand-partner.png);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	margin: 0 10px;
}

.hover:hover {
	box-shadow: 0 0 20px 10px #2478da;
}

.hover-text:hover {
	color: #2478da;
}

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

	.home {
	height: 325px;
	background-image: url(../img/home1.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	}

	.box-fit {
		margin-top: 30px;
		width: 90%;
		 
	}

	.footer-fix {
		margin-left: 8%; 
	}
    
	.container-dropdown-40 {
		width: 85%;
		margin: 0 auto;
	}

	.container-dropdown-90 {
		width: 90%;
		margin: 0 auto;
	}

    .margin-fix {
    	margin-top: 50px;
    }

    .margin { 
         margin: 0;
	}

	.margin-why-we {
		margin-top: 30px;
		margin-bottom: 30px;

	}

	.margin-dropdown-top {
		margin-top: 50px;
	}

	.home-image {
		margin-bottom: -100px;
	}

	.why-we {
		height: 100%;
	}

	.partners {
		height: 500px;
		background-image: url(../img/logo/brand-partner-mobile.png);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	}
}


}