﻿#mainform form a, #mainform form a:link, #mainform form a:visited, #mainform form a:active
{
	color:#000;
}


#leftcontainer
{
	float:left;
	width:335px;
	display:inline;
	padding-bottom:40px;
}
#contentcontainer
{
	position:relative;
	padding:5px 0 0 20px;
}

.subtitle
{
	font-size:1.4em;
	margin:0;
	color:#b8b8b8;
}		

.portfolio-images-thumbnails
{
	width:310px;
	min-height:400px;
	margin:0;
	border-right:2px solid #ccc;
	overflow:auto; /* needed for jQuery ui scrollable */
}
.portfolio-images-thumbnails h3
{
	color:#000;
	margin:0;
	padding:0 0 4px 4px;
}
.portfolio-images-thumbnails .portfolio-image
{
	float:left;
	border:1px solid #ddd;
	padding:3px;
	margin-right:10px; 
	margin-bottom:10px; 
	width:80px;
	height:107px;
	font-size:0.9em;
	cursor:pointer;
	overflow:hidden;
}
.portfolio-images-thumbnails.imageonly .portfolio-image
{
	border:none;
	padding:0px;
	width:90px;
	height:120px;
	margin-bottom:10px; 
}
.portfolio-images-thumbnails .portfolio-image:last-child
{
	margin-right:0; 
}
.portfolio-images-thumbnails .portfolio-image a
{
	text-decoration:none !important;
}
.portfolio-images-thumbnails .portfolio-image a:hover
{
	color:inherit !important;
}
.portfolio-images-thumbnails .portfolio-image-imgcontainer
{
	width:80px;
	height:60px; 
	overflow:hidden;
	margin-bottom:6px;
}
.portfolio-images-thumbnails.imageonly .portfolio-image-imgcontainer
{
	width:90px;
	height:120px; 
}
.portfolio-images-thumbnails .portfolio-image img
{
	background-color:#999;
	border:none;
	position:relative;
}


.portfolio-images-largelandscape
{
	width:770px;
	min-height:400px;
	margin:0;
	overflow:auto; /* needed for jQuery ui scrollable */
}
.portfolio-images-largelandscape h3
{
	color:#000;
	margin:0;
	padding:0 0 4px 4px;
}
.portfolio-images-largelandscape .portfolio-image
{
	float:left;
	padding:0 10px 40px 0;
	width:245px;
	overflow:hidden;
}
.portfolio-images-largelandscape.portfolio-single-image .portfolio-image
{
	float:none;
	width:750px;
}
html.no-js .portfolio-images-largelandscape .portfolio-image:nth-child(3n+4)
{
	clear:left;
}
.portfolio-images-largelandscape .portfolio-image a
{
	text-decoration:none !important;
}
.portfolio-images-largelandscape .portfolio-image a:hover
{
	color:inherit !important;
}
.portfolio-images-largelandscape .portfolio-image-imgcontainer
{
	width:240px;
	height:180px; 
	overflow:hidden;
	margin-bottom:6px;
}
.portfolio-images-largelandscape.portfolio-single-image .portfolio-image-imgcontainer
{
	float:left;	
	width:auto;
	height:auto;
}
.portfolio-images-largelandscape .portfolio-image img
{
	background-color:#999;
	border:none;
	position:relative;
}
.portfolio-images-largelandscape .portfolio-image-caption
{
	padding:10px 0;
	width:240px;
}
.portfolio-images-largelandscape.portfolio-single-image .portfolio-image-caption
{
	float:left;
	margin-left:20px;
	padding:0;
}
.portfolio-images-largelandscape .portfolio-image-caption p
{
	margin:2px 0;
	font-size:0.9em;
}
.portfolio-images-largelandscape p.portfolio-image-title
{
	font-size:1.3em;
	color:#a00000;
	margin:0 0 10px 0;
}
.portfolio-images-largelandscape p.portfolio-image-type
{
	margin-bottom:12px;
}


