/* Main styles */

		body{
			background-color:#000000;
			margin-top:0px;
			text-align:center;
			color:#FFFFFF;
			
			
		

		}


		table{
			color:#FFFFFF;
			border:0px solid white;
		}
		
		td{
			color:#FFFFFF;
			border:0px solid red;
			font-family:Arial, Helvetica, sans-serif;
		}


		a{
			color:#FFFFFF;
			text-decoration:none;
		}


		a:hover{
			color:#00CCFF;
			text-decoration:none;
		}


		.status {
			font-size: 20px;
			padding: 10px;
			border-radius: 5px;
			text-align: center;
		}
		
		.status.error {
			background-color: #FF0000;
			color: #FFFFFF;
		}
		
		.status.success {
			background-color: #46ab4a;
			color: #FFFFFF;
		}

button {
    border-radius: 5px;
    padding: 10px;
    color: #fff;
    background-color: #167deb;
    border-color: #0062cc;
    font-weight: bolder;
    cursor: pointer;
}
  
button:hover {
    text-decoration: none;
    background-color: #0069d9;
    border-color: #0062cc;
}
  

/* Center the main div on the page */



/* Front Page Image Swap styles */

		#image_container{
			background-image:url('/householdautomation.co.uk/assets/images/entry.jpg');
			background-position:center;
			background-repeat:no-repeat;
			vertical-align:top;
			height:350px;
			width:650px;
			text-align:right;

		}

		#currentimg{
			z-index:999;
		} 
		
		
/* Top Menu styles */

		#top_menu{
			width:120px;
			float:left;
			color:#FFFFFF;
			font-family:'Lato', Arial, Helvetica, sans-serif;
			font-size:15px;
			text-transform: uppercase;
		}
		
		.top_menu:a{
			color:#FFFFFF;
			text-decoration:none;
		}
		
		.top_menu:active{
			color:#FFFFFF;
			text-decoration:none;
		}
		
		.top_menu:visited{
			color:#FFFFFF;
			text-decoration:none;
		}
		
		.top_menu:hover{
			color:#00CCFF;
			text-decoration:none;
		}
		
		#top_telephone{
			width:200px;
			float:left;
			color:#00CCFF;
			font-family:Arial, Helvetica, sans-serif;
			font-size:23px;
			font-weight:bold;
			vertical-align:bottom;
		}
		


		.top_menu_selected{
			color:#00CCFF;

		}






/* Blue Line styles */

		#top{
			height:170px;
			/*border-bottom:2px solid #003E4D;*/
		}
		
		#bottom{
			height:170px;
			/*border-bottom:2px solid #003E4D;*/
			padding-top:0px;
			overflow: hidden;

		}


/* Logo styles */

		#householdautomation{
			padding-left:40px;
		}

/* Article styles */

		#article_title{
			color:#00CCFF;
			text-align:left;
			font-family:Arial, Helvetica, sans-serif;
			font-weight:bold;
			font-size:18px;
			padding-right:30px;
			padding-bottom:5px;
			padding-top:20px;

		}
		
		#article_text{
			color:#FFFFFF;
			text-align:left;
			font-family:Arial, Helvetica, sans-serif;
			font-weight:normal;
			font-size:12px;
			padding-right:30px;
			padding-bottom:20px;
			padding-top:0px;
			width:290px;
		}
		
		#article_more{
			clear:both;
			font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			font-style:italic;
			border:0px solid white;
			width:100px;
			float:right;
			display:block;      
			position:relative;    
			bottom:0;    
			border:0px solid red;
		}
		
		.more_link:a{
			color:#FFFFFF;
			text-decoration:none;
		}
		
		.more_link:active{
			color:#FFFFFF;
			text-decoration:none;
		}
		
		.more_link:visited{
			color:#FFFFFF;
			text-decoration:none;
		}
		
		.more_link:hover{
			color:#00CCFF;
			text-decoration:none;
		}
		
		
		
