div.vcard
{
	margin: 0 0 0 2px;
	background: #4c565f;
	max-width: 548px;
	padding: 28px;
	min-height: 275px;
	z-index: -1;
}

div#hcard-croydondigital
{
	background: #ccf;
	height: 370px;
}

div#infocard
{
	background: #ffffcb;
	height: 370 px;
}
div#linkscard
{
	background: #ffffcb;
	height: 600 px;
}


div#collegecard
{
	background: #faf9b9;
	height: 632px;
}

div#connexionscard
{
	background: #d0ebf7;
	height: 1030px;
}

div#termscard
{
	background: #ccf;
	height: 688px;
}

div#bridgecard
{
	background: #ffe4e1;
	height: 688px;
}

div#wizcard
{
	background: #d3e8f3;
	height: 370px;
}

div#healthcard
{
	background: #b4eeb4;
	height: 370px;
}

div#esafecard
{
	background: #f3d0f7;
	padding: 20px;
	height: 820px;
}

div#mapcard
{
	background: #fff;
	padding: 20px;
	height: 1300px;
}

div#twittercard
{
	background: #c0deed;
	padding: 20px;
	height: 720px;
}

div#frontercard
{
	background: #e8e8e8;
	padding: 20px;
	height: 372px;
	width: 380px;
}
div.photo01,div.photo02,div.photo01,div.photo03,div.photo04,div.photo05,div.photo06,div.photo07,div.photo08,div.photo09,div.photo10,div.photo11
{
	float: right;
	margin: 0 0 0 -50px;
	position: relative;
	z-index: 1;
}

div.photo01
{
	float: right;
	background: transparent url(../images/binaryup.jpg) no-repeat;
	width: 149px;
	height: 330px;
}

div.photo02
{
	float: right;
	background: transparent url(../images/connexionssnap.png) no-repeat;
	width: 149px;
	height: 330px;
}

div.photo03
{
	float: right;
	background: transparent url(../images/studup.png) no-repeat;
	width: 97px;
	height: 330px;
}

div.photo04
{
	float: right;
	background: transparent url(../images/dbcol.png) no-repeat;
	width: 136px;
	height: 330px;
}

div.photo05
{
	float: right;
	background: transparent url(../images/fruit.gif) no-repeat;
	width: 139px;
	height: 330px;
}

div.photo06
{
	float: right;
	background: transparent url(../images/colleges.gif) no-repeat;
	width: 149px;
	height: 592px;
}

div.photo07
{
	float: right;
	background: transparent url(../images/calen.png) no-repeat;
	width: 139px;
	height: 648px;
}

div.photo08
{
	float: right;
	background: transparent url(../images/teendesk.png) no-repeat;
	width: 149px;
	height: 500px;
}

div.photo09
{
	float: right;
	background: transparent url(../images/tickicon.png) no-repeat;
	width: 149px;
	height: 330px;
}
div.photo10
{
	float: right;
	background: transparent url(../images/plates.jpg) no-repeat;
	width: 149px;
	height: 330px;
}
div.photo11
{
	float: right;
	background: transparent url(../images/legotwitter.jpeg) no-repeat;
	width: 138px;
	height: 330px;
}

div.text
{
	float: left;
	position: relative;
	z-index: 2;
	width: 330px;
	color: black;
}

br.spec { clear: both; }
body > p:first-child { text-shadow: 1px 2px 1px #000; }

div.vcard
{
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}

div.vcard h1
{
	color: #4c565f;
	background: transparent;
	font: 400 290%/110% "Century Gothic",helvetica,sans-serif;
	padding: 0 0 24px 0;
}

h2
{
	font-size: 160%;
	background: #bbc4c9;
}

p, div.text p, div.vcard p
{
	font-size:140%;
	line-height: 100%;
	color: #fff;
}

div.text p
{
	color: #000;
	margin: 0 auto;
	max-width: 600px;
	text-align: left;
}

h1 { padding: 0 0 7px 0; }

div.vcard a
{
	color: black;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-transition-property: color,background;
	-webkit-transition-duration: .2s;
	-webkit-transition-timing-function: ease-in;
	font-family: "Century Gothic",helvetica,sans-serif;
	text-decoration: none;
}

div.vcard a:link,div.vevent a:link
{
	color: black;
	text-decoration: none;
	margin: -2px -4px;
	padding: 2px 4px;
}

div.vcard a:visited,div.vevent a:visited
{
	color: black;
	background: transparent;
	border: none;
}

div.vcard  a:hover,div.vevent a:hover
{
	-webkit-transition-timing-function: ease-out;
	border-bottom: 2px solid #4c565f;
	background: rgba(0,0,0,.15);
}

div.vcard a:active,.vevent a:active
{
	color: mauve;
	background: transparent;
}

div.vcard .tel
{
	font: 400 170%/110% helvetica,sans-serif;
	color: #1f1b13;
	background: transparent;
}

div.vcard a, .text p,div.text a
{
	font: 400 108%/115% helvetica,'lucida sans',sans-serif;
	color: black;
}

h3,.summary a
{
	color: black !important;
	font: 700 18px/22px "century gothic", helvetica,geneva,sans-serif;
}

div.credits
{
	padding: 0 0 0 26px;
	margin: 0;
}

.credits p,.credits a:hover,.credits a:visited
{
	font-size: 92%;
	color: #fff !important;
	text-align: left;
}

.vcard .bqstart,.vcard .bqend
{
	padding-top: 45px;
	font-size: 700%;
	font-family: georgia,times,'times new roman',serif;
	color: #f00;
	margin-top: 0;
}

blockquote
{
	font: 600 112%/118% helvetica,geneva,sans-serif;
	color: blue !important;
}

#bridgecard blockquote
{
	font: 600 114%/120% monaco,sans-serif;
	color: blue;
	text-indent: 3em;
}

.attribution
{
	text-align: right;
	font-size: small;
	color: grey;
}

div.vcard .bqstart
{
	float: left;
	height: 42px;
	margin-bottom: -44px;
	padding-right: 4px;
}

div.vcard .bqend
{
	float: right;
	height: 25px;
	margin-top: 3px;
}

ul,ul ul,ul li,ul ul li
{
	list-style-type: circle inside;
	color: #60f;
	font: 500 108%/116% "Century Gothic",helvetica,sans-serif;
}

li{padding-top: .4em;

div#hcard-croydondigital ul.adr li
{
	list-style-type: none;
	font: 500 138%/140% "Century Gothic",helvetica,sans-serif;
}

div#esafecard ul
{
	list-style: circle inside;
	color: #60f;
	font: 500 128%/133% "Century Gothic",helvetica,sans-serif;
}

img { background: transparent; }