/*
	Appreciate Mr Ondrej Svestka
	https://bootstrapious.com/p/bootstrap-sidebar
*/

body {
    background: #fafafa;
}

p {
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #999;
}

a,
a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}


/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

#sidebar {
    width: 15.625rem;
    position: fixed;
    top: 5rem;
    left: -15.625rem;
    height: 100vh;
    z-index: 999;
    background: #7386D5;
    color: #fff;
    transition: all 0.3s;
    overflow-y: scroll;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}

#sidebar.active {
    left: 0;
}

#dismiss {
    width: 2.18rem;
    height: 2.18rem;
    line-height: 2.18rem;
    text-align: center;
    background: #7386D5;
    position: absolute;
    top: calc(100% * 0.7);
    right: -2.18rem;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#dismiss:hover {
    background: #fff;
    color: #7386D5;
}

.overlay {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    z-index: 998;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}
.overlay.active {
    display: block;
    opacity: 1;
}

#sidebar .sidebar-header {
    padding: 1.25rem;
    background: #6d7fcc;
}

#sidebar ul.components {
    padding: 1.25rem 0;
    border-bottom: 1px solid #47748b;
}

#sidebar ul p {
    color: #fff;
    padding: 0.625rem;
}

#sidebar ul li a {
    padding: 0.625rem;
    font-size: 1.1em;
    display: block;
}
.article-div {
    padding: 0.625rem;
    font-size: 1.3em;
    display: block;
    font-style:italic;
}


#sidebar ul li a:hover {
    color: #7386D5;
    background: #fff;
}

#sidebar ul li.active>a,
a[aria-expanded="true"] {
    color: #fff;
    background: #6d7fcc;
}

a[data-toggle="collapse"] {
    position: relative;
}
/* -------------------------------------------------
deprecate 
.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 1.25rem;
    transform: translateY(-50%);
}
---------------------------------------------------*/
ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #6d7fcc;
}

ul.CTAs {
    padding: 1.25rem;
}

ul.CTAs a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 0.3125rem;
    margin-bottom: 0.3125rem;
}

a.download {
    background: #fff;
    color: #7386D5;
}

a.article,
a.article:hover {
    background: #6d7fcc !important;
    color: #fff !important;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
    width: 100%;
    padding: 1.25rem;
    min-height: 100vh;
    transition: all 0.3s;
    position: absolute;
    top: 3.5rem;
    right: 0;
}
/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */

@media (max-width: 576px) {
    #sidebar {
       width: 11rem;
       left: -11rem;	
    }
}
/* ------- common -- */
@media (min-width: 1250px){
 .container { max-width: 1920px }
 .fix-lg-h { min-height: 45rem}
}
.aap-flex{display: flex;flex-wrap: wrap;justify-content: space-around;align-items: center;align-content: center;}
.axis--x path { display: none;}
.bar { fill: steelblue; }
.bar:hover { fill: brown; }
.dinline{display:inline-block}
.fixed-bottomR {position: fixed;right: 1rem;bottom: 0;z-index: 1030;}
.h-13r {height:13rem}
.h-20r {height:20rem}
.h-30r {height:30rem}
.h-33r {height:33rem}
.ha-30r {max-height:30rem}
.ha-40r {max-height:40rem}
.list-gallery {display:flex;flex-flow:row wrap;justify-content:center;}
.overFlowAuto{overflow:auto}
.overFlowHidden{overflow:hidden}
.overlay {
        display: none;
        position: fixed;
        /* full screen */
        width: 100vw;
        height: 100vh;
        /* transparent black */
        background: rgba(0, 0, 0, 0.7);
        /* middle layer, i.e. appears below the sidebar */
        z-index: 9998;
        opacity: 0;
        /* animate the transition */
        transition: all 0.5s ease-in-out;
        text-align: center;
}
     /* display .overlay when it has the .active class */
.overlay.active {
        display: block;
        opacity: 1;
}
.pos-center{margin-top: calc(100% / 5)}
.text-blue {color:blue}
.text-green {color:green}
.text-red {color:red}
.w-3r {width: 3rem}
.w-4r {width: 4rem}
.w-5r {width: 5rem}
.w-6r {width: 6rem}
.w-7r {width: 7rem}
.w-8r {width: 8rem}
.w-9r {width: 9rem}
.w-10r {width:10rem}
.w-13r {width:13rem}
.w-14r {width:14rem}
.w-33r {width:33rem}
.wa-14r {max-width:14rem}
.cursor-pointer{cursor:pointer}
.bg-sidebar{background: #7386D5}
.fLogo{position:fixed;top: calc(100% * 0.5);;right:1px;z-index:5000;max-height:50px;cursor:pointer;opacity:0.6}