html {
    background-color: #f9f9f9 !important;
}
body {
    font-family: 'Abel', sans-serif;
    font-size: 20px;
    line-height: 28px;
    background: transparent;
}
h1 {
    font-size: 50px;
    font-family: 'Raleway', sans-serif;
    text-align: center;
}
h2 {
    font-size: 35px;
    font-family: 'Raleway', sans-serif;
    line-height: 39px;
    margin-top: 0px;
}
h3 {
    font-size: 32px;
    line-height: 38px;
    margin: 0;
}
h4 {
    font-size: 36px;
    line-height: 39px;
    margin: 0 0 5px;
}
img {
    width: 100%;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}
.world-dashboard img {
    box-shadow: none;
    -webkit-box-shadow: none;
}
a {
    color: #1165af;
    -webkit-transition: color 0.2s;
    -moz-transition: color 0.2s;
    transition: color 0.2s;
    outline:none !important;
}
a:hover, a:focus {
    color: #1a8aea !important;
    text-decoration: none;
    outline:none !important;
}
a.anchor {
    display: block;
    position: relative;
    top: -120px;
    visibility: hidden;
}
.mt0 {
    margin-top: 0;
}
.zoomin {
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}
.zoomin:hover {
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
    -ms-transform: scale(1.03);
    -o-transform: scale(1.03);
    transform: scale(1.03);
}
.subtitle-big {
    margin: 0 auto;
    text-align: center;
    max-width: 80%;
}
.trailer-title {
    line-height: 50px;
}
.btn {
    font-size: 40px;
    line-height: 46px;
    height: 60px;
    vertical-align: top;
    background: rgba(123, 194, 206, 0.5882352941176471);;
    padding: 6px 40px;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}

.extra-image {
    display: none;
}

.btn:hover, .btn:focus {
    background: #1a8aea !important;
}

.btn-primary {
    background: rgba(123, 194, 206, 0.5882352941176471);;
}

.ajaxBtn {
    display: none;
}

a.btn {
    color: #333 !important;
    text-shadow: none !important;
}

a.btn:hover {
    color: #333 !important;
}

.toggle-group .btn {
    width: auto;
    height: auto;
    padding: 1px 12px;
    margin-bottom: 0;
    font-size: 20px;
    line-height: 1.42857143;
}
.toggle-group .toggle-handle {
    padding-top: 0;
    padding-bottom: 0;
    height: 100%;
    width: 0;
    background: white;
}
input, select, textarea {
    background: #fff;
    border-radius: 5px;
}
input[type=checkbox] {
    width: 20px !important;
    height: 20px !important;
    box-shadow: none;
    -webkit-box-shadow: none;
    margin-top: 4px !important;
    margin-left: 9px !important;
}
.success, .error, .startPendingWorld, #subscr_error {
    position: fixed;
    background: #beecb5;
    bottom: 20px;
    left: 20px;
    line-height: 30px;
    border-radius: 6px;
    padding: 10px;
    z-index: 99999999;
    font-size: 25px;
    display: none;
}
.grow {
    cursor: pointer;
    transition: all .2s ease-in-out;
}
.grow:hover {
    transform: scale(1.05);
}
.error p {
    margin: 5px;
}
.success p {
    margin: 5px;
}
.form-control {
    width: 174px;
    display: inline-block;
    font-size: 20px;
    height: 37px;
    line-height: 22px;
}
.first-section {
    padding-top: 0 !important;
    margin-top: 50px;
}
.intro-text {
    font-size: 27px;
    font-style: italic;
    margin-right: 10px;
}
.sales section.row {
    padding: 60px 0;
}
.section-border {
    /*border-bottom: 2px solid #0000001c;*/
}
.darkmode {
    color: white;
    text-shadow: 1px 1px 9px #3e3e3e;
}
.darkmode a, .darkmode a:visited, .darkmode a:focus {
    color: white !important;
}
.darkmode a:hover {
    color: #9fce8e !important;
}
.darkmode .btn:hover, .darkmode .btn:focus {
    background: #9fce8e !important;
}
.darkmode-title {
    color: #9fce8e !important;
    text-shadow: 1px 1px 12px #3e3e3e;
}
section.row.menu-wrapper {
    padding: 0;
    word-spacing: -1px;
}
section.row.notification-boot-wrapper {
    padding: 0;
}
.pullquote {
    font-size: 31px;
    margin: 20px;
    border-left: 10px solid #06060647;
    padding-left: 20px;
}
.image {
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}
.image-center {
    margin: 20px 0;
    max-height: 290px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}
.image-right {
    width: 50%;
    float: right;
    margin: 0 0 10px 15px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}
.image-left {
    width: 50%;
    float: left;
    margin: 0 15px 10px 0;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}
.img-transparent {
    box-shadow: none;
    -webkit-box-shadow: none;
    border-radius: 0;
}
.darkmode-button {
    position: fixed;
    right: 65px;
    bottom: -11px;
    height: 40px;
    z-index: 600;
    font-size: 18px;
    opacity: .8;
    cursor: pointer;
}
.darkmode-button:hover {
    opacity: 1;
}
.landingpage-html .darkmode-button.fa-moon {
    color:white;
}
.dropdown-hover.flags {
    position: fixed;
    right: 15px;
    bottom:-4px ;
    height: 40px;
    z-index: 600;
}
.dropdown-hover.flags .dropdown {
    bottom: 40px ;
    top:auto !important;
}
.flags img {
    width: 32px;
    border: none;
    box-shadow: none;
    border-radius: 0;
}

.flags .dropdown {
    top: 35px !important;
}

.flags .dropdown a {
    line-height: 30px !important;
}

