@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url('http://themes.googleusercontent.com/static/fonts/montserrat/v2/zhcz-_WihjSQC0oHJ9TCYBsxEYwM7FgeyaSgU71cLG0.woff') format('woff');
}

@font-face {
  font-family: 'Istok Web';
  font-style: italic;
  font-weight: 400;
  src: local('Istok Web Italic'), local('IstokWeb-Italic'), url('http://themes.googleusercontent.com/static/fonts/istokweb/v5/8-xqDtEk6sZ61magDpsV8YbN6UDyHWBl620a-IRfuBk.woff') format('woff');
}
@font-face {
  font-family: 'Istok Web';
  font-style: italic;
  font-weight: 700;
  src: local('Istok Web Bold Italic'), local('IstokWeb-BoldItalic'), url('http://themes.googleusercontent.com/static/fonts/istokweb/v5/ycQ3g52ELrh3o_HYCNNUwzqR_3kx9_hJXbbyU8S6IN0.woff') format('woff');
}
@font-face {
  font-family: 'Istok Web';
  font-style: normal;
  font-weight: 400;
  src: local('Istok Web Regular'), local('IstokWeb-Regular'), url('http://themes.googleusercontent.com/static/fonts/istokweb/v5/EvPKapBawcLZ3hbihjhqAT8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
}
@font-face {
  font-family: 'Istok Web';
  font-style: normal;
  font-weight: 700;
  src: local('Istok Web Bold'), local('IstokWeb-Bold'), url('http://themes.googleusercontent.com/static/fonts/istokweb/v5/2koEo4AKFSvK4B52O_MwanhCUOGz7vYGh680lGh-uXM.woff') format('woff');
}

/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

ARTICLE, ASIDE, DETAILS, FIGCAPTION, FIGURE, FOOTER, HEADER, HGROUP, NAV, SECTION
{
	display: block;
}

HTML, BODY, BODY DIV, SPAN, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, PRE, ABBR, ADDRESS, CITE, CODE, DEL, DFN, EM, IMG, INS, KBD, Q, SAMP, SMALL, STRONG, SUB, SUP, VAR, B, I, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, CAPTION, TBODY, TFOOT, THEAD, TR, TH, TD, ARTICLE, ASIDE, FIGURE, FOOTER, HEADER, HGROUP, MENU, NAV, SECTION, TIME, MARK, AUDIO, VIDEO
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
}

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

HTML
{
	font-size: 100%;
	-webkit-font-smoothing: antialiased;
	-webkit-overflow-scrolling: touch;
	-webkit-tap-highlight-color: #3E5F6E;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	overflow-y: scroll;
}

HTML, BUTTON, INPUT, SELECT, TEXTAREA
{
	font-family: sans-serif;
	color: #666666;
}

BODY
{
	background-color: transparent;
	/* color: rgb(40,40,40); 320 and Up preference */
	margin: 0 auto;
	font-family: 'Istok Web', Arial, sans-serif;
	font-size: 12px;
	/*font-size: .75em; */
	line-height: 1.25em;
	padding: 0;
	text-rendering: optimizeLegibility; /* See https://developer.mozilla.org/en/CSS/text-rendering for more information. */
	/* Also consider using the -moz-font-feature-settings (or otherwise prefixed or non-prefixed) property to handle alternates, ligatures, small caps, kerning, fractions, etc. See http://ie.microsoft.com/testdrive/Graphics/opentype/opentype-fontbureau/index.html for for more information. */
}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */

#container
{
	width: 895px;
	margin: 0 auto;
	padding: 0 40px;
}

