/** Global
 ********************************************************** */
 
/** Content
 ********************************************************** */
.border_box {background:#000;padding:0px;float:left; margin-bottom:10px;
	-moz-box-shadow:#000 0 0 5px;
}
body{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,ffffff+100 */
background: #eeeeee; /* Old browsers */
background: -moz-linear-gradient(top,  #eeeeee 0%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #eeeeee 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #eeeeee 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

}
#examples {background:#fff;padding:5px;border:1px solid #999;}
#examples h2 {margin:0 0 5px 0;font-weight:bold;font-size:20px;letter-spacing:-1px;background:#eee;padding:5px;color:#003366;}
#examples h3 {float:left;width:120px;height:90px;margin:0 0 0 5px;font-weight:normal;font-size:16px;color:#993300;letter-spacing:-1px;}

#cube {background:url(../images/thumb-1.gif) no-repeat left bottom;}
#tube {background:url(../images/thumb-2.gif) no-repeat left bottom;}
#block {background:url(../images/thumb-3.gif) no-repeat left bottom;}
#cubeStop {background:url(../images/thumb-4.gif) no-repeat left bottom;}
#cubeHide {background:url(../images/thumb-5.gif) no-repeat left bottom;}
#cubeSize {background:url(../images/thumb-6.gif) no-repeat left bottom;}
#horizontal {background:url(../images/thumb-7.gif) no-repeat left bottom;}

.label_skitter {z-index:150;position:absolute;bottom:0px;left:0px;background: rgba(0, 0, 0, 0.75);color:#fff;display:none;border-top: 0px solid rgba(0, 0, 0, 0.75);}
.label_skitter p {padding:10px;margin:0;font: normal 70% Arial, Verdana, sans-serif;font-size: 16px;font-weight: bold;}
.info_slide * {font-family:Consolas,arial,tahoma !important;}

#skitter_fixed {position:fixed;right:20px;top:20px;padding:5px;background:#000;z-index:1000;color:#fff;}

#download {margin:10px 0 20px 0;height:55px;}
#botao_download {float:left;margin:0 20px 0 -6px;}
#botao_wp {float:left;margin:0 20px 0 -6px;}
#botao_helper {float:left;margin:0 20px 0 -6px;}
#donate {float:left;}

#options h3 {font-weight:bold;font-size:26px;color:#000;}
#options dt {font-weight:bold;font-size:18px;border-bottom:1px dashed #333;margin:10px 0 5px 0;color:#004499;}
#options dd {font-size:12px;padding:0 0 0 10px;margin:0 0 4px 0;}
#options dd.description {font-size:14px;}
#options dd.default {color:#555;font-style:italic;padding:0 0 0 20px;}
#options dd.example {color:#cc0000;padding:0 0 0 20px;}
#options dd.example span {border:1px solid #003300;background:#007744;color:#fff;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;padding:1px 5px;}

#options table {width:100%;border-collapse:collapse;border:1px solid #333;margin:20px 0;}
#options table th {background:#333;color:#fff;padding:10px;text-align:left;}
#options table th:nth-child(2n) { background:#222; }
#options table td {padding:5px;background:#fff;font-size:14px;}
#options table tr:nth-child(2n) td { background:#ddd; }
#options table td:nth-child(3) {font-style:italic;color:#555;}
#options table td span.code {color:#000;}

#examples-animations {float:left;width:100%;margin-top:10px;}
#examples-animations div {width:800px;}
#examples-animations a {background:#ccc;float:left;margin:0 5px 5px 0;padding:5px;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;text-decoration:none;border:1px solid #bbb;color:#000;}
#examples-animations a:hover {position:relative;background:#aaa;border:1px solid #777;}
#examples-animations a.selected {background:#333;color:#fff;border:1px solid #000;background:#333;text-shadow:none;}
#examples-animations a .new_animation {font:bold 11px arial,tahoma;color:#fff;padding:2px 5px;border:1px solid #000; background:#cc0000; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; float:right;margin-left:5px;}

#styles_navigation {height:100px;}
#styles_navigation h2 {}
#styles_navigation ul {list-style:none;}
#styles_navigation ul li {float:left;position:relative;}
#styles_navigation ul li a {background:#ccc;float:left;margin:0 15px 15px 0;padding:5px 15px;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;text-decoration:none;border:1px solid #bbb;color:#000;font-weight:bold;font-size:26px;letter-spacing:-2px;}

#styles_navigation ul li a:hover {background:#aaa;border:1px solid #777;}
#styles_navigation ul li a.selected {background:#333; font-weight:normal; color:#fff; border:1px solid #000; }

span.new {position:absolute;top:-5px;right:-10px;font:bold 11px arial,tahoma;color:#fff;padding:2px 5px;border:1px solid #000; background:#cc0000; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; }

span.update {position:absolute;top:-5px;right:-25px;font:bold 11px arial,tahoma;color:#fff;padding:2px 5px;border:1px solid #000; background:#006600; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; }

#updatelog {background:#fff;padding:0 10px 10px 10px ;border-top:5px solid #333;}
#updatelog dl dt {border-bottom:1px solid #ccc;font-weight:bold;font-size:18px;margin:10px 0 5px 0;}
#updatelog dl dd {font-weight:normal;font-size:14px;}

.highlight *, .code {font-family:Consolas,arial,tahoma !important;}

#box_share {}

#menu {
  width: 100%;
  height: 40px;
  clear: both;
  background: #fff;
}
 
ul#nav {
  float: left;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  background: #147fb4 url(../img/menu-parent.png) repeat-x;
  -moz-border-radius-topright: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -webkit-border-top-left-radius: 10px;
}
 
ul#nav li {
  display: inline;
}
 
ul#nav li a {
  float: left;
  font: bold 1.1em arial,verdana,tahoma,sans-serif;
  line-height: 35px;
  color: #fff;
  text-decoration: none;
  text-shadow: 1px 1px 1px #1376a7;
  margin: 0;
  padding: 0 16.5px;
  background: #1376a7 url(../img/menu-parent.png) repeat-x;
  -moz-border-radius-topright: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -webkit-border-top-left-radius: 10px;
}
 
