body, html {
  height: 100%;
  margin-left: 15px;
  margin-right: 15px;
  font-family: 'Montserrat', sans-serif;

}
a h5{
	text-decoration: none;
	color: black;
	
	
	
}

a h5:hover{
	text-decoration: none;
	color: black;
	
}


.form-control-lg{
	-webkit-appearance: none;
	border: none;
	padding:0px;
	width: 100%;
}
.form-control-lg::placeholder{
		  -webkit-appearance: none;
		  padding: 0px !important;
		  margin: 0px !important;
		  font-size: 20px;
		  
	  }
.email-link{
	text-decoration: underline;
}

.form-group{
	border-bottom: 1px solid rgba(142,142,142,0.25);
}
.textarea-style{
	border: none;
	border-bottom: solid 1px black;
	padding:0px;
	width: 100%;

}
.fa-times{
	float: right;
}

.align-ul{
	position: absolute;
    top: 20%;
   }

.collapse-menu{
	padding-top: 10px;
	background-color:rgba(0,0,0,.7) ;
	position: fixed;
	top:8%;
	right: 30px;
	height: 100%;
	z-index: 99 !important; 
	color: white;
	font-size: 25px;
	display: none;
	margin-top: auto;
 	margin-bottom: auto;
	
}
li{
	list-style-type: none;
	padding: 10px;
}
 li > a  {
		text-decoration: none;
		color: white;
	}	
	li > a:hover  {
		color: white;
		
	}

  #map-img{      
        content:url("assets/world map.png");
    }

.logo-img{
	height: 45px;
}

.collapse-img{
	height: 35px;
	 cursor: pointer; 
}
.btn-plane{
	height: 35px;
}
.btn-plane:hover{
	content:url("assets/paper plane black.png");
}
.footer-image{
	margin: 0 auto;
	
}
.footer-logo{
	height: 140px;
}
 
	  h3.about-title{
		font-size: 25px;
		padding-bottom: 40px;
		padding-top: 50px;
	  }
	
	  h3.marketing-title{
		 font-size: 25px;
		  padding-bottom: 60px;
		  padding-top: 60px;
		  
	  }
	  h3.experiance-title{
		font-size: 25px;
		  padding-bottom: 60px;
		  padding-top: 60px;
	  }
	  h3.global-title{
		  font-size: 25px;
		  padding-bottom: 80px;
		  padding-top: 60px;
	  }
	  h3.contact-title{
		  font-size: 25px;
		  padding-bottom: 70px;
		  padding-top: 90px;
	  }
	  
	  h5.experiance{
		  font-size: 17px;
		  padding-bottom: 30px;
		  padding-top: 15px;
	  }
	  h5.service{
		  font-size: 18px;
		  padding-bottom: 30px;
		  padding-top: 15px;
	  }

	  h5.email{
		  font-size: 18px;
		  padding-bottom: 10px;
		  padding-top: 120px;
	  }

.navbar-brand{
	padding-left: 20px;

}

.navbar{
	height: 75px;
	transition: 500ms ease;
  	background:white;
}
.navbar.scrolled{
  background:rgba(255,255,255,1);
	
}

.data{
	margin-right: 20px;
	
}

.hero-padding{
	padding-bottom: 5px;
}


.navbar-collapse{
	padding-left: 35px;
}

.hero-text-primary{
	font-size: 65px;
	
	
}
.hero-text-secondary{
	font-size: 14px;

}
.hero-text-link{
	font-size: 13px;
	text-decoration: underline;
	
}
	
.hero-placement{
	color: white;
	padding-left: 22%;
	position:absolute;
    top: 39%;
}
.class-for-justify{
  text-align: justify; /* For Edge */
  -moz-text-align-last: justify; /* For Firefox prior 58.0 */
	font-size:15px;
 
}

.b-section-panel__border {
  display: block;
  top:26.2%;
  left: 27.5%;
  width: 45%;
  height: 45%;
  pointer-events: none;
  position: relative;
}