/* icontrol styles */

		#icontrol{
			background-image:url('/householdautomation.co.uk/assets/images/icontrol.png');
			border-bottom:2px solid #003E4D;
			background-position:center;
			background-repeat:no-repeat;
			vertical-align:top;
			width:320px;
		}
		
		
		#icontrol_heading{
			font-family:Arial, Helvetica, sans-serif;
			font-size:23px;
			margin-top:60px;
			vertical-align:bottom;
			border:0px solid red;
		    color:grey;		}
		
		
		
		#icontrol_text_link:a{

			color:grey;
		}
		
		#icontrol_link1{
			font-family:Arial, Helvetica, sans-serif;
			font-size:20px;
			margin-top:13px;
			margin-left:33px;
			border:0px solid red;
			text-align:left;
			color:grey;
			padding-left:10px;
			padding-top:10px;
			height:32px;
			vertical-align:middle;
			width:245px;
			cursor:pointer;
			border-top:thin grey dotted;
			border-bottom:thin grey dotted;	
		
		}

		#icontrol_link1:a{

			color:grey;
		}


		#icontrol_link1:hover{
			background-color:lime;
			color:#FFFFFF;
		}

		#icontrol_link2{
			font-family:Arial, Helvetica, sans-serif;
			font-size:20px;
			border:0px solid red;
			text-align:left;
			color:grey;
			padding-left:10px;
			padding-top:10px;
			height:34px;
			vertical-align:middle;
			width:245px;
			cursor:pointer;
			border-bottom:thin grey dotted;	
			margin-left:33px;
		}

		#icontrol_link2:hover{
			background-color:lime;
			color:#FFFFFF;
		}


		#icontrol_link3{
			font-family:Arial, Helvetica, sans-serif;
			font-size:20px;
			border:0px solid red;
			text-align:left;
			color:grey;
			padding-left:10px;
			padding-top:10px;
			height:34px;
			vertical-align:middle;
			width:245px;
			cursor:pointer;
			border-bottom:thin grey dotted;
			margin-left:33px;
		}

		#icontrol_link3:hover{
			background-color:lime;
			color:#FFFFFF;
		}


		#on_off{
			float:right;
			margin-right:10px;
			font-size:20px;
		}
		
		.icontrol_text{
			text-align:left;
			color:grey;
			font-family:Arial, Helvetica, sans-serif;
			border:0px solid red;
			width:250px;
			font-size:12px;
			margin-top:2px;
			margin-left:45px;
		}
		
		
		#icontrol_text_link:a{
			color:grey;
	
		}
		
		
		#houseButton{
			margin-top:22px;
			margin-left:8px;
			border:0px solid red;
			height:40px;
			width:60px;
		}
		
		#houseButton:hover{
			background:url('/householdautomation.co.uk/assets/images/icontrol_house_on.png') no-repeat center;
			cursor:pointer;

		}
		
/* Menu styles */
		#main_menu{
			margin-top:0px;
			width:300px;

		}
		/*
		#menu_item:hover{
			background-color:#003E4D;
			color:#00CCFF;
		}
*/
		
		
		#menu_item{
			border-bottom:1px solid #003E4D;
			text-align:left;
			padding:12px;
			padding-left:30px;
			color:#FFFFFF;
			font-family:Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:18px;
			font-weight:bold;
		}
		

		#menu_child_item{
			clear:both;
			border-bottom:0px dotted #003E4D;
			text-align:left;
			padding:5px;
			padding-left:60px;
			color:#FFFFFF;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:12px;
			font-weight:normal;
			width:70%;
			border:0px solid red;
		}
		
		#menu_child_item:hover{
			background-color:#003E4D;
			color:#00CCFF;
		}
		

		
		
		
/* Page Styles */

		#page_title{
			color:#00CCFF;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:23px;
			font-weight:bold;
			margin-top:30px;
			margin-bottom:20px;
		}

		.page_sub_title{
			color:#00CCFF;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:16px;
			font-weight:bold;
		}


		.scroll-pane{

			height: 500px;
			overflow: auto;
			color:#FFFFFF;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:16px;			
		}
		
		
		
		
		.sub_heading{
			color:#00CCFF;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:15px;
			font-weight:bold;
		}
		
		.generalLink:a{
			color:#FFFFFF;
		}
		
		.generalLink:hover{
			color:#DDDDDD;
		}		
		
		
		
		
/*Distributor Styles */

		.distributor_image_cell{
			 background:#FFFFFF;
			 text-align:center;

		}

		.distributor_cell{
			 padding-left:10px;
			 vertical-align:top;
		}	
		
/*Manufacturer Styles */

		.distributor_image_cell{
			 text-align:center;
		}

		.distributor_cell{
			 padding-left:10px;
			 vertical-align:top;
		}	
		
		
		
		
/*Contact Styles */

		#contact_wrapper{
			border:0px solid red;
			height:435px;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;

		}
		#contact_label{
			border:0px solid green;
			width:20%;
			float: left;
			padding:20px;

			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:14px;
			padding-left:60px;
		}
		#contact_text{
			border:0px solid yellow;
			width:45%;
			float: left;
			padding:20px;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:14px;
			display: flex; /* Arrange buttons in a row */
            gap: 10px;		}

		
		#contact_textbox{
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:14px;
			width:300px;

			
		}
		
		#contact_textarea{
			width:300px;
			height:150px;
			font-family:sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:14px;

		}
		
		
		#contact_button{
			
			background-color:#003E4D;
			color:#EEEEEE;
			border:0px solid red;
			padding:10px;
			cursor:pointer;
			float:right;
			padding: 10px 20px;
            font-size: 16px;
		
		}
		
		#contact_button:hover{
			background-color:#00CCFF;
		}
		
		
		#capture_image{
			border:0px solid red;
			width:200px;
			text-align:left;
			margin-left:257px;
		
		}
		
		#capture_refresh{
		
			width:200px;
			cursor:pointer;
		}
		
		.capture_button{
			
			background-color:#003E4D;
			color:#EEEEEE;
			border:0px solid red;
			padding:10px;
			cursor:pointer;
		}
		
		.capture_button:hover{
			background-color:#00CCFF;
		}
		
		
