/*
Theme Name: Tomi Ungerer Theme
Theme URI: http://www.tomiungerer.com/
Description:
Version: 1.0
Author: Frank Prendergast
Author URI: http://frankprendergast.ie/
Tags: tomi, ungerer



*/



/* reset styles ----------------*/
/* remember to define focus styles! */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, codedel, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* end reset */

/* ie pngfix */

 /* .close { behavior: url(http://wp.frankp.me/pngfix/iepngfix.htc) }*/

 /* ------------ */


body{
	font-size:14px;
	line-height:24px;
	font-family: Georgia, serif;
	color:#000000;
	text-align:center;
	/*background-image: url(images/backgrounds/rule.gif);*/
}

/* --------------------------------- main typography */

strong{
	font-weight:bold;
}

em{
	font-style: italic;
}

img{
	display:block;
}


.mainContent p{
	/*width:490px;*/
	margin-right:120px;
	/* to allow for pullquotes
	don't use width because IE6 will cut off content
	http://haslayout.net/css/Negative-Margin-Bug
	*/
}

h2 + p {
		font-size:18px;
	line-height:24px;
	font-weight:normal;
}

.secondContent p{
	/*width:490px;*/
	margin-right:120px;
	/*margin-left:200px;*/
}

.topContent strong, .largerText {
	font-size:18px;
	line-height:24px;
	font-weight:normal;
}

p{
	margin-bottom:24px;
}

h2, h3, h4, h5{
	font-family: Georgia, serif;
	font-variant: small-caps;
	font-weight:normal;
	margin-top:12px;
	margin-bottom:12px;

}

h2 {
	font-size:48px;
	line-height:60px;
	padding-bottom:12px;
}

.blog h2,
.press-clippings-container h2{
	font-size:36px;
	line-height:48px;
}

h2 a:link, h3 a:link {
	color:#000000;
	border-bottom:1px dotted #0072bc;
	text-decoration:none;
}

h2 a:visited, h3 a:visited{
	color:#000000;
	border-bottom:1px dotted #cccccc;
	text-decoration:none;
}

h2 a:hover, h3 a:hover{
	color:#0072bc;
}

h3{
	font-size:24px;
	line-height:48px;
}


.mainContent h2, .secondContent h2{
		margin-right:120px;
}

blockquote.pull{
	color:#898989;
	float:right;
	position:relative;
	display:block;
	padding:24px;
	width:300px;
	/*background-color:#faf4e6;*/
	font-size:18px;
	border-top:1px solid #898989;
	border-bottom:1px solid #898989;
	border-left:none;
	margin: 0 0 24px 24px;
	font-family: "Times New Roman", Times, serif;
	/*border:1px solid red;*/
}

blockquote.pull p{
	margin:0;
}

.sideBar p.note1{
	font-variant: small-caps;
	color:#979797;
	background-color:#e5e5e5;
	text-align:right;
	padding-right:12px;
	margin-bottom:12px;
	font-size:14px;
}

.sideBar .caption{
	background-color:#000000;
   /*opacity: 0.5;
	margin-top:-24px;*/
	color:#979797;
	margin:0;
	font-style: italic;
	padding: 0 5px 0 5px;
	border-top:1px solid #898989;
}

.sideBar p{
	font-size:12px;
	color:#898989;
	text-align:right;
}

/* other elements */

acronym, abbr, span.caps {
	cursor: help;
	}

acronym, abbr {
	border-bottom: 1px dashed #999;
	}

blockquote {
	margin: 15px 30px 0 10px;
	padding-left: 20px;
	border-left: 5px solid #ddd;
	}

blockquote cite {
	margin: 5px 0 0;
	display: block;
	}

.center {
	text-align: center;
	}

.hidden {
	display: none;
	}

.screen-reader-text {
     position: absolute;
     left: -1000em;
}

hr {
	display: none;
	}

a img {
	border: none;
	}


a:link{
	color:#0072bc;
}

a:hover, a:focus{
	text-decoration:none;
}

a:active{

}




