/*Sustainability microsite. Template design update - 2018 */




/*Design update is applied to desktop page version only*/
@media only screen and (min-width : 600px) {





/*FI desgin corrections*/

div.carouselbase_SliderBox_gradient_dark .anythingSlider {
    background: none;
}



/*Typography corrections*/
.carousel_sub_title {
    font-size: 1.4rem;
    color: #777;
    margin: 20px 0 25px 0;
    line-height: 1.9rem;
}


.carousel-text p, #contentLayer p {
    font-size: 1.2rem;
    line-height: 1.8rem;
    margin-bottom: 1rem!important;
}

#contentLayer * {
	box-sizing: border-box;
}


/*Microsite layout corrections*/
		.breadcrumb-microsite {
		    color: #666;
		    display: block;
		    font-size: 16px;
		    font-weight: bold;
		    margin-bottom: 5px;
		    margin-top: 5px;
		    display: none;
		}

		.microsite-nav {
		    position: relative;
		    font-size: 12px;
		    background: transparent url(../../docroot/ms/img/mainnavlayer_bg.jpg) repeat-x 0 0;
		    margin-top: 2rem;
		    background-color: rgba(255,255,255,0.2
		    );
		    /*width: 80%*/
		}


		/*no right and left borders*/
		#contentLayer {
		    border-left: 0px solid #b7babb;
		    border-right: 0px solid #b7babb;
		}

		/*microsite top navigation doesn't have border*/
		.microsite-border {
		    border: 0px solid #b7babb;
		        border-bottom-width: 0px;
		        border-bottom-style: solid;
		        border-bottom-color: rgb(183, 186, 187);
		    border-bottom: 0;
		    padding-left: 20px;
		}

		/*links */
		ul.triangle_list li span {
		    position: relative;
		    top: 0px!important;
		}



/*Microsite navigation*/

	#breadcrumb_layer {display: none!important;}

	.microsite-nav li.tabElement a:hover span.right, .microsite-nav li.tabElement a.active span.right, .microsite-nav li.firstElement a:hover span.right, .microsite-nav li.firstElement a.active span.right {
	    background: none!important;
	}

	.microsite-nav li.tabElement a span.right, .microsite-nav li.firstElement a span.right, .tab_navigation li a, .tab_navigation li.no_border a, .tab_navigation li.no_border_hover a {
	    background: none!important;
	}

	.microsite-nav li.tabElement a span.left, .tab_navigation li {
	    background: none!important;
	}

	.microsite-nav li.firstElement a.active span.left, .microsite-nav li.firstElement a:hover span.left, .tab_navigation li.selected, .tab_navigation li.hover {
	    background: none!important;
	}

	.microsite-nav li.firstElement a span.left, .microsite-nav li.firstElement a:link span.left, .microsite-nav li.firstElement a:visited span.left, .microsite-nav li.firstElement a:active span.left {
	    background: none!important;
	}


	/*last element */
	.microsite-nav li.lastElement a:link span.right, .microsite-nav li.lastElement a:visited span.right, .microsite-nav li.lastElement a:active span.right {
	    background: none!important;
	    color: #777;
	}

	.microsite-nav li.lastElement a:link span.left, .microsite-nav li.lastElement a:visited span.left, .microsite-nav li.lastElement a:active span.left {
	    background: none!important;
	    color: #777;
	}



	/*hover*/
	.microsite-nav li a  {
		border-bottom: 1px solid transparent;
	    -webkit-transition: border-bottom .5s;
	    -moz-transition: border-bottom .5s;
	    -ms-transition: border-bottom .5s;
	    -o-transition: border-bottom .5s;
	    transition: border-bottom .5s;
	}	

	.microsite-nav li a:hover {
	    border-bottom: 1px solid #777;
	    -webkit-transition: border-bottom .5s;
	    -moz-transition: border-bottom .5s;
	    -ms-transition: border-bottom .5s;
	    -o-transition: border-bottom .5s;
	    transition: border-bottom .5s;
	}

		.microsite-nav li a.active {
			border-bottom: 1px solid #777;
		}




/*Custom background*/

		#stage {
		 
		    background-position: left 120px !important;

		    box-shadow:  0 0 3px 2px rgba(140,140,140, 0.4);

		}


		#mtms-content {
		    background: transparent;
		    padding: 1px;
		}

		#frame_layer {
		    background-color: transparent;
		}

		#main_layer #frame_layer {
		    background-color: transparent !important;
		}

		#header_layer {
		    background-color: transparent;
		}




		/*Body background*/
		body {
			/*background: #e8f9e9;*/
		}



		body {
		    /*background: #e8f9e9 url(https://swiss2.mt.com/lab/about_us/sustainability/body4.jpg) 0 0 no-repeat;
		    background-size: cover;
		    background-attachment: fixed;*/
		}



