/*****************************************/
/****************  FONTS  ****************/
/*****************************************/

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 300;
  src: local('Oswald Light'), local('Oswald-Light'), url(http://themes.googleusercontent.com/static/fonts/oswald/v8/HqHm7BVC_nzzTui2lzQTDT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: local('Raleway'), url(http://themes.googleusercontent.com/static/fonts/raleway/v7/IczWvq5y_Cwwv_rBjOtT0w.woff) format('woff');
}

/*****************************************/
/***************  LAYOUT  ****************/
/*****************************************/

body {
  margin: 0;
  font-size: 14px;
  
}

body.blank {
  margin: 1.5em 2em;
  font-family: 'Raleway', sans-serif;
  font-size: 1.2em;
  text-align: justify;
  line-height: 2.2em;
  background: #fff; /*Blanco*/
}

#ac {
  position: relative;
  overflow: hidden;
}

#lgsm {
  display: none;
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 1px;
  z-index: 3;
}

#lgsm div {
  float: right;
  width: 100px;
  height: 100px;
  background: url(../img/lgsm.png);
}

#tb {
  display: block;
  height: 4.2em;
  line-height: 4.2em;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.2em;
  text-align: center;
  background: #ffd700; /*Gris claro*/
  background: -moz-linear-gradient(top, #ffe354 0%, #b69a02 100%); /*Gris clarito y Gris oscuro*/
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffe354), color-stop(100%, #b69a02)); /*Gris clarito y Gris oscuro*/
  background: -webkit-linear-gradient(top, #ffe354 0%, #b69a02 100%); /*Gris clarito y Gris oscuro*/
  background: -o-linear-gradient(top, #ffe354 0%, #b69a02 100%); /*Gris clarito y Gris oscuro*/
  background: -ms-linear-gradient(top, #ffe354 0%, #b69a02 100%); /*Gris clarito y Gris oscuro*/
  background: linear-gradient(to bottom, #ffe354 0%, #b69a02 100%); /*Gris clarito y Gris oscuro*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe354', endColorstr='#b69a02', GradientType=0); /*Gris clarito y Gris oscuro*/
  border-bottom: 1px solid #323232; /*Gris oscuro*/
  color: #262626; /*Gris oscuro*/
  text-shadow: 0 1px 1px rgba(255,255,255,0.4);
}

#tbic {
  display: none;
}

#tb ul {
  display: inline-block;
  opacity: 1;
  top: 0;
  height: 4.2em;
  margin: 0 auto;
  padding: 0;
  border-right: 1px solid rgba(255,255,255,0.2);
  border-left: 1px solid rgba(0,0,0,0.2);
}

#tb ul.ls {
  border-right: 1px solid rgba(0,0,0,0.2);
}

#tb li {
  display: inline-block;
  height: 4.2em;
  line-height: 4.2em;
  vertical-align: top;
  color: #262626;
  text-shadow: 0 1px 1px rgba(255,255,255,0.4);
  border-left: 1px solid rgba(255,255,255,0.2);
  border-right: 1px solid rgba(0,0,0,0.2);
}

#tb li.nts {
  border-left: 1px solid rgba(0,0,0,0.2);
}

#tb li.sel {
  display: inline-block;
  height: 4.5em;
  line-height: 4.2em;
  color: #262626;
  text-shadow: 0 1px 1px rgba(255,255,255,0.4);
  border-left: 1px solid rgba(255,255,255,0.2);
  border-right: 1px solid rgba(0,0,0,0.2);
  background: #858585;
  background: -moz-linear-gradient(top, #e5e673 0%, #a8a93c 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e673), color-stop(100%, #a8a93c));
  background: -webkit-linear-gradient(top, #e5e673 0%, #a8a93c 100%);
  background: -o-linear-gradient(top, #e5e673 0%, #a8a93c 100%);
  background: -ms-linear-gradient(top, #e5e673 0%, #a8a93c 100%);
  background: linear-gradient(to bottom, #e5e673 0%, #a8a93c 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e673', endColorstr='#a8a93c', GradientType=0);
  -moz-border-radius: 0 0 4px 4px;
  -webkit-border-radius: 0 0 4px 4px;
  -khtml-border-radius: 0 0 4px 4px;
  border-radius: 0 0 4px 4px;
  -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.4);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

#tb a {
  display: inline-block;
  position: relative;
  height: 4.2em;
  line-height: 4.2em;
  color: #262626;
  text-shadow: 0 1px 1px rgba(255,255,255,0.4);
  padding: 0 2em;
  text-decoration: none;
  z-index: 4;
}

#tb a:hover {
  color: #e6f950;
  text-shadow: 0 0 12px rgba(136,204,223,1), 0 -1px 1px rgba(0,0,0,0.6);
}

#p {
  height: 250px;
}

.picr {
  position: absolute;
  width: 70%;
  left: 300px;
  margin-top: -147px;
}

.pics {
  position: absolute;
  width: 70%;
  left: 300px;
}

#bkc {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 250px;
}

#bk {
  position: absolute;
  background: url(../img/pbk.jpg);
  width: 100%;
  height: 250px;
}

#bkarc {
  position: absolute;
  margin-top: 15px;
  width: 68%;
  height: 94px;
  z-index: 1;
  overflow: hidden;
}

#bkar {
  position: absolute;
  background: url(../img/pho.png);
  width: 200%;
  height: 94px;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
  z-index: 1;
}

#pl {
  float: right;
  background: url(../img/po.jpg);
  width: 546px;
  height: 250px;
}

#plgc {
  position: absolute;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
}

#plg {
  position: relative;
  float: right;
  background: url(../img/po.jpg) 0 -250px;
  width: 546px;
  height: 250px;
  z-index: 1;
  filter: inherit;
}

#ls {
  position: relative;
  margin: 65px 546px 0 0;
  background: url(../img/pbk.jpg) 0 -250px;
  height: 120px;
  filter: inherit;
}

#lsl {
  position: absolute;
  margin: 65px 0 0 -300px;
  background: url(../img/pbk.jpg) 0 -250px;
  width: 300px;
  height: 120px;
  filter: inherit;
}

#shc {
  position: relative;
  z-index: 3;
  float: right;
  width: 546px;
  height: 545px;
  overflow: hidden;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
}

#sh {
  position: absolute;
  background: url(../img/pgl.png);
  width: 546px;
  height: 545px;
  -webkit-animation-name: spinl;
  -webkit-animation-duration: 420s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transition-timing-function: linear;
  -moz-animation-name: spinl;
  -moz-animation-duration: 420s;
  -moz-animation-iteration-count: infinite;
  -moz-transition-timing-function: linear;
  -o-animation-name: spinl;
  -o-animation-duration: 420s;
  -o-animation-iteration-count: infinite;
  -o-transition-timing-function: linear;
  -ms-animation-name: spinl;
  -ms-animation-duration: 420s;
  -ms-animation-iteration-count: infinite;
  -ms-transition-timing-function: linear;
  animation-name: spinl;
  animation-duration: 420s;
  animation-iteration-count: infinite;
  transition-timing-function: linear;
}

