/* Default style (to review) */

body.exe-export {
    padding: 1em 0;
}

body.exe-web-site{
    padding: 0;
}

.exe-content a{
    color: #d76b4a;
}
.exe-content a:hover,
.exe-content a:focus{
    color: #993d28;
}

#node-content-container.exe-content #node-content{
    padding-top: 20px;
    padding-bottom: 20px;
    max-width: 1280px;
    margin: 0 auto;
    display: block;
}

.exe-content{
    color: #333;
    background-color: #fff;
}

.js .exe-export .exe-content{
    min-height: calc(100vh - 30px);
}

.js .in-iframe .exe-content{
    min-height: 0;
}

.exe-content .package-title{
    font-size: 1.25rem;
    font-weight: 300;
}

.exe-content .page-title{
    color: #078e8e;
    font-size: 1.7rem;
    text-align: left;
}

.exe-single-page .package-header h1{
    color: #333;
    font-size: 1.25rem;
    font-weight: 300;
    text-align: left;
    margin-bottom: 2em;
}

.exe-single-page .package-node{
    margin-bottom: 3.5em;
}

.exe-content .box{
    margin: 20px 0;
    border: none;
    background-color: #fff;
}

.exe-web-site .exe-content .box{
    margin: 40px 0;
}

.exe-content .box-head {
  border-bottom: 0;
}

#node-content-container.exe-content .box{
    border: 1px dotted #ddd;
}
#node-content-container.exe-content .box.hidden-idevices{
    border-style: solid;
}

.exe-content .box header{
    min-height: 60px;
}

.exe-content .box-title{
    color: #054d4d;
    font-size: 1.5rem;
}

.exe-content .box-head .exe-icon {
    float: left;
}

.exe-web-site .page-content,
#exe-client-search,
.exe-web-site main > header,
.exe-web-site #siteFooterContent,
.exe-export .exe-content
{
    max-width: 1280px;
    padding: 0 20px;
    margin: 0 auto;
}

.exe-web-site .exe-content{
    max-width: none;
    padding: 0;
}

.exe-export main{
    padding-top: 1.5em;
}
.exe-web-site main{
    padding-top: 4.5em;
}

/* siteNav */
#siteNav{
    float:left;
    background: #F6F6F6;
    border-right: 1px solid #F0F0F0;
    width:300px;
    padding-top: 66px;
    padding-left: 8px;
}
#siteNav:after{
    content:"";
    width:300px;
    height:100vh;
    background:#F6F6F6;
    position: absolute;
    left:0;
    border-right:1px solid #F0F0F0
}
#siteFooterExtra{
    margin-bottom:2em;
    color: #555;
    font-size: .95em;
}
#siteNav .other-section{
    display: none;
}
#sidebar-nav.fixed{
    position: fixed;
}
body.siteNav-off #siteNav{
    display: none;
}
.exe-web-site main.page{
    padding-top: 4.5em;
    padding-left: 320px;
    padding-right: 20px;
    /* min-height: calc(100vh - 300px); */
}
.exe-web-site #siteFooter{
    padding-left: 320px;
    padding-right: 20px;
}
body.siteNav-off main.page,
body.siteNav-off #siteFooter{
    padding-left: 20px;
}
#siteNav ul, #siteNav li{
    margin: 0;
    padding: 0;
    list-style: none;
}

#siteNav a{
    color: #000;
    display: block;
    padding: 8px 15px;
    border-radius: 8px;
    max-width: 280px;
    transition: background-color 0.5s ease;
}

#siteNav a.active{
    background: #fff;
    color: #d76b4a;
}

#siteNav a.package-link{
    color: #d76b4a;
    background: #EDEDED;
    margin-top: 10px;
}

#siteNav a.package-link:hover,
#siteNav a.package-link:focus{
    background: #FFF;
}

#siteNav a:hover{
    background: #F2F2F2;
    text-decoration: none;
}

#siteNav ul ul a{
    padding-left: 35px;
    font-size: .95em;
}

#siteNav ul ul ul a{
    padding-left: 55px;
    font-size: .9em;
}

