/* Default CSS */
/* Generated by the CoffeeCup HTML Editor - www.coffeecup.com */
/*
*/
.slideshow-container img{width:100%; }
.w3-opacity{clear:left;}
h4{padding-left:5px }
img{padding:10px }
article{padding:15px;font-style:italic; padding-left:5px; text-align:left;}
article p {font-size:105%;}
article cite {font-size:85%;}
header.h5{font-variant:small-caps; font-style:oblique;padding-top:5px;padding-left:25px;font-size:70%}
blockquote{font-style:italic; padding-left:5px; text-align:left;}
blockquote p {font-size:105%;}
blockquote cite {font-size:85%;}
.centre{position:relative; float:left;text-align:center; }}
.w3-row  h3 h4{text-align:center; }
.w3-row a{font-size:80%	 }
.w3-col  h3 h4 p{text-align:center; }
.w3-top {font-size:90%; }
.w3-bar {font-size:90%; }
.footerCC {font-size:80%; }
.contact {font-size:80%; }
h6 {text-align:center; font-size:85%; font-style:italic;}
p {font-size:100%;text-align:left;text-justify:auto;}
.centrePage { text-align:center;}
.slideShowNav{font-size:150%; background-color:black }
.slideShowContent{padding-left:3%;padding-right:3%}
.slideShowContent img{width:70%;position:relative;}
.bottomBorder
.content{text-align:left; }
.fullwidth{width:100%; border-bottom-style:solid;}
.topBorder{border-top-style:solid;}
.topmenu{ font-size:75%;}
.floatleft{position:relative;float:left;padding:5px;font-size:95%;text-align:left;}
.slideright{position:relative;float:right;padding:5px;font-size:95%;text-align:right;}
.floatleft h3 h4{text-align:center; }
.halffloatleft{position:relative;float:left;width:50%;padding:5px;font-size:95%;}
.articlerow{position:relative;float:left;width:100%;padding:5px;font-size:100%;}
.aligncentre h4{text-align:center;}
.alignleft{text-align:left;}
.w3-main{padding-left:5px;}
.w3-full{width:100%;position:relative;float:left;padding:0px;font-size:100%;margin-right:2%;text-align: center;}
.w3-half{width:50%;position:relative;float:left;font-size:100%;text-align: center;}
.w3-half img{width:100%;}
.w3-third{width:33%;position:relative;float:left;padding:2%;text-align: center;}
.w3-third img{width:100%;}
.w3-third li{font-size:110%; }
.w3-third h3 h4 h5{text-align:center; }
.w3-2third{width:66%;position:relative;float:left;padding:2%;text-align: center;}
.w3-fifth{width:19%;position:relative;float:left;padding:1px;font-size:100%;text-align: left;}
.w3-quarter{width:24%;position:relative;float:left;padding:1px;font-size:100%;text-align: centre;}
.w3-half{ width:45%;position:relative;float:left; padding:5px;font-size:80%;margin-right:2%;text-align: center;}
.w3-container h2 {font-size:200%; }
.width2third{ width:65%; position:relative;float:left; font-size:100%;}
.width2third p {font-size:100%; } 
.widthquarter { width:25%; position:relative; float:left; padding:2%; text-align:center;}
.widthquartertext { width:23%; position:relative; float:left; padding:1%; text-align:left;}
.width3quartertext { width:68%; position:relative; float:left; padding:1%; text-align:left;}
.widthquarter figcaption{text-align:center; }
.travelbutton { background-color: white;border: none;color: white;padding: 20px 34px;text-align: center;text-decoration: none;display: inline-block;font-size: 80%; margin: 4px 2px;cursor: pointer;}
.topMenuMargin{margin-right:20px;}
.local{float:right; }
footer{font-size:50%; }
body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif;}
body, html {height: 100%;color: #777;line-height: 1.8;}
contactme p{font-size:40% }
/* Create a Parallax Effect */
.bgimg-1, .bgimg-2, .bgimg-3 {background-attachment: fixed;background-position: center;background-repeat: no-repeat;background-size: cover;margin-left:1%;margin-right:1%;margin-bottom:25px}
.shadowGray{border: 1px solid;padding:10px;box-shadow: 2px 5px #888888;margin-right:2px;}
.shadowGray img{width:100%; }
/*
Shawdows to elements with CSS3.

Instructions: Double click to paste this code in your .css file and apply this div <div class="name"> </div> to your text (name=darkshadow|lightshadow|innershadow, etc.). 
Values for box-shawdow are: horizontal offset, vertical offset, blur radius and shawdow color.
Also, include the call to the .css file between the <head itemscope itemtype="https://schema.org/WebPage"> and </head> tags. Example: <link rel="stylesheet" type="text/css" href="css/myelements.css"> 
-->*/
.darkshadow{background-color: #ddd;width: 300px;padding: 10px;box-shadow: 10px 10px 15px #000;}
.lightshadow{background-color: #999;width: 200px;padding: 10px;color: #fff;box-shadow: 4px 4px 2px #ffc;} 
.shadowNo{border: 1px solid; padding: 10px;margin-right:2px;}
/* First image (Logo. Full height) */
.w3-wide {letter-spacing: 10px;}
.w3-hover-opacity {cursor: pointer;}
.shotdata{position:relative;float:left;margin-left:2%;width:90%;}
.shotdatarow{position:relative;float:left;width:100%;text-align:left;}
.title{ position:relative;float:left;padding-left:15px;padding-right:15px;width:40%;  font-size:90%;font-weight:bold;text-align:right;}
.comment{font-family:cursive;padding-left:15px;padding-right:15px;text-align:left;}
.data{padding-left:15px;padding-right:15px;font-style:italic;}
.submenu{ text-align:left;font-size:100%;}
.portfolimenublock{text-align:left; }
/* Turn off parallax scrolling for tablets and phones 
@media only screen and (max-device-width: 1600px) {*/
@media only screen and (max-width: 1600px) {.bgimg-1, .bgimg-2, .bgimg-3 {background-attachment: scroll;min-height: 400px;}}
p {font-size:100%; }