@charset "utf-8";
/* CSS Document */

html{height:101%; }

body { /* the main background of the computer screen*/
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	text-align: center;
	background-color: #fff;
	font-family:Arial, Helvetica, sans-serif;
	
}

.mainOuter {/*the main background of the container eg.layout background*/
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-color:#fff;
	min-width:100%;
	height:auto;
	text-align: left;
	color:#414141;
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	float:left;
}

a:link{ font-weight:bold; color:#005a81; text-decoration: none;}
a:visited{ font-weight:bold; color:#005a81; text-decoration: none;}
a:active{ font-weight:bold; color:#005a81;	text-decoration: none;}
a:hover{ font-weight:bold; text-decoration: underline;	color:#b6c7e6;}

h1{margin:20px 0px 10px 0px; font-size:18px; color:#005a81;}
h2{margin:0px 0px 15px 0px; font-size:14px; color:#005a81;}

img{border:none;}

p{background: url('');}

ul{list-style-type: none;padding: 0;margin: 0;}
li{background-image:url(images/bullet.png);background-repeat: no-repeat;padding-left: 25px; line-height:22px;}

.hidden{display:none;}

/*==========main container==========*/
.mainContainer{width:1050px; height:auto; margin:0 auto;}

/*
#     #                                    
#     # ######   ##   #####  ###### #####  
#     # #       #  #  #    # #      #    # 
####### #####  #    # #    # #####  #    # 
#     # #      ###### #    # #      #####  
#     # #      #    # #    # #      #   #  
#     # ###### #    # #####  ###### #    # 
*/

.header{ 
	height:122px;
	float:left;
	background-color:#b6c7e6;
	min-width:100%;
	font-family:Arial, Helvetica, sans-serif;
	}

.header-container{ margin:0 auto; width:1050px; height:122px;}
.logo{width:200px; height:100px; float:left;}
.contact{width:320px; height:120px; float:right; text-align:right;}
.contact-right{ float:right; font-size:22px;}
#telephone{ margin-top:38px; margin-right:10px; color:#414141;}
#telephone p{ margin:0px;}
.telephone-title{ font-size:24px;}

/*==========header-menu==========*/
.menuOuter{ 
	min-width:100%;
	height:32px;
	background-color:#005a81;
	color:#fff;
	clear:both;
	margin:0 auto;
	display:inline-block;
	/*border-top:1px solid #fff;*/
	}
.menuContainer{width:1050px;height:32px; margin:0 auto;} 	

/*========== This is for roll over images sometimes used for home icons in menu==========*/
.button{
	width:auto; height: 32px; float:left;}
#home{
  display: block;
  width: 26px;
  height: 32px;
  background:url(images/home_btn.jpg) no-repeat 0 0;
}
#home:hover{   background-position: 0 -32px;}
#home span{  display: none;}
/*========== end ==========*/

.menu{
	width:auto;
	height:32px;
	float:left;
	border:none;
	font-family:arial;
	font-size:13px;
	font-weight:bold;
	text-align:center;
	margin-left:13px;
	text-transform:uppercase;
}
.menu ul{background:transparent; height:32px; list-style:none; margin:0; padding:0;}
.menu li{float:left; list-style:none;}
.menu li a{
	background:transparent;
	color:#fff;
	display:block;
	font-weight:bold;
	line-height:32px;
	margin:0px;
	padding:0px 15px;
	text-align:center;
	text-decoration:none;
}
.menu li.last a{border-right:none;}
.menu li a:hover, .menu ul li:hover a{ background:transparent; color:#b6c7e6;} 
.menu li ul{
	background:#301b0a;
	display:none;
	height:auto;
	padding:0px;
	margin:0px;
	border:0px;
	position:absolute;
	width:200px;
	z-index:200;
	/*top:1em;
	/*left:0;*/
}
.menu li:hover ul{display:block;}
.menu li li {
	background:#301b0a;
	display:block;
	float:none;
	margin:0px;
	padding:0px;
	width:200px;
	border-bottom:1px solid #645347;
}
.menu li:hover li a{background:none;}
.menu li ul a{
	display:block;
	height:23px;
	font-size:12px;
	font-style:normal;
	margin:0px;
	padding:0px 10px 5px 15px;
	text-align:left;
}
.menu li ul a:hover, .menu li ul li:hover a{background:#645347; border:0px; color:#fff; text-decoration:none;}

.menu ul li {background:none; padding-left:0px;}

/*
#####                                          
#     #  ####  #    # ##### ###### #    # ##### 
#       #    # ##   #   #   #      ##   #   #   
#       #    # # #  #   #   #####  # #  #   #   
#       #    # #  # #   #   #      #  # #   #   
#     # #    # #   ##   #   #      #   ##   #   
 #####   ####  #    #   #   ###### #    #   # 
 */

.content{width:1050px; height:auto; float:left; padding-top:10px; padding-bottom:10px; min-height:600px; }
.content-top{float:left; width:1050px; height:auto;}
.content-bottom{float:left; width:1050px; height:auto;}
.demo-text{width:600px; height:438px; /*border:1px solid #182550;*/ margin-bottom:10px;float:left;}



/*banner loading*/
#slider {
    position:relative;
    width:682px; /* Change this to your images width */
    height:398px; /* Change this to your images height */
    background:url(images/loading.gif) no-repeat 50% 50%;
}
#slider img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
#slider a {
    border:0;
    display:block;
}

/*banner*/
.banner{width:682px; height:398px; /*border:1px solid #182550;*/ margin-bottom:10px;float:left;}


.theme-default .nivoSlider {
	position:relative;
	background:#fff url(images/loading.gif) no-repeat 50% 50%;
    margin-bottom:10px;
    /*-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;*/
}
.theme-default .nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
	display:none;
}
.theme-default .nivoSlider a {
	border:0;
	display:block;
}

.theme-default .nivo-controlNav {
	/*text-align: center;
	padding: 0px;
	float:right;*/
	display:none;
}
.theme-default .nivo-controlNav a {
	display:inline-block;
	width:22px;
	height:22px;
	background:url(images/bullets.png) no-repeat;
	text-indent:-9999px;
	border:0;
	margin: 0 2px;
}
.theme-default .nivo-controlNav a.active {
	background-position:0 -22px;
}

.theme-default .nivo-directionNav a {
	display:block;
	width:30px;
	height:30px;
	background:url(images/arrows.png) no-repeat;
	text-indent:-9999px;
	border:0;
	opacity: 0;
	-webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
}
.theme-default:hover .nivo-directionNav a { opacity: 1; }
.theme-default a.nivo-nextNav {
	background-position:-30px 0;
	right:15px;
}
.theme-default a.nivo-prevNav {
	left:15px;
}

.theme-default .nivo-caption {
    font-family: Helvetica, Arial, sans-serif;
}
.theme-default .nivo-caption a {
    color:#fff;
    border-bottom:1px dotted #fff;
}
.theme-default .nivo-caption a:hover {
    color:#fff;
}

.theme-default .nivo-controlNav.nivo-thumbs-enabled {
	width: 100%;
}
.theme-default .nivo-controlNav.nivo-thumbs-enabled a {
	width: auto;
	height: auto;
	background: none;
	margin-bottom: 5px;
}
.theme-default .nivo-controlNav.nivo-thumbs-enabled img {
	display: block;
	width: 120px;
	height: auto;
}

.info-box1 { width:344px; height:210px; background:url(images/box-permahot.jpg) no-repeat; float:left;}
.info-box1 p{ padding-top:65px; padding-right:45px; font-size:16px; text-align:right;}
.info-box1 img{padding-left:80px;}
.info-box1 a{color:#284e7d;}
.info-box1 a:hover{color:#2f80c1;}

.info-box2 { width:367px; height:210px; float:left; background:url(images/box-products.jpg) no-repeat;}
.info-box2 ul{ padding-top:45px; margin-left:40px; line-height:20px; font-size:13px; font-weight:bold;}

.info-box3{ width:339px; height:210px; float:left; background:url(images/box-brochure.jpg) no-repeat;}
.info-box3 p{ text-align:right; padding-top:35px; padding-right:20px; font-size:15px;}
.info-box3 img{ margin-right:15px;}


/*.headingText{font-size:20px; text-transform:uppercase;}*/

/*============= CSS Contact Form=============*/

.contact-form{ width:310px; float:right; margin-top:20px;}
.enquiry{ margin-bottom:10px;}
.cssform p {margin-bottom:7px; margin-top:7px;}

.cssform { 
	background:url(images/contact-form.jpg) no-repeat;
	width:305px;
	height:268px;
	padding-left:20px;
	padding-top:30px;
	}
	
#demo-form { background:url(images/book-a-demo.jpg) no-repeat; }

.cssform label{
	width: 110px;
	float: left;
	text-align: left;
	display: block;
	font-weight:bold;
	color:#414141;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	text-transform:uppercase;
	padding-top:5px;
}
.cssform input{ 
	color: #414141;
	background:transparent;
	border: 1px solid #284e7d;
	width:156px;
	height:18px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	padding:2px;
	}
.cssform textarea{
	color: #414141; 
	background: #fff; 
	border: 1px solid #284e7d; 
	width:156px; 
	padding:2px; 
	height:45px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;	
	}
.submit {
	background:url(images/submit-but.jpg) no-repeat scroll 0 0 #fff !important;
	border:none !important;
	color:#fff;
	cursor:pointer;
	font-family:arial;
	font-weight:bold;
	margin-left:122px;
	width:152px !important;
	height:28px !important;
}

.cssform fieldset{border: 1px solid #524021; width: 400px;}

.cssform legend{
	color: #fff;
	font-weight:bold;
	font-size:12px;
	background: #896c3a;
	border: 1px solid #524021;
	padding: 5px 8px;
} 

/*
#######                                   
#        ####   ####  ##### ###### #####  
#       #    # #    #   #   #      #    # 
#####   #    # #    #   #   #####  #    # 
#       #    # #    #   #   #      #####  
#       #    # #    #   #   #      #   #  
#        ####   ####    #   ###### #    #
*/

.footer{ 
	min-width:100%;
	height:100px;
	clear:both;
	background-color:#005a81;
	margin:0 auto;
	display:inline-block;
	font-size:13px;
	color:#fff;
	margin-top:20px;
	padding-top:10px;
	font-family:Arial, Helvetica, sans-serif;
	/*position: absolute;
    bottom: 0;*/
	/*position:fixed;*/

	}
	
.footer-container{ margin:0 auto;width:1050px; height:70px;}

.footer a:link{font-weight:bold; color:#FFFFFF; text-decoration: none;}
.footer a:visited{font-weight:bold; color:#FFFFFF; text-decoration: none;}
.footer a:hover{font-weight:bold; text-decoration: underline;	color:#FFFFFF;}


.footerText{
	width:1050px;
	height:100px;
	float:left;
	color:#cccccc;
	font-size:12px;
}

.footerBottomLeft{ display:inline; font-size:12px; float:left;}
.footerBottomRight{ display:inline; font-size:12px; float:right;}


@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
body{
                min-width:1050px; 
}
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
body{
                min-width:1020px; 
}
}