/* Begin Images */
p img {
	padding: 0;
	max-width: 100%;
	}

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	display: inline;
	}

img.alignleft {
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left;
	}
/* End Images */




/* --------------------------------------- main page sections */

/* common page sections */

.widthHolder{
	margin:0 auto;
	overflow:visible;
	position:relative;
	text-align:left;
	width:960px; // reverted from 1080
	clear:left;
}

.sideBar{
	width:310px;
	float:left;
}

.mainContent{
	width:610px;
	float:right;
}

.secondContent{
	/*width:810px;*/
	width:610px;
	float:right;
	margin-top:24px;
	overflow:visible;
	border-top:1px dotted #898989;
	padding-top:23px;
}

/* page sections */

#pageTop{
	text-align:center;
	background-color:#e6e9ec;
	overflow:visible;
	height:122px;
	position: relative;
	z-index: 1;
}

#pageTop .widthHolder #sig{
	background-image: url(images/backgrounds/signature.png);
	position:absolute;
	top:0;
	left:0;
	width:550px;
	height:298px;
}

#sig a{
	width:325px;
	height:145px;
	text-indent:-999999px;
	display:block;
	z-index:100;
}

/* mainContent images */

.mainContent img.alignleft{
	margin-right:12px;
	margin-bottom:12px;
}

.mainContent a.cboxElement img{
	border:2px solid #E5E5E5;
}

.mainContent a:hover.cboxElement img{
	border:2px solid #898989;
}


/* icons */

#pageTop #icons{
	position:absolute;
	text-align:right;
	right:120px;
	top:100px;
}

#pageTop #icons ul{
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	/*border:1px solid blue;*/
}

#pageTop #icons ul li{
	display:inline;

}

.icon a{
	width:16px;
	height:16px;
	text-indent:32px;
	background-position: 0 0;
	background-repeat: no-repeat;
	overflow:hidden;
	float:right; /* ie 7 had probs with display-inline causing a gap on top */
	margin-left:4px;
	vertical-align:top;
	/*border:1px solid red;*/
}

.icon a:hover{
	background-position: 0 -16px;
}

#rssIcon a{
	background-image: url(images/icons/rss-icon.png);
}

#searchIcon a{
	background-image: url(images/icons/search-icon.png);
}

#pageTop #icons .icon-new a {
	display: inline-block;
	width: 16px;
	height: 16px;
	float: right;
	margin-left: 4px;
	vertical-align: top;
	filter: grayscale(100%);
	opacity: 0.6;
}

#pageTop #icons .icon-new a img {
	width: 100%;
	border-radius: 3px;
}

#pageTop #icons .icon-new a:hover {
	filter: grayscale(0);
	opacity: 1;
}

/* --- language switcher ----*/

.language-switcher{
	position: absolute;
	right: 120px;
	top: 24px;
}

.language-switcher #lang_sel{
	float:right;
}

/* --- pull images ----*/

/* sticky nav */

.nav-scrolled{
	width: 100%;
	height: 54px;
	position: fixed;
	top: 0;
	z-index: 10;
}

#all-nav-holder{

}

.all-nav-holder.with-children {
	margin-bottom: -54px;
}

.all-nav-holder.without-children{
	margin-bottom: -27px;
}


.add-padding.with-children{
	padding-top: 54px;
}

.add-padding.without-children{
	padding-top: 27px;
}

/* top nav */

#topNav{
	text-align:center;
	background-color:#000000;
	position: relative;
	z-index:10;
	overflow:hidden;
	height: 27px;
}

#topNav a,
#topNav H1,
#topNav p{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:18px;
	text-decoration: none;
	font-weight:normal;
	font-variant: small-caps;
	color:#e5e5e5;
	line-height:24px;
	display:inline;
}

#topNav .sideBar{
	text-align:right;
}

#topNav ul,
#footer ul,
#secondaryNav ul{
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	color:#686868;
}

#topNav li,
#footer li,
#secondaryNav li{
	display:inline;
	margin-right:12px;
	padding-right:12px;
	border-right:1px solid #686868;
}

