@import "base.less?t=3";


body {
	margin: 0px;
	padding: 0px;
	/*background-color: #F3F3F3;*/
	background-color: #FFFFFF;
	color: #000000;
	font-family: @FONT_regular;
	font-size: 16px;
	line-height: 120%;

	a{
		text-decoration: none;

		img{
			border: none;
		}
	}
}

.onlymobile{
	display:none !important;
}

/* Content size */
.contentSize{
	width:960px;
	margin:0px auto;
}

@htime:0.4s;

#headerContainer.smallheader{
	position:fixed;
	z-index:200;
	top:0px;
	
	header .contentSize{
		height:40px;
		background:#000000;
		
		#topLogo{
			width:40px;
			height:40px;
			
			img{
				margin: 7px 0px 0px 8px;
				width: 24px;
			}
		}
		
		#topMenu{
			ul{
				margin: 10px 30px 0px 0px;
				li{
					
					a{
						color:#FFFFFF;
					}
				}
			}
		}
	}
}

#headerContainer{
	position:absolute;
	z-index:200;
	top:20px;
	width:100%;
	height:60px;
	-webkit-transition: -webkit-transform @htime, background @htime, height @htime, width @htime;
	-moz-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	-o-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	transition: transform @htime, background @htime, height @htime, width @htime;

	
	header .contentSize{
		height:60px;
		background:#FFFFFF;
		-webkit-transition: -webkit-transform @htime, background @htime, height @htime, width @htime;
	-moz-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	-o-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	transition: transform @htime, background @htime, height @htime, width @htime;

		
		#topLogo{
			float:left;
			background:@RED;
			width:60px;
			height:60px;
			-webkit-transition: -webkit-transform @htime, background @htime, height @htime, width @htime;
	-moz-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	-o-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	transition: transform @htime, background @htime, height @htime, width @htime;

			
			img{
				margin:13px 0px 0px 14px;
				width:30px;
				-webkit-transition: -webkit-transform @htime, background @htime, height @htime, width @htime;
	-moz-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	-o-transition: -moz-transform @htime, background @htime, height @htime, width @htime;
	transition: transform @htime, background @htime, height @htime, width @htime;

			}
		}
		
		#topMenu{
			float:right;
			
			ul{
				margin:20px 30px 0px 0px;
				padding:0px 0px 0px 0px;
				-webkit-transition: -webkit-transform @htime, background @htime, height @htime, margin @htime;
				-moz-transition: -moz-transform @htime, background @htime, height @htime, margin @htime;
				-o-transition: -moz-transform @htime, background @htime, height @htime, margin @htime;
				transition: transform @htime, background @htime, height @htime, margin @htime;
				
				li{
					margin:0px 0px 0px 40px;
					padding:0px 0px 0px 0px;
					display:inline-block;
					
					a{
						font-size:14px;
						font-family:@FONT_light;
						color:#000000;
					}
				}
			}
		}
		
	}
}




#slide_1.background{
	height:650px;
	background-image:url(/images/top_bg.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	background-attachment:fixed;
	
	.foreground{
		height:650px;
		background-image:url(/images/top_logo.png);
		background-repeat:no-repeat;
		background-position:center center;
	}

	
}


#slide_2.background{
	height:650px;
	background-image:url(/images/rolunk_red.jpg);
	background-repeat:repeat-x;
	background-position:center center;
	
	.foreground_middle{
		height:650px;
		background-image:url(/images/rolunk_white.jpg);
		background-repeat:repeat-y;
		background-position:left top;
	}
	
	
	.foreground{
		height:650px;
		background-image:url(/images/rolunk_bg_2.jpg);
		background-repeat:no-repeat;
		background-position:left bottom;
		
		.table{
			display:table;
		}
		
		.cell{
			display:table-cell;
			height:650px;
			text-align:right;
			vertical-align:middle;
		}
		
		.panel{
			display: inline-block;
			width:620px;
			height: 300px;
			padding:50px;
			text-align:left;
			background:@RED;
			
			span{
				font-family:@FONT_regular;
				font-weight:normal;
				font-size:15px;
				color:#FFFFFF;
				line-height:140%;
				text-align:justify;
				display: block;
			}
		}
		
		h1{
			font-family:@FONT_light;
			font-weight:normal;
			font-size:70px;
			line-height: 120%;
			color:#000000;
			margin:0px 0px 20px 0px;
			padding:0px 0px 0px 0px;
		}
		
		
	}

	
}



