@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none;
}

a img {
  border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none;
}

a img {
  border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
}

/**
 * Creates a colored button from an element.
 *
 * @param $color Button color. Border and hover color are calculated from this automatically.
 */
/* szürkészöld */
/* vöröses */
/* világoskék */
/* szürke */
body {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 14px;
  color: #3d3d3d;
  min-height: 100%;
  padding: 0;
  margin: 0;
}
body.no-footer {
  background-image: url("../img/login_bg.jpg");
}

a {
  color: #22b7d5;
  text-decoration: none;
  outline: none;
}
a:hover {
  color: #178095;
}

a.button, input[type="submit"], input[type="clear"] {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}
a.button:hover, input[type="submit"]:hover, input[type="clear"]:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
a.button:active, input[type="submit"]:active, input[type="clear"]:active {
  outline: none;
}
a.button.disabled, input[type="submit"].disabled, input[type="clear"].disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}

small {
  font-size: 0.8em;
}

input {
  outline: none;
}

b, strong {
  font-weight: bold;
}

i, em {
  font-style: italic;
}

h1 {
  font-family: 'Bree Serif', serif;
  font-size: 2em;
}

.unreset li ul, #lesson-view div.left li.content #slider-text li ul, .unreset li ol, #lesson-view div.left li.content #slider-text li ol {
  margin: 1em 1.5em;
}
.unreset ul, #lesson-view div.left li.content #slider-text ul, .unreset ol, #lesson-view div.left li.content #slider-text ol {
  margin: 1.5em 1.5em 1.5em 2.5em;
}
.unreset ul, #lesson-view div.left li.content #slider-text ul {
  list-style-type: disc;
}
.unreset li, #lesson-view div.left li.content #slider-text li {
  margin: 1em 1.5em;
}
.unreset ul ul, #lesson-view div.left li.content #slider-text ul ul {
  list-style-type: circle;
}
.unreset ol, #lesson-view div.left li.content #slider-text ol {
  list-style-type: decimal;
}
.unreset li, #lesson-view div.left li.content #slider-text li {
  display: list-item;
}
.unreset em, #lesson-view div.left li.content #slider-text em {
  font-style: italic;
}
.unreset strong, #lesson-view div.left li.content #slider-text strong {
  font-weight: bold;
}

fieldset {
  background-color: #eee;
  border: 1px solid #d6d6d6;
  padding: 20px 38px;
  margin-bottom: 20px;
}
fieldset.center {
  text-align: center;
}
fieldset h3 {
  margin: 0;
  padding: 0;
  font-weight: bold;
  font-size: 1.2em;
}
fieldset.left {
  float: left;
  margin-right: 30px;
}
fieldset .left {
  float: left;
  margin-right: 10px;
}

.emptyField, input[type="text"].empty, input[type="email"].empty, input[type="password"].empty, input[type="number"].empty, input[type="tel"].empty, input[type="url"].empty, textarea.empty {
  border-color: #c20f0f;
  -webkit-box-shadow: 0 0 3px #c20f0f;
  -moz-box-shadow: 0 0 3px #c20f0f;
  box-shadow: 0 0 3px #c20f0f;
}

input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="url"] {
  border: 1px solid #e5e5e5;
  padding: 5px;
  padding-top: 7px;
  margin: 0;
  font-size: 1.2em;
}
input[type="text"].placeholder, input[type="email"].placeholder, input[type="password"].placeholder, input[type="number"].placeholder, input[type="tel"].placeholder, input[type="url"].placeholder {
  font-style: italic;
}
input[type="text"]:-moz-placeholder, input[type="email"]:-moz-placeholder, input[type="password"]:-moz-placeholder, input[type="number"]:-moz-placeholder, input[type="tel"]:-moz-placeholder, input[type="url"]:-moz-placeholder {
  font-style: italic;
}
input[type="text"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="number"]::-moz-placeholder, input[type="tel"]::-moz-placeholder, input[type="url"]::-moz-placeholder {
  font-style: italic;
}
input[type="text"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, input[type="tel"]:-ms-input-placeholder, input[type="url"]:-ms-input-placeholder {
  font-style: italic;
}
input[type="text"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="number"]::-webkit-input-placeholder, input[type="tel"]::-webkit-input-placeholder, input[type="url"]::-webkit-input-placeholder {
  font-style: italic;
}

input[readonly] {
  color: #999;
}

textarea {
  border: 1px solid #e5e5e5;
  resize: none;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.2em;
  padding: 5px;
  margin: 0;
  outline: none;
}
textarea.placeholder {
  font-style: italic;
}
textarea:-moz-placeholder {
  font-style: italic;
}
textarea::-moz-placeholder {
  font-style: italic;
}
textarea:-ms-input-placeholder {
  font-style: italic;
}
textarea::-webkit-input-placeholder {
  font-style: italic;
}

label {
  display: block;
  font-size: 1.2em;
  margin-top: 16px;
  vertical-align: top;
  padding-left: 5px;
}
label small {
  color: #999;
  font-size: 0.8em;
}

/* default select */
select {
  font-size: 1.2em;
  padding: 5px;
  border: 1px solid #e5e5e5;
  margin: 0;
  outline: none;
  background-color: #FFF;
}

.switch-table {
  margin-top: 8px;
  margin-left: 5px;
}
.switch-table th {
  font-size: 1.2em;
  padding-right: 10px;
}
.switch-table .onoffswitch {
  margin: 0;
}
.switch-table .switch-label {
  margin-top: 2px;
}
.switch-table td {
  padding-top: 8px;
  padding-bottom: 8px;
}

div.submit {
  width: 100%;
  padding-top: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}

/**
 * Custom ON/OFF switch
 */
.onoffswitch {
  vertical-align: top;
  display: inline-block;
  position: relative;
  width: 40px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.onoffswitch div {
  vertical-align: top;
  display: inline-block;
}
.onoffswitch input[type="checkbox"] {
  display: none;
}
.onoffswitch input[type="checkbox"]:checked + label .inner {
  margin-left: 0;
}
.onoffswitch input[type="checkbox"]:checked + label .switch {
  right: 0px;
}
.onoffswitch label {
  display: block;
  overflow: hidden;
  cursor: pointer;
  border: 4px solid transparent;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  -ms-border-radius: 7px;
  -o-border-radius: 7px;
  border-radius: 7px;
  margin: 0 !important;
  padding: 0 !important;
}
.onoffswitch label .inner {
  width: 200%;
  margin-left: -100%;
  -moz-transition: margin 0.3s ease-in 0s;
  -webkit-transition: margin 0.3s ease-in 0s;
  -o-transition: margin 0.3s ease-in 0s;
  transition: margin 0.3s ease-in 0s;
  display: block;
}
.onoffswitch label .inner:before, .onoffswitch label .inner:after {
  float: left;
  width: 50%;
  height: 20px;
  padding: 0;
  line-height: 15px;
  font-size: 17px;
  color: white;
  font-family: Trebuchet, Arial, sans-serif;
  font-weight: bold;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-clip: padding-box;
}
.onoffswitch label .inner:before {
  content: "";
  background-color: #1BBC9D;
  color: #333333;
}
.onoffswitch label .inner:after {
  content: "";
  background-color: #F65600;
  color: #FFFFFF;
  text-align: right;
}
.onoffswitch label .switch {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #d2d2d2;
  width: 12px;
  margin: 0px;
  background: #FFFFFF;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 22px;
  -moz-transition: all 0.3s ease-in 0s;
  -webkit-transition: all 0.3s ease-in 0s;
  -o-transition: all 0.3s ease-in 0s;
  transition: all 0.3s ease-in 0s;
  border-bottom: 3px solid #d2d2d2;
  padding-top: 3px;
  text-align: center;
  color: #d2d2d2;
}

.color-changed label .inner:before {
  content: "";
  background-color: #F65600;
  color: #333333;
}
.color-changed label .inner:after {
  content: "";
  background-color: #1BBC9D;
  color: #FFFFFF;
  text-align: right;
}

.switch-label {
  display: inline-block;
  padding-top: 7px;
  font-weight: 600;
  color: #919191;
  margin-left: 8px;
}

div.upload-default, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader, .courseAdd div#courseAddContent div.marketing .uploader, div.users-edit .uploader {
  width: 120px;
  height: 200px;
  cursor: pointer;
  text-align: center;
  border: 1px dashed #7e7e7e;
  background-color: #efefef;
  font-size: 1em;
  display: inline-block;
  line-height: 100%;
  overflow: hidden;
}
div.upload-default div.add, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader div.add, .courseAdd div#courseAddContent div.marketing .uploader div.add, div.users-edit .uploader div.add {
  color: #d4d4d4;
  height: 100%;
  display: block;
}
div.upload-default div.add:hover, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader div.add:hover, .courseAdd div#courseAddContent div.marketing .uploader div.add:hover, div.users-edit .uploader div.add:hover {
  color: #bbbbbb;
}
div.upload-default a:link, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader a:link, .courseAdd div#courseAddContent div.marketing .uploader a:link, div.users-edit .uploader a:link, div.upload-default a:visited, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader a:visited, .courseAdd div#courseAddContent div.marketing .uploader a:visited, div.users-edit .uploader a:visited {
  position: absolute;
  z-index: 10;
  display: block;
  background-color: #efefef;
  padding: 5px;
}
div.upload-default a:link i, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader a:link i, .courseAdd div#courseAddContent div.marketing .uploader a:link i, div.users-edit .uploader a:link i, div.upload-default a:visited i, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader a:visited i, .courseAdd div#courseAddContent div.marketing .uploader a:visited i, div.users-edit .uploader a:visited i {
  color: red;
  margin-right: 5px;
}
div.upload-default div.add-text, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader div.add-text, .courseAdd div#courseAddContent div.marketing .uploader div.add-text, div.users-edit .uploader div.add-text {
  color: #3b3b3b;
}

.plain-uploader .upload-button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
.plain-uploader .upload-button:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.plain-uploader .upload-button:active {
  outline: none;
}
.plain-uploader .upload-button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.plain-uploader .upload-button.disabled {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: gray;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #595959;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  cursor: default;
}
.plain-uploader .upload-button.disabled:hover {
  color: #ffffff;
  background-color: #a6a6a6;
  border-bottom: 2px solid #a6a6a6;
}
.plain-uploader .upload-button.disabled:active {
  outline: none;
}
.plain-uploader .upload-button.disabled.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.plain-uploader .upload-button i {
  margin-right: 5px;
}
.plain-uploader progress {
  display: none;
}
.plain-uploader .stop-button, .plain-uploader .remove-button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
.plain-uploader .stop-button:hover, .plain-uploader .remove-button:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.plain-uploader .stop-button:active, .plain-uploader .remove-button:active {
  outline: none;
}
.plain-uploader .stop-button.disabled, .plain-uploader .remove-button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.plain-uploader .filename a {
  color: #22b7d5;
}
.plain-uploader small {
  color: #666;
}

.uploaded-file-list h3 {
  font-weight: 600;
  margin-top: 20px;
  margin-bottom: 5px;
}
.uploaded-file-list ul.file-list li {
  padding: 6px;
  background-color: #FAFAFA;
  margin-bottom: 3px;
}
.uploaded-file-list ul.file-list li a {
  color: #22b7d5;
}
.uploaded-file-list ul.file-list li a.remove-file {
  color: #666;
}

.imageeditor {
  text-align: center;
}
.imageeditor input[type='Submit'] {
  margin-top: 20px;
}