.textures {
    background: url(/assets/images/textures/agsquare.png);
    background: url(/assets/images/textures/crossword.png);
    background: url(/assets/images/textures/dust_scratches.png);
    background: url(/assets/images/textures/fabric_of_squares_gray.png);
    background: url(/assets/images/textures/greyzz.png);
    background: url(/assets/images/textures/leaves.png);
    background: url(/assets/images/textures/positive.png);
    background: url(/assets/images/textures/squairy_light.png);
    background: url(/assets/images/textures/topography.png);
    background: url(/assets/images/textures/wov.png);
    background: url(/assets/images/textures/wov-blue.png);
    background: url(/assets/images/textures/bright-squares.png);
    background: url(/assets/images/textures/leaves-pattern.png);
    background: url(/assets/images/textures/dot-grid.png);
    background: url(/assets/images/textures/tree_bark.png);
    background: url(/assets/images/textures/just-waves.png);
    background: url(/assets/images/textures/cubes.png);
    background: url(/assets/images/textures/stripes-light.png);
    background: url(/assets/images/textures/funky-lines.png);
}
.caption {
    font-style: italic;
    font-size: 24px;
    line-height: 30px;
}
.menu-wrapper .menu-link-logo {
    background: url(/assets/images/eco-logo.png);
    background-size: 140px;
    background-repeat: no-repeat;
    width: 140px;
    height: 66px;
    margin-top: 6px;
    margin-left: -20px;
    display: block;
    float: left;
    z-index: 9;
    position: relative;
}
.account-wrapper {
    background: #30695f;
}
.menu-wrapper a {
    font-size: 25px;
    line-height: 60px;
    margin-left: 20px;
    font-family: 'Abel', sans-serif;
    color: #333;
}
.menu-wrapper .btn {
    font-size: 23px;
    line-height: 22px;
    margin-top: 12px;
    margin-left: 15px;
    letter-spacing: 1px;
    background: #59d3e796 !important;
}
.menu-wrapper a.btn:hover {
    color: #333 !important;
    background: #36e3ff96 !important;
}
.dropdown a {
    line-height: 43px;
    -moz-transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
    -o-transition: all ease-in-out 0.2s;
    -ms-transition: all ease-in-out 0.2s;
    transition: all ease-in-out 0.2s;
}
.dropdown a:hover {
    color: #333 !important;
    background: #afd9e0f0 !important;
}
.dropdown {
    text-align: center;
    overflow: hidden;
}
.dropdown-hover .dropdown {
    visibility: hidden;
    opacity: 0;
    min-width: 100%;
    position: absolute;
    border-radius: 5px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    top: 56px;
    right: -15px;
    display: none;
    text-align: left;
    z-index: 999;
    -webkit-box-shadow: 1px 5px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 5px 10px 1px rgba(0, 0, 0, 0.3);
}
.dropdown-hover {
    display: inline-block;
    position: relative;
}
.dropdown-hover:hover > .dropdown, .dropdown-hover:focus-within > .dropdown, .dropdown-hover .dropdown:hover {
    visibility: visible;
    opacity: 1;
    display: block;
}
.dropdown-hover .dropdown a {
    clear: both;
    display: block;
    width: 100%;
    white-space: nowrap;
    padding: 0 15px;
    margin: 0;
    background: #fffffff5;
    border-bottom: 1px solid #c2c2c2;
}
.main-menu-section {
    border: none;
    z-index: 100;
    position: relative;
}
.main-menu-section.cloned {
    background: url(/assets/images/textures/cubes.png) rgba(249, 249, 249, 0.97);
    box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 10px 1px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 10px 1px;
    width: 100%;
    border: none;
    position: fixed;
    margin-top: 0;
    z-index: 500;
    left: 0;
    top: 0;
    height: 59px;
    display: none;
}
.main-menu-section a.active {
    color: #1a8aea;
}
.corner-tag {
    font-family: 'Raleway', sans-serif;
    font-size: 35px;
    line-height: 30px;
    background-color: #FFFE79;
    text-align: center;
    -webkit-transform: rotate(32deg);
    -moz-transform: rotate(32deg);
    -ms-transform: rotate(32deg);
    -o-transform: rotate(32deg);
    position: absolute;
    padding: 6px 0 0 22px;
    right: -100px;
    top: 31px;
    width: 380px;
    height: 42px;
    text-transform: uppercase;
    color: rgb(0, 0, 0);
    -moz-box-shadow: 3px 3px 5px 6px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 3px 3px 5px 6px rgba(0, 0, 0, 0.3);
    box-shadow: 3px 3px 5px 6px rgba(0, 0, 0, 0.3);
    -moz-transition: all ease-in-out 0.2s;
    -webkit-transition: all ease-in-out 0.2s;
    -o-transition: all ease-in-out 0.2s;
    -ms-transition: all ease-in-out 0.2s;
    transition: all ease-in-out 0.2s;
}
.slg-about {
    line-height: 30px;
    font-size: 22px;
}
.sales-feature-wrapper {
    width: 100%;
    vertical-align: top;
}
.sales-feature-image {
    height: auto;
    margin-bottom: 10px;
}
.howitworks img {
    width: 90%;
}
.sales-feature-wrapper h2 {
    font-size: 41px;
}
.howitworks .sales-feature-wrapper {
    width: 31%;
    vertical-align: top;
    display: inline-block;
    margin: 40px 0 0;
}
.intro-awards-wrapper a {
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}
.intro-awards-wrapper a:hover {
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
    -ms-transform: scale(1.03);
    -o-transform: scale(1.03);
    transform: scale(1.03);
}
.intro-awards-1, .intro-awards-2, .intro-awards-3, .intro-awards-4, .intro-awards-5, .intro-awards-6, .intro-awards-7 {
    display: inline-block;
    color: #333;
    font-size: 24px;
    line-height: 26px;
    padding: 150px 5px 0px 0;
    margin: 0 11px 0;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;
    vertical-align: top;
    width: 14%;
    max-width: 150px;
}
.intro-awards-1 {
    background-image: url(/assets/images/awards/department-of-education.png);
    background-repeat: no-repeat;
    background-position: 0 4px;
    background-size: 100%;
    max-width: 138px;
}
.intro-awards-4 {
    background-image: url(/assets/images/awards/kickstarter.png);
    background-repeat: no-repeat;
    background-position: center 4px;
    background-size: 100%;
    max-width: 141px;
}
.intro-awards-5 {
    background-image: url(/assets/images/awards/venturebeat.png);
    background-repeat: no-repeat;
    background-position: center 20px;
    background-size: 100%;
}
.intro-awards-6 {
    background-image: url(/assets/images/awards/nsf.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100%;
    max-width: 144px;
}
.intro-awards-7 {
    background-image: url(/assets/images/awards/un.png);
    background-repeat: no-repeat;
    background-position: center -3px;
    background-size: 100%;
    max-width: 142px;
}
.intro-awards-3 {
    background-image: url(/assets/images/awards/games-for-change.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 80%;
    margin: 0;
}
.intro-awards-2 {
    background-image: url(/assets/images/awards/curse-award.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100%;
}
.testimonial-quote {
    font-size: 21px;
    line-height: 30px;
    margin-top: 50px;
    width: 45%;
    display: inline-block;
    vertical-align: top;
}
.testimonial-quote a {
    color: #333;
}
.testimonial-author {
    font-family: 'Raleway', sans-serif;
    text-align: center;
    margin-top: 10px;
}
.testimonial-quotemarks {
    font-size: 83px;
    line-height: 0px;
    vertical-align: bottom;
    margin: 0 0px 0 0;
    color: #337ab7;
    font-family: 'Raleway', sans-serif;
}
.number {
    font-size: 80px;
    line-height: 50px;
    margin: 0 26px 0 0;
    padding: 11px 0 0 9px;
    color: #337ab7;
    font-family: 'Raleway', sans-serif;
    display: inline-block;
    width: 10%;
    vertical-align: top;
    text-shadow: 0px 2px #305e86;
}
.howitworks h4 {
    display: inline-block;
    width: 80%;
    vertical-align: top;
    text-align: left;
    margin-top: 5px;
}
.fourpanel .sales-feature-image {
    width: 90%;
    margin: 0 auto 22px;
}
.fourpanel .sales-feature-text {
    margin: 0 auto;
    width: 90%;
}
.footer a, .social a {
    color: #337ab7;
}
.footer .form-control, .social .form-control {
    width: 214px;
    display: inline-block;
    font-size: 28px;
    height: 46px;
}

.footer .form-control, .social .form-control {
    width: 214px;
    display: inline-block;
    font-size: 28px;
    height: 46px;
}
.footer .btn, .social .btn {
    width: 214px;
    font-size: 28px;
    line-height: 30px;
    height: 46px;
    vertical-align: top;
    background: rgba(123, 194, 206, 0.59);
}
.social .form-control {
    font-size: 23px;
}
.social .btn {
    font-size: 24px;
    background: rgb(71, 135, 190);
    color: white;
    width: auto;
}
.landingpage .social .btn {
    font-size: 24px;
    background: rgba(123, 194, 206, 0.59);
    color: white;
}
.social .col-md-6{
    margin-top: 30px;
}
.darkmode .social a {
    text-shadow: none;
}
a .btn {
    color: #333 !important;
}
.footer .social-media-icon, .social .social-media-icon {
    font-size: 46px;
    vertical-align: top;
    margin: 0 0 0 20px;
    line-height: 44px;
}
.fa-discord. {
    margin-top: 3px;
}
.membership-title-wrapper {
    overflow: hidden;
    height: 211px;
}
.membership-logo {
    background-repeat: no-repeat;
    background-size: contain;
    height: 110px;
    width: 110px;
    vertical-align: top;
    margin: 15px auto 0;
}
.membership-logo-4 {
    background-image: url(/assets/images/icons/betaicon.png);
}
.membership-logo-7 {
    background-image: url(/assets/images/icons/beta2packicon.png);
}
.membership-logo-9 {
    background-image: url(/assets/images/icons/beta4packicon.png);
}
.membership-logo-11 {
    background-image: url(/assets/images/icons/devicon.png);
}
.membership-logo-14 {
    background-image: url(/assets/images/icons/wolficon.png);
}
.account-page .membership-logo-wrapper {
    cursor: pointer;
    display: inline-block;
}
.account-page .membership-logo {
    display: inline-block;
    margin: 12px 0 0 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    height: 115px;
    width: 115px;
}
.icon-edit {
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    transition: all 0.7s;
}
.account-page .membership-logo-wrapper:hover .icon-edit {
    display: block !important;
    position: absolute;
    left: 48px;
    top: 60px;
    color: white;
    font-size: 23px;
}
.membership-logo-menu {
    background-repeat: no-repeat;
    background-size: contain;
    height: 35px;
    width: 35px;
    margin: -7px 0 0 3px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
}
.tree-sidepanel-wrapper .btn-small, .tree-intro-wrapper-sky .btn-small {
    margin: 8px;
}
.download-link {
    width: 18%;
    display: inline-block;
    text-align: center;
    vertical-align: top;
    margin-top: 20px;
}
.download-link i {
    display: block;
    font-size: 60px;
}
.download-link a {
    color: #333;
}
.download-link div {
    font-size: 17px;
    margin-top: -4px;
}
span.account-label-front {
    font-weight: 700;
    margin-right: 10px;
}
#more-downloads-div {
    margin-top: 40px;
}
.account-page h2 {
    margin-bottom: 2px;
    font-size: 28px;
}
.account-feature {
    background: #ffffffd9;
    padding: 9px 20px;
    margin: 20px 0px 13px;
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 7px -2px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 7px -2px rgba(0, 0, 0, 0.3);
    position: relative;
}
.feature-box {
    background: #ffffffd9;
    padding: 15px 20px 20px;
    margin: 7px -15px 30px;
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 7px -2px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 7px -2px rgba(0, 0, 0, 0.3);
    position: relative;
}
.feature-box h1 {
    margin: 10px 0 20px;
}
.feature-box h2 {
    margin-bottom: 20px;
    display: inline-block;
}
.account-form {
    font-size: 23px;
    height: 37px;
    line-height: 22px;
    width: auto;
    display: inline-block;
}
.account-form .btn, .tree-sidepanel .btn, .tree-intro-wrapper-sky .btn {
    float: none !important;
    margin-top: 0px;
    position: static !important;
    margin-left: 1px !important;
}
.btn-small {
    font-size: 23px;
    height: 37px;
    line-height: 22px;
    width: auto;
    padding: 6px 12px;
}
.btn-medium {
    font-size: 36px;
    height: 48px;
    line-height: 33px;
    width: auto;
    padding: 6px 25px;
}
.btn-big-wrapper {
    margin: 100px 0 50px;
    text-align: center;
}
.btn-big-wrapper .btn {
    margin: 10px auto 10px;
    width: auto;
}
.btn-big-wrapper label {
    margin: 20px auto;
}
.btn-corner {
    position: absolute;
    top: 24px;
    right: 20px;
}
.account-page .btn-small {
    margin-left: 5px;
}
.sub-features-wrapper .btn {
    float: none;
    margin-top: 0px;
    margin-left: 0;
    margin-right: 5px;
    margin-bottom: 0;
    background: #dededed1;
    border-radius: 4px 4px 0 0;
    border-bottom: 4px solid #00000026;
    color: #333 !important;
}
.sub-features-wrapper .btn:hover, .sub-features-wrapper .btn:active {
    background: #bababad1 !important;
}
.sub-features-wrapper .btn.active, .sub-features-wrapper .btn.active:hover, .sub-features-wrapper .btn.active:active, .sub-features-wrapper .btn.active:focus {
    background: #feffffe0 !important;
    font-weight: 700;
}
.sub-features-wrapper .node-label-active-1:hover, .sub-features-wrapper .node-label-progress-1:hover {
    background: #62c763 !important;
}
.sub-features-wrapper .node-label-active-2:hover, .sub-features-wrapper .node-label-progress-2:hover {
    background: #62c763 !important;
}
.sub-features-wrapper .node-label-active-3:hover, .sub-features-wrapper .node-label-progress-3:hover {
    background: #62c763 !important;
}
.sub-features-wrapper .node-label-active-4:hover, .sub-features-wrapper .node-label-progress-4:hover {
    background: #54c555 !important;
}
.sub-features-wrapper .node-label-active-5:hover, .sub-features-wrapper .node-label-progress-5:hover {
    background: #54c555 !important;
}
.sub-features-wrapper .node-label-active-6:hover, .sub-features-wrapper .node-label-progress-6:hover {
    background: #41bb42 !important;
}
.sub-features-wrapper .node-label-active-7:hover, .sub-features-wrapper .node-label-progress-7:hover {
    background: #41bb42 !important;
}
.sub-features-wrapper .node-label-active-8:hover, .sub-features-wrapper .node-label-progress-8:hover {
    background: #3ec340 !important;
}
.sub-features-wrapper .node-label-active-9:hover, .sub-features-wrapper .node-label-progress-9:hover {
    background: #26a028 !important;
}
.sub-features-wrapper .node-label-active-10:hover, .sub-features-wrapper .node-label-progress-10:hover {
    background: #26a028 !important;
}
.sub-features-wrapper .node-label-progress-1, .sub-features-wrapper .node-label-progress-2, .sub-features-wrapper .node-label-progress-3, .sub-features-wrapper .node-label-progress-4, .sub-features-wrapper .node-label-progress-5, .sub-features-wrapper .node-label-progress-6, .sub-features-wrapper .node-label-progress-7, .sub-features-wrapper .node-label-progress-8, .sub-features-wrapper .node-label-progress-9, .sub-features-wrapper .node-label-progress-10 {
    border: none !important;
    border-bottom: 4px dashed #00000026 !important;
}
.modal-content form {
    float: none;
    width: 80%;
    margin: 0 auto;
    position: static;
    height: auto;
}
.modal-content btn {
    display: block;
    margin: 0 auto !important;
    width: 214px;
    font-size: 24px;
    height: 37px;
    line-height: 20px;
}
.modal-content {
    background: url(/assets/images/textures/funky-lines.png);
}
.modal-title {
    text-align: center;
}
.modal-header {
    border: none;
    padding-bottom: 0;
}
#buy-cost {
    margin-left: 5px;
}
.contact-form-wrapper .c-error {
    display: none !important;
}
.paypal-tos-wrapper {
    display: inline-block;
    line-height: 23px;
}
.paypal-tos-wrapper input {
    vertical-align: top;
    width: 30px !important;
    padding: 0;
    height: 25px !important;
    display: inline-block;
    margin-top: 11px !important;
}
.paypal-tos-wrapper label {
    display: inline-block;
    width: 270px;
    text-align: left;
    font-weight: 500;
    font-size: 19px;
}
.payment-popup img {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0px;
}
.payment-popup .paypalButton {
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    display: block;
    width: 180px;
    padding: 3px 20px;
    display: inline-block;
    vertical-align: text-bottom;
    background-color: rgb(255, 196, 57);
}
.payPalButton:hover {
    background-color: rgb(255, 210, 106);
}
.terms-modal .modal-dialog {
    width: 75%;
}
.modal-dialog {
    margin-top: 100px;
}
.login-wrapper, #registration_form, .center-area {
    text-align: center;
    margin: 0 auto;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -290px;
    margin-left: -200px;
    width: 400px;
}
.login-forgot-wrapper {
    width: 80%;
    margin: 20px auto 0;
}
.login-forgot {
    font-size: 17px;
    margin-bottom: 0px;
    margin: 0 auto;
    display: block;
    cursor: help;
}
a.login-forgot {
    cursor: pointer;
}
.g-recaptcha {
    width: 305px;
    margin: 10px auto 15px;
    display: block;
}
.productContent {
    width: 16%;
    display: inline-block;
    vertical-align: top;
}
.buy-zone {
    border-radius: 6px;
    font-size: 0;
    width: 100%;
    text-align: center;
}
.buy-zone .productContent {
    width: 16%;
    display: inline-block;
    vertical-align: top;
    border-right: 2px solid #d0cfcf;
    font-size: 20px;
}
.buy-zone .productContent.highlight {
    background: #f2f2f2;
}
.buy-zone ul {
    list-style-type: none;
    padding: 0;
}
.buy-zone li {
    padding: 10px;
    border-top: 2px solid #d0cfcf;
    height: 65px;
    font-size: 25px;
    text-align: center;
    padding-top: 17px;
}
.buy-zone .productContent:last-of-type {
    border-right: none;
}
.buy-zone a {
    color: #333 !important;
}
.buy-zone a:hover {
    color: #333 !important;
    background: #7bc2ce66;
}
.buy-zone .highlight a:hover {
    background: inherit;
    cursor: default;
}
a.membership-wrapper {
    cursor: pointer;
    position: relative;
    display: block;
    -webkit-transition: background 0.4s;
    -moz-transition: background 0.4s;
    transition: background 0.4s;
}
.membership-purchase {
    position: absolute;
    top: -30px;
    height:30px;
    line-height: 30px;
    width: 100%;
    background: #7bc2ceb5;
    opacity: 0;
}
.membership-purchase i.fas.fa-star {
    font-size: 15px;
    color: #ffeb00;
    margin: 0px 5px 0 0;
}
a.membership-wrapper:hover .membership-purchase {
    transition: all 0.2s ease;
    opacity:1;
}
.buy-zone .membership-title {
    text-align: center;
    margin-top: 10px;
    font-size: 25px;
    margin-bottom: 0;
}
.buy-zone .membership-delivery {
    text-align: center;
    margin: 0px 0 10px;
    font-size: 16px;
}
.membership-key li {
    font-size: 19px;
    padding-top: 10px;
    text-align: right;
    line-height: 35px;
}
.membership-key li span {
    vertical-align: middle;
    display: inline-block;
    line-height: 20px;
    font-size: 17px;
}
.system-requirements-subwrappers {
    width: 49%;
    display: inline-block;
}
.membership-description li:nth-child(even) {
    background-color: #e8e8e88c;
}
.membership-top {
    overflow: hidden;
    height: 220px;
}
.modal-content {
    float: none;
    margin: 0;
}
.login-wrapper .login-button, .form-wrapper .btn, #registration_form .btn {
    display: block;
    margin: 0 auto 10px;
    width: 214px;
    font-size: 24px;
    height: 37px;
    line-height: 20px;
    width: 80%;
}
#updateProfile button {
    width: 100%;
}
.modal-content .form-control, .form-wrapper .form-control, .login-wrapper .form-control, #registration_form .form-control {
    font-size: 20px;
    height: 37px;
    line-height: 22px;
    display: block;
    margin: 0 auto 10px;
    width: 80%;
}
.modal-content .error, .modal-content .success {
    bottom: 10px;
    right: 10px;
}
.modal-body {
    padding-bottom: 30px;
    text-align: center;
}
.modal .btn-small {
    width: 80%;
    margin: 0 0 10px;
}
.startPendingWorld {
    cursor: pointer;
}
.startPendingWorld:hover {
    background: #a5da9b;
}
.hosted-worlds-dash {
    margin-top: 0px;
    margin-bottom: 30px;
    padding-bottom: 7px;
}
.teach-dash .account-title {
    margin-bottom: 15px;
}
.teach-dash-subtitle {
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 4px;
    margin-left: -5px;
    font-size: 18px;
    background: #dedede;
    line-height: 19px;
    padding: 4px 7px;
    display: block;
}
.teach-dash img {
    width: 100%;
}
.world-dash-image-wrapper {
    height: 218px;
    margin: 0 auto 10px;
    overflow: hidden;
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    cursor: pointer;
}
.teach-dash-options-subwrapper select, .hosted-worlds-count, .student-accounts-count, .billing_table .region {
    line-height: 26px;
    height: 36px;
    width: 130px;
    vertical-align: middle;
}
.new_password {
    width: 214px;
}
.teach-dash-world-dash {
    display: block;
    margin: auto;
    margin-bottom: 10px;
    margin-top: 0;
    width: 78%;
}
.teach-dash-options-subwrapper {
    width: 48%;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 10px;
    padding-left: 5px;
}
.teach-dash-options-superwrapper {
    height: 80px;
}
.cloudworlds-sales-wrapper img {
    height: inherit;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
}
.cloudworlds-sales-wrapper li {
    margin-bottom: 14px;
}
.cloudworlds-sales-wrapper p {
    margin-top: 30px;
}
.teach-dash input.world_name {
    height: 25px;
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: text !important;
    display: inline-block;
    font-size: 27px;
    line-height: 26px;
    text-transform: none;
    letter-spacing: 0px;
    width: 100% !important;
}
.world-name > div {
    letter-spacing: 3px;
    position: absolute;
    right: 0;
}
.title-content {
    overflow: hidden;
    height: 28px;
    margin-right: 30px;
}
.title-content:hover i {
    display: inline-block !important;
}
.subaccounts-wrapper {
    margin: 0px 0;
    padding: 10px 0 0 !important;
    border-bottom: 1px solid #dedede;
}
.subaccounts-wrapper:last-of-type {
    border-bottom: none;
}
.subaccounts-wrapper .btn-small {
    font-size: 20px;
    width: 100%;
    margin-bottom: 10px;
    overflow: hidden;
}
.subaccounts-wrapper select {
    height: 34px;
    max-width: 100%;
    width: 100%;
    margin-bottom: 10px;
}
.subaccounts-wrapper input {
    height: 34px;
    max-width: 100%;
    width: 100%;
    margin-bottom: 10px;
}
.citizen-game-download-wrapper {
    overflow: hidden;
    border: 1px solid #e6e6e6;
    margin-left: 20px;
    border-radius: 4px;
    font-size: 15px !important;
    width: fit-content;
}
.citizen-game-download-wrapper-inner {
    padding-bottom: 15px;
    border-bottom: 1px solid #dedede;
    overflow: hidden;
    text-align: center;
}
.citizen-game-download-wrapper-inner:last-of-type {
    border-bottom: none;
    margin: 0;
    padding: 0 0 10px;
    -webkit-transition: background .2s;
    -moz-transition: background .2s;
    -o-transition: background .2s;
    transition: background .2s;
}
.citizen-game-download-wrapper-inner:hover {
    background: #e6e6e6;
}
p.world-name-title {
    line-height: 21px;
    font-weight: 700;
    text-align: center;
    font-size: 24px;
    margin: 10px 0 -5px;
    text-transform: capitalize;
}
.citizen-game-download-subwrapper {
    text-align: center;
    line-height: 26px;
    display: inline-block;
    margin-right: 30px;
}
.citizen-game-download-subwrapper p {
    margin: 0;
    text-align: center;
    font-size: 18px;
    line-height: 31px;
}
.citizen-game-download-input {
    margin-top: 0px;
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    height: 30px;
}
.citizen-game-download-icon {
    margin-right:5px;
}
.list-proper {
    padding-inline-start: 22px;
    font-size: 17px;
    line-height: 22px;
}
.list-proper li {
    background:none !important;
    margin-bottom: 5px;
}
.undertitle-wrapper {
    display: inline-block;
}
.undertitle-wrapper .account-title {
    float: left;
    margin: 0px 20px 20px 0;
}
.box-info-undertitle {
    color: #5e5e5e;
    font-size: 16px;
    line-height: 21px;
    text-align: justify;
    background: #f0f0f0;
    border-radius: 6px;
    padding: 5px 10px;
    display: flex;
}
.box-info-undertitle ol {
    margin: 0;
    padding-left: 20px;
}
.box-info-undertitle li {
    background: none !important;
    line-height: 20px;
}
.box-info-topright {
    position: absolute;
    top: 10px;
    right: 10px;
}
.tool-tip {
    background: #eee;
    cursor: help;
}
.tool-tip-box {
    background: #eee;
    padding: 0px 5px;
    line-height: 19px;
    font-size: 14px;
    font-weight: 700;
    color: #989696;
    cursor: help;
}
.tooltip-inner {
    background: #616161;
}
.tooltip.top .tooltip-arrow {
    border-top-color: #616161;
}
.tooltip.right .tooltip-arrow {
    border-right-color: #616161;
}
.tooltip.bottom .tooltip-arrow {
    border-bottom-color: #616161;
}
.tooltip.left .tooltip-arrow {
    border-left-color: #616161;
}
.collapsible-heading {
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 40px;
    color: #fff;
    background: transparent;
    border: 0;
    border-bottom: 2px solid #41742D;
}
.players .edit a {
    background: #6CB351;
    color: white;
    text-decoration: none;
    font-weight: 400;
    vertical-align: middle;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    padding: 7px 12px;
    font-size: 19px;
    line-height: 40px;
    margin: 30px 0px 30px 0;
    border: 3px solid rgba(0, 0, 0, 0.18);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background: #5BA041;
    color: white;
    vertical-align: top;
    font-family: 'Abel', sans-serif;
    text-align: center;
    text-shadow: 0 1px 0 #000;
    -webkit-box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.3);
    -webkit-transition: background .2s;
    -moz-transition: background .2s;
    -o-transition: background .2s;
    transition: background .2s;
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 0;
}
.player-pro {
    margin-bottom: 25px;
}
.remove-user span {
    border: 1px solid #c5c5c5;
    background: #f6f6f6;
    font-weight: normal;
    height: 37px;
    width: 57px;
    display: block;
    float: left;
    text-align: center;
    border-radius: 3px;
    cursor: pointer;
    background: #5BA041;
    border: 3px solid rgba(0, 0, 0, 0.18);
    box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.3);
    color: #fff;
    line-height: 33px;
    margin-top: 1px;
    margin-left: 13px;
    font-weight: bold;
}
.play-name a {
    vertical-align: middle;
    font-size: 27px;
    line-height: 29px;
    height: 41px;
    box-sizing: border-box;
    outline: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    display: block;
    margin: 0;
    margin-top: 0px;
    padding: 5px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #4A8235;
    font-family: 'Abel', sans-serif;
    -webkit-box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3);
    background-color: #e8ffdf;
    border: 1px solid rgba(0, 0, 0, 0.18);
}
.ban-list {
    font-size: 20px;
    line-height: 25px;
    /* height: 52px; */
    outline: 0px;
    width: 81%;
    margin-right: 70px;
    height: 87px;
    vertical-align: middle;
    box-sizing: border-box;
    outline: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    display: block;
    margin: 0;
    margin-top: 0px;
    padding: 5px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #4A8235;
    font-family: 'Abel', sans-serif;
    -webkit-box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3);
    background-color: #e8ffdf;
    border: 1px solid rgba(0, 0, 0, 0.18);
}
.stat {
    font-size: 22px;
    line-height: 26px;
    display: block;
    width: 400px;
    margin-bottom: 10px;
    color: #fff;
    font-family: 'Dosis', cursive;
    text-shadow: 1px 1px black;
    margin-top: 10px;
    border-top: 2px solid #41742D;
    width: 100%;
    padding-top: 20px;
}
.add-student, .print-login-info {
    margin-top: 0;
}
.ui-accordion .ui-accordion-content {
    padding: 2em 2.2em;
    overflow: hidden;
    background: transparent;
    border: none;
    border-bottom: 2px solid #41742D;
}
.editableform .editable-input input {
    margin-top: 0 !important;
}
.editable-buttons button.ui-button-icon-only {
    z-index: 9999;
}
.editable-input {
    z-index: 99;
}
.top-head span {
    margin: 0 0 0 30px;
    font-size: 31px;
    line-height: 2px;
    color: white;
    text-shadow: 1px 1px 3px black;
    font-family: 'Abel', sans-serif;
    font-weight: 500;
}
.Exp, .Imp {
    margin-top: 0px;
    padding-left: 28px;
    padding-right: 28px;
}
.pri {
    margin-top: 0;
}
.playworld {
    float: right;
}
.editable-click, a.editable-click, a.editable-click:hover {
    text-decoration: none;
    border-bottom: dashed 0px #0088cc !important;
}
.editableform .editable-input input {
    margin-top: 0 !important;
    height: 39px;
    width: 306.50px;
    font-size: 25px;
    line-height: 22px;
    height: 39px;
    outline: 0px;
    display: block;
    margin: 0px auto;
    padding: 5px;
    border-radius: 4px;
    color: rgb(74, 130, 53);
    font-family: "Pathway Gothic One", sans-serif;
    box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px 3px;
    background-color: rgb(223, 254, 243);
    border: 3px solid rgba(0, 0, 0, 0.18);
}
#dbviewer input.form-control.input-sm {
    font-size: 16px;
    border: none;
    line-height: 38px;
    outline: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    display: block;
    margin: 0 auto;
    padding: 5px;
    font-family: 'Abel', sans-serif;
    background-color: #DFFEF3;
    height: 30px;
    width: 510px;
    box-shadow: none;
}
#dbviewer .btn {
    font-size: 20px;
    line-height: 16px;
    height: 30px;
    vertical-align: top;
    background: rgba(123, 194, 206, 0.5882352941176471);
    padding: 0 5px;
    width: auto;
    color: #434343;
    outline: none;
    border: none;
}
#dbviewer .modal-content table.dataTable tbody td {
    padding: 0;
    font-size: 18px;
}
#dbviewer .popover-title {
    padding: 0 5px;
    line-height: 30px;
}
.hosted-worlds-dash {
    background: #ffffffd9;
    padding: 15px;
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 7px -2px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 7px -2px rgba(0, 0, 0, 0.3);
}
.teach-dash .world-name {
    font-size: 26px;
    line-height: 30px;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    margin-bottom: 0 !important;
    margin-top: 0;
}
.title-content:hover i {
    display: inline-block !important;
}
.teach-dash-options-wrapper {
    margin-bottom: 10px;
    padding-left: 5px;
    position: relative;
    word-wrap: break-word;
    line-height: 20px;
}
.citizen-list span.citizen::after {
    content: ", ";
}
.world_opt {
    display: block;
    width: 100%;
    margin-top: 9px;
    margin-left: -3px;
    font-size: 20px;
    height: 30px;
    line-height: 27px;
    padding: 0;
    overflow: hidden;
}
.config_title {
    border-bottom: 1px solid #FFFFFF;
    cursor: pointer;
    padding: 10px;
    margin: 0;
    font-weight: 700;
}
.config_item {
    margin: 10px !important;
    width: 200px !important;
}
.config_items {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 0 10px;
}
.config_name {
    font-size: 100%;
    padding-left: 20px;
}
.config-options-wrapper {
    text-align: left;
}
.config-options-wrapper .teach-dash-options-wrapper {
    display: inline-block;
}
.config-wrapper button.world_opt {
    width: 203px !important;
    margin-left: 10px !important;
    display: inline-block !important;
    margin-top: 5px !important;
}
.plugin_title {
    letter-spacing: 1px;
    background: #b1dbe2;
    height: 30px;
    margin-bottom: 5px;
    margin-left: 5px;
    padding-left: 8px;
    font-family: 'Abel', sans-serif;
    font-size: 20px;
    line-height: 31px;
    color: #333;
    text-transform: capitalize;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}
