/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
    font-family: 'Arvo';
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

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

textarea {
    resize: vertical;
}

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ===== Initializr Styles ==================================================
   Author: Jonathan Verrecchia - verekia.com/initializr/responsive-template
   ========================================================================== */

body {
    font: 16px/26px Helvetica, Helvetica Neue, Arial;
    font-family: 'Arvo', 'Lato', serif;
    color : #333;
}

.wrapper {
    width: 90%;
    margin: 0 5%;
}

/* ===================
    ALL: Orange Theme
   =================== */

.header-container {
    background: #ff580c;
    padding : 20px 0 21px;
}

.footer-container,
.main aside {
    background : #d9000f;
}

.header-container,
.footer-container,
.main aside {
    
}

.slider-container {
	background : url(../img/slider_bg.png) top left;
}

.slider-wrapper {
	background : url(../img/slider_holder_bg.png) top center no-repeat;
	padding : 15px 0;
}

.price-container {
	background : #eff5f9;
}

.price-container h1 {
	text-align : center;
	font-weight : normal;
	font-size: 34px;
	margin: 26px 0 46px 0;
}

.register-container {
	background : #67b61f;
	color : #fff;
}

.register-container h1 {
	color : #fff;
	font-weight : normal;
	text-align: center;
}

.title {
    color: white;
}

/* ==============
    MOBILE: Menu
   ============== */

.nav ul,
nav ul {
    margin: 0;
    padding: 0;
}

.nav li,
nav li {
	float : left;
	font-size: 14px;
    padding: 30px 22px 0;
}
nav li:first-of-type {
  padding-left: 0;
}
nav li:last-of-type {
padding-right:  0;
}

.nav a,
nav a {
    
    text-align: center;
    text-decoration: none;
    font-weight: normal;

    color: white;
}

.nav a:hover,
.nav a:visited,
nav a:hover,
nav a:visited {
    color: white;
}

.nav a:hover,
nav a:hover {
    text-decoration: underline;
}

/* ==============
    MOBILE: Main
   ============== */

.main {
    padding: 30px 0;
}

.main article h1 {
    font-size: 2em;
}

.main aside {
    color: white;
    padding: 0px 5% 10px;
}

.footer-container footer {
    color: white;
    overflow : auto;
    padding: 20px 0;
}

/* ===============
    ALL: IE Fixes
   =============== */

.ie7 .title {
    padding-top: 20px;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */















.header-container a.title {
	background : url(../img/logo.png) no-repeat top left;
	width : 170px;
	height : 92px;
	padding : 0 0 0 105px;
	font-size : 20px;
	margin : 0;
	font-weight: normal;
}

.header-container a.title:hover {
    color:white;
    text-decoration: none;
}

.slider-container h1 {
	font-weight: normal;
	text-align: center;
	margin-top : 43px;
}

.slider-container #slider {
	width : 930px;
	height : 434px;
	margin : 0 auto;
	overflow: visible;
}

.price-container ul {
	list-style : none;
	overflow: auto;
	margin : 0 0 95px 0;
}

.price-container ul li {
	list-style : none;
	text-align: center;
	float : left;
	width : 100px;
	margin : 0 18px;
}

.price-container ul li span.circle {
	background : url(../img/white_circle.png) no-repeat top left;
	width : 100px;
	height : 100px;
	display : block;
	line-height: 100px;
	font-size: 36px;
}

.price-container ul li .price {
	font-size : 40px;
	margin : 49px 0 0;
}

.price-container ul li .price span {
	font-size: 16px;
	margin: 13px 0 0 0;
	display: block;
}

.blockquotes {
	font-size : 20px;
	font-style: oblique;
	line-height: 34px;
	margin : 32px auto 0;
	padding : 1px 0 14px 0;
	background : url(../img/blockquote_bg.png) no-repeat 6px 6px;
	text-align: center;
	width : 960px;
}

/*Homepage registration */
#register {
	overflow : auto;
	margin : 0 auto;
}

#register label {
	display : none;
}

#register input {
	width : 276px;
	height : 49px;
	border : 1px solid #eee;
	background : #fff;
	line-height : 49px;
	font-size : 20px;
	color : #4d4d4d;
	text-align : center;
	font-family: 'Arvo';
    padding:0px;
    margin:0px;
}