header.header {
  background-color: #fff;
  margin-top: -60px;
  height: 60px;
}
@media only screen and (max-width: 420px) {
  header.header {
    height: inherit;
    text-align: center;
  }
}
header.header .header-image, header.header .loggedin-subdomainImage {
  margin-top: 10px;
  margin-left: 2%;
  float: left;
}
@media only screen and (max-width: 420px) {
  header.header .header-image, header.header .loggedin-subdomainImage {
    float: none;
    margin-left: -15px;
    margin-top: 0;
    padding-top: 10px;
  }
}
header.header .header-subdomainImage {
  padding-top: 5px;
}
header.header .header-subdomainImage .subdomain-logo {
  display: block;
  margin: auto;
}
header.header .loggedin-subdomainImage {
  margin-top: 17px;
}
header.header .header-course-button {
  margin-top: 18px;
  margin-left: 9%;
  margin-right: 9%;
  font-size: 1.1em;
  float: left;
}
@media only screen and (max-width: 1200px) {
  header.header .header-course-button {
    margin-left: 7%;
    margin-right: 7%;
  }
}
@media only screen and (max-width: 1150px) {
  header.header .header-course-button {
    margin-left: 5%;
    margin-right: 5%;
  }
}
@media only screen and (max-width: 700px) {
  header.header .header-course-button {
    display: none;
  }
}
header.header .header-searchform {
  margin-top: 18px;
  float: left;
  font-weight: normal;
}
@media only screen and (max-width: 1125px) {
  header.header .header-searchform {
    display: none;
  }
}
header.header .nav-menu {
  float: right;
  /* 680px és 440px között hülyén néz ki ezzel! */
  display: inline-block;
}
@media only screen and (max-width: 420px) {
  header.header .nav-menu {
    float: right;
  }
}
header.header .nav-menu ul.menu {
  list-style-type: none;
  padding-right: 15px;
  margin-top: 16px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 420px) {
  header.header .nav-menu ul.menu {
    margin-top: 0;
  }
}
header.header .nav-menu ul.menu li {
  display: inline-block;
  position: relative;
  height: 40px;
  font-size: 1.15em;
}
header.header .nav-menu ul.menu li img {
  -webkit-border-radius: 36px;
  -moz-border-radius: 36px;
  -ms-border-radius: 36px;
  -o-border-radius: 36px;
  border-radius: 36px;
  border: 1px solid #e6e6e6;
  width: 36px;
  height: 36px;
  margin-right: 10px;
  vertical-align: middle;
}
header.header .nav-menu ul.menu li.userMenu {
  border-bottom: 2px solid #1bbc9d;
  padding-bottom: 3px;
  margin-bottom: -20px;
  margin-left: 15px;
  margin-right: 5px;
  height: 40px;
  cursor: pointer;
  min-width: 170px;
}
@media only screen and (max-width: 420px) {
  header.header .nav-menu ul.menu li.userMenu {
    min-width: 90px;
    margin-top: 13px;
  }
}
header.header .nav-menu ul.menu li.userMenu a {
  padding: 0;
  display: inline-block;
}
header.header .nav-menu ul.menu li.userMenu a:hover {
  background-color: #FFF;
}
header.header .nav-menu ul.menu li.userMenu a.to-profile {
  float: left;
}
header.header .nav-menu ul.menu li.userMenu .name {
  font-weight: bold;
  display: inline-block;
  max-width: 145px;
  min-width: 80px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media only screen and (max-width: 500px) {
  header.header .nav-menu ul.menu li.userMenu .name {
    display: none;
  }
}
header.header .nav-menu ul.menu li i {
  margin-left: 8px;
}
header.header .nav-menu ul.menu li .notification {
  font-size: 1.5em;
  font-weight: bold;
  margin-left: 20px;
  color: #f65600;
  float: right;
  margin-top: 5px;
  margin-right: 10px;
}
@media only screen and (max-width: 400px) {
  header.header .nav-menu ul.menu li .notification {
    margin-left: 0;
  }
}
header.header .nav-menu ul.menu li .notification i {
  color: #444;
  font-size: 0.7em;
  margin-left: 2px;
}
header.header .nav-menu ul.menu li a {
  text-decoration: none;
  color: #3d3d3d;
  padding: 10px 7px;
  display: block;
}
header.header .nav-menu ul.menu li a:hover {
  background-color: #e5e5e5;
}
header.header .nav-menu ul.menu li:hover > ul.sub-menu {
  display: block;
}
header.header .nav-menu ul.menu li ul.sub-menu {
  display: none;
  position: absolute;
  width: 100%;
  padding-top: 7px;
  text-align: left;
  border-bottom: 2px solid #1bbc9d;
  -webkit-border-radius: 0 0 3px 3px;
  -moz-border-radius: 0 0 3px 3px;
  -ms-border-radius: 0 0 3px 3px;
  -o-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px;
  z-index: 10000;
  margin-top: 38px;
}
@media only screen and (max-width: 480px) {
  header.header .nav-menu ul.menu li ul.sub-menu {
    right: 0;
    width: 240px;
  }
}
header.header .nav-menu ul.menu li ul.sub-menu li {
  display: block;
  background-color: white;
  margin: 0px;
  height: auto;
}
header.header .nav-menu ul.menu li ul.sub-menu li a {
  text-decoration: none;
  color: black;
  padding-left: 5px;
  padding-right: 5px;
  padding: 10px 15px;
  display: block;
  max-width: 225px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
header.header .nav-menu ul.menu li ul.sub-menu li a i {
  margin-right: 8px;
}
header.header .nav-menu ul.menu li ul.sub-menu li a:hover {
  background-color: #e5e5e5;
}
header.header .nav-menu ul.menu li ul.sub-menu li img {
  width: 20px;
  height: 20px;
  border: none;
  margin-left: 6px;
  margin-right: 5px;
}
@media only screen and (max-width: 880px) {
  header.header .nav-menu ul.menu li.l1, header.header .nav-menu ul.menu li.l2 {
    display: none;
  }
}
@media only screen and (max-width: 400px) {
  header.header .nav-menu ul.menu li {
    float: none;
  }
}
@media only screen and (max-width: 420px) {
  header.header .center {
    float: none;
  }
}

.inline-form .searchbutton {
  /* position: relative;
   top: -1px;
   left: -5px;*/
  margin-left: -3px;
  width: 25px;
  padding-top: 6px;
  padding-left: 5px;
  /* megfelelő méretű legyen a keret */
  padding-right: 20px;
  display: inline-block;
  height: 30px;
  background-color: white;
  color: #676767;
  border: 1px solid #f0f0f0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
.inline-form .searchbutton:hover {
  background-color: #FFF;
  border-bottom: 1px solid #f0f0f0;
  /* Also keret se legyen */
}
.inline-form input[type="text"] {
  float: left;
  background-color: #f0f0f0;
  width: 150px;
  margin: 0px;
  padding: 5px 10px 0 10px;
  border: 1px solid #f0f0f0;
  height: 30px;
  font-size: 1.1em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-border-radius: 3px 0 0 3px;
  -moz-border-radius: 3px 0 0 3px;
  -ms-border-radius: 3px 0 0 3px;
  -o-border-radius: 3px 0 0 3px;
  border-radius: 3px 0 0 3px;
}
.inline-form input[type="text"].placeholder {
  font-style: italic;
  color: #9b9b9b;
}
.inline-form input[type="text"]:-moz-placeholder {
  font-style: italic;
  color: #9b9b9b;
}
.inline-form input[type="text"]::-moz-placeholder {
  font-style: italic;
  color: #9b9b9b;
}
.inline-form input[type="text"]:-ms-input-placeholder {
  font-style: italic;
  color: #9b9b9b;
}
.inline-form input[type="text"]::-webkit-input-placeholder {
  font-style: italic;
  color: #9b9b9b;
}

@media only screen and (max-width: 525px) {
  header.logedin .header-image, header.logedin header.header .loggedin-subdomainImage, header.header header.logedin .loggedin-subdomainImage {
    float: left;
    margin-left: 0px;
  }
}

/*
 * Oldal menü soványabb változata
 * verzió: v2
 * együtt működik a div.profil-menu-vel
 */
.side-menu-mini {
  width: 15%;
  float: left;
  min-width: 230px;
  text-align: left;
  font-size: 1.1em;
  vertical-align: top;
  display: inline-block;
}
.side-menu-mini > .active, .side-menu-mini > a:hover, .side-menu-mini > a:active, .side-menu .side-menu-mini > a:not(.noActive):hover, .side-menu .side-menu-mini > a:not(.noActive):active {
  background-color: #21B7D8;
  font-weight: 600;
}
.side-menu-mini > .active:before, .side-menu-mini > a:hover:before, .side-menu-mini > a:active:before, .side-menu .side-menu-mini > a:hover:not(.noActive):before, .side-menu .side-menu-mini > a:active:not(.noActive):before {
  margin-top: 3px;
  margin-left: 190px;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-left: 5px solid #21B7D8;
  border-bottom: 5px solid transparent;
  content: ' ';
  font-size: 0;
}
.side-menu-mini > .active:link, .side-menu-mini > a:link:hover, .side-menu-mini > a:link:active, .side-menu-mini > .active:visited, .side-menu-mini > a:visited:hover, .side-menu-mini > a:visited:active {
  color: #fff;
}
.side-menu-mini > a:link, .side-menu-mini > a:visited {
  padding: 0 0 0 10px;
  margin-top: 5px;
  vertical-align: middle;
  padding-top: 5px;
  padding-bottom: 2px;
  color: #454545;
  width: 190px;
  height: 20px;
  font-size: 1.1em;
  display: block;
}
.side-menu-mini > div {
  margin-top: 15px;
  margin-left: 10px;
}

/*
 * Oldalsó menü 
 * verzió: v2
 * együtt működik a div.profil-menu-vel
 */
.side-menu {
  width: 15%;
  float: left;
  min-width: 280px;
  text-align: left;
  vertical-align: top;
  padding: 10px 0;
}
.side-menu .title {
  padding: 5px 0 5px 10px;
  font-weight: 600;
  font-size: 1.3em;
  color: #3e3e3e;
}
.side-menu hr {
  border: none;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  margin-left: 5px;
  margin-right: 5px;
}
.side-menu .active, .side-menu .side-menu-mini > a:hover, .side-menu .side-menu-mini a:active, .side-menu-mini .side-menu a:active, .side-menu a:not(.noActive):hover, .side-menu a:not(.noActive):active {
  background-color: #21B7D8;
}
.side-menu .active:before, .side-menu .side-menu-mini > a:hover:before, .side-menu .side-menu-mini a:active:before, .side-menu-mini .side-menu a:active:before, .side-menu a:hover:not(.noActive):before, .side-menu a:active:not(.noActive):before {
  margin-top: 3px;
  margin-left: 250px;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-left: 5px solid #21B7D8;
  border-bottom: 5px solid transparent;
  content: ' ';
  font-size: 0;
}
.side-menu .active:link, .side-menu .side-menu-mini > a:link:hover, .side-menu .side-menu-mini a:link:active, .side-menu-mini .side-menu a:link:active, .side-menu a:link:not(.noActive):hover, .side-menu a:link:not(.noActive):active, .side-menu .active:visited, .side-menu .side-menu-mini > a:visited:hover, .side-menu .side-menu-mini a:visited:active, .side-menu-mini .side-menu a:visited:active, .side-menu a:visited:not(.noActive):hover, .side-menu a:visited:not(.noActive):active {
  color: #fff;
}
.side-menu a:link, .side-menu a:visited {
  padding: 0 0 0 10px;
  margin-top: 5px;
  vertical-align: middle;
  padding-top: 5px;
  padding-bottom: 2px;
  color: #454545;
  width: 250px;
  height: 20px;
  font-size: 1.15em;
  display: inline-block;
}
.side-menu a:link.noActive, .side-menu a:visited.noActive {
  height: 12px;
  font-size: 1.101em;
}
.side-menu a.noActive:hover, .side-menu a.noActive:active {
  color: #20b7d7;
}

.wrapper {
  padding: 60px 0 145px 0;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.flash {
  background-color: #1bbc9d;
  padding: 6px 20px;
  color: #FFF;
  font-size: 1.1em;
  display: none;
}
.flash.error {
  background-color: #f55600;
}

.lessonflash {
  width: 100%;
  position: absolute;
}

.full-content-box {
  border-top: 1px solid #ccc;
  background-color: #e8e8e8;
  overflow: hidden;
  background-size: 100%;
  width: 100%;
  min-height: 100%;
  position: relative;
}
@media only screen and (max-width: 585px) {
  .full-content-box {
    text-align: center;
  }
}
.full-content-box.no-footer {
  background: none;
}

.full-content-box-lesson {
  background-color: #e8e8e8;
  overflow: hidden;
  background-size: 100%;
  width: 100%;
}
@media only screen and (max-width: 585px) {
  .full-content-box-lesson {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
  }
}

.content-box {
  background-color: #e8e8e8;
  padding-left: 20px;
  padding-right: 20px;
  /*hr{
    border: 2px dashed shade($conent-bg-color, 20);
  }*/
}
.content-box h1 {
  padding: 35px 0 30px 0;
  text-align: center;
  color: #383838;
}
.content-box h1 div {
  /* Csúnya, csúny, de megy */
  display: inline-block;
  top: 20px;
  position: relative;
  background-color: #e8e8e8;
}

/* felső dobozok */
.head-blocks {
  text-align: center;
  overflow: hidden;
  margin: 0;
  background-color: white;
  padding: 30px 25px 17px 25px;
  color: #404040;
}
@media only screen and (max-width: 1150px) {
  .head-blocks {
    padding: 0px;
  }
}
.head-blocks .head-blocks-center {
  width: 100%;
}
@media only screen and (max-width: 1150px) {
  .head-blocks .head-blocks-center {
    width: 620px;
    margin: 0 auto;
    overflow: hidden;
  }
}
@media only screen and (max-width: 620px) {
  .head-blocks .head-blocks-center {
    width: 320px;
  }
}
.head-blocks .head-blocks-center .head-block {
  text-align: left;
  float: left;
  width: 23%;
  min-width: 250px;
  margin: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 1150px) {
  .head-blocks .head-blocks-center .head-block {
    margin: 30px;
  }
}
@media only screen and (max-width: 620px) {
  .head-blocks .head-blocks-center .head-block {
    margin: 10px;
  }
}
.head-blocks .head-blocks-center .head-block .block-title img {
  float: left;
  vertical-align: middle;
  width: 30px;
}
.head-blocks .head-blocks-center .head-block .block-title p {
  margin-left: 42px;
  margin-top: 7px;
  font-size: 1.3em;
  height: 50px;
}
@media only screen and (max-width: 589px) {
  .head-blocks .head-blocks-center .head-block .block-title p {
    height: inherit;
  }
}
.head-blocks .head-blocks-center .head-block .block-content {
  margin-top: 10px;
  margin-left: 42px;
  font-size: 15px;
  color: #404040;
  height: 100px;
}
@media only screen and (max-width: 589px) {
  .head-blocks .head-blocks-center .head-block .block-content {
    height: inherit;
  }
}

/* felső dobozok vége */
/* Nagy logó és rajta tartalom */
.head-image {
  background-image: url("../img/landing_page_bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (max-width: 960px) {
  .head-image {
    padding-top: 30px;
  }
}
.head-image .slider-and-form {
  /* Képváltó */
  /* .carousel-continer */
  /* .carousel-continer bejelentkezés alatt */
}
.head-image .slider-and-form .carousel-container, .head-image .slider-and-form .carousel-container-loggedin {
  /* Media query lent! */
  margin-left: 60px;
  height: 300px;
  margin-top: 40px;
  margin-bottom: 40px;
  float: left;
  /* Kis képnél nem kell az egész .carousel-continer */
}
.head-image .slider-and-form .carousel-container .slideshow-control, .head-image .slider-and-form .carousel-container-loggedin .slideshow-control {
  text-align: center;
  margin-top: 7px;
  font-size: 0.9em;
}
.head-image .slider-and-form .carousel-container .slideshow-control a, .head-image .slider-and-form .carousel-container-loggedin .slideshow-control a {
  color: #404040;
  margin-right: 3px;
}
.head-image .slider-and-form .carousel-container .slideshow-control a.active, .head-image .slider-and-form .carousel-container-loggedin .slideshow-control a.active, .head-image .slider-and-form .carousel-container .slideshow-control .side-menu-mini > a:hover, .head-image .slider-and-form .carousel-container-loggedin .slideshow-control .side-menu-mini > a:hover, .head-image .slider-and-form .carousel-container .slideshow-control .side-menu-mini a:active, .side-menu-mini .head-image .slider-and-form .carousel-container .slideshow-control a:active, .head-image .slider-and-form .carousel-container-loggedin .slideshow-control .side-menu-mini a:active, .side-menu-mini .head-image .slider-and-form .carousel-container-loggedin .slideshow-control a:active, .head-image .slider-and-form .carousel-container .slideshow-control .side-menu a:not(.noActive):hover, .side-menu .head-image .slider-and-form .carousel-container .slideshow-control a:not(.noActive):hover, .head-image .slider-and-form .carousel-container-loggedin .slideshow-control .side-menu a:not(.noActive):hover, .side-menu .head-image .slider-and-form .carousel-container-loggedin .slideshow-control a:not(.noActive):hover, .head-image .slider-and-form .carousel-container .slideshow-control .side-menu a:not(.noActive):active, .side-menu .head-image .slider-and-form .carousel-container .slideshow-control a:not(.noActive):active, .head-image .slider-and-form .carousel-container-loggedin .slideshow-control .side-menu a:not(.noActive):active, .side-menu .head-image .slider-and-form .carousel-container-loggedin .slideshow-control a:not(.noActive):active {
  color: white;
}
.head-image .slider-and-form .carousel-container .slideshow-chevron, .head-image .slider-and-form .carousel-container-loggedin .slideshow-chevron {
  color: #dedcdf;
  font-size: 3em;
}
@media only screen and (max-width: 1140px) {
  .head-image .slider-and-form .carousel-container .slideshow-chevron, .head-image .slider-and-form .carousel-container-loggedin .slideshow-chevron {
    display: none;
  }
}
.head-image .slider-and-form .carousel-container .slideshow-chevron.left, .head-image .slider-and-form .carousel-container-loggedin .slideshow-chevron.left {
  margin-right: 20px;
}
.head-image .slider-and-form .carousel-container .slideshow-chevron.right, .head-image .slider-and-form .carousel-container-loggedin .slideshow-chevron.right {
  margin-left: 20px;
}
.head-image .slider-and-form .carousel-container .slideshow-chevron:hover, .head-image .slider-and-form .carousel-container-loggedin .slideshow-chevron:hover {
  color: white;
}
.head-image .slider-and-form .carousel-container .slideshow, .head-image .slider-and-form .carousel-container-loggedin .slideshow {
  display: inline-block;
  vertical-align: middle;
}
.head-image .slider-and-form .carousel-container .slideshow > li, .head-image .slider-and-form .carousel-container-loggedin .slideshow > li {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  display: none;
}
.head-image .slider-and-form .carousel-container .slideshow > li.active, .head-image .slider-and-form .carousel-container-loggedin .slideshow > li.active {
  display: block;
}
@media only screen and (max-width: 960px) {
  .head-image .slider-and-form .carousel-container, .head-image .slider-and-form .carousel-container-loggedin {
    display: none;
  }
}
.head-image .slider-and-form .carousel-container-loggedin {
  text-align: center;
  height: 300px;
  float: none;
  margin: 0;
  padding: 40px 0;
}
.head-image .slider-and-form fieldset.registration {
  margin-top: 40px;
  margin-left: 125px;
  padding: 16px 10px 18px 10px;
  float: left;
  width: 320px;
  color: white;
  font-size: 1.05em;
  font-weight: bold;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  background: rgba(0, 0, 0, 0);
}
@media only screen and (max-width: 1140px) {
  .head-image .slider-and-form fieldset.registration {
    margin-left: 30px;
  }
}
@media only screen and (max-width: 390px) {
  .head-image .slider-and-form fieldset.registration {
    width: 280px;
  }
}
.head-image .slider-and-form fieldset.registration legend {
  font-size: 2em;
  font-family: 'Bree Serif', serif;
  font-weight: normal;
  padding-left: 8px;
  padding-right: 8px;
}
.head-image .slider-and-form fieldset.registration .or-mail {
  display: inline-block;
  margin-top: 3px;
  font-size: 1.1em;
  font-weight: 600;
}
.head-image .slider-and-form fieldset.registration .or-mail input {
  font-size: 1em;
  font-weight: normal;
  margin-bottom: 17px;
}
.head-image .slider-and-form fieldset.registration .or-mail input.placeholder {
  color: #c6c6c6;
}
.head-image .slider-and-form fieldset.registration .or-mail input:-moz-placeholder {
  color: #c6c6c6;
}
.head-image .slider-and-form fieldset.registration .or-mail input::-moz-placeholder {
  color: #c6c6c6;
}
.head-image .slider-and-form fieldset.registration .or-mail input:-ms-input-placeholder {
  color: #c6c6c6;
}
.head-image .slider-and-form fieldset.registration .or-mail input::-webkit-input-placeholder {
  color: #c6c6c6;
}
.head-image .slider-and-form fieldset.registration .submit {
  display: inline-block;
  text-align: left;
  margin: 0;
  margin-right: 10px;
  padding: 0;
}
.head-image .slider-and-form fieldset.registration .submit input[type="submit"] {
  padding-left: 13px;
  padding-right: 13px;
  font-size: 1.1em;
  font-weight: 600;
}
.head-image .slider-and-form fieldset.registration small {
  display: inline-block;
  width: 57%;
  vertical-align: middle;
  font-weight: normal;
  margin-left: 5px;
  line-height: normal;
  color: #ffffff;
}
.head-image .slider-and-form fieldset.registration small.aszf {
  width: 60%;
  margin-left: 130px;
  margin-top: -55px;
  font-size: 0.7em;
}
@media only screen and (max-width: 390px) {
  .head-image .slider-and-form fieldset.registration small.aszf {
    text-align: left;
  }
}
.head-image .slider-and-form fieldset.registration footer {
  padding: 0;
  background-color: transparent;
  margin-top: 5px;
  color: #c2c2c2;
  font-size: 1.1em;
  font-weight: normal;
  text-align: left;
}
.head-image .slider-and-form fieldset.registration footer a {
  color: #FFF;
  font-weight: 600;
  font-size: 1.2em;
}
@media only screen and (max-width: 960px) {
  .head-image .slider-and-form fieldset.registration {
    /* A képváltó ekkor tűnik el, ilyenkor már nem kell lebegtetés, hanem inkább menjen középre */
    float: none;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
  }
}
.head-image .slider-and-form fieldset.registration .button {
  margin-bottom: 5px;
  padding: 7px 15px 7px 15px;
  width: 100%;
  font-size: 14pt;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 390px) {
  .head-image .slider-and-form fieldset.registration .button {
    font-size: 1.1em;
  }
}
.head-image .slider-and-form fieldset.registration .email {
  margin-top: 5px;
  margin-bottom: 10px;
}
.head-image .slider-and-form fieldset.registration .email input[type="email"] {
  width: 310px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-size: 1.1em;
  padding: 5px 10px 5px 10px;
  border: none;
}
.head-image .slider-and-form fieldset.registration .email input[type="email"].placeholder {
  font-style: italic;
}
.head-image .slider-and-form fieldset.registration .email input[type="email"]:-moz-placeholder {
  font-style: italic;
}
.head-image .slider-and-form fieldset.registration .email input[type="email"]::-moz-placeholder {
  font-style: italic;
}
.head-image .slider-and-form fieldset.registration .email input[type="email"]:-ms-input-placeholder {
  font-style: italic;
}
.head-image .slider-and-form fieldset.registration .email input[type="email"]::-webkit-input-placeholder {
  font-style: italic;
}
@media only screen and (max-width: 390px) {
  .head-image .slider-and-form fieldset.registration .email input[type="email"] {
    width: 280px;
  }
}
.head-image .slider-and-form fieldset.registration i.fa-fw {
  text-align: left;
}
.head-image .searchbox-container {
  clear: both;
  background-color: rgba(0, 0, 0, 0.1);
  margin-top: 20px;
  padding: 20px 0px;
}
.head-image .searchbox-container .text {
  float: left;
}
.head-image .searchbox-container form {
  margin: 0 auto;
  width: 95%;
  background-color: #FFF;
  border-radius: 5px;
  display: block;
  line-height: 45px;
  max-width: 660px;
}
.head-image .searchbox-container input {
  width: 75%;
  border: none;
  overflow: hidden !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: bold;
}
@media only screen and (max-width: 520px) {
  .head-image .searchbox-container input {
    width: 65%;
  }
}
@media only screen and (max-width: 520px) {
  .head-image .searchbox-container input {
    width: 55%;
    font-size: 1em;
  }
}
.head-image .searchbox-container button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin: 4px;
  height: 36px;
  background-color: #f65600;
  border-bottom: 2px solid #ac3c00;
  font-weight: 600;
  font-size: 1.2em;
  margin-left: 9px;
  cursor: pointer;
  float: right;
}
.head-image .searchbox-container button:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.head-image .searchbox-container button:active {
  outline: none;
}
.head-image .searchbox-container button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.head-image .searchbox-container button:hover {
  background-color: #f8884c;
}
@media only screen and (max-width: 520px) {
  .head-image .searchbox-container button {
    padding: 5px 10px;
    font-size: 1.1em;
  }
}
.head-image .searchbox-container .searchbox {
  margin: 0 auto;
  width: 660px;
  background-color: white;
  border: 1px solid #5e5e5e;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
      /*button {
        @include color-button($color-button-orange);
        margin: 4px;
        height: $height - 10;
        background-color: $color-button-orange;
        border-bottom: 2px solid shade($color-button-orange, 30);
        font-weight: 600;
        font-size: 1.2em;
        margin-left: 9px;
        cursor: pointer;

        &:hover{
          background-color: tint($color-button-orange, 30);
          //border-bottom: 2px solid tint($color-button-orange, 30);
        }
      }*/
}
.head-image .searchbox-container .searchbox input[type="text"] {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  width: 534px;
  padding: 15px 0 0 15px;
  border: none;
  font-size: 1.2em;
}
.head-image .searchbox-container .searchbox input[type="text"].placeholder {
  font-weight: bold;
  color: #999;
  font-style: normal;
}
.head-image .searchbox-container .searchbox input[type="text"]:-moz-placeholder {
  font-weight: bold;
  color: #999;
  font-style: normal;
}
.head-image .searchbox-container .searchbox input[type="text"]::-moz-placeholder {
  font-weight: bold;
  color: #999;
  font-style: normal;
}
.head-image .searchbox-container .searchbox input[type="text"]:-ms-input-placeholder {
  font-weight: bold;
  color: #999;
  font-style: normal;
}
.head-image .searchbox-container .searchbox input[type="text"]::-webkit-input-placeholder {
  font-weight: bold;
  color: #999;
  font-style: normal;
}
@media only screen and (max-width: 500px) {
  .head-image .searchbox-container .searchbox input[type="text"] {
    width: 350px;
  }
}

nav.tabs-menu {
  width: 100%;
  background-color: #666b6e;
}
nav.tabs-menu ul li {
  display: inline-block;
}
nav.tabs-menu ul li a {
  display: block;
  padding: 18px 16px 15px 15px;
  color: #fff;
  font-weight: 600;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.15em;
}
nav.tabs-menu ul li a:hover {
  color: #cccccc;
}
nav.tabs-menu ul li a.active, nav.tabs-menu ul li .side-menu-mini > a:hover, nav.tabs-menu ul li .side-menu-mini a:active, .side-menu-mini nav.tabs-menu ul li a:active, nav.tabs-menu ul li .side-menu a:not(.noActive):hover, .side-menu nav.tabs-menu ul li a:not(.noActive):hover, nav.tabs-menu ul li .side-menu a:not(.noActive):active, .side-menu nav.tabs-menu ul li a:not(.noActive):active {
  background-color: #f5f6f6;
  border-top: 2px solid #1bbc9d;
  color: #303030;
  cursor: default;
}
nav.tabs-menu ul li a i {
  margin-right: 9px;
}

 /*
.bottom-logos {
 /* margin-top: 20px; //megoldottam paddin-al, SK
  margin-bottom: 20px;
  */
/*
background-image: url('../img/colorfulLine.png');
background-repeat: repeat-x;
background-position: bottom;
*/
.footer-line {
  background-image: url("../img/colorfulLine.png");
  background-repeat: repeat-x;
  background-position: bottom;
  border-top: 1px solid #373737;
  height: 2px;
}

footer {
  padding-top: 30px;
  padding-bottom: 35px;
  background-color: #373737;
  text-align: center;
  color: #c7c7c7;
  /*
  margin-bottom:-100px;
  height:100px;
  */
}
footer div.follow {
  display: inline-block;
  vertical-align: top;
  text-align: center;
}
footer div.follow h2 {
  margin: 0 0 10px 0;
  color: white;
}
footer div.follow ul li {
  display: inline-block;
  font-size: 1.4em;
}
footer div.follow ul li a .fa-circle {
  color: #ababab;
}
footer div.follow ul li a .fa-inverse {
  color: #373737;
}
footer div.follow ul li a:hover .fa-circle {
  color: white;
}
footer nav {
  display: inline-block;
  vertical-align: top;
  margin-left: 5%;
  margin-right: 5%;
}
footer nav ul {
  display: inline-block;
  vertical-align: top;
  margin: 0 25px 0 25px;
}
footer nav ul li {
  margin-bottom: 5px;
  text-align: left;
}
footer nav ul li a {
  color: #c7c7c7;
}
footer nav ul li a:hover {
  color: white;
}
footer nav ul li:first-child {
  font-size: 1.2em;
  line-height: 1.4em;
  font-weight: bold;
}
footer div.logo {
  margin-top: 15px;
  display: inline-block;
}

.teach-content {
  color: #303030;
  padding: 40px 80px 30px 80px;
  background-color: #F0F0F0;
  font-size: 1.2em;
}
.teach-content h1 {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.8em;
  font-weight: bold;
}
.teach-content p {
  margin-top: 28px;
  margin-bottom: 38px;
  line-height: 1.3em;
}
.teach-content .left {
  float: left;
  padding-right: 10%;
  width: 44%;
}
.teach-content .left li:nth-child(1) {
  background-image: url(../img/tanits_1.png);
}
.teach-content .left li:nth-child(2) {
  background-image: url(../img/tanits_2.png);
}
.teach-content .left li:nth-child(3) {
  background-image: url(../img/tanits_3.png);
}
.teach-content .left li:nth-child(4) {
  background-image: url(../img/tanulj_4.png);
}
.teach-content .left li:nth-child(5) {
  background-image: url(../img/tanulj_5.png);
}
.teach-content .left li:nth-child(6) {
  background-image: url(../img/tanits_6.png);
}
.teach-content .left li:nth-child(7) {
  background-image: url(../img/tanits_6.png);
}
.teach-content .right {
  float: right;
  width: 44%;
}
.teach-content .right li:nth-child(1) {
  background-image: url(../img/tanits_7.png);
}
.teach-content .right li:nth-child(2) {
  background-image: url(../img/tanits_8.png);
}
.teach-content .right li:nth-child(3) {
  background-image: url(../img/tanits_9.png);
}
.teach-content .right li:nth-child(4) {
  background-image: url(../img/tanulj_10.png);
}
.teach-content .right li:nth-child(5) {
  background-image: url(../img/tanits_12.png);
}
.teach-content .right li:nth-child(6) {
  background-image: url(../img/tanits_13.png);
  background-position-x: 10px;
}
.teach-content .right li:nth-child(7) {
  background-image: url(../img/tanits_14.png);
}
.teach-content ul li {
  font-size: 1.15em;
  background-image: url(../img/list-calendar.png);
  background-position: 0% 50%;
  background-repeat: no-repeat;
  padding: 30px 0 30px 80px;
  border-bottom: 1px solid #e6e6e6;
  cursor: pointer;
}
.teach-content ul li:last-child {
  border: none;
}
.teach-content ul li .light {
  font-weight: 300;
}
.teach-content ul li strong {
  font-weight: bold;
}
.teach-content ul li .description {
  display: none;
  margin-top: 20px;
  font-size: 0.7em;
  line-height: 1.2em;
}

.learn-content {
  color: #303030;
  padding: 40px 80px 30px 80px;
  background-color: #F0F0F0;
  font-size: 1.2em;
}
.learn-content h1 {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.8em;
  font-weight: bold;
}
.learn-content p {
  margin-top: 28px;
  margin-bottom: 38px;
  line-height: 1.3em;
}
.learn-content .left {
  float: left;
  padding-right: 10%;
  width: 44%;
}
.learn-content .left li:nth-child(1) {
  background-image: url(../img/tanulj_1.png);
}
.learn-content .left li:nth-child(2) {
  background-image: url(../img/tanulj_4.png);
}
.learn-content .left li:nth-child(3) {
  background-image: url(../img/tanulj_2.png);
}
.learn-content .left li:nth-child(4) {
  background-image: url(../img/tanulj_3.png);
}
.learn-content .left li:nth-child(5) {
  background-image: url(../img/tanulj_5.png);
}
.learn-content .right {
  float: right;
  width: 44%;
}
.learn-content .right li:nth-child(1) {
  background-image: url(../img/tanulj_6.png);
}
.learn-content .right li:nth-child(2) {
  background-image: url(../img/tanulj_10.png);
}
.learn-content .right li:nth-child(3) {
  background-image: url(../img/tanulj_7.png);
}
.learn-content .right li:nth-child(4) {
  background-image: url(../img/tanulj_8.png);
}
.learn-content .right li:nth-child(5) {
  background-image: url(../img/tanulj_9.png);
  background-position-x: 10px;
}
.learn-content ul li {
  font-size: 1.15em;
  background-image: url(../img/list-calendar.png);
  background-position: 0% 50%;
  background-repeat: no-repeat;
  padding: 30px 0 30px 80px;
  border-bottom: 1px solid #e6e6e6;
  cursor: pointer;
}
.learn-content ul li:last-child {
  border: none;
}
.learn-content ul li .light {
  font-weight: 300;
}
.learn-content ul li strong {
  font-weight: bold;
}
.learn-content ul li .description {
  display: none;
  margin-top: 20px;
  font-size: 0.7em;
  line-height: 1.2em;
}

div.terms, div.cond {
  margin: 25px;
  text-align: justify;
  line-height: 150%;
}
div.terms p, div.cond p {
  margin: 12px 0;
}
div.terms h1, div.cond h1 {
  text-align: center;
  margin-bottom: 25px;
  text-decoration: underline;
}
div.terms h2, div.cond h2 {
  margin: 40px 0;
  font-size: 1.8em;
}
div.terms p.signal, div.cond p.signal {
  margin-top: 40px;
}
div.terms ul, div.cond ul {
  list-style-type: disc;
}
div.terms ul li, div.cond ul li {
  margin-left: 30px;
}
div.terms div.listMore p, div.cond div.listMore p {
  margin-bottom: 6px;
}
div.terms div.listMore span, div.cond div.listMore span {
  margin: 0 0 30px 30px;
  display: block;
}
div.terms h1.bigTextInsideText, div.cond h1.bigTextInsideText {
  margin: 80px 0 40px 0;
}

div.contact {
  height: 100%;
  width: 100%;
  color: #FFF;
  /* end of contact-content */
}
div.contact div.contact-bg {
  background-image: url(../img/contact_bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
  height: 100%;
  min-height: 100%;
  width: 100%;
  position: absolute;
}
div.contact div.contact-content {
  padding: 50px 20px 20px 70px;
  overflow: hidden;
  position: relative;
}
@media only screen and (max-width: 990px) {
  div.contact div.contact-content {
    padding: 30px 20px 20px 30px;
  }
}
@media only screen and (max-width: 800px) {
  div.contact div.contact-content {
    padding: 15px 10px 10px 15px;
  }
}
div.contact div.contact-content div.left-side {
  float: left;
  width: 33%;
  min-width: 300px;
}
@media only screen and (max-width: 990px) {
  div.contact div.contact-content div.left-side {
    min-width: 225px;
  }
}
@media only screen and (max-width: 800px) {
  div.contact div.contact-content div.left-side {
    min-width: initial;
    width: initial;
    float: none;
    text-align: center;
  }
}
div.contact div.contact-content div.left-side h1 {
  margin-bottom: 30px;
  font-size: 3em;
}
@media only screen and (max-width: 990px) {
  div.contact div.contact-content div.left-side h1 {
    font-size: 2em;
  }
}
@media only screen and (max-width: 800px) {
  div.contact div.contact-content div.left-side h1 {
    margin-bottom: 10px;
  }
}
div.contact div.contact-content div.left-side ul {
  display: block;
}
div.contact div.contact-content div.left-side ul hr {
  width: 70%;
  margin: 0;
}
@media only screen and (max-width: 800px) {
  div.contact div.contact-content div.left-side ul hr {
    margin: 0 auto;
  }
}
div.contact div.contact-content div.left-side ul li {
  display: block;
  margin-bottom: 40px;
}
@media only screen and (max-width: 800px) {
  div.contact div.contact-content div.left-side ul li {
    display: inline-block;
    margin-bottom: 10px;
  }
  div.contact div.contact-content div.left-side ul li:not(.data) span {
    display: inline-block;
  }
}
div.contact div.contact-content div.left-side ul li span {
  display: block;
}
div.contact div.contact-content div.left-side ul li.data {
  font-size: 1.1em;
  margin: 25px 0;
}
@media only screen and (max-width: 990px) {
  div.contact div.contact-content div.left-side ul li.data {
    font-size: 0.9em;
  }
}
@media only screen and (max-width: 800px) {
  div.contact div.contact-content div.left-side ul li.data {
    width: 28%;
    vertical-align: top;
  }
}
@media only screen and (max-width: 400px) {
  div.contact div.contact-content div.left-side ul li.data {
    display: block;
    width: initial;
    margin: 10px 0;
    text-align: center;
  }
}
div.contact div.contact-content div.left-side ul li.data span {
  line-height: 1.2;
}
div.contact div.contact-content div.left-side ul li.data span:first-of-type {
  font-weight: bold;
  font-size: 1.2em;
}
@media only screen and (max-width: 990px) {
  div.contact div.contact-content div.left-side ul li.data span:first-of-type {
    font-size: 1em;
  }
}
div.contact div.contact-content div.left-side ul li:nth-of-type(1) {
  font-size: 1.4em;
}
@media only screen and (max-width: 990px) {
  div.contact div.contact-content div.left-side ul li:nth-of-type(1) {
    font-size: 1.2em;
  }
}
div.contact div.contact-content div.right-side {
  position: relative;
  padding-bottom: 30.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  float: right;
  width: 66%;
  height: 50%;
}
@media only screen and (max-width: 990px) {
  div.contact div.contact-content div.right-side {
    width: 60%;
  }
}
@media only screen and (max-width: 800px) {
  div.contact div.contact-content div.right-side {
    width: 95%;
    float: none;
    margin: 0 auto;
    left: 15px;
    padding-bottom: 45.25%;
  }
}
@media only screen and (max-width: 400px) {
  div.contact div.contact-content div.right-side {
    left: 0;
  }
}
div.contact #map-canvas {
  margin: 0px;
  padding: 10px;
  border: #999 solid 2px;
  position: absolute;
  top: 0;
  left: 0;
  width: 90%;
  height: 90%;
}

.teapot {
  margin: 0;
  padding: 0;
  background-color: #DDD;
}
.teapot pre {
  display: none;
}
.teapot div {
  width: 500px;
  height: 400px;
  background-image: url("../img/teapot.png");
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  margin-left: -250px;
  margin-top: -200px;
  left: 50%;
  top: 50%;
}
.teapot div h1 {
  position: relative;
  bottom: 0;
  font-size: 48px;
  width: 500px;
  text-align: center;
  font-family: 'Bree Serif', serif;
  color: #333;
  text-shadow: 0 -1px 0 #FFF;
}

.course-box {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  width: 280px;
  height: 300px;
  margin-right: 10px;
  margin-bottom: 10px;
  display: inline-block;
  background-color: #fff;
  text-align: left;
  border-bottom: 2px solid #bcbcbc;
}
.course-box .cover {
  width: 280px;
  height: 160px;
}
.course-box .cover img {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  position: absolute;
}
.course-box .cover a {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.8);
  width: 280px;
  height: 160px;
  color: white;
  font-size: 18px;
  vertical-align: middle;
  text-align: center;
  position: relative;
}
.course-box .toggle-wishlist {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  display: none;
  position: absolute;
  z-index: 1;
  margin: 8px;
}
.course-box .toggle-wishlist:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.course-box .toggle-wishlist:active {
  outline: none;
}
.course-box .toggle-wishlist.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-box .toggle-wishlist span.space-left {
  margin-left: 8px;
}
.course-box .hidden {
  display: none;
}
.course-box .title {
  width: 260px;
  height: 40px;
  color: #3b3b3b;
  font-size: 16px;
  font-weight: 500;
  padding: 10px;
  position: absolute;
}
.course-box .subtitle {
  display: none;
  padding: 10px;
  width: 260px;
  height: 20px;
  color: #393939;
  font-size: 14px;
  position: absolute;
  overflow: hidden;
  word-break: break-word;
}
.course-box .teacher {
  width: 260px;
  height: 30px;
  padding: 10px;
  margin-top: 50px;
  position: absolute;
  border-top: 1px dashed #d0d0d0;
  border-bottom: 1px dashed #d0d0d0;
}
.course-box .teacher .image {
  float: left;
  margin-right: 5px;
}
.course-box .teacher .name {
  color: #7d7d7d;
  font-size: 14px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 225px;
}
.course-box .teacher .description {
  color: #adadad;
  font-size: 14px;
  margin-top: 2px;
  font-weight: 200;
  font-style: italic;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 225px;
  height: 15px;
}
.course-box .mmk-layer {
  margin-top: 115px;
  text-align: center;
  color: #999;
}
.course-box .members {
  width: 75px;
  color: #949494;
  font-size: 18px;
  font-weight: 500;
  margin-top: 102px;
  padding-top: 10px;
  padding-left: 10px;
  display: inline-block;
}
.course-box .rate {
  width: 100px;
  display: inline-block;
}
.course-box .rate i {
  color: #20b7d7;
  font-size: 16px;
}
.course-box .price {
  color: #1bbc9d;
  font-size: 18px;
  display: inline-block;
}
.course-box:hover {
  border-bottom: 2px solid #20b7d7;
}
.course-box:hover .cover > a:link {
  display: table-cell;
}
.course-box:hover .title {
  display: none;
}
.course-box:hover .subtitle, .course-box:hover .toggle-wishlist {
  display: block;
}

/*


OLD:


*/
.course-info {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  width: 280px;
  height: 300px;
  background-color: #FFF;
  border-bottom: 2px solid #bcbcbc;
  margin-bottom: 20px;
  /* ez a belső szagattot elválasztó a blokkokban */
}
.course-info:hover {
  border-bottom: 2px solid #20b7d7;
}
.course-info:hover .wishlistbtn {
  display: inline-block;
}
.course-info .button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  position: absolute;
  z-index: 1;
  margin: 8px;
}
.course-info .button:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.course-info .button:active {
  outline: none;
}
.course-info .button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-info .wishlistbtn {
  display: none;
}
.course-info button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
.course-info button:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.course-info button:active {
  outline: none;
}
.course-info button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-info .course-info-rightbtn {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  float: right;
}
.course-info .course-info-rightbtn:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.course-info .course-info-rightbtn:active {
  outline: none;
}
.course-info .course-info-rightbtn.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-info .course-info-rightbtn button {
  width: 115px;
}
.course-info .course-image, .course-info .course-image img, .course-info-box-2 .course-image .course-info img, .course-info-box-3 .course-image .course-info img {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  width: 280px;
  height: 150px;
  position: relative;
  /* Kell a bennelévő overlaynek */
}
.course-info .course-image .course-image-overlay, .course-info-box-2 .course-image .course-info img .course-image-overlay, .course-info-box-3 .course-image .course-info img .course-image-overlay {
  position: absolute;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
}
.course-info .course-image .course-image-overlay div.cover-text, .course-info-box-2 .course-image .course-info img .course-image-overlay div.cover-text, .course-info-box-3 .course-image .course-info img .course-image-overlay div.cover-text {
  text-align: center;
  font-weight: bold;
  font-size: 1.3em;
  color: white;
  padding-top: 70px;
  padding-bottom: 100px;
}
.course-info .course-image .course-image-overlay button, .course-info-box-2 .course-image .course-info img .course-image-overlay button, .course-info-box-3 .course-image .course-info img .course-image-overlay button {
  margin: 5px;
}
.course-info .course-title {
  font-size: 1.1em;
  margin-top: 5px;
  font-weight: bold;
  height: 50px;
}
.course-info hr {
  border: none;
  border-top: 1px dashed rgba(192, 192, 192, 0.5);
  margin-left: 5px;
  margin-right: 5px;
}
.course-info .course-notification {
  background-color: #f65600;
  margin-bottom: 15px;
  padding: 5px;
  width: 100px;
  color: #fff;
}
.course-info .course-notification:before {
  margin-left: 100px;
  margin-top: -5px;
  position: absolute;
  width: 0;
  height: 0;
  border-right: 5px solid white;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  content: ' ';
  font-size: 0px;
}
.course-info .course-progressbar {
  margin-bottom: 15px;
  padding: 5px;
  width: 100px;
}
.course-info .course-description {
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 10px;
  height: 100px;
  overflow: hidden;
}
.course-info .course-data {
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 10px;
  height: 100px;
}
.course-info .course-data .course-teacher img {
  margin-top: 10px;
  margin-right: 10px;
  width: 30px;
  height: 30px;
  vertical-align: middle;
}
.course-info .course-data .course-teacher b {
  color: #999;
}
.course-info .course-data .course-teacher .description {
  display: inline-block;
}
.course-info hr {
  width: 260px;
  margin: 0 auto;
}
.course-info .info-footer {
  margin-top: 12px;
}
.course-info .info-footer ul {
  list-style-type: none;
  margin-left: 15px;
}
.course-info .info-footer ul li {
  display: inline-block;
  font-weight: bold;
  font-size: 1.1em;
}
.course-info .info-footer ul li.students {
  color: gray;
  width: 70px;
}
.course-info .info-footer ul li.stars {
  color: #20b7d7;
  width: 95px;
}
.course-info .info-footer ul li.price {
  color: #1bbc9d;
  width: 82px;
  text-align: right;
  margin-right: 5px;
}

.course-info-box-2 {
  margin-right: 10px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  position: relative;
  margin-bottom: 10px;
  width: 280px;
  height: 300px;
  background-color: #FFF;
  border-bottom: 2px solid #bcbcbc;
}
.course-info-box-2:hover {
  border-bottom: 2px solid #20b7d7;
}
.course-info-box-2 a {
  font-size: 1.1em;
}
.course-info-box-2 .course-info-leftbtn {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin: 0 8px 0 15px;
  float: left;
  padding: 7px 20px 7px 17px;
}
.course-info-box-2 .course-info-leftbtn:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.course-info-box-2 .course-info-leftbtn:active {
  outline: none;
}
.course-info-box-2 .course-info-leftbtn.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-info-box-2 .course-info-rightbtn-remove {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin: 0 15px 0 8px;
  float: right;
  width: 75px;
  text-align: center;
}
.course-info-box-2 .course-info-rightbtn-remove:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.course-info-box-2 .course-info-rightbtn-remove:active {
  outline: none;
}
.course-info-box-2 .course-info-rightbtn-remove.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-info-box-2 .course-info-rightbtn-managment {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin: 0 15px 0 8px;
  float: right;
  text-align: center;
  width: 75px;
}
.course-info-box-2 .course-info-rightbtn-managment:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.course-info-box-2 .course-info-rightbtn-managment:active {
  outline: none;
}
.course-info-box-2 .course-info-rightbtn-managment.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-info-box-2 .course-title {
  font-size: 1.1em;
  margin-top: 5px;
  font-weight: bold;
}
.course-info-box-2 .course-progressbar {
  height: 60px;
  margin-left: 15px;
}
.course-info-box-2 .course-progressbar li:nth-child(1) {
  float: left;
  margin-top: 5px;
  color: #20b7d7;
}
.course-info-box-2 .course-progressbar progress[value] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 5px;
  width: 80%;
  margin-left: 10px;
  border: none;
  background-color: #eee;
}
.course-info-box-2 .course-progressbar progress[value]::-webkit-progress-bar {
  background-color: #eee;
  border-radius: 2px;
}
.course-info-box-2 .course-progressbar progress[value]::-webkit-progress-value {
  background-color: #20b7d7;
  background-size: 35px 20px, 100% 100%, 100% 100%;
}
.course-info-box-2 .course-progressbar progress[value]::-moz-progress-bar {
  background-color: #20b7d7;
}
.course-info-box-2 .course-progressbar hr {
  border: none;
  border-top: 1px dashed rgba(192, 192, 192, 0.5);
  width: 94%;
  margin-left: 0px;
}
.course-info-box-2 .course-notification {
  background-color: #f65600;
  margin-left: -5px;
  padding: 5px;
  padding-left: 10px;
  width: 100px;
  margin-top: 24px;
  color: #fff;
}
.course-info-box-2 .course-notification:before {
  margin-left: 101px;
  margin-top: -5px;
  position: absolute;
  width: 0;
  height: 0;
  border-right: 5px solid white;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  content: ' ';
  font-size: 0px;
}
.course-info-box-2 .course-notification:after {
  position: absolute;
  border-right: 5px solid #AF4309;
  content: ' ';
  font-size: 0px;
  margin-left: -90px;
  margin-top: 18px;
  width: 5px;
  height: 0px;
  color: #FFF;
  border-bottom: 5px solid transparent;
}
.course-info-box-2 .course-image, .course-info .course-image .course-info-box-2 img, .course-info-box-2 .course-image img, .course-info-box-3 .course-image .course-info-box-2 img {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  width: 280px;
  height: 150px;
  position: relative;
}
.course-info-box-2 .course-image:hover .course-image-overlay, .course-info .course-image .course-info-box-2 img:hover .course-image-overlay, .course-info-box-2 .course-image img:hover .course-image-overlay, .course-info-box-3 .course-image .course-info-box-2 img:hover .course-image-overlay {
  display: inline !important;
}
.course-info-box-2 .course-image .course-image-overlay, .course-info .course-image .course-info-box-2 img .course-image-overlay, .course-info-box-3 .course-image .course-info-box-2 img .course-image-overlay {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  z-index: 9999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
}
.course-info-box-2 .course-image .course-image-overlay div.cover-text, .course-info .course-image .course-info-box-2 img .course-image-overlay div.cover-text, .course-info-box-3 .course-image .course-info-box-2 img .course-image-overlay div.cover-text {
  text-align: center;
  font-weight: bold;
  font-size: 1.3em;
  color: #fff;
  padding-top: 70px;
  padding-bottom: 70px;
}
.course-info-box-2 .course-data {
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 10px;
  height: 30px;
}
.course-info-box-2 .buttons {
  bottom: 10px;
  position: absolute;
}

.course-box-3 {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  width: 280px;
  height: 300px;
  margin-right: 10px;
  margin-bottom: 10px;
  display: inline-block;
  background-color: #fff;
  border-bottom: 2px solid #bcbcbc;
  text-align: left;
}
.course-box-3 div.triangle {
  content: " ";
  width: 0;
  height: 0;
  border-right: 5px solid #a73a00;
  border-top: 0 solid transparent;
  border-bottom: 5px solid transparent;
  position: absolute;
  z-index: 2;
  margin: 165px auto auto -5px;
}
.course-box-3 div.course-notification {
  color: #fff;
  font-size: 1em;
  margin: 142px 0 0 -5px;
  position: absolute;
  z-index: 2;
  padding: 5px;
  background-color: #f65600;
}
.course-box-3 .cover {
  width: 280px;
  height: 160px;
}
.course-box-3 .cover img {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  position: absolute;
}
.course-box-3 .cover a {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.8);
  width: 280px;
  height: 160px;
  color: white;
  font-size: 18px;
  vertical-align: middle;
  text-align: center;
  position: relative;
}
.course-box-3 .wishlist {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  display: absolute;
  position: absolute;
  z-index: 1;
  margin: 8px;
}
.course-box-3 .wishlist:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.course-box-3 .wishlist:active {
  outline: none;
}
.course-box-3 .wishlist.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-box-3 .hidden {
  display: none;
}
.course-box-3 .coursetitle {
  width: 260px;
  height: 40px;
  color: #3b3b3b;
  font-size: 16px;
  font-weight: 500;
  padding: 10px;
  position: absolute;
}
.course-box-3 .subtitle {
  display: none;
  padding: 10px;
  width: 260px;
  height: 30px;
  color: #393939;
  font-size: 14px;
  position: absolute;
}
.course-box-3 .teacher {
  width: 260px;
  height: 30px;
  padding: 10px;
  margin-top: 50px;
  position: absolute;
  border-top: 1px dashed #d0d0d0;
  border-bottom: 1px dashed #d0d0d0;
}
.course-box-3 .teacher .image {
  float: left;
  margin-right: 5px;
}
.course-box-3 .teacher .name {
  color: #7d7d7d;
  font-size: 14px;
  font-weight: 500;
}
.course-box-3 .teacher .description {
  color: #adadad;
  font-size: 14px;
  margin-top: 2px;
  font-weight: 200;
  font-style: italic;
}
.course-box-3 .info-footer {
  margin-top: 100px;
  position: absolute;
}
.course-box-3 .info-footer ul {
  margin-left: 15px;
}
.course-box-3 .info-footer ul li {
  font-size: 1em;
  display: inline-block;
}
.course-box-3 .info-footer ul li:nth-child(3) {
  display: block;
}
.course-box-3 .info-footer ul li.percent {
  color: #20b7d7;
  margin-top: 5px;
  float: left;
}
.course-box-3 .info-footer ul li.progressbar progress[value] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 5px;
  width: 220px;
  margin-left: 10px;
  border: none;
  background-color: #eee;
}
.course-box-3 .info-footer ul li.progressbar progress[value]::-webkit-progress-bar {
  background-color: #eee;
  border-radius: 2px;
}
.course-box-3 .info-footer ul li.progressbar progress[value]::-webkit-progress-value {
  background-color: #20b7d7;
  background-size: 35px 20px, 100% 100%, 100% 100%;
}
.course-box-3 .info-footer ul li.progressbar progress[value]::-moz-progress-bar {
  background-color: #20b7d7;
}
.course-box-3 .info-footer ul li.next-lesson {
  font-size: 13px;
  color: #3c3c3c;
  clear: both;
  overflow: hidden;
  width: 210px;
  height: 14px;
}
.course-box-3:hover {
  border-bottom: 2px solid #20b7d7;
}
.course-box-3:hover .cover > a:link {
  display: table-cell;
}
.course-box-3:hover .coursetitle {
  display: none;
}
.course-box-3:hover .subtitle, .course-box-3:hover .wishlist {
  display: block;
}