.plugin_title:hover {
    background: #1a8aea !important;
}
.plugin_title h3 {
    line-height: 31px;
    font-size: 20px;
}
.plugin_title .status {
    margin-right: 8px;
    letter-spacing: 0;
    margin: 0 8px 0 0;
}
.charts {
    min-width: 310px;
    height: 400px;
    margin: 25px
}
.teach-dash-options-wrapper li {
    background: none !important;
}
.world_opt .loaderso {
    position: absolute;
    right: 13px;
    top: 5px;
}
.stat4 .teach-dash-options-wrapper {
    margin-bottom: 0;
}
.is_admindiv {
    height: 30px;
    padding: 3px 5px 0 20px;
    border-width: 0px;
}
.is_admindiv span {
    margin-left: 7px;
    line-height: 28px !important;
}
.items_table .subscription-description th {
    width: 30%;
}
.config-wrapper button.world_opt {
    width: 203px;
    margin-left: 10px;
    display: inline-block;
    margin-top: 5px;
}
.tree-landingpage-wrapper {
    position: relative;
    max-width: 100%;
}
.tree-super-wrapper {
    background: url(/assets/images/tree/bgbg.jpg);
    background-position: 40px top;
    background-size: 2000px;
    background-repeat-y: no-repeat;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}
.tree-wrapper {
    width: 70%;
    height: 100%;
    padding: 20px 0;
    zoom: 1;
    -moz-transform: scale(1);
    -moz-transform-origin: 0 bottom;
}
.tree {
    height: 1080px;
    width: 990px;
    margin: 0 auto;
    position: relative;
    z-index: 9;
}
.tree-image {
    box-shadow: none;
    -webkit-box-shadow: none;
    height: 100%;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}
.tree-image-shadow {
    filter: brightness(85%);
}
.tree-sidepanel-wrapper {
    width: 40%;
    min-width: 630px;
    height: 100%;
    position: absolute;
    top: 0;
    right: -70%;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
    z-index: 100;
    max-width: 80%;
}
.tree-sidpanel-wrapper #title h1 {
    margin-top: 0px;
}
.tree-sidepanel-wrapper-open {
    right: 0% !important;
}
.opacityoff {
    opacity: 0 !important;
}
.tree-sidepanel {
    overflow-y: auto;
    height: 100%;
    padding: 15px 0 0;
    border-radius: 23px 0 0 0;
}
.tree-sidepanel-title {
    color: white;
    text-shadow: 0 0px 15px black;
}
.tree-sidepanel a#title {
    color: white;
}
.tree-sidepanel a#title:hover, .tree-sidepanel a#title:active, .tree-sidepanel a#title:focus {
    color: white !important;
}
/** Removed cuzz it was breaking quoted and italic content. Headings are <h2 already
/*.tree-sidepanel p em {*/
/*    font-size: 40px;*/
/*    line-height: 60px;*/
/*}*/
.tree-sidepanel-devs-wrapper {
    display: flex;
    flex-wrap: wrap;

    margin: -10px 20px -20px 10px;
}
.tree-sidepanel-devs-label {
    display: block;
    width: 100%;
    color: white;
    text-shadow: 0 0px 8px black;
}
.tree-sidepanel-dev-link, .tree-sidepanel-dev-link:hover, .tree-sidepanel-dev-link:active, .tree-sidepanel-dev-link:focus {
    color: #333 !important;
    background: rgba(254, 255, 255, 0.88);
    margin: 0px 20px 20px 0;
    padding: 10px 12px 12px;
    border-radius: 11px;
    display: inline-block;
    text-align: center;
    overflow: hidden;
    height: fit-content;
    box-shadow: 6px 10px 9px -7px;
    -webkit-box-shadow: 6px 10px 9px -7px;
    min-width: 192px;
}
.tree-sidepanel-dev-pic {
    width: 45px;
    height: 45px;
    border-radius: 5px;
    float: left;
    display: inline-block;
    margin-right: 9px;
}
.tree-sidepanel-dev-label-wrapper {
    line-height: 25px;
    vertical-align: top;
    text-align: left;
    display: block;
    overflow: hidden
}
.tree-sidepanel-dev-label-name {
    font-weight: 700;
}
.tree-sidebar-dev-label-status-wrapper {
    display: block;
    text-align: left;
    font-size: 20px;
}
.tree-sidebar-dev-label-status-job {
}
.tree-sidebar-dev-label-status-title {
    font-weight: 700;
}