#slide_3.background{
	height:700px;
	background-color:#DDDDDD;
	
	.foreground{
		height:700px;
		
		
		.table{
			display:table;
			width:100%;
		}
		
		.cell{
			display:table-cell;
			height:700px;
		}
		
		.cell.center{
			width:1150px;
			text-align:center;
			vertical-align:middle;
			
			h1{
				font-family:@FONT_light;
				font-weight:normal;
				font-size:50px;
				line-height: 120%;
				color:#000000;
				margin:0px 0px 40px 0px;
				padding:0px 0px 0px 0px;
			}
			
			#newPapersCont{
				width:1150px;
				height:410px;
				text-align:left;
				overflow:hidden;
				-webkit-overflow-scrolling: touch;
				position:relative;
				
				#newPapersSlide{
					height:410px;
					width:auto;
					text-align:left;
					position:absolute;
					
					.pagePanel{
						display:inline-block;
						position:relative;
						width:220px;
						height:410px;
						margin:0px 3px;
						text-align:left;
//						float: left;
						
						@time: 0.5s;
						
						.imgCont{
							display:block;
							width:220px;
							height:300px;
							background-repeat:no-repeat;
							background-position:center center;
							background-size:cover;
							opacity:1;
							-webkit-transition: -webkit-transform @time, background @time, opacity @time;
							-moz-transition: -moz-transform @time, background @time, opacity @time;
							-o-transition: -moz-transform @time, background @time, opacity @time;
							transition: transform @time, background @time, opacity @time;
						}
						
						.pageTitle{
							display:block;
							margin:20px 0px 16px 0px;
							padding:7px 0px 0px 20px;
							width:180px;
							height:42px;
							background:@RED;
							font-family:@FONT_light;
							font-weight:normal;
							font-size:17px;
							line-height: 100%;
							color:#FFFFFF;
							opacity:1;
							-webkit-transition: -webkit-transform @time, background @time, opacity @time;
							-moz-transition: -moz-transform @time, background @time, opacity @time;
							-o-transition: -moz-transform @time, background @time, opacity @time;
							transition: transform @time, background @time, opacity @time;
							
						}
						
						.more{
							display:block;
							padding:0px 0px 0px 20px;
							font-family:@FONT_light;
							font-weight:normal;
							font-size:12px;
							line-height: 100%;
							color:#000000;
							opacity:1;
							-webkit-transition: -webkit-transform @time, background @time, opacity @time;
							-moz-transition: -moz-transform @time, background @time, opacity @time;
							-o-transition: -moz-transform @time, background @time, opacity @time;
							transition: transform @time, background @time, opacity @time;
						}
						
						.normal{
							display:block;
							position:relative;
							z-index:10;
							width:220px;
							height:410px;
							background:#FFFFFF;
							
							-webkit-transition: -webkit-transform @time, background @time;
							-moz-transition: -moz-transform @time, background @time;
							-o-transition: -moz-transform @time, background @time;
							transition: transform @time, background @time;
							-webkit-transform-style: preserve-3d;
							-moz-transform-style: preserve-3d;
							-o-transform-style: preserve-3d;
							transform-style: preserve-3d;
							-webkit-transform-origin: 50% 50% -110px;
							-moz-transform-origin: 50% 50% -110px;
							-o-transform-origin: 50% 50% -110px;
							transform-origin: 50% 50% -110px;
						}
						
						.hover{
							display:block;
							position:absolute;
							z-index:20;
							width:220px;
							height:410px;
							background:#7E0A10;
							
							-webkit-transform: rotateY(90deg);
							-moz-transform: rotateY(90deg);
							-o-transform: rotateY(90deg);
							transform: rotateY(90deg);
							
							-webkit-transition: -webkit-transform @time, background @time;
							-moz-transition: -moz-transform @time, background @time;
							-o-transition: -moz-transform @time, background @time;
							transition: transform @time, background @time;
							-webkit-transform-style: preserve-3d;
							-moz-transform-style: preserve-3d;
							-o-transform-style: preserve-3d;
							transform-style: preserve-3d;
							-webkit-transform-origin: 50% 50% -110px;
							-moz-transform-origin: 50% 50% -110px;
							-o-transform-origin: 50% 50% -110px;
							transform-origin: 50% 50% -110px;
		
							.imgCont{
								.color{display:block;}
								
							}
							
							.pageTitle{
								background:#000000;
								color:#FFFFFF;
							}
							
							.imgCont{opacity:0.5;}
							.pageTitle{opacity:0.5;}
							.more{opacity:0.5;}
						}
						
						x:-o-prefocus, .hover {
							display:none;
						}
					}
					
					.pagePanel:hover{
						.normal{
							/*background:#999999;*/
							-webkit-transform: rotateY(-90deg);
							-moz-transform: rotateY(-90deg);
							-o-transform: rotateY(-90deg);
							transform: rotateY(-90deg);
							
							.imgCont{opacity:0.5;}
							.pageTitle{opacity:0.5;}
							.more{opacity:0.5;}
						}
						
						.hover{
							background:@RED;
							-webkit-transform: rotateY(0deg);
							-moz-transform: rotateY(0deg);
							-o-transform: rotateY(0deg);
							transform: rotateY(0deg);
							
							.imgCont{opacity:1;}
							.pageTitle{opacity:1;}
							.more{opacity:1;}
						}
						
						x:-o-prefocus, .hover {
							display:block;
						}
					}
					
					/*
					.pagePanel:hover{
						background:@RED;
						-webkit-transform: rotateY(-90deg);
						-moz-transform: rotateY(-90deg);
						transform: rotateY(-90deg);
	
						.imgCont{
							.color{display:block;}
							
						}
						
						.pageTitle{
							background:#000000;
							color:#FFFFFF;
						}
					}*/
					
					
				}
				
				
			}
		}
		
		.cell.left{
			background-image:url(/images/bArr_prev.png);
			background-repeat:no-repeat;
			background-position:right center;
			opacity:0.3;
		}
		
		.cell.right{
			background-image:url(/images/bArr_next.png);
			background-repeat:no-repeat;
			background-position:left center;
			opacity:0.3;
		}
		
		.cell.left:hover, .cell.right:hover{opacity:1;}
		
	}

	
}