/*

OLD:

*/
.course-info-box-3 {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  position: relative;
  width: 280px;
  height: 300px;
  background-color: #fff;
  border-bottom: 2px solid #bcbcbc;
  margin-bottom: 20px;
  /* ez a belső szagattot elválasztó a blokkokban */
}
.course-info-box-3:hover {
  border-bottom: 2px solid #20b7d7;
}
.course-info-box-3:hover .course-image > .course-image-overlay, .course-info .course-image .course-info-box-3:hover img > .course-image-overlay, .course-info-box-2 .course-image .course-info-box-3:hover img > .course-image-overlay, .course-info-box-3:hover .course-image img > .course-image-overlay {
  display: inline-block;
}
.course-info-box-3:hover .course-data > .course-description {
  display: inline-block;
}
.course-info-box-3:hover .course-title {
  display: none;
}
.course-info-box-3 .course-image, .course-info .course-image .course-info-box-3 img, .course-info-box-2 .course-image .course-info-box-3 img, .course-info-box-3 .course-image img {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  width: 280px;
  height: 150px;
  position: relative;
}
.course-info-box-3 .course-image .course-image-overlay, .course-info .course-image .course-info-box-3 img .course-image-overlay, .course-info-box-2 .course-image .course-info-box-3 img .course-image-overlay {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  background-color: rgba(0, 0, 0, 0.8);
  position: absolute;
  z-index: 9999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
}
.course-info-box-3 .course-image .course-image-overlay div.cover-text, .course-info .course-image .course-info-box-3 img .course-image-overlay div.cover-text, .course-info-box-2 .course-image .course-info-box-3 img .course-image-overlay div.cover-text {
  text-align: center;
  font-weight: bold;
  font-size: 1.3em;
  color: #fff;
  padding-top: 70px;
  padding-bottom: 100px;
}
.course-info-box-3 .course-title {
  font-size: 1.1em;
  margin-top: 5px;
  font-weight: bold;
  height: 55px;
  overflow: hidden;
}
.course-info-box-3 .course-description {
  font-size: 1.1em;
  margin-top: 5px;
  height: 48px;
  overflow: hidden;
  display: none;
}
.course-info-box-3 hr {
  border: none;
  border-top: 1px dashed rgba(192, 192, 192, 0.5);
  margin-left: 5px;
  margin-right: 5px;
}
.course-info-box-3 .course-data {
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 10px;
  height: 100px;
}
.course-info-box-3 .course-data .course-teacher img {
  color: #888;
  float: left;
  width: 30px;
  height: 30px;
  margin-top: 2px;
  margin-right: 10px;
  margin-bottom: 5px;
  vertical-align: middle;
}
.course-info-box-3 .course-data .course-teacher b {
  display: inline-block;
  color: #666;
}
.course-info-box-3 .course-data .course-teacher i {
  color: #ccc;
  width: 200px;
  height: 16px;
  margin-top: 3px;
  overflow: hidden;
  display: inline-block;
}
.course-info-box-3 .course-data .course-teacher .description {
  display: inline-block;
}
.course-info-box-3 hr {
  width: 260px;
  margin: 5px auto;
}
.course-info-box-3 .info-footer {
  position: absolute;
  bottom: 5px;
  margin-top: 5px;
}
.course-info-box-3 .info-footer ul {
  list-style-type: none;
  margin-left: 15px;
}
.course-info-box-3 .info-footer ul li {
  font-size: 1em;
  display: inline-block;
}
.course-info-box-3 .info-footer ul li:nth-child(3) {
  display: block;
}
.course-info-box-3 .info-footer ul li.percent {
  color: #20b7d7;
  margin-top: 5px;
  float: left;
}
.course-info-box-3 .info-footer ul li.progressbar progress[value] {
  -webkit-appearance: none;
  appearance: none;
  height: 5px;
  width: 220px;
  margin-left: 10px;
}
.course-info-box-3 .info-footer ul li.progressbar progress[value]::-webkit-progress-bar {
  background-color: #eee;
  border-radius: 2px;
}
.course-info-box-3 .info-footer ul li.progressbar progress[value]::-webkit-progress-value {
  background-color: #20b7d7;
  background-size: 35px 20px, 100% 100%, 100% 100%;
}
.course-info-box-3 .info-footer ul li.next-lesson {
  font-size: 13px;
  color: #3c3c3c;
  clear: both;
}

