  .navbar-header img{
    width: 20%;
  height: 20%;
  margin-bottom: -7%;
}
.slide-left{
  
  overflow:hidden;
  position: absolute;
  top: 52%;
  left: 25%;
  animation: slide-right 5s;
  font-size: 2.5vw;
  color:white;
}


@keyframes slide-right {
  from {
    left:-15%;
  }

  to {
    left:25%;
  }
}


.wrap {
    display: flex;
    background: white;
    padding: 1rem 1rem 1rem 1rem;
    border-radius: 0.5rem;
    box-shadow: 7px 7px 30px -5px rgba(0,0,0,0.1);
    margin-bottom: 2rem;
}

.wrap:hover {
    background: linear-gradient(to right,#2E86C1 ,#85C1E9);
    color: white;
}

.ico-wrap {
    margin: auto;
}

.mbr-iconfont {
    font-size: 4.5rem !important;
    color: #313131;
    margin: 1rem;
    padding-right: 1rem;
}
.vcenter {
    margin: auto;
}

.mbr-section-title3 {
    text-align: left;
}
h2 {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.display-5 {
    font-family: 'Source Sans Pro',sans-serif;
    font-size: 1.4rem;
}
.mbr-bold {
    font-weight: 700;
}


.display-6 {
    font-family: 'Source Sans Pro',sans-serif;
    font-size: 1rem;}
    
.item-container{
    margin:auto;
}    
    
    

 #myFooter {
			background-color: #5EABDF;
			color: white;
			padding-top: 20px;
		}

		#map-container {
			height: 240px;
			width: 100%;
			margin-top: 30px;
			margin-bottom: 10px;
		}

		#myFooter .row {
			margin: 0 85px;
		}

		#myFooter .footer-copyright {
			background-color: #10222e;
			padding-top: 3px;
			padding-bottom: 3px;
			text-align: center;
		}

		#myFooter .footer-copyright p {
			margin: 10px;
			color: #ccc;
		}

		#myFooter .container {
			width: auto;
		}

		#myFooter ul {
			list-style-type: none;
			padding-left: 0;
			line-height: 1.7;
		}

		#myFooter h5 {
			font-size: 20px;
			color: white;
			font-weight: bold;
			margin-top: 30px;
		}

		#myFooter a {
			color: black;
			text-decoration: none;
			font-size:16px;
		}

		#myFooter a:hover,
		#myFooter a:focus {
			text-decoration: none;
			color: white;
		}

		#myFooter .social-networks {
			text-align: center;
			padding-top: 30px;
			padding-bottom: 38px;
		}

		#myFooter .fa {
			font-size: 30px;
			margin-right: 15px;
			margin-left: 20px;
			background-color: white;
			color: #182c39;
			border-radius: 51%;
			padding: 10px;
			height: 50px;
			width: 50px;
			text-align: center;
			line-height: 31px;
			text-decoration: none;
			transition: color 0.2s;
		}

		#myFooter .fa-facebook:hover {
			color: #2b55ff;
		}

		#myFooter .fa-facebook:focus {
			color: #2b55ff;
		}

		#myFooter .fa-youtube:hover {
			color: red;
		}

		#myFooter .fa-youtube:focus {
			color: red;
		}

		#myFooter .fa-instagram:hover {
			color: #00aced;
		}

		#myFooter .fa-instagram:focus {
			color: #00aced;
		}
		
		
	    #myFooter .career-footer{
	        margin: auto;
	        width: 200px;
	        padding: 10px;
	    }

    .fa-whatsapp:hover {
      color: red;
    }

    .fa-whatsapp:focus {
      color: red;
    }

		@media screen and (max-width: 767px) {
			#myFooter {
				text-align: center;
			}
			#myFooter .row {
				margin: 0;
			}
            
            #myFooter button{
                text-align: center;
               width: 100%;
            }
		}
		
		/* Set a style for buttons */
        .button-footer {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
		-webkit-tap-highlight-color: transparent;
}