#slide_4.background{
	height:650px;
	background-image:url(/images/mags_1.png);
	background-repeat:no-repeat;
	background-position:right bottom;
	
	.foreground_middle{
		height:650px;
		background-image:url(/images/mags_2.png);
		background-repeat:no-repeat;
		background-position:right bottom;
	}
	
	.foreground{
		height:650px;
		background-image:url(/images/mags_3.png);
		background-repeat:no-repeat;
		background-position:right bottom;
		
		.table{
			display:table;
			height:650px;
		}
		
		.cell{
			display:table-cell;
			vertical-align:middle;
			
			
			h1{
				font-family:@FONT_light;
				font-weight:normal;
				font-size:70px;
				line-height: 100%;
				color:@RED;
				margin:0px 0px 40px 0px;
				padding:0px 0px 0px 0px;
			}
			
			a{
				display:inline-block;
				
				img{
					float:left;
				}
				
				span{
					display:block;
					float:left;
					background:#999999;
					margin: 18px 0px 0px 0px;
					padding: 10px 20px 10px 20px;
					font-family:@FONT_light;
					font-weight:normal;
					font-size:20px;
					line-height: 100%;
					color:#FFFFFF;
				}
			}
			
			a:hover{
				span{
					background:#000000;
				}
			}
			
		}
	}

	
}