/* APPLIES THE ACTIVE STATE */
ul#nav .current a, ul#nav li:hover > a  {
  color: #fff;
  text-decoration: none;
  text-shadow: 1px 1px 1px #0b4765;
  background: #0e6692;
  -moz-border-radius-topright: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -webkit-border-top-left-radius: 10px;
}
 
/* THE SUBMENU LIST HIDDEN BY DEFAULT */
ul#nav  ul {
  display: none;
}
 
/* WHEN THE FIRST LEVEL MENU ITEM IS HOVERED, THE CHILD MENU APPEARS */
ul#nav li:hover > ul {
  position: absolute;
  display: block;
  width: 970px;
  padding-left: 10px;
  height: 35px;
  position: absolute;
  margin: 35px 0 0 0;
  background: #0e6692 url(../img/menu-child.png) repeat-x;
  -moz-border-radius-bottomright: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-bottomleft: 10px;
  -webkit-border-bottom-left-radius: 10px;
}
 
ul#nav li:hover > ul li a {
  float: left;
  font: bold 1.1em arial,verdana,tahoma,sans-serif;
  line-height: 35px;
  color: #fff;
  text-decoration: none;
  text-shadow: 1px 1px 1px #0b4765;
  margin: 0;
  padding: 0 15px;
  border-right: 1px solid #147fb4;
  background: #0e6692 url(../img/menu-child.png) repeat-x;
}
 
ul#nav li:hover > ul li a:hover {
  color: #9cdeff;
  text-decoration: none;
  text-shadow: none;
} 

nav a {
	text-decoration: none;
}

/*---------- Wrapper --------------------*/

nav {
	width: 100%;
	max-width: 980px;
	margin: auto;
	background: #1b456d;
}

nav ul {
	text-align: center;
	margin: 0;
    padding: 0;
}

nav ul li {
	font: 13px Verdana, 'Lucida Grande';
	cursor: pointer;
	-webkit-transition: padding .05s linear;
	-moz-transition: padding .05s linear;
	-ms-transition: padding .05s linear;
	-o-transition: padding .05s linear;
	transition: padding .05s linear;
}
nav ul > li {
	display: inline-block;
	float: initial;
}
nav ul>li>a {
	padding: 10px 16.8px;
	font-size: 14px;
	font-weight: 500;
	display: inline-block;
	color: #fff;
	-webkit-transition: all .1s ease-out;
	-moz-transition: all .1s ease-out;
	-ms-transition: all .1s ease-out;
	-o-transition: all .1s ease-out;
	transition: all .1s ease-out;
}
nav ul li a:hover {
	color: #eee;
}
nav ul li.drop {
	position: relative;
	border-right: 1px solid #32608c;
}

