@charset "utf-8";
/* CSS Document */

/** Theme Colors:
 #252525 - color-dark
 #00529b - color-blue (site-wide, residential buttons)
 #6c933a - color-green (online billpay, contractor buttons)
 #7a0026 - color-red (commercial buttons)
 #32004b - color-purple (materials buttons)
 #c2d6e7 - light blue (hr, alternate content background)
**/

@import url(https://fonts.googleapis.com/css?family=Fjalla+One|Questrial);

/*********** reset ***********/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;font-weight: inherit;font-style: inherit;font-size: 100%;vertical-align: baseline;}:focus {outline: 0;}body {line-height: 1;color: black;background: white;}ol, ul {list-style: none;}table {border-collapse: separate;border-spacing: 0;}caption, th, td {text-align: left;font-weight: normal;}blockquote:before, blockquote:after,q:before, q:after {content: "";}blockquote, q {quotes: "" "";}

* {position:relative;}
img {max-width:100%; height:auto;}

/*********** Global ***********/

/*********** float and clear ***********/
.float-left {float:left;}
.float-right {float:right;}
.clear {clear:both}
.clear-right {clear:right}
.clear-left {clear:left}

.clearfix:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
	.clearfix {display:block;}
/* End hide from IE Mac */

/*********** Typography ***********/

strong {font-weight: bold;}
em {font-style: italic}
.small-text {font-size: .8em;}
.align-left {text-align:left;}
.align-right {text-align:right;}
.align-center {text-align:center;}
.valign-top { vertical-align:top; }
.valign-bottom { vertical-align:bottom; }
.valign-middle { vertical-align: middle; }

