
#boxshadow {
    position: relative;
    -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0,0.5);
    -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
    padding: 0px;
    background: white;
}

#myInput {
    background-image: url('../images/searchicon.png'); /* Add a search icon to input */
    background-position: 10px 12px; /* Position the search icon */
    background-repeat: no-repeat; /* Do not repeat the icon image */
    width: 100%; /* Full-width */
    font-size: 16px; /* Increase font-size */
    padding: 12px 20px 12px 40px; /* Add some padding */
    border: 1px solid #ddd; /* Add a grey border */
    margin-bottom: 12px; /* Add some space below the input */
}

#myTable {
	max-width:100%;
    border-collapse: collapse; /* Collapse borders */
    width: 100%; /* Full-width */
    border: 1px solid #ddd; /* Add a grey border */
    font-size: 13px; /* Increase font-size */
}

/*----*****---- << Blog >> ----*****----*/	
	
		.blog-post {
	float: left;
	width: 98%;
	margin: 0px;
	padding: 0px;
}

.post-title .date { color:#7d7d7d; }
		.post-title .date p { border-right:1px solid #cdcdcd; }
		
		.blog-post .entry-head, .blog-post .post-details { border-top:1px solid #e4e4e4; border-bottom:1px solid #e4e4e4; }
		.blog-post .entry-head span.author { color:#a8a8a8; }
		.blog-post .entry-head .comments { background:url(../images/comments.png) left no-repeat; color:#6a6a6a; }
		
		.blog-post .post-details .categories { background:url(../images/categories.png) left 8px no-repeat; }
		.blog-post .post-details .categories, .blog-post .post-details .tags { color:#a8a8a8; }
		
		.blog-post .post-details .tags .float-right { background:url(../images/tags.png) left 9px no-repeat; }
		.blog-post .post-details .categories a, .blog-post .post-details .tags a { color:#6a6a6a; }
		
		.post-title { float:left; width:100%;}
		.post-title h5 { float:left; line-height:24px; width:85%; margin:0px 2% 0px 0px; }
		
		.post-title .date { float:right; margin:-3px 0px 0px; padding:0px; width:13%; }
		.post-title .date p { font-size:24px; line-height:30px; padding:0px 10px 0px 0px; float:left; }
		.post-title .date span { text-align:center; font-size:12px; width:40px; float:left; }
		
		.one-half .post-title h5 { width:81%; }
		.one-half .date { width:17%; }
		.one-half .blog-post .post-thumb a { width:97.4%; } 	
		
		.blog-post .post-thumb {
	float: left;
	clear: both;
	padding: 0px;
	width: 99%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	text-align: center;
}
		.blog-post .post-thumb a { width:98.3%; }
		.blog-post .post-thumb img {
	height: auto !important;
}
		
		.blog-post .entry-head, .blog-post .post-details { line-height:30px; width:100%; float:left; }
		.blog-post .entry-head span.author { float:left; font-size:11px; font-style:italic; }
		.blog-post .entry-head .comments { float:right; margin-right:5px; padding:0px 0px 0px 17px; font-size:11px; }
		.blog-post .entry-head .comments:hover { text-decoration:underline; } 

		.blog-post .post-details { border:none; margin:0px 0px 10px; }
		.blog-post .post-details .categories { padding:0px 0px 0px 17px; float:left; width:45%; margin:0px 2% 0px 0px; }
		.blog-post .post-details .categories, .blog-post .post-details .tags { font-style:normal; font-size:12px; }
		
		.blog-post .post-details .tags  { width:49%; float:left; }
		.blog-post .post-details .tags .float-right { padding:0px 0px 0px 17px; float:right; }
		.blog-post .post-details .categories a, .blog-post .post-details .tags a { font-style:italic; font-size:12px; line-height:20px; }
		.blog-post .post-details .categories a:hover, .blog-post .post-details .tags a:hover { text-decoration:underline; }
		
		.blog-post .post-content { float:left; clear:both; width:100%; }
		
		.blog-full-width { width:100%; margin:0px; padding:0px; } 
		.blog-full-width .blog-post .post-thumb a { width:98.8%; }
		.blog-full-width .post-title .date { width:9%; }
		


#myTable th, #myTable td {
    text-align: left; /* Left-align text */
    padding: 13px; /* Add padding */
}

#myTable tr {
    /* Add a bottom border to all table rows */
    border-bottom: 1px solid #ddd;
}

#myTable tr.header, #myTable tr:hover {
    /* Add a grey background color to the table header and on hover */
    background-color: #f1f1f1;
}

.hr{ background:url(../images/splitter.jpg) repeat-x; }
.hr-border { background:url(../images/dashed-splitter.png) repeat-x; }

hr{
	border: none;
	height: 1px;
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 5px;
	margin-left: 0;
}
	
	/* due to IE <HR> margin bugs I had to made classed and apply them to div to achieve the effect of a <HR> */
	
	.hr{
	width: 100%;
	height: 2px;
	clear: both;
	float: left;
	position: relative;
	z-index: 1;
	margin-top: 10px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
}
	.hr-invisible { float:left; width:100%; margin:20px 0px; }
	.hr-border { height:2px; float:left; clear:both; width:100%; margin:20px 0px; position:relative; z-index:1; }
	


.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-60.center { font-size: 60px; text-align: center; }

.map-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.map-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

div #Contenthomesavers {
  /* Location of the image */
  background-image: url("../images/banner/homesavers/Home Savers Banner without 4 buttons.jpg");
    height:400px;
  
  /* Image is centered vertically and horizontally at all times */
  background-position: center center;
  
  /* Image doesn't repeat */
  
  /* Makes the image fixed in the viewport so that it doesn't move when 
     the content height is greater than the image height */
  
  /* This is what makes the background image rescale based on its container's size */
  background-size: cover;
  
  /* Pick a solid background color that will be displayed while the background image is loading */
  
  /* SHORTHAND CSS NOTATION
   * background: url(background-photo.jpg) center center cover no-repeat fixed;
   */
}

/* For mobile devices */
@media only screen and (max-width: 767px) {
  div #Contenthomesavers {
    /* The file size of this background image is 93% smaller
     * to improve page load speed on mobile internet connections */
    background-image: url("../images/banner/homesavers/Home Savers Banner without 4 buttons767.jpg");
  }
	}

/* For mobile devices */
@media only screen and (max-width: 300px) {
  div #Contenthomesavers {
    /* The file size of this background image is 93% smaller
     * to improve page load speed on mobile internet connections */
    background-image: url("../images/banner/homesavers/Home Savers Banner without 4 buttons300.jpg");
  }
	}