nav .dropOut .triangle {
	width: 0;
	height: 0;
	position: absolute;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid white;
	top: -8px;
	left: 50%;
	margin-left: -8px;
}
nav .dropdownContain {
	width: auto;
	max-width: 460px;
	position: absolute;
	z-index: 2;
	left: 50%;
	margin-left: -240px; /* half of width */
	top: -400px;
}
nav .dropOut {
	width: 460px;
	background: white;
	float: left;
	position: relative;
	margin-top: 0px;
	opacity: 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 6px rgba(0,0,0,.15);
	-moz-box-shadow: 0 1px 6px rgba(0,0,0,.15);
	box-shadow: 0 1px 6px rgba(0,0,0,.15);
	-webkit-transition: all .1s ease-out;
	-moz-transition: all .1s ease-out;
	-ms-transition: all .1s ease-out;
	-o-transition: all .1s ease-out;
	transition: all .1s ease-out;
}

nav .dropOut ul {
	float: left;
	width: 100%;
	padding: 10px 0;
}
nav .dropOut ul li {
	text-align: left;
	border-right: 1px solid #efefef;
	border-bottom: 1px solid #efefef;
	float: left;
	width: 49.7%;
	padding: 0;
	margin: 0px;
	margin-right: 0;
	color: #777;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: background .1s ease-out;
	-moz-transition: background .1s ease-out;
	-ms-transition: background .1s ease-out;
	-o-transition: background .1s ease-out;
	transition: background .1s ease-out;
}
nav .dropOut ul li a{
	padding: 10px;
	font-size: 12px;
	background: transparent!important;
	color: #555!important;
	min-height: 26px;
}
nav .dropOut ul li a:hover {color: white;background: #008000;}
nav .dropOut ul li:hover {
	background: #f6f6f6;
}

nav ul li:hover a {color: white;background: #008000;}
nav ul li:hover .dropdownContain {top: 35px;background: rgba(0, 0, 0, 0.35);padding: 0 10px;padding-bottom: 10px;}
nav ul li:hover .underline { border-bottom-color: #777; }
nav ul li:hover .dropOut { opacity: 1; margin-top: 8px; }
nav ul li.drop {
	position: relative;
	border-right: 1px solid #32608c;
}

nav .droppOut .triangle {
	width: 0;
	height: 0;
	position: absolute;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid white;
	top: -8px;
	left: 6%;
	margin-left: -8px;
}
nav .droppdownContain {
	width: auto;
	max-width: 460px;
	position: absolute;
	z-index: 2;
	left: 50%;
	margin-left: -490px; /* half of width */
	top: -400px;
}
nav .droppOut {
	width: 460px;
	background: white;
	float: left;
	position: relative;
	margin-top: 0px;
	opacity: 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 6px rgba(0,0,0,.15);
	-moz-box-shadow: 0 1px 6px rgba(0,0,0,.15);
	box-shadow: 0 1px 6px rgba(0,0,0,.15);
	-webkit-transition: all .1s ease-out;
	-moz-transition: all .1s ease-out;
	-ms-transition: all .1s ease-out;
	-o-transition: all .1s ease-out;
	transition: all .1s ease-out;
}

nav .droppOut ul {
	float: left;
	width: 100%;
	padding: 10px 0;
}
nav .droppOut ul li {
	text-align: left;
	border-right: 1px solid #efefef;
	border-bottom: 1px solid #efefef;
	float: left;
	width: 49.7%;
	padding: 0;
	margin: 0px;
	margin-right: 0;
	color: #777;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: background .1s ease-out;
	-moz-transition: background .1s ease-out;
	-ms-transition: background .1s ease-out;
	-o-transition: background .1s ease-out;
	transition: background .1s ease-out;
}
nav .droppOut ul li a{
	padding: 10px;
	font-size: 12px;
	background: transparent!important;
	color: #555!important;
	min-height: 26px;
}
nav .droppOut ul li a:hover {color: white;background: #008000;}
nav .droppOut ul li:hover {
	background: #f6f6f6;
}

nav ul li:hover a {color: white;background: #008000;}
nav ul li:hover .droppdownContain {top: 36px;background: rgba(0, 0, 0, 0.35);padding: 0 10px;padding-bottom: 10px;}
nav ul li:hover .underline { border-bottom-color: #777; }
nav ul li:hover .droppOut { opacity: 1; margin-top: 8px; }