/* John Hamilton */
/* www.webnetism.com 2011*/
/* latest update: January, 2015 */

/* SITE WIDE COLOURS
	text colours
		white	:	#fff
		dk grey	:	#333
		red		:	#903
	
	background colours:
		white	:	#fffffe
		body bg	:	#F2EDDE
		page bg	:	#FEFCF5
		green	:	#66CC65
		redish	:	#CC3332
		
*/

html {
	margin:0;
	padding:0;
	height:100%;
}
body {
	margin:0;
	padding:0;
	height:100%;
	background:#fff;
	color:#444;
    font-family: 'Muli', sans-serif;
	font-size:0.9em;
}

h1, h2, h3, h4,
.title_bar,
.horizontal_nav { font-family: 'Lato', sans-serif; }

/* General */
img {
	border:none;
}
.left {
	float:left;
	width:auto;
}
.right {
	float:right;
	width:auto;
}
.clear {
	clear:both;
}
a {
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}

ul {
    list-style: none;
    padding:0;
    margin:0; }

li:before {
    content: "\2022   ";
    color: #91AA9A;
}

.no-bulletpoints li:before { content:""; }

/* Layout Styles */
.container {
	width:100%;
	/*background:#FEFCF5 url(../images/footer_bg.jpg) repeat-x bottom; */
    background-color:#fff;
	padding:0 0 30px 0;
	overflow:visible;
}
/* header */
.masthead {
	min-width:960px;
	margin:0 auto;
	/*background:url(../images/header_bg.jpg) no-repeat;*/
	position:relative;
}
.title_bar {
	width:960px;
    margin:0 auto;
	line-height:50px;
	font-size:30px;
    padding-top:25px;
}
.title_bar a {
	color:#91AA9A;
	font-size:30px;
}
.title_bar a:hover {
	text-decoration: none;
    color: #666;
}
.horizontal_nav {
	position:relative;
	margin:25px 0 40px 0;
    z-index:20;
    text-align:center;
    background-color:#91AA9A;
}
.horizontal_nav ul {
	margin:0;
    padding:0;
	list-style:none;
    display:block;
}
.horizontal_nav li {
    display:inline-block;
}
.horizontal_nav li:before  {
    content:"";
}
.horizontal_nav li a {
	display:block;
	padding:8px 12px;
	color:#444;
	border-right:1px solid #839E8C;
}
.horizontal_nav li:last-child a{
	border-right:none;
}
.horizontal_nav li a:hover {
	text-decoration:none;
	color:#333;
}
.sublist ul {
	margin:0;
	padding:0 0 10px 10px;
}
.sublist li {
	margin:0;
	padding:0 0 6px 0;
    font-style: normal!important;
}

.padding-top.sublist li {
    padding-top:10px;
}

/*drop down*/
.horizontal_nav ul li:hover ul { display:block; }
.horizontal_nav ul.dropdown {
    text-align:left;
    display: none;
    position: absolute;
    width: 200px;
    padding: 0;
    border-radius: 0 0 4px 4px;
    margin-left:-5px;
}
    .horizontal_nav ul.dropdown li {
    display:block;
    width:100%;
    border:1px solid #ddd;
    border-top:none;
    background:#fff;
    }
        .horizontal_nav ul.dropdown li:last-child {
        border-radius: 0 0 10px 10px;
        }
        .horizontal_nav ul.dropdown li a {
        border:none;
        }

.menu {
    width: 60px;
    background: #91AA9A;
    padding:8px 12px;
    color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    display: none;
}
.horizontal_nav  .dropdown-trigger { display:none;}
/* main content */ 
.content {
	width:960px;
	margin:0 auto;
	padding:0 0 20px 0;
}
.content_left {
	width: 100%; /*width:664px;*/
	float:left;
	padding:0 20px 0 0;
}
.content_right {
	width:20%;/*width:246px;*/
	float:left;
	/*background:url(../images/vertical_divide.jpg) left no-repeat;*/
    border-left:1px solid #ddd;
	min-height:400px;
	padding:0 0 0 30px;
	color:#888!important;
}