.course-add-box {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  border: 1px dashed #9f9f9f;
  background-color: #efefef;
  width: 280px;
  vertical-align: top;
  margin-bottom: 20px;
  height: 300px;
  text-align: center;
}
.course-add-box .plus {
  font-size: 6em;
  margin-top: 100px;
  color: #1bbc9d;
}

.courseAdd .side-menu-mini {
  margin-left: 1%;
  border-right: 1px solid #d8d8d8;
  padding-right: 1%;
}
.courseAdd .side-menu-mini .disabled {
  opacity: 0.5;
}
.courseAdd .side-menu-mini .disabled:hover {
  background-color: transparent;
  font-weight: normal;
  color: #454545;
  cursor: default;
}
.courseAdd .side-menu-mini .disabled:hover:before {
  border: none;
}
.courseAdd .side-menu-mini .completed {
  background-image: url("../img/side-menu-check-gray.png");
  background-repeat: no-repeat;
  background-position: 180px center;
}
.courseAdd .side-menu-mini .completed:hover, .courseAdd .side-menu-mini .completed.active, .courseAdd .side-menu-mini > a.completed:hover, .courseAdd .side-menu-mini a.completed:active, .courseAdd .side-menu-mini .side-menu a.completed:not(.noActive):hover, .side-menu .courseAdd .side-menu-mini a.completed:not(.noActive):hover {
  background-image: url("../img/side-menu-check-white.png");
}
.courseAdd .side-menu-mini #courseProgressLabel {
  display: block;
  font-size: 0.9em;
  color: #1bbc9d;
  margin-top: 30px;
}
.courseAdd .side-menu-mini #courseProgress {
  width: 180px;
  background-color: #fff;
  margin-top: 0;
}
.courseAdd .side-menu-mini #courseProgress > div {
  width: 0;
  height: 5px;
  background-color: #1bbc9b;
}
.courseAdd .side-menu-mini #courseProgressList {
  width: 135px;
  font-size: 0.9em;
  margin-top: 20px;
  padding: 0 8px 20px 8px;
  color: #454545;
}
.courseAdd .side-menu-mini #courseProgressList b {
  display: block;
  font-size: 1.1em;
  margin-bottom: 8px;
}
.courseAdd .side-menu-mini #courseProgressList > div {
  margin: 0 0 5px 5px;
}
.courseAdd .side-menu-mini .publicate {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
.courseAdd .side-menu-mini .publicate:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.courseAdd .side-menu-mini .publicate:active {
  outline: none;
}
.courseAdd .side-menu-mini .publicate.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.courseAdd .side-menu-mini .publicate.disabled {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: gray;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #595959;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
.courseAdd .side-menu-mini .publicate.disabled:hover {
  color: #ffffff;
  background-color: #a6a6a6;
  border-bottom: 2px solid #a6a6a6;
}
.courseAdd .side-menu-mini .publicate.disabled:active {
  outline: none;
}
.courseAdd .side-menu-mini .publicate.disabled.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.courseAdd .side-menu-mini .publicate.disabled:hover {
  background-color: gray;
  border-color: #595959;
}
.courseAdd .course-edit-header {
  color: #fff;
  font-size: 1.13em;
  padding: 11px 1% 0 2%;
  width: 97%;
  height: 29px;
  margin-bottom: 20px;
  font-weight: bold;
  background-color: #454545;
}
.courseAdd .course-edit-header .preview {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin: -6px 0 0 0;
  font-size: 1em;
  float: right;
  cursor: pointer;
}
.courseAdd .course-edit-header .preview:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.courseAdd .course-edit-header .preview:active {
  outline: none;
}
.courseAdd .course-edit-header .preview.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.courseAdd .course-edit-header .preview:nth-of-type(2) {
  margin-right: 15px;
}
.courseAdd div#courseAddContent {
  width: 72%;
  margin-top: 8px;
  margin-right: 1%;
  margin-left: 20px;
  float: left;
  vertical-align: top;
  display: inline-block;
  min-height: 400px;
}
.courseAdd div#courseAddContent ul#chapters {
  width: 100%;
}
.courseAdd div#courseAddContent ul#chapters li.chapter {
  margin-top: 5px;
  margin-bottom: 5px;
  font-size: 1.3em;
}
.courseAdd div#courseAddContent ul#chapters li.chapter:hover .header {
  -webkit-box-shadow: 0 0 3px rgba(150, 150, 150, 0.75);
  -moz-box-shadow: 0 0 3px rgba(150, 150, 150, 0.75);
  box-shadow: 0 0 3px rgba(150, 150, 150, 0.75);
}
.courseAdd div#courseAddContent ul#chapters li.chapter .header:hover .delete-chapter i {
  display: inline-block;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .slide {
  cursor: pointer;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .lessonCount, .courseAdd div#courseAddContent ul#chapters li.chapter .lesson-info {
  -webkit-border-radius: 13px;
  -moz-border-radius: 13px;
  -ms-border-radius: 13px;
  -o-border-radius: 13px;
  border-radius: 13px;
  padding: 5px 10px 5px 10px;
  background-color: #4d4d4d;
  display: inline-block;
  text-align: center;
  color: #ffffff;
  width: 55px;
  float: right;
  margin-top: 13px;
  vertical-align: top;
  font-size: 0.8em;
  font-weight: bold;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .lessonCount.lesson-info, .courseAdd div#courseAddContent ul#chapters li.chapter .lesson-info.lesson-info {
  width: 90px;
  background-color: #d7d7d7;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .lessonCount i, .courseAdd div#courseAddContent ul#chapters li.chapter .lesson-info i {
  font-size: 0.9em;
  margin-right: 5px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .slide i, .courseAdd div#courseAddContent ul#chapters li.chapter .delete i {
  float: right;
  width: 2%;
  min-width: 25px;
  text-align: center;
  display: inline-block;
  vertical-align: top;
  margin: 15px 1% 0 2%;
  font-size: 1em;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .slide i.fa-angle-down, .courseAdd div#courseAddContent ul#chapters li.chapter .slide i.fa-angle-up, .courseAdd div#courseAddContent ul#chapters li.chapter .delete i.fa-angle-down, .courseAdd div#courseAddContent ul#chapters li.chapter .delete i.fa-angle-up {
  color: #555;
  font-size: 1.6em;
  margin-top: 10px;
  margin-right: 1.6%;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .slide i.fa-angle-down:hover, .courseAdd div#courseAddContent ul#chapters li.chapter .slide i.fa-angle-up:hover, .courseAdd div#courseAddContent ul#chapters li.chapter .delete i.fa-angle-down:hover, .courseAdd div#courseAddContent ul#chapters li.chapter .delete i.fa-angle-up:hover {
  color: #222222;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .delete i {
  display: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .number {
  padding-top: 17px;
  padding-left: 2%;
  height: 30px;
  display: inline-block;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .title {
  padding-top: 17px;
  height: 33px;
  width: 50%;
  display: inline-block;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .title input {
  width: 100%;
  padding: 8px;
  padding-left: 2px;
  padding-bottom: 1px;
  font-size: 1em;
  color: #ffffff;
  border: 1px solid #555;
  background-color: transparent;
  margin-top: -8px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .title input[readonly] {
  border-color: #6d6d6d;
  cursor: text;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .title input[readonly]:hover {
  border-color: #555;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .chapter-grabber, .courseAdd div#courseAddContent ul#chapters li.chapter .lesson-grabber {
  display: none;
  float: left;
  width: 50px;
  height: 38px;
  color: #a3a3a3;
  font-size: 1.3em;
  text-align: center;
  cursor: ns-resize;
  padding-top: 12px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .chapter-grabber:hover, .courseAdd div#courseAddContent ul#chapters li.chapter .lesson-grabber:hover {
  color: #707070;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .header {
  margin-left: 50px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  background-color: #6d6d6d;
  height: 50px;
  font-weight: 600;
  color: #FFF;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .header .delete {
  color: #CCC;
}
.courseAdd div#courseAddContent ul#chapters li.chapter .header .delete:hover {
  color: #FFF;
  cursor: pointer;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons {
  width: 90%;
  display: none;
  margin-left: 10%;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson {
  margin-top: 3px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .content {
  margin-left: 50px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff;
  min-height: 50px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .content .inactive {
  background-color: whitesmoke;
  color: #C9C7C7;
  pointer-events: none;
  outline: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson:first-of-type {
  margin-top: 6px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson:hover .content {
  -webkit-box-shadow: 0 0 3px rgba(150, 150, 150, 0.75);
  -moz-box-shadow: 0 0 3px rgba(150, 150, 150, 0.75);
  box-shadow: 0 0 3px rgba(150, 150, 150, 0.75);
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson:hover .delete-lesson i {
  display: inline-block;
  color: #9d9d9d;
  margin-top: 17px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson:hover .delete-lesson i:hover {
  color: #343434;
  cursor: pointer;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .number {
  color: #636363;
  font-weight: 600;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .title {
  font-weight: 600;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .title input {
  color: #636363;
  border-color: #CCC;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .title input[readonly] {
  border-color: #FFF;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .title input[readonly]:hover {
  border-color: #e5e5e5;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .isFree {
  float: right;
  margin-top: 11px;
  margin-right: 15px;
  display: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .isFree .inner, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .isFree .switch {
  font-size: 0.8em;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .isFree .switch-label {
  font-size: 0.8em;
  margin-right: 4px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .slide .fa-angle-down, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .slide .fa-angle-up {
  color: #d6d6d6;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .slide .fa-angle-down:hover, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .slide .fa-angle-up:hover {
  color: #a3a3a3;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent {
  display: none;
  width: 100%;
  font-size: 0.8em;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .cke_ltr {
  -webkit-box-shadow: 0 0 0;
  -moz-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .ckeditor {
  border: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .cke_chrome {
  border: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .cke_top {
  background: transparent;
  background-color: #F5F5F5;
  border-top: none;
  border-right: none;
  border-bottom: none;
  border-left: none;
  box-shadow: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .cke_contents {
  border: 1px solid #ccc;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs {
  margin-bottom: 20px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs ul.ui-tabs-nav {
  border: none;
  padding: 0;
  margin: 0;
  background-color: #e6e7e9;
  -webkit-border-radius: initial;
  -moz-border-radius: initial;
  -ms-border-radius: initial;
  -o-border-radius: initial;
  border-radius: initial;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs ul.ui-tabs-nav li {
  margin: 0;
  height: 40px;
  font-size: 16px;
  padding-top: 5px;
  font-weight: 600;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs ul.ui-tabs-nav li:not(.ui-state-active) {
  border-top: 2px solid #e6e7e9;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs ul.ui-tabs-nav li a {
  color: #6d6d6d;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs .ui-tabs-anchor {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs .ui-tabs-anchor .fa {
  font-size: 1.3em;
  margin-right: 8px;
  vertical-align: bottom;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs .ui-state-default {
  margin: 0;
  border: none;
  border-top: 2px solid #e6e7e9;
  -webkit-border-radius: initial;
  -moz-border-radius: initial;
  -ms-border-radius: initial;
  -o-border-radius: initial;
  border-radius: initial;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs .ui-state-default:hover:not(.ui-state-active) {
  background-color: #dddee0;
  border-top: 2px solid #dddee0;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs .ui-state-active {
  background-color: #f5f5f5;
  border-top: 2px solid #1bbc9d;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .lesson-tabs .ui-tabs-panel {
  background-color: #f5f5f5;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-wrapper, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-viewport {
  margin: 0 !important;
  height: 200px !important;
  float: right;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-wrapper li, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-viewport li {
  width: 400px !important;
  height: 200px !important;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-wrapper .bx-controls, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-viewport .bx-controls {
  text-align: center;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-wrapper .bx-controls .pager, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .bx-viewport .bx-controls .pager {
  font-size: 0.9em;
  display: inline-block;
  margin: 8px 8px 0 8px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .file-list {
  width: 50%;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .file-list span {
  font-size: 1.2em;
  color: #888;
  cursor: move;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .file-list img {
  vertical-align: middle;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .file-list a:link, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .file-list a:visited {
  color: #555;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .file-list a:hover, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lessonContent .file-list a:active {
  color: #222;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .fa-check {
  float: right;
  color: #1abd9e;
  font-size: 1.5em;
  margin: 14px 1% 0 1%;
  display: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader {
  display: inline-block;
  font-size: 1em;
  width: 640px;
  height: 360px;
  margin-right: 20px;
  vertical-align: middle;
  display: table-cell;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader div.add-text {
  margin: 25px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader div.add-plus {
  font-size: 10em;
  display: inline-block;
  margin-top: 115px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader div.content {
  margin-left: 0;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader a:link, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson div.uploader a:visited {
  color: red;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lesson-tabs .plain-uploader {
  margin-top: 20px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lesson-accordion {
  padding: 20px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .lesson-accordion textarea {
  width: 100%;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson input.prezi, .courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson input.youtube {
  height: 22px;
  font-size: 1.3em;
  color: #666;
  padding: 8px;
  margin-top: 8px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset {
  margin: 10px auto;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 5%;
  text-align: left;
  border: 1px solid #bbb;
  background-color: transparent;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset .fa-times {
  color: red;
  margin: 0 2% 0 2%;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset ul.files {
  width: 50%;
  float: right;
  vertical-align: top;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset ul.files li {
  height: 22px;
  margin-bottom: 2px;
  padding-left: 8px;
  padding-top: 8px;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset ul.files li:not(:first-of-type) {
  background-color: #ececec;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset ul.files li .fa-times {
  float: right;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset legend {
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 600;
  color: #3c3c3c;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson fieldset textarea {
  width: 100%;
  resize: none;
  outline: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons {
  text-align: center;
  clear: both;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons input.save {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin-bottom: 20px;
  margin-left: 10px;
  cursor: pointer;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons input.save:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons input.save:active {
  outline: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons input.save.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons .remove {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin-left: 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons .remove:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons .remove:active {
  outline: none;
}
.courseAdd div#courseAddContent ul#chapters li.chapter ul.lessons li.lesson .buttons .remove.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.courseAdd div#courseAddContent ul#chapters .addChapter {
  font-size: 1.3em;
}
.courseAdd div#courseAddContent ul#chapters .addChapter, .courseAdd div#courseAddContent ul#chapters .addLesson {
  margin-left: 50px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  cursor: pointer;
  margin-top: 3px;
  font-weight: bold;
  color: #20b7d7;
  border: 1px dashed #7e7e7e;
  padding: 13px;
}
.courseAdd div#courseAddContent ul#chapters .addChapter:hover, .courseAdd div#courseAddContent ul#chapters .addLesson:hover {
  color: #1991ab;
  border-color: #656565;
  background-color: rgba(0, 0, 0, 0.1);
}
.courseAdd div#courseAddContent ul#chapters .addChapter i, .courseAdd div#courseAddContent ul#chapters .addLesson i {
  font-size: 1em;
}
.courseAdd div#courseAddContent div.courseFirstSteps {
  color: #2a2a2a;
  font-size: 1.1em;
  line-height: 1.2em;
}
.courseAdd div#courseAddContent div.courseFirstSteps h1 {
  font-size: 1.2em;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: bold;
  margin: 0;
  padding: 0;
  margin-bottom: 15px;
}
.courseAdd div#courseAddContent div.courseFirstSteps p {
  margin-top: 15px;
  margin-bottom: 15px;
}
.courseAdd div#courseAddContent div.courseFirstSteps ol {
  list-style-type: decimal;
  margin-left: 20px;
}
.courseAdd div#courseAddContent div.courseFirstSteps ul {
  list-style-type: none;
  margin-left: 0;
  margin-top: 15px;
}
.courseAdd div#courseAddContent div.courseFirstSteps ul li {
  margin-top: 15px;
}
.courseAdd div#courseAddContent div.courseFirstSteps ul li b {
  margin-left: 20px;
}
.courseAdd div#courseAddContent div.courseFirstSteps ul li span {
  margin-left: 29px;
}
.courseAdd div#courseAddContent div.courseFirstSteps ul li ul {
  margin-top: 0;
  margin-left: 47px;
  list-style-type: disc;
}
.courseAdd div#courseAddContent div.courseFirstSteps ul li ul li {
  padding-left: 12px;
  margin-top: 0;
}
.courseAdd div#courseAddContent div.courseData label:first-of-type {
  margin-top: 0;
}
.courseAdd div#courseAddContent div.courseData div:not(.submit):not(.courseDataInput):not(.help):not(.onoffswitch) {
  margin-bottom: 10px;
}
.courseAdd div#courseAddContent div.courseData div:not(.submit):not(.courseDataInput):not(.help):not(.onoffswitch) .cat {
  margin: 0;
}
.courseAdd div#courseAddContent div.courseData div:not(.submit):not(.courseDataInput):not(.help):not(.onoffswitch).categories {
  width: 70%;
  max-width: 600px;
}
.courseAdd div#courseAddContent div.courseData div:not(.submit):not(.courseDataInput):not(.help):not(.onoffswitch).categories .category {
  width: 180px;
  vertical-align: top;
  margin-left: 10px;
  display: inline-block;
  height: 40px;
}
.courseAdd div#courseAddContent div.courseData div:not(.submit):not(.courseDataInput):not(.help):not(.onoffswitch).categories .category input {
  margin-right: 5px;
  float: left;
}
.courseAdd div#courseAddContent div.courseData div:not(.submit):not(.courseDataInput):not(.help):not(.onoffswitch).description {
  width: 62%;
  max-width: 600px;
}
.courseAdd div#courseAddContent div.courseData .counter, .courseAdd div#courseAddContent div.courseData .private-switch .switch-description {
  width: 60%;
  max-width: 590px;
  text-align: right;
  color: #b1b1b1;
  font-size: 12px;
  margin-top: 5px;
}
.courseAdd div#courseAddContent div.courseData .private-switch {
  display: block;
}
.courseAdd div#courseAddContent div.courseData .private-switch .switch-description {
  text-align: left;
}
.courseAdd div#courseAddContent div.courseData .help {
  color: #fff;
  max-width: 300px;
  font-size: 13px;
  position: absolute;
  margin-left: 10px;
  margin-right: 20px;
  padding: 15px 10px 15px 10px;
  background-color: #4a4a4a;
  display: none;
  height: inherit;
  font-size: 1em;
  line-height: 1.2em;
}
.courseAdd div#courseAddContent div.courseData .help:before {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-right: 10px solid #4a4a4a;
  border-bottom: 10px solid transparent;
  content: " ";
  margin-left: -15px;
  position: absolute;
  display: inline-block;
}
.courseAdd div#courseAddContent div.courseData input[type="text"] {
  width: 60%;
  max-width: 590px;
}
.courseAdd div#courseAddContent div.courseData select#teachers {
  width: 60%;
}
.courseAdd div#courseAddContent div.courseData textarea {
  width: 60%;
  max-width: 590px;
  height: 70px;
  resize: none;
}
.courseAdd div#courseAddContent div.courseData textarea[name="data[Course][description]"] {
  height: 230px;
}
.courseAdd div#courseAddContent div.courseData .category {
  margin-top: 10px;
  display: block;
}
.courseAdd div#courseAddContent div.courseData .checkbox {
  display: inline-block;
}
.courseAdd div#courseAddContent div.courseData .checkbox label {
  display: inline-block;
}
.courseAdd div#courseAddContent div.marketing h3 {
  margin-bottom: 20px;
}
.courseAdd div#courseAddContent div.marketing .uploader {
  float: left;
  display: inline-block;
  font-size: 1em;
  height: 150px;
  width: 260px;
  margin-right: 20px;
}
.courseAdd div#courseAddContent div.marketing .uploader div.add-plus {
  font-size: 12em;
  display: inline-block;
  margin-top: 50px;
}
.courseAdd div#courseAddContent div.marketing .uploader a:link, .courseAdd div#courseAddContent div.marketing .uploader a:visited {
  color: red;
}
.courseAdd div#courseAddContent div.marketing .description {
  font-size: 1.2em;
  margin-left: 10%;
}
.courseAdd div#courseAddContent div.marketing .description small {
  display: block;
  margin-top: 20px;
}
.courseAdd div#courseAddContent .files h3 {
  margin-bottom: 20px;
}
.courseAdd div#courseAddContent .files .uploaded-file-list {
  width: 50%;
}

.full-width-submit {
  width: 100%;
  text-align: center;
  margin: 0;
  margin-top: 20px;
  padding: 20px 0 20px 0;
  vertical-align: middle;
  clear: both;
}
.full-width-submit small {
  color: #7c7c7c;
  font-size: 0.9em;
  padding-right: 10px;
}
.full-width-submit a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  color: pointer;
  font-size: 1.2em;
}
.full-width-submit a:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.full-width-submit a:active {
  outline: none;
}
.full-width-submit a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}

.mmk-courses {
  margin: 2%;
}
.mmk-courses h1 {
  font-size: 1.8em;
  margin-bottom: 30px;
}
.mmk-courses .selector {
  text-align: center;
  border-bottom: 2px solid #d5d5d5;
  margin: 30px 0 50px 0;
}
.mmk-courses .selector h1 {
  display: inline-block;
  font-weight: 100;
  font-size: 1.5em;
  position: relative;
  top: 10px;
  background: #e8e8e8;
  padding: 0 12px;
  margin: 0;
}

.sm-courses {
  margin-left: 1%;
}

.ContentContainer {
  float: left;
  width: 74%;
  margin-left: 1%;
  /*
  i.order {
    margin-top: 8px;
    margin-right: 25px;
    float: right;
    color: #555;
    cursor: pointer;
  }
  
  label {
    display: inline-block;
    vertical-align: top;
    margin: 10px;
    font-weight: bold;
  }
  select {
    width: 120px;
    padding: 5px 30px 5px 5px;
    border: 0 !important;
    margin-bottom: 10px;
    outline: none;
    overflow: hidden;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(../img/arrow.png) no-repeat right #fff;

    // Ugly hack to remove the default arrow in Firefox, but works
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    
    option {
      padding: 5px;
    }
  }
  */
}
@media only screen and (max-width: 1200px) {
  .ContentContainer {
    width: 70%;
  }
}
@media only screen and (max-width: 1024px) {
  .ContentContainer {
    width: 66%;
  }
}
@media only screen and (max-width: 900px) {
  .ContentContainer {
    width: 100%;
  }
}
.ContentContainer div.filter-header {
  width: 100%;
  height: auto;
  margin: 15px 0px 100px 0px;
}
@media only screen and (max-width: 1024px) {
  .ContentContainer div.filter-header {
    margin: 15px 0px 130px 0px;
  }
}
@media only screen and (max-width: 600px) {
  .ContentContainer div.filter-header {
    margin: 5px 0;
  }
}
.ContentContainer div.filter-header div.filters {
  text-align: right;
  height: 12px;
  font-size: 1.1em;
  float: right;
  display: block;
  position: absolute;
  right: 0;
}
@media only screen and (max-width: 1024px) {
  .ContentContainer div.filter-header div.filters {
    width: 200px;
    margin-right: 40px;
    height: initial;
  }
}
@media only screen and (max-width: 600px) {
  .ContentContainer div.filter-header div.filters {
    margin: 10px auto;
    position: relative;
    width: 200px;
    float: none;
    height: initial;
    text-align: none;
  }
}
@media only screen and (max-width: 1024px) {
  .ContentContainer div.filter-header div.filters span {
    display: inline-block;
  }
}
@media only screen and (max-width: 1024px) {
  .ContentContainer div.filter-header div.filters a {
    position: absolute;
    top: 58px;
    margin-left: 10px;
  }
}
.ContentContainer div.filter-header div.filters div.dropdown {
  width: 130px;
  display: inline-block;
  text-align: left;
  margin: -3px 25px 0 6px;
  vertical-align: middle;
  padding: 5px 0;
}
@media only screen and (max-width: 1024px) {
  .ContentContainer div.filter-header div.filters div.dropdown {
    margin: 5px 0;
  }
}
@media only screen and (max-width: 600px) {
  .ContentContainer div.filter-header div.filters div.dropdown {
    margin: 5px auto;
    width: initial;
    display: block;
  }
}
.ContentContainer div.filter-header div.filters i {
  font-size: 1.4em;
  vertical-align: bottom;
  margin-bottom: 5px;
  margin-right: 20px;
}
.ContentContainer div.filter-header div.filter-name {
  color: #444;
  height: 12px;
  font-size: 2em;
  font-family: 'Bree Serif', serif;
  float: left;
  width: 50%;
  display: inline-block;
}
@media only screen and (max-width: 1180px) {
  .ContentContainer div.filter-header div.filter-name {
    width: 40%;
  }
}
@media only screen and (max-width: 1075px) {
  .ContentContainer div.filter-header div.filter-name {
    width: 35%;
  }
}
@media only screen and (max-width: 1024px) {
  .ContentContainer div.filter-header div.filter-name {
    width: 50%;
  }
}
@media only screen and (max-width: 900px) {
  .ContentContainer div.filter-header div.filter-name {
    margin-left: 30px;
  }
}
@media only screen and (max-width: 600px) {
  .ContentContainer div.filter-header div.filter-name {
    width: 100%;
    margin-bottom: 25px;
    text-align: center;
    margin-left: 0px;
  }
}
.ContentContainer div.select {
  float: right;
  margin-right: 20px;
}
.ContentContainer div.select:first-of-type {
  margin-right: 15px;
}

.rmm-toggled-controls {
  display: none;
}

@media only screen and (max-width: 900px) {
  .side-menu {
    width: 100%;
    text-align: center;
  }
  .side-menu a:link {
    width: initial;
  }

  .rmm {
    display: block;
    position: relative;
    width: 100%;
    padding: 0px;
    margin: 0 auto !important;
    text-align: center;
    line-height: 19px !important;
  }

  .rmm * {
    -webkit-tap-highlight-color: transparent !important;
    font-family: Arial;
  }

  .rmm a {
    color: #ebebeb;
    text-decoration: none;
  }

  .rmm .rmm-main-list, .rmm .rmm-main-list li {
    margin: 0px;
    padding: 0px;
  }

  .rmm ul {
    display: block;
    width: auto !important;
    margin: 0 auto !important;
    overflow: hidden;
    list-style: none;
  }

  /* sublevel menu - in construction */
  .rmm ul li ul, .rmm ul li ul li, .rmm ul li ul li a {
    display: none !important;
    height: 0px !important;
    width: 0px !important;
  }

  /* */
  .rmm .rmm-main-list li {
    display: inline;
    padding: 0px;
    margin: 0px !important;
  }

  .rmm-toggled {
    display: none;
    width: 100%;
    position: relative;
    overflow: hidden;
    margin: 0 auto !important;
  }

  .rmm-button:hover {
    cursor: pointer;
  }

  .rmm .rmm-toggled ul {
    display: none;
    margin: 0px !important;
    padding: 0px !important;
  }

  .rmm .rmm-toggled ul li {
    display: block;
    margin: 0 auto !important;
  }

  /* MINIMAL STYLE */
  .rmm.minimal a {
    color: #333333;
  }

  .rmm.minimal a:hover {
    opacity: 0.7;
  }

  .rmm.minimal .rmm-main-list li a {
    display: inline-block;
    padding: 8px 30px 8px 30px;
    margin: 0px -3px 0px -3px;
    font-size: 15px;
  }

  .rmm.minimal .rmm-toggled {
    width: 95%;
    min-height: 36px;
  }

  .rmm.minimal .rmm-toggled-controls {
    display: block;
    height: 36px;
    color: #333333;
    text-align: left;
    position: relative;
  }

  .rmm.minimal .rmm-toggled-title {
    position: relative;
    top: 9px;
    left: 9px;
    font-size: 16px;
    color: #33333;
  }

  .rmm.minimal .rmm-button {
    display: block;
    position: absolute;
    right: 9px;
    top: 7px;
  }

  .rmm.minimal .rmm-button span {
    display: block;
    margin: 4px 0px 4px 0px;
    height: 2px;
    background: #333333;
    width: 25px;
  }

  .rmm.minimal .rmm-toggled ul li a {
    display: block;
    width: 100%;
    text-align: center;
    padding: 10px 0px 10px 0px;
    border-bottom: 1px solid #dedede;
    color: #333333;
  }

  .rmm.minimal .rmm-toggled ul li:first-child a {
    border-top: 1px solid #dedede;
  }
}
.course-view {
  width: 100%;
  background-color: #e8e8e8;
  background-image: url("../img/login_bg.jpg");
  background-size: 100% 360px;
  background-repeat: no-repeat;
}
.course-view header {
  padding-top: 40px;
  height: 320px;
  color: #ffffff;
}
.course-view header #movie-container {
  float: left;
  padding-left: 4%;
  padding-right: 4%;
  width: 480px;
  height: 270px;
}
.course-view header #movie-container #movie {
  margin: 0 auto;
}
.course-view header .right {
  width: 40%;
  float: left;
  /*
        .courseViewHeadFreeTime {
          margin: 10px 0px 10px 0px;
          font-size: 1.3em;
  
          a {
            font-weight: bold;
          }
        }
  */
}
.course-view header .right h1 {
  font-family: "Bree Serif", serif;
  font-size: 2.3em;
  margin-bottom: 5px;
  height: 70px;
}
.course-view header .right .description {
  height: 90px;
  font-size: 1.3em;
}
.course-view header .right .price {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  padding: 6px 20px;
  background-color: #ffffff;
  margin-bottom: 20px;
  font-size: 1.6em;
  font-weight: bold;
  color: #1bbc9d;
  border-bottom: 2px solid #dedede;
  display: inline-block;
}
.course-view header .right .subscribe {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  background-color: #f55600;
  font-size: 1.6em;
  font-weight: bold;
  margin-left: -7px;
  position: absolute;
  display: inline-block;
  padding: 6px 30px;
}
.course-view header .right .subscribe:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.course-view header .right .subscribe:active {
  outline: none;
}
.course-view header .right .subscribe.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.course-view header .right #options {
  font-size: 1.2em;
}
.course-view header .right #options i {
  margin: 10px 3px 3px 30px;
}
.course-view header .right #options a {
  font-weight: 600;
  color: #ffffff;
  display: inline-block;
}
.course-view header .right #options a:first-of-type i {
  margin-left: 0;
}
.course-view h2 {
  font-weight: 600;
  font-size: 1.3em;
  margin-bottom: 2px;
  display: block;
}
.course-view .left {
  padding: 20px;
  vertical-align: top;
  width: 63%;
  display: inline-block;
}
.course-view .left .course-description {
  margin-top: 15px;
  line-height: 130%;
  font-size: 1.2em;
}
.course-view .left .course-description p {
  margin-bottom: 10px;
}
.course-view .left ul#lessons {
  margin-top: 30px;
}
.course-view .left ul#lessons li.chapter-title {
  height: 40px;
  color: #ffffff;
  font-size: 18px;
  width: 100%;
  background-color: #929292;
  font-weight: 600;
}
.course-view .left ul#lessons li.chapter-title .chapter-number {
  margin-right: 2%;
  height: 28px;
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  width: 1%;
  display: inline-block;
  padding: 12px 2% 0 2%;
  background-color: #666b6e;
}
.course-view .left ul#lessons li.lesson {
  margin: 15px 15px 15px 0;
  width: 270px;
  height: 50px;
  vertical-align: top;
  display: inline-block;
  line-height: 120%;
  overflow: hidden;
}
.course-view .left ul#lessons li.lesson i {
  text-align: center;
  vertical-align: top;
  width: 60px;
  height: 50px;
  padding-top: 12px;
  font-size: 2em;
  color: #ffffff;
  margin-right: 10px;
  display: inline-block;
  background-color: #20b7d7;
}
.course-view .left ul#lessons li.lesson i.free {
  background-color: #1bbc9d;
}
.course-view .left ul#lessons li.lesson div {
  width: 195px;
  display: inline-block;
  vertical-align: text-bottom;
  color: #777;
  font-size: 1.1em;
}
.course-view .left ul#lessons li.lesson .lessonTitle {
  height: 33px;
  color: #222;
  font-size: 1em;
  display: inline-block;
}
.course-view .left ul#lessons li.lesson .lessonFree {
  color: #ffffff;
  font-size: 13px;
  padding-left: 2px;
  padding-right: 2px;
  margin-left: 5px;
  background-color: #1bbc9d;
}
.course-view ul#sidebar {
  width: 30%;
  margin-top: -30px;
  margin-bottom: 20px;
  display: inline-block;
  float: right;
  margin-right: 2%;
  font-size: 1.2em;
}
.course-view ul#sidebar li {
  padding: 13px 15px;
  margin-bottom: 3px;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
}
.course-view ul#sidebar li h2 {
  margin-bottom: 10px;
  font-size: 1.1em;
}
.course-view ul#sidebar li i {
  color: #20b7d7;
}
.course-view ul#sidebar li.about {
  line-height: 150%;
}
.course-view ul#sidebar li.about .categories a {
  font-weight: 600;
}
.course-view ul#sidebar li.purpose, .course-view ul#sidebar li.requirement, .course-view ul#sidebar li.recommended {
  line-height: 150%;
}
.course-view ul#sidebar li.purpose ul, .course-view ul#sidebar li.requirement ul {
  list-style-type: disc;
  margin-left: 18px;
}
.course-view ul#sidebar li.purpose ul li, .course-view ul#sidebar li.requirement ul li {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  width: 100%;
  margin: 0 0 3px 1px;
  padding: 0;
}
.course-view ul#sidebar li.teacher {
  display: block;
}
.course-view ul#sidebar li.teacher img {
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  -ms-border-radius: 40px;
  -o-border-radius: 40px;
  border-radius: 40px;
  float: left;
  width: 80px;
  height: 80px;
}
.course-view ul#sidebar li.teacher small {
  font-size: 0.9em;
}
.course-view ul#sidebar li.teacher div {
  margin-bottom: 35px;
  padding: 17px 0 10px 100px;
}
.course-view ul#sidebar li.teacher div .teacher-name {
  color: #20b7d7;
  font-size: 1.2em;
  font-weight: 600;
  display: block;
  margin-bottom: 3px;
}
.course-view ul#sidebar li.teacher #group-teachers {
  border-top: 1px solid #ccc;
  font-size: 0.8em;
  padding-top: 20px;
}
.course-view ul#sidebar li.teacher #group-teachers img {
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
  border-radius: 30px;
  width: 60px;
  height: 60px;
}
.course-view ul#sidebar li.teacher #group-teachers div {
  padding-left: 70px;
  margin-bottom: 15px;
}
.course-view ul#sidebar li.teacher-courses .all-others {
  text-align: center;
}
.course-view ul#sidebar li.teacher-courses img {
  margin-right: 8px;
  margin-bottom: 10px;
  display: inline-block;
  vertical-align: text-top;
}
.course-view ul#sidebar li.teacher-courses a {
  color: #3a3a3a;
}
.course-view ul#sidebar li.ratings .rating .name {
  font-size: 16px;
  font-weight: 600;
  display: inline-block;
  margin-top: 8px;
}
.course-view ul#sidebar li.ratings .rating .time {
  margin: 0 4px 0 4px;
  display: inline-block;
}
.course-view ul#sidebar li.ratings .rating .rate {
  display: inline-block;
}
.course-view ul#sidebar li.ratings .rating .rate i {
  cursor: auto;
  margin-left: 3px;
}
.course-view ul#sidebar li.ratings .rating .text {
  margin-bottom: 8px;
}
.course-view ul#sidebar li strong {
  font-weight: bold;
}

