﻿@charset "UTF-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,700,400italic,700italic);


video {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


audio {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


mark {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


time {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


summary {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


section {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


nav {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


menu {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


hgroup {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


header {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


footer {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


figure {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


figcaption {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


details {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


canvas {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


aside {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


article {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


td {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


th {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


tr {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


thead {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


tfoot {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


tbody {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


caption {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


table {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


legend {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


label {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


form {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


fieldset {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


dd {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


dt {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


dl {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


li {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


i {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


b {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


var {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


sup {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


sub {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


strong {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


small {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


samp {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


q {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


kbd {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


ins {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


img {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


em {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


dfn {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


del {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


code {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


cite {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


address {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


abbr {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


pre {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


blockquote {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


p {
    margin:0;
    padding:0;
    font-size:100%;
}


h6 {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


h5 {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


h4 {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


h3 {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


h2 {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


h1 {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


iframe {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


object {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


span {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


div {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


body {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}


html {
    margin:0;
    padding:0;
    font-size:100%;
    
    
}

/* end reset */




/*sets box sizing to be intuitive. to remove for an element desized to compensate add box-sizing: content-box; to the class or id*/

html {

  box-sizing: border-box;

}

*:after {

  box-sizing: inherit;

}

*:before {

  box-sizing: inherit;

}

* {

  box-sizing: inherit;
  /*font-family: 'Open Sans', sans-serif;*/

}

/* general styles */

body { 
	background-color:#000000; 
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,4d4d4d+15,4d4d4d+50,4d4d4d+85,000000+100 */

background: #000000; /* Old browsers */




	
	font-family: 'Roboto', sans-serif;
	}

table { 
	border:none;
	
	border-collapse: collapse;
	border-spacing: 0;

	}

p { 
	margin-bottom: 15px; /* space after paragraph */ 
	}

ul { 
	margin-left:20px;
	}
	
li { 
	margin-bottom: 10px; /* space between list items */
	text-align:left;
	 }
 
ol { 
	margin-left:20px; 
	}


h1 { margin-bottom: 10px; color: #a40003;  font-size: 28px; text-align:left; text-shadow:1px 1px 0px #000; letter-spacing:normal;}
h2 { margin-bottom: 10px; color: #a40003;  font-size: 16pt; font-weight: bold; line-height:130%;font-style:italic;}
h3 { margin-bottom: 10px; color: #dd4132;  font-size: 20pt; font-weight: normal;}
h4 { margin: 10px;        color: #fce181 !important;  font-size: 28pt !important; font-weight: normal; font-variant:normal !important;}
h5 { margin-bottom: 10px; color: #4071be;  font-size: 14pt; font-weight: bold;}

/* links */

a {background-color: transparent; text-decoration: underline}


a:hover { text-decoration: none;}  /* mouse over link */

p a {color:#000000;}

.buttoncontent {
	font-style:normal;
	-moz-box-shadow: 0px 1px 3px 0px #000000;
	-webkit-box-shadow: 0px 1px 3px 0px #000000;
	box-shadow: 0px 1px 3px 0px #000000;
	
	background: #37b34a; /* Old browsers */


	background-color:#37b34a;
	-webkit-border-top-left-radius:5px;
	-moz-border-radius-topleft:5px;
	border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topright:5px;
	border-top-right-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomright:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	-moz-border-radius-bottomleft:5px;
	border-bottom-left-radius:5px;
	text-indent:0;
	
	display:inline-block;
	color:#ffffff !important;
	
	
	
	font-weight:bold;
	font-style:normal;
	/*height:22px;
	line-height:22px;*/
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
	padding-bottom:5px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #000000;
	margin-bottom:10px;
	margin-right:10px;
}
.buttoncontent:hover {
	
 background: #000000; /* Old browsers */
	background-color:#000000;
	
	
	
	
}

#contentwrapper {width:90%;display:table;margin:0px auto;border-spacing: 20px;
    border-collapse: separate;}
	@media screen and (max-width: 870px) { #contentwrapper {width:95%;}}
.contentrow {display:table-row;}
.contentbox {display:table-cell;width:32%;vertical-align:top;background-color:#000000;background:#000000;}
@media screen and (max-width: 870px) { .contentbox {display:block;width:100%;}}
.contentbg {background:transparent;background-color:transparent;}


.homelinks {background:#000000;background-color:#000000;text-align:center;padding:20px;width:100%;height:100%;}
.homelinks a {color:#e0c980;font-size:24px;text-decoration:underline;margin-bottom:10px;font-weight:bold;display:block;}

.hometext {background:#000000;background-color:#000000;text-align:center;padding:20px;width:100%;height:100%;font-size:15px;color:#ffffff; }

.homemap {background:#000000;background-color:#000000;text-align:center;padding:20px;width:100%;height:100%;font-size:22px;color:#ffffff; }
.homemap a {color:#e0c980;font-size:24px;text-decoration:underline;margin-bottom:10px;font-weight:bold;display:block;}

.center {
    margin: auto;
    width: 90%;
    border: 0px solid #73AD21;
    padding: 20px;
}

@media screen and (max-width: 870px) { .homemap {margin-top:20px;}}

.homebutton {
	
	
	
	background: #a40003; /* Old browsers */


	background-color:#a40003;
	
	text-indent:0;
	
	display:inline-block;
	color:#ffffff !important;
	border:1px solid #e0c980;
	
	
	font-weight:bold;
	font-style:normal;
	/*height:22px;
	line-height:22px;*/
	padding-left:10px;
	padding-right:10px;
	padding-top:40px;
	padding-bottom:40px;
	text-decoration:none;
	text-align:center;
	text-transform:uppercase;
	font-size:30px;
	margin-top:20px;
	
	
	width:100%;

}

.homebutton:hover {background-color:#ba0004;background:#ba0004; }

#top {width:100%;background-image:url(../images/apebg.jpg);background-repeat:no-repeat;background-size:cover;}
#top td {padding:40px;text-align:center;}



#socialicons {/*clear:both;*/width:auto;float:right;}
#socialicons td {padding:10px;}
#socialicons td img {margin-left:5px;}




#portal {display:inline-block;float:left;margin-right:20px;margin-bottom:20px;-moz-box-shadow: 2px 2px 4px #000000;

-webkit-box-shadow: 2px 2px 4px #000000;

box-shadow: 2px 2px 4px #000000;}
#portal img {display:block;}

.caption {background-color:#000000;color:#ffffff;font-weight:bold; font-size:14px;padding:5px;text-transform:uppercase;letter-spacing:110%;}
.caption a {color:#ffffff;text-decoration:none;}
.caption a:hover {color:#ffffff;text-decoration:underline;}

.imageshadow {-moz-box-shadow: 3px 3px 4px #949494;

-webkit-box-shadow: 3px 3px 4px #949494;

box-shadow: 3px 3px 4px #949494;}

#header {background:#a40003;background-color:#a40003;width:100%;margin:0px auto;color:#ffffff;}
#header td {padding:5px;}

.headerright {float:right;width:33%;text-align:right;margin-top:0px;}
@media screen and (max-width: 950px) { .headerright {display:none;}}
.headerleft {float:left;width:33%;margin-top:0px;text-align:left;}
@media screen and (max-width: 950px) { .headerleft {float:none;width:100%;text-align:center;}}

.apelogo {margin:0px auto;margin-bottom:-100px;z-index:9999;margin-right:40px; margin-left:40px;  z-index: 1000;}
@media screen and (max-width: 950px) { .apelogo {margin-right:0px;  z-index: 1000;}}


#menunav {width:100%;background:#000000;background-color:#000000;color:#ffffff; z-index: 1000;}
#menunav td {color:#ffffff;font-size:16px;text-align:center;/*letter-spacing:200%;*/text-transform:; z-index: 1000;}
@media screen and (max-width: 1090px) {#menunav td {text-align:left;}}


#interiortitle {float:right;display:inline-block;position:relative;bottom:0px;margin-top:0px;}
#interiortitle td {color:#ffffff;font-weight:300;font-size:30px;text-align:right;text-shadow:2px 2px 0px #000000;letter-spacing:normal;padding-right:10px;padding-left:20px;}

@media screen and (max-width: 1460px) { #maintitle {width:40%;} #maintitle td {font-size:60px;}}
@media screen and (max-width: 980px) { #maintitle {width:100%;margin-top:60px;} #maintitle td {font-size:50px;}}


#logo {width:50%;float:left;}

.logo {width:100%;max-width:780px;display:block;}

#subhead  { background-color:#a40003;background:#a40003;width:100%;}
#subhead td { color:#ffffff;font-size:21px;text-shadow: 1px 1px 0px rgba(0, 0, 0, 1);padding:10px;text-align:center;}

#subheaderinterior  { background-color:#555555;padding-bottom:10px;padding-top:10px;border-top:1px solid #585858;border-left: 1px solid #000000;
	border-right: 1px solid #000000;}
#subheaderinterior td { color:#ffffff;font-weight:bold;font-size:24px;text-shadow: 1px 1px 0px rgba(0, 0, 0, 1);padding:20px;}



@media screen and (max-width: 980px) { #subheader td {padding-left:20px;} }
#subheadercontent td {text-align:center;}

#portals {width:96%;margin:0px auto; background-color:#ffffff;background:#ffffff;padding-top:20px;padding-bottom:20px;border-left: 1px solid #000000;
	border-right: 1px solid #000000;}
#portals td {padding-top:30px;}
#portalscontent {text-align:center;}
#portalscontent img {margin:20px;}

#subheadertwo  { background-color:#b766a3;padding-bottom:20px;padding-top:20px;background-image:url(file:///Macintosh%20HD/Users/juliet/BusyBrain/Disney-VillaRentals/florida-villa-responsive/images-layout/subheadbg.png);background-repeat:no-repeat;background-size:cover;}
#subheadertwocontent td { color:#ffffff;font-weight:normal;font-size:36px !important;text-shadow: 1px 1px 0px rgba(0, 0, 0, 1);font-variant:small-caps;font-family:Garamond, Georgia, Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif !important;line-height:75%;}
#subheadertwocontent td {text-align:center;}


#menu {border-left:none;border-right:none;padding:10px;display:inline-block;
}

@media screen and (max-width: 1000px) { #menu {width:100%;padding:1px;} #headermenu {background-position: left 35px;background-size:50%;} #headercontent {font-size:16px !important;right:40px;display:inline-block;} #headercontent a {font-size:16px !important;}}

@media screen and (max-width: 449px) { #headercontent {display:none;} #headermenu {background-size:50%;background-position:left 15px}}


#menucontent {display:table-cell;vertical-align:bottom;width:50%;float:right;}


#mainimagehome {-webkit-box-shadow: inset 0px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: inset 0px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow: inset 0px 2px 3px 0px rgba(0,0,0,0.2);height:300px;}
@media screen and (min-width: 1150px) { #mainimagehome {height:500px;}}
@media screen and (min-width: 1700px) { #mainimagehome {height:600px;}}

#mainimage {-webkit-box-shadow: inset 0px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: inset 0px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow: inset 0px 2px 3px 0px rgba(0,0,0,0.2);height:0px;}
@media screen and (min-width: 1150px) { #mainimage {height:0px;}}
@media screen and (min-width: 1700px) { #mainimage {height:0px;}}

#content {width:100%;margin:0px auto; background-color:#fff;background:#fff;
}

#content td {padding:40px;}
#content td p {color:#000000;}
#content td a {color:#a40003;}

#contentarea {padding:40px;background-color:#ffffff;
	text-align: left;
}

.connect {border:1px solid #C0C0C0;width:270px;float:right;margin:30px;margin-top:10px;}
@media screen and (max-width: 639px) { .connect {float:none;margin:0px auto;margin-top:20px;margin-bottom:40px;}}
	
#contenthome {text-align:center;font-size:26px;padding:40px;}

#main {padding:20px;background-color:#ffffff;border-top:4px solid #FFCBA6;}
#maincontent {color:#ffffff;}
#maincontent a {color:#ffffff;}
#maincontent a:hover {color:#ffffff;}
#maincontent p {text-align:left; font-size:16px;}
#maincontent ul {font-size:16px;}

.portalarea {display:table;width:100%;}
.portal {display:table-cell;width:16%;text-align:center;}
@media screen and (max-width: 599px) {.portalarea {display:block;} .portal {display:inline-block;width:32%;margin-bottom:30px;}}

#description {padding:20px;background-color:#ffffff;}
#descriptioncontent td {color:#000000;text-align:center;font-size:14px;}

#testimonials {background-color:#9777a7;padding:40px;}
#testimonialscontent {color:#ffffff;}
#testimonialscontent td {font-family:Garamond, Georgia, Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif !important;font-variant:small-caps;font-size:21pt;text-align:center;}

#bottom {width:100%;background:#ffffff;background-color:#ffffff;color:#000000;}
#bottom td {}
#bottomcontent {width:85%;margin:0px auto;margin-top:40px;}
.bottomcol { -webkit-columns: 100px 7; /* Chrome, Safari, Opera */
    -moz-columns: 100px 7; /* Firefox */
    columns: 100px 7;}

#footer {width:100%;margin:0px auto; background-color:#000000;background:#000000;}
#footer td {color:#ffffff;font-size:13px;padding:20px;}
#footer a {color:#ffffff;}
#footer a:hover {color:#ffffff;}
#footercontent {width:85%;text-align:right;margin:0px auto;}




/*mobile menu*/


#nav-wrap {
	margin-top: 0px;
}

/* menu icon */
#menu-icon {
	display: none; /* hide menu icon initially */
}






@media screen and (max-width: 1090px) {

	/* nav-wrap */
	#nav-wrap {
		position: relative;
	}

	/* menu icon */
	#menu-icon {
		color: #ffffff;
		width: 100%;
		
		height: 40px;
		background: transparent url(../images/menu-icon.png) no-repeat 10px center;
		padding: 8px 10px 0 42px;
		cursor: pointer;
		border: none;
		display: block; /* show menu icon */
		font-size:16px;
		text-align:left;
	}
	#menu-icon:hover {
		background-color: #ffffff;background-color:rgba(255, 255, 255, 0.5);
	}
	#menu-icon.active {
		background-color: transparent;
	}
	
	/* main nav */
	#nav {
		clear: both;
		position: absolute;
		top: 38px;
		width: 300px;
		z-index: 10000;
		padding: 5px;
		background: #000000;
		border: solid 1px #999;
		display: none; /* visibility will be toggled with jquery */
	}
	#nav li {
		clear: both;
		float: none;
		margin: 5px 0 5px 10px;
	}
	#nav ul a {
		font: inherit;
		background: none;
		display: inline;
		padding: 0;
		color: #ffffff;
		border: none;
		
	}
	#nav a {
		font: inherit;
		background: none;
		display: inline;
		padding: 0;
		color: #ffffff;
		border: none;
		
	}
	#nav ul a:hover {
		background: none;
		color: #ffffff;
		text-decoration:underline;
	}
	
	#nav a:hover {
		background: none;
		color: #ffffff;
		text-decoration:underline;
	}
	
	/* dropdown */
	#nav ul {
		width: auto;
		position: static;
		display: block;
		border: none;
		background: inherit;
	}
	#nav ul li {
		margin: 3px 0 3px 15px;
	}
	
	ul.dropdown ul { visibility:visible !important;}
	ul.dropdown li {padding:0px !important;}
	li.empty  {color:#CAC5C5 !important;margin:0px !important;}
}

@media screen and (min-width: 1090px) {

	/* ensure #nav is visible on desktop version */
	#nav {
		display: block !important;
	}

}


.col-2 {
	-moz-column-count:2;
	-moz-column-gap:4em;
	
	-webkit-column-count:2;
	-webkit-column-gap:4em;
	
	column-count: 2;
	column-gap: 4em;
	
	-webkit-column-width: 320px;
     -moz-column-width: 320px;
          column-width: 320px;
		  
		  
		  -webkit-column-rule: 1px dotted #ddd;
     -moz-column-rule: 1px dotted #ddd;
          column-rule: 1px dotted #ddd;
		 
}

@media screen and (max-width: 1280px) {
	.col-2 {
		-moz-column-count:1;
	-webkit-column-count:1;
	column-count: 1;
	
	}

}

.col-3 {
	-moz-column-count:3;
	-moz-column-gap:1em;
	
	-webkit-column-count:3;
	-webkit-column-gap:1em;
	
	column-count: 3;
	column-gap: 1em;
	
	-webkit-column-width: 200px;
     -moz-column-width: 200px;
          column-width: 200px;
		 
}

@media screen and (max-width: 1280px) {
	.col-3 {
		-moz-column-count:1;
	-webkit-column-count:1;
	column-count: 1;
	
	}

}

table.info {border:1px solid #000000;}
table.info td {padding:5px;border:1px solid #000000; text-align:center; vertical-align:middle;}
table.info th {padding:5px;border:1px solid #000000; text-align:center; vertical-align:middle;}
table.info tbody tr:nth-child(odd) { /* option for zebra stripes, does not work in earlier versions of ie */
   background-color: #dadada;
}

@media screen and (max-width: 600px) {
	table.info td,th {
		font-size:11px;
	
	}

}


.left {float:right;margin-left:10px;margin-bottom:10px;}

.tablecolumn {float:left; width:50%; min-width:200px; }
.tablecolumn td {padding-right:40px; }

@media screen and (max-width: 800px) { .tablecolumn {width:100%;float:none;} .tablecolumn td {padding-right:0px;}}

img.resize{
    width:100%; /* you can use % */
    height: auto;
}
img.img1{
    width:30%; /* you can use % */
    max-width:400px;
    min-width:150px;
    height: auto;
}
img.img2{
    width:96%;  /* you can use % */
    max-width:1024px;
    min-width:150px;
    height: auto;
    padding-left: 10px;
}
img.img3{
    width:33%; /* you can use % */
    max-width:200px;
    min-width:100px;
    height: auto;
    padding-left:10px;
}

span.dir { color:#ffffff;display: block;
padding: 7px 12px; }

.sidebar {width:100%;background-color:#ffffff;-webkit-column-break-inside: avoid;
	break-inside: avoid;}
.sidebar td {padding:20px;text-align:center;}
.sidebar p {font-weight:bold;} 
.sidebar h5 {color:#000000;font-size:24px;font-weight:300;text-align:center;}

.productimages td {width:33%;}
.productimages td p {font-size:11px;}
.productimages td img {width:90%; max-width:150px;}

.productimagestwo td {width:50%;}
.productimagestwo td p {font-size:11px;}
.productimagestwo td img {width:90%; max-width:300px;}

.productimagesfour {width:100%;}
.productimagesfour td {width:25%;}
.productimagesfour td p {font-size:12px;}
.productimagesfour td a {font-size:12px;}
.productimagesfour td img {width:90%; max-width:300px;}




  .blues2                {width: 235px; height:195px; margin: 4px; text-align: center; float: left; display:block; background-color: transparent; background-image: url('images/blues2-gray.png');} 
  .blues2:hover          {background-color: transparent; text-align: center; background-image: url('images/blues2-color.jpg');}
  .facebookhome          {width: 235px; height:195px; margin: 4px; text-align: center; float: left; display:block; background-color: transparent; background-image: url('images/facebook-gray.png');} 
  .facebookhome:hover    {background-color: transparent; text-align: center; background-image: url('images/facebook-red.png');}
  .redcarpet             {width: 235px; height:195px; margin: 4px; text-align: center; float: left; display:block; background-color: transparent; background-image: url('images/redcarpet-gray.png');} 
  .redcarpet:hover       {background-color: transparent; text-align: center; background-image: url('images/redcarpet-color.jpg');}
  .dstrkt                {width: 235px; height:195px; margin: 4px; text-align: center; float: left; display:block; background-color: transparent; background-image: url('images/dstrkt-gray.png');} 
  .dstrkt:hover          {background-color: transparent; text-align: center; background-image: url('images/dstrkt-color.png');}