#slide_5.background{
	height:750px;
	background-color:@RED;
	background-image:url(/images/mai_bg.png);
	background-repeat:no-repeat;
	background-position:right bottom;
	
	.foreground{
		height:750px;
		
		
		.table{
			display:table;
			width:100%;
		}
		
		.cell{
			display:table-cell;
			height:750px;
		}
		
		.cell.center{
			width:1150px;
			text-align:center;
			vertical-align:bottom;
			
			#datum{
				width:270px;
				border:none;
				
				padding:10px 20px 10px 20px;
				font-family:@FONT_light;
				font-weight:normal;
				font-size:16px;
				line-height: 120%;
				color:#FFFFFF;
				margin-bottom:20px;
				background-color:rgba(0,0,0,0.2);
				background-image:url(/images/calendar.png);
				background-repeat:no-repeat;
				background-position:right center;
			}
			
			#maiLinks{
				margin-top:100px;
				
				.arch{
					display:inline-block;
					width:250px;
					padding:5px 0px 5px 0px;
					background:#000000;
					font-family:@FONT_light;
					font-weight:normal;
					font-size:20px;
					line-height: 120%;
					color:#FFFFFF;
				}
				
				.exc{
					display:inline-block;
					width:250px;
					padding:5px 0px 5px 0px;
					background:#999999;
					font-family:@FONT_light;
					font-weight:normal;
					font-size:20px;
					line-height: 120%;
					color:#FFFFFF;
				}
				
				.arch:hover, .exc:hover{
					color:#000000;
					background:#DDDDDD;
				}
			}
			
			h1{
				font-family:@FONT_light;
				font-weight:normal;
				font-size:50px;
				line-height: 120%;
				color:#FFFFFF;
				margin:0px 0px 20px 0px;
				padding:0px 0px 0px 0px;
			}
			
			#maiPapersCont{
				width:1020px;
				height:440px;
				text-align:center;
				overflow:hidden;
				-webkit-overflow-scrolling: touch;
				position:relative;
				margin: auto;
				
				#maiPapersSlide{
					height:440px;
					width: 1022px;
					text-align:left;
					margin:auto;
					
					@time: 0.5s;
					
					.maiBox{
						display:block;
						float:left;
						width:140px;
						height:140px;
						margin:3px 3px;
						cursor:pointer;
						
						.normal{
							display:table;
							position:relative;
							width:140px;
							height:140px;
							background-color:#FFFFFF;
							background-repeat:no-repeat;
							background-position:center center;
							
							-webkit-transition: -webkit-transform @time, background @time;
							-moz-transition: -moz-transform @time, background @time;
							transition: transform @time, background @time;
							-webkit-transform-style: preserve-3d;
							-moz-transform-style: preserve-3d;
							transform-style: preserve-3d;
							-webkit-transform-origin: 50% 50% -70px;
							-moz-transform-origin: 50% 50% -70px;
							transform-origin: 50% 50% -70px;
							
							.shadow{
								background:#999999;
								opacity:0;
								display:block;
								position:absolute;
								width:140px;
								height:140px;
								-webkit-transition: -webkit-transform @time, background @time, opacity @time;
								-moz-transition: -moz-transform @time, background @time, opacity @time;
								transition: transform @time, background @time, opacity @time;
							}
							
							.name{
								display:table-cell;
								width:120px;
								height:120px;
								text-align:center;
								vertical-align:middle;
								padding:10px;
								font-family:@FONT_light;
								font-weight:normal;
								font-size:14px;
								line-height: 120%;
								color:#000000;
							}
						}
						
						.hover{
							-webkit-transform: rotateX(-90deg);
							-moz-transform: rotateX(-90deg);
							transform: rotateX(-90deg);
							
							-webkit-transition: -webkit-transform @time, background @time;
							-moz-transition: -moz-transform @time, background @time;
							transition: transform @time, background @time;
							-webkit-transform-style: preserve-3d;
							-moz-transform-style: preserve-3d;
							transform-style: preserve-3d;
							-webkit-transform-origin: 50% 50% -70px;
							-moz-transform-origin: 50% 50% -70px;
							transform-origin: 50% 50% -70px;
						}
						
						.data{
							display:block;
							position:absolute;
							z-index:20;
							width:120px;
							height:120px;
							background-color:#000000;
							color:#FFFFFF;
							font-size:11px;
							padding:10px;
							
							.title{
								display:block;
								font-family:@FONT_bold;
								font-weight:normal;
								font-size:12px;
								margin-bottom:5px;
								opacity:0.2;
								-webkit-transition: -webkit-transform @time, background @time, opacity @time;
								-moz-transition: -moz-transform @time, background @time, opacity @time;
								transition: transform @time, background @time, opacity @time;
							}
							
							table{
								margin:0px 0px 0px 0px;
								padding:0px 0px 0px 0px;
								width:100%;
								opacity:0.2;
								-webkit-transition: -webkit-transform @time, background @time, opacity @time;
								-moz-transition: -moz-transform @time, background @time, opacity @time;
								transition: transform @time, background @time, opacity @time;
								
								tr{
									margin:0px 0px 0px 0px;
									padding:0px 0px 0px 0px;
									
									td{
										margin:0px 0px 0px 0px;
										padding:0px 0px 0px 0px;
									}
									
									.nums{
										text-align:right;
										font-family:@FONT_bold;
										font-weight:normal;
									}
								}
							}
						}
						
						x:-o-prefocus, .hover {
							display:none;
						}
					}
					
					.maiBox:hover{
						
						
						.normal{
							/*background:#999999;*/
							-webkit-transform: rotateX(90deg);
							-moz-transform: rotateX(90deg);
							transform: rotateX(90deg);
							
							.shadow{
								opacity:0.5;
							}

						}
						
						.hover{
							background:#000000;
							-webkit-transform: rotateX(0deg);
							-moz-transform: rotateX(0deg);
							transform: rotateX(0deg);
							.title{opacity:1;}
							table{opacity:1;}
						}
						
						x:-o-prefocus, .hover {
							display:block;
						}
					}
					
				}
				
				
			}
		}
		
		.cell.left{
			background-image:url(/images/wArr_prev.png);
			background-repeat:no-repeat;
			background-position:right center;
			opacity:0.5;
		}
		
		.cell.right{
			background-image:url(/images/wArr_next.png);
			background-repeat:no-repeat;
			background-position:left center;
			opacity:0.5;
		}
		
		
		.cell.left:hover, .cell.right:hover{opacity:1;}
	}

	
}