.coursePaidView {
  width: 100%;
}
.coursePaidView .courseViewHead {
  padding: 20px 0px;
  margin: 0 auto;
  background-color: #e8e8e8;
  background-image: url("../img/login_bg.jpg");
  background-size: 100%;
  background-repeat: no-repeat;
  overflow: auto;
  color: #ffffff;
}
.coursePaidView .courseViewHead .courseViewMovie {
  width: 140px;
  height: 80px;
  float: left;
  margin: 0 0 0 10px;
  background-color: #4b4b4b;
  border: 1px solid #000;
}
.coursePaidView .courseViewHead .courseViewPresent {
  width: 46%;
  float: left;
  margin: 0 0 0 20px;
}
.coursePaidView .courseViewHead .courseViewPresent strong {
  font-size: 2.2em;
  margin-bottom: 4px;
  display: block;
  font-family: 'Bree Serif', serif;
  font-weight: normal;
}
.coursePaidView .courseViewHead .courseViewPresent i {
  font-size: 1.3em;
  font-weight: bold;
}
.coursePaidView .courseViewHead .courseViewPresent i.fa {
  padding-top: 10px;
  padding-right: 3px;
  display: inline-block;
}
.coursePaidView .courseViewHead .courseViewPresent i a {
  color: #FFF;
}
.coursePaidView .courseViewHead .courseViewPresent i a:hover {
  color: #cccccc;
}
.coursePaidView .courseViewHead .courseViewPresent .studentsCount {
  font-size: 1.15em;
  font-weight: bold;
}
.coursePaidView .courseViewHead .courseViewManager {
  position: absolute;
  right: 0;
  margin: 17px 4% 0 0;
  font-weight: bold;
  font-size: 1.12em;
}
.coursePaidView .courseViewHead .courseViewManager .fa {
  font-size: 1.3em;
  margin: 0 5px 0 25px;
}
.coursePaidView .courseViewHead .courseViewManager a:link, .coursePaidView .courseViewHead .courseViewManager a:visited {
  color: #ffffff;
}
.coursePaidView .courseViewHead .courseViewManager a:hover, .coursePaidView .courseViewHead .courseViewManager a:active {
  color: #e8e8e8;
}
.coursePaidView .courseViewHead .courseViewManager #courseViewSettingsOverlay {
  position: absolute;
  display: none;
  top: 20px;
  right: 0px;
  z-index: 1;
  font-weight: normal;
  width: 370px;
}
.coursePaidView .courseViewHead .courseViewManager #courseViewSettingsOverlay .content {
  border-radius: 3px;
  box-shadow: 0 0 5px #878787;
  background-color: #F1F1F1;
  color: #303030;
  padding: 13px 10px 4px 9px;
  font-size: 1.1em;
}
.coursePaidView .courseViewHead .courseViewManager #courseViewSettingsOverlay .indicator {
  position: relative;
  height: 11px;
  background: url("../img/overlay-indicator.png") no-repeat center;
  z-index: 2;
  left: 130px;
}
.coursePaidView .courseViewHead .courseViewManager #courseViewSettingsOverlay .onoffswitch {
  margin-top: 8px;
}
.coursePaidView .courseViewHead .courseViewManager #courseViewSettingsOverlay .switch-label {
  padding-top: 13px;
}
.coursePaidView .courseViewHead .courseViewManager #courseViewSettingsOverlay .unsubscribe {
  display: block;
  padding: 10px;
  padding-left: 46px;
  background: url("../img/unsubscribe-course.png") no-repeat 14px;
  color: #303030;
}
.coursePaidView .courseViewHead .courseViewManager #courseViewSettingsOverlay .unsubscribe:hover {
  color: #303030;
}
.coursePaidView .payment_settings {
  text-align: center;
}
.coursePaidView .payment_settings .fa-tag {
  color: #ccc;
  font-size: 3em;
  margin: 2px 5px 2px 2px;
  vertical-align: sub;
}
.coursePaidView .payment_settings hr {
  width: 50%;
  border: none;
  border-top: 1px solid #ccc;
}
.coursePaidView .payment_settings .price {
  font-weight: 600;
  margin-top: 35px;
  margin-bottom: 35px;
  display: inline-block;
}
.coursePaidView .payment_settings .price span {
  font-weight: 700;
  font-size: 1.7em;
}
.coursePaidView .payment_settings .payment_types {
  margin: 0 auto 20px auto;
  padding-top: 20px;
  padding-bottom: 20px;
}
.coursePaidView .payment_settings .payment_types .payment_type {
  width: 260px;
  height: 150px;
  margin: 0 auto 30px auto;
  padding-top: 30px;
  background-color: #fff;
  font-weight: 700;
}
.coursePaidView .payment_settings .payment_types .payment_type .button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin-top: 15px;
}
.coursePaidView .payment_settings .payment_types .payment_type .button:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.coursePaidView .payment_settings .payment_types .payment_type .button:active {
  outline: none;
}
.coursePaidView .payment_settings .payment_types .payment_type .button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.coursePaidView .payment_settings .payment_types .payment_type img {
  margin-top: 30px;
}
.coursePaidView .payment_settings .description {
  text-align: left;
  margin: 20px auto;
  display: inline-block;
}
.coursePaidView .payment_settings .description span.title {
  display: block;
  font-size: 1.1em;
  font-weight: 700;
  margin-bottom: 20px;
}
.coursePaidView .courseViewBottom {
  margin: 0px auto;
  width: 100%;
}
.coursePaidView .courseViewBottom .CourseViewDescription {
  width: 56%;
  padding: 20px;
  padding-top: 40px;
  float: left;
  display: none;
}
.coursePaidView .courseViewBottom .CourseViewDescription b {
  display: block;
  font-size: 1.5em;
  margin-bottom: 20px;
}
.coursePaidView .courseViewBottom .CourseViewDescription p {
  margin-bottom: 10px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox {
  width: 56%;
  padding: 20px;
  padding-top: 40px;
  float: left;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead {
  height: 40px;
  margin: 0;
  margin-bottom: 10px;
  padding: 0;
  color: #ffffff;
  display: block;
  background-color: #666b6e;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li {
  padding: 10px 20px 0 20px;
  font-size: 1.2em;
  font-weight: bold;
  display: inline-block;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li a:link, .coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li a:visited {
  color: #ffffff;
  display: inline-block;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li a:hover, .coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li a:active {
  color: #adb1b4;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li.courseViewSocialBoxHeadActive {
  background-color: #f5f6f6;
  border-top: 2px solid #1bbc9d;
  height: 28px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li.courseViewSocialBoxHeadActive a:link, .coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li.courseViewSocialBoxHeadActive a:visited {
  color: #353535;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxHead li i {
  margin: 0 3px 0 0;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  margin: 18px 0 5px 60px;
  padding-left: 11px;
  padding-bottom: 5px;
  padding-right: 10px;
  font-size: 0.9em;
  color: #586569;
  line-height: 150%;
  background-color: #ffffff;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li div.edit {
  float: right;
  width: 100px;
  display: none;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li div.edit div {
  font-size: 1.1em;
  display: inline-block;
  margin-right: 12px;
  color: #20b7d7;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li div.edit i {
  margin: -2px 0 0 0;
  border: none;
  color: #f65600;
  background-color: transparent;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li:hover div.edit {
  display: block;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li textarea {
  margin: 0;
  font-size: 1.3em;
  width: 90%;
  height: 25px;
  padding: 15px 20px 15px 20px;
  border: none;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li textarea.placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li textarea:-moz-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li textarea::-moz-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li textarea:-ms-input-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li textarea::-webkit-input-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li textarea.commenteditor {
  border: 1px solid #e8e8e8;
  font-size: 1.1em;
  padding: 10px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub {
  margin-left: 120px;
  margin-top: 0;
  margin-bottom: 5px;
  word-wrap: break-word;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub b:not(:first-of-type) {
  font-weight: normal;
  font-size: 1.1em;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub textarea {
  margin: 0;
  width: 90%;
  height: 25px;
  padding: 15px 20px 10px 20px;
  border: none;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub textarea.placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub textarea:-moz-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub textarea::-moz-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub textarea:-ms-input-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub textarea::-webkit-input-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub textarea.commenteditor {
  border: 1px solid #e8e8e8;
  font-size: 1.1em;
  padding: 15px 20px 5px 20px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.sub img {
  margin-left: -68px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  padding: 0;
  margin-bottom: 35px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput img {
  margin-top: -2px;
  margin-left: -63px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput input[type="text"] {
  margin: 0;
  font-size: 1.3em;
  width: 90%;
  padding: 15px 20px 10px 20px;
  border: none;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput input[type="text"].placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput input[type="text"]:-moz-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput input[type="text"]::-moz-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput input[type="text"]:-ms-input-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentInput input[type="text"]::-webkit-input-placeholder {
  color: #7d7d7d;
  font-style: italic;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li.commentReply img {
  margin-left: -57px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li img {
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  -ms-border-radius: 25px;
  -o-border-radius: 25px;
  border-radius: 25px;
  margin-left: -74px;
  border: 3px solid #ccc;
  float: left;
  width: 43px;
  height: 43px;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li i {
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  padding: 4px;
  color: gray;
  font-size: 1.2em;
  position: absolute;
  margin: -14px 0 0 -24px;
  display: inline-block;
  border: 2px solid #e8e8e8;
  background-color: #ffffff;
  position: absolute;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li b:first-of-type {
  margin: 6px 0 0 0;
  font-size: 1.3em;
  display: inline-block;
  color: #999;
}
.coursePaidView .courseViewBottom .courseViewSocialBox ul.courseViewSocialBoxList li b {
  font-size: 1.3em;
  color: #323232;
  display: block;
}
.coursePaidView .courseViewBottom .courseViewDatas {
  width: 35%;
  margin-top: -27px;
  padding-right: 20px;
  padding-bottom: 20px;
  float: right;
  display: block;
}
.coursePaidView .courseViewBottom .courseViewDatas li {
  padding: 17px 20px 17px 20px;
  margin-bottom: 3px;
  background-color: #ffffff;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus {
  color: #3c3c3c;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:link:first-of-type, .coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:visited:first-of-type {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin-right: 10px;
  margin-bottom: 8px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:link:first-of-type:hover, .coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:visited:first-of-type:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:link:first-of-type:active, .coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:visited:first-of-type:active {
  outline: none;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:link:first-of-type.disabled, .coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus a:visited:first-of-type.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus .progressbar {
  width: 100%;
  height: 11px;
  margin: 8px 0 0 0;
  padding: 0;
  background-color: #f3f3f3;
  text-align: top;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus .progressbar .progress {
  width: 0;
  height: 11px;
  background-color: #20b7d7;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasSatus .completed {
  font-size: 1.2em;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasMy {
  padding-top: 12px;
  padding-bottom: 12px;
  font-size: 1.15em;
  font-weight: bold;
  color: #494949;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasMy a:first-of-type {
  margin-right: 2em;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasMy a:link, .coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasMy a:visited {
  color: #333;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasMy a:hover, .coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasMy a:active {
  color: #555;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasMy i {
  font-size: 1.2em;
  margin-left: 10px;
  margin-right: 5px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList li {
  margin: 0 0 14px 0;
  padding: 0;
  height: 40px;
  box-shadow: none;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .titleContainer {
  background-color: #f3f3f3;
  font-weight: bold;
  height: 40px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .num {
  width: 35px;
  height: 32px;
  color: #ffffff;
  padding-left: 5px;
  padding-top: 8px;
  margin: 0;
  text-align: center;
  background-color: #666b6e;
  font-size: 1.6em;
  float: left;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .chapterTitle {
  color: #3c3c3c;
  height: 25px;
  padding-top: 15px;
  padding-left: 10px;
  display: inline-block;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList li.lessons {
  height: 32px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList li.lessons:hover .lesson-icon > .fa-check {
  display: none;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList li.lessons:hover .lesson-icon > .fa:not(.fa-check) {
  display: block;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList li.lessons .lesson-icon > .fa:not(.fa-check) {
  display: none;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList li.lessons .lessonTitle {
  color: #2b2b2b;
  line-height: 1.4em;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .fa:not(.fa-check):not(.fa-pencil):not(.fa-download) {
  width: 40px;
  height: 29px;
  color: #ffffff;
  padding-top: 3px;
  margin: 0 10px 0 0;
  text-align: center;
  background-color: #20b7d7;
  font-size: 1.5em;
  float: left;
  padding: 8px 0 0 0;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .fa-check {
  width: 40px;
  height: 29px;
  color: #ffffff;
  padding: 6px 0 2px 0;
  margin: 0 10px 0 0;
  font-weight: bold;
  text-align: center;
  background-color: #1cbba9;
  font-size: 2em;
  float: left;
  filter: alpha(opacity=80);
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .lessonHead {
  color: #8c8c8c;
  font-size: 0.9em;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .lessonHead i {
  margin-left: 5px;
  font-size: 0.8em;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasList .newAnswer {
  color: #f55600;
  padding-left: 5px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate {
  font-size: 1.1em;
  color: #3c3c3c;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input[type="submit"] {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  width: 90px;
  height: initial;
  margin-left: 10px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input[type="submit"]:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input[type="submit"]:active {
  outline: none;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input[type="submit"].disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate span {
  margin-left: 20px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate i {
  padding-left: 5px;
  margin: 0;
  color: #20b7d7;
  font-weight: bold;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate i:hover {
  cursor: pointer;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  width: 75%;
  margin: 10px 0;
  padding: 10px 10px 5px 10px;
  border: 1px solid #ccc;
  font-size: 1.1em;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input.placeholder {
  font-style: italic;
  color: #808080;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input:-moz-placeholder {
  font-style: italic;
  color: #808080;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input::-moz-placeholder {
  font-style: italic;
  color: #808080;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input:-ms-input-placeholder {
  font-style: italic;
  color: #808080;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate input::-webkit-input-placeholder {
  font-style: italic;
  color: #808080;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate .rating-title {
  font-size: 18px;
  color: #3c3c3c;
  font-weight: 800;
  margin: 10px 0 0 20px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate .rating {
  padding: 20px 20px 10px 20px;
  color: #3c3c3c;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate .rating .name {
  font-size: 16px;
  font-weight: 600;
  display: inline-block;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate .rating .time {
  margin: 0 4px 0 4px;
  display: inline-block;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate .rating .rate {
  display: inline-block;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasRate .rating .rate i {
  cursor: auto;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasDownload b {
  font-size: 18px;
  color: #3c3c3c;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasDownload ul {
  list-style-type: disc;
  list-style-position: inside;
  margin-top: 10px;
}
.coursePaidView .courseViewBottom .courseViewDatas li.courseViewDatasDownload ul li {
  padding: 3px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

div.my-notes {
  width: 500px;
  color: #555;
}
div.my-notes div.head {
  text-align: center;
  margin-bottom: 10px;
}
div.my-notes div.head span.title {
  font-weight: 600;
  font-size: 1.4em;
  display: block;
  margin-bottom: 3px;
}
div.my-notes div.head span.subtitle {
  font-size: 1.1em;
}
div.my-notes .note {
  margin-top: 15px;
}
div.my-notes .note i {
  margin: 5px;
  color: #c5c5c5;
}
div.my-notes .note span.chapter, div.my-notes .note span.lesson {
  font-weight: 600;
  font-size: 1.1em;
}
div.my-notes .note span.note {
  margin-left: 20px;
}
div.my-notes .note a:link, div.my-notes .note a:visited {
  color: #00caf1;
}
div.my-notes .note a:hover, div.my-notes .note a:active {
  color: #07b1d2;
}

.subheader {
  color: #e8e8e8;
  font-size: 1.13em;
  padding: 11px 2% 0 2%;
  width: 100%;
  height: 29px;
  margin-bottom: 20px;
  font-weight: bold;
  background-color: #454545;
}

.exam {
  width: 80%;
  margin: 50px auto;
}
.exam h2 {
  font-size: 18px;
  font-weight: 600;
  margin: 0px 0px 10px 20px;
}
.exam .exam-content {
  border: 1px solid #d6d6d6;
  background-color: #efefef;
  padding: 40px;
}
.exam .exam-content p {
  font-size: 16px;
  font-weight: 600;
  margin-top: 20px;
}
.exam .exam-content input[type="radio"] {
  display: none;
}
.exam .exam-content input[type=radio]:checked + label:before {
  background-color: #1bbc9d;
}
.exam .exam-content label {
  cursor: pointer;
  display: inline-block;
  margin-right: 40px;
  margin-top: 10px;
}
.exam .exam-content label:before {
  content: "";
  margin-right: 10px;
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #FFF;
  border-radius: 13px;
  border: 1px solid #c6c6c6;
  float: left;
  margin-top: -3px;
}
.exam .end {
  margin: 20px auto;
  padding-bottom: 40px;
  width: 250px;
}
.exam .end a {
  font-size: 16px;
  font-weight: 600;
  color: #3d3d3d;
  float: left;
  width: 50%;
  margin-top: 10px;
  text-align: center;
}
.exam .end .submit {
  margin: 0px;
  padding: 0px;
}
.exam .end input[type="submit"] {
  font-size: 18px;
  float: right;
  width: 50%;
  margin: 0px;
}

.result {
  width: 50%;
  border: 1px solid #d6d6d6;
  background-color: #efefef;
  margin: 20px auto;
  padding: 30px;
  text-align: center;
}
.result h2 {
  margin: 0px;
}

#lesson-body {
  overflow: hidden;
  background-color: #323232;
}

#lesson-view {
  width: 100%;
  color: #fff;
  text-align: center;
  display: inline-flex;
  background-color: #323232;
}
#lesson-view div.left {
  width: 64%;
  margin-left: 3%;
  margin-right: 23%;
  text-align: left;
  padding-top: 20px;
}
#lesson-view div.left li {
  vertical-align: top;
  display: inline-block;
}
#lesson-view div.left li.back-to-course {
  height: 50px;
}
#lesson-view div.left li.back-to-course a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #4e4e4e;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #363636;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  border-bottom-color: #282828;
  font-size: 1.2em;
  height: auto;
}
#lesson-view div.left li.back-to-course a:hover {
  color: #ffffff;
  background-color: #838383;
  border-bottom: 2px solid #838383;
}
#lesson-view div.left li.back-to-course a:active {
  outline: none;
}
#lesson-view div.left li.back-to-course a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
#lesson-view div.left li.back-to-course a i {
  margin-right: 10px;
}
#lesson-view div.left li.logo {
  float: right;
}
#lesson-view div.left li.lesson-datas {
  display: block;
  font-size: 1.4em;
  font-family: 'Bree Serif', serif;
}
#lesson-view div.left li.lesson-datas i {
  margin: 0 20px 0 20px;
  color: #a2a2a2;
}
#lesson-view div.left li.content {
  width: 100%;
  margin: 20px 0 20px 0;
  display: block;
  background-color: #4c4c4c;
}
#lesson-view div.left li.content #lesson-content-frame {
  margin: 0 auto 35px auto;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam {
  background-color: #4c4c4c;
  padding: 26px 36px 35px 36px;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam.completed {
  text-align: center;
  vertical-align: middle;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam h2 {
  margin-top: 5px;
  margin-bottom: 45px;
  font-size: 1.5em;
  font-weight: bold;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam input[type="radio"] {
  display: none;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam input[type=radio]:checked + label:before {
  background-color: #1bbc9d;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam label {
  cursor: pointer;
  margin-right: 40px;
  margin-top: 10px;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam label:before {
  content: "";
  margin-right: 10px;
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: #FFF;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  float: left;
  margin-top: 0;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation {
  border-top: 1px solid #3a3a3a;
  text-align: center;
  padding-top: 10px;
  position: absolute;
  height: auto;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.2em;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a:active {
  outline: none;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a.disabled {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: gray;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #595959;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a.disabled:hover {
  color: #ffffff;
  background-color: #a6a6a6;
  border-bottom: 2px solid #a6a6a6;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a.disabled:active {
  outline: none;
}
#lesson-view div.left li.content #lesson-content-frame.type-exam #navigation a.disabled.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
#lesson-view div.left li.content #slider-text {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: auto;
  height: 100%;
  padding: 30px;
}
#lesson-view div.left li.content #prezi {
  height: 100%;
}
#lesson-view div.left li.content .bx-controls {
  height: 40px;
  text-align: center;
}
#lesson-view div.left li.content .bx-controls .pager {
  float: right;
  display: inline-block;
  margin: 11px 20px 0 0;
  font-size: 1.3em;
}
#lesson-view div.left li.content .bx-controls i {
  margin: 5px 20px 5px 20px;
  font-size: 2em;
  color: #fff;
}
#lesson-view div.left li.content .bx-controls i:hover {
  color: #ccc;
}
#lesson-view div.left li.content .jwplayer {
  margin: 0 auto;
}
#lesson-view div.left li .num {
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  background-color: #000;
  padding: 0 10px 2px 10px;
  margin-right: 8px;
}
#lesson-view .fa-angle-double-left, #lesson-view .fa-angle-double-right {
  top: 60px;
  cursor: pointer;
  font-size: 1.5em;
  right: 30%;
  position: absolute;
  color: #a0a0a0;
}
#lesson-view .fa-angle-double-left.fa-angle-double-left, #lesson-view .fa-angle-double-right.fa-angle-double-left {
  color: #07c1e8;
}
#lesson-view .fa-angle-double-left.fa-angle-double-left:hover, #lesson-view .fa-angle-double-right.fa-angle-double-left:hover {
  color: #b4ecf8;
}
#lesson-view .fa-angle-double-left:hover, #lesson-view .fa-angle-double-right:hover {
  color: #e2e2e2;
}
#lesson-view .fa-angle-double-left:before, #lesson-view .fa-angle-double-right:before {
  height: 32px;
  width: 18px;
  border-radius: 90px 0 0 90px;
  -moz-border-radius: 90px 0 0 90px;
  -webkit-border-radius: 90px 0 0 90px;
  background-color: #181818;
  display: block;
  padding-top: 8px;
  padding-left: 7px;
}
#lesson-view nav a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #4e4e4e;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #363636;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  border-bottom-color: #282828;
  font-size: 1.2em;
  height: auto;
}
#lesson-view nav a:hover {
  color: #ffffff;
  background-color: #838383;
  border-bottom: 2px solid #838383;
}
#lesson-view nav a:active {
  outline: none;
}
#lesson-view nav a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
#lesson-view nav .navigation-left {
  width: 15%;
  float: left;
}
#lesson-view nav .navigation-right {
  text-align: right;
}
#lesson-view nav .navigation-right a {
  margin-left: 20px;
}
#lesson-view nav .navigation-right .status-button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #486b60;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #324a43;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin-left: 10px;
  font-size: 1.4em;
  padding: 5px 10px;
  color: #354e46;
  cursor: pointer;
}
#lesson-view nav .navigation-right .status-button:hover {
  color: #ffffff;
  background-color: #7e978f;
  border-bottom: 2px solid #7e978f;
}
#lesson-view nav .navigation-right .status-button:active {
  outline: none;
}
#lesson-view nav .navigation-right .status-button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
#lesson-view nav .navigation-right .status-button.active, #lesson-view nav .navigation-right .side-menu-mini > a.status-button:hover, #lesson-view nav .navigation-right .side-menu-mini a.status-button:active, .side-menu-mini #lesson-view nav .navigation-right a.status-button:active, #lesson-view nav .navigation-right .side-menu a.status-button:not(.noActive):hover, .side-menu #lesson-view nav .navigation-right a.status-button:not(.noActive):hover, #lesson-view nav .navigation-right .side-menu a.status-button:not(.noActive):active, .side-menu #lesson-view nav .navigation-right a.status-button:not(.noActive):active {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #486b60;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #324a43;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin-left: 10px;
  font-size: 1.4em;
  padding: 5px 10px;
}
#lesson-view nav .navigation-right .status-button.active:hover, #lesson-view nav .navigation-right .side-menu-mini > a.status-button:hover, #lesson-view nav .navigation-right .side-menu-mini a.status-button:hover:active, .side-menu-mini #lesson-view nav .navigation-right a.status-button:hover:active, #lesson-view nav .navigation-right .side-menu a.status-button:hover:not(.noActive), .side-menu #lesson-view nav .navigation-right a.status-button:hover:not(.noActive) {
  color: #ffffff;
  background-color: #7e978f;
  border-bottom: 2px solid #7e978f;
}
#lesson-view nav .navigation-right .status-button.active:active, #lesson-view nav .navigation-right .side-menu-mini a.status-button:active, .side-menu-mini #lesson-view nav .navigation-right a.status-button:active, #lesson-view nav .navigation-right .side-menu a.status-button:active:not(.noActive), .side-menu #lesson-view nav .navigation-right a.status-button:active:not(.noActive) {
  outline: none;
}
#lesson-view nav .navigation-right .status-button.active.disabled, #lesson-view nav .navigation-right .side-menu-mini > a.status-button.disabled:hover, #lesson-view nav .navigation-right .side-menu-mini a.status-button.disabled:active, .side-menu-mini #lesson-view nav .navigation-right a.status-button.disabled:active, #lesson-view nav .navigation-right .side-menu a.status-button.disabled:not(.noActive):hover, .side-menu #lesson-view nav .navigation-right a.status-button.disabled:not(.noActive):hover, #lesson-view nav .navigation-right .side-menu a.status-button.disabled:not(.noActive):active, .side-menu #lesson-view nav .navigation-right a.status-button.disabled:not(.noActive):active {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
#lesson-view div.right {
  width: 30%;
  position: absolute;
  text-align: left;
  top: 0;
  right: 0;
  bottom: 0;
  vertical-align: top;
  display: inline-block;
}
#lesson-view div.right.show-border {
  border-left: 9px solid #181818;
}
@media only screen and (max-width: 1111px) {
  #lesson-view div.right {
    float: none;
  }
}
#lesson-view div.right ul {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  display: block;
}
#lesson-view div.right ul.menu {
  z-index: 2;
  width: 100%;
  height: 50px;
  position: absolute;
  display: inline-flex;
  font-size: 1.2em;
}
#lesson-view div.right ul.menu li.menuNote, #lesson-view div.right ul.menu li.menuQuestion, #lesson-view div.right ul.menu li.menuCurriculum {
  width: 34%;
  text-align: center;
  background-color: #666b6e;
  border-top: 2px solid #666b6e;
}
#lesson-view div.right ul.menu li.menuNote a.menu-link, #lesson-view div.right ul.menu li.menuQuestion a.menu-link, #lesson-view div.right ul.menu li.menuCurriculum a.menu-link {
  width: 100%;
  height: 30px;
  color: white;
  padding-top: 20px;
  display: block;
  cursor: pointer;
}
#lesson-view div.right ul.menu li.menuNote a.menu-link:hover, #lesson-view div.right ul.menu li.menuQuestion a.menu-link:hover, #lesson-view div.right ul.menu li.menuCurriculum a.menu-link:hover {
  color: #cccccc;
}
#lesson-view div.right ul.menu li.menuNote a.menu-link i, #lesson-view div.right ul.menu li.menuQuestion a.menu-link i, #lesson-view div.right ul.menu li.menuCurriculum a.menu-link i {
  margin-right: 3px;
}
#lesson-view div.right ul.menu li.active {
  background-color: #e8e9ea;
  border-top: 2px solid #1bbc9d;
}
#lesson-view div.right ul.menu li.active a.menu-link {
  color: #0c1e25;
}
#lesson-view div.right ul.menu li.active a.menu-link:hover {
  color: #555555;
}
#lesson-view div.right ul.write {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 30%;
  margin-top: 5px;
  background-color: #e8e9ea;
  padding-bottom: 10px;
}
#lesson-view div.right ul.write #CommentViewForm {
  display: none;
}
#lesson-view div.right ul.write .fa {
  margin-right: 4px;
}
#lesson-view div.right ul.write li.left, #lesson-view div.right ul.write li.right {
  width: 50%;
  height: 30px;
  cursor: pointer;
  padding-top: 20px;
  text-align: center;
  display: inline-block;
  background-color: #666b6e;
  border-top: 2px solid #666b6e;
  font-size: 1.2em;
}
#lesson-view div.right ul.write li.left.left, #lesson-view div.right ul.write li.right.left {
  margin-right: -4px;
}
#lesson-view div.right ul.write li.left a, #lesson-view div.right ul.write li.right a {
  color: white;
}
#lesson-view div.right ul.write li.left:hover a, #lesson-view div.right ul.write li.right:hover a {
  color: #cccccc;
}
#lesson-view div.right ul.write li.content {
  color: #555;
  text-align: left;
  background-color: #e8e9ea;
  margin: 0;
}
#lesson-view div.right ul.write li.content textarea {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  width: 90%;
  padding: 1%;
  margin: 4% 4% 1% 4%;
  border: none;
  resize: none;
  outline: none;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.2em;
  height: 60px;
}
#lesson-view div.right ul.write li.content input[type="submit"] {
  float: right;
  margin-right: 4%;
}
#lesson-view div.right ul.write li.content input[type="checkbox"] {
  margin-left: 5%;
}
#lesson-view div.right ul.write li.active {
  background-color: #e8e9ea;
  border-top: 2px solid #1bbc9d;
  color: #0c1e25;
}
#lesson-view div.right ul.write li.active a {
  color: #0c1e25;
}
#lesson-view div.right ul.write li.active:hover {
  color: #555555;
}
#lesson-view div.right ul.write li.active:hover a {
  color: #555555;
}
#lesson-view div.right .content-outer {
  padding: 60px 8px 185px 15px;
  color: #3c3c3c;
  height: 100%;
  max-height: 100%;
  background-color: #e8e9ea;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  display: block;
}
#lesson-view div.right .content-outer div {
  width: 98%;
  height: 98%;
  padding-right: 2%;
  overflow-y: scroll;
}
#lesson-view div.right .content-outer textarea.commenteditor {
  width: 95%;
  margin-top: 8px;
  overflow-y: hidden;
}
#lesson-view div.right .content-outer li.note {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  background-color: #dee0e1;
  margin-bottom: 8px;
  text-align: left;
  min-width: 294px;
  min-height: 34px;
  padding: 8px;
  line-height: 1.1em;
  display: block;
}
#lesson-view div.right .content-outer li.note:first-of-type {
  margin-top: 20px;
}
#lesson-view div.right .content-outer li.note span.note {
  display: block;
}
#lesson-view div.right .content-outer li.note i {
  color: #a7a7a7;
  float: right;
  cursor: pointer;
  font-size: 1.3em;
}
#lesson-view div.right .content-outer li.note i:hover {
  color: #747474;
}
#lesson-view div.right .content-outer li.question {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  background-color: #dee0e1;
  margin-bottom: 8px;
  text-align: left;
  min-width: 294px;
  min-height: 55px;
  padding: 5px 10px 8px 10px;
  display: block;
}
#lesson-view div.right .content-outer li.question:first-of-type {
  margin-top: 20px;
}
#lesson-view div.right .content-outer li.question strong {
  display: block;
  font-weight: bold;
  margin-bottom: 4px;
  font-size: 1.1em;
  line-height: 1.2em;
}
#lesson-view div.right .content-outer li.question img {
  margin-right: 5px;
  vertical-align: middle;
}
#lesson-view div.right .content-outer li.question .writer {
  color: #7f7f7f;
  margin-top: 12px;
  font-size: 0.9em;
  display: inline-block;
}
#lesson-view div.right .content-outer li.question .fa-trash-o, #lesson-view div.right .content-outer li.question .fa-pencil {
  color: #a7a7a7;
  font-size: 1.3em;
  float: right;
  cursor: pointer;
}
#lesson-view div.right .content-outer li.question .fa-trash-o:hover, #lesson-view div.right .content-outer li.question .fa-pencil:hover {
  color: #747474;
}
#lesson-view div.right .content-outer li.question .fa-angle-right {
  color: #a7a7a7;
  float: right;
  font-size: 2.5em;
  cursor: pointer;
}
#lesson-view div.right .content-outer li.question .fa-angle-right:hover {
  color: #747474;
}
#lesson-view div.right .content-outer li.back {
  text-align: left;
}
#lesson-view div.right .content-outer li.back a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #acc5cc;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #78898e;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.2em;
  height: initial;
  cursor: pointer;
  margin-top: 5px;
  margin-left: 0px;
  margin-bottom: 15px;
}
#lesson-view div.right .content-outer li.back a:hover {
  color: #ffffff;
  background-color: #c4d6db;
  border-bottom: 2px solid #c4d6db;
}
#lesson-view div.right .content-outer li.back a:active {
  outline: none;
}
#lesson-view div.right .content-outer li.back a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
#lesson-view div.right .content-outer li {
  width: 95%;
  min-width: 294px;
}
#lesson-view div.right .content-outer li textarea {
  width: 100%;
}
#lesson-view div.right .content-outer li.answer {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  background-color: #f5f6f6;
  margin-bottom: 5px;
  text-align: left;
  padding: 5px 10px;
  font-size: 1.1em;
  line-height: 1.2em;
  display: block;
}
#lesson-view div.right .content-outer li.answer:nth-child(2) {
  background-color: #FFF;
}
#lesson-view div.right .content-outer li.answer:nth-child(2) span {
  font-weight: bold;
}
#lesson-view div.right .content-outer li.answer:nth-child(2) .writer {
  color: #586569;
  font-weight: normal;
}
#lesson-view div.right .content-outer li.answer img {
  margin-right: 5px;
  vertical-align: middle;
}
#lesson-view div.right .content-outer li.answer .writer {
  color: #8b8b8b;
  margin-top: 5px;
  display: inline-block;
  font-size: 0.8em;
}
#lesson-view div.right .content-outer li.answer div.answer-editor {
  background-color: #FFF;
  overflow-y: inherit;
  float: right;
  width: initial;
  height: initial;
  margin: 10px -8px 2px 0;
  display: none;
}
#lesson-view div.right .content-outer li.answer:hover div.answer-editor {
  display: block;
}
#lesson-view div.right .content-outer textarea {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  outline: none;
  padding: 10px;
  height: 40px;
  border: none;
  resize: none;
  min-width: 294px;
  font-size: 1.2em;
  font-family: 'Source Sans Pro', sans-serif;
}
#lesson-view div.right .content-outer textarea.placeholder {
  color: #474747;
}
#lesson-view div.right .content-outer textarea:-moz-placeholder {
  color: #474747;
}
#lesson-view div.right .content-outer textarea::-moz-placeholder {
  color: #474747;
}
#lesson-view div.right .content-outer textarea:-ms-input-placeholder {
  color: #474747;
}
#lesson-view div.right .content-outer textarea::-webkit-input-placeholder {
  color: #474747;
}
#lesson-view div.right .content-outer li.curriculum {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  margin-bottom: 8px;
  text-align: left;
  min-width: 294px;
  min-height: 34px;
  padding: 8px;
  display: block;
}
#lesson-view div.right .content-outer li.curriculum b {
  display: block;
  margin: 8px 0 8px 0;
  color: #515151;
  font-size: 1.1em;
  padding-left: 8px;
}
#lesson-view div.right .content-outer li.curriculum a:link, #lesson-view div.right .content-outer li.curriculum a:visited {
  color: #555;
  display: block;
  background-color: #f3f3f3;
  padding: 7px 8px;
  font-size: 1.2em;
}
#lesson-view div.right .content-outer li.curriculum a:hover, #lesson-view div.right .content-outer li.curriculum a:active {
  color: #222;
}