#st {
  position: absolute;
  background: url(../img/pgl.png) 0 -545px;
  width: 546px;
  height: 545px;
  -webkit-animation-name: spinr;
  -webkit-animation-duration: 480s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transition-timing-function: linear;
  -moz-animation-name: spinr;
  -moz-animation-duration: 480s;
  -moz-animation-iteration-count: infinite;
  -moz-transition-timing-function: linear;
  -o-animation-name: spinr;
  -o-animation-duration: 480s;
  -o-animation-iteration-count: infinite;
  -o-transition-timing-function: linear;
  -ms-animation-name: spinr;
  -ms-animation-duration: 480s;
  -ms-animation-iteration-count: infinite;
  -ms-transition-timing-function: linear;
  animation-name: spinr;
  animation-duration: 480s;
  animation-iteration-count: infinite;
  transition-timing-function: linear;
}

#cdiv {
  height: 1.4em;
  background: #ffd700;
  background: -moz-linear-gradient(top, #757c03 0%, #670202 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #757c03), color-stop(100%, #670202));
  background: -webkit-linear-gradient(top, #757c03 0%, #670202 100%);
  background: -o-linear-gradient(top, #757c03 0%, #670202 100%);
  background: -ms-linear-gradient(top, #757c03 0%, #670202 100%);
  background: linear-gradient(to bottom, #757c03 0%, #670202 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#757c03', endColorstr='#670202', GradientType=0);
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #111;
}

#nlbc {
  font-family: 'Raleway', sans-serif;
  font-size: 1.4em;
  line-height: 2.2em;
  background: #feeab9;
  background: -moz-linear-gradient(top, #feeab9 0%, #e7edfe 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #feeab9), color-stop(100%, #e7edfe));
  background: -webkit-linear-gradient(top, #feeab9 0%, #e7edfe 100%);
  background: -o-linear-gradient(top, #feeab9 0%, #e7edfe 100%);
  background: -ms-linear-gradient(top, #feeab9 0%, #e7edfe 100%);
  background: linear-gradient(to bottom, #feeab9 0%, #e7edfe 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#feeab9', endColorstr='#e7edfe', GradientType=0);
  border-bottom: 1px solid #feeab9;
  }

#nlb {
  padding: 0.5em 20%;
  position: relative;
  z-index: 4;
}

#chl {
  display: block;
  position: relative;
  z-index: 5;
  float: right;
  background: url(../img/ic.png);
  margin: 1em 1em 0 0;
  width: 54px;
  height: 26px;
}

#chl.en {
  background-position: 0 -75px;
}

#chl.es {
  background-position: -54px -75px;
}

#c {
  font-family: 'Raleway', sans-serif;
  font-size: 1.2em;
  text-align: justify;
  line-height: 2.2em;
  background: #fff;
  margin: 3em 20% 10em;
}

#ft {
  font-family: 'Raleway', sans-serif;
  font-size: 1em;
  line-height: 1.6em;
  background: #444;
  background: #333;
  background: -moz-linear-gradient(top, #ffe354 0%, #b69a02 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffe354), color-stop(100%, #b69a02));
  background: -webkit-linear-gradient(top, #ffe354 0%, #404547 100%);
  background: -o-linear-gradient(top, #ffe354 0%, #b69a02 100%);
  background: -ms-linear-gradient(top, #ffe354 0%, #b69a02 100%);
  background: linear-gradient(to bottom, #ffe354 0%, 
  100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe354', endColorstr='#b69a02', GradientType=1);
  -moz-box-shadow: inset 0 20px 20px -20px rgba(182,154,2,0.5);
  -webkit-box-shadow: inset 0 20px 20px -20px rgba(182,154,2,0.5);
  box-shadow: inset 0 30px 30px -30px rgba(182,154,2,0.5);
}

#ftln {
  position: relative;
  top: 3em;
  height: 2em;
  background: rgba(255, 255, 255, 0.05);
}

#ftc {
  padding: 4em 20%;
}

#ft h1, #ft h2 {
  text-align: left;
  text-transform: uppercase;
  font-family: 'Oswald', sans-serif;
  letter-spacing: 0.02em;
  color: #daeaf2;
  line-height: 1.2em;
  margin: 0.5em 0;
  padding: 0;
  background: transparent;
  border: 0;
  position: static;
  display: block;
  -moz-box-shadow: 0 0 0 transparent;
  -webkit-box-shadow: 0 0 0 transparent;
  box-shadow: 0 0 0 transparent;
}

#ft h1 {
  font-size: 1.2em;
  text-shadow: none;
}

#ft h2 {
  font-size: 1em;
  text-shadow: none;
}

#ft ul {
  margin: 0;
  padding-left: 2em;
  list-style-type: none;
}

#ft li {
  margin: 0;
  padding: 0;
}

#ft a, #ft a:hover {
  display: block;
  color: #d0e6f2; 
  text-decoration: none;
}

#ft a span {
  position: relative;
  left: 0;
  filter: alpha(opacity=60);
  -moz-opacity: 0.6;
  -khtml-opacity: 0.6;
  opacity: 0.6;
}

#ft abbr {
 border-bottom: 1px dotted #78868c;
}

#ftc1 {
  width: 30%;
  float: left;
}

#ftc2 {
  width: 30%;
  margin: 0 5%;
  float: left;
}

#ftc3 {
  width: 30%;
  float: left;
}

#ftb {
  clear: both;
}

/******************************************/
/***************  CONTENT  ****************/
/******************************************/

h1, h2, h3, h4 {
  text-transform: uppercase;
  font-family: 'Oswald', sans-serif;
  letter-spacing: 0.02em;
}

