﻿div#highlight_holder{
	display: block ;
	position:relative ;
	text-align: center ;
	margin-bottom:24px ;
}

div#highlight_holder:after{
	content: "" ;
	display: block ;
	position: absolute ;
	bottom: 0px ;
	left: 0px ;
	width: 100% ;
	height: 2px ;
	/*background: linear-gradient(to left, #404040, transparent ) ;*/
}

div.highlight{
	position:relative;
	display: inline-block ;
	text-align: left ;
	
	width: 100% ;
	height: auto;

	background: linear-gradient( #FFF, #EFEFEF ) ;*
	vertical-align: top ;
	margin-bottom:24px ;
}

div#highlight_big{
	position: relative ;
	width: 66.49484536%;
	height: 399px ;
	display: inline-block ;
	margin-right: 2.164948454% ;
	vertical-align: top ;
}

div#highlight_thumbs{
	position:relative ;
	width: 31.34020619% ;
	height: 399px ;
	display: inline-block ;
	vertical-align: top ;
}

div#highlight_big img{
	width: 100% ;
	height: 100% ;
	box-shadow: 0px 0px 1px 1px rgba( 160, 0, 0, 0) ;
	border-radius: 0px ;
}

div#highlight_thumbs img{
	width: 100% ;
	position: absolute ;
	top: 0px ;
   
	box-shadow: 0px 0px 1px 1px rgba( 160, 0, 0, 0) ;
	border-radius: 0px ;
}

div#highlight_thumbs img:nth-of-type( 2 ){
	top: auto ;
	bottom: 0px ;
}

div.homepage{
	padding: 6px ;
	font-size: 15.25px ;
	color: #303030 ;
	box-sizing: border-box;
}

.pc span, div.homepage span{
	font-size: 20px ;
	font-weight: 700 ;
	color: #A00000 ;
	display: block ;
	margin-bottom: 3px ;
}

div.homepage a.legenda{
	position: relative ;
	display: inline-block ;
	margin-top: 6px ;
}

div.homepage a:after, div.homepage a:before{
	display: inline-block ;
	position: relative ;
	color: #000 ;
	margin-bottom: 6px ;
}

div.homepage a.legenda:after{
	content: "]" ;
}

div.homepage a.legenda:before{
	content:"["
}

div.highlight:before, div.highlight:after{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 12px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}

div.highlight:after{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

.pc{
	width:31% ;
	box-sizing: border-box ;
}

.pc img{
	width: 100%;
}

.s{
	width:3.5% ;
	box-sizing: border-box ;
}

.clear{
	clear: both;
	margin-bottom: 18px ;
}

@media screen and (max-width:1000px){
	div#highlight_big, div#highlight_thumbs{
		height: 39.9vw ;
	}
}

@media screen and (max-width:800px){
	div#highlight_thumbs{
		display: none ;
	}
	
	div#highlight_big{
		width:100% ;
		height: 55vw ;
	}
}

@media screen and (max-width:775px){
	.pc, .s{
		display: block;
		width: 100% ;
	}
	
	.s{
		/*border-bottom: 2px solid #CFCFCF ;*/
		height: 2px ;
	background: -webkit-linear-gradient(right, #404040, transparent ) ; /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(left, #404040, transparent ) ; /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(left, #404040, transparent ) ; /* For Firefox 3.6 to 15 */
	background: linear-gradient(to left, #404040, transparent ) ; /* Standard syntax */

		margin-bottom: 18px ;
	}

		
	img.no_highlight_1, img.no_highlight_2{
		float: none ;
		margin-right: 6px ;
		margin-right: 0px ;
	}
		
	img.no_highlight_2 + div.homepage div.right{
		text-align: left;
	}
		
}

@media screen and (max-width:625px){
	img.no_highlight_1, img.no_highlight_2{
		width: 100% ;
		float: none ;
		margin-right: 0px ;
	}
		
	img.no_highlight_2 + div.homepage div.right{
		text-align: right;
	}
}

.right{
	text-align: right
}