.mmk-login {
  width: 300px;
  color: #fff;
  margin: 5% auto;
}
.mmk-login .title {
  font-size: 2.1em;
  margin-bottom: 12px;
  font-family: 'Bree Serif', serif;
}
.mmk-login .subtitle {
  font-size: 1em;
  font-weight: 100;
}
.mmk-login .mmklogin-ugyfelkapu {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #53a248;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #3a7132;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  width: 300px;
  margin: 50px 0 10px 0;
}
.mmk-login .mmklogin-ugyfelkapu:hover {
  color: #ffffff;
  background-color: #86bd7e;
  border-bottom: 2px solid #86bd7e;
}
.mmk-login .mmklogin-ugyfelkapu:active {
  outline: none;
}
.mmk-login .mmklogin-ugyfelkapu.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.mmk-login .mmklogin-mmk {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #0781ca;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #045a8d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  width: 300px;
  margin: 10px 0 10px 0;
}
.mmk-login .mmklogin-mmk:hover {
  color: #ffffff;
  background-color: #51a6d9;
  border-bottom: 2px solid #51a6d9;
}
.mmk-login .mmklogin-mmk:active {
  outline: none;
}
.mmk-login .mmklogin-mmk.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
.mmk-login .mmklogin-webuni {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  width: 300px;
  margin: 10px 0 10px 0;
}
.mmk-login .mmklogin-webuni:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.mmk-login .mmklogin-webuni:active {
  outline: none;
}
.mmk-login .mmklogin-webuni.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}

