/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
body {
	font-family:"Times New Roman", Times, serif;
	font-size:1.25em;
	line-height:1.5em;
	color:#4D4D4D;
}
h1 {
	background-color: transparent;
	border: 0;
	overflow: hidden;
	text-indent: -9999px;
	background-image: url(../images/FIL-logo.gif);
	background-size: auto 100%;
	background-repeat: no-repeat;
	width: auto;
	height: 150px;
	margin-top:1em;
}
h2 {
	font-size: 1.4em;
	color: #94378E;
}
.floatleft {
	float: left;
	padding-right: 1em;
}


#image {
	margin-bottom:1.58em;
}
#image img {
	width:100%;
	height:100%
}
nav#desktop {
	position: absolute;
	top: 95px;
	right: 0px;
}
nav#desktop ul li {
	float:right;
}
nav#desktop ul li a {
	text-decoration: none;
	background: #F1F1F1;
	color:#4D4D4D;
	padding: 0.3em;
	text-transform: uppercase;
	font-size: 0.9em;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFF;
	transition: background-color 0.5s ease;
}
nav#desktop ul li a:hover, nav#desktop ul li a:focus {
	background-color:#EFA91A;
	color:#FFFFFF;
}
nav#mobile {
	display:none;
}
footer {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #000;
	padding-top: 1em;
	padding-bottom: 2em;
	color: #963D8D;
	font-size: 0.9em;
	background-image: url(../images/icaew.jpg);
	background-repeat: no-repeat;
	background-position: right top;
}
form label em {
	font-style: normal;
	color: #F00;
}
.submit {
	font-size: 1.2em;
	background-color:#963D8D;
	color:#FFF;
}



#main ul {
	padding: 1em;
	list-style-type: disc;
	list-style-position: inside;
	background-color: #F1F1F1;
	width:65%;
}
#main ul li {
	line-height:1.2em;
}

select, input, textarea {
		width: 80% !important;
		 }

/* #Page Styles
================================================== */
#tooltip
{
	text-align: center;
	color: #fff;
	position: absolute;
	text-decoration:none;
	z-index: 100;
	padding-left: 5px;
	padding-right: 5px;
	background-color: #94368E;
	-webkit-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.2);
box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.2);
}
 
    #tooltip:after /* triangle decoration */
    {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #94368E;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
		
    }
 
        #tooltip.top:after
        {
            border-top-color: transparent;
            border-bottom: 10px solid #94368E;
            top: -20px;
            bottom: auto;
			
        }
 
        #tooltip.left:after
        {
            left: 10px;
            margin: 0;
        }
 
        #tooltip.right:after
        {
            right: 10px;
            left: auto;
            margin: 0;
        }
		
	/*CSS for Error notification*/
.notification_error{
  border: 1px solid #f1dfc5;
  height: auto;color: #ca5702;
  padding: 10px;
  margin: 10px auto;
  text-align:left;
  -moz-border-radius:5px;
  margin-bottom:10px;}
 
/*CSS for Successfully sent notification*/
.notification_ok{
  border: 1px #cbcf8e solid;
  height: auto;padding: 10px;
  margin:0 auto;
  background: #f5f9fd;
  text-align: center;-moz-border-radius:
  5px;margin-bottom:10px;}


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {

		h1 {
			height:100px;
		}
		#main ul {
	width: 85%;
	list-style-position: outside;
	padding-left:1.8em;
		}

		
		}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		nav#desktop {
			top: 60px;
		}
		}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		
		}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	h1 {
			height:120px;
			margin-bottom:30px;
		}
	footer {
			padding-top:80px;
		}
		nav#desktop {
			top: 120px;
		}
		select, input, textarea {
		width: 100% !important;
		 }

		}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		h1 {
			height:80px;
			margin-bottom:190px;
			margin-top:5px;
		}
		h2 {
			font-size:1em;
			line-height:4em !important;
			margin-bottom:0px;
		}
		nav#desktop {
			display:none;
		}
		nav#mobile {
			display:inherit;
		}
		nav#mobile {
			position: absolute;
			top: 73px;
			left:0px;
			width:100%;
		}
		nav#mobile ul li {
			margin-bottom:5px;
		}
		nav#mobile ul li a {
			display:block;
			text-decoration: none;
			background: #F1F1F1;
			padding: 0.3em;
			text-transform: uppercase;
			font-size: 0.8em;
			border-left-width: 1px;
			border-left-style: solid;
			border-left-color: #FFF;
			transition: background-color 0.5s ease;
			
		}
		nav#mobile ul li a:hover, nav#mobile ul li a:focus {
			background-color:#EFA91A;
			color:#FFFFFF;
		}
		footer {
	padding-top: 0.5em;
	background-position: right bottom;	
	margin-bottom:1em;		
		}
		footer p {
			text-align:center;
			padding-bottom:1em;
		}
		#main {
			font-size:0.8em;
			line-height:1.2em;
		}
		#main p {
			margin-bottom:1em;
		}
		#main ul li {
			margin-bottom:0.3em;
		}
		#image {
			margin-bottom:0em;
		}
		
		select, input, textarea {
		width: 100% !important;
		 }
		}
