@media screen{
	body{
		background:#000000 url('../images/common_library/coin.png') repeat-x;
		font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
		background-repeat: no-repeat;
		background-position: center 90px;
		z-index:0;
		}
	header{
		height:64px;
		background:url('../images/common_library/img_01header.png') repeat-x;
		width:100%;
	}
	img{
		max-width:100%;
	}
	.noContextsMsg {
		font-size:1em;
		color:#FFF;
	}
	div#kpiContainer{
	clear:both;
		margin-top:-300px;
		margin-left: auto ;
		margin-right:auto;
		width:100%;
		max-width:1240px;
	}
	ul#kpiList{
		list-style:none;
		width:100%;
		/*
		margin-left: auto ; ccoriginal
		margin-right: auto ; ccoriginal
		*/
		margin-left: auto ;
		margin-right: auto ;
		

	}
	ul#kpiList li{
		float:left;
		margin:0 1% 10px 0;
		border:3px solid #F4CF81;
		cursor:pointer;
		border-radius: 0px;
		width:18%;
		max-width:230px;
	}
	ul#kpiList li a{
		width:100%;
		height:300px;
		/*
		width:210px;
		height:155px;
		*/
		display:block;
		color:#FFF;
		padding:5px;
		text-decoration:none;

	}
	ul#kpiList li a span.contextCategory{
		display:block;
		background-color:#AE8643;
		font-weight: bold;
		font-size:1.25em; /* 18px / 16px = 1.125*/
		margin:10px -5px 0;
		padding:5px;
		width:90%;
		font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;

	}
	ul#kpiList li a div#contextWrapper{
		background-color:#000;		
		opacity:0.75;
  		filter:alpha(opacity=75);		 		
		margin:0 0 5px -5px; 
		padding:5px;
		width:75%;
		
	}
	ul#kpiList li a span.contextName{
		font-size:0.875em; /* 14px / 16px = 0.875*/
		display:none;
	}
	ul#kpiList li a span.contextHiText{
		display:block;
		font-size: 0.75em;/* 12px / 16px = 0.75 */
		color: #FFF;
		
	}
	ul#kpiList li a span.contextHiFact{
		display:block;
		font-size: 1.0em;/* 30px / 16px = 1.875*/
		display:none;
	}
	ul#kpiList li a span.contextRunDate{
		position:absolute;
		background-color:transparent;	
		color:#FFF;
		bottom:0;
		right:0.0;
		font-size:0.6875em; /* 11px / 16px = 0.6875 */
		font-family:DINNextLTPro-Regular;
		padding:5px 15px 5px 5px;
		display:none;
		
	}

	div#kpiContainerMsg2 p.te{
		text-align: center;
		color: #FFF;
		word-wrap:break-word;
		white-space:normal;
		width:100%;
		padding-left:0%;	
		margin:0 0 0 0%;
		padding-top: 25px;
		line-height: 25px;
		font-size:0.4875em;
		text-align: center;
		
	}
	div#kpiContainerMsg2 > .icoin{

	}

	div#kpiContainerMsg2{
		margin:8% auto 0;
		width:100%;
		max-width:1140px;
		height:500px;
		clear:both;
		font-size:2.0875em;
		vertical-align:text-middle;
		font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
		font-weight:100;
		margin-left: auto ;
		margin-right:auto;
		

	}
	div#kpiContainerMsg2 p{
		width:100%;
		text-align: right;
		max-width:1240px;
		color: #F4CF81;
		/*
		margin:0 20% 0 20%;
		*/
		margin:0 0% 0 0%;
		padding-top: 25px;
		line-height: 40px;
		

	}
	ul#kpiListMsg2{
		list-style:none;
		margin:7% 0 0;
	}
	

	div#logo{
		float:left;
		margin:0 3% -18px;
		height:125px;
		width:145px;
		background:url('../images/common_library/img_logo.png') no-repeat;
	}

	div#title{
		float:left;
		background:url('../images/common_library/img_logotitle.png') no-repeat;
		width:254px;
		height:43px;
		margin:12px 0 0;
	}
	div#sapLogo{
		float:left;
		background:url('../images/SAP_powered_by_grad_R_min_neg-new.png') no-repeat;
		width:75px;
		height:50px;
		background-size:   cover;
		
		margin:8px 0 0;
	}

	div#headSkyLine{
		background:url('../images/common_library/img_header01.png') no-repeat;
		float:right;
		width:500px;
		height:65px;
	}
	
	div#gline{
		background:url('../images/common_library/goldline.png') no-repeat;
		width:100%;
		height:1px;
		margin:0 0 0 0%;	
				
	}

}

