@import url('https://fonts.googleapis.com/css?family=Playfair+Display');


#Art  {
	
	padding-left: 10px;
	
	padding-right: 10px;
	
	display: inline-block;
	
	width: calc(100% - 20px);

	padding-top: 30px;
	
}

#Art #ArtItemContainer {
	
	margin: 0px;
	
	padding: 0px;
	
	width: 100%;
	
	display: inline-block;
	
	float: left;
	
	border-top: 1px solid #DDDDDD;
	
	text-align: center;
	
}


#Art #ArtItemContainer .ArtItem {
	
	display: inline-block;
	
	float: center;
	
	margin-bottom: 80px;
	
	vertical-align: text-top;
	
	cursor: pointer;
	
	cursor: hand;
	
}


#Art #ArtItemContainer .ArtItem .ArtItemImageContainer {

	outline: 1px solid #f7f7f7;
	
	background-color: f7f7f7;
	
	display: inline-block;
	
	width: calc(100% - 12px);
	
	height: calc(100% - 30px);
	
	margin: 6px;
	
	margin-bottom: 10px;
	
	margin-top: 20px;
	
	float: left;
	
	position: relative;
	
}


#Art #ArtItemContainer .ArtItem .ArtItemImageContainer img {
	
	max-height: 100%;  
    max-width: 100%; 
    width: auto;
    height: auto;
    position: absolute;  
    top: 0;  
    bottom: 0;  
    left: 0;  
    right: 0;  
    margin: auto;
	
	
	image-rendering: optimizeSpeed;
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: pixelated;
    image-rendering: optimize-contrast;
    -ms-interpolation-mode: nearest-neighbor;

}


#Art #ArtItemContainer .ArtItem .ArtItemTitle {
	
	font-family: 'Playfair Display';
	
	font-size: 18px;
	
	color: #222222;
	
	padding-left: 4px;
	padding-right: 4px;
	
}

#Art #ArtItemContainer .ArtItem .ArtItemDescription {

	font-size: 11px;
	
	font-family: 'Lato';
	
	color: #999999;
	
	padding-top: 2px;
	
	overflow: hidden;
	
	padding-left: 4px;
	padding-right: 4px;
	
}


#Art #ArtItemContainer .ArtItem:hover .ArtItemTitle,
#Art #ArtItemContainer .ArtItem:hover .ArtItemDescription {

	text-decoration: underline;
	
}


#Art #ArtItemContainer .emptyArtItem {
	
	// visibility: hidden;
	
}




#Art input[type=text] {
	
	font-size: 22px;
	
	color: #222222;
	
	padding: 10px;
	
	margin: 0px;
	
	width: 100%;
	
	height: 60px;
	
	outline:0px;
	
	border: 1px solid #BBBBBB;
	
	transition: .15s ease-in-out;
}


#Art #searchForm  {
	
	display: inline-block;
	
	width: 100%;
	
	max-width: 600px;
	
	min-width: 300px;
	
	text-align: left;
	
}

#Art #searchFormContainer {
	
	display: inline-block;
	
	padding: 20px;
	
	padding-bottom: 0px;
	
	margin: 0px;
	
	width: calc(100% - 40px);
	
	text-align: center;

}

#Art #searchForm #textInputContainer {
	
	display: inline-block;
	
	position: relative;
	
	width: 100%;
	
	padding: 0px;
	
	margin-top: 20px;
}


#Art #searchForm #submit {
	
	position: absolute;
	
	top: 0px;
	
	right: 0px;
	
	outline:0px;
	
	cursor: pointer; cursor: hand;
	
    width: 60px;
	
	height: 60px;

	background-size: 100% 100%;

    background-repeat: no-repeat;

	background-image: url("../images/magnifying-glass.svg");

	padding: 0px;
	
	margin: 0px;
}


 
#Art #searchForm #submit:hover {
	
	background-image: url("../images/magnifying-glass_hover.svg");
	
	background-color: #11A0FF;
	
	box-shadow: inset 0px 0px 0px 1px #BBBBBB;
	-webkit-box-shadow: inset 0px 0px 0px 1px #BBBBBB;
	-moz-box-shadow: inset 0px 0px 0px 1px #BBBBBB;
	-o-box-shadow: inset 0px 0px 0px 1px #BBBBBB;
	
}


#Art #ArtMediaContainer {
	
	display: inline-block;
	
	width: 250px;
	
	line-height: 120%;
	
	padding-bottom: 30px;
	
}



#Art .SearchMediaButton {
	
	margin-top: 10px;
	
	margin-right: 10px;
	
	font-family: 'Roboto';
	
	border: 1px solid #BBBBBB;
	
	font-size: 14px;
	
	color: #000000;
	
	background-color: #FFFFFF;
	
	display: inline-block;
	
	float: left;
	
	padding: 6px;
	
	padding-left: 10px;
	
	padding-right: 10px;
	
	cursor: pointer; cursor: hand; 
}



#Art .SearchMediaButton:hover {
	
	background-color: #F9F9F9;
	
	cursor: pointer; cursor: hand; 
}


#Art #noResultsFound {
	
	display: inline-block;
	
	width: calc(100% - 80px);
	
	text-align: center;
	
	margin: 40px;
	
	font-size: 16px;
	
}


#Art #SearchMediaContainer {
	
	display: inline-block;
	
}