/*light red #BE1E2D
	Dark red #94111E
*/

@font-face {
  font-family: 'GothamXLight';
  src: url(../fonts/Gotham-XLight.woff) format('woff');
}

@font-face {
  font-family: 'GothamXLightita';
  src: url(../fonts/Gotham-XLightita.woff) format('woff');
}
@font-face {
  font-family: 'GothamLight';
  src: url(../fonts/Gotham-Light.woff) format('woff');
}

@font-face {
  font-family: 'GothamMedium';
  src: url(../fonts/Gotham-Medium.woff) format('woff');
}

@font-face {
  font-family: 'GothamBook';
  src: url(../fonts/Gotham-Book.woff) format('woff');
}

@font-face {
  font-family: 'GothamBold';
  src: url(../fonts/Gotham-Bold.woff) format('woff');
}

@font-face {
  font-family: 'GothamBlack';
  src: url(../fonts/Gotham-Black.woff) format('woff');
}


@font-face {
  font-family: 'GothamBlackita';
  src: url(../fonts/Gotham-Blackita.woff) format('woff');
}


@font-face {
  font-family: 'Bebas';
  src: url(../fonts/BEBAS.woff) format('woff');
}

@font-face {
  font-family: 'BebasThin';
  src: url(../fonts/BebasNeueThin.woff) format('woff');
}

@font-face {
  font-family: 'BebasBook';
  src: url(../fonts/BebasNeueBook.woff) format('woff');
}

@font-face {
  font-family: 'BebasRegular';
  src: url(../fonts/BebasNeueRegular.woff) format('woff');
}

@font-face {
  font-family: 'Zingrust';
  src: url(../fonts/zingrust-base.woff) format('woff');
}

@font-face {
  font-family: 'Capella';
  src: url(../fonts/capellacondbold.woff) format('woff');
}

html, body{
/*	height: 100%;*/
	font-family: 'BebasBook';
	transition: background-color .5s;
}


/*FONTS*/

.font1{
	font-family: 'GothamXLight'
}

.font2{
	font-family: 'Zingrust'
}

.font3{
	font-family: 'Capella'
}

.font4{
	font-family: 'Bebas'
}

.font5{
	font-family: 'GothamBlack'

}

.font6{
	font-family: 'BebasThin'
}

.font7{
	font-family: 'BebasBook'
}

.font8{
  font-family: 'BebasRegular'
}
/*FONT SIZES*/

h1{
	font-size: 5vw;
	line-height: 1;
}

h2{
	font-size: 4vw;
	line-height: 1;
}

h3{
	font-size: 3vw;
	line-height: 1;
}

h4{
	font-size: 6vw;
	color: #ffffff;
}

h5{
	font-size: 2.5vw;
}

h6{
	font-size: 1.25vw;
/*	text-align: center;*/
/*	line-height: 1.5;*/
}

.h7{
	font-size: .25vw;
}

.h8{
	font-size: 8vw;
}

.h9{
  font-size: 1vw;
}


/*FONT PROPERTIES*/

.lh1{
	line-height: .25;
}

.a1{
	color:white;
	text-decoration: none;
}

.a1:hover{
	color:#F5891F;
	text-decoration: none;
}

.a2{
	color:black;
}

.a2:hover{
	color:#BE1E2D;
}

.kern{
	letter-spacing: 2.5px;
}

.kern2{
	letter-spacing: 1.5px;
}

/*FONT EFFECTS*/

.shadow1{
	text-shadow: 3px 3px 15px #000000;
	text
}

.shadow2{
  text-shadow: 2px 2px 8px #757575;
  text
}


/*BG ELEMENTS*/

.orange-background{
 background-image: linear-gradient(to bottom right, #F5891F, #EE3E30);
}

.grey-background{
 background-color: #292C30;
}

.gery-background2{
 background-color: #EC6724;
}

.welcomebg{
	background-image: url(../images/welcome.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}


/*NAV BAR*/

.bg-light{
	background-color: #EC6724 !important;
	color:#fff;
}

.navbar-nav,
.nav-link,
.navbar-light{
	color:#ffffff !important;
}


/*ID SECTIONS*/

#hero{
	height:1000%;
	width:100%;
	background-image: url("../images/hero_bg_2.jpg");
	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
  	position: relative;
}


#about{
	background-image: url("../images/about-Us-bg.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

#contact{
	background-image: url("../images/contact-us-bg.jpg");
	background-repeat: no-repeat; 
	background-size: 100%;
	background-position: center;
}

#welcome{
	background-image: url("../images/welcome-bg.jpg");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}

#logo{
  background-image: url("../images/logo.svg");
}

.pc{
	background-image: url(../images/pc.jpg);
}

.gd{
	background-image: url(../images/gd.jpg);
}

.wd{
	background-image: url(../images/wd.jpg);
}

.services{
	white-space: nowrap;
}

/*PARALLAX*/