h1, h2 {
  display: inline-block;
  position: relative;
  left: -22%;
  padding: 0.2em 1em 0.2em 22%;
  border: 3px solid #fff;
  border-left: 0;
  text-align: left;
  color: #eaf905;
  text-shadow: 1px 1px 1px rgba(255,255,255,0.6);
  -moz-border-radius: 0 4px 4px 0;
  -webkit-border-radius: 0 4px 4px 0;
  -khtml-border-radius: 0 4px 4px 0;
  border-radius: 0 4px 4px 0;
  -moz-box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.17);
  -webkit-box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.17);
  box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.17);
  background: -moz-linear-gradient(left, #fdfdd0 0%, #fdfe9f 100%);
  background: -webkit-gradient(linear, left, right, color-stop(0%, #fdfdd0), color-stop(100%, #fdfe9f));
  background: -webkit-linear-gradient(left, #fdfdd0 0%, #fdfe9f 100%);
  background: -o-linear-gradient(left, #fdfdd0 0%, #fdfe9f 100%);
  background: -ms-linear-gradient(left, #fdfdd0 0%, #fdfe9f 100%);
  background: linear-gradient(to right, #fdfdd0 0%, #fdfe9f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdd0', endColorstr='#fdfe9f', GradientType=1);
}

h1 {
  font-size: 3em;
  line-height: 1.5em;
}

h2 {
  font-size: 2.5em;
  line-height: 1.5em;
}

h3 {
  font-size: 2em;
  line-height: 1.5em;
  color: #526ecc;
}

h4 {
  font-size: 1.5em;
  line-height: 1.5em;
  color: #6689fe;
}

h1 .typ {
  font-size: 0.7em;
  padding: 0 0.2em;
  vertical-align: top;
}

a {
  text-decoration: none;
  color: #0065cc;
}

a:hover {
  text-decoration: underline;
}

p {
  text-indent: 4em;
}

address.hq {
  text-align: right;
}

#tt {
  margin-top: 2em;
}

img.menuimg {
}

img.flr {
 float: right;
 margin: 0 0 0.5em 2em;
}

img.fll {
 float: left;
 margin: 0 2em 0.5em 0;
}

abbr {
 border-bottom: 1px dotted #0065cc;
 text-decoration: none;
}

code {
  text-indent: 0;
}

code rt {
  font-family: 'Raleway', sans-serif;
}

code.attr, code.elem {
  font-family: "Courier New";
  font-size: 0.95em;
  vertical-align: middle;
  padding: 0.2em 0.4em;
  background: rgba(0, 0, 0, 0.07);
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
}

code.rbln ruby {
  margin-right: 0.5em;
}

code.rbln rt {
  border-bottom: 1px solid #eaf905;
}

code.elem:before {
  content: '<';
}

code.elem:after {
  content: '>';
}

code .nm {
  color: #3d4766;
}

code .opt {
  color: #888;
}

table.def {
  border-collapse: collapse;
  border-top: 2px solid #fdfe9f;
  width: 100%;
}

.def .ttl {
 background: #88a3bf;
}

.def h3 {
  display: block;
  position: static;
  left: 0;
  margin: 0;
  padding: 0;
  border: 0;
  color: #fff;
  font-size: 1.5em;
  text-shadow: none;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  -khtml-border-radius: 0;
  border-radius: 0;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: transparent;
  filter: none;
}

table.def th {
  padding: 0.5em 1.5em;
  border-bottom: 1px solid #fff;
  color: #fff;
  background: #546b83;
}

table.def tr {
  cursor: pointer;
  padding: 1em 2em;
  border-bottom: 1px solid #fff;
  background: #fdfdd0;
  background: -moz-linear-gradient(top, #fce3bd 0%, #fdfdd0 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fce3bd), color-stop(100%, #fdfdd0));
  background: -webkit-linear-gradient(top, #fce3bd 0%, #fdfdd0 100%);
  background: -o-linear-gradient(top, #fce3bd 0%, #fdfdd0 100%);
  background: -ms-linear-gradient(top, #fce3bd 0%, #fdfdd0 100%);
  background: linear-gradient(to bottom, #fce3bd 0%, #fdfdd0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fce3bd', endColorstr='#fdfdd0', GradientType=0);
}

table.def tr.ho {
  background: #feeab9;
  background: -moz-linear-gradient(top, #fdfe9f 0%, #feeab9 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fdfe9f), color-stop(100%, #feeab9));
  background: -webkit-linear-gradient(top, #fdfe9f 0%, #feeab9 100%);
  background: -o-linear-gradient(top, #fdfe9f 0%, #feeab9 100%);
  background: -ms-linear-gradient(top, #fdfe9f 0%, #feeab9 100%);
  background: linear-gradient(to bottom, #fdfe9f 0%, #feeab9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfe9f', endColorstr='#feeab9', GradientType=0);
}

table.def tr.ns {
  color: #888;
  padding: 1em 2em;
  border-bottom: 1px solid #fff;
  background: #f3f3f3;
  background: -moz-linear-gradient(top, #ddd 0%, #e7e7e7 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ddd), color-stop(100%, #e7e7e7));
  background: -webkit-linear-gradient(top, #ddd 0%, #e7e7e7 100%);
  background: -o-linear-gradient(top, #ddd 0%, #e7e7e7 100%);
  background: -ms-linear-gradient(top, #ddd 0%, #e7e7e7 100%);
  background: linear-gradient(to bottom, #ddd 0%, #e7e7e7 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#e7e7e7', GradientType=0);
}

table.def tr.curd {
  cursor: default;
}

table.def tr.ns a {
  color: #aaa;
}

table.def td {
  padding: 0.5em 1.5em;
  border-bottom: 1px solid #fff;
}

table.def td.img {
  padding: 0;
  text-align: center;
}

table.def th.img {
  padding: 0.5em 0.5em;
  text-align: center;
}

table.def .h2lg {
  display: inline-block;
  width: 25px;
  height: 35px;
  vertical-align: middle;
  background: url(../img/ic.png);
}

table.def .h3lg {
  display: inline-block;
  width: 25px;
  height: 35px;
  vertical-align: middle;
  background: url(../img/ic.png) -25px 0;
}

table.def .h4lg {
  display: inline-block;
  width: 25px;
  height: 35px;
  vertical-align: middle;
  background: url(../img/ic.png) -50px 0;
}

table.def .h5lg {
  display: inline-block;
  width: 25px;
  height: 35px;
  vertical-align: middle;
  background: url(../img/ic.png) -75px 0;
}

table.def tr.ns .h2lg {
  background: url(../img/ic.png) 0 -35px;
}

table.def tr.ns .h3lg {
  background: url(../img/ic.png) -25px -35px;
}

table.def tr.ns .h4lg {
  background: url(../img/ic.png) -50px -35px;
}

table.def tr.ns .h5lg {
  background: url(../img/ic.png) -75px -35px;
}

.toc {
  display: inline-block;
  padding: 1.8em 2em 2em;
  border: 1px solid #f2cbaa;
  background: #f2eee9;
  min-width: 40%;
  text-align: left;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 0 0 8em #fce3bd;
  -webkit-box-shadow: inset 0 0 8em #fce3bd;
  box-shadow: inset 0 0 8em #fce3bd;
}

.toc p {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  font-size: 1.4em;
  font-weight: bold;
  color: #eaf905;
  text-indent: 0;
  margin: 0 0 0.5em;
}

.toc ul {
  margin: 0;
  padding-left: 1em;
  list-style-type: none;
}

.toc ul.m2 a {
  padding: 0.5em 0 0 3.2em;
}

.toc ul.m3 a {
  padding: 0.5em 0 0 4.2em;
}

.toc li {
  position: relative;
}

.toc .num {
  line-height: 1em;
  display: inline-block;
  padding: 0.7em 0.2em 0.2em;
  width: 2em;
  height: 1em;
  background: #c8b7a5;
  color: #fff;
  text-align: right;
  vertical-align: bottom;
}

.toc a {
  position: relative;
  line-height: 1.9em;
  padding-top: 1em;
  display: block;
  color: #eaf905;
  text-decoration: none;
}

.toc a .mul {
  line-height: 1.9em;
  display: inline-block;
  border-bottom: 1px solid #c8b7a5;
  padding: 0 1em 0;
}

.toc a:hover {
  color: #0b2a4b;
}

.toc a.mn:hover .mul {
  border-bottom: 1px solid #eaf905;
}

.toc a.mn:hover .num {
  background: #eaf905;
  border-bottom: 1px solid #eaf905;
}

pre {
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
}

pre.cdv {
  clear: both;
  position: relative;
  display: block;
  border: 1px solid #aaa;
  border-left: 5px solid #eaf905;
  margin: 0;
  background: #f6f6f6;
  overflow: hidden;
  text-align: left;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}

pre.cdv code {
  font-family: "Courier New";
}

div.cdv {
  margin: 0 1em;
  padding-top: 1px;
  border: 1px solid #f2cbaa;
  border-top: 0;
  background: #f2eee9;
  -moz-border-radius: 0 0 4px 4px;
  -webkit-border-radius: 0 0 4px 4px;
  -khtml-border-radius: 0 0 4px 4px;
  border-radius: 0 0 4px 4px;
  -moz-box-shadow: inset 0 0 8em #fce3bd;
  -webkit-box-shadow: inset 0 0 8em #fce3bd;
  box-shadow: inset 0 0 8em #fce3bd;
}

div.cdv div.cdvm {
  margin: 1em 2em;
}

div.cdv a {
  color: #885301;
  text-decoration: underline;
}

div.cdv h1, div.cdv h2, div.cdv h3, div.cdv h4 {
  text-align: left;
  text-transform: uppercase;
  font-family: 'Oswald', sans-serif;
  letter-spacing: 0.02em;
  color: #222;
  line-height: 1.2em;
  margin: 0.5em 0;
  padding: 0;
  background: transparent;
  border: 0;
  position: static;
  display: block;
  -moz-box-shadow: 0 0 0 transparent;
  -webkit-box-shadow: 0 0 0 transparent;
  box-shadow: 0 0 0 transparent;
}

div.cdv h1 {
  font-size: 2.6em;
}

div.cdv h2 {
  font-size: 2.2em;
}

div.cdv h3 {
  font-size: 1.8em;
}

div.cdv h4 {
  font-size: 1.4em;
}

div.cdv p {
  text-indent: 0;
}

div.cdv button {
  font-size: 0.95em;
  padding: 0.5em 0.8em;
}

div.cdv input {
  font-size: 0.95em;
  padding: 0.2em 0.5em;
}

div.cdv kbd {
  font-size: 1em;
  padding: 0;
  color: #000;
  background: transparent;
  border: 0;
}

.cdvt {
  margin: 0;
  line-height: 1.8em;
}

.cdvt span {
  display: inline-block;
  text-indent: 0;
  line-height: 1.8em;
  padding: 0 2em;
  color: #222;
  background: #ccc;
  text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
  border: 1px solid #aaa;
  border-bottom: 0;
  -moz-border-radius: 4px 4px 0 0;
  -webkit-border-radius: 4px 4px 0 0;
  -khtml-border-radius: 4px 4px 0 0;
  border-radius: 4px 4px 0 0;
}

.ntm {
  margin-top: 0;
}

.cc {
 font-size: 0.7em;
 margin: 0;
}

kbd {
  font-size: 0.8em;
  padding: 0.2em 0.5em;
  color: #222;
  background: #ccc;
  border: 1px solid #aaa;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -khtml-border-radius: 3px;
  border-radius: 3px;
}

.inf {
  min-height: 4.2em;
  padding: 0.6em 1.2em 0.8em;
  border: 1px solid #a3cd52;
  color: #405e07;
  background: #eaffc0;
  text-indent: 0;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 0 0 8em #b5dc68;
  -webkit-box-shadow: inset 0 0 8em #b5dc68;
  box-shadow: inset 0 0 8em #b5dc68;
}

.inf .img {
  float: left;
  margin: 0 2em 0 0;
  width: 63px;
  height: 75px;
  background: url(../img/ic.png) -125px 0;
}

.wrn {
  min-height: 4.2em;
  padding: 0.6em 1.2em 0.8em;
  border: 1px solid #f9a08f;
  color: #c6361a;
  background: #ffebe7;
  text-indent: 0;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 0 0 8em #f8a797;
  -webkit-box-shadow: inset 0 0 8em #f8a797;
  box-shadow: inset 0 0 8em #f8a797;
}

.wrn .img {
  float: left;
  margin: 0 2em 0 0;
  width: 63px;
  height: 75px;
  background: url(../img/ic.png) -188px 0;
}

.alr {
  min-height: 4.2em;
  padding: 0.6em 1.2em 0.8em;
  border: 1px solid #d9d733;
  color: #74730a;
  background: #ffffd8;
  text-indent: 0;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 0 0 8em #e3e161;
  -webkit-box-shadow: inset 0 0 8em #e3e161;
  box-shadow: inset 0 0 8em #e3e161;
}

.alr .img {
  float: left;
  margin: 0 2em 0 0;
  width: 63px;
  height: 75px;
  background: url(../img/ic.png) -251px 0;
}

.msl {
  width: 80%;
}

.msc {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}

.msr {
  width: 80%;
  margin-left: auto;
}

.msr .img {
  float: right;
  margin: 0 0 0 2em;
}

details.attr, details.oh5attr {
  padding: 0.8em;
  border: 1px solid #ccc;
  background: #f6f6f6;
  margin-bottom: 1em;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 0 0 8em #ddd;
  -webkit-box-shadow: inset 0 0 8em #ddd;
  box-shadow: inset 0 0 8em #ddd;
}

details.attr[open], details.oh5attr[open], details.attr.open, details.oh5attr.open {
  padding: 1.8em;
}

details.attr summary, details.oh5attr summary {
  padding-left: 1em;
}

details.attr h4, details.oh5attr h4 {
  vertical-align: middle;
  cursor: pointer;
  display: inline;
  color: #526ecc;
}

details.oh5attr h4 {
  color: #f77878;
}

details, summary {
  display: block;
}

.no-details details.crossbrowser > summary::before {
  content: "►";
  margin-right: 0.75em;
}

.no-details details.crossbrowser.open > summary::before {
  content: "▼";
  margin-right: 0.75em;
}

.no-details details.crossbrowser > * {
  display: none;
}

.no-details details.crossbrowser > summary {
  display: block;
  cursor: pointer;
}

.oh5i {
  float: right;
  margin: 0.1em 0.2em 0 0;
  width: 25px;
  height: 35px;
  background: url(../img/ic.png) -100px 0;
}

.nbm {
  margin-bottom: 0;
}

#canvas2 {
 background: #fff;
 cursor: pointer;
}

.egt th {
 padding: 0.2em 0.8em;
 border: 1px solid rgba(20, 50, 90, 0.25);
 background: rgba(0, 102, 255, 0.25);
 text-align: center;
}

.egt td {
 padding: 0.2em 0.8em;
 border: 1px solid rgba(16, 76, 167, 0.25);
 background: rgba(90, 156, 255, 0.25);
 text-align: left;
}

.egt .nbk {
 background: transparent;
 border: 0;
}

.tar {
 text-align: right;
}

.tac {
 text-align: center;
}

.exampledialog, .dialogoejemplo {
 text-align: right;
 border: 1px solid #888;
 -moz-border-radius: 6px;
 -webkit-border-radius: 6px;
 -khtml-border-radius: 6px;
 border-radius: 6px;
 -moz-box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.4);
 -webkit-box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.4);
 box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
}

.pnav, .ntnav {
  font-family: "Oswald", sans-serif;
  text-transform: uppercase;
  font-size: 1.5em;
  line-height: 1.8em;
}

.pnav {
  margin: 4em 0;
  text-align: center;
}

.ntnav {
  margin: 1em 0;
  text-align: right;
}

.pnav p, .ntnav p {
  text-indent: 0;
}

.pnav span {
  display: inline-block;
  min-width: 0.6em;
  text-align: center;
  margin: 0 0.1em;
  padding: 0 0.65em;
  color: #f6f6f6;
  border: 1px solid #f2cbaa;
  background: #485054;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  cursor: default;
}

.pnav a, .ntnav a {
  display: inline-block;
  min-width: 0.6em;
  text-align: center;
  margin: 0 0.1em;
  padding: 0 0.65em;
  color: #4c73fc;
  border: 1px solid #f2cbaa;
  background: #fce3bd;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
}

.pnav a:hover, .ntnav a:hover {
  text-decoration: none;
  background: #cfd9fc;
}

table.chr tr {
  display: inline-block;
  text-align: center;
  width: 10em;
  height: 9em;
  margin: 0.2em;
  padding: 0;
  position: relative;
}

table.chr tr:hover {
  z-index: 1;
}
  
table.chr tr td {
  display: block;
  position: relative;
  top: 1px;
  left: 1px;
  width: 10em;
  border: 0;
  line-height: 1em;
}

table.chr tr:hover td {
  top: -1.5em;
  left: -1.5em;
  width: 13em;
}
  
table.chr tr code {
  padding: 0.2em;
}
  
table.chr tr span.ch {
  display: block;
  position: relative;
  padding: 0.2em;
  margin: 1px 0 0 1px;
  font: 1.8em "Georgia", "Apple Symbols", serif;
}

table.chr tr:hover span.ch {
  font: 2.6em "Georgia", "Apple Symbols", serif;
  position: relative;
  background-color: #546b83;
  color: #fff;
}

table.chr tr span.ch:before, .chr tr span.ch:after {
  content: "\00a0";
}

table.chr tr span.bk {
  display: block;
  width: 10em;
  height: 9em;
  position: absolute;
  border: 1px solid #c3d2e9;
  background: #d6e6ff;
}

table.chr tr:hover span.bk {
  width: 13em;
  height: 12em;
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

table.chr tr td.hex, table.chr tr td.dec {
  display: none;
}

table.chr tr:hover td.hex, table.chr tr:hover td.dec {
  display: block;
}

table.ce, table.countryc {
  margin: auto;
}

table.ce tbody, table.countryc tbody {
  display: table-cell;
  vertical-align: top;
}

#ccb {
  cursor: default;
  background: #ddd;
  padding: 2em;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid transparent;
}

#ccbcol {
  float: right;
  left: 1.5em;
}

#cct {
  display: inline-block;
  margin-top: 0;
  margin-bottom: 0.4em;
  font-size: 3em;
  text-indent: 0;
  color: #222;
  border: 1px solid transparent;
}

#cctcol {
  top: -0.4em;
  font-size: 0.333em;
}

#ccrpb {
  float: right;
  width: 30%;
  margin: 0 0 1em 2em;
  padding: 1em 1em 0.3em;
  background: #888;
  color: #eee;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid transparent;
}

#ccrpbcol {
  float: right;
  top: 1em;
}

#ccrpt {
  display: inline-block;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.5em;
  text-indent: 0;
  border: 1px solid transparent;
}

#ccrptcol {
  top: -0.15em;
  font-size: 0.666em;
}

#ccrpp {
  text-indent: 0;
  margin-bottom: 0;
  border: 1px solid transparent;
}

#ccp {
  border: 1px solid transparent;
}

#ccpcol {
  top: -0.1em;
}

#ccbcol, #cctcol, #ccrpbcol, #ccrptcol, #ccrppcol, #ccpcol {
  position: relative;
  padding: 0.2em 0.4em;
  line-height: 1em;
  color: #222;
  border: 1px solid #888;
  background: #ccc;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
}

.cvl {
  float: left;
  width: 49%;
  text-align: center;
}

.cvr {
  float: right;
  width: 49.5%;
  text-align: center;
}

#selCol, #curCol {
  padding: 1em 0;
}

#colorChart {
  width: 100%;
  clear: both;
  margin-top: 0.5em;
}

#grayChart {
  width: 100%;
}

#colorChart, #grayChart, #selCol, #curCol {
  border: 1px solid #444;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
}

ul.dirtree {
  list-style-type: none;
  padding: 0;
  margin: 0;
  line-height: 1.25em;
  position: relative;   
  overflow:hidden;    
}

ul.dirtree ul {
  list-style-type: none;
  margin: 0 0 0 1.3em;
  padding: 0;
  position: relative;   
  overflow:hidden;    
}

ul.dirtree li {
  margin: 0;
  padding: 0.6em 1.5em 0;
  position: relative;   

  //padding: 0.6em 0 0 1.3em;
  //clear: both;
}

ul.dirtree .type {
  color: #670202;
}

.dirtree li::before, .dirtree li::after {
  content: '';
  position: absolute;
  left: 0;
}

/* horizontal line on inner list items */
.dirtree ul li::before {
  border-bottom: 2px solid #999;
  top: 0.6em;
  width: 1.3em;
  height: 20px;
  padding-top: 0.6em;
  top: 0;
}

.dirtree li.hlth::before {
  border-bottom: 4px solid #ff0000;
  border-left: 4px solid #ff0000;
  top: 0.6em;
  width: 1.3em;
  height: 20px;
  padding-top: 0.6em;
  top: 0;
  z-index: 1;
}

/* vertical line on list items */   
.dirtree li::after {
  border-left: 2px solid #999;
  height: 100%;
  width: 0px;
  top: -20px; 
}

.dirtree li.hltv::after {
  border-left: 4px solid #ff0000;
}

.dirtree li span.arrr {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 18px;
  border-color: transparent transparent transparent #ff0000;
  display: block;
  position: absolute;
  left: -12px;
  top: 16px;
  -webkit-transform: rotate(360deg);
}

.dirtree li span.arru {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 6px 18px 6px;
  border-color: transparent transparent #ff0000 transparent;
  display: block;
  position: absolute;
  left: 1.3em;
  margin-left: -4px;
  top: 32px;
  -webkit-transform: rotate(360deg);
}

/* lower line on list items from the first level because they don't have parents */
.dirtree > li::after {
  top: 20px;
}

/* hide line from the last of the first level list items */
.dirtree > li:last-child::after {
  display: none;
}

ul.dirtree .icon {
  float: left;
  clear: both;
  margin-right: 0.2em;
  height: 40px;
  width: 40px;
  background-image: url(../img/tree-icons.gif);
  font-weight: bold;
  text-align: center;
  line-height: 40px;
  position: relative;
}

ul.dirtree .folder {
  background-position: 0 -40px;
}

ul.dirtree .imgfolder {
  background-position: 0 -80px;
}

ul.dirtree .vidfolder {
  background-position: 0 -120px;
}

ul.dirtree .jpeg {
  background-position: 0 -160px;
}

ul.dirtree .html {
  background-position: 0 -200px;
}

ul.dirtree .sel {
  background-position: -40px 0;
}

ul.dirtree .foldersel {
  background-position: -40px -40px;
}

ul.dirtree .imgfoldersel {
  background-position: -40px -80px;
}

ul.dirtree .vidfoldersel {
  background-position: -40px -120px;
}

ul.dirtree .jpegsel {
  background-position: -40px -160px;
}

ul.dirtree .htmlsel {
  background-position: -40px -200px;
}

.wcaghide {
  display: none;
}

#donfrm {
  text-align: center;
}

#donfrm div {
  text-align: left;
  display: inline-block;
  padding: 1.8em 2em 2em;
  border: 1px solid #f2cbaa;
  background: #f2eee9;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 0 0 8em #fce3bd;
  -webkit-box-shadow: inset 0 0 8em #fce3bd;
  box-shadow: inset 0 0 8em #fce3bd;
}

