html,body{width:100%;height:100%;margin:0; border:0;padding:0;text-align:left; background-color:#ffffff;color:#999;position:absolute; top:0; bottom:0; right:0; left:0;}
a {border:0;outline:0;}
div,p,h1,h2, span, a {  font-family: "Ibarra Real Nova", "Times", serif;font-size:16px;line-height:1.2;}
font {  font-family: "Lato", "Tahoma", "Geneva", "Verdana", sans-serif;}
a { font-style: none; font-weight: normal;text-decoration: none;}

a,div,font,p,span,body{font-family:'Ibarra Real Nova',Serif}
#whole{position:relative;top:0;left:0;right:0;bottom:0;padding:0;margin:0;width:100%;min-width:300px;height:100% !important;min-height:140px;}
#inner{margin:0px auto;padding:0px;position:relative;height:100%;min-height:200px;min-width:300px;border:0px solid red;}
#inner.homeInner{max-width:1350px;}
#header a:link .colour2, #header a:visited .colour2{color:#000}
#header a:hover .colour2, #header a:active .colour2{color:#999}

a:link { color: #000;}
a:active {color: #999;}
a:visited {color: #000;}
a:hover {color: #999;}

#content{background:#ffffff;height:100%;width:100%;position:relative;top:0px;bottom:0px;border:0px solid aqua;min-height:140px;}

#content.contentHome{height:85%;}
#header{height:110px;width:100%;position:relative;top:0px;margin:0px auto;border:0px solid red;min-height:40px;}
#header.homeHeader{height:8%;}
#footer{height:100px;width:100%;position:relative;top:0;margin:0px auto;border:0px solid green;padding-right:15px;text-align:right;font-size:22px;}
#footer.footerHome{height:25px;top:15px;}

#counter{position:absolute;left:0;width:100%;top:5px;text-align:center;border:0px solid aqua}
/*was 15px left*/

#picNo, #totalPics{color:#000;display:inline-block;}
#pipe{font-size:21px;color:#000;}
#logoholder{width:150px;height:14px;position:absolute;top:52%; left:15px;border:0px solid yellow;line-height:0;}
#logoholder.logoHome{top:51%;}
#logoinner{position:relative;top:8px;height:1px;}
#logoholder.logoHome #logoinner{top:0px;}
#logoholder a {font-size:32px;color:#333;line-height:0;margin-top:5px;}
#menuholder{width:auto;height:0px;position:absolute;top:65%; right:15px;border:0px solid blue;text-align:left;overflow:hide;font-size:24px;line-height:0px;}

#menuholder a, .menuactiveLink{
font-size:24px;
line-height:0px;
}
#hamburger {
cursor: pointer;
background-image: url('/site2016/chrome/images/hamburger4.png');
background-size: 100%;
background-repeat: no-repeat;
width:22px;
height:14px;
position:absolute;
top:52%;
right:15px;
border:0px solid red;
}

#innercontent{width:100%;height:100%;text-align:center;position:relative;top:0px;bottom:0px;height:auto;min-height:140px;}
#innercontent.homepage{background:#454545; border:0px solid red;}
#centre{width:100%;height:100%;position:relative;max-width:1250px;min-height:140px;max-height:765px;margin:0px auto;border:0px solid #cc6600;}
#homeHolder{
position:absolute;
border:0px solid red;
height:100px;
top: 50%;
-webkit-transform:translateY(-50%);
-ms-transform:translateY(-50%);
transform: translateY(-50%);
width:100%;
text-align:center;
}
#homeInner{
position:relative;
height:100px;
width:600px;
margin:0px auto;
border:0px solid green;
text-align:left;
}
#gallerytitleHolder{width:600px;height:100px;position:absolute;top:-10px;right:0px;color:#fefefe;font-family:'Anton','Arial',Sans-serif;font-style: normal;
text-transform: none;font-size:120px;text-align:right;padding:0;margin:0px;}

#contactHolder{
position:absolute;width:1px;height:1px;
left:5%;