/*Home page*/
.carousel_title {
 
    margin-top: 2rem;
}


/*Contact info section*/

	#myContactInfo {
		padding: 2rem;
		padding-left: 3rem;
		margin: 0;
		background: #f8f8f8;
	}

	#myContactInfo h3 {
		font-size: 14.6pt;
	}

	#myContactInfo p.column30 {
		display: block;
		width: 33%;
		margin: 0;
		padding: 0.5rem 2rem 0.5rem 0;
		float: left;

	}

		#myContactInfo p.column50 {
		display: block;
		width: 49%;
		margin: 0;
		padding: 0.5rem 8rem 0.5rem 0;
		float: left;	

	}


/*Page intro section*/

	.myTextBox {
		padding: 2rem;
		padding-left: 3rem;
		margin: 0;
		background: transparent;
	}

 
	.myTextBox h1.myHome {
		font-size: 4rem;
		line-height: 4.2rem;
		margin-bottom: 2rem;
		color: white;
	}

	.myTextBox H1 {
		font-size: 3rem;
		line-height: 3.2rem;
		margin-bottom: 2rem;
	}


	.myTextBox .myTextWrap {
		width: 80%;
	}

	#myIntro .myTextWrap {
		width: 55%;
	}

	.myCol80 {
		width: 80%;
	}

	#myIntro .myTextWrap p.myIntroText {
		font-weight: bold;
		font-size: 1.3rem;
		line-height: 140%;
	}

	.myTextBox .myTextWrap p, .myTextBox .myTextWrap a, .myTextBox .myTextWrap ul , .myTextBox .myTextWrap ol  {
		margin: 0 0 1.4rem 0;
	}

		.myTextBox .myTextWrap ol { margin-left: 1rem; }


	.myTextBox .myTextWrap a, .myTextBox .myTextWrap ul li, .myTextBox .myTextWrap ol li  {
		font-size: 1.2rem;
		line-height: 1.8rem;
	}

	.myTextBox .myTextWrap a::before {
		content: "";
		background: url("https://www.mt.com/dam/images_nav/triangle.png") 0 0 no-repeat;
		position: relative;
		display: inline-block;
		height: 1.4rem;
		width: 1.9rem;
		top: 2px;

	}

	.myTextBox .myTextWrap a.mypdf::before {
		content: "";
		background: url("https://media.mt.com/dam/mettler_toledo/about_us/innovation/pdf-logo.gif") 0 0 no-repeat;
		position: relative;
		display: inline-block;
		height: 1.4rem;
		width: 1.9rem;
		top: 2px;

	}


	.myTextBox img {
		float: right;
		margin: 0;
		width: 100%;
		height: auto;
	}





/*Infogram css adjustments*/
iframe .ig-container {
	background: transparent!important;
}


#bottom_meta_layer {
border-top: 0px solid #b7babb;
}


}








/*Mobile version optimization*/

@media only screen and (min-width : 0px) and (max-width: 1020px) {

	
	/*no between corp header and microsite navigation*/

	.breadcrumb-microsite {
		display: none!important;
	}


	.microsite-border {
		padding-top: 0!important;
	}



	/*link and file icons*/
	.myTextBox .myTextWrap a     {
		font-size: 1.2rem;
		line-height: 1.8rem;
	}

	.myTextBox .myTextWrap a::before {
		content: "";
		background: url("https://www.mt.com/dam/images_nav/triangle.png") 0 0 no-repeat;
		position: relative;
		display: inline-block;
		height: 1.4rem;
		width: 1.9rem;
		top: 2px;

	}


	 a.blue-link::before {
		content: "";
		background: url("https://www.mt.com/dam/images_nav/triangle.png") 0 0 no-repeat;
		position: relative;
		display: inline-block;
		height: 1.4rem;
		width: 1.9rem;
		top: 4px;

	}



	.myTextBox .myTextWrap a.mypdf::before {
		content: "";
		background: url("https://media.mt.com/dam/mettler_toledo/about_us/innovation/pdf-logo.gif") 0 0 no-repeat;
		position: relative;
		display: inline-block;
		height: 1.4rem;
		width: 1.9rem;
		top: 2px;

	}



}