/*Left Menu  Styles */		

		#menu_header{
			text-align:left;
			padding:12px;
			padding-left:30px;
			color:#FFFFFF;
			font-family:Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:18px;
			font-weight:bold;
		}

		
		#left_menu_div{
			clear:both;
			border-bottom:0px dotted #003E4D;
			text-align:left;
			padding:5px;
			padding-left:80px;
			color:#FFFFFF;
			font-family: sans-serif,Lucida Grande,Lucida Sans Unicode,Verdana,Arial;
			font-size:12px;
			font-weight:normal;
			width:80%;
			border:0px solid red;
		}
		
		
		#left_menu_div:hover{
		
			background:#003E4D;
		}

		#left_menu_div_active_link{
		
			color:#00CCFF;
		}
		
		
		
		#page_menu_active{
		
			color:#00CCFF;
		}
		
		/*Social Icons*/
		
				#top_social{
			float:left;
			color:#00CCFF;
			font-family:Arial, Helvetica, sans-serif;
			font-size:23px;
			font-weight:bold;
			vertical-align:bottom;
		}
				
		#social_icon_facebook{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/facebook.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		#social_icon_facebook:hover{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/facebook_hover.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		
		#social_icon_googleplus{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/googleplus.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		#social_icon_googleplus:hover{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/googleplus_hover.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		
		#social_icon_twitter{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/twitter.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		#social_icon_twitter:hover{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/twitter_hover.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		
		#social_icon_linkedin{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/linkedin.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		#social_icon_linkedin:hover{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/linkedin_hover.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		#social_icon_blog{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/blog.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		#social_icon_blog:hover{
			width:25px;
			height:25px;
			float:right;
			vertical-align:bottom;
			padding:5px;
			background-image:url('../images/social_icons/blog_hover.png'); 
			background-size:25px 25px;
			background-repeat:no-repeat;
		}
		
		body:after{
			display:none;
			content: url('../images/social_icons/blog_hover.png') url('../images/social_icons/linkedin_hover.png') url('../images/social_icons/twitter_hover.png') url('../images/social_icons/googleplus_hover.png') url('../images/social_icons/facebook_hover.png');
		}

		/*Icon Styles*/
		
		.icon_group{
		width="660px";
		}

		.dash
		{
			border-bottom: 1px solid #00ccff;
			width: 100%;
			height: 0px;
		}
		
		.icon{
			float:left;
			margin-left: 26px;
			margin-right: 26px;
			margin-top: 10px;
			margin-bottom: 10px;
			border:2px solid #444444;
		}
		
		.icon:hover{
			border:2px solid #00ccff;
		}
		
		.iconfive{
			float:left;
			margin: 10px;
			border:2px solid #444444;
		}
		
		.iconfive:hover{
			border:2px solid #00ccff;
		}
		
		.portfolio_article{
			border-top: 2px solid #003e4d;
			padding-top: 10px;
		}
		
		/*Footer Styles*/
		#footer{
		font-family: 'Lato', sans-serif;
		font-size:15px;
		color:#eeeeee;
		background-color:#030303;
		}
		
		/*BlogPosts*/
		.blogpost{
		padding:10px;
		background-color:#000000;
		}
		
		.blogpost:hover{
		background-color:#000000;
		}
		
		/*Login*/
		#login{
		position:absolute;
		top:250px;
		width:500px;
		margin-left:35%;
		padding-bottom:50px;
		font-family: 'Lato', sans-serif;
		border: 5px solid #00ccff;
		background-color:#222222;
		display:none;
		}
		
		/*Popup*/
		#popup{
		position:absolute;
		top:250px;
		width:500px;
		margin-left:35%;
		padding:20px;
		font-family: 'Lato', sans-serif;
		border: 5px solid #990000;
		background-color:#222222;
		display:none;
		}
		
		/*Tooltips*/
		
		/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
	position: relative;
	z-index: 2;
	cursor: pointer;
}

/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  visibility: hidden;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	pointer-events: none;
}

/* Position tooltip above the element */
[data-tooltip]:before {
	position: absolute;
	bottom: 150%;
	left: 50%;
	margin-bottom: 5px;
	margin-left: -50px;
	padding: 7px;
	width: 80px;
	-webkit-border-radius: 3px;
	-moz-border-radius:    3px;
	border-radius:         3px;
	background-color: #000;
	background-color: hsla(0, 0%, 20%, 0.9);
	color: #fff;
	content: attr(data-tooltip);
	text-align: center;
	font-size: 14px;
	line-height: 1.2;
}

/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
	position: absolute;
	bottom: 150%;
	left: 50%;
	margin-left: -10px;
	width: 0;
	border-top: 5px solid #000;
	border-top: 5px solid hsla(0, 0%, 20%, 0.9);
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	content: " ";
	font-size: 0;
	line-height: 0;
}

/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
	visibility: visible;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
}