#footer li{
	border-right:1px solid #e5e5e5;
}

#topNav li:last-child,
#footer li:last-child,
#secondaryNav li:last-child{
	border-right:none;
}

#topNav ul a,
#topNav ul .current_page_item,
#footer ul a,
#footer ul .current_page_item,
#secondaryNav ul a,
#secondaryNav ul .current_page_item{
	color: #e5e5e5;
	text-decoration:none;
	font-size:14px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-variant: small-caps;
}

#topNav ul a:link{

}

#topNav ul a:hover,
#secondaryNav ul a:hover{
	color:#fff799;
}

#topNav ul a:active{

}

#topNav ul a:visited{

}

#topNav ul a:focus{

}

#topNav ul .current_page_item, #secondaryNav ul .current_page_item{
	color:#fff799;
}

/* secondary nav */

#secondaryNav{
	/*background-color:#898989;*/
	position: relative;
	z-index:20;
	overflow:hidden;
	text-align:center;
	height: 27px;
}

#secondaryNav .mainContent{
	background-color:#898989;
	text-align:center;
	/*
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	When internet explorer gets it's act together
	we can use border radius for rounded edges.
	Until then we need to use image below.
	*/

	background-image: url(images/backgrounds/subnavigation.gif);
	background-position: bottom;
	background-repeat: no-repeat;
	padding-bottom:3px;

	width:490px;
	margin-right:120px;
	display:inline;
}

/* third nav  */

ul.thirdNav{
	list-style: none;
	margin:0;
	text-align:right;
	margin-bottom:12px;
}

ul.thirdNav a{
	background-color:#000000;
	color:#ffffff;
	text-decoration:none;
	padding:2px;
}

ul.thirdNav a:hover,
ul.thirdNav li.current_page_item span{
	background-color:#898989;
	color:#ffffff;
	padding:2px;
}




/* main area */

.mainArea{
	/*padding-top:24px;*/
	text-align:center;
	z-index: 2;
	position: relative;
}

.mainArea .sideBar{
	/*padding-top: 48px;*/
	padding-top:96px;
}

/* thumbnails */

.sideBarInner{
	padding-top:11px;
	width:252px;
	float:right;
	border-top:1px dotted #898989;
}

.thumbnails {
	/*width:252px;
	margin-left:58px;*/
	width: 259px;
	margin-left: 51px;
	text-align:right;
}

.thumbnails ul{
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	/*border:1px solid blue;*/
}

.thumbnails li{
	display:inline;
}

.thumbnails a{
	border:2px solid #e5e5e5;
	/*float:left;*/
	display:inline-block;
	margin-left:12px;
	margin-bottom:12px;

	/* because the container is now inline a
	4px margin is introduced due to whitespace
	margin-left: 8px;
	margin-bottom:8px;
	*/
}

.thumbnnails a img{

}

.thumbnails a:hover{
	border:2px solid #898989;
}

 .secondContent a.cboxElement{
	border:2px solid #e5e5e5;
	margin-left:-112px;
	float:left;
	position:relative;
}

.secondContent a.cboxElement:hover{
	border:2px solid #898989;
}

/* press clippings */

.press-clippings p.readFull{
	/*margin-top: 24px;	*/
	margin-top: 0;
}

.press-clippings-container .press-clippings{
	margin-bottom: 48px;
}

.pdf-button{
	display:block;
	padding: 12px;
	background-color: #000000;
	color: #ffffff;
	border-radius: 4px;
	text-decoration: none;
	margin-top: 12px;
}

.pdf-button:hover{
	background-color: #999999;
}



/* sidebar icons*/

ul.sidebarIcons{
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	text-align:right;
	/*border:1px solid blue;*/
}

ul.sidebarIcons li{
	/*display:inline;*/

}

.sidebarIcon a{
	padding-right:20px;
	background-position: right 0px;
	background-repeat: no-repeat;
	height:14px;
	font-size:12px;
	color:#898989;
	display:block;
	margin-bottom:10px;
	line-height:14px;
}