IMG, OBJECT, EMBED
{
	max-width: 100%;
	height: auto;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i and twitter.com/miketaylr/status/12228805301
 * These selection declarations have to be separate
 */
 

::-webkit-selection
{
	background: #3E5F6E;
	color: #fff;
	text-shadow: none;
}

::-moz-selection
{
	background: #3E5F6E;
	color: #fff;
	text-shadow: none;
}

::selection
{
	background: #3E5F6E;
	color: #fff;
	text-shadow: none;
}


/* =============================================================================
   Links
   ========================================================================== */
   
/* Remember that link pseudo-classes can also be combined, such as A:visited:hover (to define the state of an anchor element that has already been visited and is now being hovered over). */

A
{
	color: #00E;
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	text-decoration: none;
}

/*	j.mp/webkit-tap-highlight-color */
A:link
{
	color: #91AA9D;
	text-decoration: none;
} 

A:visited
{
	color: #91AA9D;
}

A:hover, .current A, .current, FOOTER NAV UL LI A:link.current, FOOTER NAV UL LI A.current:link,
FOOTER NAV UL LI A:visited.current, FOOTER NAV UL LI A.current:visited
{
	color: #3E5F6E;
}

-webkit-active-link
{
	color: #FFFFFF;
}

A:focus
{
	color: #FFFFFF;
	outline: thin dotted;
}

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */

A[href]:active
{ color: white;  -webkit-text-fill-color: red; }

A:hover, A:active
{
	outline: none; /* Accessible focus treatment people.opera.com/patrickl/experiments/keyboard/test */
}


/* =============================================================================
   Typography
   ========================================================================== */

HEADER HGROUP, NAV
{	
	font-family: 'Montserrat', Arial, sans-serif;
}

ADDRESS, INPUT, SECTION
{	
	font-family: 'Istok Web', Arial, sans-serif;
}

H1
{ 
	color: #3E5F6E;
	position: relative;
}

H1.fn
{ 
	display: block;
	position: relative;
	width: 370px;
	height: 55px;
	background-image: url(../img/common/logo-brian-leatart-photography.jpg);
	text-indent: -9999px;
}

H2
{
	color: #3E5F6E;
	position: relative;
	text-transform: uppercase;
}

H2.title
{
	height: 6px;
	visibility: hidden;
}

P
{
	/* http://www.w3.org/TR/css3-text/#hyphenation */
	-webkit-hyphens: auto;
	-webkit-hyphenate-character: "\2010";
	-webkit-hyphenate-limit-after: 1;
	-webkit-hyphenate-limit-before: 3;
	-moz-hyphens: auto;
	hyphens: auto; 
	text-align: justify;
}

P, OL, UL, ADDRESS
{ 
	margin-bottom: 15px;
	/* margin-bottom: 1.5em; */
}

/* Font sizing for main elements here: */

H1
{ 
	font-size: 30px;
	/* font-size: 2.8rem; */
}

H2
{ 
	font-size: 30px;
	line-height: 2em;
	/* font-size: 1.6rem; */
}

H3, HEADER NAV, INPUT, FOOTER NAV UL LI, .clients
{ 
	font-size: 14px;
	line-height: 1.25;
	/* font-size: 1.4rem; */
}

#books SPAN
{
	color: #B3B3B3;
	font-size: 13px;
}

ADDRESS, FIGCAPTION
{ 
	font-size: 13px;
	line-height: 1.25em;
	/* font-size: 1.2rem; */
}

/*

address, caption - 12

upper nav, everything else in the form - 14

bottom nav, photographer - 16

name - 50, tweak letter spacing

contact us - 40

 */


/* =============================================================================
   Header
   ========================================================================== */
  
HEADER
{
	position: relative;
}
  
HGROUP
{
	position: relative;
	width: 370px;
	margin-top: 25px;
}

#card-Brian-Leatart
{
	max-width: 80%;
}

HEADER ADDRESS
{
	font-style: normal;
}

HEADER HGROUP, HEADER .street-address, HEADER .locality, HEADER NAV, FOOTER NAV UL LI
{
	text-transform: uppercase;
}

#hcard-Brian-Leatart A:link,
#hcard-Brian-Leatart A:visited
{
	color: #666666;
}

#hcard-Brian-Leatart A:hover,
#hcard-Brian-Leatart A:active
{
	color: #999999;
}

HEADER NAV
{
	position: absolute;
	right: 0px;
	bottom: 0px;
	text-align: right;
}

HEADER NAV UL LI
{
	margin-bottom: 3px;
}

/* =============================================================================
   Lists
   ========================================================================== */

UL, OL
{
	list-style: none;
	margin: 1em 0;
	padding: 0 0 0 0px;
}

LI UL, 
LI OL
{ 
	margin: 0;
}

NAV UL, NAV OL
{
	list-style: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
}

.pageNotFound UL LI
{
	list-style: inside;
	margin: 0;
	padding: 0;
}


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
 */

IMG
{
	border: 0;
	-ms-interpolation-mode: bicubic;
	vertical-align: middle;
	width: auto\9; /* ie8 */
}


/* =============================================================================
   Forms
   ========================================================================== */

FORM
{
	margin: 0;
}

FIELDSET
{
	border: 0;
	margin: 0;
	padding: 0;
}

/* Indicate that 'label' will shift focus to the associated form element */
LABEL
{
	font-weight: normal;
	cursor: pointer;
}

/*
 * 1. Correct color not inheriting in IE6/7/8/9
 * 2. Correct alignment displayed oddly in IE6/7
 */

LEGEND
{
	border: 0;
	*margin-left: -7px;
	padding: 0;
	white-space: normal;
}

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

BUTTON, INPUT, SELECT, TEXTAREA
{
	font-size: 99%;
	margin: 0;
	vertical-align: baseline;
	*vertical-align: middle;
}

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */

BUTTON, INPUT
{
	line-height: normal;
	*overflow: visible;
}

/* make buttons play nice in IE */
BUTTON
{
	width: auto;
	overflow: visible;
}

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */

BUTTON, INPUT[type="button"], INPUT[type="reset"], INPUT[type="submit"], INPUT[type="email"]
{
	cursor: pointer;
	-webkit-appearance: button;
}

.ie6 INPUT
{
	vertical-align: text-bottom;
}

::-webkit-input-placeholder
{
	font-size: 12px;
	/* font-size: .875em; */
	line-height: 1.25;
}

input:-moz-placeholder
{ 
	font-size: 12px;
	/* font-size: .875em; */
	line-height: 1.25;
}

input:placeholder
{ 
	font-size: 12px;
	/* font-size: .875em; */ 
	line-height: 1.25;
}

/*
 * Re-set default cursor for disabled elements
 */

BUTTON[disabled], INPUT[disabled]
{
	cursor: default;
}

/*
 * Consistent box sizing and appearance
 */
 
INPUT[type="radio"]
{
	vertical-align: text-bottom;
}

INPUT[type="checkbox"]
{
	vertical-align: bottom;
	*vertical-align: baseline;
}

INPUT[type="checkbox"], INPUT[type="radio"]
{
	box-sizing: border-box;
	padding: 0;
	*width: 13px;
	*height: 13px;
}

/*
 * Remove inner padding and border in FF3/4: h5bp.com/l
 */

BUTTON::-moz-focus-inner, INPUT::-moz-focus-inner
{
	border: 0;
	padding: 0;
}

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */

TEXTAREA
{
	overflow: auto;
	vertical-align: top;
	resize: vertical;
}

/* Colors for form validity */
INPUT:valid, TEXTAREA:valid
{
	
}

INPUT:invalid, TEXTAREA:invalid
{
	background-color: #f0dddd;
}





/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe
{
	margin: 0.2em 0;
	background: #ccc;
	color: black;
	padding: 0.2em 0;
}




ARTICLE
{
	color: #666666;
	overflow: visible;
}


#slideshowWithThumbNails
{
	overflow: hidden;
	position: relative;
	width: 895px;
	height: 460px;
}



.o-prev, .o-next
{
	position: absolute;
}

.o-prev
{
	left: 0px;
}

.o-next
{
	left: 795px;
}

.overlay
{
	position: absolute;
	top: 0px;
	z-index: 2;
	overflow: hidden;
	background: transparent url(../img/common/transparent.png) repeat 0 0;
	background: rgba(255, 255, 255, 0.9) none;
}

.overlay A
{
	display: block;
	height: 460px;
	width: 100px;
	overflow: hidden;
	position: relative;
}

.overlay A IMG
{
	position: absolute;
	left: 41px;
	top: 221px;
}

.overlay:hover
{
	background: none;
}

.carousel UL
{
	list-style: none;
}

.carousel
{
	position: absolute;
	margin: 0px;
	width: 695px;
	top: 0px;
}

#carousel-prev
{
	left: -595px;
	z-index: 1;
}

#carousel-current
{
	left: 101px;
	z-index: 3;
}

#carousel-next
{
	left: 796px;
	z-index: 1;
}

.clients
{
	float: left;
}

.clients UL LI
{
	margin-bottom: 10px;
	/* margin-top: .8em; */
}

.clients .secondColumn
{
	padding-top: 73px;
	/* padding-top: 4em; */
}

#magazines
{
	padding-top: 28px;
	/* padding-top: 4em; */
}

#books
{
	padding-top: 66px;
	/* padding-top: 4em; */
}

.clients
{
	width: 24%;
}

.clients + .clients
{
	margin-left: 1%;
}

.slideshow
{
	width: 895px;
	height: 570px;
	overflow: hidden;
}

.slideshow IMG
{
	float: left;
}

#CycNav LI
{
	float: left;
	margin-right: 1px;
}

#CycNav LI:last-of-type
{
	margin-right: 0px;
}

/*

File Name: contact.css
Description: 
Version: 0.1 April 9, 2012
Author: Kitty Chan

Also, much of this comes from:

 * SimpleModal Contact Form
 * http://www.ericmmartin.com/projects/simplemodal/
 * http://code.google.com/p/simplemodal/
 *
 * Copyright (c) 2010 Eric Martin - http://ericmmartin.com
 *
 * Licensed under the MIT license:
 *   http://www.opensource.org/licenses/mit-license.php
 *
 * Revision: $Id: contact.css 254 2010-07-23 05:14:44Z emartin24 $
 */

/* Overlay */
#contact-overlay {
	background-color: #000000;
	cursor: wait;
}