#donfrm p {
  text-indent: 0;
}

#donfrm form {
  text-align: center;
}

#donfrm .title {
  text-align: center;
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  font-size: 1.4em;
  font-weight: bold;
  color: #eaf905;
  text-indent: 0;
  margin: 0 0 0.5em;
}

#donfrm span {
  color: #5B9112;
  font-weight: bold;
  text-shadow: 0 0 0.2em rgba(224, 255, 224, 0.99);
}

/**************************************************/
/***************  RUBY ANNOTATIONS  ***************/
/**************************************************/

/* Ruby text*/
body.notIE ruby.comp {
  display: inline-table;
  text-align: center;
  border-collapse: collapse;
  border: none;
  /* border collapse mechanism
   will be used to adjust vertical alignment */
  vertical-align: middle;
  /* if ruby text contains text only
   and there are two ruby annotations
   (one placed above the base and one below)
   then vertical centering roughly aligns baseline of
   base with baseline of parent */
  border-bottom: solid 0.75em transparent;
  /* 0.75em is height of ruby text (0.5000d7 1.2em = 0.6em)
   plus space between baseline and text-bottom (about 0.15em)
   this extra border is counter-weight used
   to restore vertical centering broken
   by presence of ruby text
   (in case if there is only one ruby annotation,
   if there are two annotations
   then counter-weight is no longer
   necessary and can be annihilated
   using border collapse mechanism) */
}

