@import "reset.css";

main {
	position: relative;
	width: 495px;
	height: 417px;
}

#exampleBlurb {
	position: absolute;
	margin-bottom: 0;
	width: 266px !important;
	left: 495px;
	margin-top: 0;
	padding: 10px;
	font-size: 13px !important;
	min-height: 390px;
	background: none !important;
	color: black !important;
}

#exampleBlurb a {
	color: blue;
}


[data-polyclip], .slides  {
	position: absolute !important;
	top: 0px;
}

[data-polyclip] {
	z-index: 10;
	pointer-events: none;
}

.slides {
    left: 61px;
    top: 195px;
    z-index: 5;
    cursor: pointer;
    transform: skew(0, 3deg) scale(0.89, 0.84);
    -webkit-transform: skew(0, 3deg) scale(0.89, 0.84);
    -ms-transform: skew(0, 3deg) scale(0.89, 0.84);
    
    
}

.slides, .slides img {
  height: 150px;
  width: 150px;
  border: none;
  margin: 0;
  padding: 0;
}


/* Let's make the slides blur */
.slides {
	filter: blur(1px);             
	-webkit-filter: blur(1px);      
	-moz-filter: blur(1px);
	-o-filter: blur(1px); 
	-ms-filter: blur(1px); 
	
	filter: url('filters/blur.svg#blur'); /* browsers that don't do non-SVG filters (Firefox) */
}

/* Lose the blur on mouseover */
.slides:hover {
  filter: none;  
	-webkit-filter: none; 
	-moz-filter: none;
	-o-filter: none; 
	-ms-filter: none;
}

html.ie.lte9 .slides,
body.ie9down .slides {
	
	/* We only do transforms for IE10 up so we don't lose the blur filter */
	-ms-transform: none;
	/* Adjustment to compensate for the how Visual filter moves the slides after transform */
	left: 68px;
    top: 202px;
  
	filter: progid:DXImageTransform.Microsoft.Matrix(
	            M11=0.89,
	            M12=0,
	            M21=0.046642923561907156,
	            M22=0.84,
	            SizingMethod='auto expand')
	        progid:DXImageTransform.Microsoft.Blur(pixelradius=1);
  
  
}

html.ie.lte9 .slides:hover,
body.ie9down .slides:hover
 {
	left: 70px;
    top: 203px;
  
	filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=0.89,
            M12=0,
            M21=0.046642923561907156,
            M22=0.84,
            SizingMethod='auto expand');
}



/* For blog post */
.entry img, ol li [data-polyclip] {
	float: none;
	position: static;
}

ol li {
	margin-bottom: 1.3em;
}

ol li img {
	margin: 10px 0 !important;
}


#example1 {
    height: 408px;
    overflow: hidden;
}