.button-footer {
	width: 150px;
	height: 50px;
	cursor: pointer;
	border: none;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #7f5a83;
	background-image: linear-gradient(315deg, #7f5a83 0%, #0d324d 74%);
	background-size: 200% 100%;
	background-position: left;
	background-repeat: no-repeat;
	transition: 500ms;
}

.button-footer:before {
	
	color: rgba(255,255,255,0.5);
	font-size: 16px;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 140px;
	height: 40px;
	background-color: #1b2845;
	background-image: linear-gradient(315deg, #1b2845 0%, #274060 74%);
	transition: 500ms;
}

.button-footer b{
    color: #FFFFFF;
}

.button-footer:hover {
	background-position: right;
}

.button-footer:hover:before {
	color: rgba(255,255,255,0.8);
}

.button-footer:focus {
	outline: none;
}

        section {
    padding: 60px 0;
}

section .section-title {
    text-align: center;
    color: #007b5e;
    margin-bottom: 50px;
    text-transform: uppercase;
}



#tabs .threeD img{
    width:185px;
    position: absolute;
    top:590px;
    left: 272px;
    cursor: pointer;
    border-radius: 10%;
   

}

#tabs .threeD img:hover {
     color: #ffffff; 
    background: linear-gradient(to right,#2E86C1 ,#85C1E9);
    box-shadow: 0 0 10px #85C1E9;
}

  .first{
  position: relative;
  text-align: center;
  color: white;


}

.top-left {
  position: absolute;
  top: 8px;
  left: 16px;
}

 
 .threeD1 .wordD1 {
  overflow:hidden;
  position: absolute;
  top: 75%;
  left: 25.5%;
  font-size: 2.5vw;
  color:white;
  
}


 
.threeD1 .threeD1image  {
  color: white;
  white-space: nowrap;
  position: absolute;
  top: 67%;
  left: 29%;
  transform: translate(-50%, -50%);
  width: 15%;
 -webkit-filter: drop-shadow(0px 0px 0px rgba(255,255,255,0.80));
  -webkit-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  
}
.threeD1 .threeD1image:hover {
  -webkit-filter: drop-shadow(0px 0px 8px rgba(252, 240, 0));
}




 .threeD2 .wordD2  {
  overflow:hidden;
  position: absolute;
  top: 75%;
  left: 38.5%;
  font-size: 2.2vw;
  color:white;
}

  .threeD2 .threeD2image  {
  color: white;
  white-space: nowrap;
  position: absolute;
  top: 67%;
  left: 42%;
  transform: translate(-50%, -50%);
  width: 15%;
 -webkit-filter: drop-shadow(0px 0px 0px rgba(255,255,255,0.80));
  -webkit-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  
}
.threeD2 .threeD2image:hover {
  -webkit-filter: drop-shadow(0px 0px 8px rgba(252, 240, 0));
}
  

.threeD3 .wordD3  {
  overflow:hidden;
  position: absolute;
  top: 75%;
  left: 50%;
  font-size: 2.2vw;
  color:white;
}

  
.threeD3 .threeD3image  {
  color: white;
  white-space: nowrap;
  position: absolute;
  top: 67%;
  left: 57%;
  transform: translate(-50%, -50%);
  width: 15%;
 -webkit-filter: drop-shadow(0px 0px 0px rgba(255,255,255,0.80));
  -webkit-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  
}
.threeD3 .threeD3image:hover {
  -webkit-filter: drop-shadow(0px 0px 8px rgba(252, 240, 0));
}

.threeD4 .wordD4  {
  overflow:hidden;
  position: absolute;
  top: 76%;
  left: 7.5%;
  font-size: 2.2vw;
  color:white;
}

 

.threeD4 .threeD4image  {
  color: white;
  white-space: nowrap;
  position: absolute;
  top: 68%;
  left: 15.5%;
  transform: translate(-50%, -50%);
  width: 16%;
 -webkit-filter: drop-shadow(0px 0px 0px rgba(255,255,255,0.80));
  -webkit-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  
}
.threeD4 .threeD4image:hover {
  -webkit-filter: drop-shadow(0px 0px 8px rgba(252, 240, 0));
}

.mainword h1 {
  font-weight: 700;
  text-align: center;
  font-size: 3vw;
  font-family:  "Raleway", sans-serif;
  text-transform: uppercase;
  background: linear-gradient(90deg,#000, #109BFE, #fff, #000);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  background-repeat: no-repeat;
  background-size: 80%;
  letter-spacing: 2.5px;
  animation: shine 8s linear infinite;
  position: absolute;
  top:35%;
  left:50%;
  transform: translate(-50%, -50%);

}

@keyframes shine {
  0% {
    background-position-x: -500%;
  }
  100% {
    background-position-x: 500%;
  }
}

.mainword p {
  text-decoration: none;
  color: inherit;
  font-size: 1.5vw;
  font-weight: bold;
  padding-top: 0.5rem;
  padding-bottom: 0.8rem;

}

.carousel {
    margin-bottom: 0;
    padding: 0 40px 30px 40px;
}
/* The controlsy */
.carousel-control {
  left: -12px;
    height: 40px;
  width: 40px;
    background: none repeat scroll 0 0 #222222;
    border: 4px solid #FFFFFF;
    border-radius: 23px 23px 23px 23px;
    margin-top: 90px;
}
.carousel-control.right {
  right: -12px;
}
/* The indicators */
.carousel-indicators {
  right: 50%;
  top: auto;
  bottom: -10px;
  margin-right: -19px;
}
/* The colour of the indicators */
.carousel-indicators li {
  background: #cecece;
}
.carousel-indicators .active {
background: #428bca;
}

.carousel {
    margin-bottom: 0;
  padding: 0 40px 30px 40px;
}
/* Reposition the controls slightly */
.carousel-control {
  left: -12px;
}
.carousel-control.right {
  right: -12px;
}
/* Changes the position of the indicators */
.carousel-indicators {
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the colour of the indicators */
.carousel-indicators li {
  background: #c0c0c0;
}
.carousel-indicators .active {
background: #333333;
}

.card {
  /* Add shadows to create the "card" effect */
  transition: 0.1s;
}

/* On mouse-over, add a deeper shadow */
.card:hover {
  background-color: 0 16px 16px 0 rgba(0,0,0,0.7);
}



/* For mobile phones: */
[class*="col-"] {
  width: 100%;
}

@media only screen and (min-width: 600px) {
  /* For tablets: */
  .col-s-1 {width: 8.33%;}
  .col-s-2 {width: 16.66%;}
  .col-s-3 {width: 25%;}
  .col-s-4 {width: 33.33%;}
  .col-s-5 {width: 41.66%;}
  .col-s-6 {width: 50%;}
  .col-s-7 {width: 58.33%;}
  .col-s-8 {width: 66.66%;}
  .col-s-9 {width: 75%;}
  .col-s-10 {width: 83.33%;}
  .col-s-11 {width: 91.66%;}
  .col-s-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
  /* For desktop: */
  .col-1 {width: 8.33%;}
  .col-2 {width: 16.66%;}
  .col-3 {width: 25%;}
  .col-4 {width: 33.33%;}
  .col-5 {width: 41.66%;}
  .col-6 {width: 50%;}
  .col-7 {width: 58.33%;}
  .col-8 {width: 66.66%;}
  .col-9 {width: 75%;}
  .col-10 {width: 83.33%;}
  .col-11 {width: 91.66%;}
  .col-12 {width: 100%;}
}

