/**********************************************************
	AUTHOR			: 	Prabhakaran J & Team
	EMAIL			: 	prabhakaran-j@hcl.com
	CONTACT			: 	9677304039
	TYPE			:	Adhoc Based Customised CSS
	
	Last Updated By	:	prabhakaran-j@hcl.com
***********************************************************/
		/* Tablet Landscape */
		@media screen and (max-width: 1060px) {
			#primary { width:67%; }
			#secondary { width:30%; margin-left:3%;}  
		}
		/* Tabled Portrait */
		@media screen and (max-width: 768px) {
			#primary { width:100%; }
			#secondary { width:100%; margin:0; border:none; }
		}
				
		/* SCROLLBAR */
		/* Let's get this party started */
		::-webkit-scrollbar {
			width: 10px;
		}

		/* Track */
		::-webkit-scrollbar-track {
			background: rgb(0, 78, 136);
			border: 4px solid transparent;
			background-clip: content-box;   /* THIS IS IMPORTANT */
		}
		
		
		/* Handle */
		::-webkit-scrollbar-thumb {
			background: rgb(203, 208, 211);
			border: 1px solid rgb(203, 208, 211);
		}
		
	
		
		
		.modal,.modal-body{
			border-radius:0;
			border:1px solid #F68121;
			background:url('img/tile.gif');
		}
		.panel,.panel-heading{
			border-radius:0;
		}
		
		/*--------------------FLOATING BUTTON-----------------------------*/
		.kc_fab_overlay{
		  z-index: 9998;
		  position: fixed;
		  top: 0;
		  left: 0;
		  width: 100%;
		  height: 100%;
		  z-index: 10;
		  background-color: rgba(255,255,255,0.5); /*dim the background*/
		}
		.kc_fab_wrapper{
			z-index: 9999;
			width:100%;
			height:240px;
			position:fixed;
			right:0px;
			bottom:0px;
			pointer-events:none;
		}
		.sub_fab_btns_wrapper{
		  right:0;
		  bottom:75px;
		  position:absolute;
		  display:none;
		  opacity: 0;
		  -webkit-transition: opacity 0.3s ease-in;
			   -moz-transition: opacity 0.3s ease-in;
				-ms-transition: opacity 0.3s ease-in;
				 -o-transition: opacity 0.3s ease-in;
					transition: opacity 0.3s ease-in;
		  pointer-events:all;
		}
		.sub_fab_btns_wrapper button[data-link-title]:hover:after{
		  content: attr(data-link-title);
		  opacity: 1;
		  transition: all 0.5s;
		  background: rgba(0, 0, 0, 0.4);
		  padding: 4px 10px;
		  border-radius: 3px;
		  color: rgba(255, 255, 255, 0.8);
		  font-size: 13px;
		  pointer-events: none;
		  position: absolute;
		  right: 110%;
		  min-width: 150px;
		}
		.sub_fab_btns_wrapper.show{
		  display:block;
		  opacity: 1;
		}
		.sub_fab_btns_wrapper button{
		  width:40px;
		  height:40px;
		  border-radius:100%;
		  background:#F44336;
		  margin-bottom:12px;
		  margin-right:26px;
		  padding:0;
		  border:none;
		  outline:none;
		  color:#FFF;
		  font-size: 19px;
		  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
		  transition:.3s;  
		  pointer-events:all;
		}
		button.kc_fab_main_btn{
		  background-color:#F44336;
		  width:60px;
		  height:60px;
		  border-radius:100%;
		  background:#F44336;
		  right:16px;
		  bottom:16px;
		  position:absolute;
		  margin-right:0;
		  margin-bottom:0;
		  padding:0;
		  border:none;
		  outline:none;
		  color:#FFF;
		  font-size:36px;
		  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
		  transition:.3s;  
		  -webkit-tap-highlight-color: rgba(0,0,0,0);
		  pointer-events:all;
		}
		.kc_fab_main_btn span{
		  transition:.5s;  
		}
		.kc_fab_main_btn:focus {
		  transform:scale(1.1);
		  transform:rotate(45deg);
		  -ms-transform: rotate(45deg);
			-webkit-transform: rotate(45deg);
		}

		.ink {
		  display: block;
		  position: absolute;
		  background:rgba(255, 255, 255, 0.3);
		  border-radius: 100%;
		  -webkit-transform:scale(0);
			 -moz-transform:scale(0);
			   -o-transform:scale(0);
				  transform:scale(0);
		  pointer-events:all;
		}

		.animate {
		  -webkit-animation:ripple 0.65s linear;
		   -moz-animation:ripple 0.65s linear;
			-ms-animation:ripple 0.65s linear;
			 -o-animation:ripple 0.65s linear;
				animation:ripple 0.65s linear;

		}

		@-webkit-keyframes ripple {
			100% {opacity: 0; -webkit-transform: scale(2.5);}
		}
		@-moz-keyframes ripple {
			100% {opacity: 0; -moz-transform: scale(2.5);}
		}
		@-o-keyframes ripple {
			100% {opacity: 0; -o-transform: scale(2.5);}
		}
		@keyframes ripple {
			100% {opacity: 0; transform: scale(2.5);}
		}

		/*-----------------------------------------------------*/
