/*	Title			Duncan Astbury Style Sheet,
	Author			Duncan Astbury,
	Copyright		Duncan Astbury, 2023
	Updated			Nov 2019
					extend border spacing on nav menu items
					increase size of text in legalsmall paras
					reduce screen margins on smaller devices
					
	Last updated	Aug 2020
					extend border spacing on nav menu items
					increase size of text in legalsmall, copyfoot and p paras
					
	Last updated	Jan 2023
					add custom footer code
*/

body	{
		color: black;
		background-color: #FEFEFE;
		margin-left: 10%;
		margin-right: 10%;
		}

footer	{
		color: black; 
		background-color: #FEFEFE;; 
		border-color: #222222 #222222 #222222 #222222; /* top right botton left */
		border-style: outset;
		border-width: 1px;
		border-radius: 8px;
		padding: 10px;
		}

/* non-specific anchors */
a:link		{
			color: black;
			}

a:visited	{
			color: black;
			}

a:link:hover, a:visited:hover
			{
			color: black;
			font-weight: bold;
			}

a:link:active, a:visited:active
			{
			color: black;
			font-weight: bold;
			background-color: #FEFEFE;
			}
		
		
/* logo image */
header img	{
			border: 0px solid black;
			padding: 2px;
			background-color: #46C8F5;
			float: left;
			}

p.strapline  {
			padding-left: 65px;
			font-style: italic;
			text-align: left;
			}

p.hometext 	{
			text-align: left;
			}
			
img.homesplash	{
			display: block;
			width: 65%;
			min-width:300px;
			max-width: 1000px;
			margin: auto;
			border-color: #46C8F5;
			border-style: inset;
			border-width: 2px;
			}

img.pano	{
			display: block;
			width: 70%;
			min-width:300px;
			max-width: 2000px;
			margin: auto;
			border-color: #666666;
			border-style: inset;
			border-width: 2px;
			}
		
h1		{ clear: both;
		  text-align: center;
		  font-family: Futura, Tahoma, Geneva, sans-serif;
		  font-size:18pt;
		  font-weight: bold;
		  color: #333333;
		  text-shadow: 1px 1px #46C8F5;
		  }
			
h2		{ clear: both;
		  text-align: left;
		  font-family: Futura, Tahoma, Geneva, sans-serif;
		  font-size:14pt;
		  font-variant: small-caps;
		  color: #666666;}
		  
h3           	{ clear: both;
		  font-family: Futura, Tahoma, Geneva, sans-serif;
		  font-size:12pt;
		  font-variant: small-caps;
		  color: #666666;}
		  
h4           	{ clear: both;
		  font-family: Futura, Tahoma, Geneva, sans-serif;
		  font-size:10pt;
		  font-variant: small-caps;
		  color: #666666;}
		  
h5           	{ font-family: Futura, Tahoma, Geneva, sans-serif; }
h6           	{ font-family: Futura, Tahoma, Geneva, sans-serif; }

img.portfolio-pick-thumb	{
		margin-right: 10px;
		margin-top: 10px;
		width: 50%;
		min-width:75px;
		max-width: 200px;
		border-color: #46C8F5;
		border-style: inset;
		border-width: 3px;}		
		
img.portfolio-thumb	{
		margin-right: 20px;
		margin-top: 20px;
		border-color: #46C8F5;
		border-style: inset;
		border-width: 3px;}		


/*	Responsive site navigation
*/
h5		{
		clear: both;
		display: none;
		}
			
* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

nav {
    padding: 0;
	
    width: 85%;
    margin-top: 30px; 
	margin-left: auto; 
	margin-right: auto; 
	margin-bottom: 30px; 
}
 
nav ul {
    list-style: none;
    overflow: hidden;
}

nav li a {
    background: #777;
    border-right: 9px solid #fff;
    color: #fff;
    display: block;
    float: left;
    font: 400 13px/1.4 'Cutive', Helvetica, Verdana, Arial, sans-serif;
    padding: 8px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: 14%;
	
	     
    /*TRANSISTIONS*/
    -webkit-transition: background 0.8s ease;
       -moz-transition: background 0.8s ease;
         -o-transition: background 0.8s ease;
        -ms-transition: background 0.8s ease;
            transition: background 0.8s ease;
}

/*current*/
nav li a#current {
    background: #FBFBFB;
	color: black;
	font-weight: bold;
}

/*SMALL*/
nav small {
    color: #fff;   
    font: 100 11px/1 Helvetica, Verdana, Arial, sans-serif;
    text-transform: none;
}

nav small#current-small{
    color: black;   
 }

/*current*/
nav li a#top-current {
    background: #bbb;
	color: black;
}

/*current*/
nav li a#top-current {
    background: #bbb;
	color: black;
}

/*current*/
nav li a#sub-current {
    background: #ccc;
	color: black;
}


/*HOVER*/
nav li a:hover {
    background: #EEEEEE;
	color: black;
}


/*VISITED*/
nav li a:visited {
       color: #fff;
}


nav li:last-child a {
    border: none;
}