border:0px solid red;
}
#contactBg{
position:relative;
max-height:100%;
width:auto;
border:0px solid aqua;
}
#contactBg img{width:auto;height:auto;min-height:140px;}
#contactClients{
font-size:14px;
line-height:16px;
position:absolute;
width:55%;
height:auto;
left:8%;
top:15%;
text-align:left;
}
#contactDetails{
font-size:20px;
line-height:2;
width:100%;
height:auto;
text-align: center;
color:#000;
position: absolute;
top: 48%;
transform: translateY(-50%);
}
#contactDetails a{
font-size:22px;
}








a.menuLinkactive, .menuactive{ color: #666;margin-left:20px;}
.subitem{margin-left:50px;}
.menuactiveSub{ color: #666;}

#menuholder .menuactive#text_contact{
margin-left:12px;
}


#imageStrip{width:100%;height:100%;overflow:hidden;position:relative;background:white;min-height:140px;}

#imageOuter{
border:0px solid red;
top:0%;
left:0px;
right:0px;
bottom:0%;
position:absolute;
min-width:200px;
min-height:128px;
}
#thumbHolder{
border:0px solid red;
top:35px;
left:345px;
right:10px;
position:absolute;
height:auto;
min-width:300px;
min-height:500px;

}

#imageInner{
position:relative;
width:100%;
min-width:100%;
height:100%;
border: 0px solid red;
}

#imageHolder{
text-align:center;
height: 100%;
max-height: 100% !important;
border: 0px solid #fff;

margin-left:0px;
margin-right:0px;
margin-top:0px;
margin-bottom:0px;
width:100%;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
}

#imageHolder img,#imageHolder #movieBox{
position: absolute;
top: 50%;
left:50%;
top: 0px\9;/*ie8 and below*/
left: 0px\9;/*ie8 and below*/
-webkit-transform: translate(-50% ,-50%);
-ms-transform: translate(-50% ,-50%);
transform: translate(-50% ,-50%);
height:auto;
max-height:100% !important;
width:auto;
max-width:100% !important;
}
#imageHolder #movieBox{
width:100%;
height:auto;
}
#imageInner ul{list-style: none;height:100%;width:auto;}
#imageInner ul li{display:inline;height:100%;width:auto;margin-left:50px;margin-right:50px;}
#imageInner ul li img{height:100%;width:auto;}

#captions{
text-align:right;
font-size:12px;
line-height:14px;
color:#666;
width:400px;
height:auto;
border:0px solid red;
position:absolute;
right:20px;
/*top:10px;*/
}
#captions .imtitle{
text-align:right;
color:#333;
font-size:13px;
}


#holder3{position:relative;height:auto;width:auto;}

#textHolder{
height:100%;
margin:0px auto;
position:relative;
text-align: center;
width:auto;
min-height:200px;

}
#textLeft{float:left;width:48%;height:auto;border:0px solid red;}
#textRight{float:right;width:48%;height:auto;border:0px solid aqua;}
#textLeft img, #textRight img{width:auto;max-width:100%;}

/*nav is be controlled by imageStrip position*/

#imNavPrev{
z-index:1000;
position:absolute;
top:0;
left:9%;
width: 40%;
border:0px solid aqua;
height:100%;
text-align: left;
display: block;
//background-image: url('/site2016/chrome/images/leftarrow2.png');
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 35% 50%;
cursor: none !important;
-o-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-khtml-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
transition: all 0.2s linear;
opacity: 0;
filter: alpha(opacity=0);
}
#imNavPrev:hover{
opacity: 1;
filter: alpha(opacity=100);
cursor: none !important;
}

#imNavNext{
z-index:1000;
position:absolute;
width:40%;
top:0;
right:9%;
border:0px solid aqua;
height:100%;
text-align: right;
display:block;
//background-image: url('/site2016/chrome/images/rightarrow2.png');
background-repeat: no-repeat;
background-attachment: scroll;
background-position:65% 50%;
cursor: none !important;
-o-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-khtml-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
transition: all 0.2s linear;
opacity: 0;
filter: alpha(opacity=0);
}
#imNavNext:hover{
opacity: 1;
filter: alpha(opacity=100);
cursor: none !important;
}





