/*RESET STYLES*/
body { font:13px serif; *font-size:small; *font:x-small; line-height:1.22; }
html, body, body div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, 
hgroup, menu, nav, section,
time, mark, audio, video, a {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent none no-repeat 0 0;
  color: #484848;
  font-weight: normal;
}

article, aside, figure, footer, header, hgroup, nav, section { display:block; }

nav ul { list-style:none; }

blockquote, q { quotes:none; }

blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
ins { background-color:#ff9; color:#000; text-decoration:none; }

del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted #000; cursor:help; }
table { border-collapse:collapse; border-spacing:0;  font-size:inherit; font:100%;}
input, select { vertical-align:middle;  font:99% sans-serif; color: #282828;}
pre, code, kbd, samp { font-family: monospace, sans-serif; }/ 
h1,h2,h3,h4,h5,h6 { font-weight: bold; text-rendering: optimizeLegibility; }
html { -webkit-font-smoothing: antialiased; }

/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a: active { outline: none; }
a:focus { outline: 1px dotted #f3f3f3; }
ul { margin-left:30px; }
ol { margin-left:30px; list-style-type: decimal; }

small { font-size:85%; }

large { font-size:8px; }


strong{ font-weight: bold; }
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }

input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
::-moz-selection{ background: #484848; color:#fff; text-shadow: none; }
::selection { background:#484848; color:#fff; text-shadow: none; } 
a:link { -webkit-tap-highlight-color: #ccc; } 
html { overflow-y: scroll; }
button {  width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }
/* RESET STYLES END HERE */

body {
margin					: 0px;
padding					: 0px;
background-color		: #ebd292;  /*gradient_bottom, default, for non-css3 browsers*/
background-image		: url(gradient.svg); /*svg gradient for IE, Safari and Opera*/
background-image		: -moz-linear-gradient(top, #856422 0%, #ebd292 100%);
background-image		: -webkit-linear-gradient(top, #856422 0%, #ebd292 100%);
background-image		: linear-gradient(top, #856422 0%, #ebd292 100%);
background-attachment	: fixed;
}

#outer {
width				: 800px;
margin				: 15px auto 20px auto;
background-color	: #f8f8e8;
border				: 2px solid #856422;
-moz-border-radius	: 18px;
-webkit-border-radius: 18px;
/* apply standard property AFTER the proprietary ones*/
border-radius		: 18px;
overflow			: hidden;
-moz-box-shadow		: 5px 5px 20px #856422;
-webkit-box-shadow	: 5px 5px 20px #856422;
box-shadow			: 5px 5px 20px #856422;
}

header{ 
-moz-border-top-right-radius	: 18px;
-moz-border-top-left-radius		: 18px;
-webkit-border-top-right-radius	: 18px;
-webkit-border-top-left-radius	: 18px;
border-top-right-radius			: 18px;
border-top-left-radius			: 18px;
overflow			: hidden;
background-color	: #ebd292;
border-bottom		: 2px solid #856422;
height:289px;
}

section {
padding				: 0px 50px 10px 50px;
}

footer {
border-top			: 2px solid #856422;
background-color	: #ebd292;
height				: 25px;
-moz-border-bottom-right-radius		: 18px;
-moz-border-bottom-left-radius		: 18px;
-webkit-border-bottom-right-radius	: 18px;
-webkit-border-bottom-left-radius	: 18px;
border-bottom-right-radius			: 18px;
border-bottom-left-radius			: 18px;
overflow			: hidden;
height:33px;
}

/* horizontal menu */
nav ul {
background-color	: inherit;
list-style-type		: none;
text-align			: center;

}
nav li {
display				: inline;
margin				: -4px;
}
nav a{
color				: #662233;
background-color	: #9aa7d1;
font-family			: Verdana, Arial, Helvetica, sans-serif; 
font-size			: 0.8em; 
font-weight			: bold; 
font-style			: normal; 
text-decoration		: none; 
padding				: 5px;
height				: 1%; /* IE quirk */
border				: 1px solid #856422;
border-top-right-radius			: 8px;
border-top-left-radius			: 8px;

}
nav a:hover, a.current { 
background-color	: #f8f8e8;
height				: 1%; /* IE quirk */
}
/* end menu */

/*video*/
	.hidden {
		display: none;
	}
#video-container {
border: 2px solid #856422;
display: block;
float:left;
margin:10px;
border-radius:7px;
overflow:hidden;
}	

video { 
margin-top:0px;
margin-bottom: -5px;
margin-left: -1px;
margin-right: -1px;
}

.clear {clear:both;}

#ad3 h2 span {
/*  font-size: 24px;*/
/*  color: #666666; */
font-weight:bold;
color: #684c16;
  display:inline-block;
  -webkit-transition: color 0.2s ease-out, -webkit-transform 0.2s ease-out;
  -moz-transition: color 0.2s ease-out, -moz-transform 0.2s ease-out;
  -o-transition: color 0.2s ease-out, -o-transform 0.2s ease-out;
  transition: color 0.2s ease-out, transform 0.2s ease-out;
}
#ad3 h2:hover span.up {
  color: #cc3333;
  -webkit-transform:rotate(0deg) translateY(-20px) scale(1.2); 
  -moz-transform:rotate(0deg) translateY(-20px) scale(1.2); 
  -ms-transform:rotate(0deg) translateY(-20px) scale(1.2); 
  -o-transform:rotate(0deg) translateY(-20px) scale(1.2); 
  transform:rotate(0deg) translateY(-20px) scale(1.2);
}
#ad3 h2:hover span.grow {
  color: #cc3333;
  -webkit-transform:rotate(0deg) translateX(15px) translateY(-2px) scale(1.4); 
  -moz-transform:rotate(0deg) translateX(5px) translateY(-2px) scale(1.2); 
  -ms-transform:rotate(0deg) translateX(5px) translateY(-2px) scale(1.2); 
  -o-transform:rotate(0deg) translateX(5px) translateY(-2px) scale(1.2); 
  transform:rotate(0deg) translateX(5px) translateY(-2px) scale(1.2);
}

div#box1 { height: 150px; width:250px; border: 1px solid black; float:left; margin:10px auto 10px 50px; padding:2px; background-color:#ffffff;}

div#box2 { height: 150px; width:250px; border: 2px solid red; float:right; margin:10px 50px 10px auto; padding:2px;
border-radius:10px;
-moz-box-shadow		: 5px 5px 20px #888888;
-webkit-box-shadow	: 5px 5px 20px #888888;
box-shadow			: 5px 5px 20px #888888;
background-color		: #66ff66;  /*default color, for non-css3 browsers*/
background-image		: url(boxgradient.svg); /*svg gradient for IE*/
background-image		:    -moz-linear-gradient(top, #66ff66 0%, #ffff99 100%);
background-image		: -webkit-linear-gradient(top, #66ff66 0%, #ffff99 100%);
background-image		: -o-linear-gradient(top, #66ff66 0%, #ffff99 100%);
background-image		: linear-gradient(top, #66ff66 0%, #ffff99 100%);
}

div#box3 { width:480px; margin-top:60px; margin-left:100px; margin-bottom:-30px; background-color:#ffff99;
  -webkit-transform:rotate(15deg) translateY(-0px) scale(1.0); 
  -moz-transform:rotate(15deg) translateY(-0px) scale(1.0); 
  -ms-transform:rotate(15deg) translateY(-0px) scale(1.0); 
  -o-transform:rotate(15deg) translateY(-0px) scale(1.0); 
  transform:rotate(15deg) translateY(-2px) scale(1.0);
border: 2px solid #c4c8cc;
  border-radius:10px; 
  padding:5px;
}

div#box3 textarea { width:98%;}

div.columns {
background-color:#ffff99;
-moz-column-count: 3;
-moz-column-gap: 1.5em;
-moz-column-rule: 1px solid #c4c8cc;
-webkit-column-count: 3;
-webkit-column-gap: 1.0em;
-webkit-column-rule: 1px solid #c4c8cc;
column-count: 3;
column-gap: 1.5em;
column-rule: 1px solid #c4c8cc;
border: 1px solid #c4c8cc;
padding-left:5px;
padding-right:5px;
}

div.noshow {display:none;} /*hide columns in IE*/