.portfolio-images-largeportrait
{
	width:770px;
	min-height:400px;
	margin:0;
	overflow:auto; /* needed for jQuery ui scrollable */
}
.portfolio-images-largeportrait h3
{
	color:#000;
	margin:0;
	padding:0 0 4px 4px;
}
.portfolio-images-largeportrait .portfolio-image
{
	float:left;
	padding:0 10px 40px 0;
	width:245px;
	overflow:hidden;
}
.portfolio-images-largeportrait.portfolio-single-image .portfolio-image
{
	float:none;
	width:750px;
}
html.no-js .portfolio-images-largeportrait .portfolio-image:nth-child(3n+4)
{
	clear:left;
}
.portfolio-images-largeportrait .portfolio-image a
{
	text-decoration:none !important;
}
.portfolio-images-largeportrait .portfolio-image a:hover
{
	color:inherit !important;
}
.portfolio-images-largeportrait .portfolio-image-imgcontainer
{
	width:240px;
	height:300px; 
	overflow:hidden;
	margin-bottom:6px;
}
.portfolio-images-largeportrait.portfolio-single-image .portfolio-image-imgcontainer
{
	float:left;	
	width:auto;
	height:auto;
}
.portfolio-images-largeportrait .portfolio-image img
{
	background-color:#999;
	border:none;
	position:relative;
}
.portfolio-images-largeportrait .portfolio-image-caption
{
	padding:10px 0;
	width:240px;
}
.portfolio-images-largeportrait.portfolio-single-image .portfolio-image-caption
{
	float:left;
	margin-left:20px;
	padding:0;
}
.portfolio-images-largeportrait .portfolio-image-caption p
{
	margin:2px 0;
	font-size:0.9em;
}
.portfolio-images-largeportrait p.portfolio-image-title
{
	font-size:1.3em;
	color:#a00000;
	margin:0 0 10px 0;
}
.portfolio-images-largeportrait p.portfolio-image-type
{
	margin-bottom:12px;
}


.portfolio-images-list
{
	width:310px;
	min-height:400px;
	margin:0;
	border-right:2px solid #ccc;
	overflow:auto; /* needed for jQuery ui scrollable */
}
.portfolio-images-list h3
{
	color:#000;
	margin:0;
	padding:0 0 4px 4px;
}
.portfolio-images-list .portfolio-image
{
	clear:left;
	display:block;
	padding:0px;
	margin-right:10px; 
	margin-bottom:0px; 
	font-size:1.1em;
	cursor:pointer;
	overflow:hidden;
}
.portfolio-images-list .portfolio-image a
{
	text-decoration:none !important;
}
.portfolio-images-list .portfolio-image:hover
{
	background-color:#ddd;
	color:inherit !important;
}
.portfolio-images-list .portfolio-image.selected
{
	background-color:#aaa;
}
.portfolio-images-list .portfolio-image-imgcontainer
{
	float:left;
	width:80px;
	height:60px; 
	overflow:hidden;
	margin:3px 0;
}
.portfolio-images-list .portfolio-image img
{
	background-color:#999;
	border:none;
	position:relative;
}
.portfolio-images-list .portfolio-image-caption
{
	float:left;
	padding:0 10px;
	white-space:nowrap;
	width:200px;
	overflow:hidden;
}
.portfolio-images-list .portfolio-image-caption p
{
	margin:2px 0;
	font-size:0.9em;
}