#rightArrowBox{position:absolute;float:left;width:40px;height:40px;border:0px solid red;display:none;cursor: none;}
#leftArrowBox{position:absolute;float:left;width:40px;height:40px;border:0px solid red;display:none;cursor: none;}
#rightArrowBox img, #leftArrowBox img {width:100%;height:100%;cursor: none;}
#rightArrowBox a,#leftArrowBox a{cursor:none;}









/*for thumbs*/
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}





#menuBtn{
display:none;
}

@media screen and (max-width: 570px) {
.footerlink__item, .footerlink__item a{
font-size:16px;
}
.footerlink__item-1{
font-size:16px;
}
.footerlink__item--4 a{
font-size:14px;
}
}

/* iPad size screens should be laid out differently */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  {


	#thumbHolder{top:115px;
	left:43px;
	}

	#imNavPrev,#imNavThumbs,#imNavNext{
	opacity: 0.8;
	filter: alpha(opacity=80);
	top:auto;
	bottom:-35px;
	cursor:none;
	}
	#imNavPrev,#imNavNext{
	background-size:25px;
	height:30px;
	cursor:none;
	}
	#imNavThumbs{
	background-size:40px;
	height:40px;
	bottom:-45px;
	}
	#imNavPrev2,#imNavThumbs2,#imNavNext2{
	left:-1000px;
	}
  #captions{width:40px;bottom:40px;}
  #social{top:43px;right:15px;bottom:auto;left:auto;}
  #menuBtn{
  	cursor: pointer;
  	width:40px;
  	height:40px;
  	position: absolute;
  	top:-5px;
  	left:700px;
  	display:block;
  	border:1px solid #e1e1e1;
  	background-image: url('/site2015/chrome/images/menubtn.png');
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: 50% 50%;
  }
  #menuBtn.menushowing{
  background-image: url('/site2015/chrome/images/menubtnclose.png');
  }
}

#copyrightmob{width:auto;text-align:right;position:absolute; top:5px;right:15px;display:none;color:#000;border:0px solid aqua;}



@media screen and (min-width: 570px) {
#menuholder{display:block;}
#hamburger {display:none;}
}
@media screen and (min-width: 675px) {
#copyright{display:block;}
}

@media screen and (max-width: 570px) {
#menuholder{display:none !important;}
#hamburger {display:block;}
#menuMob{display:block;}
#logoholder a {font-size:22px;}
#menuholder a, .menuactiveLink {font-size:20px;}
#logoinner{top:0;}
}
@media screen and (max-width: 675px) {
#copyrightmob{display:block;}
#captions {display:none;}
#copyright{display:none;}
}



@media only screen and (min-device-width: 300px) and (max-device-width: 675px) and (orientation:portrait) {
	/* For portrait layouts only */
	#logoholder a {font-size:24px;}
	#header{height:60px;}
	#footer{height:50px;}
	
}	

@media only screen and (min-device-width: 300px) and (max-device-width: 570px) and (orientation:landscape) {
#header{height:60px;}
 #footer{height:50px;}
 #logoinner, #logoholder.logoHome #logoinner{top:0px; !important; }
#logoholder.logoHome{top:50%;}
#copyrightmob{margin-top:0px;}
#counter{top:0px;}
#contactDetails, #contactDetails a{font-size: 18px;}
}

@media only screen and (min-device-width: 481px) and (max-device-width: 750px) and (orientation:landscape) {
  /* For landscape layouts only */
 #footer{height:45px;}
 #header{height:45px;}
  #logoinner, #logoholder.logoHome #logoinner{top:0px !important;}
#logoholder.logoHome{top:50%;}
#copyrightmob{margin-top:0px;}
#contactDetails, #contactDetails a{font-size: 18px;}
}