.two-column { width: 49%; }
.margin-left {margin-left:2%; }

.content80 {
	width: 70%;
}
.content_right a {
	color:#888;
}
.home_photo {
	margin:0 20px 20px 0;
	float:left;
	width:auto;
	overflow:visible;
}
.quote {
	background:url(../images/quotes.gif) top left no-repeat;
	padding:0 0 0 20px;
	margin:20px 0 0 0;
}
.quote_text {
	background:url(../images/quotes.gif) bottom right no-repeat;
	position:relative;
	text-align:center;
	padding:0 20px 0 0;
}
.quote_caption {
	font-size:0.8em;
	text-align:center;
	color:#999;
	margin:10px;
}
/* footer */
.footer {
	max-width:960px;
	margin:0 auto 30px auto;
	padding:10px 0 0 0;
	font-size:0.8em;
	border-top:1px solid #ccc;
}
.footer a {
	color:#666;
}
/* Text Styling */
a {
	color:#333;
}
.red {
	color:#903
}
.small {
	font-size:0.8em;
}
/* Content Display */
.info_table {
	border:2px solid #444;
    border-top-color: #444;
	border-collapse:collapse;
	width:100%;
}
.info_table th {
	border:1px solid #444;
	padding:6px;
	background:#FC9;
}
.info_table td {
	border:1px solid #444;
	padding:6px;
	background:#fffffe;
	text-align:center;
}
.info_table .good {
	background:#fff;/*66CC65*/
	color:#39C;
}
.info_table .bad {
	background:#fff;/*CC3332*/
	color:#000;
}
.caption {
	font-size:0.8em;
	text-align:center;
	margin:4px 0 10px 0;
}
.float_image {
	float:right;
	padding:4px;
	margin:0 0 0 12px;
	border:1px solid #ccc;
	background:#fffffe;
}
.float_image_left {
	float:left;
	padding:4px;
	margin:0 12px 0 0;
	border:1px solid #ccc;
	background:#fffffe;
}
hr {
	color:#ccc;
	background-color:#ccc;
	height:1px;
	border:none;
}
h3 {
	color:#91AA9A;
}
/* styles added JH 16/10/2013 */