.success-reg {
  font-family: 'Bree Serif', serif;
  color: #fff;
  font-size: 1.5em;
  text-align: center;
  margin-top: 15%;
  line-height: 200%;
}
.success-reg img {
  margin-left: -75px;
}

.LoginRegSelection {
  max-width: 720px;
  margin: 0 auto;
  padding: 40px 0 40px 0;
  color: #ffffff;
}
@media only screen and (max-width: 720px) {
  .LoginRegSelection {
    width: 320px;
    text-align: center;
    padding: 20px 0;
  }
}
@media only screen and (max-width: 320px) {
  .LoginRegSelection {
    width: 280px;
  }
}
.LoginRegSelection .message {
  color: #f65600;
}
.LoginRegSelection .title {
  font-size: 25pt;
  font-family: 'Bree Serif', serif;
}
.LoginRegSelection .UserLogin, .LoginRegSelection .UserRegistration {
  width: 320px;
  min-height: 405px;
  margin-left: 15px;
}
@media only screen and (max-width: 720px) {
  .LoginRegSelection .UserLogin, .LoginRegSelection .UserRegistration {
    margin-left: 5px;
  }
}
@media only screen and (max-width: 320px) {
  .LoginRegSelection .UserLogin, .LoginRegSelection .UserRegistration {
    width: 280px;
  }
}
.LoginRegSelection .UserLogin:before, .LoginRegSelection .UserRegistration:before {
  width: 41px;
  height: 405px;
  content: ' ';
  margin-left: 400px;
  position: absolute;
  background-image: url("../img/chalk.png");
}
@media only screen and (max-width: 720px) {
  .LoginRegSelection .UserLogin:before, .LoginRegSelection .UserRegistration:before {
    display: none;
  }
}
.LoginRegSelection .UserLogin label, .LoginRegSelection .UserRegistration label {
  display: inline-block;
  width: 100%;
}
.LoginRegSelection .UserLogin label:last-of-type, .LoginRegSelection .UserRegistration label:last-of-type {
  width: auto;
  vertical-align: text-top;
  margin-top: 15px;
  float: left;
  font-size: 14pt;
}
.LoginRegSelection .UserLogin label:nth-child(1), .LoginRegSelection .UserRegistration label:nth-child(1) {
  margin-top: 5px;
  font-size: 16pt;
}
.LoginRegSelection .UserLogin input, .LoginRegSelection .UserRegistration input {
  width: 300px;
}
@media only screen and (max-width: 320px) {
  .LoginRegSelection .UserLogin input, .LoginRegSelection .UserRegistration input {
    width: 260px;
  }
}
.LoginRegSelection .UserLogin div.input, .LoginRegSelection .UserRegistration div.input {
  margin-bottom: 8px;
}
.LoginRegSelection .UserLogin .submit, .LoginRegSelection .UserRegistration .submit {
  display: inline-block;
  width: auto;
  margin: 0px 10px 0px 0px;
  padding: 0px;
}
.LoginRegSelection .UserLogin a.forgotPassword:link, .LoginRegSelection .UserRegistration a.forgotPassword:link, .LoginRegSelection .UserLogin a.forgotPassword:visited, .LoginRegSelection .UserRegistration a.forgotPassword:visited {
  color: #d3d3d3;
}
@media only screen and (max-width: 320px) {
  .LoginRegSelection .UserLogin a.forgotPassword:link, .LoginRegSelection .UserRegistration a.forgotPassword:link, .LoginRegSelection .UserLogin a.forgotPassword:visited, .LoginRegSelection .UserRegistration a.forgotPassword:visited {
    display: block;
    margin-top: 5px;
  }
}
.LoginRegSelection .UserLogin .SendBbutton, .LoginRegSelection .UserRegistration .SendBbutton {
  margin: 12px 0 0 0px;
  width: 135px;
  border: none;
  border-bottom: 2px solid #12836d;
  font-size: 15pt;
}
.LoginRegSelection .UserLogin .checkbox, .LoginRegSelection .UserRegistration .checkbox {
  width: auto;
  margin-top: 15px;
  display: inline-block;
}
.LoginRegSelection .UserLogin input[type=checkbox], .LoginRegSelection .UserRegistration input[type=checkbox] {
  width: 20px;
  height: 20px;
  float: left;
}
.LoginRegSelection .UserLogin .button, .LoginRegSelection .UserRegistration .button {
  width: 270px;
  margin-top: 10px;
  font-size: 14pt;
}
@media only screen and (max-width: 320px) {
  .LoginRegSelection .UserLogin .button, .LoginRegSelection .UserRegistration .button {
    width: 230px;
    margin-top: 10px;
    font-size: 12pt;
  }
}
.LoginRegSelection .UserLogin .loginLink, .LoginRegSelection .UserRegistration .loginLink, .LoginRegSelection .UserLogin .regLink, .LoginRegSelection .UserRegistration .regLink {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #f65600;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #ac3c00;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 600;
  position: absolute;
  margin-top: 155px;
  margin-left: 565px;
  font-size: 15pt;
}
.LoginRegSelection .UserLogin .loginLink:hover, .LoginRegSelection .UserRegistration .loginLink:hover, .LoginRegSelection .UserLogin .regLink:hover, .LoginRegSelection .UserRegistration .regLink:hover {
  color: #ffffff;
  background-color: #f8884c;
  border-bottom: 2px solid #f8884c;
}
.LoginRegSelection .UserLogin .loginLink:active, .LoginRegSelection .UserRegistration .loginLink:active, .LoginRegSelection .UserLogin .regLink:active, .LoginRegSelection .UserRegistration .regLink:active {
  outline: none;
}
.LoginRegSelection .UserLogin .loginLink.disabled, .LoginRegSelection .UserRegistration .loginLink.disabled, .LoginRegSelection .UserLogin .regLink.disabled, .LoginRegSelection .UserRegistration .regLink.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
@media only screen and (max-width: 900px) {
  .LoginRegSelection .UserLogin .loginLink, .LoginRegSelection .UserRegistration .loginLink, .LoginRegSelection .UserLogin .regLink, .LoginRegSelection .UserRegistration .regLink {
    margin-left: 500px;
  }
}
@media only screen and (max-width: 720px) {
  .LoginRegSelection .UserLogin .loginLink, .LoginRegSelection .UserRegistration .loginLink, .LoginRegSelection .UserLogin .regLink, .LoginRegSelection .UserRegistration .regLink {
    display: none;
  }
}
.LoginRegSelection .UserLogin .regLinkST, .LoginRegSelection .UserRegistration .regLinkST, .LoginRegSelection .UserLogin .regLinkST-bkmkik, .LoginRegSelection .UserRegistration .regLinkST-bkmkik {
  position: absolute;
  margin: 125px auto auto 550px;
  font-size: 15pt;
}
@media only screen and (max-width: 900px) {
  .LoginRegSelection .UserLogin .regLinkST, .LoginRegSelection .UserRegistration .regLinkST, .LoginRegSelection .UserLogin .regLinkST-bkmkik, .LoginRegSelection .UserRegistration .regLinkST-bkmkik {
    margin: 125px auto auto 475px;
  }
}
@media only screen and (max-width: 720px) {
  .LoginRegSelection .UserLogin .regLinkST, .LoginRegSelection .UserRegistration .regLinkST, .LoginRegSelection .UserLogin .regLinkST-bkmkik, .LoginRegSelection .UserRegistration .regLinkST-bkmkik {
    display: none;
  }
}
.LoginRegSelection .UserLogin .regLinkST-bkmkik, .LoginRegSelection .UserRegistration .regLinkST-bkmkik {
  margin: 125px auto auto 575px;
}
.LoginRegSelection .UserRegistration .aszf {
  width: 180px;
  font-size: 0.8em;
  margin-left: 140px;
  float: left;
  margin-top: -33px;
}
@media only screen and (max-width: 320px) {
  .LoginRegSelection .UserRegistration .aszf {
    display: block;
    float: none;
    text-align: center;
    margin: 5px 5px;
    width: initial;
  }
}
@media only screen and (max-width: 720px) {
  .LoginRegSelection .UserRegistration #UserRegistrationForm {
    text-align: left;
  }
}
@media only screen and (max-width: 320px) {
  .LoginRegSelection .UserRegistration #UserRegistrationForm {
    text-align: center;
  }
}

/**
 * Tanárok listázása
 */
div.teachers {
  margin: 2%;
}
@media only screen and (max-width: 645px) {
  div.teachers {
    text-align: center;
  }
}
div.teachers div.profil-menu {
  margin: 0 4px 2% 4px;
}
@media only screen and (max-width: 675px) {
  div.teachers div.profil-menu {
    text-align: center;
    height: 100px;
  }
}
div.teachers div.profil-menu form {
  float: right;
  display: inline-block;
}
@media only screen and (max-width: 675px) {
  div.teachers div.profil-menu form {
    float: none;
    display: block;
  }
}
div.teachers div.profil-menu form input {
  background-color: #b4b9bd;
  width: 260px;
  height: 20px;
  padding: 5px 10px 5px 10px;
  border: none;
  margin-top: 10px;
  margin-right: 10px;
  font-size: 1em;
}
div.teachers div.profil-menu form input::-webkit-input-placeholder {
  color: #404447;
}
div.teachers div.profil-menu form input:-moz-placeholder {
  color: #404447;
}
div.teachers div.profil-menu form input::-moz-placeholder {
  color: #404447;
}
div.teachers div.profil-menu form input:-ms-input-placeholder {
  color: #404447;
}
div.teachers div.profil-menu a:link, div.teachers div.profil-menu a:visited {
  float: left;
}
@media only screen and (max-width: 675px) {
  div.teachers div.profil-menu a:link, div.teachers div.profil-menu a:visited {
    float: none;
  }
}
@media only screen and (max-width: 360px) {
  div.teachers div.profil-menu a:link:nth-of-type(2), div.teachers div.profil-menu a:visited:nth-of-type(2) {
    display: none;
  }
}
div.teachers div.teacher-box {
  margin: 4px;
  width: 290px;
  height: 110px;
  display: inline-block;
  background-color: #f5f5f5;
  border: 1px solid #dadada;
  vertical-align: top;
}
div.teachers div.teacher-box img {
  -webkit-border-radius: 43px;
  -moz-border-radius: 43px;
  -ms-border-radius: 43px;
  -o-border-radius: 43px;
  border-radius: 43px;
  border: 3px solid #e8e8e8;
  width: 80px;
  height: 80px;
  margin: 10px;
  float: left;
}
div.teachers div.teacher-box div.teacher-text {
  display: table;
  height: 100%;
}
div.teachers div.teacher-box div.teacher-text a:link, div.teachers div.teacher-box div.teacher-text a:visited {
  color: #22b7d5;
  font-size: 1.5em;
  font-weight: 600;
}
div.teachers div.teacher-box div.teacher-text div.desc-all {
  display: table-cell;
  vertical-align: middle;
}
div.teachers div.teacher-box div.teacher-text div.desc-all div.name {
  text-overflow: ellipsis;
  overflow: hidden;
  width: 170px;
}
div.teachers div.teacher-box div.teacher-text div.sh_desc {
  display: block;
}

/*
 * Tanuló profiloldala
 */
div.users-edit {
  margin: 20px 3% auto 3%;
  /*@include respond-to(1024){
    width: 90%;
    margin: 20px 5% auto 5%;
  }*/
  /*
  *
  * Notifications - értésítések
  *
  */
}
div.users-edit .submit {
  border: 0;
  clear: both;
  margin-top: 30px;
  padding: 0;
}
div.users-edit .dd-container {
  display: inline-block;
}
div.users-edit .dd-select {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border-color: #e5e5e5;
}
div.users-edit .dd-select a.dd-selected {
  font-weight: normal;
  color: #000;
  padding: 3px;
}
div.users-edit .dd-selected-text, div.users-edit .dd-option-text {
  cursor: pointer;
  margin: 0;
  height: 32px;
}
div.users-edit .dd-option {
  padding: 3px;
}
div.users-edit a.new-social {
  margin-top: 5px;
  display: inline-block;
  font-weight: 600;
  font-size: 1.2em;
}
div.users-edit .social-text {
  vertical-align: top;
  height: 26px;
}
div.users-edit a.remove-social {
  margin-left: 5px;
  margin-top: 9px;
  font-size: 1.5em;
  vertical-align: top;
  display: inline-block;
  color: red;
}
div.users-edit a.remove-social.disabled {
  color: gray;
  cursor: default;
}
div.users-edit .uploader {
  display: inline-block;
  overflow: hidden;
  font-size: 1em;
  color: #3b3b3b;
  font-weight: 600;
  width: 125px;
  height: 125px;
  margin-top: 10px;
  background-color: #f3f3f3;
}
div.users-edit .uploader div.add-plus {
  font-size: 10em;
  margin-top: 40px;
  display: inline-block;
}
div.users-edit .uploader div.content {
  padding: 0;
  width: 100%;
  height: 100%;
}
div.users-edit .uploader a:link, div.users-edit .uploader a:visited {
  color: red;
  position: absolute;
}
div.users-edit .toteacher {
  font-size: 1.15em;
  color: #242424;
}
div.users-edit .toteacher .toteacher-info {
  text-align: center;
  line-height: 1.2em;
}
div.users-edit .toteacher table {
  margin-top: 20px;
  border-spacing: 20px 0;
  border-collapse: separate;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
div.users-edit .toteacher table th {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -ms-border-radius: 3px 3px 0 0;
  -o-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  margin-bottom: 20px;
  background-color: #20b7d7;
  color: #FFF;
  font-weight: bold;
  font-size: 1.15em;
  padding: 15px 20px;
}
div.users-edit .toteacher table th div {
  background-image: url(../img/to-teacher-1.png);
  background-position: right center;
  background-repeat: no-repeat;
  height: 22px;
  padding-top: 10px;
  padding-right: 42px;
}
div.users-edit .toteacher table th.second div {
  background-image: url(../img/to-teacher-3.png);
}
div.users-edit .toteacher table tbody td {
  background-color: #FFF;
  color: #494949;
  padding-bottom: 20px;
  vertical-align: top;
}
div.users-edit .toteacher table tbody td b {
  margin-left: 30px;
}
div.users-edit .toteacher table tbody td ul {
  margin: 18px 7px;
  padding-left: 23px;
}
div.users-edit .toteacher table tbody td ul:first-of-type {
  border-bottom: 1px dashed #e8e8e8;
  padding-bottom: 18px;
}
div.users-edit .toteacher table tbody td ul li {
  line-height: 1.2em;
  margin-bottom: 7px;
  list-style-image: url(../img/list-check-blue.png);
  list-style-position: outside;
}
div.users-edit .toteacher table tbody td ul li:last-child {
  margin-bottom: 0;
}
div.users-edit .toteacher table tbody td ul:not(:first-of-type) li {
  list-style-image: url(../img/list-check-orange.png);
}
div.users-edit .toteacher table tbody tr:first-child td {
  padding-top: 20px;
}
div.users-edit .toteacher table tbody tr:last-child td {
  border-bottom: 2px solid #d0d0d0;
  -webkit-border-radius: 0 0 3px 3px;
  -moz-border-radius: 0 0 3px 3px;
  -ms-border-radius: 0 0 3px 3px;
  -o-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px;
  text-align: center;
}
div.users-edit .toteacher table tbody tr:last-child td a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
}
div.users-edit .toteacher table tbody tr:last-child td a:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
div.users-edit .toteacher table tbody tr:last-child td a:active {
  outline: none;
}
div.users-edit .toteacher table tbody tr:last-child td a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
div.users-edit .toteacher table tbody tr:last-child td a.disabled {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #666666;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #474747;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  pointer-events: none;
  cursor: default;
}
div.users-edit .toteacher table tbody tr:last-child td a.disabled:hover {
  color: #ffffff;
  background-color: #939393;
  border-bottom: 2px solid #939393;
}
div.users-edit .toteacher table tbody tr:last-child td a.disabled:active {
  outline: none;
}
div.users-edit .toteacher table tbody tr:last-child td a.disabled.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
div.users-edit .toteacher table tfoot td {
  background: transparent;
  padding-top: 25px;
  padding-bottom: 20px;
  line-height: 1.2em;
}
div.users-edit div.content-student {
  text-align: left;
  /*input.field-nameinfo{       //form inputjainak mérete .. fixen
    width: 170px;
    // height: 20px;
  }
  input.field-other{       
    width: 492px;
  }
  input.field-city{
    width: 27%;
  }
  */
}
div.users-edit div.content-student div.right-column {
  float: right;
  width: 20%;
  display: inline-block;
  margin-right: 2%;
  margin-left: 7.5%;
}
div.users-edit div.content-student div.left-column {
  width: 60%;
  display: inline-block;
  float: right;
  margin-right: 7.5%;
}
div.users-edit div.content-student div.left-column .dd-selected-text {
  margin: 0;
}
div.users-edit div.content-student div.left-column .onoffswitch {
  margin-top: 4px;
}
div.users-edit div.content-student div.left-column p {
  margin: 10px 0;
}
div.users-edit div.content-student div.left-column textarea {
  margin-top: 16px;
}
div.users-edit div.content-student div.left-column fieldset {
  /*div.left  input{
    width:95%;
  }*/
}
div.users-edit div.content-student div.left-column fieldset input, div.users-edit div.content-student div.left-column fieldset textarea {
  width: 77%;
}
div.users-edit div.content-student div.left-column fieldset input#UserFirstName {
  margin-left: 0px;
  width: 27%;
}
div.users-edit div.content-student div.left-column fieldset input#UserLastName {
  margin-left: 0px;
}
div.users-edit div.content-student div.left-column fieldset input.field-city {
  width: 38%;
  margin-left: 2px;
}
div.users-edit div.content-student div.left-column fieldset:nth-child(5) span {
  vertical-align: top;
  margin-top: 20px;
}
div.users-edit div.content-student div.left-column div.left div.dropdown {
  width: 200px;
  height: 18px;
  display: inline-block;
  text-align: left;
  margin: 1px 25px 0 6px;
}
div.users-edit div.content-student div.left-column div.left .dropdown.open div {
  width: 350px;
}
div.users-edit div.content-student div.left-column div.left .scrollable div::after {
  box-shadow: inset 0 -50px 40px -50px #00c384;
}
div.users-edit div.content-student div.left-column div.user-title {
  float: left;
}
div.users-edit div.content-student div.left-column div.user-title div.dropdown {
  width: 100px;
  height: 18px;
  display: inline-block;
  text-align: left;
  margin: 0px 25px 0 6px;
}
div.users-edit div.content-student div.left-column div.user-title .dropdown.open div {
  width: 80px;
}
div.users-edit div.content-student div.left-column div.user-title .scrollable div::after {
  box-shadow: inset 0 -50px 40px -50px #00c384;
}
div.users-edit div.content-student h1 {
  color: #242424;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: bold;
  font-size: 1.5em;
  margin-left: 38px;
  margin-bottom: 20px;
  margin-top: -20px;
}
div.users-edit div.content {
  width: calc(99% - 280px);
  display: inline-block;
  color: #3c3c3c;
}
div.users-edit div.content p {
  margin: 10px 0;
}
div.users-edit div.content .onoffswitch {
  margin-top: 4px;
}
div.users-edit div.content fieldset.left {
  width: 30%;
}
div.users-edit div.content fieldset.left input {
  width: 95%;
}
div.users-edit div.content fieldset.group-edit {
  width: 80%;
  padding-left: 70px;
  padding-right: 70px;
  margin: 0 auto;
}
div.users-edit div.content fieldset.group-edit:first-of-type {
  margin-bottom: 15px;
}
div.users-edit div.content fieldset.group-edit .widen input {
  width: 60%;
}
div.users-edit div.content fieldset.group-edit textarea {
  width: 100%;
}
div.users-edit div.content fieldset.group-edit.group-members .left-column {
  width: 50%;
}
div.users-edit div.content fieldset.group-edit.group-members .right-column {
  width: 50%;
  font-size: 1em;
}
div.users-edit div.content fieldset.group-edit.group-members .right-column ul li {
  padding: 3px;
}
div.users-edit div.content #save-group {
  margin-top: 20px;
}
div.users-edit div.content div.left-column {
  float: left;
  width: 70%;
  margin-right: 20px;
}
div.users-edit div.content div.left-column .dd-selected-text {
  margin: 0;
}
div.users-edit div.content div.left-column.group-add-member {
  margin-right: 0;
}
div.users-edit div.content div.left-column-half {
  /* Groups oldalon még csak */
  width: 49%;
}
div.users-edit div.content div.left-column-half a {
  font-size: 1.3em;
  font-weight: 600;
}
div.users-edit div.content div.left-column-half ul {
  margin: 10px 0;
}
div.users-edit div.content div.left-column-half ul li {
  background-color: #FFF;
  padding: 5px 10px;
  margin-left: -10px;
  margin-right: -10px;
  font-size: 1.3em;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
div.users-edit div.content div.left-column-half ul li a {
  float: right;
  font-size: 0.8em;
}
div.users-edit div.content div.right-column {
  float: left;
  /*fieldset {
    width: 15%;
  }*/
}
div.users-edit div.content div.right-column.group-add-member {
  width: 35%;
  font-size: 1.2em;
}
div.users-edit div.content div.right-column.group-add-member strong {
  display: block;
  font-weight: 600;
}
div.users-edit div.content div.right-column-half {
  /* Groups oldalon még csak */
  width: 45%;
}
div.users-edit div.content div.right-column-half li {
  /* background-color: ????; */
  margin: 5px;
}
div.users-edit div.content div.right-column-half li a {
  float: right;
}
div.users-edit div.content label {
  margin-bottom: 8px;
  margin-left: -5px;
}
div.users-edit div.content table.gray {
  width: 100%;
  margin: 20px 0;
}
div.users-edit div.content table.gray thead {
  color: #fff;
  background-color: #929292;
}
div.users-edit div.content table.gray thead tr {
  height: 35px;
}
div.users-edit div.content table.gray thead tr td {
  padding: 8px;
  font-weight: bold;
}
div.users-edit div.content table.gray tbody tr {
  height: 35px;
  border-top: 1px solid #e8e8e8;
}
div.users-edit div.content table.gray tbody tr.rspan {
  border: none;
}
div.users-edit div.content table.gray tbody tr td {
  padding: 8px;
  color: #929292;
  background-color: #f6f6f6;
}
div.users-edit div.content div.money-course-price label {
  margin-bottom: 8px;
  margin-left: -5px;
}
div.users-edit div.content div.money-course-price .price {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  margin: 0 5px 0 0;
  width: 100px;
  padding: 8px;
  border: none;
  color: #777;
}
div.users-edit div.content div.money-course-price .price[readonly] {
  color: #ccc;
}
div.users-edit div.content table.stat1 {
  width: 80%;
  color: #333;
  font-size: 1.1em;
  margin-top: 20px;
  margin-bottom: 20px;
}
div.users-edit div.content table.stat1 b {
  color: #000;
}
div.users-edit div.content table.stat1 tr {
  height: 20px;
}
div.users-edit div.content table.stat1 tr.new-sec b {
  display: block;
  margin-top: 15px;
}
div.users-edit div.content table.money1 {
  width: 40%;
  font-size: 1.1em;
  margin-bottom: 50px;
}
div.users-edit div.content table.money1 tr {
  height: 20px;
}
div.users-edit div.content table.money1 tr.new-sec b {
  display: block;
  margin-top: 15px;
}
div.users-edit div.content div.money2 {
  width: 40%;
  float: right;
}
div.users-edit div.content .notification {
  font-size: 1.1em;
}
div.users-edit div.content .notification > b {
  color: #f65600;
}
div.users-edit div.content .title {
  margin-bottom: 5px;
  font-size: 1.3em;
  color: #444;
}
div.users-edit div.content form.account div.delete {
  float: right;
  height: 100%;
  margin-top: 10px;
  line-height: 120%;
}
div.users-edit div.content form.account div.delete a:link, div.users-edit div.content form.account div.delete a:visited {
  margin: 8px 0 8px 8px;
}
div.users-edit div.content form.account div.delete strong {
  display: block;
  font-size: 1.2em;
  font-weight: bold;
  margin-bottom: 2px;
}
div.users-edit div.content form.notification div {
  vertical-align: top;
  display: inline-block;
}
div.users-edit div.content form.notification div.left {
  width: 45%;
}
div.users-edit div.content form.notification div.right {
  margin-top: 15px;
}
div.users-edit div.content form.notification input[type="submit"] {
  width: 90px;
  display: block;
  margin: 0 auto;
  margin-top: 22px;
}
div.users-edit div.content form.userdata {
  text-align: left;
}
div.users-edit div.content form.userdata div:not(.submit) input:not(.onoffswitch-checkbox) {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
div.users-edit div.content form.userdata textarea {
  margin-top: 16px;
}
div.users-edit div.content form.userdata fieldset {
  /* div.left input{
    width:95%;
    }
    */
}
div.users-edit div.content form.userdata fieldset input, div.users-edit div.content form.userdata fieldset textarea {
  width: 75%;
}
div.users-edit div.content form.userdata fieldset input#UserFirstName {
  margin-left: 0px;
  width: 27%;
}
div.users-edit div.content form.userdata fieldset input#UserLastName {
  margin-left: 0px;
}
div.users-edit div.content form.userdata fieldset div.left div.dropdown {
  width: 200px;
  height: 18px;
  display: inline-block;
  text-align: left;
  margin: 1px 25px 0 6px;
}
div.users-edit div.content form.userdata fieldset div.left .dropdown.open div {
  width: 350px;
}
div.users-edit div.content form.userdata fieldset div.left .scrollable div::after {
  box-shadow: inset 0 -50px 40px -50px #00c384;
}
div.users-edit div.content form.userdata fieldset div.user-title {
  float: left;
}
div.users-edit div.content form.userdata fieldset div.user-title div.dropdown {
  width: 100px;
  height: 18px;
  display: inline-block;
  text-align: left;
  margin: 0px 25px 0 6px;
}
div.users-edit div.content form.userdata fieldset div.user-title .dropdown.open div {
  width: 80px;
}
div.users-edit div.content form.userdata fieldset div.user-title .scrollable div::after {
  box-shadow: inset 0 -50px 40px -50px #00c384;
}
div.users-edit div.content form.userdata fieldset:nth-child(5) span {
  vertical-align: top;
}
div.users-edit div.content form.userdata fieldset:nth-child(3) .left select#AdditionalData1Text {
  width: 100%;
}
div.users-edit .notifications fieldset {
  width: 400px;
}
div.users-edit .notifications fieldset table.switch-table {
  width: 400px;
}
div.users-edit .notifications fieldset table.switch-table td {
  text-align: right;
}
div.users-edit .notifications fieldset.learn-courses-notification {
  display: block;
}
div.users-edit .notifications fieldset.teach-courses-notification {
  display: none;
}

