﻿/* =========================
   Menu RESPONSIVE
   ========================= */
@media screen and (max-width: 768px) {
	ul.general-menu{display:none;}
	#mobile-nav, ul.submenu_mobile, nav#mp-menu{display:block!important;}
	#mobile-link{left:10px;}
	header{background:none;}
	div#genheader{height:auto!important;}
	nav#mobile-nav{margin:0px; height:60px; padding-top:10px;}
	div#topheader{display:none;}
	/* logo */
	a.logo{display:none;}
	a.navbar-brand img{height:50px; max-width:100%;}
	a.navbar-brand{padding:0!important; margin:0!important;}
	nav#mobile-nav{border:none; background:#fcb52c}
	nav#mobile-nav button.navbar-toggle{border-color:#fff; float:left; margin-left:10px;}
	nav#mobile-nav span.icon-bar{background-color:#fff;}
	div#navbarCollapse{border:none; background:#fdbb30;}
	div#navbarCollapse ul li a{color:#fff; text-transform:uppercase;}
	div#navbarCollapse ul li{border-bottom:#fcc34b 1px solid;}
	div.latest-news{padding-bottom:0px!important}
	
	div#menu-content{display:none;}
	/* Quote */
	blockquote{max-width:100%!important;}
	
	/* JIRA */
	#atlwdg-trigger{display:none;}
	/* Mobile button menu */
	div.navbar-header button{position:absolute; border:none;}
	div.navbar-header a.navbar-brand{float:none!important; margin:0 auto!important; width:98px!important; display:block;}
	button#mobile-option{color:#fff; right:0px; top:10px; padding:2px 10px!important; font-size:20px; }

	/* Submenu */
	ul.submenu_mobile {list-style-type:none; margin:10px 0px; padding:0; text-align:center;}
	ul.submenu_mobile li{display:inline-block; text-transform:uppercase; font-size:14px; font-weight:bold; border-right:1px #e3e3e3 solid; padding:0px 5px;}
	ul.submenu_mobile li:last-child{border:none;}
	ul.submenu_mobile li a{color:#666;}

	div.mob-mask{position: absolute;top: 0;left: 0;z-index: 10000;background:#fff; opacity:0.4;display:none;width: 100%;height: 100%;cursor: pointer;}
	
	/* MAIN MENU */
	div.mp-level .mp-back{font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;text-transform: initial;font-size: 13px;font-weight: normal;padding-left: 35px; background:#fcb52c}
	div.mp-level .mp-back:after{content: "\e033"; top: 15px;font-size: 12px;color: #f4f4f4;}
	div.mp-level{background: #333;color: #fff;}
	div.mp-level.first{-webkit-box-shadow: inset 0 0 5px 5px #222!important;-moz-box-shadow: inset 0 0 5px 5px #222!important;box-shadow: inset 0 0 5px 5px #222!important;}
	div.mp-level h2{color:#fff!important;}
	div.mp-level h2 a{border:none!important;}
	div.mp-level ul li:before{color:#f4f4f4; padding-top:3px;}
	div.mp-level ul li:first-child a{box-shadow:none;}
	div.mp-level ul li:last-child a{border-bottom:none}
	div.mp-level ul li a {color:#f4f4f4!important; border-top: 1px solid #4d4d4d;
	border-bottom: 1px solid #1a1a1a; box-shadow:none;}
	
	
	/* RIGHT CONF MENU */
	div.sidr-class-btn-group button{padding:10px!important;}
	/* ITS-62736  */
	span.sidr-class-badge{float:right; border-radius:10px; color:#fff; background:#cc2200; padding:5px; line-height:30px; position:relative; display:inline-block; top:10px;}
	/* FOOTER */
	div.col-md-foot {width:100%;}
	span.foot_logo{display:none;}
	
	/* LEFT MENU */
	#lefthin.custom{display:block!important;}
	
} 

@media screen and (max-width: 990px) {
	/* LEFT MENU */
	#lefthin.custom{display:table-row!important; width:100%; background:none;}
	#lefthin.custom #menu{background-image:none; background-color:#fdf4e2;border-right:10px #fff solid;border-left:10px #fff solid;float:left; width:100%; margin-top:10px}
	#lefthin.custom #menu ul li.last{border:none;}
	#lefthin.custom .menu-bottom{display:none;}
}
/* =========================
   GENERAL MENU
   ========================= */ 
@media screen and (max-width: 991px) {
	ul.general-menu li.menu-cat div.inner-menu-cat{padding:0px 10px!important; font-size:13px!important}
}

/* =========================
   carousel
   ========================= */ 
@media screen and (max-width: 768px) {
	#my-carousel a.img_thmb img{width:inherit!important;}
}
/* =========================
   Article Images
   ========================= */ 
@media screen and (max-width: 990px) { 
	span.bdy .thumbnail{ margin:20px auto!important; float:none!important; max-width:100%!important;}
	.parallax-window.head{ min-height: 120px; height:120px;background: transparent;}
	.parallax-window.head .title{font-size:24px;}
}  
/* =========================
   HOMEPAGE Carousel
   ========================= */ 
@media screen and (max-width: 768px) {   
	div#full-width-slider .slide-text p{display:none;}
	div#full-width-slider{min-height:200px!important;}
	div#full-width-slider div.infoBlock h4{font-size:2.5em}
	div#full-width-slider div.infoBlock{top:30px;}
	#full-width-slider img.rsImg{top:0!important}
	div.credit{display:none!important}
	
	div.latest-news a#latest-featured{bottom:0px!important; left:0px!important; right:0px!important}
	#full-width-slider div.infoBlock span.homeslider_button{padding:5px!important; font-size:12px;}
}

@media screen and (max-width: 990px) { 
	div.latest-news div#latest-news ul li{border-right:none!important; border-bottom:1px #E2A72B solid; min-height:initial!important;}
	div.latest-news div#latest-news span.news-link{border:none!important}
	div#full-width-slider div.infoBlock h4{font-size:2em}
	div#full-width-slider div.infoBlock p{display:none!important}
}
/* =========================
   MACHINE PAGE
   ========================= */ 
@media only screen and (max-width: 1500px) {
	div.machine-light{background:#fff!important}
} 
@media only screen and (max-width: 768px){
	div.machine-section .thumbnail{ margin:20px auto!important; float:none!important; max-width:100%!important;}
	div.machine-section .animation{width:100%!important;}
	div.machine-section .animation iframe{display:none!important;}
	div.machine-section .parallax-window {min-height:220px!important; height:220px!important; padding:0px!important}
	div.parallax-window .title{font-size:30px;}
	#tkmk_wrap #controller{position:inherit!important; width:100%!important; left:0!important; margin:0!important; top:0!important;}
	#tkmk_wrap #controller h4, #tkmk_wrap #controller p, #tkmk_wrap #controller ul,  #tkmk_wrap #controller a{text-align:center!important;}
	#tkmk_wrap #controller ul{list-style-type:none!important}
	div#tkmk_wrap.mach div.descr{position:absolute!important; bottom:inherit!important; top:0!important; left:0!important; right:0!important; width:100%!important;;}
	#tkmk_wrap #machine #bkgd, #tkmk_wrap #machine .overlay{left:0!important; margin:0!important; width:100%}
	#tkmk_wrap #machine #bkgd, #tkmk_wrap #machine .overlay, #tkmk_wrap #machine img{width:100%!important;}
	#tkmk_wrap .descr p{font-size:13px!important;}
	
	#tkmk_wrap.supporting .descr{width:100%!important; left:0!important; top:0!important; float:left!important; position:relative!important}
	#tkmk_wrap.supporting #controller{float:left!important; position:relative!important; top:initial!important; background:rgba(0,0,0,0.6)!important; height:auto!important}
	ul#statements-tab li a { font-size: 20px!important;}
	ul#statements-tab li {width:100%!important;}
}  
@media (max-width: 1500px) {
  #left-component{
	display: none!important;
  }
} 

@media screen and (max-width: 1100px) {
	#tkmk_wrap #facts span.timer{font-size:28px;}
	#tkmk_wrap #facts .fact-single{padding:10px 0px;}
}
  
/* =========================
   Procurements
   ========================= */  
@media only screen and (max-width: 768px){  
	ul#proc_tab li {width: 100%!important;}
	ul#proc_tab li.active a{border-bottom:none!important}
	ul#proc_tab li a{border-bottom:1px #999 solid;}
	div.proc.filter-option, a.clear-filter{display:none!important}

}
/* =========================
   Whatsnew
   ========================= */ 
@media screen and (max-width: 768px) {
	a.newsline_print_link{display:none!important;}
} 

/* =========================
   DG section
   ========================= */ 
@media screen and (max-width: 768px) {
	nav#dg-nav{margin:15px!important;left:0px!important }
	nav#dg-nav a{font-size:10px!important; padding:5px!important}
	nav#dg-nav a i{display:none!important; }
}

/* =========================
   NEWS Section
   ========================= */ 
@media screen and (max-width: 768px) {
	div.prog_carousel .bx-wrapper{width:100%!important;}
	div.prog_carousel #bx-pager{display:none!important}
}  

/* =========================
   NEWS Section
   ========================= */ 
@media screen and (max-width: 768px) {
	div#conference_event ul.nav li a{font-size:12px!important}
} 
 
/* =========================
   Full screen Galleries
   ========================= */ 
@media screen and (max-width: 768px) {
	#gallery-1 > div:hover .rsGCaption, #construction-slideshow > div:hover .rsGCaption{width:100%!important; top:0px!important; left:0px!important; bottom:initial!important}
	#gallery-1 > div:hover .rsGCaption p, #construction-slideshow > div:hover .rsGCaption p{display:none;}
}

/* =========================
   SiteMap
   ========================= */ 
@media (max-width: 767px) {
	div.sitemap-column{-webkit-column-count: 1!important; column-count:1!important}
}

/* =========================
   Breacrumbs
   ========================= */ 
span#ellipses{display:inline-block; float: left;top: 10px; position: relative;}
/* The responsive part */
.breadcrumb > li a {display:inline-block;}
.breadcrumb > li{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;    
}

.breadcrumb > *:nth-child(n+1) {
  display:none;
}
.invisible{display:none;}
/* === For phones =================================== */
@media (max-width: 767px) {
    .breadcrumb  > *:nth-last-child(-n+2) {
        display:inline-block;
    } 
    .breadcrumb  > * {
      /*  max-width: 60px; */
    }
	
	.breadcrumb li a{text-overflow:ellipsis;  max-width:100px; overflow:hidden; position:relative; top:5px;}

}

/* === For tablets ================================== */
@media (min-width: 768px) and (max-width:991px) {
    .breadcrumb  > *:nth-last-child(-n+4) {
        display:inline-block;
    } 
    .breadcrumb  > * {
       /*  max-width: 100px; */
    }
}

/* === For desktops ================================== */
@media (min-width: 992px) {
    .breadcrumb  > *:nth-last-child(-n+6) {
        display:inline-block;
    } 
    .breadcrumb  > * {
        /* max-width: 170px; */
    }
}    