@media screen and (-webkit-min-device-pixel-ratio:0)
{
#contact-overlay {
	background-size: 200%;
	width: 2000px !important;
	height: 2000px !important;
	}
}/*/mediaquery*/

/* Container */
#contact-container {
	background-color: #FFFFFF;
	width: 460px;
	height: 470px;
	font-family: 'Istok Web', Arial, sans-serif;
	font-size: 14px;
	text-align: left;
}
   
 /* iPhone portrait mode; This also hopefully properly targets the Blackberry browser. */

@media only screen and (max-width: 479px)
{
	#contact-container
	{
		left: 1px !important;
	}
}/*/mediaquery*/

/* Targeting only iPad landscape (and devices with similar displays) */
@media only screen and (max-device-width: 1024px) and (orientation:landscape) 
{
	#contact-container
	{
		left: 280px !important;
	}
}/*/mediaquery*/

/* Targeting only iPad portrait (and devices with similar displays) */
@media only screen and (max-device-width: 1024px) and (orientation:portrait)
{
	#contact-container
	{
		left: 180px !important;
	}
}/*/mediaquery*/


/* =============================================================================
   Contact Styles
   ========================================================================== */

#contact-container .contact-content {
	color: #999999;
}

#contact-container h2 {
	margin: 0; 
	padding: 30px 0 0 110px;
	color: #3E5F6E;
	font-size: 30px;
	text-align: left;
	text-transform: uppercase;
}