.highlight {color: #444;}

h1, h2, h3, h4, h5, h6 {line-height:1em; margin-bottom:.5em;color: #00529b; font-weight:bold;font-family: 'Fjalla One', sans-serif !important;}
h1 {font-size: 2.2em;}
h2 {font-size: 1.9em;}
h3 {font-size: 1.6em;}
h4 {font-size: 1.33em; }
h5 {font-size: 1.167em;}
h6 {font-size: 1em;}

p, ul, ol, dl, blockquote, table, form, .stacked {margin-bottom: 1.5em;}

.unstacked {margin-bottom: 0;}

ul, ol {padding-left: 25px;}

ul {list-style: disc;}
ol {list-style: decimal;}

dt {font-weight:bold}
dd {padding-left: 1.5em;}

dl.treatment dd {margin-left: 190px;margin-bottom: 30px;min-height:50px;height:auto !important;height:50px;}
dl.treatment dt {clear:left;float:left;width: 178px;}

hr {border: none;border-top: 1px solid #c2d6e7;margin: 1em 0;}

blockquote {margin:1em; }
cite {font-size:.75em;}
address {margin: 1.5em;}
center {clear:both;}

.font-fjalla {font-family: 'Fjalla One', sans-serif !important;}
.font-questrial {font-family: 'Questrial', sans-serif !important;}
.color-blue {color:#00529b;}
.color-green {color:#6c933a;}
.color-red  {color:#7a0026;}
.color-purple {color:#32004b;}


/*********** body/content ***********/

body {text-align:left; background: #fff; font: 1em/1.5em 'Questrial', sans-serif; color: #000; min-width:1200px;}
	body#tinymce {background: white;}

#admin-bar {background-color: #000; padding: 10px; color: #fff;}
#admin-bar .actions {padding:0; margin:0;}
#admin-bar .actions li {display:inline-block;}
#admin-bar .actions a {color:#fff;}

#site-search {background: #5d5d5d; text-align:right; padding:10px 0; margin:0}
	#site-search input {background:#999; color:white;border: none;width: 200px;padding:.5em}
	#site-search input[type="submit"] {width:75px;}

#header-wrapper { border-top: 40px solid #252525;
	/* Animate sticky header */
    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s;
	
	padding-top:10px;
	padding-bottom:10px;
}
	#header {min-height:200px;}
		#header #branding {width: 664px; max-width:100%; min-height:138px; text-indent:-9999px;display:block; background: url(../images/bg/logo.jpg) no-repeat center center; background-size:contain;
		/* Animate with sticky header */
		-webkit-transition: all 0.3s;
   		-moz-transition: all 0.3s;
    	-ms-transition: all 0.3s;
    	-o-transition: all 0.3s;
    	transition: all 0.3s;
		}
		
	/* sticky header */
	#header-wrapper.sticky-header { position: fixed; top:0; height:84px !important; width:100% !important; z-index:999; }
	#header-wrapper.sticky-header #header {height:84px !important; margin:0 auto !important; }
	#header-wrapper.sticky-header #header #branding { background: url(../images/bg/logo-sm.jpg) no-repeat center center; width:208px; height:35px; }
	#header-wrapper.sticky-header #header #admin-area,
	#header-wrapper.sticky-header #header #profile,
	#header-wrapper.sticky-header #header .btn-edit-page,
	#header-wrapper.sticky-header #site-search { display:none; }

#header .location {font-size:26px; margin-bottom:0; top: -20px; left: 60px;}
#header .hours {margin-bottom:0;}

#wrapper {min-height: 600px;}

#content{}
	article {float: left; width:60%;}
	aside {float: right; width:30%;}

#nav-wrapper {background-color: #252525;z-index:1000; border-top:10px solid #00529b;}
.navigation ul {margin:0; padding:0; text-align:center;}
.navigation ul li {display:inline-block; vertical-align:middle;}
.navigation ul li a {color:#fff; font-family: 'Fjalla One', sans-serif; text-decoration:none; text-transform:uppercase; display:block; padding: 10px 20px; font-size: 120%; background-color: #252525;}
.navigation ul .selected a:after {content:''; position:absolute; width:100%; height: 5px; left:0; bottom:0;background-color: #00529b;}
.navigation ul li a:hover {background-color:#00529b;}
.navigation a:visited {color:#fff;}

.navigation .tier2 {display:none;position:absolute; left:0; top:100%; width:200%; background-color: #252525;}
#footer-wrapper .tier2 {top:auto; bottom:100%;}
.navigation ul li:hover .tier2 {display:block;}
.navigation ul li:hover {background-color: #00529b;}
.navigation .tier2 li {display:block; text-align:left;}
.navigation .tier2 li a {text-transform: none;}
.navigation .tier3 li a {padding-left:40px;}
.navigation .tier3 li a:before {content: '\0203A';}
.navigation .tier4 li a {padding-left:60px;}

#footer-wrapper { background-color:#252525; border-top:10px solid #00529b;}
#footer {color: #fff;}

/********** Links **********/

a {color: #00529b;
  /* Animate color fade */
  -o-transition:color .3s ease-out;
  -ms-transition:color .3s ease-out;
  -moz-transition:color .3s ease-out;
  -webkit-transition:color .3s ease-out;
  /* ...and now override with proper CSS property */
  transition:color .3s ease-out;
}
a:visited {color: #000;}
a:hover {text-decoration: none;}
a:active {color: #000;}

.btn {display:inline-block; background-color: #00529b; font-family: 'Fjalla One', sans-serif; text-transform: uppercase; border-radius: 5px; color:#fff; text-decoration:none; padding: 5px 30px 5px 10px; transition:background-color .3s ease-out; font-size:20px; line-height:135%; text-align:left; margin-right:10px; margin-bottom: 10px;}
.btn:after {content:'\0203A'; font-size: 40px; position:absolute; display:block; top: 50%; right:5px; line-height:40px; height:40px; margin-top:-20px;}
.btn strong {font-size:40px; line-height:135%; display:block;}
.btn:visited {color:#fff;}
.btn:hover,.btn:focus,.btn:active {color:#fff; background-color: #252525;}

.btn-edit-page { position:absolute; display:block; width:23px; height:23px; background:url(../../../assets/images/icons/pencil.png) no-repeat center top; padding-top:23px; font-size:0.8em;}
a.btn-edit-page { color:#fff;}

/************* Page Elements ****************/

#landscape {background-image: url('../images/bg/landscape.jpg'); width: 1900px; margin-left:auto; margin-right:auto;height: 378px; background-repeat:no-repeat; background-position: top; border-bottom: 5px solid #252525; max-width:100%;}

.interior-links .btn {width:280px;}

.section {padding-top: 20px; padding-bottom: 20px;}
.section.bg-lt-blue {background-color:#c2d6e7;}

.bg-color-blue {background-color:#00529b;}
.bg-color-green {background-color:#6c933a;}
.bg-color-red  {background-color:#7a0026;}
.bg-color-purple {background-color:#32004b;}

img.treatment {margin-bottom:20px; border-radius: 5px; 
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);}
div.treatment {background:#fff; padding: 20px; box-sizing:border-box;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);}
ul.treatment {padding:0;}
ul.treatment li {list-style:none; font-size:150%; line-height:100%; margin-bottom:30px; padding-left: 50px; min-height: 40px;}
ul.treatment li:before {content:''; display:block; position:absolute; top:-10px; left:0; background-image: url('../images/bg/ul-treatment.jpg'); background-repeat:no-repeat; width: 35px; height:37px;}
ul.clean {list-style:none; margin:0; padding:0;}
ul.underline li {border-bottom: 1px solid #c2d6e7; padding-top: 10px; padding-bottom:10px;}
ul.underline li:last-child {border-bottom:none;}

img.float-right {margin-left: 1em;}
img.float-left {margin-right: 1em;}

.expanded { width:100%; }

table.treatment {border-top: solid 1px #ddd; border-left: solid 1px #ddd; width: 100%; background-color:#fff;}
table.treatment td, table.treatment th {border-bottom: solid 1px #ddd; border-right: solid 1px #ddd; padding:6px;}
table.treatment th {color: #000; background-color:#eee; text-align: center;}

.fade {list-style: none; margin: 0; padding:0;}

#captchaimg {border: solid 1px black;}

.phone {margin-bottom:0; font-family: 'Fjalla One', sans-serif; font-size: 50px; line-height:150%;}
.phone a {text-decoration:none;}

.lead {font-size: 125%; line-height:150%;}

/* Notifications */

a.alert.show {
  visibility:hidden;
  z-index:10000;
  -webkit-border-radius:0 0 5px 5px;
  -moz-border-radius:0 0 5px 5px;
  -ms-border-radius:0 0 5px 5px;
  -o-border-radius:0 0 5px 5px;
  border-radius:0 0 5px 5px;
  position:absolute;
  top:0;
  left:5px;
  display:inline-block;
  padding:5px 10px;
  
  text-align:center;
  font-weight:bold;
  color:#fff;
  text-decoration:none;
  background:#a90329;
  background:-moz-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,#a90329),color-stop(44%,#8f0222),color-stop(100%,#6d0019));
  background:-webkit-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:-o-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:-ms-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:radial-gradient(ellipse at center,#a90329 0%,#8f0222 44%,#6d0019 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#a90329',endColorstr='#6d0019',GradientType=1);
  border:solid .5px #333;
}

#notification-wrapper {
  display:none;
  position:relative;
  background:#a90329;
  background:-moz-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,#a90329),color-stop(44%,#8f0222),color-stop(100%,#6d0019));
  background:-webkit-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:-o-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:-ms-radial-gradient(center,ellipse cover,#a90329 0%,#8f0222 44%,#6d0019 100%);
  background:radial-gradient(ellipse at center,#a90329 0%,#8f0222 44%,#6d0019 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#a90329',endColorstr='#6d0019',GradientType=1);
}
#notification-wrapper #notifications {
  position:relative;
  
  margin:0 auto;
  padding:15px 0 95px 0;
}
#notification-wrapper #notifications .notification {
  color:#fff;
  padding:6px 0 10px 0;
  text-align:center;
}
#notification-wrapper #notifications a.hide {
  -webkit-border-radius:5px 5px 0 0;
  -moz-border-radius:5px 5px 0 0;
  -ms-border-radius:5px 5px 0 0;
  -o-border-radius:5px 5px 0 0;
  border-radius:5px 5px 0 0;
  position:absolute;
  bottom:0;
  display:inline-block;
  padding:40px 20px 10px 20px;
  width:160px;
  left:50%;
  margin-left:-80px;
  text-align:center;
  font-weight:bold;
  color:#fff;
  text-decoration:none;
  background:#000000;
  background:-moz-linear-gradient(top,#000000 0%,#333333 100%);
  background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#000000),color-stop(100%,#333333));
  background:-webkit-linear-gradient(top,#000000 0%,#333333 100%);
  background:-o-linear-gradient(top,#000000 0%,#333333 100%);
  background:-ms-linear-gradient(top,#000000 0%,#333333 100%);
  background:linear-gradient(to bottom,#000000 0%,#333333 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000',endColorstr='#333333',GradientType=0);
  border:solid .5px #333;
}
#notification-wrapper #notifications a.hide:before {
  content:"";
  display:block;
  position:absolute;
  top:5px;
  left: 50%;
  margin-left: -37.5px;
  width:0px;
  height:0px;

  border-width:0 37.5px 25px 37.5px;
  border-color:transparent transparent #ffffff transparent;
  -webkit-transform:rotate(360deg);
  transform:rorate(360deg);
  border-style:inset;
}

.notification a, .notification a:link, .notification a:visited {
	color:#fff;
}

.notification a:hover {
	text-decoration:none;
}

/************* CMS ****************/

.warning {font-size:0.8em;line-height: 25px;border: 1px solid #FF9900;font-weight: bold;padding-left: 26px;background: url(../../../assets/images/cms/yellow-warning.png) no-repeat 5px center #FEEDED;min-height: 25px;margin: .5em 0;}
input.error, textarea.error {border: 1px solid #FF0000;}
div.error {font-size:0.8em;line-height: 25px;color: #FF0000;border: 1px solid #FF0000;font-weight: bold;padding-left: 26px;background: url(../../../assets/images/cms/yellow-warning.png) no-repeat 5px center #FEEDED;min-height: 25px;margin: .5em 0;}
label.error {font-size:1em;line-height: 25px;color: #FF0000;font-weight: normal;padding-left: 26px;background: url(../../../assets/images/cms/yellow-warning.png) no-repeat 5px center #FEEDED;margin: .5em 0; display:block;border: 1px solid #FF0000;font-size: .9em;}
.required { color:#FF0000; font-weight: bold; padding-left: 26px; background: url(../../../assets/images/cms/yellow-warning.png) no-repeat 5px center #FEEDED;}
.success {font-size: 1.2em;line-height: 50px;color: #009900;border: 1px solid #33CC33;font-weight: bold;background: url(../../../assets/images/cms/checkmark.png) no-repeat 5px center #F0FFF0;padding-left: 50px;min-height: 50px;margin-bottom:2em;}
.loading {background: url(../images/cms/loading.html) no-repeat right center;padding-right: 20px;}
.breadcrumb {border: solid 1px #ccc; background-color:#efefef; padding:2 10px; margin-bottom:2em; box-shadow: 0px 4px 4px -4px #333;}
#stats {text-align:center; font-size:.8em; font-style:italic;}

/************* Forms ****************/

form dl dd {margin-left: 150px;padding:0 0 2em 0;width: 240px;}
form dl dt {clear:left;float:left;width: 140px; text-align:right;}

input, textarea {color: #777; padding:.25em; background-color: #fff; border: solid 1px #ddd;}
input[type="submit"], input[type="button"] {cursor:pointer; width:auto; padding: .4em; box-shadow: 0px 2px 2px #ccc;}
input[type="submit"].noshadow, input[type="button"].noshadow {cursor:pointer; width:auto; padding: .4em; box-shadow: none;}
input:focus, textarea:focus, input[type="submit"]:hover, input[type="button"]:hover {border: solid 1px #000; box-shadow: 0px 0px 0px #999;}
input.required, select.required, textarea.required {color: #000; font-style: normal; font-weight: normal; background:none; padding-left:3px;}

label span {color: red;}
label {font-weight: bold;}
fieldset {border: 1px solid #ddd;background-color: #FFF;padding: 10px;}
legend {border: 1px solid #ddd;padding: 5px;background-color: #FFF;margin-left: 10px;font-size: 1.4em;font-weight: bold;}

.pagination {border-top: solid 1px #eee;border-bottom: solid 1px #eee; padding:.5em; margin: 1em 0;}
.pagination .pages{display:block; float:left; text-align:center; width:55%; }
.pagination .pages a { padding: .5em; }
.pagination .prev, .pagination .next { width:10%; display:block; float:left;}
.pagination .first, .pagination .last { width:10%; display:block; float:left;}
.pagination .last { padding-left:1em;}
.pagination .next { text-align:right; }
.inactive {color: #aaa;}

/* Extra */

.padding5px { padding:5px; }
.padding10px { padding:10px; }
.padding15px { padding:15px; }
.padding20px { padding:20px; }

.padding-left5px { padding-left:5px; }
.padding-left10px { padding-left:10px; }
.padding-left15px { padding-left:15px; }
.padding-left20px { padding-left:20px; }
.padding-left60px { padding-left:60px; }

.padding-right5px { padding-right:5px; }
.padding-right10px { padding-right:10px; }
.padding-right15px { padding-right:15px; }
.padding-right20px { padding-right:20px; }
.padding-right60px { padding-right:60px; }

.padding-top5px { padding-top:5px; }
.padding-top10px { padding-top:10px; }
.padding-top15px { padding-top:15px; }
.padding-top20px { padding-top:20px; }

.padding-bottom5px { padding-bottom:5px; }
.padding-bottom10px { padding-bottom:10px; }
.padding-bottom15px { padding-bottom:15px; }
.padding-bottom20px { padding-bottom:20px; }

.red { color:#C00; }
.orange { color:#F60; }
.yellow { color: #FC0; }
.green { color:#090; }

/* 960px */
@media screen and (max-width: 1199px) {
	.block-960 {
		float:none;
	}
	body {min-width:960px;}
}

/* Animated hover effects */

/* Effect 1: Brackets */
.cl-effect-1 a::before,
.cl-effect-1 a::after {
	display: inline-block;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
	-moz-transition: -moz-transform 0.3s, opacity 0.2s;
	transition: transform 0.3s, opacity 0.2s;
}

.cl-effect-1 a::before {
	margin-right: 10px;
	content: '[';
	-webkit-transform: translateX(20px);
	-moz-transform: translateX(20px);
	transform: translateX(20px);
}

.cl-effect-1 a::after {
	margin-left: 10px;
	content: ']';
	-webkit-transform: translateX(-20px);
	-moz-transform: translateX(-20px);
	transform: translateX(-20px);
}

.cl-effect-1 a:hover::before,
.cl-effect-1 a:hover::after,
.cl-effect-1 a:focus::before,
.cl-effect-1 a:focus::after {
	opacity: 1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	transform: translateX(0px);
}

/* Effect 2: 3D rolling links, idea from http://hakim.se/thoughts/rolling-links */
.cl-effect-2 a {
	line-height: 44px;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	perspective: 1000px;
}

.cl-effect-2 a span {
	position: relative;
	display: inline-block;
	padding: 0 14px;
	background: #2195de;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.csstransforms3d .cl-effect-2 a span::before {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 100%;
	background: #0965a0;
	content: attr(data-hover);
	-webkit-transition: background 0.3s;
	-moz-transition: background 0.3s;
	transition: background 0.3s;
	-webkit-transform: rotateX(-90deg);
	-moz-transform: rotateX(-90deg);
	transform: rotateX(-90deg);
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.cl-effect-2 a:hover span,
.cl-effect-2 a:focus span {
	-webkit-transform: rotateX(90deg) translateY(-22px);
	-moz-transform: rotateX(90deg) translateY(-22px);
	transform: rotateX(90deg) translateY(-22px);
}

.csstransforms3d .cl-effect-2 a:hover span::before,
.csstransforms3d .cl-effect-2 a:focus span::before {
	background: #28a2ee;	
}

/* Effect 3: bottom line slides/fades in */
.cl-effect-3 a {
	padding: 8px 0;
}

.cl-effect-3 a::after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 4px;
	background: #13bbb4;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
}

.cl-effect-3 a:hover::after,
.cl-effect-3 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

/* Effect 4: bottom border enlarge */
.cl-effect-4 a {
	padding: 0 0 10px;
}

.cl-effect-4 a::after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 1px;
	background: #fff;
	content: '';
	opacity: 0;
	-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: height 0.3s, opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

.cl-effect-4 a:hover::after,
.cl-effect-4 a:focus::after {
	height: 5px;
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

/* Effect 5: same word slide in */
.cl-effect-5 a {
	overflow: hidden;
	padding: 0 4px;
	height: 1em;
}

.cl-effect-5 a span {
	position: relative;
	display: inline-block;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.cl-effect-5 a span::before {
	position: absolute;
	top: 100%;
	content: attr(data-hover);
	font-weight: 700;
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.cl-effect-5 a:hover span,
.cl-effect-5 a:focus span {
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	transform: translateY(-100%);
}

/* Effect 6: same word slide in and border bottom */
.cl-effect-6 a {
	margin: 0 10px;
	padding: 10px 20px;
}

.cl-effect-6 a::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background: #fff;
	content: '';
	-webkit-transition: top 0.3s;
	-moz-transition: top 0.3s;
	transition: top 0.3s;
}

.cl-effect-6 a::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 2px;
	height: 2px;
	background: #fff;
	content: '';
	-webkit-transition: height 0.3s;
	-moz-transition: height 0.3s;
	transition: height 0.3s;
}

.cl-effect-6 a:hover::before {
	top: 100%;
	opacity: 1;
}

.cl-effect-6 a:hover::after {
	height: 100%;
} 

/* Effect 7: second border slides up */
.cl-effect-7 a {
	padding: 12px 10px 10px;
	color: #566473;
	text-shadow: none;
	font-weight: 700;
}

.cl-effect-7 a::before,
.cl-effect-7 a::after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 3px;
	background: #566473;
	content: '';
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform: scale(0.85);
	-moz-transform: scale(0.85);
	transform: scale(0.85);
}

.cl-effect-7 a::after {
	opacity: 0;
	-webkit-transition: top 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: top 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: top 0.3s, opacity 0.3s, transform 0.3s;
}

.cl-effect-7 a:hover::before,
.cl-effect-7 a:hover::after,
.cl-effect-7 a:focus::before,
.cl-effect-7 a:focus::after {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	transform: scale(1);
}

.cl-effect-7 a:hover::after,
.cl-effect-7 a:focus::after {
	top: 0%;
	opacity: 1;
}

/* Effect 8: border slight translate */
.cl-effect-8 a {
	padding: 10px 20px;
}

.cl-effect-8 a::before,
.cl-effect-8 a::after  {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 3px solid #354856;
	content: '';
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
}

.cl-effect-8 a::after  {
	border-color: #fff;
	opacity: 0;
	-webkit-transform: translateY(-7px) translateX(6px);
	-moz-transform: translateY(-7px) translateX(6px);
	transform: translateY(-7px) translateX(6px);
}

.cl-effect-8 a:hover::before,
.cl-effect-8 a:focus::before {
	opacity: 0;
	-webkit-transform: translateY(5px) translateX(-5px);
	-moz-transform: translateY(5px) translateX(-5px);
	transform: translateY(5px) translateX(-5px);
}

.cl-effect-8 a:hover::after,
.cl-effect-8 a:focus::after  {
	opacity: 1;
	-webkit-transform: translateY(0px) translateX(0px);
	-moz-transform: translateY(0px) translateX(0px);
	transform: translateY(0px) translateX(0px);
}

/* Effect 9: second text and borders */
.cl-effect-9 a {
	margin: 0 20px;
	padding: 18px 20px;
}


.cl-effect-9 a::before,
.cl-effect-9 a::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #fff;
	content: '';
	opacity: 0.2;
	-webkit-transition: opacity 0.3s, height 0.3s;
	-moz-transition: opacity 0.3s, height 0.3s;
	transition: opacity 0.3s, height 0.3s;
}

.cl-effect-9 a::after {
	top: 100%;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

.cl-effect-9 a span:first-child {
	z-index: 2;
	display: block;
	font-weight: 300;
}

.cl-effect-9 a span:last-child {
	z-index: 1;
	display: block;
	padding: 8px 0 0 0;
	color: rgba(0,0,0,0.4);
	text-shadow: none;
	text-transform: none;
	font-style: italic;
	font-size: 0.75em;
	font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	transform: translateY(-100%);
}

.cl-effect-9 a:hover::before,
.cl-effect-9 a:focus::before {
	height: 6px;
}

.cl-effect-9 a:hover::before,
.cl-effect-9 a:hover::after,
.cl-effect-9 a:focus::before,
.cl-effect-9 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

.cl-effect-9 a:hover span:last-child,
.cl-effect-9 a:focus span:last-child {
	opacity: 1;
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	transform: translateY(0%);
}

/* Effect 10: reveal, push out */
.cl-effect-10  {
	position: relative;
	z-index: 1;
}

.cl-effect-10 a {
	overflow: hidden;
	margin: 0 15px;
}

.cl-effect-10 a span {
	display: block;
	padding: 10px 20px;
	background: #0f7c67;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.cl-effect-10 a::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	padding: 10px 20px;
	width: 100%;
	height: 100%;
	background: #fff;
	color: #0f7c67;
	content: attr(data-hover);
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform: translateX(-25%);
}

.cl-effect-10 a:hover span,
.cl-effect-10 a:focus span {
	-webkit-transform: translateX(100%);
	-moz-transform: translateX(100%);
	transform: translateX(100%);
}

.cl-effect-10 a:hover::before,
.cl-effect-10 a:focus::before {
	-webkit-transform: translateX(0%);
	-moz-transform: translateX(0%);
	transform: translateX(0%);
}

/* Effect 11: text fill based on Lea Verou's animation http://dabblet.com/gist/6046779 */
.cl-effect-11 a {
	padding: 10px 0;
	border-top: 2px solid #0972b4;
	color: #0972b4;
	text-shadow: none;
} 

.cl-effect-11 a::before {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	padding: 10px 0;
	max-width: 0;
	border-bottom: 2px solid #fff;
	color: #fff;
	content: attr(data-hover);
	-webkit-transition: max-width 0.5s;
	-moz-transition: max-width 0.5s;
	transition: max-width 0.5s;
}

.cl-effect-11 a:hover::before,
.cl-effect-11 a:focus::before {
	max-width: 100%;
}

/* Effect 12: circle */
.cl-effect-12 a::before,
.cl-effect-12 a::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 100px;
	border: 2px solid rgba(0,0,0,0.1);
	border-radius: 50%;
	content: '';
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.2);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.2);
	transform: translateX(-50%) translateY(-50%) scale(0.2);
}

.cl-effect-12 a::after {
	width: 90px;
	height: 90px;
	border-width: 6px;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.8);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.8);
	transform: translateX(-50%) translateY(-50%) scale(0.8);
}

.cl-effect-12 a:hover::before,
.cl-effect-12 a:hover::after,
.cl-effect-12 a:focus::before,
.cl-effect-12 a:focus::after {
	opacity: 1;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
	-moz-transform: translateX(-50%) translateY(-50%) scale(1);
	transform: translateX(-50%) translateY(-50%) scale(1);
}

/* Effect 13: three circles */
.cl-effect-13 a {
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.cl-effect-13 a::before {
	position: absolute;
	top: 100%;
	left: 50%;
	color: transparent;
	content: '•';
	text-shadow: 0 0 transparent;
	font-size: 1.2em;
	-webkit-transition: text-shadow 0.3s, color 0.3s;
	-moz-transition: text-shadow 0.3s, color 0.3s;
	transition: text-shadow 0.3s, color 0.3s;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	transform: translateX(-50%);
	pointer-events: none;
}

.cl-effect-13 a:hover::before,
.cl-effect-13 a:focus::before {
	color: #fff;
	text-shadow: 10px 0 #fff, -10px 0 #fff;
}

.cl-effect-13 a:hover,
.cl-effect-13 a:focus {
	color: #ba7700;
}

/* Effect 14: border switch */
.cl-effect-14 a {
	padding: 0 20px;
	height: 45px;
	line-height: 45px;
}

.cl-effect-14 a::before,
.cl-effect-14 a::after {
	position: absolute;
	width: 45px;
	height: 2px;
	background: #fff;
	content: '';
	opacity: 0.2;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	pointer-events: none;
}

.cl-effect-14 a::before {
	top: 0;
	left: 0;
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	transform: rotate(90deg);
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	transform-origin: 0 0;
}

.cl-effect-14 a::after {
	right: 0;
	bottom: 0;
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	transform: rotate(90deg);
	-webkit-transform-origin: 100% 0;
	-moz-transform-origin: 100% 0;
	transform-origin: 100% 0;
}

.cl-effect-14 a:hover::before,
.cl-effect-14 a:hover::after,
.cl-effect-14 a:focus::before,
.cl-effect-14 a:focus::after {
	opacity: 1;
}

.cl-effect-14 a:hover::before,
.cl-effect-14 a:focus::before {
	left: 50%;
	-webkit-transform: rotate(0deg) translateX(-50%);
	-moz-transform: rotate(0deg) translateX(-50%);
	transform: rotate(0deg) translateX(-50%);
}

.cl-effect-14 a:hover::after,
.cl-effect-14 a:focus::after {
	right: 50%;
	-webkit-transform: rotate(0deg) translateX(50%);
	-moz-transform: rotate(0deg) translateX(50%);
	transform: rotate(0deg) translateX(50%);
}

/* Effect 15: scale down, reveal */
.cl-effect-15 a {
	color: rgba(0,0,0,0.2);
	font-weight: 700;
	text-shadow: none;
}

.cl-effect-15 a::before {
	color: #fff;
	content: attr(data-hover);
	position: absolute;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
}

.cl-effect-15 a:hover::before,
.cl-effect-15 a:focus::before {
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	transform: scale(0.9);
	opacity: 0;
}

/* Effect 16: fall down */
.cl-effect-16 a {
	color: #6f8686;
	text-shadow: 0 0 1px rgba(111,134,134,0.3);
}

.cl-effect-16 a::before {
	color: #fff;
	content: attr(data-hover);
	position: absolute;
	opacity: 0;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	-webkit-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-moz-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-16 a:hover::before,
.cl-effect-16 a:focus::before {
	-webkit-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	-moz-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	opacity: 1;
}

/* Effect 17: move up fade out, push border */
.cl-effect-17 a {
	color: #10649b;
	text-shadow: none;
	padding: 10px 0;
}

.cl-effect-17 a::before {
	color: #fff;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	content: attr(data-hover);
	position: absolute;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-17 a::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: #fff;
	opacity: 0;
	-webkit-transform: translateY(5px);
	-moz-transform: translateY(5px);
	transform: translateY(5px);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-17 a:hover::before,
.cl-effect-17 a:focus::before {
	opacity: 0;
	-webkit-transform: translateY(-2px);
	-moz-transform: translateY(-2px);
	transform: translateY(-2px);
}

.cl-effect-17 a:hover::after,
.cl-effect-17 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

/* Effect 18: cross */
.cl-effect-18 {
	position: relative;
	z-index: 1;
}

.cl-effect-18 a {
	padding: 0 5px;
	color: #b4770d;
	font-weight: 700;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.cl-effect-18 a::before,
.cl-effect-18 a::after {
	position: absolute;
	width: 100%;
	left: 0;
	top: 50%;
	height: 2px;
	margin-top: -1px;
	background: #b4770d;
	content: '';
	z-index: -1;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-18 a::before {
	-webkit-transform: translateY(-20px);
	-moz-transform: translateY(-20px);
	transform: translateY(-20px);
}

.cl-effect-18 a::after {
	-webkit-transform: translateY(20px);
	-moz-transform: translateY(20px);
	transform: translateY(20px);
}

.cl-effect-18 a:hover,
.cl-effect-18 a:focus {
	color: #fff;
}

.cl-effect-18 a:hover::before,
.cl-effect-18 a:hover::after,
.cl-effect-18 a:focus::before,
.cl-effect-18 a:focus::after {
	opacity: 0.7;
}

.cl-effect-18 a:hover::before,
.cl-effect-18 a:focus::before {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}

.cl-effect-18 a:hover::after,
.cl-effect-18 a:focus::after {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/* Effect 19: 3D side */
.cl-effect-19 a {
	line-height: 2em;
	margin: 15px;
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	perspective: 800px;
	width: 200px;
}

.cl-effect-19 a span {
	position: relative;
	display: inline-block;
	width: 100%;
	padding: 0 14px;
	background: #e35041;
	-webkit-transition: -webkit-transform 0.4s, background 0.4s;
	-moz-transition: -moz-transform 0.4s, background 0.4s;
	transition: transform 0.4s, background 0.4s;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform-origin: 50% 50% -100px;
	-moz-transform-origin: 50% 50% -100px;
	transform-origin: 50% 50% -100px;
}

.csstransforms3d .cl-effect-19 a span::before {
	position: absolute;
	top: 0;
	left: 100%;
	width: 100%;
	height: 100%;
	background: #b53a2d;
	content: attr(data-hover);
	-webkit-transition: background 0.4s;
	-moz-transition: background 0.4s;
	transition: background 0.4s;
	-webkit-transform: rotateY(90deg);
	-moz-transform: rotateY(90deg);
	transform: rotateY(90deg);
	-webkit-transform-origin: 0 50%;
	-moz-transform-origin: 0 50%;
	transform-origin: 0 50%;
	pointer-events: none;
}

.cl-effect-19 a:hover span,
.cl-effect-19 a:focus span {
	background: #b53a2d;
	-webkit-transform: rotateY(-90deg);
	-moz-transform: rotateY(-90deg);
	transform: rotateY(-90deg);
}

.csstransforms3d .cl-effect-19 a:hover span::before,
.csstransforms3d .cl-effect-19 a:focus span::before {
	background: #ef5e50;	
}

/* Effect 20: 3D side */
.cl-effect-20 a {
	line-height: 2em;
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	perspective: 800px;
}

.cl-effect-20 a span {
	position: relative;
	display: inline-block;
	padding: 3px 15px 0;
	background: #587285;
	box-shadow: inset 0 3px #2f4351;
	-webkit-transition: background 0.6s;
	-moz-transition: background 0.6s;
	transition: background 0.6s;
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform-origin: 0% 50%;
	-moz-transform-origin: 0% 50%;
	transform-origin: 0% 50%;
}

.cl-effect-20 a span::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	color: #2f4351;
	content: attr(data-hover);
	-webkit-transform: rotateX(270deg);
	-moz-transform: rotateX(270deg);
	transform: rotateX(270deg);
	-webkit-transition: -webkit-transform 0.6s;
	-moz-transition: -moz-transform 0.6s;
	transition: transform 0.6s;
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	transform-origin: 0 0;
	pointer-events: none;
}

.cl-effect-20 a:hover span,
.cl-effect-20 a:focus span {
	background: #2f4351;
}

.cl-effect-20 a:hover span::before,
.cl-effect-20 a:focus span::before {
	-webkit-transform: rotateX(10deg);	
	-moz-transform: rotateX(10deg);
	transform: rotateX(10deg);
}

/* Effect 21: borders slight translate */
.cl-effect-21 a {
	padding: 10px;
	color: #237546;
	font-weight: 700;
	text-shadow: none;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.cl-effect-21 a::before,
.cl-effect-21 a::after {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: #fff;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

.cl-effect-21 a::before {
	top: 0;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

.cl-effect-21 a::after {
	bottom: 0;
	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
}

.cl-effect-21 a:hover,
.cl-effect-21 a:focus {
	color: #fff;
}

.cl-effect-21 a:hover::before,
.cl-effect-21 a:focus::before,
.cl-effect-21 a:hover::after,
.cl-effect-21 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

@keyframes bounce{
  0% {
    transform:  translate(0px,0px)  ;
  }
  15% {
    transform:  translate(0px,-25px)  ;
  }
  30% {
    transform:  translate(0px,0px)  ;
  }
  45% {
    transform:  translate(0px,-15px)  ;
  }
  60% {
    transform:  translate(0px,0px)  ;
  }
  75% {
    transform:  translate(0px,-5px)  ;
  }
  100% {
    transform:  translate(0px,0px)  ;
  }
}

@-moz-keyframes bounce{
  0% {
    -moz-transform:  translate(0px,0px)  ;
  }
  15% {
    -moz-transform:  translate(0px,-25px)  ;
  }
  30% {
    -moz-transform:  translate(0px,0px)  ;
  }
  45% {
    -moz-transform:  translate(0px,-15px)  ;
  }
  60% {
    -moz-transform:  translate(0px,0px)  ;
  }
  75% {
    -moz-transform:  translate(0px,-5px)  ;
  }
  100% {
    -moz-transform:  translate(0px,0px)  ;
  }
}

@-webkit-keyframes bounce {
  0% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  15% {
    -webkit-transform:  translate(0px,-25px)  ;
  }
  30% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  45% {
    -webkit-transform:  translate(0px,-15px)  ;
  }
  60% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  75% {
    -webkit-transform:  translate(0px,-5px)  ;
  }
  100% {
    -webkit-transform:  translate(0px,0px)  ;
  }
}

@-o-keyframes bounce {
  0% {
    -o-transform:  translate(0px,0px)  ;
  }
  15% {
    -o-transform:  translate(0px,-25px)  ;
  }
  30% {
    -o-transform:  translate(0px,0px)  ;
  }
  45% {
    -o-transform:  translate(0px,-15px)  ;
  }
  60% {
    -o-transform:  translate(0px,0px)  ;
  }
  75% {
    -o-transform:  translate(0px,-5px)  ;
  }
  100% {
    -o-transform:  translate(0px,0px)  ;
  }
}

@-ms-keyframes bounce {
  0% {
    -ms-transform:  translate(0px,0px)  ;
  }
  15% {
    -ms-transform:  translate(0px,-25px)  ;
  }
  30% {
    -ms-transform:  translate(0px,0px)  ;
  }
  45% {
    -ms-transform:  translate(0px,-15px)  ;
  }
  60% {
    -ms-transform:  translate(0px,0px)  ;
  }
  75% {
    -ms-transform:  translate(0px,-5px)  ;
  }
  100% {
    -ms-transform:  translate(0px,0px)  ;
  }
}

/* OceanSky Styles */
.pad { padding-left: 20px; padding-right: 20px; }
tr td { text-align: center; }
ul.bullets li { list-style: circle; }
.bigtext { font-size: 2em; }