.portfolio-images-showcase
{
	position:relative;
	width:755px;
	height:100%;
	margin:0;
	overflow:auto; /* needed for jQuery ui scrollable */
}
.portfolio-images-showcase h3
{
	color:#000;
	margin:0;
	padding:0 0 4px 4px;
}
.portfolio-images-showcase .portfolio-image
{	
	float:left;
	width:365px;
	right:0;
	display:none;
	padding:0px;
	font-size:1.1em;
	overflow:hidden;
	background-color:#fff;
}
.portfolio-images-showcase.portfolio-single-image .portfolio-image
{	
	width:100%;
}
.portfolio-images-showcase .portfolio-image:first-child
{	
	display:inline;
	left:0;
}
.portfolio-images-showcase .portfolio-image:nth-child(2)
{	
	display:inline;
	padding-left:15px;
}
.portfolio-images-showcase .portfolio-image a
{
	text-decoration:none !important;
}
.portfolio-images-showcase .portfolio-image-imgcontainer
{
	position:relative;
	width:360px;
	height:360px;
	overflow:hidden;
	margin:3px 0;
}
.portfolio-images-showcase.portfolio-single-image .portfolio-image-imgcontainer
{
	width:100%;
}
.portfolio-images-showcase .portfolio-image img
{
	position:absolute;
	bottom:0;
	background-color:#999;
	border:none;
}
.portfolio-images-showcase .portfolio-image-caption
{
	padding:10px 0;
	width:320px;
}
.portfolio-images-showcase .portfolio-image-caption p
{
	margin:2px 0;
	font-size:0.9em;
}
.portfolio-images-showcase p.portfolio-image-title
{
	font-size:1.1em;
	color:#a00000;
	margin:0 0 10px 0;
}
.portfolio-images-showcase p.portfolio-image-type
{
	margin-bottom:12px;
}



#dataItem
{
	float:left;
	display:inline;
	position:relative;
}
#dataItem h3
{
	padding:0 0 5px 5px;
}

#datadetails
{
	width:424px;
	overflow-x:hidden;
	overflow-y:auto;
}

#datadetails.no-product-list
{
	width:750px;
}

.entry h3
{
	color:#000;
}
.entry-supplier
{
	font-size:0.8em;
}
.entry-supplier a,.entry-supplier a:link
{
	color:#a00000 !important;
}

.entry-image-container
{
	padding:0 0 10px 5px;
	position:relative;
}
.entry-image-container img
{
	border:none;
	box-shadow:3px 3px 7px #777;  
	-webkit-box-shadow:3px 3px 7px #777;
	-moz-box-shadow:3px 3px 7px #777;
}
.entry-image-container img.qrcode
{
	padding:108px;
	background:#fff url(/images/cadmiumcircle.gif) no-repeat center center;
	box-shadow:none;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
}

.entry-images-container
{
	overflow:hidden;
	position:relative;
	height:90px;
	padding:5px;
	width:400px;
	cursor:pointer;
}
.entry-images-container img.scroller
{
	position:absolute;
	top:0;
	margin:5px 0;
	zoom:1;
	filter:alpha(opacity=30);
	opacity:0.3;
}
.entry-images-container img.scroller:hover
{
	filter:alpha(opacity=60);
	opacity:0.6;
}
.entry-images-container img.scrollright
{
	right:0px;
}
.entry-images-container img.scrollleft
{
	display:none;
	left:0px;
}
.entry-images-container div
{
	position:absolute;
	top:0;
	left:5px;
	height:90px;
}
.entry-images-container div img
{
	margin:5px 5px 5px 0;
}
.entry-images-container div img:last-child
{
	margin-right:0;
}

.mobile .entry-images-container, .is-tablet .entry-images-container
{
	overflow:inherit;
}
.mobile .entry-images-container img.scroller, .is-tablet .entry-images-container img.scroller
{
	display:none;
}
.mobile .entry-images-container img.scrollright, .is-tablet .entry-images-container img.scrollright
{
	display:none;
}
.mobile .entry-images-container img.scrollleft, .is-tablet .entry-images-container img.scrollleft
{
	display:none;
}