/* Fixed problem with IE8 and the rtc tag */
body.ie8 ruby.comp rtc {
	display: ruby-text;
	border: solid 1px black;
}


body.notIE ruby.comp > rt, body.notIE ruby.comp rtc {
  display: table-header-group;
}

/* used to move first ruby
 container above the base */
body.notIE ruby.comp > rb, body.notIE ruby.comp rbc, ruby.comp > rt + rt, body.notIE ruby.comp rtc + rtc {
  display: table-row;
}

/* base and second ruby
 are formatted as table-rows */
body.notIE ruby.comp > rt + rt, body.notIE ruby.comp rtc + rtc {
  border-bottom: hidden;
}

/* if there are two annotations then extra
 border is no longer necessary
 and can be annihilated
 using border collapse mechanism */
body.notIE ruby.comp rb, ruby.comp rbc, body.notIE ruby.comp rt, ruby.comp rtc {
  white-space: nowrap;
}

/* prohibits line breaks inside ruby text */
body.notIE ruby.comp rtc > rt, body.notIE ruby.comp rbc > rb {
  display: table-cell;
}

/* used to distribute annotations
 in table like manner */
body.notIE ruby.comp rtc > rt[rbspan] {
  column-span: attr(rbspan);
}

/* ruby text may span several cells */
body.notIE ruby.comp > rt, body.notIE ruby.comp rtc {
  font-size: 0.5em;
  line-height: 1.2em;
}