.mainpart{
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.ribbondiv{
	-webkit-box-shadow: 0 8px 6px -6px #BDBDBD;
	   -moz-box-shadow: 0 8px 6px -6px #BDBDBD;
	        box-shadow: 0 8px 6px -6px #BDBDBD;

	height:50px;
	background-color:#DFDFDF;
}
.searchbar{
	width:200px;
	border:1px solid #E9EAED;
	background-color:#E9EAED;
	color:#424242;
}
.searchbarproject{
	width:180px;
	border:1px solid #E9EAED;
	background-color:#F5F5F5;
	color:#424242;
}
.scrollContainer{
	 width:100%;
	 height:100%;
	 overflow-y:auto;
	 background-color:#E1F5FE;color:#FFF;
	 background:url('../img/tile.gif');
}
.thumbnails:hover,.thumbnailss:hover{
	background-color: rgba(255, 255,255, 0.7);
}
.thumbnails{
	border-radius:0;
	height:90px;
	margin-bottom:5px;
	width:119.5px;
	margin-left:7px;
	background-color: rgba(255, 255,255, 0.5);
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	text-align:center;
}
.thumbnailss{
	text-align:center;
	border-radius:0;
	height:90px;
	margin-bottom:5px;
	width:246px;
	margin-left:7px;	
	background-color: rgba(255, 255,255, 0.5);
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.thumbnailss5{
	text-align:center;
	border-radius:0;
	height:90px;
	margin-bottom:5px;
	width:350px;
	margin-left:7px;	
	background-color: rgba(255, 255,255, 0.5);
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.thumbnails3{
	border-radius:0;
	height:90px;
	margin-bottom:5px;
	width:170px;
	margin-left:7px;
	background-color: rgba(255, 255,255, 0.5);
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	text-align:center;
}

		
		.panel{		
			border-radius:0;
			border-color:#fff;
		}
		#myCarousel .nav a small
		{
			display: block;
		}
		#myCarousel .nav
		{
			background: #F68121;
			color:#FFF;
		}
		.SliderNav > li > a
		{
			color:#FFF;
			border-radius: 0px;
		}
		.SliderNav>li[data-slide-to="0"] a { background-color: #F68121;color:#FFF; }
		.SliderNav>li[data-slide-to="1"] a { background-color: #F68121;color:#FFF; }
		.SliderNav>li[data-slide-to="2"] a { background-color: #F68121;color:#FFF; }
		.SliderNav>li[data-slide-to="0"].active a { background-color: #004E88;color:#FFF; }
		.SliderNav>li[data-slide-to="1"].active a { background-color: #004E88;color:#FFF; }
		.SliderNav>li[data-slide-to="2"].active a { background-color: #004E88;color:#FFF; }
		
		#myCarousel .SliderNav a:hover{
			background:#004E88;
			color:#FFF;
		}

		
		
		.imgsqr{
			height:100px;
			//border:1px solid black;
		}

		@media only screen and (max-width: 768px) {
			.thumbnail{
				font-size:10px;
				height:50px;
			}
		}
		.bottomdiv{
			height:100px;
		}
		.tasktile{
			color:#F68121;
		}
		.linkCard{
			font-size:16px;
			font-weight:bold;
		}
		
.FirstHeight{height:120px;margin-left:10px;}
.TextTile{font-weight:bold;font-size:11px;}
.numTile{font-size:30px;font-weight:bold;color:#E67E22;}
.SecondCss{color:#000;border:1px solid #004E88;height:120px;}
.SecondTileCss{color:#227A84;border:1px solid #227A84;height:120px;}
.emtag{color:green;font-weight:normal;}
.onoff .badge,.onoff{font-size:11px;font-weight:bold;}
.onoff{color:#607D8B;}.onoff .badge{opacity:0.8;}
.percentTxt{color:#000;font-size:10px;font-weight:Bold;}
.SecondTileCss .numTile{font-size:20px;}
.thumbnails .badge{font-size:10px;}