.twitter a{
	background-image:  url(images/icons/twitter-icon.gif);
	background-position: 0px right;
}

.facebook a{
	background-image: url(images/icons/facebook-icon.gif);
}



.sidebarIcon a:hover{
	text-decoration:none;
	color:#0072bc;
	background-position: 238px 0px;
}


.instagram a img {
	display: inline-block;
	width: 14px;
	height: 14px;
	vertical-align: bottom;
	margin-left: 6px;
	filter: grayscale(100%);
	opacity: 0.6;
}

.instagram a {
	padding-right: 0;
}

.instagram a:hover img {
	filter: grayscale(0);
	opacity: 1;
}



/* footer */

#footer{
	color:#898989;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-variant: small-caps;
	font-size:12px;
	text-align:center;
}

#footer .mainContent{
	border-top:1px dotted #898989;
	padding-top:23px;
	padding-bottom:24px;
	margin-top:24px;
}

/*
see also the top nav styles for footer link styles
*/

 #footer ul .current_page_item{
 	font-size:12px;
 }

#footer ul a{
	font-size:12px;
	color:#898989;
}

#footer ul a:link{

}

#footer ul a:hover{
	color:#000000;
}

#footer ul a:active{

}

#footer ul a:visited{

}

#footer ul a:focus{

}

#footer ul .current_page_item{
	color:#000000;
}

a.topOfPage{
	background-image: url(images/backgrounds/topOfPage.gif);
	background-repeat: no-repeat;
	background-position: top left;
	padding-left:18px;
}

a.downLink{
	background-image: url(images/backgrounds/downLink.gif);
	background-repeat: no-repeat;
	background-position: center left;
	padding-left:18px;
}


/* homepage --------------------- */

.homePage{
	margin-top:24px;
}

#homeImage{
	position:absolute;
	left:70px;
}

h1.homeTitle{
	position:absolute;
	left:696px;
	top:137px;
		font-size:18px;
}

p.homeTitle{
	position:absolute;
	left:696px;
	top:167px;
}



 h1.homeTitle, p.homeTitle{
	background-color:#484b5c;
	color:#E5E5E5;
	padding: 4px 12px 4px 4px;
	display:inline-block;
	font-variant:small-caps;
	font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;
	font-weight:normal;
}

#homeContent{
	position:absolute;
	top:457px;
	left:262px;
	width:350px;
	font-variant:small-caps;
	font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;
}

#homeNav{
	position:absolute;
	left:696px;
	top:225px;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
}

#homeNav li{
	margin-bottom:6px;
}

#homeNav a{
	background-color:#000000;
	color:#ffffff;
	padding: 4px 12px 4px 4px;
	text-decoration:none;
	font-variant:small-caps;
	font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;
}

#homeNav a:link{

}

#homeNav a:hover{
	background-color:#484b5c;
	padding-left:12px;
}

#homeNav a:active{

}

#homeNav  a:visited{

}

#homeNav  a:focus{

}

/* new homepage styles --------------------------------*/

.home .hero-image{
	background-image: url('images/hero-image/tomi-ungerer-03.jpg');
	background-size: cover;
	background-repeat: none;
	background-attachment: fixed;
	background-position: center;
	height: 500px;
	height: calc(100vh - 222px);
	position: relative;
	font-family: arial, sans-serif;
	/* position: relative;
	z-index: 99999;*/
}

.home .hero-image:after{
		display:block;
		position: absolute;
		font-size: 10px;
		color: #ffffff;
		bottom: 5px;
		right: 5px;
		content: "SAM NORVAL PHOTOGRAPHY / CORNER OF THE CAVE MEDIA";
}

.work-section{
	overflow: hidden;
	margin-bottom: 12px;
}

.work-section .section{
	width: 25%;
	float:left;
}

.work-section .section a.inner img{
	width: 100%;
}

.work-section .section a.inner{
	position: relative;
	display:block;
	border: 1px solid #ffffff;
}