p {	line-height:1.5em;}
span.higlight:hover { color:#39C; }
.higlight.active { color:#39C; }
.blue { color:#39C; }
.border-bottom { border-bottom: 1px solid #ddd; }
.focs-logo { background:url(../images/focs-logo.jpg) no-repeat;
             height:139px;
             width: 139px;
             position:absolute;
             right: 0;
}

/* map */
#map-canvas {
          height:400px;}
      #panel {
        z-index: 5;
        background-color: #fff;
        border: 1px solid #ddd;}

.selection { padding: 10px; }

.feedback-nav {  }
.feedback-nav ul { list-style: none; margin:0; padding: 0; }
.feedback-nav ul li { background: #f2f2f2; margin: 10px 0; padding:20px; border-left: 6px solid #ddd;}
.feedback-nav ul li:hover { background: #ebebeb; }
.feedback-nav ul li a:hover { text-decoration: none; }
    .feedback-nav span { padding-top:6px; display:block; }
    .feedback-nav .higlight { float:left;}
    .feedback-nav .read-more { float:right; color: #39C;}
    .feedback-nav .read-more:hover { text-decoration:underline;}

/* New 09/04/15 */

.feedback-nav ul li.li-title { background: #fff; padding:0; margin:0; border:0; }

.h3 { color:#91AA9A; font-size:16px; }
    .h3:before { content:"-"; margin: 0 10px; color: #333; font-weight:normal; }
.desktop-hide { display:none; }
.desktop-maxwidth300 { max-width:300px; }
    .desktop-maxwidth300 img { max-width:100%; }

/* Media queries */
/* ideal break points: 1280, 1024, 800, 600, 480 and 320 */

.area20 {float:left;width:20%;}
.area25 {float:left;width:25%;}
.area33 {float:left;width:33.3%;}
.area40 {float:left;width:40%;}
.area50 {float:left;width:50%;}
.area60 {float:left; width:60%;}
.area66 {float:left; width:66.6%;}
.area75 {float:left; width:75%;}
.area80 {float:left; width:80%;}
.area90 {float:left; width:90%;}
.area100 {float:left;width:100%;}

.multi_Column_Layout {margin:0 -10px;}
.column_Inner_Padding {margin:0 10px;}

.area20, .area25, .area33, .area40, .area50, .area60, .area66, .area75, .area80, .area90, .area100 {margin-bottom: 20px;}


@media all and (max-width: 480px) {
    .area20, .area25, .area33, .area40, .area50, .area60, .area66, .area75, .area80, .area90 {width: 100%;}
}

@media only screen and (max-width : 960px) {
   .focs-logo {
             display:none;
        }
}

@media only screen and (max-width : 800px) {
    .tablet-hide { display:none;}
    .tablet-show { display:block; }
    .tablet-block { display:block; }
    .tablet100 { width:100%; max-width:100%; }

    .focs-logo {
              display: block;
             position:static;
             margin: 0 auto;
        }

    .menu {
        display:block;
    }

    .masthead { border-bottom:1px solid #ddd; }

    .horizontal_nav {
        display: none;
    }

    img { 
        max-width:100%;
        height:auto;
    }
    .float_image {
        margin:0;
        margin-bottom: 20px;
    }

    .title_bar, .masthead {
	width:100%;
    min-width:100%
    }

    .container {
        width: auto;
        padding: 0 20px 30px 20px;
    }

    .content {
	width:100%;
	}

    .content80  {
        width:100%;
    }
    .content_right  {
        width:100%;
        margin:0;
        padding:0;
        border:0;
        border-top:1px solid #ddd;
        color:#444!important;
    }

    .two-column { width: 100%; }
    .margin-left {margin-left:0; }


    /* menu */
    .horizontal_nav ul li:hover ul { display:none; }
    .horizontal_nav {
        text-align:left;
        text-align:center;
        text-transform: uppercase;
        display:none;
        margin-top:10px;
        position:fixed;
        overflow:hidden;
        left:0; right:0;
    }

        .horizontal_nav ul {
        }

        .horizontal_nav li {
            width:100%;
            border-bottom: 1px solid #fff;
        }

            .horizontal_nav li a {
                padding-left:20px;
                color:#fff;
        
            }

                .horizontal_nav li a:hover {
                }


        .horizontal_nav .submenu { position:relative; }
        .horizontal_nav  .dropdown-trigger { display:block; padding:7px 18px; background:#fff; position:absolute; right:0; top:0; color:#91AA9A; }

        /*drop down*/
        .horizontal_nav ul li ul {
        }

        .horizontal_nav ul.dropdown {
            display:none;
            position:static;
            width:100%;
            border-radius: 0;
            margin:0;
            overflow:hidden;
        }

            .horizontal_nav ul.dropdown li {
                border:0;
                padding-left:20px;
                background-color:#fff;
                position:relative;
                border-bottom: 1px solid #91AA9A;
                text-transform: none;
            }
            .horizontal_nav ul.dropdown li:last-child {
                border-bottom:0;
            }
            .horizontal_nav ul.dropdown li:before {
                content:'\25b6';
                color: #888;
                position:absolute;
                padding:8px 0;
            }

                .horizontal_nav ul.dropdown li:last-child {
                border-radius: 0;
                }
                .horizontal_nav ul.dropdown li a {
                    
                    color: #888;
                }

}/* /end 600px */

 @media only screen and (max-width : 480px) {

    .mobile-hide {display: none;}
    .mobile-show {display: block;}
}