#siteNav ul ul ul ul a{
    padding-left: 75px;
}
/* pagination */
.nav-buttons .nav-button,
button.toggler {
    position: fixed;
    top: 10px;
    left: 15px;
    display: block;
    width: 40px;
    height: 40px;
    background: #078e8e url(default_sprite.png) no-repeat 0 0;
    background-size: auto 40px;
    border-radius: 50%;
    z-index: 999;
    border: 0;
    transition: background-color 0.5s ease;
}
.nav-buttons span.nav-button{
    opacity: .5;
    filter: grayscale(1);
    cursor: not-allowed;
}
.nav-buttons .nav-button-left{
    background-position: -80px 0;
}
.nav-buttons .nav-button-right{
    background-position: -120px 0;
}
button#searchBarTogger{
    background-position: -40px 0;
    display: none;
}

.exe-search-on #searchBarTogger{
    display: inline;
}

button#siteNavToggler{
    left:280px;
}
button#searchBarTogger{
    left:330px;
}
body.siteNav-off button#siteNavToggler{
    left:65px;
}
body.siteNav-off button#searchBarTogger{
    left:115px;
}
.nav-buttons a:hover,
.nav-buttons a:focus,
button.toggler:hover,
button.toggler:focus {
    background-color: #066d6d;
    border-color: #066d6d
}
.nav-buttons .nav-button span,
.box-toggle span,
#exe-client-search-reset span,
#packageLicense .license-label {
    position: absolute;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px); 
}
.nav-buttons .nav-button-right{
    left: auto;
    right: 15px;
}
/* Box toggler */
.exe-export .box{
    position: relative;
}
.exe-export .box-toggle{
    width: 40px;
    height: 40px;
    background: url(default_sprite.png) no-repeat -200px 0;
    background-size: auto 40px;
    border-radius: 50%;
    border: 0;
    position: absolute;
    top: 0;
    right: 0;
    opacity: .6
}
.exe-export .box-head:hover .box-toggle,
.exe-export .box-toggle:focus{
    opacity: 1
}

.exe-export .no-header .box-toggle{
    top: -10px;
}

.exe-export .minimized .box-toggle{
    background-position: -160px 0;
}

#node-content-container.exe-content .box-head .exe-icon {
    width: 60px;
    height: 60px;
    font-size: 40px;
}

#node-content-container.exe-content .box-head .exe-icon img{
    height: 40px;
}

.exe-export .box-icon img{
    display: block;
    float: left;
    margin-right: 10px;
}

.exe-export .box-icon img{
    width: 40px;
    height: auto;
}

.exe-export .box-title {
    padding-top: 5px;
}

.exe-export .box.minimized .box-head{
    border-bottom: 1px solid #ddd;
}

.exe-export .box.no-header.minimized .box-head{
    border-color: #fff;
}

.exe-export .box .box-content{
    background: #f9f9f9;
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 8px;
    overflow: auto;
}

.exe-export .box.no-header .box-content{
    background: none;
    border: none;
    padding: 20px 0;
}
/* Search bar */
#exe-client-search{
    display: none;
    margin-bottom: 30px;
}
#exe-client-search-text {
    max-width: 80%;
    max-width: calc(100% - 90px);
    display: inline;
}
#exe-client-search-submit {
    text-indent: -999em;
    background: #078e8e url(default_sprite.png) no-repeat -41px -1px;
    background-size: auto 40px;
    width: 38px;
    height: 38px;
    border: none;
    border-radius: 4px
}
#exe-client-search-reset.visible {
    background: url(default_sprite.png) no-repeat -242px -1px;
    background-size: auto 40px;
    width: 38px;
    height: 38px;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -3px;
    left: -5px;
    opacity: .6;
    border-radius: 4px
}
#exe-client-search-reset:hover,
#exe-client-search-reset:focus{
    opacity: 1;
}
#exe-client-search-submit:hover,
#exe-client-search-submit:focus{
    background-color: #066d6d;
}
#exe-client-search-results-list ul,
#exe-client-search-results-list li{
    margin:2em 0;
    padding:0;
    list-style:none;
}
#exe-client-search-results-list li{
    margin:0 0 1em 0;
}
#exe-client-search-results-list p{
    margin-top: 2em;
}

