@charset "UTF-8";
/* http://css-tricks.com/things-it-might-be-funuseful-to-try-the-universal-selector-on/ */
/*http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; *behavior: url(/twd/plugins/polyfills/boxsizing.htc); }
*, *:before, *:after { box-sizing: inherit; *behavior: url(/twd/plugins/polyfills/boxsizing.htc); }

/* http://www.webtoolkit.info/css-clearfix.html */
.clearfix:after { content: ".";	display: block;	clear: both; visibility: hidden; line-height: 0; height: 0;}
.clearfix { display: inline-block;}
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

html {overflow-y: scroll; }
/* If everything starts out with relative positioning, that means z-index "just works" instead of the confusing issue where default statically positioned elements ignore it. It also means it's easier to nudge things around with top, left, right, and bottom which all "just work" on relatively positioned elements.  */

* { 
	position: relative; 
	/* vertical-align: middle; handy when using icons etc. inline */
}
ul,ol {
 margin-left:1em;
 padding-left:0;
 /* list-style-position: inside; */
}


/* use the default system fonts */ 
html, button, input, select, textarea { font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif; color: #111; }

body { 
	margin: 0; 
	line-height: 1.6;
}

h1 { font-size: 2em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.17em; }
h4 {  }
h5 { font-size: .83em; }
h6 { font-size: .75em; }


p { margin-top: 0;}
th, td {vertical-align:top}

/* Print */
@media print {
	* {
		text-shadow: none !important;
		background: transparent !important;
		box-shadow: none !important;
		color: #000 !important;
	}
}

 /* some often used classes */
 .pushLeft {float:left}
 .pushRight {float:right}
 
.moved{ position:absolute; left:-999em}
.toggle { text-decoration:none; color:#0033FF; padding-right:16px; background-image:url(/images/click.png); background-position:right; background-repeat:no-repeat; border-bottom:1px dashed #663300; font-weight:normal;}
hr.sep { border: 0; height: 1px; background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));}