#contact-container .contact-loading {
	position: absolute;
	background: url(../img/contact/loading.gif) no-repeat; 
	height: 128px;
	width: 15px;
	margin: 0 auto;
	padding: 0;
	z-index: 8000;
}

#contact-container .contact-message {
	text-align: center;
}

#contact-container .contact-error {
	margin: 0 auto;
	padding-bottom: 30px;
	font-size: 14px;
	color: #990000;
}

#contact-container br {
	clear: both;
}

#contact-container form {
	margin: 0;
	padding: 0;
}

#contact-container label {
	clear: left;
	display: block;
	float: left;
	width: 100px;
	padding: 15px 5px 0 0;
	text-transform: uppercase;
	text-align: right;
	
}

#contact-container .contact-input {
	background: #E6E6E6;
	float: left;
	width: 300px;
	padding: 5px;
	margin: 5px;
	border:1px solid #FFFFFF;
	font-family: 'Istok Web', sans-serif;
	font-size: 14px;
	color: #999999;
	line-height: .875em;
}

#contact-container textarea {
	height: 100px;
}

#contact-container .contact-cc {
	cursor: default;
	font-size: 14px;
	vertical-align: middle;
}

#contact-container .contact-button {
	background: #3E5F6E;
	border: 0;
	color: #FFFFFF;
	cursor: pointer;
	height: 25px;
	margin: 5px 0 0 5px;
	padding-top: 5px;
	font-size: 14px;
	text-transform: uppercase;
	text-align: center;
	vertical-align: middle;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}

#contact-container .contact-button:hover {
	background: #91AA9D;
}

#contact-container a.modal-close,
#contact-container a.modal-close:link,
#contact-container a.modal-close:active,
#contact-container a.modal-close:visited {
	position: absolute;
	right: 16px;
	top: 14px;
	color: #E6E6E6;
	font-size: 30px;
	text-decoration: none;
	z-index: 8000;
}