/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) {
	

	
li{
	list-style-type: none;
	padding: 25px;
}
	 li > a  {
		text-decoration: none;
		color: white;
	}	
	li > a:hover  {
		color: white;
		text-decoration: none;
	}
	

.hero-text-primary{
	font-size: 60px;
	
	
}
.hero-text-secondary{
	font-size: 15px;

}
.hero-text-link{
	font-size: 12px;
	text-decoration: underline;
	
}
	
.hero-placement{
	color: white;
	padding-left: 15%;
	position:absolute;
    top: 40%;
}
	
.b-section-panel__border {
  display: block;
  top:30%;
  left: 15%;
  width: 70%;
  height: 45%;
  pointer-events: none;
  position: relative;
}

.hero-placement{
	color: white;
	padding-left: 8%;
	position:absolute;
    top: 45%;
}	
	
  
}



/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {

	.b-section-panel__border {
  display: block;
  top:26.2%;
  left: 12%;
  width: 80%;
  height: 45%;
  pointer-events: none;
  position: relative;
}

.hero-placement{
	color: white;
	padding-left: -2%;
	position:absolute;
    top: 43%;
}	

.data{
	margin-right: 0px;
	
}
.hero-text-primary{
	font-size: 60px;
	
	
}
.hero-text-secondary{
	font-size: 15px;

}
.hero-text-link{
	font-size: 10px;
	text-decoration: underline;
	
}
	
.b-section-panel__border {
  display: block;
  top:30%;
  left: 15%;
  width: 70%;
  height: 45%;
  pointer-events: none;
  position: relative;
}

.hero-placement{
	color: white;
	padding-left: 4%;
	position:absolute;
    top: 45%;
}	
	

  
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {

.navbar-toggler{
	margin-right: 0px;
}
.navbar-collapse{
	padding-left: 0px;
}
.navbar-brand{
	padding-left: 0px;
}
.data{
	margin-right: 0px;
	
}
.hero-text-primary{
	font-size: 60px;
	
	
}
.hero-text-secondary{
	font-size: 15px;

}

	
.hero-placement{
	color: white;
	padding-left: 7%;
	position:absolute;
    top: 40%;
}
}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) { /* STYLES GO HERE */}

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
	  

	 
.collapse-menu{
	padding-top: 10px;
	position: fixed;
	top:8%; 
	right: 30px;
	background-color:rgba(0,0,0,.9) ;
/*	background-color: red;*/
	color: white;
	display: none;
	font-size: 40px;

	
	
} 
	  
	  #about{
		margin-bottom: 35px;
		margin-top: 35px;
	  }
	  #service{
		  margin-bottom: 35px;
	  }
	  #experience{
		 margin-bottom: 35px; 
	  }
	  #global-footprint{
		  margin-bottom: 35px; 
	  }
	    #contact-us{
		  margin-bottom: 35px; 
	  }
	  
	
	  .fa-times{
	float: right;
		 padding-right: 80px;
		 padding-top: 30px;
}

	  
	  	  .hero-text-primary{
	font-size: 75px;
}
.hero-text-secondary{
	font-size: 32px;
	padding-right: 250px;

}
	  
.align-ul{
	position: absolute;
    top: 10%;
   }

	  h3.about-title{
		font-size: 60px;
		padding-bottom: 70px;
		padding-top: 90px;
	  }
	
	  h3.marketing-title{
		 font-size: 60px;
		  padding-bottom: 60px;
		  padding-top: 90px;
		  
	  }
	  h3.experiance-title{
		  font-size: 60px;
		  padding-bottom: 60px;
		  padding-top: 90px;
	  }
	  h3.global-title{
		  font-size: 60px;
		  padding-bottom: 80px;
		  padding-top: 90px;
	  }
	  h3.contact-title{
		  font-size: 60px;
		  padding-bottom: 20px;
		  padding-top: 120px;
	  }
	  
	  h5.experiance{
		  font-size: 35px;
		  padding-bottom: 40px;
		  padding-top: 20px;
	  }
	  h5.email{
		  font-size: 35px;
		  padding-bottom: 10px;
		  padding-top: 100px;
	  }
	  
	  
	    h5.service{
		  font-size: 40px;
		  padding-bottom: 80px;
		  padding-top: 40px;
	  }
	  p.class-for-justify{
		  font-size: 38px;
		  padding-left: 30px;
		  padding-right: 30px;
		  padding-botom: 15px;
		  padding-top: 15px;
	  }
	  .mobile-display{
		  font-size: 100px
	  }
	  .padding-class-mobile{
		  padding-top: 200px;
	  }
	  
	.navbar-brand{
	height:15px;
}
	  .logo-img{
	height: 95px;
	
	
}


	.navbar{
	height: 150px;
	padding-bottom: 100px;
	margin-top: 0px;
}
	  
	  .collapse-img{
		height: 85px;
		position: absolute;
		right: 5%;
		  cursor: pointer; 
}
	  

	  .btn-plane{
		 height: 75px; 
	  }
	  