#register #termslabel {
	display : block;
    width:250px;
	margin: 0 0 0 28px;
}

#register #termslabel a{
    color:white;
    text-decoration: none;
}

#register #termslabel a:hover{
    text-decoration: underline;
}

#register .formelement {
	margin : 0 0 15px 0;
}

#register .column1 {
	float : left;
	margin : 0 70px 0 0 ;
}

#register .column2 {
	float : left;
}

#register #fieldholder {
	width : 630px;
	margin : 0 auto;
}

#register .row {
	clear : both;
	margin : 0 auto;
	width : 630px;
	text-align: right;
}

#register #termsholder input {
	width : 20px;
	float : left;
}

#register #submit {
	background : url(../img/register_bg.png) no-repeat top left;
	width: 178px;
	height: 51px;
	border : 0;
	color : #fff;
}

.nivoSlider {
    position:relative;
    background:url(/images/program/loading.gif) no-repeat 50% 50%;
    overflow : visible;
}

.nivoSlider img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
.nivoSlider a {
    border:0;
    display:block;
}

.nivo-prevNav {
	background : url(../img/prev_button.png) no-repeat top left;
	width : 70px;
	height : 60px;
	text-indent : -9999px;
	left : -27px !important;
}

.nivo-nextNav {
	background : url(../img/next_button.png) no-repeat top left;
	width : 70px;
	height : 60px;
	text-indent : -9999px;
	right : -27px !important;
}

.nivo-control {
	width : 10px;
	height : 11px;
	background : url(../img/slider_nav.png) no-repeat top left;
	display : block;
	float : left;
	margin : 0 2px;
	text-indent: -9999px;
}

.nivo-control.active {
	background-position : top right;
}

.nivo-controlNav {
	text-align : center;
	padding : 15px 0;
	width : 60px;
	margin : 20px auto 0;
}

.quotewrapper {
	width : 720px;
	position : relative;
	margin : 0 auto;
	height : 200px;
}

.loginpanel {
	border-radius : 10px;
	background : #e6e6e6;
	width : 446px;
	margin : 40px 28px 20px;
    padding:1px 0px;
	box-shadow: 0px 0px 30px #666;
}

.studentlogin, .teacherlogin {
    float : left;
}

.loginpanel h2 {
	text-align: center;
	font-weight: normal;
}

.loginpanel .formelement {
	border-top : 1px solid #ccc;
	padding : 10px 20px;
	position : relative;
}

.loginpanel .formelement.right {
	text-align: right;
}

.loginpanel .formelement label{
    float:left;
}

.loginpanel .formelement input {
	background : #fff;
	border : 1px solid #e4e4e4;
}

.loginpanel .formelement input[type=text],
.loginpanel .formelement input[type=password] {
	padding : 10px;
	color : #333;
	width : 350px;
}