/* Licenses */
#packageLicense{text-align:left;font-size:.9em;color:#555;line-height:1em;margin:2.5em 0 2em 0;border:1px solid transparent;border-radius:2px}
#packageLicense p{margin:0}
#packageLicense a{color:#666;text-transform:capitalize;display:inline-block;white-space:nowrap;text-overflow: ellipsis;max-width:100%;overflow:hidden;line-height:15px}
#packageLicense a:hover,
#packageLicense a:focus{text-decoration:none;color:#d76b4a}
#packageLicense.propietary{position:absolute;overflow:hidden;clip:rect(0,0,0,0);height:0}
#packageLicense.cc{padding:0 20px 0 90px;background:url(default_licenses.gif) no-repeat 0 0}
#packageLicense.cc-by-sa{background-position:0 -100px}
#packageLicensea.cc-by-nd{background-position:0 -200px}
#packageLicense.cc-by-nc{background-position:0 -300px}
#packageLicense.cc-by-nc-sa{background-position:0 -400px}
#packageLicense.cc-by-nc-nd{background-position:0 -500px}
#packageLicense.cc-0{background-position:0 -600px}


/* iDevice buttons */
.exe-content .iDevice_buttons input{
    background: #fff;
    color: #555;
    border: 1px solid #ccc;
    padding: 4px 10px;
    border-radius: 4px;
    transition: 0.5s ease;
}
.exe-content .iDevice_buttons input:hover,
.exe-content .iDevice_buttons input:focus{
    box-shadow: 2px 2px 4px #dbdbdb;
    color: #000;
    border-color: #bbb
}

/* Page counter */
.page-counter{text-align:right}
.page-counter{margin:0 0 .5em 0;font-size:.9em;color:#777;font-weight:300;background:#fff}
.page-counter .page-counter-sep{margin:0 .1em}
.exe-web-site .page-counter{position:fixed;top:18px;right:70px;margin:0;font-size:.9em;color:#777;padding:0 8px; border-radius: 4px;text-align:left}

/* Teacher mode */
#teacher-mode-toggler.form-check-input:checked{background-color:#078e8e;border-color:#078e8e;font-size:.9em;margin-right:.6em}
label[for='teacher-mode-toggler']{font-size:.9em;color:#777;position:relative;top:-.2em}

/* Bootstrap buttons */
.exe-content .btn-primary{
    background-color: #066D6D;
    border-color: #066D6D;
}
.exe-content .btn-primary:hover,
.exe-content .btn-primary:focus{
    background-color: #078E8E;
    border-color: #078E8E;
}

/* Responsive design */
@media (max-width: 767.98px) {
    #siteNav,
    #siteNav:after{
        width: 255px;
    }
    #siteNav a{
        max-width: 230px;
    }
    button#siteNavToggler{
        left:230px;
    }
    button#searchBarTogger{
        left:280px;
    }
    .exe-web-site main.page,
    .exe-web-site #siteFooter {
        padding-left: 270px;
    }
}

@media (max-width: 575.98px) {
    #siteNav{
        width: 100%;
        float: none;
        padding: 68px 10px 20px 10px;
        min-height: 0!important;
        height: auto!important;
    }
    #siteNav:after{
        display: none;
    }
    body.exe-web-site main.page{
        padding-top: 2.5em;
        padding-left: 0;
    }
    body.exe-web-site #siteFooter{
        padding-left: 0;
    }
    .exe-web-site.siteNav-off main.page{
        padding-top: 5.5em;
    }
    .nav-buttons .nav-button,
    button.toggler{
        position: absolute;
    }
    #siteNav a{
        max-width: 100%;
    }
    #sidebar-nav.fixed{
        position: relative;
    }
    button#siteNavToggler{
        left: 65px;
    }
    button#searchBarTogger{
        left: 115px;
    }
    .exe-web-site .page-counter{
        background: none;
        position: absolute;
    }
    .exe-web-site .page-counter .page-counter-label{
        position: absolute;
        clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
        clip: rect(1px, 1px, 1px, 1px); 
    }
}

@media print {
    /* Node in new page: section.package-node{page-break-after:always} */
    html body{background:#fff}
    .exe-content{color:#000;padding:0}
    @page{margin:1.5cm}
    /* Uncomment this to print URL after links:
    a{font-weight:bolder;text-decoration:none!important}
    a[href^=http]:after{content:" <" attr(href) "> "}
    */
    body #header,body #emptyHeader,body #nodeDecoration{height:auto!important;min-height:0;border:none;padding:0}
    body #headerContent{padding-top:40px}
    #packageLicense.cc{background:none;padding-left:0}
    .exe-export .box-toggle{display:none}
    /* Website */
    .exe-web-site #siteNav,
    .exe-web-site .nav-buttons,
    .exe-web-site button.toggler{display:none}
    .exe-web-site #siteFooter,
    .exe-web-site main.page{padding-left: 0;padding-right: 0}
    .exe-web-site main.page{padding-top:1em}
}