.work-section .section a.inner span{
	display:block;
	width: 100%;
	box-sizing: border-box;
	padding: 15px;
	background-color:#ffffff;
	position: absolute;
	bottom: 0px;
	opacity: 0;

	animation-name: work-title-out;
	animation-duration: 0.5s;
	animation-timing-function: ease-in;
	animation-delay: 0;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

.work-section .section a:hover.inner span{
	animation-name: work-title-in;
	animation-duration: 0.5s;
	animation-timing-function: ease-in;
	animation-delay: 0;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

@keyframes work-title-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes work-title-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}





/* blog posts --------------------------------*/



p.commentCount{
	text-align:center;
	margin:0;
	padding: 0 10px 0 10px;
	color: #999999;
	background-color: #E5E5E5;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	top: -35px;
	left:-30px;
	position:absolute;
}

span.commentTail{
	background-image: url(images/backgrounds/commentTail.gif);
	background-position: top;
	background-repeat: no-repeat;
	width:10px;
	height:7px;
	position:absolute;
	bottom:-7px;
	right:5px;
}

.childPages{
	clear:left;
	margin-bottom:12px;
	overflow:hidden;
}

.pageThumb{
	float:left;
	margin-right: 10px;:
}

.pageThumb img{
	border:2px solid #E5E5E5;
}

.pageThumbText{
	width:375px;
	float:left;
}

.pageThumbText p{
	margin:0;
}

.pageThumbText div{
	height:98px;
	overflow:hidden;
	text-overflow:ellipsis;
	margin-bottom:12px;
	display:block;
}

.blogThumb{
	margin-left: -160px;
	float:left;
	position:relative;
	width:120px;
	height:120px;
}

.blogThumb img{
	float:right;
	border:2px solid #E5E5E5;
}

p.blogDate{
	background-color:#E5E5E5;
	color:#999999;
	margin:0;
	text-align:right;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:12px;
	padding-right:12px;
}

.post{
	margin-bottom: 72px;
}

.postmetadata{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#999999;
	font-style: italic;
}

.postmetadata a{
	color:#999999;
}

p.readFull{
	margin:0;
}

p.readFull a{
	text-decoration:none;
	padding:4px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#ffffff;
}

p.readFull a:link{
	background-color: #000000;
	color:#ffffff;
}

p.readFull a:visited{
	background-color: #999999;
}

p.readFull a:hover,
p.readFull a:focus{
	background-color:#0072BC;
}

p.readFull a:active{

}

.navigation{
	overflow:hidden;
	border:1px dotted #cccccc;
	margin-bottom:24px;
	padding:8px;
	margin-right:120px;
	color:#999999;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:12px;
}

.navigation p{
	margin:0;
}


/* Captions */
.aligncenter,
div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption {
	border: 1px solid #ddd;
	text-align: center;
	background-color: #f3f3f3;
	padding-top: 4px;
	margin: 10px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption p.wp-caption-text {
	font-size: 11px;
	line-height: 17px;
	padding: 0 4px 5px;
	margin: 0;
}
/* End captions */


/* ---- gallery ----------*/

/*
CSS Name: Default Styles
Description: NextGEN Default Gallery Stylesheet
Author: Alex Rabe
Version: 1.50

This is a template stylesheet that can be used with NextGEN Gallery. I tested the
styles with a default theme Kubrick. Modify it when your theme struggle with it,
it's only a template design

*/

/* ----------- Album Styles Extend -------------*/

.ngg-albumoverview {
	margin-top: 10px;
	width: 100%;
	clear:both;
	display:block !important;
}

.ngg-album {
    height: 100%;
    padding: 5px;
    margin-bottom: 5px;
    border: 1px solid #fff;
}



/* IE6 will ignore this , again I hate IE6 */
/* See also http://www.sitepoint.com/article/browser-specific-css-hacks */
html>body .ngg-album {
    overflow:hidden;
    padding: 5px;
    margin-bottom: 5px;
    border: 1px solid #cccccc;
}

.ngg-album {
	overflow: hidden;
	padding: 5px;
	margin-bottom: 5px;
	border: 1px solid #cccccc;
}

.ngg-albumtitle {
	text-align: left;
 	font-weight: bold;
	margin:0px;
	padding:0px;
	font-size: 1.4em;
	margin-bottom: 10px;
}

.ngg-thumbnail {
	float: left;
	margin-right: 12px;
}

.ngg-thumbnail img {
	background-color:#FFFFFF;
	border:1px solid #A9A9A9;
	margin:4px 0px 4px 5px;
	padding:4px;
	position:relative;
}

.ngg-thumbnail img:hover {
	background-color: #A9A9A9;
}

.ngg-description {
	text-align: left;
}

/* ----------- Album Styles Compact -------------*/

.ngg-album-compact {
	float:left;
	height:180px;
	padding-right:6px !important;
	margin:0px !important;
	text-align:left;
	width:120px;
}

.ngg-album-compactbox {
	background:transparent url(albumset.gif) no-repeat scroll 0%;
	height:86px;
	margin:0pt 0pt 6px !important;
	padding:12px 0pt 0pt 7px !important;
	width:120px;
}


.ngg-album-compactbox .Thumb {
	border:1px solid #000000;
	margin:0px !important;
	padding:0px !important;
	width:91px;
	height:68px;
}

.ngg-album-compact h4 {
	font-size:15px;
	font-weight:bold;
	margin-bottom:0px;
	margin-top:0px;
	width:110px;
}

.ngg-album-compact p {
	font-size:11px;
	margin-top:2px;
}

/* ----------- Gallery style -------------*/

/* large gallery */

.mainContent .ngg-galleryoverview{
	width: 490px !important;
	margin-right:120px !important;
}

.mainContent .ngg-galleryoverview a{
	border:2px solid #e5e5e5;
	/*float:left;*/
	display:inline-block;
	margin-right:8px;
	margin-bottom:8px;
}


.mainContent .ngg-galleryoverview a:hover{
	border:2px solid #898989;
}




/* start---------------- -------------- next-gen */

.ngg-galleryoverview {
	/*overflow: hidden;
	clear:both;
	display:block !important;
	margin-top: 10px;
	width: 100%;*/
}

.ngg-galleryoverview .desc {
/* required for description */
   margin:0px 10px 10px 0px;
   padding:5px;
}

.ngg-gallery-thumbnail-box {
	/*float: left;*/
	display:inline-block;
	*display: inline;
	zoom:1;
	/*width: 84px;*/
}

.ngg-gallery-thumbnail {
	/*float: right;*/
	/*display:inline;*/
	/*width: 84px;*/
}

.ngg-gallery-thumbnail img {

}

.ngg-gallery-thumbnail img:hover {

}

.ngg-gallery-thumbnail span {
	/* Images description */

}

.ngg-clear {
	clear: both;
}

/* ----------- Gallery navigation -------------*/

.ngg-navigation {
	font-size:0.9em !important;
	clear:both !important;
	display:block !important;
	padding-top:15px;
	text-align:center;

}

.ngg-navigation span {
	font-weight:bold;
	margin:0pt 6px;
}

.ngg-navigation a.page-numbers,
.ngg-navigation a.next,
.ngg-navigation a.prev,
.ngg-navigation span.page-numbers,
.ngg-navigation span.next,
.ngg-navigation span.prev {
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-navigation a.page-numbers:hover,
.ngg-navigation a.next:hover,
.ngg-navigation a.prev:hover,
.ngg-navigation span.page-numbers:hover,
.ngg-navigation span.next:hover,
.ngg-navigation span.prev:hover {
	background-color: #0066CC;
	color: #FFFFFF !important;
	text-decoration: none !important;
}

/* ----------- Image browser style -------------*/

.ngg-imagebrowser {

}

.ngg-imagebrowser h3 {
	text-align:center;
}

.ngg-imagebrowser img {
	border:1px solid #A9A9A9;
	margin-top: 10px;
	margin-bottom: 10px;
	width: 100%;
	display:block !important;
	padding:5px;
}

.ngg-imagebrowser-nav {
	padding:5px;
	margin-left:10px;
}

.ngg-imagebrowser-nav .back {
	float:left;
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-imagebrowser-nav .next {
	float:right;
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-imagebrowser-nav .counter {
	text-align:center;
	font-size:0.9em !important;
}

.exif-data {
  	margin-left: auto !important;
    margin-right: auto !important;
}

/* ----------- Slideshow -------------*/
.slideshow {
	margin-left: auto;
	margin-right: auto;
	text-align:center;
	outline: none;
}

.slideshowlink {

}

/* ----------- Single picture -------------*/
.ngg-singlepic {
	background-color:#FFFFFF;
	display:block;
	padding:4px;
}

.ngg-left {
	float: left;
	margin-right:10px;
}

.ngg-right {
	float: right;
	margin-left:10px;
}

.ngg-center {
  	margin-left: auto !important;
    margin-right: auto !important;
}

/* ----------- Sidebar widget -------------*/
.ngg-widget,
.ngg-widget-slideshow {
	overflow: hidden;
	margin:0pt;
	padding:5px 0px 0px 0pt;
	text-align:left;
}

.ngg-widget img {
	border:2px solid #A9A9A9;
	margin:0pt 2px 2px 0px;
	padding:1px;
}

/* ----------- Related images -------------*/
.ngg-related-gallery {
	background:#F9F9F9;
	border:1px solid #E0E0E0;
	overflow:hidden;
	margin-bottom:1em;
	margin-top:1em;
	padding:5px;
}
.ngg-related-gallery img {
	border: 1px solid #DDDDDD;
	float: left;
	margin: 0pt 3px;
	padding: 2px;
	height: 50px;
	width:  50px;
}

.ngg-related-gallery img:hover {
	border: 1px solid #000000;
}

/* ----------- Gallery list -------------*/

.ngg-galleryoverview ul li:before {
	content: '' !important;
}

.ngg-gallery-list {
	list-style-type:none;
	padding: 0px !important;
	text-indent:0px !important;
}

.ngg-galleryoverview div.pic img{
	width: 100%;
}

.ngg-gallery-list li {
	float:left;
	margin:0 2px 0px 2px !important;
	overflow:hidden;
}

.ngg-gallery-list li a {
	border:1px solid #CCCCCC;
	display:block;
	padding:2px;
}

.ngg-gallery-list li.selected a{
	-moz-background-clip:border;
	-moz-background-inline-policy:continuous;
	-moz-background-origin:padding;
	background:#000000 none repeat scroll 0 0;
}

.ngg-gallery-list li img {
	height:40px;
	width:40px;
}

li.ngg-next, li.ngg-prev {
	height:40px;
	width:40px;
	font-size:3.5em;
}

li.ngg-next a, li.ngg-prev a  {
	padding-top: 10px;
	border: none;
	text-decoration: none;
}


/* ngg customisations */

.ngg-gallery-thumbnail img{
	border: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.ngg-gallery-thumbnail-box {
	margin: 0 !important;
	float: none !important;
	display:inline-block !important;
}

/* search form modal */



.modal{
	display:none;
	background-color:#fff;
	width:350px;
	padding:15px;
	text-align:left;
	border:2px solid #000000;
	/*opacity:0.8;*/
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-moz-box-shadow: 0 0 50px #ccc;
	-webkit-box-shadow: 0 0 50px #ccc;
}

.modal h2 {
	background:url(/img/global/info.png) 0 50% no-repeat;
	margin:0px;
	padding:10px 0 10px 45px;
	border-bottom:1px solid #333;
	font-size:20px;
}

.modal .close{
	background-image:url(images/close-button.png);
    position:absolute;
    right:-5px;
    top:-8px;
    cursor:pointer;
    height:27px;
    width:26px;
}

/* ---- gallery plus */

/* Begin Gallery Plus CSS */
.gallery {
	margin: auto;
}
.gallery-item {
	float: left;
	margin-top: 10px;
	text-align: center;
/*	width: {$itemwidth}%; */
}
.gallery img {
	border: 2px solid #cfcfcf;
}
.gallery-caption {
	margin-left: 0;
	}
/* End Gallery Plus CSS */


/*------------------ comments-------------*/

ol.commentlist{
	list-style: none;
}

.commentlist img.avatar{
	float:left;
	margin-left:-76px;
	margin-top:28px;
}

.commentmetadata a{
	font-size:12px;
	color:#999999;
}

cite.fn,
cite.fn a{
	color: #000000;
	text-decoration:none;
	font-family:Georgia,serif;
	font-variant:small-caps;
	font-size:16px;
	font-weight:bold;
}

cite.fn a:link{
		border-bottom:1px dotted #CCCCCC;
}

cite.fn a:visited{
		border-bottom:1px dotted #CCCCCC;
}

cite.fn a:hover,
cite.fn a:focus{
		border-bottom:1px dotted #CCCCCC;
		color: #0072bc;
}

#mobile-menu-open {
	display: none !important;
}

@media only screen and (min-width: 761px) {
	#mobile-menu-open + ul {
		display: inline !important;
	}
}

@media only screen and (max-width: 760px) {
  .home .hero-image {
    background-attachment: scroll;
  }

	#mobile-menu-open {
		display: inline-block !important;
	}

	#mobile-menu-open + ul {
		display: none;
		position: absolute;
		width: 100%;
		left: 0;
		z-index: 9999;
		background: #000;
		text-align: center;
	}

	#mobile-menu-open + ul li {
		display: block;
		padding: 0;
		margin: 0;
		border: none;
		border-top: 1px solid #464646;
	}

	#mobile-menu-open + ul li span,
	#mobile-menu-open + ul li a {
		display: block;
		padding: 10px;
	}

	#topNav #mobile-menu-open {
		display: inline-block;
		padding: 5px 15px;
		border: 2px solid #e5e5e5;
		background: #464646;
		margin: 10px 0;
	}

	#topNav #mobile-menu-open:hover {
		filter: brightness(120%);
	}

	#topNav {
		height: auto;
		overflow: visible;
	}

	#topNav .sideBar {
		float: none;
		display: inline-block;
		padding-left: 15px;
		width: 73%;
		text-align: left;
	}

	#topNav .mainContent {
		display: inline-block;
		padding: 0;
		text-align: right;
		width: 21%;
	}

	.widthHolder {
		width: 100%;
		box-sizing: border-box;
	}

	.mainContent {
		float: none;
		width: auto;
		padding: 0 40px;
	}

	.mainContent p {
		margin-right: 0;
	}

	.mainArea .sideBar {
		float: none;
		width: 100%;
		padding: 15px 30px;
		box-sizing: border-box;
	}

	.sideBarInner {
		width: auto;
		float: none;
	}

	#pageTop .widthHolder #sig {
		width: 280px;
		height: 155px;
		background-size: cover;
	}

	.language-switcher {
		position: static;
	}

	#pageTop #icons {
		right: 10px;
	}

	#secondaryNav {
		height: auto;
		position: static;
	}

	#secondaryNav .mainContent {
		display: block;
		width: auto;
		margin: 0 auto;
		background-image: none;
		background: #898989;
	}

	#secondaryNav .mainContent ul li a {
		display: inline-block;
		padding: 10px 0;
	}

	.blogThumb {
		float: none;
		margin: 0 0 10px;
	}

	.language-switcher ul li a {
		max-width: 120px;
		text-align: left;
		float: right;
		margin: 10px 10px 0 0;
	}

	textarea#comment {
		max-width: 100%;
	}

	a.cboxElement img {
		width: 100%;
	}

	.mainContent .ngg-galleryoverview {
		width: 100% !important;
		margin-right: 0 !important;
	}

	.mainContent h2, .secondContent h2 {
		margin-right: 0;
		font-size: 30px;
		line-height: 1.5em;
	}

}