.loginpanel .formelement .button,
.loginpanel .formelement .button {
	text-align : center;
	width : 151px;
	height : 39px;
	border : 1px solid #35453a;
	border-radius: 5px;
	color : #fff;

    background-color:#76A650;
	/* IE10 Consumer Preview */ 
	background-image: -ms-linear-gradient(top, #97BA52 0%, #76A650 100%);
	
	/* Mozilla Firefox */ 
	background-image: -moz-linear-gradient(top, #97BA52 0%, #76A650 100%);
	
	/* Opera */ 
	background-image: -o-linear-gradient(top, #97BA52 0%, #76A650 100%);
	
	/* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #97BA52), color-stop(1, #76A650));
	
	/* Webkit (Chrome 11+) */ 
	background-image: -webkit-linear-gradient(top, #97BA52 0%, #76A650 100%);
	
	/* W3C Markup, IE10 Release Preview */ 
	background-image: linear-gradient(to bottom, #97BA52 0%, #76A650 100%);
}

.loginpanel .formelement .username {
	background : url(../img/form_username_bg.png) no-repeat 5px 10px #fff;
	padding : 10px 10px 10px 40px !important;
}

.loginpanel .formelement .password {
	background : url(../img/form_password_bg.png) no-repeat 5px 10px #fff;
	padding : 10px 10px 10px 40px !important;
}

.loginpanel div.formelement.forgotten input{
    width:230px;
}

.loginpanel div.formelement.forgotten .button{
    width:150px;
}

.loginpanel div.formelement.register span{
    display:inline-block;
    width:253px;
}

.loginpanel div.formelement.register a.button{
    display:inline-block;
    text-decoration: none;
    font-family:arial;
    line-height:37px;
}

.loginpanel .formelement span.alternative{
    float:left;
    text-align:left;
    font-size:12px;
    line-height:16px;
    display:inline-block;
    width:240px;
    padding-bottom:10px;
}


.ridgwell_ad{
    width:300px;
    background-color:#76A650;
    color:white;
    margin:30px auto 10px auto;
    padding:10px 0px;
}

.ridgwell_ad p{
    margin:0px;
    padding:5px 20px;
    line-height: 16px;
}

.ridgwell_ad a{
    color:white;
}

.ridgwell_ad a:hover{
    color:#ccffcc;
}

.green-container {
	background : #6ab820;
	padding : 40px;
}

.tabcontent {
	background : #efefef;
	border-top : 1px solid #343434;
}

.tabcontent .content {
	width : 922px;
	background : url(../img/tabcontent_bg.png) no-repeat bottom center #fff;
	padding : 20px 20px 40px;
	margin : 0 auto 50px auto;
	border-radius : 5px;
}

.tabcontent #sections {
	width : 900px;
	margin : 20px auto 20px;
	text-align : center;
	list-style : none;
	border-bottom : 2px solid #fff;
	padding : 0 0 20px 0;
}

.tabcontent #sections li {
	display : inline;
	list-style : none;
	padding : 10px 30px;
}

.tabcontent #sections li a {
	color : #666;
	font-weight : normal;
	text-decoration: none;
}

.tabcontent #sections li a:hover,
.tabcontent #sections li.selected a {
	color : #333;
	font-weight : bold;
}

#tabs {
	margin : 0 0 0 200px;
}

#tabs li {
	list-style : none;
	text-align : center;
	float : left;
}

#tabs li a {
	padding : 20px 30px 20px 10px;
	margin : 30px -20px 0 0;
	display : block;
	color : #fff;
	height : 19px;
	width : 178px;
	font-size : 20px;
	text-decoration: none;
}

#tabs li.green a {
	background : url(../img/tab_green.png) no-repeat bottom left;
}

#tabs li.orange a {
	background : url(../img/tab_orange.png) no-repeat bottom left;
}

#tabs li.red a {
	background : url(../img/tab_red.png) no-repeat bottom left;
}


/** further styles **/

::-webkit-input-placeholder {
   color: black;
}

:-moz-placeholder { /* Firefox 18- */
   color: black;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: black;  
}

:-ms-input-placeholder {  
   color: black;  
}

.page-alert{
        width: 1026px; /* 1140px - 10% for margins */
        margin: 20px auto;
}