body.notIE code ruby.comp > rt, body.notIE ruby.comp rtc {
  font-size: 0.6em;
  line-height: 1.2em;
}

/* font-size of ruby text is reduced */
body.notIE ruby.comp rp {
  display: none;
}

/* Addition to add english rbc */
ruby.syllables ruby.comp rbc rb {
	
}

ruby.comp.syllables rbc rb:after {
	content: "·"
}

ruby.comp.syllables rbc rb:last-child:after {
	content: "";
}

ruby.comp.comp.syllables rtc rt {
	padding-right: 0.5em;
}

ruby.comp.syllables rtc rt:last-child {
	padding-right: 0;
}

/* Ensure text is readable by using a unicode */
body, ruby.comp.unicodeRubyText rt, ruby.comp.unicodeRubyBase rb {
	font-family: "Arial MS Unicode", sans-serif;
}

ruby.comp {
	ruby-align: center;
}

ruby.comp rt {
  color: #eaf905;
}

body.ie6 ruby.comp rt.small,
body.ie7 ruby.comp rt.small {
	padding: 0 1em;
}

/******************************************/
/***************  PRETTIFY  ***************/
/******************************************/

pre.cdv .str {
  color: #080;
}

pre.cdv .kwd {
  color: #008;
}

pre.cdv .com {
  color: #800;
}

pre.cdv .typ {
  color: #606;
}

pre.cdv .lit {
  color: #066;
}

pre.cdv .pun {
  color: #660;
}

pre.cdv .pln {
  color: #000;
}

pre.cdv .tag {
  color: #008;
}

pre.cdv .atn {
  color: #606;
}

pre.cdv .atv {
  color: #080;
}

pre.cdv .dec {
  color: #606;
}

pre.cdv code {
  display: block;
}

pre.cdv .ln {
  display: inline-block;
  width: 100%;
  background: #fce3bd;
}