/**
*   VARS
**/
/* IE8 Stuff */
.jslghtbx-ie8.jslghtbx {
  background-image: url("/images/trans-bck.png");
  display: none; }
  .jslghtbx-ie8.jslghtbx.jslghtbx-active {
    display: block; }
  .jslghtbx-ie8.jslghtbx .jslghtbx-contentwrapper > img {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    display: block; }
  .jslghtbx-ie8.jslghtbx .jslghtbx-contentwrapper.jslghtbx-wrapper-active > img {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

/* Main wrapper */
.jslghtbx {
  font-family: sans-serif;
  overflow: auto;
  visibility: hidden;
  position: fixed;
  z-index: 2;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: transparent; }
  .jslghtbx.jslghtbx-active {
    visibility: visible;
    background-color: rgba(0, 0, 0, 0.85); }

/* loading-animation */
.jslghtbx-loading-animation {
  margin-top: -60px;
  margin-left: -60px;
  width: 120px;
  height: 120px;
  top: 50%;
  left: 50%;
  display: none;
  position: absolute;
  z-index: -1; }
  .jslghtbx-loading-animation > span {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    margin: 5px;
    background-color: #fff;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out; }
    .jslghtbx-loading-animation > span.jslghtbx-active {
      margin-bottom: 60px; }

.jslghtbx.jslghtbx-loading .jslghtbx-loading-animation {
  display: block; }

.jslghtbx-nooverflow {
  overflow: hidden !important; }

.jslghtbx-contentwrapper {
  margin: auto;
  visibility: hidden; }
  .jslghtbx-contentwrapper > img {
    background: #fff;
    padding: .5em;
    display: none;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    opacity: 0; 
    width:auto;
    max-width:100%
   }

.jslghtbx-contentwrapper.jslghtbx-wrapper-active {
  visibility: visible; }
  .jslghtbx-contentwrapper.jslghtbx-wrapper-active > img {
    display: block;
    opacity: 1; }

/* Caption */
.jslghtbx-caption {
  display: none;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  margin-bottom: 5px;
  max-width: 450px;
  color: #fff;
  text-align: center;
  font-size: .9em; }

.jslghtbx-active .jslghtbx-caption {
  display: block; }

/* Animation Stuff */
.jslghtbx-contentwrapper.jslghtbx-animate > img {
  opacity: 0; }

.jslghtbx-contentwrapper > img.jslghtbx-animate-transition {
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  -ms-transition: opacity 0.2s ease-in-out; }

.jslghtbx-contentwrapper > img.jslghtbx-animating-next {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.jslghtbx-contentwrapper > img.jslghtbx-animating-prev {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.jslghtbx-contentwrapper > img.jslghtbx-animate-init {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.jslghtbx-contentwrapper > img.jslghtbx-animate-transition {
  cursor: pointer; }

/* Controls */
.jslghtbx-close {
  position: fixed;
  right: 23px;
  top: 23px;
  margin-top: -4px;
  font-size: 2em;
  color: #FFFFFF;
  cursor: pointer;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out; }
  .jslghtbx-close:hover {
    text-shadow: 0 0 10px #fff; }
  @media screen and (max-width: 1060px) {
    .jslghtbx-close {
      font-size: 1.5em; } }

.jslghtbx-next,
.jslghtbx-prev {
  display: none;
  position: fixed;
  top: 50%;
  max-width: 6%;
  max-height: 250px;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out; }
  .jslghtbx-next.jslghtbx-active,
  .jslghtbx-prev.jslghtbx-active {
    display: block; }
  .jslghtbx-next > img,
  .jslghtbx-prev > img {
    width: 100%; }

.jslghtbx-next {
  right: .6em; }
  .jslghtbx-next.jslghtbx-no-img:hover {
    border-left-color: #787878; }
  @media screen and (min-width: 451px) {
    .jslghtbx-next {
      right: .6em; }
      .jslghtbx-next.jslghtbx-no-img {
        border-top: 110px solid transparent;
        border-bottom: 110px solid transparent;
        border-left: 40px solid #FFF; } }
  @media screen and (max-width: 600px) {
    .jslghtbx-next.jslghtbx-no-img {
      right: 5px;
      padding-left: 0;
      border-top: 60px solid transparent;
      border-bottom: 60px solid transparent;
      border-left: 15px solid #FFF; } }
  @media screen and (max-width: 450px) {
    .jslghtbx-next {
      right: .2em;
      padding-left: 20px; } }

.jslghtbx-prev {
  left: .6em; }
  .jslghtbx-prev.jslghtbx-no-img:hover {
    border-right-color: #787878; }
  @media screen and (min-width: 451px) {
    .jslghtbx-prev {
      left: .6em; }
      .jslghtbx-prev.jslghtbx-no-img {
        border-top: 110px solid transparent;
        border-bottom: 110px solid transparent;
        border-right: 40px solid #FFF; } }
  @media screen and (max-width: 600px) {
    .jslghtbx-prev.jslghtbx-no-img {
      left: 5px;
      padding-right: 0;
      border-top: 60px solid transparent;
      border-bottom: 60px solid transparent;
      border-right: 15px solid #FFF; } }
  @media screen and (max-width: 450px) {
    .jslghtbx-prev {
      left: .2em;
      padding-right: 20px; } }

.jslghtbx-thmb {
  padding: 2px;
  max-width: 100%;
  max-height: 140px;
  cursor: pointer;
  box-shadow: 0px 0px 3px 0px #000;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out; }
  @media screen and (min-width: 451px) {
    .jslghtbx-thmb {
      margin: 1em; } }
  @media screen and (max-width: 450px) {
    .jslghtbx-thmb {
      margin: 1em 0; } }
  .jslghtbx-thmb:hover {
    box-shadow: 0px 0px 14px 0px #000; }

/*# sourceMappingURL=lightbox.css.map */
@-ms-viewport {
  width: device-width;
}

body {
  padding: 0 0 4em 0;
  background-color: #F2F2F2;
}

html {
  font-size: 62.5%;
}

/* rem=10px! */
body {
  font-size: 14px;
  font-size: 1.4rem;
}

/* =14px */
h1 {
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 40px;
  line-height: 4.0rem;
}

h2 {
  font-size: 30px;
  font-size: 3.0rem;
  line-height: 40px;
  line-height: 4.0rem;
}

h3 {
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 40px;
  line-height: 4.0rem;
}

h4 {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 20px;
  line-height: 2.0rem;
}

h5 {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 20px;
  line-height: 2.0rem;
}

h6 {
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 20px;
  line-height: 2.0rem;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

/* #E8EFF9 */
body, p, td, input {
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;
  color: #224364}

.smalltext {
  font-size: 1.2rem
}

p {
  margin-top: 0;
  padding-top: 0;
  text-align: justify
}

legend {
  color: #FFF}

/* #666 */
a {
  color: maroon;
  text-decoration: none;
}

a:hover {
  color: #5002EC;
  cursor: pointer;
}

img {
  border: 0
}
summary:hover {
  cursor:pointer
}
.bold {
  font-weight: bold
}

.green {
  color: #2ECC40}

.center {
  text-align: center
}

.larger {
  font-size: larger
}

.maroon {
  color: maroon;
}

.left {
  text-align: left
}
.right {
  text-align: right
}

.clearfix:after {
  content: ".";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
.flex {
  display:flex;
  flex:1;
}
#mainwrap {
  margin: 0 auto;
  width: 99%;
  max-width: 960px;
  min-width: 320px
}

#content_wrapper {
  padding: 0;
}

#footer {
  /*width: 80%;*/
  margin: 0 auto;
  text-align: center;
}

#leftsec {
  padding-left: 12px;
  margin-left: 12px
}

img.bordered {
  padding: 2px;
  border: 1px solid #CCCCCC;
  margin: 3px
}

.pad1 {
  padding: 1px
}

.pad12 {
  padding: 12px
}

.shead {
  background-color: #C7A279;
  color#111;
  font-weight: bold;
  padding: 3px 3px 3px 6px
}

.minihead {
  text-transform: capitalize;
  text-align: center;
  font-weight: bold;
  border-bottom: 1px dashed #663300;
  width: 96%;
  margin: 0 auto;
  padding: 3px
}

.minihead a {
  color: #0074D9;
  text-decoration: none;
}

.subhead {
  text-transform: uppercase;
  font-style: italic;
  text-align: right;
  font-weight: bold;
  font-size: 10px;
  font-size: 1.0rem;
  border-bottom: 1px dashed #663300;
  margin: 0 auto;
  padding: 3px
}

.n_subhead {
  text-transform: uppercase;
  font-style: italic;
  text-align: left;
  font-weight: bold;
  font-size: 8px;
  font-size: 0.8rem;
  border-bottom: 1px dashed #663300;
  margin: 0 auto;
  position: relative;
  left: -6px;
  margin-top: 6px
}

.minibod {
  text-align: left;
  padding: 0 8px;
}

.minibod a {
  color: #111;
  text-decoration: none;
  display: block;
  border: 1px solid #DDD;
  padding-left: 2px;
  margin-top: 5px;
}

.minibod a:hover {
  color: #0074D9;
  border-left: 2px solid #0074D9}

.n_minibod {
  text-align: right;
  padding: 0 8px;
}

.n_minibod a {
  color: #111;
  text-decoration: none;
  display: block;
  margin-top: 2px;
  border-right: 1px solid #ccc;
  padding-right: 3px
}

.n_minibod a:hover {
  color: #2C01EE;
}

.boxed {
  text-align: center;
  padding: 4px;
}

.tdleft {
  padding-right: 1em
}
/*
.mainround {
  border: 1px solid #696;
  padding: 3px 0;
  background-color: #FFF8E7;
  margin-bottom: 5px;
}
*/
ul.nobullets {
  list-style-type: none;
}

.texts {
  padding: 10px;
}

div.enlarge {
  position: relative;
  display: inline-table
}

div.overlay {
  position: absolute;
  right: 6px;
  top: 6px;
}

.menitem, .centered {
  text-align: center
}

.selected {
  background-color: #224364;
}

ul.nobull {
  margin: 0px 6px 0px 10px;
  padding: 0
}

ul.nobull li {
  list-style: none;
}

.underlineheader {
  border-bottom: 1px solid #663300;
  padding-left: 12px;
  margin: 8px 100px auto 12px;
  font-weight: bold;
  color: #3D9970}

.nounderlineheader {
  padding-left: 12px;
  margin-right: 200px;
  margin-bottom: 4px;
  font-weight: bold
}

#spc {
  margin: 12px 0 12px 8px
}

.pm {
  font-size: xx-small
}

.red {
  color: #A40907
}

.pitch {
  color: #A40907;
  font-weight: bold;
  font-style: italic
}

img {
  width: 100%
}

@media \0screen {
  img {
    width: auto
  }
}

/* Prevent height distortion in IE8. */
.bgrounded {
  background-color: #4481AA;
  background-image: linear-gradient(to bottom, #5496C1, #30678E);
}

/* coursepage */
.switcher {
  text-decoration: none;
  color: #0033FF;
  padding-right: 16px;
  background-image: url(/images/click.png);
  background-position: right;
  background-repeat: no-repeat;
  border-bottom: 1px dashed #663300;
  font-weight: bold;
  font-style: italic
}

ul.ulspace {
  margin-left: 0;
  padding-left: 0
}

ul.ulspace ul {
  margin-left: 18px;
  margin-bottom: 1em
}

ul.ulspace li {
  padding-bottom: 3.236em;
  list-style: none;
}

ul.ulspace li ul li {
  padding-bottom: 0;
}

ul.ulspace li a, .tagged {
  display: block;
  width: 60%;
  min-width: 200px
}

#intro {
  margin: 1em 1em 3em 1em
}

.switched {
  margin: 1em
}

.switched ul {
  margin-left: 0;
  padding-left: 0
}

.moved {
  position: absolute;
  left: -999em
}

.remove {
  display: none
}

.padded {
  padding: 1px;
  margin: 4px
}

.hidden, .deflate, .totoggle {
  position: absolute;
  left: -999em
}

.left {
  text-align: left
}

#levels img.left {
  float: left;
}

#levels img.right {
  float: right;
}

.offer {
  color: #FF0000;
  text-transform: lowercase;
  font-weight: 400;
  text-decoration: none;
  position: absolute;
  right: 0px
}

.coursed {
  width: 90%;
  margin-right: auto;
  margin-left: auto
}

.coursed td {
  padding: 3px;
  border-bottom: 1px dotted #CCCCCC
}

.coursed th {
  background-color: #D26D43;
  padding: 6px;
  color: #fff
}

.coursed td td {
  text-align: right
}

.subtit {
  font-size: 14px;
  font-size: 1.4rem;
  color: maroon;
}

.white, .txt_menu {
  color: #FFFFF;
}

#leftsect fieldset {
  border: 0;
  padding: 0;
  margin: 0
}

#leftsect legend {
  background-color: #4481AA;
  background-image: linear-gradient(to bottom, #5496C1, #30678E);
  font-weight: bold;
  padding: 4px 0;
  display: block;
  width: 100%;
  margin: 0 0 4px 0;
  width: 100%
}

a.external {
  background: url(/img/externallink.png) center right no-repeat;
  padding-right: 13px;
}

.txt_menu {
  color: #FFFFFF;
}

.toggler, .toggle {
  text-decoration: none;
  color: #0074D9;
  padding-right: 16px;
  background-image: url(/images/click.png);
  background-position: right;
  background-repeat: no-repeat;
  border-bottom: 1px dashed #663300;
  font-weight: bold;
  font-style: italic
}

.toggler {
  cursor: pointer
}

#fpimages {}

#fpimages a {
  display: inline-block;
  width: 100%;
  max-width: 33%;
  margin: 0 auto;
  text-align: center
}

#fpimages img {}

/* form styles */
form.pageforms {
  width: 90%;
  max-width: 390px;
  background: -webkit-gradient(linear, bottom, left 175px, from(#CCCCCC), to(#EEEEEE));
  background: -moz-linear-gradient(bottom, #CCCCCC, #EEEEEE 175px);
  margin: 1em auto 0 auto;
  position: relative;
  display: table;
  font-style: italic;
  line-height: 24px;
  font-weight: bold;
  color: #09C;
  text-decoration: none;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 10px;
  border: 1px solid #999;
  border: inset 1px solid #333;
  -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}

form.pageforms input, form.pageforms select {
  width: 99%;
  padding-left: 4px;
  display: block;
  border: 1px solid #999;
  height: 25px;
  -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}

form.pageforms textarea {
  width: 99%;
  height: 8em;
}

form.pageforms label {
  display: block
}

form.pageforms input.button, a.button {
  background: #09C;
  color: #fff;
  height: 30px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  border: 1p solid #999;
}

form.pageforms input.button:hover, a.button:hover {
  background: #fff;
  color: #09C;
}

form.pageforms textarea:focus, form.pageforms input:focus, form.pageforms select:focus {
  border: 1px solid #09C;
}

/* end form styles */
ul.flextable, ul.flextable ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul.flextable li {
  vertical-align: top;
  display: inline-block;
  padding: 0;
}

ul.flextable li ul li {
  display: block;
}

ul.flextableleft, ul.flextableleft ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul.flextableleft li {
  vertical-align: top;
  display: inline-block;
  padding: 0;
  margin: 2px 0
}

ul.flextableleft li ul li {
  display: block;
}

ul.pricestabl li div {
  font-weight: bold;
  background-color: #FFDE9B;
  text-align: center;
  padding: 0 1em;
  border: 1px solid #CCCCCC;
}

ul.pricestabl li ul li div {
  font-weight: normal;
  background-color: transparent;
  padding: 0 1em;
  text-align: center;
}

.pricesbox {
  width: 100%;
  max-width: 598px
}

.pricesbox td, .pricesbox th {
  border: 1px solid #CCCCCC;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  padding: 3px;
}

.pricesbox th {
  background-color: #FFDE9B;
  padding: 0
}

div.pricesbox {
  background-color: #FFDE9B;
  border: 1px solid #CCCCCC;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  padding: 3px;
}

.lh2 {
  height: 3.2em
}

#EItabs {}

#EItabs a {
  display: inline-block;
  width: 9%;
  min-width: 60px;
  background-image: url("/images/flecha.gif");
  background-repeat: no-repeat;
  background-color: #FFCC66;
  background-position: left;
  padding-left: 10px;
}

/* media queries */
div#social {
  position: fixed;
  left: 0;
  top: 33%;
  /* third way down the side */
  width: 30px;
  z-index: 999;
  text-align: left;
}

#text2site img {
  display: none
}

/* hide any images in the email body, this functionality has not been implemented! */
#social img {
  padding: 4px;
  width: 30px;
  height: 30px;
  width: 3rem;
  height: 3rem
}

/* grids */
/* front page */
#fpimages {}

#fpimages a.block {
  min-width: 208px;
  width: 33.33%;
  display: block;
  text-align: center
}

#fpimages img {
  max-width: 200px
}

#fpgrid div.block {
  min-width: 220px;
  width: 50%;
  padding: 1em
}

#contentsection div.mainround {
  padding: 1.618rem
}

img.ecards {
  width: 100%;
  max-width: 260px;
  height: 100%;
  max-height: 260px
}

iframe.youtubetopmovie {
  width: 100%;
  max-width: 300px;
  border: 0;
  margin-top: 0.618rem
}

/* Smartphone version
   Nothing to do: blocks are stacked by default. */
div.fourty {
  width: 40%
}

div.sixty {
  width: 60%
}

div.half {
  width: 50%
}

div.third {
  width: 33.33%
}

@media (max-width: 960px) {

  /* Desktop version */
  .address {
    width: 50%;
  }

  div#social {
    text-align: center;
    top: auto;
    /*top: normal; third way down the side */
    bottom: 0px;
    width: 100%;
    z-index: 999;
  }

  div.fourty, div.sixty {
    width: 100%
  }

  #contentsection div.mainround {
    padding: 0.8rem
  }

  div.half {
    width: 90%
  }
}

@media (max-width: 768px) {

  /* Tablet version */
  .address, div.tablet {
    width: 100%;
  }

  ul.flextable li {
    display: block;
    padding: 0;
    max-width: 300px;
  }

  ul.flextableleft li {
    float: left;
    clear: left;
  }

  ul.flextableleft li div {
    float: left;
    display: inline-block;
    width: 100px;
    padding: 0;
    text-align: right;
    padding-right: 6px
  }

  ul.flextableleft li ul li div {
    width: auto;
    min-width: 60px;
    padding: 0;
    border-right: 1px dotted #A40907
  }

  ul.flextableleft li ul, ul.flextableleft li ul li {
    float: left;
    clear: none
  }

  #contentsection div.mainround {
    padding: 0.8rem
  }

  /* CSS Responsive Table https://paulund.co.uk/css-responsive-tables here: http://www.natalislang.com/english/one_on_one.html*/
  table.responsive thead {
    display: none;
  }

  table.responsive tr {
    margin-bottom: 3px;
    display: block;
    border-bottom: 2px solid #ddd;
  }

  table.responsive td {
    display: block;
    text-align: right;
    font-size: 1em;
    border-bottom: 1px dotted #ccc;
  }

  table.responsive td:last-child {
    border-bottom: 0;
  }

  table.responsive td:before {
    content: attr(data-title);
    float: left;
    font-weight: bold;
  }
}

/*
form.pageforms:not(.enabled)::before {
  content: "Online courses only for the moment!\A¡Solo cursos online por el momento!";
  white-space: pre;
  color: red;
  font-weight: bold;
}
*/
form.pageforms:not(.enabled) input, form.pageforms:not(.enabled) label, form.pageforms:not(.enabled) textarea, form.pageforms:not(.enabled) select {
  display: none;
}

.flexprices {
  display: flex;
  flex-wrap: wrap;
  align-content: space-evenly;
  /* justify-content:center; */
}

.flexprices>* {
  margin: 1em 0;
}

.flexprices_list p{
  padding-left:  1em;
  padding-right: 1em;
}

.flexprices_item p {
  margin-bottom: 0;
  margin-top: .5rem;
}

.flexprices_item {
  flex: 1;
  border: 1px solid gray;
  border-radius: 10px;
  text-transform: uppercase;
  color: black;
}

.flexprices_item+.flexprices_item {
  margin-left: 2%;
}

.flexprices_h2 {
  font-size: 2.2rem;
  font-weight: bold;
}

.flexprices_dblheight {
  height: 3.2em;
  padding-top: 1em;
  line-height: 1.2;
}

.flexprices_dark {
  background-color: #555555;
  color: white;
  margin: 1.6rem;
}
.flexprices_table {
  background-color: #555555;
  margin-left:auto;
  margin-right:auto;
}
.flexprices_table th, .flexprices_table td, .flexprices_table td a {
  color:white;
  text-align: right;
}
.flexprices_table td:nth-child(1) {
  padding-right:2em
}
.flexprices_blue {
  color: #224364;
  margin: 1.6rem;
}

a.flexprices_anchor, a.flexprices_anchor:visited {
  color: #224364;
  -webkit-text-stroke: 1px white;
  font-weight: 900;
  text-shadow: 4px 2px 6px #ff0000;
}

a.flexprices_anchor:hover {
  color: blue;
}

.flexprices_light {
  margin: 1.6rem;
  color: black;
}

 .flexprices_table tr td  , .flexprices_table tr td span.smalltext {white-space:  nowrap} 

.bottomed {
  position: absolute;
  bottom: 0px;
  padding: 1rem;
  display: flex;
}

.activcontent {
  padding: 1rem;
  text-transform: none;
  margin-bottom: 6em;
  filter: brightness(75%);
}

.greenbutton {
  box-shadow: 0px 10px 14px -7px #3e7327;
  background: linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
  background-color: #77b55a;
  border-radius: 1em;
  border: 1px solid #4b8f29;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 16px;
  font-weight: bold;
  padding: 1.2em;
  text-decoration: none;
  text-shadow: 0px 1px 0px #5b8a3c;
}

.greenbutton:hover {
  background: linear-gradient(to bottom, #72b352 5%, #77b55a 100%);
  background-color: #72b352;
}

.greenbutton:active {
  position: relative;
  top: 1px;
}

.arrow-up {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid black;
}

.arrow-down {
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 20px solid #f00;
}

.arrow-right {
  width: 0;
  height: 0;
  border-top: 30px solid transparent;
  border-bottom: 30px solid transparent;
  border-left: 30px solid green;
}

.arrow-left {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid blue;
}

.iframe-container {
  position: relative;
  width: 80%;
  padding-bottom: 56.25%;
  height: 0;
  margin: 0 auto;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.iframe-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.transbankButton {
  position: relative;
  z-index: 99;
  float: right;
}

.activlist {
  margin: 1em;
  width: 140px;
}

.activlistdbl {
  padding: 0 1em 1em;
  width: auto;
}

.activlist img, .activlistdbl img {
  display: block;
  border-radius: 10%;
  width: 100px;
  height: 100px;
  margin: 0 auto;
}

.activlistdbl img {
  display: inline-block;
  width: 80px;
  height: 80px;
}

.activlist .activtitle {
  min-height: 2em;
}

.activtitle {
  font-weight: bold;
  padding: 8px;
}

.levelgroup {
  border-radius: 1em;
  padding: 0 1em;
  border: 0;
  box-shadow: 5px 10px 18px #888888;
  margin-bottom:1em;
}
.levelgroup legend {
  /* background-color: #2ECC40; */
  border-radius: 10px 10px 0 0;
  padding: 4px 12px;
  background: #B6E284; background: linear-gradient(to bottom, #B6E284, #094B03);
}
.middled {
  margin-left:auto;
  margin-right:auto;
}
/*  */
/*! PocketGrid 1.1.0
* Copyright 2013 Arnaud Leray
* MIT License
*/
/* Border-box-sizing */
.block-group, .block, .block-group:after, .block:after, .block-group:before, .block:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Clearfix */
.block-group {
  *zoom: 1;
}
.block-group:before, .block-group:after {
  display: table;
  content: "";
  line-height: 0;
}
.block-group:after {
  clear: both;
}

.block-group {
  /* ul/li compatibility */
  list-style-type: none;
  padding: 0;
  margin: 0;
}

/* Nested grid */
.block-group > .block-group {
  clear: none;
  float: left;
  margin: 0 !important;
}

/* Default block */
.block {
  float: left;
  width: 100%;
}

*:before,
*:after {
    box-sizing: border-box;
}
td {
    line-height: 1.8rem;
}
input {
    border-width: 2px solid grey;
}
.red {
    background-color: red;
    color: white;
}
.orange {
    background-color: #FF8C00;
}
.green {
    background-color: #8FBC8F;
    color: white;
}
.button2 {
    border: none;
    padding: 8px 14px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    border-radius: 12px;
    -webkit-transition-duration: 0.4s;
    /* Safari */
    transition-duration: 0.4s;
    font-weight: bold;
    box-shadow: 0 10px 14px 0 rgba(0, 0, 0, 0.24), 0 17px 30px 0 rgba(0, 0, 0, 0.19);
}
.button2:hover {
    box-shadow: 0 0 0 0;
}
input[type="radio"] {
    outline: 4px dashed white;
}
.outlineRed {
    outline: 4px dashed red !important;
}
.outlineGreen {
    outline: 4px dashed #8FBC8F !important;
}
.outlineOrange {
    outline: 4px dashed #FF8C00 !important;
}
.bgrndRed {
    background-color: red;
}
.bgrndGreen {
    background-color: #8FBC8F;
}
.bgrndOrange {
    background-color: #FF8C00;
}
.borderBlue {color:blue;}
.excc {
    width: 100%;
    border-collapse: collapse;
    margin: 4px;
    border-right: 1px solid #ccc;
}
.excc td {
    line-height:2em;
}
.excc tr:nth-child(odd) {
    background: paleturquoise
}
.excc td:first-child {
    font-weight: bold;
}

.excc tr {
    border-bottom: 1px solid #ccc;
}
.excc th, .excc  td {
    text-align: left;
    padding: 4px;
}

.exercisefield { border:1px solid blue; border-radius:1em;}
.exercisefield legend {
    font-weight:bold;
     padding: 0 0.5em;
     color:black;
}
/* 
Ace Responsive Menu Plugin
Version: 1.0
Author: Samson Onna
E-mail: samson3d@gmail.com
Website: www.webthemez.com
/* Ace Responsive Menu
----------------------------------------*/

.ace-responsive-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    background-color: #4481AA;
    background-image: linear-gradient(to bottom, #5496C1, #30678E);
    float:left;
    width:100%;
    border-radius:4px;
}
.ace-responsive-menu li{
    list-style: none;
}
.ace-responsive-menu li ul {
    display:none;
    border-width:0 1px 1px 1px;
    border-style: solid;
    border-color: #00264D;
    text-align:left;
}
.ace-responsive-menu > li {
    display: block;
    margin: 0;
    padding: 0 1ch;
    border: 0px;
    float: left;
    text-align:center;
}
.ace-responsive-menu li a {
    color:#eee;
    font-weight: bold;
}
.ace-responsive-menu > li > a {
    display: block;
    position: relative;
    margin: 0;
    border: 0px;
    /*padding: 18px 20px 18px 12px;*/
    padding:9px 10px 9px 6px;
    text-decoration:underline;
    font-size: 15px;
    font-weight: bold;
    color: #eee;
    white-space: nowrap;
}
.ace-responsive-menu li a i {
    padding-right: 5px;
    color: #EEE;
}
.ace-responsive-menu > li > a i {
    font-size: 16px;
    text-shadow: none;
    color: #EEE;
}
.ace-responsive-menu li ul.sub-menu li a i {
    padding-right: 10px;
}
.ace-responsive-menu li.menu-active > a {
    background: #00264D;
    color:#eee;
}
.ace-responsive-menu li .menu-active {
    position: relative;
}
.ace-responsive-menu > li > a > .arrow:before {  
    margin-left: 15px;
    display: inline;
    font-size: 16px;
    font-family: FontAwesome;
    height: auto;
    content: " \276F";
    font-weight: bold;
    text-shadow: none;
    width: 10px;
    display: inline-block;
    transform: rotate(90deg);
}
.ace-responsive-menu li ul.sub-menu li > a > .arrow:before {
    content: "\f105" !important;
}
.ace-responsive-menu > li > ul.sub-menu {
    display: none;
    list-style: none;
    clear: both;
    margin: 0;
    position: absolute;
    z-index: 999;
}
.ace-responsive-menu li ul.sub-menu {
    background-color: #4481AA;
    background-image: linear-gradient(to bottom, #5496C1, #30678E);
}
.ace-responsive-menu li ul.sub-menu > li {
    width: auto;
}
.ace-responsive-menu li ul.sub-menu li a {
    display: block;
    margin: 0px 0px;
    padding: 6px 10px 6px 7px;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    /*background: none;*/
    white-space: nowrap;
}
.ace-responsive-menu > li > ul.sub-menu > li {
    position: relative;
}
.ace-responsive-menu > li > ul.sub-menu > li ul.sub-menu {
    position: absolute;
    left: 185px;
    top: 0px;
    display: none;
    list-style: none;
}
.ace-responsive-menu > li > ul.sub-menu > li ul.sub-menu > li ul.sub-menu {
    position: absolute;
    left: 185px;
    top: 0px;
    display: none;
    list-style: none;
}
.ace-responsive-menu > li > ul.sub-menu li > a > .arrow:before {
    float: right;
    margin-top: 1px;
    margin-right: 0px;
    display: inline;
    font-size: 16px;
    font-family: FontAwesome;
    height: auto;
    content: "\f104";
    font-weight: bold;
    text-shadow: none;
}

/* Menu Toggle Btn
----------------------------------------*/
.menu-toggle {
    display: none;
    float: left;
    width: 100%;
     background-color: #4481AA;
  background-image: linear-gradient(to bottom, #5496C1, #30678E);
}
.menu-toggle h3 {
    float: left;
    color: #FFF;
    padding: 0px 10px;
    font-weight: bold;
    font-size: 16px;
    margin:9px 0 0 0;
}
.menu-toggle .icon-bar {
    display: block !important;
    width: 18px;
    height: 2px;
    background-color: #F5F5F5 !important;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
    margin: 3px;
}
.menu-toggle .icon-bar:hover {
    background-color: #00264D !important;
}
.menu-toggle #menu-btn {
    float: right;
    background: #202020;
    border: 1px solid #0C0C0C;
    padding: 8px;
    border-radius: 5px;
    cursor: pointer;
    margin: 10px;
}
.hide-menu {
    display: none;
}

/* Responsive Menu Styles
----------------------------------------*/
/*Note: change the max-width asper your requirment and change the same in aceResponsiveMenu({resizeWidth: "768" }) function*/

@media screen and (max-width: 810px) {

    .ace-responsive-menu {
        float: left;
        width:100%;
    }
    .ace-responsive-menu > li {
        border-bottom: 1px solid #242424;
       float: none;
       width:98%;
       text-align:left;
    }   
    .ace-responsive-menu li a:hover {
        background: #00264D !important;
    }
    .ace-responsive-menu > li:first-child {
        border-top: 2px solid #FD5025;
    }    
    .ace-responsive-menu > li > a i {
        padding-right: 10px;
        color: #FF5737;
    }
    .ace-responsive-menu > li > a > .arrow:before {
        float: right;
         content: " \276F";
        font-weight: 300;
        text-shadow: none;
        width: 10px;
        display: inline-block;
        transform: rotate(90deg);
    }
    li.menu-active > a > .arrow:before {
    content: " \276F";
    font-weight: 300;
    text-shadow: none;
    width: 10px;
    display: inline-block;
    transform: rotate(90deg);
    }
    .sub-menu li a:hover {
        background:#00264D;
    }

    .ace-responsive-menu li ul.sub-menu > li {
        width: 100%;
    }
    .ace-responsive-menu li ul.sub-menu li ul.sub-menu li a
        {
        padding-left: 30px;
    }  
    .ace-responsive-menu li ul.sub-menu li ul.sub-menu li ul.sub-menu li a 
       {
        padding-left: 50px;
    }  
    .ace-responsive-menu > li > ul.sub-menu {
        position: static;
    }
    .ace-responsive-menu > li > ul.sub-menu > li ul.sub-menu {
        position: static;
    }
    .ace-responsive-menu > li > ul.sub-menu > li ul.sub-menu > li ul.sub-menu {
        position: static;
    }
    .ace-responsive-menu li ul.sub-menu li.menu-active > a > .arrow:before {
          content: " \276F";
    font-weight: 300;
    text-shadow: none;
    width: 10px;
    display: inline-block;
    transform: rotate(90deg);
    }
    #logodiv {top:0.4em}
} 
/* custom styles */

.liheader {
    padding-left:2ch;
    color:yellow;
    font-weight:bold;
}
#uppernav {
    position:fixed;
    top:0;
    z-index: 1000;
    width:100%;
    max-width:960px;
    margin-top:4px;
}