.branches div div {
    opacity: 0;
    background: url(/assets/images/tree/branch-node.png);
    background-position: center top;
    background-repeat: no-repeat;
    height: 69px;
    width: 92px;
    position: absolute;
    /*-webkit-transition: all 0.2s;*/
    /*-moz-transition: all 0.2s;*/
    /*transition: all 0.2s;*/
    z-index: 1;
    cursor: pointer;
}
.foundations div div {
    opacity: 0;
    background: url(/assets/images/tree/foundation-node.png);
    background-position: center top;
    background-repeat: no-repeat;
    height: 96px;
    width: 92px;
    position: absolute;
    /*-webkit-transition: all 0.2s;*/
    /*-moz-transition: all 0.2s;*/
    /*transition: all 0.2s;*/
    z-index: 3;
    cursor: pointer;
}
.stems div div {
    opacity: 0;
    background: url(/assets/images/tree/stem-node.png);
    background-position: center top;
    background-repeat: no-repeat;
    height: 95px;
    width: 102px;
    position: absolute;
    /*-webkit-transition: all 0.2s;*/
    /*-moz-transition: all 0.2s;*/
    /*transition: all 0.2s;*/
    z-index: 2;
    cursor: pointer;
}
.roots div div {
    opacity: 0;
    background: url(/assets/images/tree/root-node.png);
    background-position: center top;
    background-repeat: no-repeat;
    height: 68px;
    width: 92px;
    position: absolute;
    /*-webkit-transition: all 0.2s;*/
    /*-moz-transition: all 0.2s;*/
    /*transition: all 0.2s;*/
    z-index: 1;
    cursor: pointer;
}
.tree-feature-updatenumber {
    opacity: 1;
    background: #59d85d;
    display: block;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    color: black;
    line-height: 20px;
    text-align: center;
    font-size: 15px;
    border: 1px solid green;
    display: inline-block;
    margin: 0px -5px 0 5px;
    vertical-align: bottom;
    text-shadow: none;
    font-weight: 700;
}
.roots div .tree-feature-updatenumber, .stems div .tree-feature-updatenumber, .branches div .tree-feature-updatenumber, .foundations div .tree-feature-updatenumber {
    opacity: 1;
    background: #eddd1e;
    display: block;
    height: 20px;
    width: 20px;
    top: 0px;
    right: -10px;
    z-index: 5;
    border-radius: 50%;
    color: black;
    line-height: 20px;
    text-align: center;
    font-size: 15px;
    border: 1px solid #807a00;
}
.foundations .foundation-eco-wrapper div {
    background: none;
}
.foundations .foundation-eco-wrapper div div {
    background: url(/assets/images/tree/foundation-eco-node-hover.png);
    height: 220px;
    width: 310px;
    pointer-events: none;
    position: relative;
    left: -110px;
    top: -49px;
    opacity: 1;
    background-size: 327px !important;
}
.branches div:hover, .foundations div:hover, .stems div:hover, .roots div:hover, .branches div:hover img, .foundations div:hover img, .stems div:hover img, .roots div:hover img {
    opacity: 1 !important;
}
.branch-1:hover div, .branch-2:hover div, .branch-3:hover div, .branch-4:hover div, .branch-5:hover div, .branch-6:hover div, .branch-7:hover div, .branch-8:hover div, .branch-9:hover div, .branch-10:hover div, .branch-11:hover div, .branch-12:hover div, .branch-13:hover div, .branch-14:hover div, .branch-15:hover div, .branch-16:hover div, .branch-17:hover div, .root-1:hover div, .root-2:hover div, .root-3:hover div, .root-4:hover div, .root-5:hover div, .root-6:hover div, .foundations div:hover div, .stems div:hover div {
    opacity: 1 !important;
    -webkit-transition: opacity .6s;
    -moz-transition: opacity .6s;
    transition: opacity .6s;
}
.node-highlight {
    opacity: 1 !important;
}
.roots div div div, .branches div div div {
    pointer-events: none;
}
.foundation-eco-wrapper {
    position: absolute;
    top: 620px;
    left: 434px;
}
.branch-1-wrapper {
    position: absolute;
    top: 536px;
    left: 254px;
    z-index: 1;
}
.branch-2-wrapper {
    position: absolute;
    top: 493px;
    left: 203px;
    z-index: 2;
}
.branch-3-wrapper {
    position: absolute;
    top: 425px;
    left: 190px;
    z-index: 3;
}
.branch-4-wrapper {
    position: absolute;
    top: 366px;
    left: 227px;
    z-index: 4;
}
.branch-5-wrapper {
    position: absolute;
    top: 324px;
    left: 278px;
    z-index: 5;
}
.branch-6-wrapper {
    position: absolute;
    top: 267px;
    left: 317px;
    z-index: 6;
}
.branch-7-wrapper {
    position: absolute;
    top: 198px;
    left: 309px;
    z-index: 7;
}
.branch-8-wrapper {
    position: absolute;
    top: 146px;
    left: 362px;
    z-index: 8;
}
.branch-9-wrapper {
    position: absolute;
    top: 108px;
    left: 432px;
    z-index: 9;
}
.branch-10-wrapper {
    position: absolute;
    top: 142px;
    left: 504px;
    z-index: 8;
}
.branch-11-wrapper {
    position: absolute;
    top: 196px;
    left: 553px;
    z-index: 7;
}
.branch-12-wrapper {
    position: absolute;
    top: 267px;
    left: 540px;
    z-index: 6;
}
.branch-13-wrapper {
    position: absolute;
    top: 325px;
    left: 582px;
    z-index: 5;
}
.branch-14-wrapper {
    position: absolute;
    top: 368px;
    left: 637px;
    z-index: 4;
}
.branch-15-wrapper {
    position: absolute;
    top: 426px;
    left: 672px;
    z-index: 3;
}
.branch-16-wrapper {
    position: absolute;
    top: 493px;
    left: 657px;
    z-index: 2;
}
.branch-17-wrapper {
    position: absolute;
    top: 543px;
    left: 611px;
    z-index: 1;
}
.branches .branch-nodes-wrapper {
    opacity: 1;
    background: none;
    z-index: 0;
}
.roots .root-nodes-wrapper {
    opacity: 1;
    background: none;
    z-index: 0;
}
.branch-1-wrapper .node-1 {
    top: 37px;
    left: -236px;
    background-size: 26px !important;
}
.branch-1-wrapper .node-2 {
    top: 19px;
    left: -213px;
    background-size: 26px !important;
}
.branch-1-wrapper .node-3 {
    top: -3px;
    left: -190px;
}
.branch-1-wrapper .node-4 {
    top: 52px;
    left: -168px;
}
.branch-1-wrapper .node-5 {
    top: 33px;
    left: -144px;
}
.branch-1-wrapper .node-6 {
    top: -6px;
    left: -143px;
}
.branch-2-wrapper .node-1 {
    top: -35px;
    left: -231px;
    background-size: 26px !important;
}
.branch-2-wrapper .node-2 {
    background-size: 26px !important;
    top: -16px;
    left: -208px;
}
.branch-2-wrapper .node-3 {
    top: -21px;
    left: -161px;
    background-size: 32px !important;
}
.branch-2-wrapper .node-4 {
    top: -22px;
    left: -115px;
}
.branch-3-wrapper .node-1 {
    top: -61px;
    left: -200px;
    background-size: 24px !important;
}
.branch-3-wrapper .node-2 {
    top: -24px;
    left: -200px;
    background-size: 26px !important;
}
.branch-3-wrapper .node-3 {
    top: -24px;
    left: -154px;
    background-size: 26px !important;
}
.branch-3-wrapper .node-4 {
    top: -7px;
    left: -130px;
    background-size: 29px !important;
}
.branch-3-wrapper .node-5 {
    top: -28px;
    left: -106px;
    background-size: 32px !important;
}
.branch-3-wrapper .node-6 {
    top: -11px;
    left: -84px;
}
.branch-4-wrapper .node-1 {
    top: -64px;
    left: -210px;
    background-size: 26px !important;
}
.branch-4-wrapper .node-2 {
    top: -45px;
    left: -186px;
    background-size: 26px !important;
}
.branch-4-wrapper .node-3 {
    top: -8px;
    left: -186px;
    background-size: 26px !important;
}
.branch-4-wrapper .node-4 {
    top: -26px;
    left: -164px;
    background-size: 30px !important;
}
.branch-4-wrapper .node-5 {
    top: -8px;
    left: -141px;
}
.branch-4-wrapper .node-6 {
    top: -27px;
    left: -117px;
}
.branch-4-wrapper .node-7 {
    top: -8px;
    left: -94px;
}
.branch-5-wrapper .node-1 {
    top: -80px;
    left: -188px;
    background-size: 26px !important;
}
.branch-5-wrapper .node-2 {
    top: -43px;
    left: -188px;
    background-size: 26px !important;
}
.branch-5-wrapper .node-3 {
    top: -43px;
    left: -142px;
    background-size: 26px !important;
}
.branch-5-wrapper .node-4 {
    top: -5px;
    left: -142px;
    background-size: 30px !important;
}
.branch-5-wrapper .node-5 {
    top: -24px;
    left: -119px;
}
.branch-5-wrapper .node-6 {
    top: -4px;
    left: -97px;
    background-size: 26px !important;
}
.branch-5-wrapper .node-7 {
    top: -23px;
    left: -73px;
}
.branch-5-wrapper .node-8 {
    top: 14px;
    left: -73px;
}
.branch-6-wrapper .node-1 {
    top: -81px;
    left: -204px;
    background-size: 26px !important;
}
.branch-6-wrapper .node-2 {
    top: -43px;
    left: -204px;
    background-size: 26px !important;
}
.branch-6-wrapper .node-3 {
    top: -43px;
    left: -158px;
}
.branch-6-wrapper .node-4 {
    top: -5px;
    left: -111px;
}
.branch-7-wrapper .node-1 {
    top: -69px;
    left: -175px;
    background-size: 26px !important;
}
.branch-7-wrapper .node-2 {
    top: -51px;
    left: -153px;
    background-size: 26px !important;
}
.branch-7-wrapper .node-3 {
    top: -69px;
    left: -130px;
    background-size: 26px !important;
}
.branch-7-wrapper .node-4 {
    top: -88px;
    left: -106px;
}
.branch-7-wrapper .node-5 {
    top: -14px;
    left: -152px;
    background-size: 30px !important;
}
.branch-7-wrapper .node-6 {
    top: -31px;
    left: -130px;
}
.branch-7-wrapper .node-7 {
    top: -14px;
    left: -105px;
}
.branch-7-wrapper .node-8 {
    top: -32px;
    left: -84px;
}
.branch-7-wrapper .node-9 {
    top: 5px;
    left: -84px;
}
.branch-8-wrapper .node-1 {
    top: -74px;
    left: -108px;
    background-size: 26px !important;
}
.branch-8-wrapper .node-2 {
    top: -113px;
    left: -61px;
    background-size: 26px !important;
}
.branch-8-wrapper .node-3 {
    top: -38px;
    left: -108px;
    background-size: 26px !important;
}
.branch-8-wrapper .node-4 {
    top: -56px;
    left: -84px;
}
.branch-8-wrapper .node-5 {
    top: -94px;
    left: -38px;
    background-size: 30px !important;
}
.branch-8-wrapper .node-6 {
    top: -19px;
    left: -85px;
}
.branch-8-wrapper .node-7 {
    top: -55px;
    left: -39px;
}
.branch-8-wrapper .node-8 {
    top: -19px;
    left: -39px;
    background-size: 26px !important;
}
.branch-8-wrapper .node-9 {
    top: -38px;
    left: -12px;
    background-size: 26px !important;
}
.branch-9-wrapper .node-1 {
    top: -75px;
    left: -35px;
}
.branch-9-wrapper .node-2 {
    top: -112px;
    left: 10px;
}
.branch-9-wrapper .node-3 {
    top: -37px;
    left: -35px;
}
.branch-9-wrapper .node-4 {
    top: -37px;
    left: 9px;
    background-size: 26px !important;
}
.branch-10-wrapper .node-1 {
    top: -32px;
    left: -17px;
}
.branch-10-wrapper .node-2 {
    top: -70px;
    left: 33px;
}
.branch-10-wrapper .node-3 {
    top: -90px;
    left: 55px;
    background-size: 30px !important;
}
.branch-10-wrapper .node-4 {
    top: -13px;
    left: 56px;
    background-size: 26px !important;
}
.branch-11-wrapper .node-1 {
    top: -51px;
    left: 33px;
}
.branch-11-wrapper .node-2 {
    top: -87px;
    left: 79px;
}
.branch-11-wrapper .node-3 {
    top: -49px;
    left: 78px;
    background-size: 26px !important;
}
.branch-11-wrapper .node-4 {
    top: -14px;
    left: 78px;
}
.branch-11-wrapper .node-5 {
    top: -50px;
    left: 126px;
    background-size: 26px !important;
}
.branch-11-wrapper .node-6 {
    top: -67px;
    left: 147px;
    background-size: 26px !important;
}
.branch-12-wrapper .node-1 {
    top: -24px;
    left: 68px;
}
.branch-12-wrapper .node-2 {
    top: -24px;
    left: 113px;
}
.branch-12-wrapper .node-3 {
    top: -62px;
    left: 113px;
}
.branch-12-wrapper .node-4 {
    top: -24px;
    left: 159px;
    background-size: 26px !important;
}
.branch-12-wrapper .node-5 {
    top: -81px;
    left: 182px;
    background-size: 26px !important;
}
.branch-13-wrapper .node-1 {
    top: 14px;
    left: 52px;
}
.branch-13-wrapper .node-2 {
    top: -43px;
    left: 119px;
}
.branch-13-wrapper .node-3 {
    top: -81px;
    left: 166px;
    background-size: 26px !important;
}
.branch-14-wrapper .node-1 {
    top: -9px;
    left: 65px;
}
.branch-14-wrapper .node-2 {
    top: -9px;
    left: 111px;
}
.branch-14-wrapper .node-3 {
    top: -65px;
    left: 134px;
    background-size: 26px !important;
}
.branch-14-wrapper .node-4 {
    top: -47px;
    left: 158px;
    background-size: 26px !important;
}
.branch-15-wrapper .node-1 {
    top: -11px;
    left: 56px;
}
.branch-15-wrapper .node-2 {
    top: -11px;
    left: 103px;
}
.branch-15-wrapper .node-3 {
    top: -49px;
    left: 103px;
}
.branch-15-wrapper .node-4 {
    top: 7px;
    left: 126px;
    background-size: 26px !important;
}
.branch-15-wrapper .node-5 {
    top: -49px;
    left: 149px;
    background-size: 26px !important;
}
.branch-15-wrapper .node-6 {
    top: -30px;
    left: 173px;
    background-size: 26px !important;
}
.branch-16-wrapper .node-1 {
    top: -3px;
    left: 74px;
}
.branch-16-wrapper .node-2 {
    top: -21px;
    left: 143px;
}
.branch-16-wrapper .node-3 {
    top: -58px;
    left: 191px;
    background-size: 26px !important;
}
.branch-16-wrapper .node-4 {
    top: -2px;
    left: 214px;
    background-size: 26px !important;
}
.branch-16-wrapper .node-5 {
    top: -37px;
    left: 196px;
    background-size: 36px !important;
}
.branch-17-wrapper .node-1 {
    top: 24px;
    left: 116px;
}
.branch-17-wrapper .node-2 {
    top: 24px;
    left: 163px;
}
.branch-17-wrapper .node-3 {
    top: -13px;
    left: 209px;
    background-size: 26px !important;
}
.root-1-wrapper .node-1 {
    top: 110px;
    left: -158px;
    background-size: 26px !important;
}
.root-1-wrapper .node-2 {
    top: 73px;
    background-size: 26px !important;
    left: -112px;
}
.root-1-wrapper .node-3 {
    top: 35px;
    left: -112px;
}
.root-1-wrapper .node-4 {
    top: 25px;
    left: -157px;
}
.root-2-wrapper .node-1 {
    top: 62px;
    left: -114px;
    background-size: 26px !important;
}
.root-2-wrapper .node-2 {
    top: 97px;
    left: -112px;
    background-size: 26px !important;
}
.root-2-wrapper .node-3 {
    top: 99px;
    left: -68px;
}
.root-2-wrapper .node-4 {
    top: 135px;
    left: -112px;
}
.root-3-wrapper .node-1 {
    top: 101px;
    left: -104px;
    background-size: 26px !important;
}
.root-3-wrapper .node-2 {
    top: 101px;
    left: -57px;
}
.root-3-wrapper .node-3 {
    top: 101px;
    left: -10px;
    background-size: 30px !important;
}
.root-3-wrapper .node-4 {
    top: 139px;
    left: -57px;
}
.root-3-wrapper .node-5 {
    top: 139px;
    left: -11px;
}
.root-3-wrapper .node-6 {
    top: 117px;
    left: 13px;
    background-size: 35px !important;
}
.root-4-wrapper .node-1 {
    top: 103px;
    left: -24px;
}
.root-4-wrapper .node-2 {
    top: 103px;
    left: 23px;
}
.root-4-wrapper .node-3 {
    top: 102px;
    left: 69px;
    background-size: 30px !important;
}
.root-4-wrapper .node-4 {
    top: 140px;
    left: -23px;
    background-size: 26px !important;
}
.root-4-wrapper .node-5 {
    top: 139px;
    left: 22px;
    background-size: 35px !important;
}
.root-4-wrapper .node-6 {
    top: 127px;
    left: -51px;
}
.root-5-wrapper .node-1 {
    top: 116px;
    left: 57px;
}
.root-5-wrapper .node-2 {
    top: 62px;
    left: 82px;
    background-size: 26px !important;
}
.root-5-wrapper .node-3 {
    top: 98px;
    left: 27px;
    background-size: 34px !important;
}
.root-5-wrapper .node-4 {
    top: 42px;
    left: 47px;
    background-size: 37px !important;
}
.root-5-wrapper .node-5 {
    top: 80px;
    left: 97px;
}
.root-6-wrapper .node-1 {
    top: 34px;
    left: 70px;
}
.root-6-wrapper .node-2 {
    top: 72px;
    left: 117px;
    background-size: 30px !important;
}
.root-6-wrapper .node-3 {
    top: 112px;
    left: 117px;
    background-size: 37px !important;
}
.branches div div div {
    background: url(/assets/images/tree/node-hover.png);
    height: 98px;
    width: 132px;
}
.roots div div div {
    background: url(/assets/images/tree/node-hover.png);
    height: 98px;
    width: 132px;
}
.branches div div .node-progress {
    background: url(/assets/images/tree/node-hover-yellow.png);
    height: 98px;
    width: 132px;
}
.roots div div .node-progress {
    background: url(/assets/images/tree/node-hover-yellow.png);
    height: 98px;
    width: 132px;
}
.branches div div .node-future {
    background: url(/assets/images/tree/node-hover-grey.png);
    height: 98px;
    width: 132px;
}
.roots div div .node-future {
    background: url(/assets/images/tree/node-hover-grey.png);
    height: 98px;
    width: 132px;
}
.branches div .branch-nodes-wrapper div, .tree-key-green div {
    background: url(/assets/images/tree/node.png);
    margin-top: 2px;
}
.roots div .root-nodes-wrapper div, .tree-key-brown div {
    background: url(/assets/images/tree/node.png);
    margin-top: 2px;
}
.branches div .branch-nodes-wrapper .node-progress, .roots div .root-nodes-wrapper .node-progress {
    background: url(/assets/images/tree/node-yellow.png);
    background-position: center top;
    background-repeat: no-repeat;
}
.branches div .branch-nodes-wrapper .node-future, .roots div .root-nodes-wrapper .node-future {
    background: url(/assets/images/tree/node-grey.png);
    background-position: center top;
    background-repeat: no-repeat;
}
.node-labels {
    line-height: 30px;
}
.branches .node-labels span, .roots .node-labels span {
    white-space: nowrap;
    text-align: right;
    width: auto;
    position: static;
    display: inline;
    background: #6fb35ad9;
    color: black;
    padding: 0 10px;
    margin: 0;
    text-shadow: none;
    line-height: 29px;
    border-radius: 6px;
    border: 1px solid #00000069;
}
.branch-1-wrapper .node-labels, .branch-2-wrapper .node-labels, .branch-3-wrapper .node-labels, .branch-4-wrapper .node-labels, .branch-5-wrapper .node-labels, .branch-6-wrapper .node-labels, .branch-7-wrapper .node-labels, .branch-8-wrapper .node-labels, .root-1-wrapper .node-labels, .root-2-wrapper .node-labels, .root-3-wrapper .node-labels {
    background: none;
    width: 240px;
    text-align: right;
}
.branch-9-wrapper .node-labels, .branch-10-wrapper .node-labels, .branch-11-wrapper .node-labels, .branch-12-wrapper .node-labels, .branch-13-wrapper .node-labels, .branch-14-wrapper .node-labels, .branch-15-wrapper .node-labels, .branch-16-wrapper .node-labels, .branch-17-wrapper .node-labels, .root-4-wrapper .node-labels, .root-5-wrapper .node-labels, .root-6-wrapper .node-labels {
    background: none;
    width: 240px;
    text-align: left;
}
.branch-1-wrapper .tree-dev-wrapper, .branch-2-wrapper .tree-dev-wrapper, .branch-3-wrapper .tree-dev-wrapper, .branch-4-wrapper .tree-dev-wrapper, .branch-5-wrapper .tree-dev-wrapper, .branch-6-wrapper .tree-dev-wrapper, .branch-7-wrapper .tree-dev-wrapper, .branch-8-wrapper .tree-dev-wrapper, .root-1-wrapper .tree-dev-wrapper, .root-2-wrapper .tree-dev-wrapper, .root-3-wrapper .tree-dev-wrapper {
    justify-content: flex-end;
}
.branch-9-wrapper .tree-dev-wrapper, .branch-10-wrapper .tree-dev-wrapper, .branch-11-wrapper .tree-dev-wrapper, .branch-12-wrapper .tree-dev-wrapper, .branch-13-wrapper .tree-dev-wrapper, .branch-14-wrapper .tree-dev-wrapper, .branch-15-wrapper .tree-dev-wrapper, .branch-16-wrapper .tree-dev-wrapper, .branch-17-wrapper .tree-dev-wrapper, .root-4-wrapper .tree-dev-wrapper, .root-5-wrapper .tree-dev-wrapper, .root-6-wrapper .tree-dev-wrapper {
    justify-content: flex-start;
}
.branches .branch-1-wrapper hr {
    background: url(/assets/images/tree/branch-line-1.png);
    background-repeat: no-repeat;
    background-size: 40%;
    width: 90px;
    height: 70px;
    top: -27px;
    left: 72px;
}
.branches .branch-2-wrapper hr {
    background: url(/assets/images/tree/branch-line-2.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 69px;
    height: 40px;
    top: -15px;
    left: 79px;
}
.branches .branch-3-wrapper hr {
    background: url(/assets/images/tree/branch-line-3.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 79px;
    height: 70px;
    top: 23px;
    left: 84px;
}
.branches .branch-4-wrapper hr {
    background: url(/assets/images/tree/branch-line-4.png);
    background-repeat: no-repeat;
    width: 79px;
    height: 100px;
    top: 41px;
    left: 64px;
}
.branches .branch-5-wrapper hr {
    background: url(/assets/images/tree/branch-line-5.png);
    background-repeat: no-repeat;
    width: 79px;
    height: 110px;
    top: 43px;
    left: 55px;
}
.branches .branch-6-wrapper hr {
    background: url(/assets/images/tree/branch-line-6.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 89px;
    height: 70px;
    top: 25px;
    left: 75px;
}
.branches .branch-7-wrapper hr {
    background: url(/assets/images/tree/branch-line-7.png);
    background-repeat: no-repeat;
    width: 85px;
    height: 110px;
    top: 35px;
    left: 71px;
}
.branches .branch-8-wrapper hr {
    background: url(/assets/images/tree/branch-line-8.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 69px;
    height: 152px;
    top: 37px;
    left: 48px;
}
.branches .branch-9-wrapper hr {
    background: url(/assets/images/tree/branch-line-9.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 44px;
    height: 200px;
    top: 43px;
    left: 48px;
}
.branches .branch-10-wrapper hr {
    background: url(/assets/images/tree/branch-line-10.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 68px;
    height: 150px;
    top: 42px;
    left: -8px;
}
.branches .branch-11-wrapper hr {
    background: url(/assets/images/tree/branch-line-11.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 99px;
    height: 106px;
    top: 30px;
    left: -55px;
}
.branches .branch-12-wrapper hr {
    background: url(/assets/images/tree/branch-line-12.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 79px;
    height: 70px;
    top: 31px;
    left: -36px;
}
.branches .branch-13-wrapper hr {
    background: url(/assets/images/tree/branch-line-13.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 109px;
    height: 70px;
    top: -15px;
    left: -76px;
}
.branches .branch-14-wrapper hr {
    background: url(/assets/images/tree/branch-line-14.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 55px;
    height: 80px;
    top: 27px;
    left: -27px;
}
.branches .branch-15-wrapper hr {
    background: url(/assets/images/tree/branch-line-15.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 107px;
    height: 70px;
    top: 23px;
    left: -61px;
}
.branches .branch-16-wrapper hr {
    background: url(/assets/images/tree/branch-line-16.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 80px;
    height: 70px;
    top: 8px;
    left: -56px;
}
.branches .branch-17-wrapper hr {
    background: url(/assets/images/tree/branch-line-17.png);
    background-repeat: no-repeat;
    width: 79px;
    height: 70px;
    top: -41px;
    left: -5px;
}
.stem-1-wrapper hr {
    background: url(/assets/images/tree/foundation-lines-2.png);
    background-repeat: no-repeat;
    background-size: 86%;
    width: 10px;
    height: 108px;
    top: 60px;
    left: 51px;
    opacity: 0;
}
.stem-2-wrapper hr {
    background: url(/assets/images/tree/foundation-lines-3.png);
    background-repeat: no-repeat;
    background-size: 87%;
    width: 64px;
    height: 13px;
    top: 46px;
    left: -33px;
    opacity: 0;
}
.stem-3-wrapper hr {
    background: url(/assets/images/tree/foundation-lines-1.png);
    background-repeat: no-repeat;
    background-size: 87%;
    width: 79px;
    height: 21px;
    top: 46px;
    left: 74px;
    opacity: 0;
}
.foundation-1-wrapper hr {
    background: url(/assets/images/tree/foundation-lines-2.png);
    background-repeat: no-repeat;
    background-size: 86%;
    width: 10px;
    height: 100px;
    top: 62px;
    left: 38px;
    opacity: 0;
}
.roots .root-1-wrapper hr {
    background: url(/assets/images/tree/root-lines-1.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 79px;
    height: 20px;
    top: -8px;
    left: 84px;
}
.roots .root-2-wrapper hr {
    background: url(/assets/images/tree/root-lines-2.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 79px;
    height: 70px;
    top: -61px;
    left: 70px;
}
.roots .root-3-wrapper hr {
    background: url(/assets/images/tree/root-lines-3.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 49px;
    height: 190px;
    top: -97px;
    left: 60px;
}
.roots .root-4-wrapper hr {
    background: url(/assets/images/tree/root-lines-4.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 49px;
    height: 88px;
    top: -97px;
    left: -9px;
}
.roots .root-5-wrapper hr {
    background: url(/assets/images/tree/root-lines-5.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 92px;
    height: 70px;
    top: -53px;
    left: -52px;
}
.roots .root-6-wrapper hr {
    background: url(/assets/images/tree/root-lines-6.png);
    background-repeat: no-repeat;
    background-size: 85%;
    width: 89px;
    height: 70px;
    top: -7px;
    left: -66px;
}
.stem-1-wrapper {
    position: absolute;
    top: 334px;
    left: 427px;
}
.stem-2-wrapper {
    position: absolute;
    top: 459px;
    left: 519px;
}
.stem-3-wrapper {
    position: absolute;
    top: 458px;
    left: 327px;
}
.foundation-1-wrapper {
    position: absolute;
    top: 503px;
    left: 437px;
}
.foundation-2-wrapper {
    position: absolute;
    top: 747px;
    left: 431px;
}
.root-1-wrapper {
    position: absolute;
    top: 782px;
    left: 290px;
    z-index: 1;
}
.root-2-wrapper {
    position: absolute;
    top: 852px;
    left: 316px;
    z-index: 2;
}
.root-3-wrapper {
    position: absolute;
    top: 906px;
    left: 378px;
    z-index: 3;
}
.root-4-wrapper {
    position: absolute;
    top: 905px;
    left: 488px;
    z-index: 3;
}
.root-5-wrapper {
    position: absolute;
    top: 852px;
    left: 550px;
    z-index: 2;
}
.root-6-wrapper {
    position: absolute;
    top: 783px;
    left: 580px;
    z-index: 1;
}
.branches div div div, .foundations div div div, .stems div div div, .roots div div div, .branches div div .node-progress, .roots div div .node-progress, .branches div div .node-future, .roots div div .node-future {
    opacity: 0;
    background-position: center 4px;
    background-repeat: no-repeat;
    position: absolute;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
    z-index: 1;
    background-size: 36px;
}
.branches div .branch-nodes-wrapper div {
    opacity: 1;
    background-position: center top;
    background-repeat: no-repeat;
    position: absolute;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
    z-index: 1;
}
.roots div .root-nodes-wrapper div {
    opacity: 1;
    background-position: center top;
    background-repeat: no-repeat;
    position: absolute;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
    z-index: 1;
}
.foundations span {
    color: white;
    top: 36px;
    left: -1px;
    line-height: 26px;
    position: relative;
    display: block;
    width: 91px;
    font-size: 18px;
    text-align: center;
    z-index: 4;
    cursor: default;
    cursor: pointer;
}
.branches span {
    color: white;
    top: 23px;
    left: 11px;
    line-height: 26px;
    position: relative;
    display: block;
    width: 79px;
    font-size: 17px;
    text-align: center;
    cursor: default;
    text-shadow: 0px 2px 3px black;
    z-index: 4;
    cursor: pointer;
    background: #2f773f6e;
    pointer-events: none;
}
.stems span {
    color: white;
    top: 34px;
    left: 11px;
    line-height: 26px;
    position: relative;
    display: block;
    width: 87px;
    text-align: center;
    font-size: 17px;
    cursor: default;
    text-shadow: 0px 2px 3px black;
    z-index: 4;
    cursor: pointer;
}
.roots span {
    color: white;
    top: 21px;
    left: 2px;
    line-height: 26px;
    position: relative;
    display: block;
    width: 91px;
    font-size: 17px;
    text-align: center;
    text-shadow: 0px 2px 3px black;
    pointer-events: none;
    z-index: 4;
    cursor: pointer;
}
.tree hr {
    border: none;
    background-position: center top;
    background-repeat: no-repeat;
    position: absolute;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
    pointer-events: none;
    opacity: 0;
}
#howToStart {
    display: none;
}
#closeHowToStart {
    cursor: pointer;
}
#fullScreenBtn {
    display: none;
    font-size: 28px;
    position: absolute;
    right: 13px;
    top: 63px;
    color: #ffffff;
    z-index: 1000;
    cursor: pointer;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s;
}
#fullScreenBtn:hover {
    color: #1a3750;
}
#closeSidebarBtn {
    display: none;
    font-size: 32px;
    position: absolute;
    right: 14px;
    top: 20px;
    color: #ffffff;
    z-index: 1000;
    cursor: pointer;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s;
}
#closeSidebarBtn:hover {
    color: #1a3750;
}
#recentUpdatesBtn {
    color: white !important;
    background: rgb(128, 190, 106);
    display: inline-block;
    width: auto;
    margin-right: 30px;
    margin-bottom: 20px;
    font-size: 30px;
    line-height: 37px;
    height: 52px;
}
#joinDiscussionBtn {
    color: white !important;
    background: rgb(128, 190, 106);
    display: inline-block;
    width: auto;
    margin: 0 auto !important;
    font-size: 30px;
    line-height: 37px;
    height: 52px;
}
.updatesButtonsWrapper {
    display: table;
    width: auto;
    margin: 30px auto 0 !important;
    text-align: center;
}
.tree-dev-wrapper {
    background: none !important;
    width: 210px !important;
    height: 48px !important;
    display: flex;
    flex-wrap: wrap;
}
.root-3-wrapper .tree-dev-wrapper {
    width: 300px !important;
}
.roots .tree-dev-wrapper {
    flex-wrap: wrap-reverse;
}
.tree-devrays {
    /* filter: sepia(30) saturate(80) brightness(70%) hue-rotate(360deg); */
    opacity: 0;
    box-shadow: none;
    -webkit-box-shadow: none;
    position: absolute;
    width: 100px !important;
    height: 100px !important;
    top: -30px;
    right: -36px;
}
.branch-9-wrapper .tree-devrays, .branch-10-wrapper .tree-devrays, .branch-11-wrapper .tree-devrays, .branch-12-wrapper .tree-devrays, .branch-13-wrapper .tree-devrays, .branch-14-wrapper .tree-devrays, .branch-15-wrapper .tree-devrays, .branch-16-wrapper .tree-devrays, .branch-17-wrapper .tree-devrays, .root-4-wrapper .tree-devrays, .root-5-wrapper .tree-devrays, .root-6-wrapper .tree-devrays {
    left: -35px;
    transform: rotate(120deg);
}
.branch-1-wrapper .tree-devrays {
    transform: rotate(-50deg);
}
.branch-2-wrapper .tree-devrays {
    transform: rotate(-50deg);
}
.branch-3-wrapper .tree-devrays {
    transform: rotate(-40deg);
}
.branch-4-wrapper .tree-devrays {
    transform: rotate(-30deg);
}
.branch-5-wrapper .tree-devrays {
    transform: rotate(-20deg);
}
.branch-6-wrapper .tree-devrays {
    transform: rotate(-20deg);
}
.branch-7-wrapper .tree-devrays {
    transform: rotate(10deg);
}
.branch-8-wrapper .tree-devrays {
    transform: rotate(0deg);
}
.branch-9-wrapper .tree-devrays {
    transform: rotate(20deg);
}
.branch-10-wrapper .tree-devrays {
    transform: rotate(100deg);
}
.branch-11-wrapper .tree-devrays {
    transform: rotate(100deg);
}
.branch-12-wrapper .tree-devrays {
    transform: rotate(110deg);
}
.branch-13-wrapper .tree-devrays {
    transform: rotate(110deg);
}
.branch-14-wrapper .tree-devrays {
    transform: rotate(120deg);
}
.branch-15-wrapper .tree-devrays {
    transform: rotate(110deg);
}
.branch-16-wrapper .tree-devrays {
    transform: rotate(120deg);
}
.branch-17-wrapper .tree-devrays {
    transform: rotate(130deg);
}
.root-1-wrapper .tree-devrays {
    transform: rotate(-60deg);
}
.root-2-wrapper .tree-devrays {
    transform: rotate(-70deg);
}
.root-3-wrapper .tree-devrays {
    transform: rotate(-60deg);
}
.root-4-wrapper .tree-devrays {
    transform: rotate(140deg);
}
.root-5-wrapper .tree-devrays {
    transform: rotate(170deg);
}
.root-6-wrapper .tree-devrays {
    transform: rotate(130deg);
}
.tree-dev-wrapper a {
    pointer-events: initial !important;
}
.branch-1-wrapper .tree-dev-wrapper a, .branch-2-wrapper .tree-dev-wrapper a, .branch-3-wrapper .tree-dev-wrapper a, .branch-4-wrapper .tree-dev-wrapper a, .branch-5-wrapper .tree-dev-wrapper a, .branch-6-wrapper .tree-dev-wrapper a, .branch-7-wrapper .tree-dev-wrapper a, .branch-8-wrapper .tree-dev-wrapper a, .root-1-wrapper .tree-dev-wrapper a, .root-2-wrapper .tree-dev-wrapper a, .root-3-wrapper .tree-dev-wrapper a {
    pointer-events: initial !important;
    margin-left: 10px;
    margin-bottom: 10px;
    float: right;
    text-align: center;
    width: 40px;
    height: 40px;
    position: relative;
}
.branch-9-wrapper .tree-dev-wrapper a, .branch-10-wrapper .tree-dev-wrapper a, .branch-11-wrapper .tree-dev-wrapper a, .branch-12-wrapper .tree-dev-wrapper a, .branch-13-wrapper .tree-dev-wrapper a, .branch-14-wrapper .tree-dev-wrapper a, .branch-15-wrapper .tree-dev-wrapper a, .branch-16-wrapper .tree-dev-wrapper a, .branch-17-wrapper .tree-dev-wrapper a, .root-4-wrapper .tree-dev-wrapper a, .root-5-wrapper .tree-dev-wrapper a, .root-6-wrapper .tree-dev-wrapper a {
    pointer-events: initial !important;
    margin-right: 10px;
    float: left;
    text-align: center;
    width: 40px;
    height: 40px;
    position: relative;
}
.branch-1-wrapper .tree-dev-wrapper .tree-dev-label, .branch-2-wrapper .tree-dev-wrapper .tree-dev-label, .branch-3-wrapper .tree-dev-wrapper .tree-dev-label, .branch-4-wrapper .tree-dev-wrapper .tree-dev-label, .branch-5-wrapper .tree-dev-wrapper .tree-dev-label, .branch-6-wrapper .tree-dev-wrapper .tree-dev-label, .branch-7-wrapper .tree-dev-wrapper .tree-dev-label, .branch-8-wrapper .tree-dev-wrapper .tree-dev-label, .root-1-wrapper .tree-dev-wrapper .tree-dev-label, .root-2-wrapper .tree-dev-wrapper .tree-dev-label, .root-3-wrapper .tree-dev-wrapper .tree-dev-label {
    right:50px;
}
.branch-9-wrapper .tree-dev-wrapper .tree-dev-label, .branch-10-wrapper .tree-dev-wrapper .tree-dev-label, .branch-11-wrapper .tree-dev-wrapper .tree-dev-label, .branch-12-wrapper .tree-dev-wrapper .tree-dev-label, .branch-13-wrapper .tree-dev-wrapper .tree-dev-label, .branch-14-wrapper .tree-dev-wrapper .tree-dev-label, .branch-15-wrapper .tree-dev-wrapper .tree-dev-label, .branch-16-wrapper .tree-dev-wrapper .tree-dev-label, .branch-17-wrapper .tree-dev-wrapper .tree-dev-label, .root-4-wrapper .tree-dev-wrapper .tree-dev-label, .root-5-wrapper .tree-dev-wrapper .tree-dev-label, .root-6-wrapper .tree-dev-wrapper .tree-dev-label {
    left:50px;
}
.root-3-wrapper .tree-dev-wrapper .tree-dev-label, .root-4-wrapper .tree-dev-wrapper .tree-dev-label{
    bottom: -8px;
}
.root-3-wrapper .tree-dev-wrapper , .root-4-wrapper .tree-dev-wrapper {
    bottom:unset;
    top: -28px;
}
.branch-1-wrapper .tree-dev-wrapper img, .branch-2-wrapper .tree-dev-wrapper img, .branch-3-wrapper .tree-dev-wrapper img, .branch-4-wrapper .tree-dev-wrapper img, .branch-5-wrapper .tree-dev-wrapper img, .branch-6-wrapper .tree-dev-wrapper img, .branch-7-wrapper .tree-dev-wrapper img, .branch-8-wrapper .tree-dev-wrapper img, .root-1-wrapper .tree-dev-wrapper img, .root-2-wrapper .tree-dev-wrapper img, .root-3-wrapper .tree-dev-wrapper img {
    width: 40px;
    height: 40px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.branch-9-wrapper .tree-dev-wrapper img, .branch-10-wrapper .tree-dev-wrapper img, .branch-11-wrapper .tree-dev-wrapper img, .branch-12-wrapper .tree-dev-wrapper img, .branch-13-wrapper .tree-dev-wrapper img, .branch-14-wrapper .tree-dev-wrapper img, .branch-15-wrapper .tree-dev-wrapper img, .branch-16-wrapper .tree-dev-wrapper img, .branch-17-wrapper .tree-dev-wrapper img, .root-4-wrapper .tree-dev-wrapper img, .root-5-wrapper .tree-dev-wrapper img, .root-6-wrapper .tree-dev-wrapper img {
    width: 40px;
    height: 40px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.branch-1-wrapper .tree-dev-wrapper {
    left: -415px;
    top: 34px;
}
.branch-2-wrapper .tree-dev-wrapper {
    left: -410px;
    top: -30px;
}
.branch-3-wrapper .tree-dev-wrapper {
    left: -373px;
    top: -53px;
}
.branch-4-wrapper .tree-dev-wrapper {
    left: -380px;
    top: -73px;
}
.branch-5-wrapper .tree-dev-wrapper {
    left: -370px;
    top: -93px;
}
.branch-6-wrapper .tree-dev-wrapper {
    left: -380px;
    top: -103px;
}
.branch-7-wrapper .tree-dev-wrapper {
    left: -290px;
    top: -113px;
}
.branch-8-wrapper .tree-dev-wrapper {
    left: -240px;
    top: -123px;
}
.branch-9-wrapper .tree-dev-wrapper {
    left: -10px;
    top: -113px;
}
.branch-10-wrapper .tree-dev-wrapper {
    left: 160px;
    top: -95px;
}
.branch-11-wrapper .tree-dev-wrapper {
    left: 230px;
    top: -95px;
}
.branch-12-wrapper .tree-dev-wrapper {
    left: 290px;
    top: -85px;
}
.branch-13-wrapper .tree-dev-wrapper {
    left: 270px;
    top: -85px;
}
.branch-14-wrapper .tree-dev-wrapper {
    left: 270px;
    top: -56px;
}
.branch-15-wrapper .tree-dev-wrapper {
    left: 267px;
    top: -44px;
}
.branch-16-wrapper .tree-dev-wrapper {
    left: 287px;
    top: -44px;
}
.branch-17-wrapper .tree-dev-wrapper {
    left: 287px;
    top: 26px;
}
.root-1-wrapper .tree-dev-wrapper {
    left: -313px;
    top: 59px;
}
.root-2-wrapper .tree-dev-wrapper {
    left: -283px;
    top: 99px;
}
.root-3-wrapper .tree-dev-wrapper {
    left: -320px;
    top: 139px;
}
.root-4-wrapper .tree-dev-wrapper {
    left: 122px;
    top: 131px;
}
.root-5-wrapper .tree-dev-wrapper {
    left: 182px;
    top: 83px;
}
.root-6-wrapper .tree-dev-wrapper {
    left: 214px;
    top: 87px;
}
.branch-1 .node-labels {
    left: -433px;
    top: -11px;
}
.branch-2 .node-labels {
    left: -340px;
    top: -70px;
    width: 150px;
}
.branch-3 .node-labels {
    left: -350px;
    top: -100px;
    width: 190px;
}
.branch-4 .node-labels {
    left: -430px;
    top: -120px;
}
.branch-5 .node-labels {
    left: -400px;
    top: -140px;
}
.branch-6 .node-labels {
    left: -410px;
    top: -120px;
}
.branch-7 .node-labels {
    left: -380px;
    top: -120px;
}
.branch-8 .node-labels {
    left: -310px;
    top: -120px;
}
.branch-9 .node-labels {
    left: 110px;
    top: -110px;
}
.branch-10 .node-labels {
    left: 160px;
    top: -130px;
}
.branch-11 .node-labels {
    left: 240px;
    top: -130px;
}
.branch-12 .node-labels {
    left: 300px;
    top: -130px;
}
.branch-13 .node-labels {
    left: 270px;
    top: -100px;
}
.branch-14 .node-labels {
    left: 270px;
    top: -76px;
}
.branch-15 .node-labels {
    left: 270px;
    top: -96px;
}
.branch-16 .node-labels {
    left: 290px;
    top: -76px;
}
.branch-17 .node-labels {
    left: 300px;
    top: -6px;
}
.root-1 .node-labels {
    left: -330px;
    top: 32px;
}
.root-2 .node-labels {
    left: -320px;
    top: 62px;
}
.root-3 .node-labels {
    left: -320px;
    top: 52px;
}
.root-4 .node-labels {
    left: 170px;
    top: 22px;
}
.root-5 .node-labels {
    left: 180px;
    top: 62px;
}
.root-6 .node-labels {
    left: 210px;
    top: 32px;
}
.tree-sidepanel section, .tree-update-wrapper, .tab-pane section {
    padding: 20px 30px;
    background: rgba(254, 255, 255, 0.88);
    margin: 20px 40px 40px 10px;
    box-shadow: 0 10px 10px -5px;
    -webkit-box-shadow: 0 10px 10px -5px;
    border-radius: 11px;
}
.tree-update-wrapper:nth-child(even), .tab-pane section:nth-child(odd) {}
.tree-update-wrapper:last-of-type, .tab-pane section:last-of-type {}
.tree-sidepanel h3 {
    text-transform: capitalize;
    font-size: 29px;
    font-weight: 700;
}
.tree-sidepanel ol, .tree-sidepanel ul {
    line-height: 36px;
    font-size: 28px;
}
.tree-sidepanel li {
    margin-bottom: 2px;
}
.tree-sidepanel figure {
    text-align: center;
}
.tree-sidepanel img:not(.avatar) {
    max-width: 100%;
    width: auto;
    height: auto;
    margin: 0 auto;
}
.dateless .tree-sidepanel img {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.dateless a {
    text-align: center;
}
.tree-date {
    float: right;
    margin-top: 5px;
    margin-bottom: 10px;
    font-size: 30px;
    margin: 0px 0 0 0;
    line-height: 70px;
}
.sub-features-wrapper {
    margin: 20px 40px 0 10px;
    display: flex;
    flex-wrap: wrap-reverse;
}
.tree-sidepanel h2 {
    text-align: center;
}
h2.tree-sidebar-title {
    text-align: left;
    line-height: 70px;
    font-size: 40px;
}
.small-title {
    font-size: 31px;
}
.sub-title {
    font-weight: 400;
}
.tree-sidepanel .simplePullQuote {
    font-weight: 700;
    text-align: center;
    width: 80%;
    margin: 20px auto;
}
.tab-content section:first-of-type {
    margin-top: 0;
    border-radius: 0 0 11px 11px;
}
.recent-updates-node {
    padding-top: 20px;
}
.node-label-yellow {
    background: #ffff379c !important;
    color: black !important;
}
.node-label-black {
    background: #bebebed4 !important;
}
.tree-key-wrapper img {
    width: 25px;
    vertical-align: middle;
    box-shadow: none;
    -webkit-box-shadow: none;
}
.tree-key-wrapper {
    position: absolute;
    bottom: 9%;
    left: 30px;
    cursor: default;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.tree-key-green, .tree-key-brown, .tree-key-label {
    display: inline-block;
    vertical-align: top;
    margin-left: -16px;
    line-height: 27px;
}
.tree-key-brown div {
    background-size: 41px !important;
    opacity: 1;
    background-position: center top;
    background-repeat: no-repeat;
    width: 41px;
    height: 41px;
    margin-bottom: -16px;
    vertical-align: bottom;
}
.tree-key-green div {
    background-size: 41px !important;
    opacity: 1;
    background-position: center top;
    background-repeat: no-repeat;
    width: 41px;
    height: 41px;
    margin-bottom: -16px;
    vertical-align: bottom;
}
.tree-key-green img, .tree-key-brown img {
    width: 39px;
    margin-left: 1px;
    margin-top: 2px;
}
.tree-key-green .node-progress-5, .tree-key-brown .node-progress-5 {
    background-size: 39px !important;
    margin-left: 0px;
    margin-top: -10px;
}
.tree-key-wrapper div {
    font-size: 20px;
    color: #ffffffcf;
    text-shadow: -1px -1px 11px black;
}
.tree-pointer {
    width: 200px;
    height: 259px;
    position: fixed;
    background: url(/assets/images/tree-pointer-white.png);
    background-position: 0 top;
    background-size: contain;
    background-repeat-y: no-repeat;
    z-index: 9;
    bottom: 0;
    right: 40px;
    opacity: .8;
}
.tree-pointer:hover {
    opacity: 1;
}
.tree-clouds {
    margin-top: 50px;
    width: 1889px;
    height: 383px;
    position: absolute;
    background: url(/assets/images/tree/clouds2.png);
    background-position: 0 top;
    background-size: contain;
    background-repeat-y: no-repeat;
    opacity: 0;
    z-index: -1;
    -webkit-animation-name: cloud; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 450s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: -250s;
    animation-name: cloud;
    animation-duration: 450s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-delay: -250s;
    background-repeat: no-repeat;
    z-index: 1;
}
.tree-clouds-2 {
    margin-top: 250px;
    width: 1200px;
    height: 230px;
    opacity: 0;
    z-index: -1;
    position: absolute;
    background: url(/assets/images/tree/clouds.png);
    background-position: 0 top;
    background-size: contain;
    background-repeat-y: no-repeat;
    -webkit-animation-name: cloud; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 400s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: -100s;
    animation-name: cloud;
    animation-duration: 400s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-delay: -100s;
    background-repeat: no-repeat;
    z-index: 1;
}
.tree-clouds-3 {
    margin-top: 200px;
    width: 1500px;
    height: 500px;
    position: absolute;
    background: url(/assets/images/tree/clouds3.png);
    background-position: 0 top;
    background-size: contain;
    background-repeat-y: no-repeat;
    opacity: 0;
    z-index: -1;
    -webkit-animation-name: cloud; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 550s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: -300s;
    animation-name: cloud;
    animation-duration: 550s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-delay: -300s;
    background-repeat: no-repeat;
    z-index: 1;
}
.tree-clouds-4 {
    margin-top: 100px;
    width: 1500px;
    height: 700px;
    opacity: 0;
    z-index: -1;
    position: absolute;
    background: url(/assets/images/tree/clouds2.png);
    background-position: 0 top;
    background-size: contain;
    background-repeat-y: no-repeat;
    -webkit-animation-name: cloud; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 400s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: -50s;
    animation-name: cloud;
    animation-duration: 400s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-delay: -50s;
    background-repeat: no-repeat;
    z-index: 1;
}
.tree-clouds-5 {
    top: 500px;
    width: 1889px;
    height: 383px;
    position: absolute;
    background: url(/assets/images/tree/clouds2.png);
    background-position: 0 top;
    background-size: contain;
    background-repeat-y: no-repeat;
    opacity: 0;
    -webkit-animation-name: cloud; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 450s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: -250s;
    animation-name: cloud;
    animation-duration: 450s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-delay: -250s;
    background-repeat: no-repeat;
    z-index: 1;
}
.tree-clouds-6 {
    margin-top: 0px;
    width: 1500px;
    height: 300px;
    opacity: 0;
    z-index: 0;
    position: absolute;
    background: url(/assets/images/tree/clouds.png);
    background-position: 0 top;
    background-size: contain;
    background-repeat-y: no-repeat;
    -webkit-animation-name: cloud; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 400s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: -100s;
    animation-name: cloud;
    animation-duration: 400s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-delay: -100s;
    background-repeat: no-repeat;
    z-index: 1;
}
.developer .avatar {
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 3s;
    -moz-transition: opacity 3s;
    -o-transition: opacity 3s;
    transition: opacity 3s;
}
.news-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.news-image-wrapper {
    max-height: 130px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}
.news-image-wrapper img {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
}
.news-wrapper a {
    text-decoration: none;
    margin-bottom: 20px;
    padding: 0 40px;
    max-width: 40%;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes cloud {
    from {
        right: -1889px;
        opacity: 1;
    }
    to {
        right: 100%;
    }
}
/* Standard syntax */
@keyframes cloud {
    from {
        right: -1889px;
        opacity: 1;
    }
    to {
        right: 100%;
    }
}
.team-user-profile {
    margin: 20px 0 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #5a5a5a;
    overflow: hidden;

    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}
.team-user-profile:hover {
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
    -ms-transform: scale(1.03);
    -o-transform: scale(1.03);
    transform: scale(1.03);
}
.team-user-profile:last-of-type {
    border-bottom: none;
}
.team-user-picture img {
    width: 140px;
    float: left;
    margin: 11px 20px 0px 0;
}
.team-user-name {
    display: inline-block;
}
.team-user-name span {
    font-style: italic;
    font-size: 29px;
}
.team-user-title {
    display: inline-block;
}
.team-user-title {
    display: block;
    font-size: 25px;
}
.team-user-contact {
    display: block;
    font-size: 25px;
}
small {
    display: block;
    font-size: 10px;
    line-height: 0;
    margin-top: -5px;
}
.payPalButton:disabled, .payPalButton:disabled:hover {
    opacity: .7;
    background: #afd9e0;
    cursor: no-drop;
}
.billing_table .subscription-details-wrapper {
    padding-top: 30px;
    line-height: 19px;
    font-weight: 700;
    font-size: 17px;
}
.table.billing_table>thead>tr>th {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 18px;
    line-height: 19px;
    padding: 4px 7px;
    font-weight: 400;
}
.table.billing_table>thead>tr.subscription-description>th {
    text-align: center;
    border-bottom: none;
}
.billing_table .form-control {
    max-width: 214px;
    width: 100%;
}
.subscription-details-wrapper .subscription-titles {
    line-height: 30px !important;
}
.tax-notification, .subscription-titles {
    font-size: 17px;
    font-weight: 500;
}

.job-types-wrapper {
    margin-bottom: 80px;
    border-bottom: 1px solid black;
    padding-bottom: 70px;
}
.job-types-wrapper:last-of-type {
    border-bottom: none;
    padding-bottom: none;
    margin-bottom:0px;
}
.jobs-email {
    margin: 0 auto;
    text-align: center;
    margin-top: 50px;
    font-size: 25px;
    line-height: 35px;
}
.tax-notification-confirmation {
    margin: 20px;
    display: inline-block;
}
.fine-print-star {
    font-size: 18px;
    vertical-align: top;
    margin-left: 3px;
}
#paypal .tax-calculation {
    cursor: default;
    display: inline-block;
    width: auto;
    font-size: 19px;
    vertical-align: top;
}
.tree-intro-wrapper-sky {
    width: 30%;
    position: absolute;
    text-align: justify;
    left: 65%;
    top: 40px;
    font-size: 23px;
    line-height: 28px;
    color: white;
    text-shadow: 1px 1px 9px #3e3e3e;
    border-radius: 11px;
    padding: 20px 30px;
    overflow: hidden;
}
.tree-intro-wrapper-sky p {
    margin: 0 0 15px;
}
.tree-sidepanel .tree-comment-btn {
    margin: 30px auto 0px !important;
    text-align: center;
    display: block;
}
.tree-sidepanel p {
    margin: 15px 0 15px;
    line-height: 28px;
    font-size: 28px;
}
#disqus_thread {
    margin-top: 40px;
}
.tree-elk {
    height: 80px;
    width: auto;
    position: absolute;
    top: 710px;
    left: 1080px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    z-index: 99;
}
.hvr-buzz-out {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.hvr-buzz-out:hover, .hvr-buzz-out:focus, .hvr-buzz-out:active {
    -webkit-animation-name: hvr-buzz-out;
    animation-name: hvr-buzz-out;
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    animation-delay: 2s;
}
/* Buzz Out */
@-webkit-keyframes hvr-buzz-out {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }
    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }
    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }
    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }
    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }
    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }
    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }
    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }
    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }
    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}
@keyframes hvr-buzz-out {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }
    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }
    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }
    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }
    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }
    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }
    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }
    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }
    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }
    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}