pre.cdv .num {
  display: block;
  float: left;
  margin-right: 1em;
  width: 2.5em;
  text-align: right;
  display: inline-block;
  color: #eaf905;
}

pre.cdv .num:before {
  content: attr(data-num);
}

pre.cdv .ln1 {
  display: block;
  background: #f2f2f2;
  margin-left: 3em;
  padding: 0 1em 0;
}

pre.cdv .ln2 {
  display: block;
  background: #f6f6f6;
  margin-left: 3em;
  padding: 0 1em 0;
}

.autocomplete-suggestions {
  font-family: 'Raleway', sans-serif;
  font-size: 1.2em;
  border: 1px solid #999;
  background: #fff;
  overflow: auto;
}

.autocomplete-suggestion {
  padding: 2px 5px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
}

.autocomplete-selected {
  background: #e0e0e0;
}

.autocomplete-suggestions strong {
  font-weight: normal;
  color: #3399ff;
}

.autocomplete-group {
  padding: 2px 5px;
}

.autocomplete-group strong {
  display: block;
  border-bottom: 1px solid #000;
}

#language, #script, #region, #variant1, #variant2, #variant3 {
  text-indent: 0;
  text-align: left;
}

#extlang, #script, #region, #variant1, #variant2, #variant3 {
  display: none;
}

#language input, #extlang input, #script input, #region input, #variant1 input, #variant2 input, #variant3 input {
  width: 22em;
  font-size: 1em;
  font-family: 'Raleway', sans-serif;
  padding: 0.3em 0.5em;
  border: 1px solid #aaa;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
}

#language span, #extlang span, #script span, #region span, #variant1 span, #variant2 span, #variant3 span {
  text-indent: 0;
  line-height: 2.1em;
  padding: 0em 0.6em;
  color: #eaf905;
  border: 1px solid #fdfe9f;
  background: #fdfdd0;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
  cursor: default;
  display: none;
}

#language span span, #extlang span span, #script span span, #region span span, #variant1 span span, #variant2 span span, #variant3 span span {
  float: right;
  display: block;
  font-size: 1.8em;
  margin: 0 0 0 0.2em;
  padding: 0 0.2em;
  position: relative;
  left: 0.2em;
  border: none;
  font-weight: bold;
  line-height: 1.1em;
  cursor: pointer;
}

input.invalid {
  background: #ffcccc;
  border: 1px solid #cc8888 !important;
}

#langtag {
  display: block;
  color: #edf6a0;
  border: 1px solid #746d46;
  background: #998873;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
  text-align: center;
  font: bold 1.4em/1.8em "Courier New";
}

.cf p {
  text-indent: 0em;
  margin: 0.25em 0;
}

.cf .label {
  display: inline-block;
  line-height: 1.8em;
  padding: 0 2em;
  color: #704c2f;
  background: #f7e7d4;
  margin: 0 0 0 2em;
  text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
  border: 1px solid #f2cbaa;
  border-bottom: 0;
  -moz-border-radius: 4px 4px 0 0;
  -webkit-border-radius: 4px 4px 0 0;
  -khtml-border-radius: 4px 4px 0 0;
  border-radius: 4px 4px 0 0;
}

.cf .slt, .cf textarea {
  box-sizing: border-box;
  font-family: "Raleway", sans-serif;
  clear: both;
  position: relative;
  top: -4px;
  border: 1px solid;
  border-color: #aaa #ddd #ddd #aaa;
  font-size: 1.2em;
  margin: 0;
  padding: 0.5em 1em;
  width: 100%;
  background: #fafafa;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
}

.cf textarea {
  height: 10em;
}

.cf .sbt {
  font-family: "Raleway", sans-serif;
  font-size: 1.2em;
  padding: 0.5em 2em;
}

/******************************************/
/************  RESPONSIVENESS  ************/
/******************************************/

@media screen and (max-width: 2000px) {
  #nlb {
    padding: 0.5em 18%;
  }

  #c {
    margin: 3em 18% 10em;
  }

  #ftc {
    padding: 4em 18%;
  }
}

@media screen and (max-width: 1600px) {
  #nlb {
    padding: 0.5em 15%;
  }

  #c {
    margin: 3em 15% 10em;
  }

  #ftc {
    padding: 4em 15%;
  }

}

@media screen and (max-width: 1200px) {
  #nlb {
    padding: 0.5em 12%;
  }

  #c {
    margin: 3em 12% 10em;
  }

  #ftc {
    padding: 4em 12%;
  }

  h1 {
    font-size: 2.4em;
  }

  h2 {
    font-size: 2.1em;
  }

  h3 {
    font-size: 1.6em;
  }

  h4 {
    font-size: 1.3em;
  }

  div.cdv h1 {
    font-size: 2.5em;
  }

  div.cdv h2 {
    font-size: 2.1em;
  }

  div.cdv h3 {
    font-size: 1.7em;
  }

  div.cdv h4 {
    font-size: 1.3em;
  }
}

@media screen and (max-width: 900px) {
  #nlb {
    padding: 0.5em 8%;
  }

  #c {
    margin: 3em 8% 10em;
  }

  #ftc {
    padding: 4em 8%;
  }

  h1 {
    font-size: 2.3em;
  }

  h2 {
    font-size: 2em;
  }

  h3 {
    font-size: 1.7em;
  }

  h4 {
    font-size: 1.4em;
  }

  div.cdv h1 {
    font-size: 2.2em;
  }

  div.cdv h2 {
    font-size: 1.9em;
  }

  div.cdv h3 {
    font-size: 1.6em;
  }

  div.cdv h4 {
    font-size: 1.3em;
  }

  #tt .rc1 {
    display: none;
  }

  .msl {
    width: auto;
  }

  .msr {
    width: auto;
  }

}

@media screen and (max-width: 820px) {
  #tt .rc3 {
    display: none;
  }

  #ccrpb {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
  }
}

@media screen and (max-width: 720px) {
  img.menuimg {
    float: none !important;
    display: block;
    width: 100%;
    margin: 0 !important;
  }
}

@media screen and (max-width: 670px) {
  #mmct {
    display: none !important;
  }

  h1 {
    font-size: 2em;
  }

  h2 {
    font-size: 1.8em;
  }

  h3 {
    font-size: 1.6em;
  }

  h4 {
    font-size: 1.4em;
  }
  
  div.cdv h1 {
    font-size: 2.1em;
  }

  div.cdv h2 {
    font-size: 1.8em;
  }

  div.cdv h3 {
    font-size: 1.5em;
  }

  div.cdv h4 {
    font-size: 1.2em;
  }

  #ft ul {
    padding: 0;
  }
}

@media screen and (max-width: 620px) {
  #tt .rc4h {
    display: none;
  }

  #tt .rc0, #tt .rc4 {
    display: block;
    border-bottom: 0;
    line-height: 1.5em;
  }
}