#slide_6.background{
	height:320px;
	border-bottom:5px solid @RED;
	
	.foreground{
		height:320px;
		
		.table{
			display:table;
			height:320px;
			background-image:url(/images/logo.png);
			background-repeat:no-repeat;
			background-position:right center;
		}
		
		.cell{
			display:table-cell;
			vertical-align:middle;
			
			
			h2{
				font-family:@FONT_light;
				font-weight:normal;
				font-size:70px;
				line-height: 100%;
				color:#000000;
				margin:0px 0px 30px 0px;
				padding:0px 0px 0px 0px;
			}
			
			table{
				margin:0px 0px 0px 0px;
				padding:0px 0px 0px 0px;
				width:480px;
				
				
				
				tr{
					margin:0px 0px 0px 0px;
					padding:0px 0px 0px 0px;
					
					td{
						margin:0px 0px 0px 0px;
						padding:0px 0px 10px 0px;
						font-family:@FONT_light;
						font-weight:normal;
						font-size:19px;
						line-height: 100%;
					}
					
					.label{
						text-align:right;
						font-family:@FONT_bold;
						font-weight:normal;
					}
				}
			}
			
		}
	}

	
}

/**/

.detailCont{
	display:table;
	width:730px;
	margin: 20px;
	
	.img{
		display:table-cell;
		text-align:left;
		vertical-align:top;
		width:230px;
		
		img{width:230px;}
	}
	
	.texts{
		display:table-cell;
		text-align:left;
		vertical-align:top;
		
		.title{
			display:inline-block;
			background:@RED;
			font-family:@FONT_light;
			font-weight:normal;
			font-size: 32px;
			line-height: 100%;
			color: #FFFFFF;
			margin: 40px 0px 0px 0px;
			padding: 10px 20px 10px 20px;
		}
		
		.lead{
			display:block;
			margin:30px 0px 0px 20px;
			padding:0px 0px 0px 0px;
			font-family:@FONT_regular;
			font-weight:normal;
			font-size:12px;
			line-height: 140%;
			color:#000000;
		}
		
		table{
			width:320px;
			margin: 30px 0px 0px 20px;
			
			td{
				text-align:left;
				vertical-align:top;
				margin:0px 0px 0px 0px;
				padding:0px 0px 6px 0px;
				font-family:@FONT_regular;
				font-weight:normal;
				font-size:14px;
				line-height: 100%;
				color:#000000;
			}
			
			.data{
				text-align:right;
				font-weight:bold;
			}
		}
	}
}