.social-media {
  position: fixed;
  right: 0;
  top:  151px;
  border: 3px solid #FF580C;
  border-right: none;
  border-top-left-radius:    16px;
  border-bottom-left-radius: 16px;
  background: #FF580C;
  padding: 8px;
  /* Opacity ----- */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
      filter: alpha(opacity=50);
        -moz-opacity:     0.5;
          -khtml-opacity: 0.5;
            opacity:      0.5;
  /* Transition ----- */
  -webkit-transition: all 0.33s;
     -moz-transition: all 0.33s;
       -o-transition: all 0.33s;
          transition: all 0.33s;
}
.social-media:hover {
  /* Opacity ----- */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      filter: alpha(opacity=100);
        -moz-opacity:     1.0;
          -khtml-opacity: 1.0;
            opacity:      1.0;
}
.social-media a {
  display: block;
  width:  25px;
  height: 25px;
  text-indent: -9999px;
}
.social-media a.facebook {
  background: url("../img/social-media--facebook.png") no-repeat 50% 50%;
  background-size: 100%;
}
.social-media a.twitter {
  margin-top: 8px;
  background: url("../img/social-media--twitter.png") no-repeat 50% 50%;
  background-size: 100%;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

   @media only screen and (min-width: 300px) and (max-width:480px) {
  
    /* General */
    
    .page-alert { width: auto !important }
    
      .header-container a.title { display: block; }
      .slider-container h1 { line-height:1.25; }
      .slider-wrapper { display:none; }
      .blockquotes { box-sizing:border-box; width:100% !important; padding:0 24px !important; background-size:100% !important; background-position:50% 0% !important; }
      .quotewrapper { width:100% !important; height:325px !important; }
      .quote { width:100% !important; }
      .quote p { margin: 0 0 1em; }
      .price-container h1 { line-height:1.25; }
      .price-container ul { padding-left:0; }
      .price-container ul li { margin-bottom:16px !important; }
      .price-container ul li .price { margin: 8px 0 0 !important; }
  
      form#register { overflow:hidden; }
      form#register fieldset { width:100%; }
      form#register fieldset .column1 { width:100%; float:none; }
      form#register fieldset .column2 { width:100%; float:none; }
      form#register #fieldholder { width:100%; }
  
      form#register .row { width:100% !important; }
  
      .nav ul { list-style:none !important; }
  
      /* Styles for /pricing */
      .price_list { width:100% !important; height: auto !important; margin: 16px 0 24px !important; padding:0 !important; padding-bottom: 24px !important; overflow: auto !important; }
      .price_list>div { float:none !important;  }
      .price_list .col0 { float:left !important; width:75px !important; height:75px !important; background-size:100% !important; line-height:75px !important; font-size:24px !important; }
      .price_list .col1, .price_list .col2, .price_list .col3 { width:auto !important; margin-left:75px !important; padding-left:16px !important; }
      .price_list .col1 { padding-top: 12px !important; }
      .price_list .col2 { }
    .price_list .col2_l { float: none !important; width: auto !important; }
    .price_list .col2_l h4 { margin: 0; margin-top: 1.5em; }
      .price_list .col3 { padding-top: 12px !important; }
    form.order_button {}
    form.order_button p { text-align: center }
    
    /* Sign-up */
    .register div[class*="span"] form .register_box .row, .register .register_box div[class*="span"], .row.register { margin-left: 0 }
    .register div[class*="span"] { float: none; margin: 0; width: auto }
    .register div[class*="span"] form .register_box { padding: 20px }
    .register_box input.text { width: 95% !important }
    
    /* Login */
    .studentlogin, .teacherlogin { float: none }
    .loginpanel { width: 100% !important; margin: 40px auto !important; box-shadow: none !important }
    .loginpanel .formelement input[type=text], .loginpanel .formelement input[type=password] { box-sizing: border-box !important; width: 100% !important; height: 44px !important }
    .loginpanel .formelement.right, .loginpanel .formelement.forgotten, .loginpanel .formelement.register { padding-bottom: 24px !important }
    
    .social-media {
      display: none;
    }
    
  }
  
  @media only screen and (min-width: 480px) {
  
  /* ====================
      INTERMEDIATE: Menu
     ==================== */
  
         .nav a,
      nav a {
          float: left;
          /*margin: 0 1.7%;*/
          margin-bottom: 0;
      }
      
      .nav li:first-child a,
      nav li:first-child a {
          margin-left: 0;
      }
  
      .nav li:last-child ,
      nav li:last-child a {
          margin-right: 0;
      }
  
  /* ========================
      INTERMEDIATE: IE Fixes
     ======================== */
  
         .nav ul li,
      nav ul li {
          display: inline;
      }
  
      .oldie nav a {
          margin: 0 0.7%;
      }
    
  }
  
  @media only screen and (min-width: 768px) {
  
  /* ====================
      WIDE: CSS3 Effects
     ==================== */
  
      .header-container,
      .main aside {
          -webkit-box-shadow: 0 5px 10px #aaa;
             -moz-box-shadow: 0 5px 10px #aaa;
                  box-shadow: 0 5px 10px #aaa;
      }
  
  /* ============
      WIDE: Menu
     ============ */
  
      .title {
          float: left;
      }
  
      nav {
          float: right;
          /*width: 65%;*/
      }
      
      .nav {
          margin : 0 auto;
          width : 850px;
      }
  
  /* ============
      WIDE: Main
     ============ */
  
      .main article {
          float: left;
          width: 57%;
      }
  
      .main aside {
          float: right;
          width: 28%;
      }
  }
  
  @media only screen and (min-width: 768px) and (max-width: 1139px) {
    
    .header-container a.title {
      width: 130px !important;
    }
    .header-container a.title small {
      font-size: 70%;
    }
    
    .page-alert { width: auto !important }
    
    .slider-container .slider-wrapper {
      height: 342px;
      background-size: 100%;
      padding: 13px 0;
    }
    .slider-container .slider-wrapper #slider {
      width:  660px !important;
      height: 342px !important;
    }
    .slider-container .slider-wrapper .nivo-controlNav {
      margin:  32px auto 0;
      padding: 0;
    }
    .slider-container #slider img {
      padding-top: 16px;
    }
    .slider-container .blockquotes {
      max-width: 640px;
      margin-bottom: 32px;
      background-position: 50%;
      background-size: 100%;
      padding: 0 64px;
    }
    .slider-container .quotewrapper {
      max-width: 100%;
      height: 140px;
    }
    
    .price_list {
      width: 688px !important;
    }
    .price_list .col1 {
      width: 120px !important;
    }
    .price_list .col2 {
      width: 240px !important;
    }
    .price_list .col3 {
      width: auto !important;
    }
    
    .wrapper {
      width: 768px;
      margin: 0 auto;
    }
    
    .social-media {
      display: none;
    }
    
  }
  
  @media only screen and (min-width: 1140px) {
  
  /* ===============
      Maximal Width
     =============== */
  
      .wrapper {
          width: 1026px; /* 1140px - 10% for margins */
          margin: 0 auto;
      }
  }
  
  /* ==========================================================================
     Helper classes
     ========================================================================== */
  
  .ir {
      background-color: transparent;
      border: 0;
      overflow: hidden;
      *text-indent: -9999px;
  }
  
  .ir:before {
      content: "";
      display: block;
      width: 0;
      height: 150%;
  }
  
  .hidden {
      display: none !important;
      visibility: hidden;
  }
  
  .visuallyhidden {
      border: 0;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px;
  }
  
  .visuallyhidden.focusable:active,
  .visuallyhidden.focusable:focus {
      clip: auto;
      height: auto;
      margin: 0;
      overflow: visible;
      position: static;
      width: auto;
  }
  
  .invisible {
      visibility: hidden;
  }
  
  .clearfix:before,
  .clearfix:after {
      content: " ";
      display: table;
  }
  
  .clearfix:after {
      clear: both;
  }
  
  .clearfix {
      *zoom: 1;
  }
  
  .green {
      color : #67b61f;
  }
  
  .orange {
      color : #ff580c;
  }
  
  .red {
      color : #d9000f;
  }
  
  /* ==========================================================================
     Print styles
     ========================================================================== */
  
  @media print {
      * {
          background: transparent !important;
          color: #000 !important; /* Black prints faster: h5bp.com/s */
          box-shadow: none !important;
          text-shadow: none !important;
      }
  
      a,
      a:visited {
          text-decoration: underline;
      }
  
      a[href]:after {
          content: " (" attr(href) ")";
      }
  
      abbr[title]:after {
          content: " (" attr(title) ")";
      }
  
      /*
       * Don't show links for images, or javascript/internal links
       */
  
      .ir a:after,
      a[href^="javascript:"]:after,
      a[href^="#"]:after {
          content: "";
      }
  
      pre,
      blockquote {
          border: 1px solid #999;
          page-break-inside: avoid;
      }
  
      thead {
          display: table-header-group; /* h5bp.com/t */
      }
  
      tr,
      img {
          page-break-inside: avoid;
      }
  
      img {
          max-width: 100% !important;
      }
  
      @page {
          margin: 0.5cm;
      }
  
      p,
      h2,
      h3 {
          orphans: 3;
          widows: 3;
      }
  
      h2,
      h3 {
          page-break-after: avoid;
      }
  }