.parallax { 
  /* The image used */
  background-image: url("../images/Hero_bg_2.jpg");

  /* Set a specific height */
/*  height: 500px;*/ 


  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.parallax2 { 
  /* The image used */
  background-image: url("../assets/images/welcome.jpg");

  /* Set a specific height */
  height: 25vw; 

  /* Create the parallax scrolling effect */
  background-attachment: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.px3{ 
  /* The image used */
  background-image: url("../images/about-us-bg.jpg");

  /* Set a specific height */
  height: 100%; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

#px4{ 
  /* The image used */
  background-image: url("../images/contact-us-bg.jpg");

  /* Set a specific height */
  height: 100%; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}



#px4m{ 
  /* The image used */
  background-image: url("../images/contact-us-mobile.jpg");

  /* Set a specific height */
  height: 100%; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/*MOBILE IMAGE SWAP*/

@media only screen and (max-width : 480px) {
  #px4{background-image: url("../images/contact-us-mobile.jpg");
  height: 100%;
}


.image_full{
   display:block;
  }

 .image_mobile{
  display:none;
 }


  .image_mobile{
   display:block;
  }
}

/*POSITIONING*/

.margin{
	margin:auto;
}

.margin_left{
	margin-left: auto;
}

.margin_right{
	margin-right: auto;
}

.margin_right2{
	margin-right: 8vw;
}

.margin_bottom{
	margin-bottom: auto;
}

.spacing1{
  letter-spacing: 0px;
}

.icons{
	display: flex;
	justify-content: space-around;
/*	letter-spacing: 15px;*/
	font-size: 2.5vw;
}

.icons2{
	display: flex;
	justify-content: space-around;
	letter-spacing: 2.5px;
}

.freeze{
	position: fixed;
}

/*COLUMNS*/

.columns1{
  flex: 1 1 100%;
}

.columns2{
	flex: 1 1 50%;
}


.columns3{
	flex: 1 1 33.3%;
}
/*
.columns3 :hover {
  color: #EC6724;
}*/


/********* Simple or original overlay *******/

/* Main container */
.overlay-image {
 position: relative;
 width: 100%;

}

/* Original image */
.overlay-image .image {
 display: block;
 width: 100%;
 height: auto;
}

/* Original text overlay */
.overlay-image .text {
 color: #fff;
 font-size: 3vw;
 line-height: 1.5em;
 text-shadow: 2px 2px 2px #000;
 text-align: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
}

@media screen and (max-height: 450px) {
  .text {font-size: 1vw;}
}

/********* Overlay on hover *******/

/* New overlay on hover */
.overlay-image .hover {
 position: absolute;
 top: 0;
 height: 100%;
 width: 100%;
 opacity: 0;
 transition: .5s ease;
}

/* New overlay appearance on hover */
.overlay-image:hover .hover {
 opacity: 1;
 background-color: rgba(0,0,0,0.75);
}


/*COLORS*/

/*HEX CODES: Light Orange : #F5891F 	Mid Orange: #EC6724 	Dark Orange: #EE3E30 	Light Grey:#4F4F4F	 Dark Grey: #303030*/

.white{
	color:#ffff;
}

.black{
	color:black;
}

.l_orange{
	color:#F5891F;
}

.m_orange{
	color:#EC6724;
}

.d_orange{
	color:#EE3E30;
}

.Grey{
	color:#292C30;
}

.o_gradient1{
	color: linear-gradient(to bottom right, #F5891F, #EE3E30);
}

.g_gradient1{
	color: linear-gradient(to bottom right, #4F4F4F, #303030);
}

/*PADDING*/

.p1{
	padding: 10vw;
}

.p2{
	padding: 15vw;
}

.pt1{
	padding-top: 2vw;
}

.pt2{
	padding-top: 4vw;
}

.pb1{
	padding-bottom: 2vw;
}

.pb2{
	padding-bottom: 4vw;
}

.plr1{
	padding-left: 10px;
	padding-right: 10px;
}

.plr2{
	padding-left: 20px;
	padding-right: 20px;
}

.plr3{
	padding-left: 8vw;
	padding-right: 8vw;
}

.plr4{
	padding-left: 40vw;
	padding-right: 40vw;
}

.pl1{
	padding-left: 12%;
}

.pl2{
	padding-left: 2.5vw;
}

.pr1{
	padding-right: 5vw;
}

.pr2{
	padding-right: 3.5vw;
}

.pl1{
	padding-left: 5vw;
}

#footer{
	padding-top: 5px;
	padding-bottom: 5px;
}


/*SOCIAL MEDIA ICONS*/

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

.social-icons li {
  display:inline-block;
  list-style-type:none;
  -webkit-user-select:none;
  -moz-user-select:none;
  }

.social-icons li a {
  border-bottom: none;
  }

.social-icons li img {
  width:7vw;
  height:7vw;
}



/*NAV BAR 2*/

/*body {
  transition: background-color .5s;
}*/

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
/*  background-color: #111;*/
  /*background-color: #292C30;*/
  background-image: linear-gradient(to bottom left, #292C30, #24272A);
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidenav a:hover {
  color: #EC6724;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

#main {
  transition: margin-left .5s;
  padding: 0px 16px 0px 16px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

/*NAV BAR BUTTONS*/

.sidenav1 {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
/*  background-color: #111;*/
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidenav1 a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
/*  color: #818181;*/
  display: block;
  transition: 0.3s;
}

.sidenav1 a:hover {
  color: #EC6724;
}

.sidenav1 .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

/*SLIDESHOW*/