/*
	  input::placeholder{
		  -webkit-appearance: none;
		  padding: 0; 
		  font-size: 30px;
		  
	  }
	  textarea::placeholder{
		  font-size: 32px;
		  padding: 0;
	  }
	  input{
		-webkit-appearance: none;  
		min-height:50px;
		padding: 0; 
		font-size: 30px;
        border-top: none;
		border-left: none;
		border-right: none;
	  }
	  textarea{
		margin-top: 50px;
		padding: 0;
	  }
*/
	 
	  .bottom-divider{
		  margin-top: 50px;
		  margin-bottom: 100px;
	  }
	  
/*
	  .input-style{
		   -webkit-appearance: none;
	border: none;
	border-bottom: solid 1px black;
	padding:0px;
	width: 100%;
	min-height: 500px;
	
}
.textarea-style{
	 -webkit-appearance: none;
	border: none;
	border-bottom: solid 1px black;
	padding:0px;
	width: 100%;

} 
	  	  input::placeholder{
			   -webkit-appearance: none;
		  font-size: 50px;
			min-height: 500px; 
			  padding: 0px;
		  
	  }
	  textarea::placeholder{
		   -webkit-appearance: none;
		  font-size: 50px;
		  min-height: 500px;
		  padding: 0;
	  }
*/
	  
	  .footer-logo{
	height: 300px;
}
	  .text-muted{
		  font-size: 25px;
	  }
	    #map-img{      
        content:url("assets/map_mobile.png");
    }
	  

	  
}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
	  
	  .hero-text-primary{
	font-size: 75px;
}
.hero-text-secondary{
	font-size: 32px;
	padding-right: 250px;

}
	  h3{
		  font-size: 45px;
	  }
	  .class-for-justify{
		  font-size: 36px;
		  padding-left: 30px;
		  padding-right: 30px;
		  padding-botom: 15px;
		  padding-top: 15px;
	  }
	  .mobile-display{
		  font-size: 100px
	  }
	  .padding-class-mobile{
		  padding-top: 200px;
	  }
	  
	.navbar-brand{
	height:15px;
	
}
}


.seperator{
	border-top: solid 1px rgba(0,0,0,1.00);
	width: 100%;
	position:relative;
	 box-shadow: 0px 2px 5px grey;
	
}

.marketing-hero { 
  /* The image used */
   margin-top: 60px;	
   background-image: url("assets/hero-consulting.jpg");
   width: 100%;
   top: 0;
   left: 0;
  /* Full height */
height: 96%;    
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
	

}