#contact-container a.modal-close:hover {
	color: #999999;
}


/* =============================================================================
   Footer
   ========================================================================== */

FOOTER
{
	clear: both;
	margin-top: 25px;
	/* margin-top: 1em; */
}

FOOTER NAV UL LI
{
	color: #CCCCCC;
	float: left;
	margin: -5px 15px 25px 0;
	/* margin-right: .5em; */
}


LI#food:before, LI#restaurants:before, LI#travel:before, LI#portraits:before
{
	content: "//"
}

.portfolio01 {
	padding-left: 10px;
}

.subPortfolio {
	margin-left: -20px;
}

FOOTER NAV UL LI A
{
	padding-left: 15px;
	/* padding-left: .5em; */
}

FOOTER NAV UL LI A:link,
FOOTER NAV UL LI A:visited
{
	color: #91AA9D;
}

FOOTER NAV UL LI A:hover,
FOOTER NAV UL LI A:active
{
	color: #3E5F6E;
}

#portfolioNav
{
	margin-top: -120px;
}



/*

File Name: gallery.css
Description: 
Version: 0.1 April 9, 2012
Author: Kitty Chan

Also, much of this comes from:

 * An Elegant Sliding Image Gallery with jQuery
 * http://www.elated.com/articles/elegant-sliding-image-gallery-with-jquery/
 *
 * Copyright (c) 2011 Mayy Doyle
 * Licensed under the Creative Commons
 * http://creativecommons.org/licenses/by/3.0/
 *
 * Date: 2011-03-16
 */

/*
	Container for the gallery:

	Fixed height
	Hide the overflow to prevent horizontal scrollbars

*/

#galleryContainer {
	position: relative;
	overflow: hidden;
	width: 895px;
	height: 460px;
	margin: auto 0;
	background-color: #E6E6E6;
	z-index: 1;
}
	

/*
	The gallery div that contains all the images

	We'll set the width dynamically in the JavaScript as the images load
*/

#gallery {
	position: relative;
	height: 460px;
	z-index: 1;
}


/*
	Individual slides within the gallery:

	Float them left so that they're all side by side
	Fixed height (the width will vary as required)
	Add some horizontal margin between the slides
	Add a bottom fading reflection for WebKit browsers
*/

#gallery img {
	float: left;
	height: 460px;
	padding: 0 5px 0 0;		/* Adjust the right padding to show greater or fewer slides at once */
	background-color: #FFFFFF;
	-webkit-box-reflect:
		below
		0
		-webkit-gradient(
			linear,
			left top,
			left bottom,
			color-stop(1, rgba(255, 255, 255, .5)),
			color-stop(.8, rgba(255, 255, 255, 0))
		);
}

#gallery img:first-child {
	padding-left: 5px;	/* Match the right padding of the image */
}

/*
	Left and right buttons:

	Position them on the left and right sides of the gallery
	Stretch them to the height of the gallery
	Hide them by default
*/

#leftButton, #rightButton {
	position: absolute;
	width: 18%;
	height: 460px;			/* Image height */
	top: 0px;
	bottom: 0;
	margin: auto 0;
	padding: 0;
	background: transparent url(images/blank.gif);
	border: none;
	outline: none;
	font-family: "Courier New", courier, fixed;
	color: #FFFFFF;
	font-size: 50px;
	opacity: .7;
	filter: alpha(opacity=70);
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	-o-transition: opacity .5s;
	transition: opacity .5s;
	z-index: 2;
}

#leftButton {
	left: 0;
	padding-left: 15px;
	text-align: left;
}

#rightButton {
	right: 0;
	padding-right: 15px;
	text-align: right;

}

/* (Turn off dotted black outline on FF3) */

#leftButton::-moz-focus-inner, #rightButton::-moz-focus-inner {
	border: none;
}

/*
	Left and right button hover states:
	Fade them in to 50% opacity
*/

#leftButton:hover, #rightButton:hover {
	opacity: 1;
	filter: alpha(opacity=100);
	outline: none;
}


/*
	Image caption:

	Position just under the centre image
	Hide by default
*/
#captionContainer
{
	height: 10px;
}

