#mtl-media header, nav, section, container, div, ul, li, a, span, p, strong, button, h1, h2, h3, h4, h5, h6 {
	font-family: 'Oxanium', sans-serif !important;
	color:#232323 !important;
	letter-spacing: 0px !important;
} 


.mtl-media-bulb {

	width:65% !important;
	min-width: 250px !important;
	height: auto !important;

}

.mtl-service-title {
	font-size:28px;
	text-align: center;
}

.mtl-margin {
	margin-top: 5px !important;
	margin-bottom: 5px !important;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	line-height: 111% !important;
}

.mtl-service-subtitle {
	font-size: 75% !important;
	line-height: 88%;
	font-weight: 400;
	text-align: center;
}


.quotes {display: none;
	font-family: 'Oxanium', sans-serif !important;
	font-weight: 400;
}


.service-name {
	
	font-family: 'Oxanium', sans-serif !important;
	width:auto;
	height:auto;
	color: #454545 !important;
	text-transform: uppercase;
	letter-spacing: -1px !important;
	line-height: 90%;
	font-size: 31px;
	text-align: center;
	font-weight: 300;
	z-index: 999999999 !important;
	margin-top:-36px;
	border:none !important;
	outline: none !important;
transition: all 1s ease-in-out;
}






.portfolio-item a:link {
	border:none !important;
	outline: none !important;
	text-decoration: none !important;
}

.portfolio-item a:hover {
	border:none !important;
	outline: none !important;
	text-decoration: none !important;
}



.portfolio-item a:link {
	border:none !important;
	outline: none !important;
	text-decoration: none !important;
}

.portfolio-item a:hover {
	border:none !important;
	outline: none !important;
	text-decoration: none !important;
}



.bluestick {
	
font-weight: 900;
	color:#16588e !important;
	font-size: 69%;
	vertical-align: text-top;
	letter-spacing: -2px;
}

.redstick {
	
font-weight: 900;
	color:#f10f2a !important;
	font-size: 69%;
	vertical-align: text-top;
	letter-spacing: -2px;
}

.tightstick {
	letter-spacing: -5px !important;
}


.service-icon {
	width:180px !important;
	height: auto;
	margin:0px auto 0px auto !important;
	padding:0px;
	z-index: 0 !important;
	margin-bottom: 0px;
}





.thumb-info-wrapper-opacity-0 {
transition: all 1s ease-in-out;
	
}


.thumb-info-wrapper-opacity-0:hover {
transform: scale(1.1);

}


.thumb-info-wrapper-opacity-0:hover .service-name {
transform: scale(1.1);

}
.mtl-media-title {
	width:100%; min-width: 100%; max-width: 100%;
	height:auto;
	margin:85px auto 10px auto;
	padding:20px 0px 0px 0px;
	text-align: center;
	background:none;
	text-shadow: 1px 1px 1px #ffffff;
	font-weight: 200;
}


#mtl-title-1 {
	font-size: 150%;
	letter-spacing: -.5px;
	z-index: 500;
}


#mtl-title-2 {
	font-size: 120%;
	z-index: 500;
}



#plane { position: absolute; left: -50px; top:10px; /* <- not relevant for the animation */ }

#plane1 { position: absolute; left: -48px; top:12px; /* <- not relevant for the animation */ }


#plane2 { position: absolute; left: 1px; top:22px; /* <- not relevant for the animation */ }


#plane3 { position: absolute; left: -90px; top:31px; /* <- not relevant for the animation */ }

#plane4 { position: absolute; left: -30px; top:13px; /* <- not relevant for the animation */ }


#plane5 { position: absolute; left: -8px; top:16px;  /* <- not relevant for the animation */ }


#plane6 { position: absolute; left: -50px; top:20px;  /* <- not relevant for the animation */ }


#plane7 { position: absolute; left: -100px; top:30px; /* <- not relevant for the animation */ }








#plane8 { position: absolute; left: -50px; top:10px;  /* <- not relevant for the animation */ }


#plane9 { position: absolute; left: 3px; top:30px; /* <- not relevant for the animation */ }


#plane10 { position: absolute; left: -100px; top:30px;  /* <- not relevant for the animation */ }

#plane11 { position: absolute; left: -50px; top:10px; /* <- not relevant for the animation */ }


#plane12 { position: absolute; left: 0px; top:20px; /* <- not relevant for the animation */ }


#plane13 { position: absolute; left: -110px; top:30px;  /* <- not relevant for the animation */ }


#plane14 { position: absolute; left: -85px; top:30px;  /* <- not relevant for the animation */ }








#plane15 { position: absolute; left: -50px; top:6px;/* <- not relevant for the animation */ }


#plane16 { position: absolute; left: 0px; top:22px;  /* <- not relevant for the animation */ }


#plane17 { position: absolute; left: -100px; top:30px; /* <- not relevant for the animation */ }

#plane18 { position: absolute; left: -50px; top:14px; /* <- not relevant for the animation */ }


#plane19 { position: absolute; left: 0px; top:20px;  /* <- not relevant for the animation */ }


#plane20 { position: absolute; left: -100px; top:37px; /* <- not relevant for the animation */ }


#plane21 { position: absolute; left: -100px; top:34px; width: 80%;  /* <- not relevant for the animation */ }





#sky {
	z-index:999;
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	height:130px;
	margin:0px;
	padding:0px;
	background:url("../img/mtl-media/designs-01/montreal-sky.jpg");
	background-size: cover;
}


img.vert-move {
    -webkit-animation: mover 1.8s infinite  alternate;
    animation: mover 1.8s infinite  alternate;
}


.vert-move {
    -webkit-animation: mover 1.8s infinite  alternate;
    animation: mover 1.8s infinite  alternate;
}






.parallax-in {
    -webkit-animation: mover 1.5s infinite  alternate;
    animation: mover 1.5s infinite  alternate;
}




@-webkit-keyframes mover {
    0% { transform: translateY(3px); }
    100% { transform: translateY(-8px); }
}
@keyframes mover {
    0% { transform: translateY(3px); }
    100% { transform: translateY(-8px); }
}


#footer mtl-footer {
	background: #ffffff !important;
}


.no-map-scroll { position:relative; }

.click-map { width:100%; min-height:420px; position:absolute; top:0; }



.parallax-in {
	position:absolute;
	top:0px;
	margin-left:10%;
	width:555px;
	max-width: 90%;
	height: auto;
	margin-top:0px;
	margin-bottom:0px;
}



.dropdown-item .dropdown-toggle {
	border-color: #333333 !important;
}



.mtlsvc {
	 animation: animate 3s ease-out forwards infinite;
            animation-delay: 1s;
}


 @keyframes animate {
            0% {
                letter-spacing: -15px;
            }
  
            20% {
                letter-spacing: 10px;
            }
  
            100% {
                letter-spacing: 2px;
            }
        }



#barsup {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}