.entry-share-buttons
{
	margin:10px 0 10px 5px;
	height:20px;
	/*background-image:url(/images/icons/shares_loading.gif);*/
	background-repeat:no-repeat;
}
body.mobile .entry-share-buttons
{
	background-image:none;
}
.entry-share-buttons > div
{
	float:left; 
	height:20px; 
	overflow:hidden;
	margin-right:5px;
}
.entry-share-button-facebook
{
	width:50px !important;
}
.entry-share-button-googleplus
{
	width:36px !important;
}
.entry-share-button-pinterest
{
	width:44px !important;
}
.entry-share-button-grape
{
	cursor:pointer;
	background-image:url(/images/icons/button.gif);
	background-repeat:no-repeat;
	font-size:0.85em;
	color:#6D8896;
	text-shadow:#D3E0E7 3px 3px 1px;
	width:60px;
	height:20px;
	padding-top:2px;
	text-align:center;
}
.entry-share-button-qrcode
{
	cursor:pointer;
	background-image:url(/images/icons/button.gif);
	background-repeat:no-repeat;
	font-size:0.85em;
	color:#6D8896;
	text-shadow:#D3E0E7 3px 3px 1px;
	width:60px;
	height:20px;
	padding-top:2px;
	text-align:center;
}
.entry-share-button-sharesend
{
	display:inline-block;
	margin:0 0 0 8px;
}

.article-summary
{
}
.article-body
{
	display:none;
}
.entry-buttons
{
	padding:10px 5px 20px 5px;
}
a.article-body-showfull
{
}

.entry-enquire
{
	display:none;
}
.entry-enquire fieldset
{
	width:400px !important;
	margin:20px 0 20px 0 !important;
	padding:0 !important;
	border:none !important;
}
.entry-enquire fieldset legend
{
	color:#a00000;
}
.entry-enquire div label
{
	margin:2px 0 2px 5px !important;
}
.entry-enquire input[type='text']
{
	width:260px;
}
.entry-enquire textarea
{
	width:368px !important;
	height:90px;
}
.entry-enquire div.submit
{
	padding:5px 10px;
}
.entry-buttons-enquire-submit
{
	float:right;
	width:60px;
}
.entry-buttons-enquire-cancel
{
	float:right;
	width:60px;
}

.section-drag-hover
{
	background-color:#ddd;
}
.linked-section.section-drag-hover
{
	background:#fff url(/images/icons/no-entry.png) no-repeat right center;
}

.sectiongroup-hidden
{
	display:none !important;
	margin:0 !important;
}

/** grape demo */
.grape-dialog
{
	background-color:#fff;
	z-index:11;
}
.grape-input-vertical
{
	margin:10px 0;
}
.grape-input-vertical label
{
	float:none;
	display:block;
}
.grape-input-vertical input[type='text'], .grape-input-vertical input[type='password']
{
	width:220px;
}
.grape-error
{
	color:#a00000;
	list-style:circle none inside;
	margin:0;
	padding:0;
}
.grape-error li
{
	margin:0;
	padding:3px 0;
}

/** mobile style */
body.mobile #headingcontainer
{
	height:auto;
	width:auto;
	padding:10px 0 10px 0;
}
body.mobile #contentcontainer
{
	clear:left;
	width:auto;
	padding:20px 0 20px 10px;
}
body.mobile #leftcontainer
{
	float:none;
}
body.mobile #dataItem
{
	display:block;
	float:none;
	width:410px;
	padding:10px 0 40px 0;
	border-bottom:1px solid #999;
	margin:0 0 10px 0px;
}
body.mobile #datadetails.no-product-list 
{
	margin-left:0;
}
body.mobile #dataItem h3
{
	padding:0 0 5px 0;
}
body.mobile #datadetails
{
	position:inline;
	width:410px;
	margin-left:10px;
}
body.mobile .portfolio-images
{
	border-right:none;
}
body.mobile .entry
{
	padding:5px 0;
}
body.mobile .entry-image-container
{
	padding:0 0 10px 0;
}
body.mobile .entry-share-buttons
{
	margin:10px 0;
}
body.mobile .entry-buttons
{
	padding:10px 0 20px 0;
}
body.mobile .entry-buttons-enquire
{
	display:none !important;
}