@media screen and (max-width: 530px) {
  table.ce tbody {
    display: table-row-group;
  }
  
  table.ce tr.hh {
    display: none;
  }
  
  #ftc1, #ftc2, #ftc3 {
    float: none;
    width: 100%;
    margin: 0;
    text-align: center;
  }
  
  #ft h1 {
    text-align: center;
    margin-top: 2em;
  }
}

@media screen and (max-width: 480px) {
  #tb {
    height: 4.2em;
    line-height: 4.2em;
  }

  #tb ul {
    height: 4.2em;
  }

  #tb li {
    height: 4.2em;
    line-height: 4.2em;
  }

  #tb li.sel {
    height: 4.5em;
    line-height: 4.2em;
  }

  #tb a {
    height: 4.2em;
    line-height: 4.2em;
    padding: 0 1.5em;
  }

  .toc ul.m2 a {
    padding: 0.5em 0 0 2.5em;
  }

  #tt .rc4 {
    display: none;
  }
  
  .attr span.num, .oh5attr span.num {
    display: none;
  }
  
  .attr span.ln1, .attr span.ln2, .oh5attr span.ln1, .oh5attr span.ln2 {
    margin-left: 0;
  }
  
  .attr p.cdvt, .oh5attr p.cdvt {
    text-indent: 2em;
  }

  #language input, #extlang input, #script input, #region input, #variant1 input, #variant2 input, #variant3 input {
    width: 14em;
  }
}

@media screen and (max-width: 430px) {
  #lgsm {
    display: block !important;
  }
  
  #nlb {
    z-index: 0;
  }
  
  #tb {
    border: 0;
  }
  
  #tbic {
    display: block;
    cursor: pointer;
    font-size: 2em;
    position: relative;
    z-index: 2;
    padding-left: 1em;
    text-align: left;
    background: #fdfe9f;
    background: -moz-linear-gradient(top, #ffe354 0%, #b69a02 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffe354), color-stop(100%, #b69a02));
    background: -webkit-linear-gradient(top, #ffe354 0%, #b69a02 100%);
    background: -o-linear-gradient(top, #ffe354 0%, #b69a02 100%);
    background: -ms-linear-gradient(top, #ffe354 0%, #b69a02 100%);
    background: linear-gradient(to bottom, #ffe354 0%, #b69a02 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe354', endColorstr='#b69a02', GradientType=0);
    -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  }
  
  #tb ul {
    display: none;
    margin: 0 auto;
    width: 90%;
    height: auto;
    padding: 0;
    border: 0;
    position: relative;
    z-index: 1;
    top: -2em;
    background: #000;
    -moz-border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -khtml-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
  }

  #tb ul.ls {
    border: 0;
  }

  #tb li {
    display: block;
    height: 3em;
    line-height: 3em;
    color: #eee;
    text-shadow: 0;
    border: 0;
  }

  #tb li.nts {
    border: 0;
  }

  #tb li.sel {
    display: block;
    height: 3em;
    line-height: 3em;
    color: #eee;
    text-shadow: 0;
    border: 0;
    background: #eaf905;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -khtml-border-radius: 0;
    border-radius: 0;
  }

  #tb a {
    display: block;
    position: relative;
    height: 3em;
    line-height: 3em;
    color: #eee;
    padding: 0 1em;
    text-decoration: none;
    z-index: 0;
  }

  #tb a:hover {
    color: #fff;
    text-shadow: 0 0 12px rgba(255,255,255,1);
  }

  #nlb {
    padding-top: 0.2em;
    padding-bottom: 0.2em;
  }
  
  #c {
    margin-top: 1em;
    margin-bottom: 5em;
  }
  
  #p, #cdiv {
    display: none;
  }

  pre.cdv .num {
    display: none;
  }
  
  pre.cdv .ln1, pre.cdv .ln2 {
    margin-left: 0;
  }
  
  p.cdvt {
    text-indent: 2em;
  }
  
  #selColText, #curColText {
    display: block;
  }

}

@media screen and (max-width: 370px) {
  .toc ul.m2 a {
    padding: 0.5em 0 0 1em;
  }

}

@media screen and (max-width: 310px) {
  #tt .rc4 {
    display: none;
  }
  
  body {
    font-size: 11px;
  }
}

/******************************************/
/***************  ANIMATION  **************/
/******************************************/

@-webkit-keyframes spinr {
  from {
    -webkit-transform: rotate(0deg);
  }
  to { 
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes spinr {
  from {
    -moz-transform: rotate(0deg);
  }
  to { 
    -moz-transform: rotate(360deg);
  }
}

@-o-keyframes spinr {
  from {
    -o-transform: rotate(0deg);
  }
  to { 
    -o-transform: rotate(360deg);
  }
}

@-ms-keyframes spinr {
  from {
    -ms-transform: rotate(0deg);
  }
  to { 
    -ms-transform: rotate(360deg);
  }
}

@keyframes spinr {
  from {
    transform: rotate(0deg);
  }
  to { 
    transform: rotate(360deg);
  }
}

@-webkit-keyframes spinl {
  from {
    -webkit-transform: rotate(360deg);
  }
  to { 
    -webkit-transform: rotate(0deg);
  }
}

@-moz-keyframes spinl {
  from {
    -moz-transform: rotate(360deg);
  }
  to { 
    -moz-transform: rotate(0deg);
  }
}

@-o-keyframes spinl {
  from {
    -o-transform: rotate(360deg);
  }
  to { 
    -o-transform: rotate(0deg);
  }
}

@-ms-keyframes spinl {
  from {
    -ms-transform: rotate(360deg);
  }
  to { 
    -ms-transform: rotate(0deg);
  }
}

@keyframes spinl {
  from {
    transform: rotate(360deg);
  }
  to { 
    transform: rotate(0deg);
  }
}

.select
  {
  border: 1px solid #DBE1EB;
  font-size: 18px;
  font-family: Arial, Verdana;
  padding-left: 7px;
  padding-right: 7px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -o-border-radius: 4px;
  background: #FFFFFF;
  background: linear-gradient(left, #FFFFFF, #F7F9FA);
  background: -moz-linear-gradient(left, #FFFFFF, #F7F9FA);
  background: -webkit-linear-gradient(left, #FFFFFF, #F7F9FA);
  background: -o-linear-gradient(left, #FFFFFF, #F7F9FA);
  color: #2E3133;
  }
  
  .select:hover
  {
  border-color: #FBFFAD;
  }
  
  .select option
  {
  border: 1px solid #DBE1EB;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -o-border-radius: 4px;
  }
  
  .select option:hover
  {
  background: #FC4F06;
  background: linear-gradient(left, #FC4F06, #D85F2B);
  background: -moz-linear-gradient(left, #FC4F06, #D85F2B);
  background: -webkit-linear-gradient(left, #FC4F06, #D85F2B);
  background: -o-linear-gradient(left, #FC4F06, #D85F2B);
  font-style: italic;
  color: #FFFFFF;
  }