/*
 * Csoport oldalon lévő cuccok
 * (NEM CSAK ITT, az előző részben is van 2 css részlet amit ez használ...)
 * 
 */
.groups-form-footerline {
  clear: both;
  text-align: center;
  margin-bottom: 40px;
}

/* Autocomplete cuccok */
.autocomplete-suggestions {
  border: 1px solid #999;
  background: #FFF;
  cursor: default;
  overflow: auto;
  -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
  -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
  box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
}

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

.autocomplete-selected {
  background: #F0F0F0;
}

/*.autocomplete-suggestions strong { font-weight: normal; color: #3399FF; }*/
/*
 * számlázási form
 *
 */
form.billing-data h3 {
  margin-bottom: 8px;
}
form.billing-data fieldset.invoiceform input {
  width: 50%;
  min-width: 500px;
}
form.billing-data fieldset.invoiceform input.zipcode {
  width: 18%;
  min-width: 198px;
}
form.billing-data fieldset.invoiceform input.country {
  width: 30%;
  min-width: 300px;
}
form.billing-data fieldset.invoiceform input.street {
  margin-top: 10px;
}
form.billing-data fieldset.invoice-type .dropdown {
  width: 370px;
}

/*
 * Tanár/hallgató profil oldalán lévő szürke menü
 * 
 */
div.profil-menu {
  height: 50px;
  font-size: 1.1em;
  margin-bottom: 20px;
  background-color: #666b6e;
}
div.profil-menu a:link, div.profil-menu a:visited {
  margin: 0;
  height: 35px;
  color: #ffffff;
  padding: 15px 1% 0 1%;
  display: inline-block;
  border-top: 2px solid transparent;
  font-weight: 600;
}
div.profil-menu a:link.edit-button, div.profil-menu a:visited.edit-button {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  margin: 10px 2% auto auto;
  font-size: 1.1em;
  height: auto;
  float: right;
}
div.profil-menu a:link.edit-button:hover, div.profil-menu a:visited.edit-button:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
div.profil-menu a:link.edit-button:active, div.profil-menu a:visited.edit-button:active {
  outline: none;
}
div.profil-menu a:link.edit-button.disabled, div.profil-menu a:visited.edit-button.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}
div.profil-menu a:hover, div.profil-menu a:active {
  color: #333;
}
div.profil-menu .active:link, div.profil-menu .side-menu-mini > a:link:hover, div.profil-menu .side-menu-mini a:link:active, .side-menu-mini div.profil-menu a:link:active, div.profil-menu .side-menu a:link:not(.noActive):hover, .side-menu div.profil-menu a:link:not(.noActive):hover, div.profil-menu .side-menu a:link:not(.noActive):active, .side-menu div.profil-menu a:link:not(.noActive):active, div.profil-menu .active:visited, div.profil-menu .side-menu-mini > a:visited:hover, div.profil-menu .side-menu-mini a:visited:active, .side-menu-mini div.profil-menu a:visited:active, div.profil-menu .side-menu a:visited:not(.noActive):hover, .side-menu div.profil-menu a:visited:not(.noActive):hover, div.profil-menu .side-menu a:visited:not(.noActive):active, .side-menu div.profil-menu a:visited:not(.noActive):active {
  color: #666b6e;
  height: 33px;
  background-color: #f5f6f6;
  border-top: 2px solid #1bbc9d;
}
div.profil-menu .active:link i, div.profil-menu .side-menu-mini > a:link:hover i, div.profil-menu .side-menu-mini a:link:active i, .side-menu-mini div.profil-menu a:link:active i, div.profil-menu .side-menu a:link:not(.noActive):hover i, .side-menu div.profil-menu a:link:not(.noActive):hover i, div.profil-menu .side-menu a:link:not(.noActive):active i, .side-menu div.profil-menu a:link:not(.noActive):active i, div.profil-menu .active:visited i, div.profil-menu .side-menu-mini > a:visited:hover i, div.profil-menu .side-menu-mini a:visited:active i, .side-menu-mini div.profil-menu a:visited:active i, div.profil-menu .side-menu a:visited:not(.noActive):hover i, .side-menu div.profil-menu a:visited:not(.noActive):hover i, div.profil-menu .side-menu a:visited:not(.noActive):active i, .side-menu div.profil-menu a:visited:not(.noActive):active i {
  color: #333;
}
div.profil-menu .disabled {
  cursor: default;
  pointer-events: none;
}
div.profil-menu i {
  margin-right: 8px;
  display: inline-block;
}

.userView {
  padding: 20px;
  padding-bottom: 35px;
}
.userView .teacherBox {
  background-color: #FFF;
  -webkit-box-shadow: lightgrey 0 0 4px;
  -moz-box-shadow: lightgrey 0 0 4px;
  box-shadow: lightgrey 0 0 4px;
}
.userView .teacherBox .header {
  border-bottom: 1px solid #f0f0f0;
  height: 190px;
  padding-top: 40px;
}
.userView .teacherBox .header #avatar {
  -webkit-border-radius: 43px;
  -moz-border-radius: 43px;
  -ms-border-radius: 43px;
  -o-border-radius: 43px;
  border-radius: 43px;
  margin-top: -20px;
  width: 80px;
  height: 80px;
  margin-right: 15px;
  float: left;
  margin-bottom: 50px;
}
.userView .teacherBox .header .basicData {
  padding-left: 22px;
  padding-top: 20px;
  width: 30%;
  height: 160px;
  float: left;
  vertical-align: top;
  position: relative;
}
.userView .teacherBox .header .basicData .name {
  color: #20b7d7;
  font-size: 1.5em;
  font-weight: bold;
}
.userView .teacherBox .header .basicData .description {
  color: #494949;
  font-size: 1.2em;
}
.userView .teacherBox .header .basicData #socialData {
  clear: both;
  position: absolute;
  bottom: 0;
}
.userView .teacherBox .header .basicData #socialData img {
  width: 24px;
  height: 24px;
  margin-top: 2px;
  margin-right: 5px;
}
.userView .teacherBox .header table {
  float: left;
  font-size: 1.2em;
  width: 30%;
}
.userView .teacherBox .header table:first-child {
  width: 30%;
  margin-right: 10%;
}
.userView .teacherBox .header table tr:first-child th {
  font-weight: bold;
  padding-bottom: 15px;
}
.userView .teacherBox .header table td {
  padding: 3px;
}
.userView p {
  padding: 30px 22px 45px 22px;
  display: block;
  clear: both;
  color: #434343;
  font-size: 1.2em;
  line-height: 1.3em;
}
.userView p strong {
  font-weight: 600;
  display: block;
  margin-bottom: 10px;
  font-size: 1.1em;
}
.userView nav.tabs-menu {
  margin-top: 20px;
  margin-bottom: 17px;
}
.userView #group-teachers .teachers {
  margin: 0;
}

@viewport {
  width: device-width;
  initial-scale: 1;
  zoom: 1;
}

.button.fbblue {
  font-weight: 600;
  background-color: #5791c3;
  border-bottom: 2px solid #3c6588;
}

.button.gpred {
  font-weight: 600;
  background-color: gray;
  border-bottom: 2px solid #595959;
}

.label {
  vertical-align: top;
  margin-top: 27px;
  display: inline-block;
}

.formInput, .LoginRegSelection .UserLogin input, .LoginRegSelection .UserRegistration input {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  border: none;
  padding: 5px;
}

/*
#popup {
  display: none;
}
#popup-bg {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: rgba(0,0,0, 0.8);
  z-index: 100;
  text-align: center;
}
.popup-fixed{  
  position: fixed;
  z-index:100;
  width:100%;

  div.popup-all{    
    min-width: 300px;
    max-width: 800px;
    //width:60%;
    margin: 0 auto;
    left:29px;
    position: relative;
  }

}
#popup-content {
  @include border-radius(3px);  
  //margin: 0 auto 0 auto;
  display: block;
  width: 80%;
  //min-width: 200px;
  //max-width: 600px;
  background-color: #fff;
  padding: 20px;
  z-index: 101;  
  position: relative;
  float:left;

  @include respond-to(400) {
    width: 70%;
  }

  div.beta-popup{
    text-align: center;
    h1{
      margin: 20px 0;
    }
    p{
      font-size: 1.2em;
      margin: 10px 0;
    }
    div.fb-like{

    }
  }
}
#popup-close {
  z-index: 101;
  margin-left: 1%;
  //left: 50%;
  //position: fixed;
  float:left;
  cursor: pointer;
  font-size: 1.5em;
  i {
    color: #fff;

    @include respond-to(480){
      margin-left: -25px;
      color: #000;
      z-index: 102;
      position: absolute;
    }
  }
}
*/
#popup {
  display: none;
}

#popup-bg {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 100;
  text-align: center;
}

.popup-fixed {
  position: fixed;
  z-index: 100;
  width: 100%;
  height: 120%;
  top: 2%;
}
.popup-fixed div.popup-all {
  width: 100%;
  max-height: 80%;
  overflow: hidden;
  text-align: center;
}

#popup-content {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  border-radius: 3px;
  display: inline-block;
  background-color: #fff;
  padding: 20px;
  z-index: 101;
  position: relative;
}
@media only screen and (max-width: 400px) {
  #popup-content {
    width: 70%;
  }
}
#popup-content div.beta-popup {
  text-align: center;
}
#popup-content div.beta-popup h1 {
  margin: 20px 0;
}
#popup-content div.beta-popup p {
  font-size: 1.2em;
  margin: 10px 0;
}

#popup-close {
  z-index: 101;
  margin-left: 1%;
  display: inline-block;
  cursor: pointer;
  font-size: 1.5em;
  vertical-align: top;
}
#popup-close i {
  color: #fff;
}
@media only screen and (max-width: 480px) {
  #popup-close i {
    margin-left: -25px;
    color: #000;
    z-index: 102;
    position: absolute;
  }
}

/* Kurzus blokk eleje */
.clearfix {
  *zoom: 1;
}
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

/* landing oldalon */
.landing-course-blocks {
  margin: 0 auto;
  text-align: left;
}
@media only screen and (max-width: 1226px) {
  .landing-course-blocks {
    width: 876px;
  }
}
@media only screen and (max-width: 910px) {
  .landing-course-blocks {
    width: 585px;
  }
}
@media only screen and (max-width: 630px) {
  .landing-course-blocks {
    width: 285px;
  }
}
.landing-course-blocks .course-block-item {
  display: inline-block;
}

.all-courses {
  text-align: center;
  margin-top: 15px;
  margin-bottom: 20px;
}

/* kereső oldalon */
.search-course-blocks {
  margin: 0 auto;
}
@media only screen and (max-width: 900px) {
  .search-course-blocks {
    width: 590px;
  }
}
@media only screen and (max-width: 600px) {
  .search-course-blocks {
    width: 280px;
  }
}
.search-course-blocks .course-block-item {
  display: inline-block;
}

.teach-course-blocks {
  margin: 0 auto;
}
.teach-course-blocks li.course-block-item {
  display: inline-block;
}
.teach-course-blocks li.course-block-item:hover .course-image-overlay {
  display: block;
}
.teach-course-blocks li.course-block-item:hover .hidden {
  display: inline-block;
}
.teach-course-blocks li.course-block-item:hover .course-teacher, .teach-course-blocks li.course-block-item:hover .course-data {
  display: none;
}
.teach-course-blocks li.course-block-item:hover .course-description {
  display: block;
}

.hidden {
  display: none;
}

.bottom-columns {
  clear: both;
  color: #4a555d;
  padding-top: 30px;
}
.bottom-columns h2 {
  font-size: 1.8em;
  font-weight: bold;
  margin-bottom: 25px;
}
.bottom-columns p {
  padding: 0;
  margin-top: 0;
  margin-bottom: 12px;
}
.bottom-columns p a {
  font-size: 1.1em;
  font-weight: bold;
}
.bottom-columns p > a {
  margin-top: 4px;
}

.button-container {
  background-color: #FFF;
  text-align: center;
  color: #393939;
  font-size: 1.9em;
  padding: 35px;
}
.button-container a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: initial;
  margin-top: 15px;
}
.button-container a:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.button-container a:active {
  outline: none;
}
.button-container a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}

.forgotten-password {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  width: 500px;
  margin: 29px auto;
  padding: 30px;
  background-color: #fff;
  text-align: center;
}
.forgotten-password .title {
  font-size: 1.2em;
  font-weight: 800;
  margin-bottom: 10px;
}
.forgotten-password .subtitle {
  font-weight: 1.1em;
}
.forgotten-password label {
  margin: 26px 0 5px -275px;
  font-size: 1.4em;
}
.forgotten-password input[type="email"] {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  width: 300px;
  border: 2px solid #ccc;
}
.forgotten-password div.submit {
  margin: 0;
}

@-moz-document url-prefix() {
  .head-image .slider-and-form form.regform fieldset.regform .submit input[type="submit"] {
    padding-left: 5px;
    padding-right: 5px;
  }
  .head-image .searchbox-container .searchbox button {
    font-size: 1.2em;
    margin-left: 4px;
  }
}

.dropdown,
.dropdown div,
.dropdown li,
.dropdown div::after,
.dropdown .carat,
.dropdown .carat:after,
.dropdown .selected::after,
.dropdown:after {
  -webkit-transition: all 150ms ease-in-out;
  -moz-transition: all 150ms ease-in-out;
  -ms-transition: all 150ms ease-in-out;
  transition: all 150ms ease-in-out;
}

.dropdown .selected::after,
.dropdown.scrollable div::after {
  -webkit-pointer-events: none;
  -moz-pointer-events: none;
  -ms-pointer-events: none;
  pointer-events: none;
}

/* WRAPPER */
.dropdown {
  position: relative;
  width: 250px;
  cursor: pointer;
  font-weight: 200;
  background: #fff;
  padding: 8px 0px 8px;
  border-radius: 5px;
  color: #555;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.dropdown.open {
  z-index: 2;
}

.dropdown:hover,
.dropdown.focus {
  background: #fff;
}

/* CARAT */
.dropdown .carat,
.dropdown .carat:after {
  position: absolute;
  right: 14px;
  top: 50%;
  margin-top: -3px;
  border: 6px solid transparent;
  border-top: 6px solid #1bbc9d;
  z-index: 1;
  -webkit-transform-origin: 50% 20%;
  -moz-transform-origin: 50% 20%;
  -ms-transform-origin: 50% 20%;
  transform-origin: 50% 20%;
}

.dropdown:hover .carat:after {
  border-top-color: #1bbc9d;
}

.dropdown.focus .carat {
  border-top-color: #1bbc9d;
}

.dropdown.focus .carat:after {
  border-top-color: #1bbc9d;
}

.dropdown.open .carat {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

/* OLD SELECT (HIDDEN) */
.dropdown .old {
  position: absolute;
  left: 0;
  top: 0;
  height: 0;
  width: 0;
  overflow: hidden;
}

.dropdown select {
  position: absolute;
  left: 0px;
  top: 0px;
}

.dropdown.touch select {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

/* SELECTED FEEDBACK ITEM */
.dropdown .selected {
  color: #888;
}

.dropdown .selected,
.dropdown li {
  display: block;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  padding: 4px 12px;
  overflow: hidden;
  white-space: nowrap;
}

.dropdown .selected::after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 60px;
  border-radius: 0 5px 5px 0;
  box-shadow: inset -55px 0 25px -20px #fff;
}

.dropdown:hover .selected::after,
.dropdown.focus .selected::after {
  box-shadow: inset -55px 0 25px -20px #fff;
}

/* DROP DOWN WRAPPER */
.dropdown div {
  position: absolute;
  height: 0;
  left: 0;
  right: 0;
  top: 100%;
  margin-top: 1px;
  background: #fff;
  overflow: hidden;
  opacity: 0;
  color: #888;
  border-radius: 5px;
}

.dropdown:hover div {
  color: #888;
  background: #fff;
  border-radius: 5px;
}

/* Height is adjusted by JS on open */
.dropdown.open div {
  opacity: 1;
  z-index: 2;
}

/* FADE OVERLAY FOR SCROLLING LISTS */
.dropdown.scrollable div::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 50px;
  box-shadow: inset 0 -50px 30px -35px #00c384;
}

.dropdown.scrollable:hover div::after {
  box-shadow: inset 0 -50px 30px -35px #00c384;
}

.dropdown.scrollable.bottom div::after {
  opacity: 0;
}

/* DROP DOWN LIST */
.dropdown ul {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  list-style: none;
  overflow: hidden;
  border-radius: 5px;
}

.dropdown.scrollable.open ul {
  overflow-y: auto;
}

/* DROP DOWN LIST ITEMS */
.dropdown li {
  list-style: none;
  padding: 14px 12px;
  border-bottom: 1px solid #ccc;
  background-color: #fff;
}

.dropdown li:last-child {
  border-bottom: 0;
}

/* .focus class is also added on hover */
.dropdown li.focus {
  background: #1bbc9d;
  position: relative;
  z-index: 3;
  color: #fff;
}

.dropdown li.active {
  background: rgba(27, 188, 157, 0.14);
  color: #888;
}

span.notification_num {
  color: #fff;
  font-size: 0.9em;
  margin: 0 8px 0 5px;
  padding: 0 4px 1px 4px;
  background-color: #f65600;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

.coursepurchasestatus {
  margin: 30px;
}
.coursepurchasestatus h1 {
  font-size: 36px;
  margin-bottom: 28px;
}
.coursepurchasestatus h2 {
  font-size: 20px;
  margin-bottom: 50px;
}
.coursepurchasestatus .subscribed {
  float: right;
  margin-top: 20px;
}
.coursepurchasestatus .social {
  margin-bottom: 20px;
}
.coursepurchasestatus img {
  margin-right: 8px;
}

.gotocourse {
  background: #fff;
  padding: 25px 0 30px 0;
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  font-size: 24px;
}
.gotocourse a {
  margin: 0;
  color: #ffffff;
  display: inline-block;
  background-color: #1bbc9d;
  padding: 7px 20px 7px 20px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #12836d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  font-weight: 600;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: initial;
  margin-top: 15px;
}
.gotocourse a:hover {
  color: #ffffff;
  background-color: #5fd0ba;
  border-bottom: 2px solid #5fd0ba;
}
.gotocourse a:active {
  outline: none;
}
.gotocourse a.disabled {
  background-color: gray;
  border-bottom: 2px solid #595959;
}