.branches .node-active-1, .branches .node-progress-1, .tree-key-green .node-active-1 {
    filter: sepia(150%) saturate(130%) brightness(100%) hue-rotate(390deg);
}
.branches .node-active-2, .branches .node-progress-2, .tree-key-green .node-active-2 {
    filter: sepia(150%) saturate(350%) brightness(100%) hue-rotate(380deg);
}
.branches .node-active-3, .branches .node-progress-3, .tree-key-green .node-active-3 {
    filter: sepia(150%) saturate(270%) brightness(110%) hue-rotate(420deg);
}
.branches .node-active-4, .branches .node-progress-4, .tree-key-green .node-active-4 {
    filter: sepia(150%) saturate(360%) brightness(75%) hue-rotate(420deg);
}
.branches .node-active-5, .branches .node-progress-5, .tree-key-green .node-active-5 {
    filter: sepia(150%) saturate(390%) brightness(100%) hue-rotate(450deg);
}
.branches .node-active-0, .branches .node-progress-0, .tree-key-green .node-active-0, .tree-key-green .node-progress-0{
    filter: sepia(0%) saturate(0) brightness(90%) hue-rotate(390deg);
}
.roots .node-active-1, .roots .node-progress-1, .tree-key-brown .node-active-1 {
    filter: sepia(150%) saturate(130%) brightness(100%) hue-rotate(390deg);
}
.roots .node-active-2, .roots .node-progress-2, .tree-key-brown .node-active-2 {
    filter: sepia(150%) saturate(350%) brightness(100%) hue-rotate(380deg);
}
.roots .node-active-3, .roots .node-progress-3, .tree-key-brown .node-active-3 {
    filter: sepia(150%) saturate(270%) brightness(110%) hue-rotate(330deg);
}
.roots .node-active-4, .roots .node-progress-4, .tree-key-brown .node-active-4 {
    filter: sepia(150%) saturate(360%) brightness(75%) hue-rotate(330deg);
}
.roots .node-active-5, .roots .node-progress-5, .tree-key-brown .node-active-5 {
    filter: sepia(150%) saturate(390%) brightness(120%) hue-rotate(330deg);
}
.roots .node-active-0, .roots .node-progress-0, .tree-key-brown .node-active-0, .tree-key-brown .node-progress-0 {
    filter: sepia(0%) saturate(0) brightness(90%) hue-rotate(390deg);
}
.tree-key-brown .node-progress-5, .tree-key-green .node-progress-5  {
    filter: sepia(0%) saturate(0) brightness(130%) hue-rotate(390deg);
    margin-bottom: -7px;
    opacity: .8;
}
.branches div .branch-nodes-wrapper .node-progress-1, .roots div .root-nodes-wrapper .node-progress-1, .branches div .branch-nodes-wrapper .node-progress-2, .roots div .root-nodes-wrapper .node-progress-2, .branches div .branch-nodes-wrapper .node-progress-3, .roots div .root-nodes-wrapper .node-progress-3, .branches div .branch-nodes-wrapper .node-progress-4, .roots div .root-nodes-wrapper .node-progress-4, .branches div .branch-nodes-wrapper .node-progress-5, .roots div .root-nodes-wrapper .node-progress-5, .branches div .branch-nodes-wrapper .node-progress-6, .roots div .root-nodes-wrapper .node-progress-6, .branches div .branch-nodes-wrapper .node-progress-4, .roots div .root-nodes-wrapper .node-progress-7, .branches div .branch-nodes-wrapper .node-progress-8, .roots div .root-nodes-wrapper .node-progress-8, .branches div .branch-nodes-wrapper .node-progress-9, .roots div .root-nodes-wrapper .node-progress-9, .branches div .branch-nodes-wrapper .node-progress-0, .roots div .root-nodes-wrapper .node-progress-0, .tree-key-green .node-progress-5, .tree-key-brown .node-progress-5 {
    background: url(/assets/images/tree/node-inprogress.png);
    background-position: center top;
    background-repeat: no-repeat;
}
.node-label-active-1 {
    background: #c9d68a !important;
}
.node-label-active-2 {
    background: #c5d91f !important;
}
.node-label-active-3 {
    background: #7aff78 !important;
}
.node-label-active-4 {
    background: #40b833 !important;
}
.node-label-active-5 {
    background: #16ff8b !important;
}
.node-label-progress-1 {
    background: #c9d68a !important;
    border: 1px dashed #00000069 !important;
}
.node-label-progress-2 {
    background: #c5d91f !important;
    border: 1px dashed #00000069 !important;
}
.node-label-progress-3 {
    background: #7aff78 !important;
    border: 1px dashed #00000069 !important;
}
.node-label-progress-4 {
    background: #40b833 !important;
    border: 1px dashed #00000069 !important;
}
.node-label-progress-5 {
    background: #16ff8b !important;
    border: 1px dashed #00000069 !important;
}
.tree-exostar {
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 55px;
    height: 55px;
    position: absolute;
    opacity: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    z-index: 99;
}
.tree-exostar:hover {
    opacity: 0 !important;
    cursor: help;
}
.tree-exo {
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 25px;
    height: 25px;
    position: absolute;
    top: 14px;
    right: -40px;
    opacity: 0;
    -webkit-transition: all 4s ease;
    -moz-transition: all 4s ease;
    transition: all 4s ease;
    transition-delay: 1s;
    z-index: 98;
}
.tree-exostar:hover + .tree-exo {
    opacity: .7;
}
.news-wrapper .row {
    display: block;
    height: auto;
    overflow: hidden;
    margin-bottom: 30px;
}
.news-wrapper h4 {
    line-height: 33px;
    margin: 10px 0 2px;
    font-size: 30px;
}
.news-wrapper span {
    font-size: 18px;
    text-shadow: none;
    line-height: 23px;
    display: block;
}
.news-post-wrapper img {
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    max-width: 90%;
    width: auto;
    height: auto;
    margin: 20px auto;
    display: block;
}
.blog-post-wrapper iframe, .blog-post-wrapper video {
    -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    max-width: 90%;
    margin: 20px auto;
    display: block;
}
.news-post-wrapper #gallery {
    margin: auto;
    max-width: 50%;
}
.blog-intro {
    font-size: 30px;
    line-height: 38px;
    width: 80%;
    background: #afd9e0;
    padding: 0 20px;
}
.blog-post-wrapper {
    max-width: 90%;
    margin: 0 auto;
}
.news-post-wrapper section {
    margin-top: 40px;
}
.simplePullQuote {
    margin: 20px 0 20px 20px;
    letter-spacing: 1px;
    text-align: center;
    padding: 0px 0 0px 20px;
    float: right;
    width: 50%;
    font-size: 25px;
    font-family: 'Raleway', sans-serif;
    line-height: 39px;
}
tr.subscription-description {
    background: #dedede;
}
.table.billing_table>tbody>tr.subscription-description>th {
    border: none !important;
    text-align: center;
    font-size: 20px;
    line-height: 24px;
    vertical-align: middle;
}
.billing-top-row td {
    border-top: none !important;
}
.table.billing_table>tbody>tr>td {
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
}
.billing_table button {
    margin-top: 4px;
}
.items_table td {
    text-align: center;
    line-height: 30px !important;
}
.cropper-container {
    margin: 0 auto;
}
.permonth {
    font-size: 17px;
}
.account-feature-description {
    max-width: 80%;
}
.payment-popup {
    margin: 40px auto 20px;
    text-align: center;
}
.auto-resizable-iframe > div {
    position: relative;
    padding-bottom: 56.3%;
    height: 0px;
}
.auto-resizable-iframe iframe {
    position: absolute;
    top: -2px;
    left: -4px;
    width: 102%;
    height: 101%;
}
.swal2-popup, .datepicker {
    font-size: 1.5rem;
    font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.tree-dev-label {
    display: none;
    max-width: unset;
    width: max-content;
    background: #b2dca5;
    color: black;
    line-height: 13px;
    border-radius: 6px;
    padding: 5px 5px 0px;
    font-family: 'Abel', sans-serif;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    -webkit-box-shadow: none;
    box-shadow: none;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    z-index: 9;
    max-width: 240px;
}
.tree-dev-status, .tree-dev-title, .tree-dev-feature {
    text-align: left;
    font-weight: 500;
    line-height: 16px;
}
.tree-dev-feature {
    display:block;
    margin-top: 5px;
}

.tree-dev-feature div {
    display: inline-block;
}

.share {
    z-index: 999;
    display: inline-block;
    padding: 0;
    margin: 0;
    list-style-type: none;
    position: relative;
    line-height: 43px;
}
.share > i.fas, .share > i.fab {
    width: 30px !important;
    margin-left: 15px;
}
.share i.fas, .share i.fab {
    height: 50px;
    width: 50px;
    text-align: center;
    line-height: 50px;
    border-radius: 2px;
    cursor: pointer;
}
.share:hover .submenu li:nth-child(1) {
    opacity: 1;
    left: -50px;
    transition-delay: 0.08s;
}
.share:hover .submenu li:nth-child(2) {
    opacity: 1;
    left: -100px;
    transition-delay: 0.16s;
    border-right: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(3) {
    opacity: 1;
    left: -150px;
    transition-delay: 0.24s;
    border-right: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(4) {
    opacity: 1;
    left: -200px;
    transition-delay: 0.32s;
    border-right: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(5) {
    opacity: 1;
    left: -250px;
    transition-delay: 0.4s;
    border-right: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(6) {
    opacity: 1;
    left: -300px;
    transition-delay: 0.48s;
    border-right: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(7) {
    opacity: 1;
    left: -350px;
    transition-delay: 0.56s;
    border-left: 1px dashed #cccccc;
    border-right: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(8) {
    opacity: 1;
    top: 50px;
    transition-delay: 0.08s;
}
.share:hover .submenu li:nth-child(9) {
    opacity: 1;
    top: 100px;
    transition-delay: 0.16s;
    border-top: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(10) {
    opacity: 1;
    top: 150px;
    transition-delay: 0.24s;
    border-top: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(11) {
    opacity: 1;
    top: 200px;
    transition-delay: 0.32s;
    border-top: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(12) {
    opacity: 1;
    top: 250px;
    transition-delay: 0.4s;
    border-top: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(13) {
    opacity: 1;
    top: 300px;
    transition-delay: 0.48s;
    border-top: 1px dashed #cccccc;
}
.share:hover .submenu li:nth-child(14) {
    opacity: 1;
    top: 350px;
    transition-delay: 0.56s;
    border-top: 1px dashed #cccccc;
    border-bottom: 1px dashed #cccccc;
}
.share .submenu {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.share .submenu li {
    transition: all ease-in-out 0.25s;
    position: absolute;
    background: white;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
}
.share .submenu li a {
    color: #212121;
}
.share .submenu li a:hover i.fa {
    color: #fff;
}
.share .submenu li a:hover.clipboard i.fa {
    background-color: #b5b4b4;
}
.share .submenu li a:hover.facebook i.fa {
    background-color: #3b5999;
}
.share .submenu li a:hover.twitter i.fa {
    background-color: #55acee;
}
.share .submenu li a:hover.whatsapp i.fa {
    background-color: #29a628;
}
.share .submenu li a:hover.telegram i.fa {
    background-color: #47ADE6;
}
.share .submenu li a:hover.skype i.fa {
    background-color: #05ABF0;
}
.share .submenu li a:hover.email i.fa {
    background-color: #3490F3;
}
.share .submenu li a:hover.pinterest i.fa {
    background-color: #cb2027;
}
.share .submenu li a:hover.vk i.fa {
    background-color: #4B78A6;
}
.share .submenu li a:hover.okru i.fa {
    background-color: #F29000;
}
.share .submenu li a:hover.tumblr i.fa {
    background-color: #496779;
}
.share .submenu li a:hover.reddit i.fa {
    background-color: #F74300;
}
.share .submenu li a:hover.digg i.fa {
    background-color: #295C8D;
}
.share .submenu li a:hover.weibo i.fa {
    background-color: #CD4035;
}

.title-margin-bottom {
    margin-bottom: 35px;
}
.news-post-wrapper {
    margin-bottom: 50px;
}
section.footer {
    padding: 30px 0;
}
.footer-text {
    font-size: 27px;
    line-height: 40px;
    width: 62%;
    margin: 0 auto;
    text-align: justify;
}
.feature-box.notes {
    padding: 15px 40px;
}
.changelog h2, .changelog h3, .changelog h4 {
    margin-top: 40px;
    margin-bottom: 20px;
}
.changelog img {
    width: auto;
    max-width: 90%;
    margin: 10px auto;
    display: block;
}
.swal2-title p {
    font-size: 16px;
    margin-top: 0;
}
.tree-wrapper .tooltip .tooltip-inner {
    white-space: nowrap;
    background: #6fb35ad9;
    color: black;
    line-height: 21px;
    border-radius: 6px;
    border: 1px solid #00000069 !important;
    padding: 0 5px;
    font-family: 'Abel', sans-serif;
    font-size: 18px;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.tree-wrapper .tooltip .tooltip-arrow {
    border-top-color: #6fb35ad9;
}
#teacherUpdate {
    margin: 15px auto 10px;
}
.photo {
    width: 200px;
    float: none;
    cursor: pointer;
    max-width:93%;
    border-radius: 5px;
    overflow: hidden;
}
img#profimg {
    border-radius: 0;
    box-shadow: none;
}
.swal2-timer-progress-bar {
    background: #acdf8f !important;
}
.breadcrumbs {
    display: none !important;
}
.iconItem.grow {
    margin-right: 20px;
    float: left;
}
.iconItem img {
    box-shadow: none;
    -webkit-box-shadow: none;
}
#dbviewer_wrapper {
    line-height: 14px;
    font-size: 14px !important;
}
#dbviewer tr:nth-child(odd) {
    background: #f2f2f2;
}
#dbviewer_wrapper table.dataTable tbody td {
    padding: 5px 0;
    text-align: center;
    max-width: 280px;
    overflow: auto;
    white-space: nowrap;
}

/* Pulse */
@-webkit-keyframes hvr-pulse {
    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
}
@keyframes hvr-pulse {
    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
}
.hvr-pulse, .hvr-pulse, .hvr-pulse {
    -webkit-animation-name: hvr-pulse;
    animation-name: hvr-pulse;
    -webkit-animation-duration: 10s;
    animation-duration: 5s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.spin-fade {
    -webkit-animation-name: spin-fade;
    animation-name: spin-fade;
    -webkit-animation-duration: 30s;
    animation-duration: 30s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: reverse;
    animation-direction: reverse;
}
@-webkit-keyframes spin-fade {
    0% {
        -webkit-transform: rotate(0deg);
        opacity: 0;
    }
    90% {
        -webkit-transform: rotate(0deg);
        opacity: 0;
    }
    95% {
        opacity: .5;
    }
    100% {
        -webkit-transform: rotate(360deg);
        opacity: 0;
    }
}
@keyframes spin-fade {
    0% {
        transform: rotate(0deg);
        opacity: 0;
    }
    90% {
        transform: rotate(0deg);
        opacity: 0;
    }
    95% {
        opacity: .5;
    }
    100% {
        transform: rotate(360deg);
        opacity: 0;
    }
}
@-moz-keyframes spin {
    to {-moz-transform: rotate(360deg) scale(1.1);}
}
@-webkit-keyframes spin {
    to {-webkit-transform: rotate(360deg) scale(1.1);}
}
@keyframes spin {
    to {transform: rotate(360deg) scale(1.1);}
}
.spin {
    animation: spin 250ms ease-in-out;
}
.spin-slow {
    animation: spin 1000ms ease-in-out;
}
@media only screen and (max-width: 1680px) {
    p {
        font-size: 22px;
        line-height: 32px;
        margin-top: -8px;
    }
    .tree-intro-wrapper-sky p {
        line-height: 28px;
    }
    .extra-image {display: block;}
    .btn-corner {
        top: 14px;
    }
    .btn-corner .btn-small, .account-page .btn-small, .account-page .form-control {
        font-size: 19px;
        height: 30px;
        line-height: 17px;
        width: auto;
    }
    .account-form {
        top: 14px;
    }
}
@media only screen and (max-width: 1600px) {
    .testimonial-quote {
        font-size: 20px;
    }
}
@media only screen and (max-width: 1440px) {
    p {
        font-size: 19px;
        line-height: 27px;
        margin-top: -9px;
    }
    .intro-awards-1, .intro-awards-2, .intro-awards-3, .intro-awards-4, .intro-awards-5, .intro-awards-6, .intro-awards-7 {
        padding: 131px 5px 0px 0;
    }
    h1 {
        font-size: 43px;
    }
    h3 {
        font-size: 26px;
        line-height: 33px;
    }
    h4 {
        font-size: 30px;
        line-height: 31px;
    }
    .testimonial-quote {
        font-size: 19px;
        line-height: 25px;
        margin-top: 30px;
    }
    .testimonial-quotemarks {
        font-size: 74px;
    }
    .intro-awards-1, .intro-awards-2, .intro-awards-3, .intro-awards-4, .intro-awards-5, .intro-awards-6, .intro-awards-7 {
        margin: 0 5px 0;
    }
    .news-wrapper h4 {
        line-height: 30px;
        font-size: 24px;
    }
    .howitworks .sales-feature-wrapper {
        width: 29%;
    }
    .footer-text {
        font-size: 26px;
        line-height: 38px;
        width: 82%;
    }
    .social .btn, .footer .btn {
        padding: 0 20px;
        width: auto;
        font-size: 24px;
    }
    .social .form-control {
        width: 160px;
    }

}
@media only screen and (max-width: 1414px) {
    .tree-super-wrapper {
        zoom: .9;
        -moz-transform: scale(.9);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width:110%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .trailer-title {
        line-height: 40px;
    }
}
@media only screen and (max-width: 1366px) {
    .number {
        font-size: 60px;
        margin: 0 16px 0 0;
        padding: 0;
    }
    .membership-key li span {
        font-size: 16px;
        line-height: 20px;
    }
}
@media only screen and (max-width: 1280px) {
    p {
        font-size: 18px;
        line-height: 27px;
    }
    .tree-super-wrapper {
        zoom: .8;
        -moz-transform: scale(.8);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width:110%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .intro-awards-1, .intro-awards-2, .intro-awards-3, .intro-awards-4, .intro-awards-5, .intro-awards-6, .intro-awards-7 {
        margin: 0;
    }
    .intro-awards-1, .intro-awards-2, .intro-awards-3, .intro-awards-4, .intro-awards-5, .intro-awards-6, .intro-awards-7 {
        padding: 127px 5px 0px 0;
    }
    .footer .social-media-icon {
        margin: 0 0 0 4px;
    }
    .footer .form-control {
        font-size: 23px;
    }
}
@media only screen and (max-width: 1024px) {
    .sales section.row {
        margin-bottom:0px !important;
    }
    .testimonial-quote {
        display:none;
    }
    .testimonial-quote:last-of-type {
        float: none !important;
        margin: 40px auto;
        display: block;
        width: 60%;
    }
    .news-wrapper a {
        width: 100%;
        display: block;
        margin-bottom: 50px;
    }
    .row.news-wrapper {
        max-width: 70%;
        margin: 0 auto;
    }
    .news-wrapper a {
        max-height: inherit;
    }
    .title-margin-bottom {
        margin-bottom: 20px;
    }
    #worlds .inp_div {
        width: 25%;
    }
    #worlds input, #worlds select {
        width: 100% !important;
    }
    #worlds .valid_addons {
        display: none;
    }
}
@media only screen and (max-width: 991px) {
    .trailer-title {
        line-height: 20px;
        margin-top: 0px;
        float: left;
        margin-right: 10px;
    }
    .trailer-main {
        margin-bottom: 30px;
    }
    .buy-zone .membership-title {
        font-size: 17px;
    }
    .membership-logo {
        height: 80px;
        width: 80px;
    }
    .membership-title-wrapper {
        height: 181px;
    }
    .membership-description.membership-key {
        margin-top: 181px !important;
    }
    .footer-text {
        font-size: 22px;
        line-height: 29px;
        width: 82%;
    }
}
@media only screen and (max-width: 768px) {
    .citizen-description {
        display: none;
    }

    .extra-image {display: none;}
    .btn-corner {
        position: static;
        margin: 10px 0;
        display: block;
    }
}



@media only screen and (max-height: 1190px) {
    .tree-super-wrapper {
        zoom: .95;
        -moz-transform: scale(.95);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width:105%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 1115px) {
    .tree-super-wrapper {
        zoom: .9;
        -moz-transform: scale(.9);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width:110%;
        }
    }

    #disqus_thread iframe {
        zoom: 1.2;
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 1068px) {
    .tree-super-wrapper {
        zoom: .88;
        -moz-transform: scale(.88);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width: 114%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 1024px) {
    .tree-super-wrapper {
        zoom: .85;
        -moz-transform: scale(.85);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width:119%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 1013px) {
    .tree-super-wrapper {
        zoom: .83;
        -moz-transform: scale(.83);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width:122%;
        }
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 963px) {
    .tree-super-wrapper {
        zoom: .74;
        -moz-transform: scale(.74);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width: 136%;
        }
    }
    #disqus_thread iframe {
        zoom: 1.4;
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 898px) {
    .tree-super-wrapper {
        zoom: .75;
        -moz-transform: scale(.75);
        -moz-transform-origin: 0 bottom;
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}





@media only screen and (max-width: 1024px) {
    .tree-super-wrapper {
        zoom: .7;
        -moz-transform: scale(.7);
        -moz-transform-origin: 0 bottom;
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    #disqus_thread iframe {
        zoom: 1.6;
    }
}
@media only screen and (max-width: 1014px) {
    .tree-super-wrapper {
        zoom: .63;
        -moz-transform: scale(.63);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width: 166%;
        }
    }

    #disqus_thread iframe {
        zoom: 1.6;
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
}
@media only screen and (max-width: 900px) {
    .tree-sidepanel-wrapper {
        right: -100%;
    }
}
@media only screen and (max-width: 767px) {
    .tree-clouds, .tree-clouds-2, .tree-clouds-3, .tree-clouds-4, .tree-clouds-5, .tree-clouds-6 {
        display: none;
    }
}




@media only screen and (max-height: 848px) {
    .tree-super-wrapper {
        zoom: .65;
        -moz-transform: scale(.65);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width: 159%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 788px) {
    .tree-super-wrapper {
        zoom: .65;
        -moz-transform: scale(.65);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width: 172%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}
@media only screen and (max-height: 768px) {
    .tree-super-wrapper {
        zoom: .6;
        -moz-transform: scale(.6);
        -moz-transform-origin: 0 bottom;
    }
    @-moz-document url-prefix() {
        .tree-super-wrapper {
            width: 169%;
        }
    }
    .tree-key-green, .tree-key-brown, .tree-key-label {
        line-height: 28px;
    }
    .tree-intro-wrapper-sky {
        display:block;
    }
}




@media only screen and (max-aspect-ratio: 4/3) {
    .tree-wrapper {
        width: 95% !important;
    }
    .tree-intro-wrapper-sky {
        display: none !important;
    }
}








    /* Dark Theme */
    html.dark-theme, .dark-theme section.row, .dark-theme .modal-content, .dark-theme #contactFormModal .modal-content {
        background: #1b1b1b !important;
    }

    html.dark-theme.landingpage-html, .dark-theme.landingpage-html section.row, .dark-theme.landingpage-html .modal-content {
        background: none !important;
    }

    .dark-theme.landingpage-html body {
        background-color: #132434 !important;
        background-image: radial-gradient(white, transparent, transparent 5px), radial-gradient(white, transparent, transparent 2px), radial-gradient(white, transparent, transparent 4px), radial-gradient(rgba(255, 255, 255, 0.4), transparent, transparent 4px);
        background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px;
        background-position: 0px 0px, 40px 60px, 130px 270px, 70px 100px;
    }
.dark-theme .swal2-content, .dark-mode .swal2-title, .dark-mode #worlds input, .dark-mode #worlds select, .dark-theme .buy-zone a, .dark-theme body, .dark-theme .download-link a, .dark-theme .btn.focus, .dark-theme .btn:focus, .dark-theme .btn:hover, .dark-theme .help-block, .dark-theme .has-success .help-block, .dark-theme .custom_content label, .dark-theme .hosted-worlds-dash button, .dark-theme .footer a, .dark-theme .social a, .dark-theme .testimonial-quote a, .dark-theme .intro-awards-1, .dark-theme .intro-awards-2, .dark-theme .intro-awards-3, .dark-theme .intro-awards-4, .dark-theme .intro-awards-5, .dark-theme .intro-awards-6, .dark-theme .intro-awards-7 {
        color: #fff;
    }

.dark-theme .menu-wrapper a, .dark-theme .buy-zone a, .dark-theme a.btn, .dark-theme a.btn:hover, .dark-theme .buy-zone .highlight a:hover {
        color: #fff !important;
    }
.dark-theme .sub-features-wrapper .btn {
    color: #333 !important;
}
    .dark-theme .buy-zone a:hover {
        color: #21c8e3 !important;
        background: #42adbf66;
    }

    .dark-theme .membership-description li:nth-child(even) {
        background-color: #3939398c;
    }

    .dark-theme .main-menu-section.cloned {
        background: #1e1e1e;
    }

    .dark-theme.landingpage-html .menu-wrapper.cloned {
        background: url(/assets/images/textures/cubes.png) rgb(20 37 51) !important;
    }

    .dark-theme .form-control, .dark-theme input, .dark-theme select, .dark-theme textarea, .dark-theme .form-control[disabled], .dark-theme .form-control[readonly], .dark-theme fieldset[disabled] .form-control, .dark-theme .teach-dash .custom_content input,
    .dark-theme #contactForm .form-control, .dark-theme #contactForm input, .dark-theme #contactForm select, .dark-theme #contactForm textarea, .dark-theme #contactForm .form-control[disabled], .dark-theme #contactForm .form-control[readonly], .dark-theme #contactForm fieldset[disabled] .form-control {
        color: #fff;
        background-color: #181818;
        border: 1px solid #ccc;
    }

    .dark-theme.landingpage-html .form-control, .dark-theme.landingpage-html input {
        background-color: #192c3d;
        border: none;
    }

    .dark-theme .account-feature, .dark-theme .feature-box, .dark-theme .hosted-worlds-dash {
        background: #262626;
    }

    .dark-theme .plugin_title {
        background: #385c62;
        color: #fff;
    }

    .dark-theme .dropdown-hover .dropdown a {
        background: #262626;
        border-bottom: 1px solid #5c5c5c;
    }
    .dark-theme .dropdown-hover .dropdown a:hover {
        background: #3e3e3ef0 !important;
    }

    .dark-theme .btn, .dark-theme #contactFormModal .btn {
        background: rgba(123, 194, 206, 0.5882352941176471);
        border:none;
    }

    .dark-theme a, .dark-theme .main-menu-section a.active {
        color: #afdaff;
    }
    .dark-theme .login-forgot {
        color: #afdaff !important;
    }

    .dark-theme a:hover, .dark-theme a:focus {
        color: #55b1ff !important;
    }

    .dark-theme .citizen-game-download-wrapper-inner:hover {
        background: #353535;
    }

    .dark-theme .teach-dash-subtitle, .dark-theme tr.subscription-description {
        background: #414141;
    }

    .dark-theme .box-info-undertitle {
        color: #ffffff;
        background: none;
    }
    .dark-theme.landingpage-html section.row, .dark-theme .landingpage section.rowla {
        background: none !important;
    }

    .dark-theme .tree-super-wrapper {
        background: url(/assets/images/tree/bgbg-dark.jpg);
        background-position: 40px top;
        background-size: 2000px;
        background-repeat-y: no-repeat;
    }

    .dark-theme .tree-sidepanel section, .dark-theme .tree-update-wrapper, .dark-theme .tab-pane section {
        background: rgb(40 50 57);
        box-shadow: #00000047 0 10px 10px -5px;
        -webkit-box-shadow: #00000047 0 10px 10px -5px;
    }

    .dark-theme .sub-features-wrapper .btn.active, .dark-theme .sub-features-wrapper .btn.active:hover, .dark-theme .sub-features-wrapper .btn.active:active, .dark-theme .sub-features-wrapper .btn.active:focus {
        background: rgb(40 50 57) !important;
        color: white !important;
        font-weight: 500;
        border-bottom: 4px solid #ffffff26;
    }

    .dark-theme .sub-features-wrapper a.btn:hover {
        color: #333 !important;
    }

    .dark-theme .buy-zone .productContent.highlight {
        background: #303030;
    }


    .dark-theme .billing-totals-wrapper {
        background: #444 !important;;
    }

    .dark-theme .darkmode-title {
        color: #94e078 !important;
    }
    .dark-theme .close {
        text-shadow: 0 1px 0 #000;
    }
    .dark-theme .hosted-worlds-dash li:nth-child(odd) fieldset {
        background: #1c1c1c;
    }
.dark-theme .swal2-popup {
    background: #0a0a0a;
}
.dark-theme #loader {
    background: #000000;
    background-image: none;
}
.dark-theme section.subaccounts-wrapper {
    background: transparent !important;
}
.sales-feature-wrapper.cloud-hosting{
    display: flex;
    flex-direction: row;
    width: 100%
    ;margin: 0px auto;
    max-width: 1200px;
}
.license-information {
    text-align: center;
    margin: 10px 0px;
}
@media only screen and (max-width: 900px) {
    .sales-feature-wrapper.cloud-hosting{
        flex-direction: column;
    }
}