#caption
{
	position: relative;
	top: 5px;
	width: 100%;
	color: #666666;
	font-family: 'Istok Web', Arial, sans-serif;
	text-align: center;
	font-size: 12px;
	display: block;	/* Set display to "none" if the caption should display on mouseover; Set display to "block" if the caption should display automatically */
	z-index: 2;
}


/*
	Loading text:

	Position in the centre of the gallery container
	Hide by default
*/

#loading
{
	position: absolute;
	top: 50%;
	width: 100%;
	color: #FFFFFF;
	font-family: 'Istok Web', Arial, sans-serif;
	text-align: center;
	font-size: 20px;
	text-transform: uppercase;
	opacity: 0;
	filter: alpha(opacity=0);
	z-index: 1;
}


/* IE7 positions the buttons incorrectly; compensate */
*+html . #leftButton, *+html . #rightButton
{
	top: 50px;
}


/*

File Name: contact.css
Description: 
Version: 0.1 April 9, 2012
Author: Kitty Chan

Also, much of this comes from:

Thumbnail scroller jQuery plugin
Author: malihu [http://manos.malihu.gr]
Homepage: manos.malihu.gr/jquery-thumbnail-scroller
*/

.jThumbnailScroller  {
	position:  relative;
	width: 895px;
	height: 60px;
	margin: 40px auto 0 auto;
	padding: 0;
	overflow: hidden;
}

.jThumbnailScroller .jTscrollerContainer {
	position: absolute;
}

.jThumbnailScroller .jTscroller {
	position: relative;
	height: 100%;
	margin: 0;
	left: 0;
	top: 0;
	display: inline-block;
	*display: inline;
}

.jThumbnailScroller .jTscroller a {
	display: block;
	float: left;
	margin-left: 5px;
	opacity: 0.8;
	filter: alpha(opacity=0.8);
}

.jThumbnailScroller .jTscroller a:hover {
	opacity: 1;
	filter: alpha(opacity=1);
}

.jThumbnailScroller .jTscroller a:first-child {
	margin-left: 0px;
}

.jThumbnailScroller .jTscroller a img {
	border: none;
}


   
/* iPhone portrait mode; This also hopefully properly targets the Blackberry browser

		Inherits styles from: Default Layout. */

@media only screen and (max-width: 479px)
{
	
	BODY > DIV
	{
		margin: 0px auto;
	}
	
}/*/mediaquery*/


/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
   consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/
   
   Wide Mobile Layout; like landscape mode on iPhone and iPod touch; screen *seems to be* 491 pixels across

Inherits styles from: Default Layout, Mobile Layout. */

@media only screen and (min-width: 480px)
{
}/*/mediaquery*/


/*		Tablet Layout: 768px. Portrait.

		Inherits styles from: Default Layout. */

@media only screen and (min-width: 768px)
{
	
	BODY > DIV
	{
		margin: 0px auto;
	}

}/*/mediaquery*/


@media only screen and (min-width: 992px)  /* Style adjustments for landscape mode and browsers with widths equal to or greater than iPad landscape mode goes here; as of May 17, 2011, this media query seems to be properly targeting iPad landscape */
{

}/*/mediaquery*/




/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print
{

	*
	{
		background: transparent !important;
		color: black !important;
		box-shadow: none !important;
		text-shadow: none !important;
		filter:none !important;
		-ms-filter: none !important;
	} /* Black prints faster: h5bp.com/s */
	
	NAV
	{
		display: none;
	}
	
	A, A:visited
	{
		text-decoration: underline;
	}
	
	A[href]:after
	{
		content: " (" attr(href) ")";
	}
	
	ABBR[title]:after
	{
		content: " (" attr(title) ")";
	}
	
	A[href^="javascript:"]:after, A[href^="#"]:after
	{
		content: "";
	}  /* Don't show links for images, or javascript/internal links */
	
	PRE, BLOCKQUOTE
	{
		border: 1px solid #999;
	}
	
	THEAD
	{
		display: table-header-group;
	} /* h5bp.com/t */
	
	BLOCKQUOTE, IMG, PRE, TR
	{
		page-break-inside: avoid;
	}
	
	IMG
	{
		max-width: 100% !important;
	}
	
	@page
	{
		margin: 0.5cm;
	}
	
	P, H2, H3
	{
		orphans: 3; widows: 3;
	}
	
	H2, H3
	{
		page-break-after: avoid;
	}
	
}

}/*/mediaquery*/