/* iPad landscape */
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape)
{
	body.is-ipad #leftcontainer
	{
		width:575px;
	}
	
	body.is-ipad .portfolio-images-list
	{
		width:565px;
	}
	body.is-ipad .portfolio-images-thumbnails
	{
		width:535px;
	}
	
	body.is-ipad .portfolio-images-largelandscape
	{
		width:1004px;
	}
	body.is-ipad .portfolio-images-largelandscape .portfolio-image
	{
		width:240px;
	}
	body.is-ipad .portfolio-images-largelandscape.portfolio-single-image .portfolio-image
	{
		width:1004px;
	}
	body.is-ipad .portfolio-images-largelandscape .portfolio-image-imgcontainer
	{
		width:235px;
		height:176px; 
	}
	body.is-ipad .portfolio-images-largelandscape .portfolio-image-caption
	{
		width:235px;
	}

	body.is-ipad .portfolio-images-largeportrait
	{
		width:1004px;
	}
	body.is-ipad .portfolio-images-largeportrait .portfolio-image
	{
		width:240px;
	}
	body.is-ipad .portfolio-images-largeportrait.portfolio-single-image .portfolio-image
	{
		width:1004px;
	}
	body.is-ipad .portfolio-images-largeportrait .portfolio-image-imgcontainer
	{
		width:235px;
		height:294px; 
	}
	body.is-ipad .portfolio-images-largeportrait .portfolio-image-caption
	{
		width:235px;
	}

	body.is-ipad #datadetails.entry
	{
		padding:0;
	}
}

/* iPad portrait */
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait)
{
	body.is-ipad #leftcontainer
	{
		width:319px;
	}
	body.is-ipad .portfolio-images-list
	{
		width:309px;
	}
	body.is-ipad .portfolio-images-list .portfolio-image-caption
	{
		width:180px;
	}
	
	body.is-ipad .portfolio-images-largelandscape
	{
		width:748px;
	}
	body.is-ipad .portfolio-images-largelandscape .portfolio-image
	{
		width:235px;
	}
	body.is-ipad .portfolio-images-largelandscape.portfolio-single-image .portfolio-image
	{
		width:748px;
	}
	body.is-ipad .portfolio-images-largelandscape .portfolio-image-imgcontainer
	{
		width:230px;
		height:176px; 
	}
	body.is-ipad .portfolio-images-largelandscape .portfolio-image-caption
	{
		width:230px;
	}

	body.is-ipad .portfolio-images-largeportrait
	{
		width:748px;
	}
	body.is-ipad .portfolio-images-largeportrait .portfolio-image
	{
		width:235px;
	}
	body.is-ipad .portfolio-images-largeportrait.portfolio-single-image .portfolio-image
	{
		width:748px;
	}
	body.is-ipad .portfolio-images-largeportrait .portfolio-image-imgcontainer
	{
		width:230px;
		height:287px; 
	}
	body.is-ipad .portfolio-images-largeportrait .portfolio-image-caption
	{
		width:230px;
	}

	body.is-ipad #datadetails.entry
	{
		padding:0;
	}
}

@media only screen and (max-device-width:1024px)
{
	#datadetails.fixed
	{
		position:relative !important;
	}
}

@media only screen and (max-device-width:480px)
{
	body.mobile #headingcontainer
	{
		width:460px;
	}
	body.mobile #datadetails
	{
		width:460px;
	}
	body.mobile .entry-image-container img
	{
		max-width:400px;
	}
}
@media only screen and (max-device-width:320px)
{
	body.mobile #headingcontainer
	{
		width:300px;
	}
	body.mobile #datadetails
	{
		width:300px;
	}
	body.mobile .entry-image-container img
	{
		max-width:300px;
	}
}