.advertising-hero{
	  /* The image used */
   margin-top: 3%;			
   background-image: url("assets/4 advertising.jpg");
   width: 100%;
   top: 0;
   left: 0;
  /* Full height */
  height: 96%;  
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.social-hero{
	  /* The image used */
   margin-top: 3%;			
   background-image: url("assets/3 social media.jpg");
   width: 100%;
   top: 0;
   left: 0;
  /* Full height */
  height: 96%;    
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.digital-hero{
	  /* The image used */
   margin-top: 3%;		
   background-image: url("assets/5 digital.jpg");
   width: 100%;
   top: 0;
   left: 0;
  /* Full height */
  height: 97%;  
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.bg { 
  /* The image used */
  		
   background-image: url("assets/2.png");
   width: 100%;
   top: 0;
   left: 0;
  /* Full height */
  height: 100%;   
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
	
}
.hero{
	color: white;
	text-align: center;
	padding: 10%;
	
}


.bottom-divider{
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("assets/bottom-divider.png");
  width: 100%;
  height:30px; 
}


.container{
	height: 38em;
	border-top: solid 1px #FF00E5;
	border-right: solid 1px #FF00E5;
	border-bottom: solid 1px #FF00E5;
}

.container:before{
	position: absolute;
    content: "";
	height: 7em;
	border-left: solid 1px #FF00E5;
}

.rectancle-container{
	padding-top: 8em;
}

title-font-size{
	font-size: 2px;
}

#bold{
	font-weight: bold;
	font-size:15px;
}




#about{
	padding-top: 45px;
	
}

#service{
	padding-top: 45px;

}
#experience{
	padding-top: 45px;

}

#global-footprint{
	padding-top: 45px;
	
}
#contact-us{
	padding-top: 45px;
	
}

p{
	font-size: 16px;
}

.card-title{
	font-size: 24px;
}

.card{
	border: none;
}

.world-map{
	max-width: 100%;
}

/*
.form-control{
	border-top: none;
	border-left: none;
	border-right: none;
	
}
*/
/*
input {
	 outline: none;
}
*/


.reponsive-img img {
  width: 100%;
  display: block;
}

svg{
  width: 20px;
  height: 35px;
  color: white;
  transition:width 2s ease;
  overflow: visible;
}
svg:hover{
  width: 60px;
}li >




		.control{
	max-height: 700px;
}

.experiance-photo{
	max-height: 374px;
	width: 100%
}



/*
.send-button{
	color: #a8a8a8 ;
	background: url("assets/paper plane.jpg")

}

.send-button:hover{
	color: green;
	display: block;
	width: 100%;
	
}
*/
button{
	border: none;
	background-color: white;
}
.navbar-collapse{
	background-color: white;
	  margin-left: 35px;
  	margin-right: 35px;
} 

.b-section-panel__border-line {
  stroke: white;
  stroke-width: 1;
  fill: none;
  opacity: 0;
  stroke-dasharray: 3800;
  stroke-dashoffset: 3800;
}

.wf-active .b-section-panel--loads-first .b-section-panel__border-line {
  animation: lineDrawIn 8s cubic-bezier(.22, .61, .36, 1) forwards
}
.b-section-panel--light .b-section-panel__heading, .b-section-panel--light .b-section-panel__heading-link, .b-section-panel--light .b-section-panel__intro {
  color: #333
}
.b-section-panel--light .b-section-panel__heading-link:focus, .b-section-panel--light .b-section-panel__heading-link:hover {
  color: #000
}
.b-section-panel.js-animate-in--is-active .b-section-panel__border-line {
  animation: lineDrawIn 8s cubic-bezier(.22, .61, .36, 1) forwards
}
@keyframes lineDrawIn {
  0% {
    stroke-dashoffset: 3800;
    opacity: 0
  }
  20% {
    opacity: 1
  }
  to {
    stroke-dashoffset: 0;
    opacity: 1
  }
	
}	

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
  color: white;
  font-family: 'Montserrat', sans-serif;
  font-weight: 200;	
	
  
  
}
.strong{
	font-weight: 500;
}

.image-service:hover {
	filter: brightness(70%);
	transition-duration: 250ms;
}

.image-service:hover .centered{
	visibility: visible;
	transition-duration: 250ms;
}

a.img-a-tag{
	text-decoration: none;
	color: black;
	transition-duration: 250ms;
	
}
a.img-a-tag:hover{
	text-decoration: none;
	color: black;
}


p.effect-shine:hover {
  -webkit-mask-image: linear-gradient(-75deg, rgba(0,0,0,.6) 30%, #000 50%, rgba(0,0,0,.6) 70%);
  -webkit-mask-size: 200%;
  animation: shine 2s infinite;
}

@-webkit-keyframes shine {
  from {
    -webkit-mask-position: 150%;
  }
  
  to {
    -webkit-mask-position: -50%;
  }
}