@media screen and (max-height:768px){
	html body{
		
			
	}
	div#kpiContainerMsg2{
		font-size:1.0875em;
		white-space:nowrap;
		margin-bottom:0;
		width:100%;
		max-width:900px;
		margin-left:auto;
		margin-right:auto;
		
	}
	div#kpiContainerMsg2 p{
	float:none;
		margin-left:auto;
		font-size:1.3875em;
		width:100%;
		margin-right:auto;
	}
	div#gline{

		width:100%;	
		margin-left:auto;
		margin-right:auto;
		
		
	}

	div#kpiContainerMsg2 p.te{
		text-align: center;
		color: #FFF;
		word-wrap:break-word;
		white-space:normal;
		width:100%;
		/*
		margin:0 20% 0 20%;
		*/
		margin:0 30% 0 auto;
		padding-top: 25px;
		line-height: 25px;
		font-size:0.6875em;
		text-align: center;

		padding-left:0%;
	}
	div#kpiContainer{
		float:none;
		margin-top:-300px;
		margin-left:auto;
		max-width:900px;
		width:90%;
		background-size:   cover;
	}
	ul#kpiList{
		list-style:none;
		width:100%;
		/*
		margin-left: auto ; ccoriginal
		margin-right: auto ; ccoriginal
		*/
		margin-left: auto ;
		margin-right: auto ;
		background-size:   cover;

	}
	ul#kpiList li{
		float:left;
		margin:0 1% 10px 0;
		border:3px solid #F4CF81;
		cursor:pointer;
		border-radius: 0px;
		
		width:165px;
		background-size:   cover;
		background-position:center center;
	}
	ul#kpiList li a{
		width:100%;
		height:220px;

	}
	ul#kpiList li a span.contextCategory{
		font-size:1em; /* 18px / 16px = 1.125*/
	}
	div#logo{
		float:left;
		margin:0 3% -18px;
		height:95px;
		width:107px;
		background:url('../images/common_library/img_logo.png') no-repeat;
		background-size:   cover; 
	

	}
	div#title{
		float:left;
		background:url('../images/common_library/img_logotitle.png') no-repeat;
		background-size:   cover; 
		width:180px;
		height:30px;
		margin:12px 0 0;
	}	
	div#sapLogo{
		float:left;
		background:url('../images/SAP_powered_by_grad_R_min_neg-new.png') no-repeat;
		width:60px;
		height:40px;
		background-size:   cover;
		
		margin:8px 0 0;
	}
	div#headSkyLine{
		background:url('../images/common_library/img_header01.png') no-repeat;
		background-size:   cover; 
		float:right;
		width:384px;
		height:50px;
	}
	header{
		height:50px;
		background:url('../images/common_library/img_01header.png') repeat-x;
		width:100%;

	}
}
@media screen and (max-width:805px){

	html body{
		background:#000;
		background-image:none;
	}
	
	header{
		float:none;
		position:relative !important;
		width:100%;
		margin-left:auto;
		margin-right:auto;
	}
	ul#kpiList li a span.contextCategory{
		font-size:1.2em; /* 18px / 16px = 1.125*/
	}
	ul#kpiList{
		padding-top:130px;
	}
	div#logo{
		clear: both !important;
		float:none !important;
		width: 180px;
		height: 160px;
		background-position:center center;
		position:relative;
		margin-left:auto;
		margin-right:auto;
		display:block;
		background-size:   cover; 
	}
	div#title{
		clear: both !important;
		float:none;
		display:block-inline;
		margin-top:35px;
		position:relative;
		margin-left:auto;
		margin-right:auto;
		background-size:   cover;
	}	
	div#sapLogo{
		clear: both !important;
		float:none;
		display:block-inline;
		margin-top:10px;
		position:relative;
		margin-left:auto;
		margin-right:auto;
		background-size:   cover;
	}	
	div#headSkyLine{
	clear: both !important;
	float:none !important;
	height: 200px;
	margin: 20px;
	position:relative;
	display:none;
	
	}
	div#kpiContainer{
		height:0;
		margin-top:-15%;
		margin-left:auto;
		clear:both;
		background-color: transparent;
		font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
		
	}
	
	div#kpiContainerMsg2{
		float:none;
		position:relative;
		margin:0% auto 0;
		height:0%;
		clear:both;
		font-size:1.2875em;
		vertical-align:text-middle;
		font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
		white-space:normal;
	
	}
	div#kpiContainerMsg2 p{
	float:none;
	position:relative;
		color:#F4CF81;
		padding-top: 25px;
		line-height: 30px;
		display:block;
		text-align:center;
		margin-top:200px;
		font-size:1.2875em;
		height:0%;
	}
	ul#kpiListMsg2{
	float:none;
	position:relative;
		list-style:none;
		display:block;
	}

	div#gline{
		background:url('../images/common_library/goldline.png') no-repeat;
		float:none;
	width:auto;
	text-align:center;
	margin:0px;
		height:1px;
		display:block;
		height:3px;
		
	}
	ul#kpiList li{
		float:none;
		display: block;
		margin-left:auto;
		margin-right:auto;
		border:3px solid #F4CF81;
		cursor:pointer;
		border-radius: 0px;
		background-size:100%;
		width:80%;
		max-width:250px;
	}	
	ul#kpiList li a{
		width:100%;
		height:300px;
		/*
		width:210px;
		height:155px;
		*/
		display:block;
		color:#FFF;
		padding:5px;
		text-decoration:none;
		background-size:100%;

	}
	div#kpiContainerMsg2 p.te{
		text-align: center;
		color: #FFF;
		word-wrap:break-word;
		white-space:normal;
		width:100%;
		/*
		margin:0 20% 0 20%;
		*/
		margin:0 30% 0 0%;
		padding-top: 25px;
		line-height: 25px;
		font-size:0.6875em;
		text-align: center;
		padding-left:0%;
		height:0px;
	}
}