/*
ALERT
*/

#alertWrapper{
	position:fixed;
	z-index:2000;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	width: 100%;
	height: 100%;
}

#alertWrapper .alertOrder{
	display:table-cell;
	width:100%;
	height:100%;
	text-align:center;
	vertical-align:middle;
}

.myresults{
  width:600px;
  padding:18px;
  color:#FFFFFF;
  font-size:13px;
  background:#666666;
  margin-top:15px;
}

#curtain{
  position:fixed;
  z-index:1000;
  background:#221E1F;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
}

.alert{
  /*position:absolute;*/
  z-index:1001;
  width: 450px;
  height: 300px;
  border:0;
  background:#FFFFFF;
  position:relative;
  .boxShadow(rgba(0,0,0,0.5), 0px, 80px);
}

.alert_container{
  text-align:left;
  vertical-align:middle;
  padding:0px;
}

.alert_title{
  font-weight:normal;
  text-align:left;
  text-transform: none;
  font-size: 26px;
  color: #FFFFFF;
  font-family: @FONT_regular;
  background: @RED;
  padding: 10px 15px;
}

.alert_title:first-letter{
  text-transform: uppercase;
}

.alert_content{
  font-size:14px;
  color:#000000;
  font-family: @FONT_regular;
  padding:17px;
  min-height: 150px;
  line-height: 140%;
}

.alert_buttoncont{
  text-align: right;
}

.input_field{
  border:1px solid #333333;
  padding:2px 8px 2px 10px;

}

#alertDefButt{
  margin: 0 20px;
  font-size: 16px;
  background: #221E1F;
  font-family: @FONT_regular;
  color: #FFFFFF;
  border:none;
  text-transform: uppercase;
  padding: 6px 30px;
  cursor: pointer;
  .boxShadow(rgba(0,0,0,0.4), 4px, 6px);
}

#myAlertContent .closeButton{
	position:absolute;
	right: 12px;
	top: 12px;
	border:none;
	height:26px;
	width:26px;
	background-color:transparent;
	background-image:url(/images/close.png);
	background-repeat:no-repeat;
	background-position:center center;
	font-size: 11px;
	font-family: @FONT_regular;
	color: rgba(255,255,255,0.6);
	cursor:pointer;
}


#ui-datepicker-div{
	box-shadow: 6px 6px 0px rgba(0,0,0,0.2) !important;
	background: #EEEEEE;
width: 300px;

}

#sizeInfo{
	position:fixed;
	background:#000000;
	width:70px;
	height:auto;
	padding: 5px 10px;
	right:0px;
	bottom:0px;
	font-family:@FONT_regular;
	font-size:15px;
	color:#FFFFFF;
	text-align:center;
	opacity:0.5;
	z-index:9999;
}

#infoBig{display:block;}
#infoNormal{display:none;}
#infoTablet{display:none;}
#infoMobile{display:none;}

/*	Tablet Layout: 980 - 1200px.*/  
@import "styleNormal.less?t=4";

/*	Tablet Layout: 600 - 979px.*/ 
@import "styleTablet.less?t=2"; 

/*	Mobile Layout: 320px. */
@import "styleMobile.less";