/* MEDIA QUERIES*/
@media only screen and (max-width : 1220px),
only screen and (max-device-width : 1220px){
    nav li a {
        font: 400 10px/1.4 'Cutive', Helvetica, Verdana, Arial, sans-serif;
    }
     
    nav small {
        font: 100 10px/1 Helvetica, Verdana, Arial, sans-serif;
    }
}

@media only screen and (max-width : 930px),
only screen and (max-device-width : 930px){
    nav li a {
        width: 25%;
        border-bottom: 1px solid #fff;
        font: 400 11px/1.4 'Cutive', Helvetica, Verdana, Arial, sans-serif;
    }
     
    nav li:last-child a, nav li:nth-child(4) a {
        border-right: none;
    }
     
    nav li:nth-child(5) a, nav li:nth-child(6) a, nav li:nth-child(7) a, nav li:nth-child(8) a {
        border-bottom: none;
    }
}

@media only screen and (max-width : 580px),
only screen and (max-device-width : 580px){
	
	body	{
		margin-left: 1%;
		margin-right: 1%;
		}

    nav li a {
        width: 50%;
        font: 400 12px/1.4 'Cutive', Helvetica, Verdana, Arial, sans-serif;
        padding-top: 12px;
        padding-bottom: 12px;
    }
     
    nav li:nth-child(even) a {
        border-right: none;
    }
     
    nav li:nth-child(5) a, nav li:nth-child(6) a {
        border-bottom: 1px solid #fff;
    }
}
 
@media only screen and (max-width : 320px),
only screen and (max-device-width : 320px){
	
	body	{
		margin-left: 1%;
		margin-right: 1%;
		}

    nav li a {
        font: 400 11px/1.4 'Cutive', Helvetica, Verdana, Arial, sans-serif;
    }
}

			


a  span		{ display: none; }			


a.tooltip:hover	 {
			background-color: #FEFEFE;
			}
			
a.tooltip	 {
			position:relative;
			}

a:hover span.tooltip{
			display: block;
			position:absolute;
			top: 5px;
			left: 30px;
			padding: 5px 5px 5px 5px;
			width: 200px;
			border: 1px solid blue;
			color: blue;
			background-color: white;
			text-align: center;
			opacity: 0.70;

			-webkit-opacity: 0.70;
			-moz-opacity: 0.70;
			-khtml-opacity: 0.70;
			-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

img.tooltip	{
			cursor: help;
			}

			
input.itext	{ font-family: "Tahoma", sans-serif; font-size: 18px; background-color: #FFFFCC}

input:focus	{
			color:black;
			background-color: #46C8F5
			}

textarea		{ font-family: "Tahoma", sans-serif; font-size: 18px; background-color: #FFFFCC}

textarea:focus{
			color:black;
			background-color: #46C8F5
			}
			
input.isubmit	{
			font-family: "Tahoma", sans-serif;
			font-size: 18px;
			background-color: #fed}

address,
blockquote, 
noframes	{ display: block }

strong          { font-weight: bolder }

blockquote      { margin-left: 40px; margin-right: 40px }

i, cite, em,
var, address    { font-style: italic }


			
p.thumbview  {clear: both;
			color: white}	
			
p.textlinks  {clear: both;
			font-family: "Tahoma", Sans-Serif;
			text-align: center;
			font-size: 16px}	
			
p.subpara 	{clear: both;
			text-align: left;
			margin-left: 15px;
			margin-right: 10%}	
			
			
p.quote 	{clear: both;
			padding-top: 15px;
			padding-bottom: 15px;
			padding-left: 30px;
			padding-right: 30px;
			text-align: left;
			margin-left: 45px;
			margin-right: 30%;
			background-color: #EEEEEE;
			border-radius: 20px;
			font-style: italic;
}	
			
p.quoteauth 	{clear: both;
			text-align: right;
			margin-right: 30%;
}	
			
			
p.copyfoot 	{clear: both;
			text-align: center;
			font-family: "Tahoma", Sans-Serif;
			font-size: 16px}	
			
			
p.legalsmall 	{clear: both;
			text-align: center;
			font-family: "Tahoma", sans-serif;
			font-size: 15px}	
			
p			 {clear: both;
			text-align: left;
			font-family: "Tahoma", sans-serif;
			font-size: 16px}

			
/* A C C O R D I O N */
/* Style the buttons that are used to open and close the accordion panel */
button.accordion {
	margin-left: 30px;
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 80%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
button.accordion.active, button.accordion:hover {
    background-color: #ddd;
}

/* Style the accordion panel. Note: hidden by default */
div.panel {
 	margin-left: 30px;
    padding: 0 18px;
    width: 80%;
    background-color: white;
    max-height: 0;
    overflow: hidden;
	transition: 0.9s ease-in-out;
    opacity: 0;
}

/* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */
div.panel.show {
	opacity: 1;
	max-height: 750px;  
}

button.accordion:after {
    content: '\02795'; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
}

button.accordion.active:after {
    content: "\2796"; /* Unicode character for "minus" sign (-) */
}

li.sale {
	list-style-image: url('images/bullet_black.png');
}

li.sold {
	background: #ffe5e5;
	list-style-image: url('images/bullet_red.png');
}