* {margin: 0px; padding: 0px;}

body {background-color: black;}

div#page_body
{
  position: relative;
}

div.banner
{
  background-image: url(https://www.truro.ca/images/revslider/BackgroundPhoto5.jpg);
  background-image: url(https://www.truro.ca/images/revslider/BackgroundPhoto3.jpg);
  background-image: url(../images/BackgroundPhoto3.jpg);
  background-size: cover;
  background-position: bottom;
  display: block;
  width: 100%;
  height: 400px;
  clear: both;
}

div.logo
{
	display: none;
	position: relative;
	margin: 0px auto;
	padding:80px 0px;
	width: 800px;
	color: white;
	background: radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 70%);
	text-align: center;
	  text-shadow:
	   -1px -1px 3px #000,  
	    1px -1px 3px #000,
	    -1px 1px 3px #000,
	     1px 1px 3px #000;

}

div.logo::before {
    box-shadow: 0 0 0 300px rgba(#FFF, .75);
}

div.logo span.handwriting
{
	font-family: 'Tangerine', cursive;
}

div.logo span.serif
{
	font-family: 'Times New Roman', serif;
}

div.logo span#title { font-size: 64pt; line-height: 70px;}
div.logo span#title2 { font-size: 36pt; }
div.logo span#family { font-size: 44pt; line-height: 90px;}
div.logo span#est { font-size: 24pt; } 

div.main
{
  text-align: center;
  width: 100%;
  background-color: #FAFAFF;
  border-top: 5px solid #527190;
}

div#content
{
  margin: 20px 50px 50px;
  display: inline-block;
  max-width: 1100px;
  text-align: left;
}

div#content p
{
  margin-bottom: 10px;
  font-size: 13pt;
}
div#content_main
{
  margin-top: 20px;
  display: inline-block;
  max-width: 500px;
  min-height: 600px;
  vertical-align: top;
  text-align: left;
}

div#content_main p
{
  margin-bottom: 10px;
  font-size: 13pt;
}

div#current_funerals
{
  margin-top: 20px;
  display: inline-block;
  width: 435px;
  margin-left: auto;
  min-height: 227px;
  position: relative;
  padding: 0px 40px 20px 40px;
  font-family: sans-serif;
  color: #353db0;
  font-size: 10px;
}

div#current_funerals div.title
{
  font-size: 16pt;
  font-style: italic;
  font-family: serif;
  text-align: center;
  margin-bottom: 25px;
  padding: 5px 0px;
  border-top: thin solid #353db0;
  border-bottom: thin solid #353db0;
}

div#current_funerals h1
{
  font-size: 14px;
}

div#current_funerals hr
{
  display: none;
  border: 0 ;
  visibility: hidden;
}

div#current_funerals a
{
  text-decoration: none;
}

div#current_funerals a:hover
{
  text-decoration: underline;
}

div.funeralListDeceased { display: inline-block; } 

div.funeralListDeceased a
{
  display: inline-block;
/*  background-image: url(../images/cftransparent.png); */
  background-color: white;
  border-top: thin solid #353db0;
  border-bottom: thin solid #353db0;
  border: 1px solid #ddd;
  box-shadow: 2px 2px 10px #ddd;
  padding: 5px;
  width: 400px;
  height: 100px;
  font-size: 12pt;
  color: #353db0;
  text-align: center;
  margin: 0px 5px 10px;
}

a.deceased span { display: none;}
a.deceased > div {float: left;}
div.obit_details_container { width: 100%; vertical-align: middle;}
div.obit_details {display: none;}
div.obit_details#details_image {display: inline-block; float: left; width: 24%;}
div.obit_details.portraitstyle_oval#details_image img
{
  border-radius: 250px / 300px;
  border-radius: 50%/50%;
/*
  border-top: 1px groove black;
  border-right: 1px ridge black;
  border-bottom: 1px ridge black;
  border-left: 1px groove black;
*/
}
div.obit_details#details_image img {max-height: 100px; max-width: 120px;}
div.obit_details#details_name { display: inline-block; width: 75%; padding: 15px 0px 0px;}
div.obit_details#details_dod{ display: inline-block; font-size: 10pt; width: 75%;}
div.obit_details#details_dod:before { content: "Passed On ";}
div.obit_details#details_service_date { display: inline-block; font-size: 10pt; width: 75%;}
div.obit_details#details_service_date:before { content: "Service On ";}

div.address
{
  font-size: 12pt;
  color: #303080;
}

div#footer
{
  width: 100%;
  background-color: white;
  width: 100%;
  border-bottom: 5px solid #527190;
  text-align: center;
  padding: 10px 0px 30px;
  margin-bottom: 0px;
}

div#current_funerals div.address p a[href^="tel:"] 
{
  color: #303080;
  text-decoration: none;
  cursor: default;
}

/* Modal box Styles */

div.modal_box
{
  height: 430px;
}

input[type=checkbox] {
  display: none;
}

div.modal_box label img {
  transition: transform 0.25s ease;
  width: 420px;
  cursor: zoom-in;
  position: absolute;
  z-index: 8;
}

input[type=checkbox]:checked ~ label > img {
  transform: scale(2);
  cursor: zoom-out;
  position: absolute;
  z-index: 100;
}




@media  (max-width: 990px)
{
	div#current_funerals div.address p a[href^="tel:"] 
	{
	  font-size: 24pt;
	  display: inline-block;
	  padding: 10px 20px;
	  margin: 10px 0px;
	  text-decoration: none;
	  cursor: pointer;
  border: 1px solid;

  background-color: #ddd;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,1)), to(rgba(255,255,255,0)));
  background-image: -webkit-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0));
  background-image: -o-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0));
  background-image: linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0));
  
  -webkit-transition: background-color .2s ease-out;
  -moz-transition: background-color .2s ease-out;
  -ms-transition: background-color .2s ease-out;
  -o-transition: background-color .2s ease-out;
  transition: background-color .2s ease-out;
  background-clip: padding-box; /* Fix bleeding */
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .3), 0 2px 2px -1px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .3) inset;
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .3), 0 2px 2px -1px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .3) inset;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .3), 0 2px 2px -1px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .3) inset;
  text-shadow: 0 1px 0 rgba(255,255,255, .9);
  
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

	}
}
