* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-text-size-adjust:none;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.15) rgba(0,0,0,0);
    outline:none;
    box-sizing: border-box;
    font-family: 'Poppins', tahoma, helvetica;
}

::-webkit-input-placeholder { color:#ccc; font-weight: 400; }
:-moz-placeholder { color:#ccc; font-weight: 400; }
::-moz-placeholder { color:#ccc; font-weight: 400; }
:-ms-input-placeholder { color:#ccc; font-weight: 400; }

::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { }
::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.15); }

h1, h2, h3, h4 { margin:0; }
h1 { font-size:28px; font-weight: 500; color:#096cb8; }
h2 { font-size:16px; font-weight: 500; margin:10px 0; color:#212830; }
h3 { font-size:14px; font-weight: 500; color:#212830;}
h4 { font-size:14px; font-weight: 300; margin:5px 0; color:#acadb2; }
p { margin:0; }
hr { height:0; border:0; border-top:1px solid rgba(0,0,0,.15); margin:13px 0; }
.fadeInQueue { opacity: 0; }
.clear {clear:both;}
.hidden { display:none; }
.relative { position: relative; }
.inline { display:inline;}
.block { display:block; }
.faded { opacity: .5};
.clickable { transition: all .3s ease-in-out; }
.clickable:active, .clickable:active .item { cursor:pointer; opacity: .75; }
.spacer { height:10px; }

.bigspacer { height:24px; }
.separator {
    height: 16px;
    background: linear-gradient(to bottom, rgba(0,0,0,.033) 0%, rgba(0,0,0,0) 100%);
    margin-left: -24px;
    margin-right: -24px;
    position: relative;
}

.separator:before, .separator:after { content:''; width:50px; height:16px; position: absolute; top:0; }
.separator:before { left:0; background:linear-gradient(to right, rgba(249,249,249,1) 0%, rgba(249,249,249,0) 100% ); }
.separator:after { right:0; background:linear-gradient(to left, rgba(249,249,249,1) 0%, rgba(249,249,249,0) 100% ); }

.display { display:block; margin-bottom:16px; font-weight: 600;}
.padding { padding:16px; }
.sidepadding { padding-left:16px; padding-right:16px; }
.hcenter { text-align: center; }
.centered { margin:0 auto; }
.badge { display:inline-block; margin:0 5px 5px 0; background:#096cb8; font-weight: 600; font-size:12px; text-transform: capitalize; color:#fff; padding:5px 12px; height:28px; border-radius:14px; }

html { height:100%; -ms-overflow-style: -ms-autohiding-scrollbar; }
body {
    background:linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
    background-size: cover;
    height:100%;
    padding:0;
    margin:0;
    overflow:hidden;
    font-size: 14px;
}

.app { width:100%; height:100%; }
.main, .garbage { width:100%; height:100%; overflow:hidden; }
.main.hiddenscroll view::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,0); }
.panes {}

/* Content */
.content { padding:16px 0; color:#333; max-width: 1024px; margin:0 auto; }
.content a { color:#333; }

/* Buttons */
button {
    cursor:pointer;
    transition: opacity .3s ease-in-out;
    background:#096cb8;
    color:#fff;
    border:0;
    font-size:14px;
    text-transform: uppercase;
    font-weight: 600;
    padding:0 16px;
    height:48px;
    border-radius:10px;
    display:block;
    font-family: 'Poppins';
}
button:disabled { opacity: .25; }
button.centered { margin:0 auto; }
button.fullwidth { width:100%; }

button:active { background:#035b9e; }

/* Inputs */
input { display:block; width:100%; height:48px; padding:0 15px; border:0; background:rgba(0,0,0,.05); border-radius:10px; font-weight: 400; }
textarea, .trumbowyg-editor { display:block; width:100%; padding:10px; border:0; background:rgba(0,0,0,.05); border-radius:10px; font-weight: 400; }

/* Autocomplete styles in Chrome*/
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:active,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus,select:-webkit-autofill:active { -webkit-animation: autofill 0s forwards; animation: autofill 0s forwards; }
@keyframes autofill { 100% { background: rgba(0,0,0,.05); color: inherit; } }
@-webkit-keyframes autofill { 100% { background: rgba(0,0,0,.05); color: inherit; } }

/* Slick */
.slick-list, .slick-track { touch-action:pan-y !important; }
.slick, .panes { height:100%; }
.slick-track { height:100%; }
.slick-slide { padding:0px; }

/* Box */
.box { background: #fff; padding:24px; margin:0; border-radius: 10px; box-shadow: 0 0 128px 0 rgba(0,0,0,.025); }

/* Breadcrumbs */
.breadcrumbs { margin-bottom:15px; font-size:12px;
    white-space: nowrap;
    overflow: hidden;
      /* "overflow" value must be different from "visible" */
    text-overflow: ellipsis;
    /* direction: rtl;     */
}
.breadcrumbs a { color: #096cb8; font-weight: 600; text-decoration: none; }


/* Lists */
ul.list { background: #fff; list-style: none; padding:0; margin:0; border-radius: 10px; }
ul.list li { padding:0 10px; border-radius:10px; }
ul.list li .item { display:table; width:100%; cursor:pointer; user-select: none; background:#fff; padding:16px; border-bottom:1px solid #eee; }
ul.list li .item .icon { display:table-cell; vertical-align:middle; padding:0 26px 0 4px; width:1px; }
ul.list li .item .desc { display:table-cell; vertical-align:middle; font-size:12px; color:#aaa; font-weight: 600; }
ul.list li .item .desc p { font-weight: 600; margin:0; font-size:14px; color:#666; }
ul.list li .item .desc span { padding-top:5px; display: inline-block; }
ul.list li:last-child .item { border-bottom:0; }

ul.list.folders { list-style: none; padding:0; margin:0; background:none; }
ul.list.folders li { display:inline-block; width:20%; vertical-align: top; padding:0 20px 20px 0; }
ul.list.folders li .item { overflow:hidden; position: relative; width:100%; height:100%; display: inline-block; color:#fff; cursor:pointer; user-select: none; border-radius:10px; border:0; background:linear-gradient(to bottom, rgba(0,0,0,.03) 0%, rgba(0,0,0,.05) 100%); background-size:cover; box-shadow: 0 1px 0 0 rgba(0,0,0,.15); }
ul.list.folders li .item:before {
  content: '';
  display: block;
  padding-top: 100%;
  float: left;
}

ul.list.folders li .item:after {
    content:'';
    width:100%;
    height:100%;
    background:radial-gradient(circle at top left, rgba(255,255,255,.25) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,0) 66%, rgba(0,0,0,.1) 100% );
    position: absolute;
    top:0;
    left:0;
}

ul.list.folders li .item .icon { position: absolute; bottom:-64px; left:-28px; font-size:150px; color:rgba(0,0,0,.03); }
ul.list.folders li h2 { margin-bottom: 0; font-size:16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
ul.list.folders li h4 { margin-top: 0; margin-bottom:10px; }

/* Top */
.navigation { position: absolute; background:rgba(255,255,255,0); border-bottom: none; border-color: #fff; width:100%; height:74px; top:0; left:0; padding:16px 0; z-index:100; display:none; }
.navigation.fixed { background: #fff; border-bottom:1px solid #eee; transition: border .3s ease-in-out, box-shadow .3s ease-in-out; box-shadow: 0 10px 32px 0 rgba(0,0,0,.1); }
.navigation .title { color:#096cb8; font-weight: 600; line-height: 42px; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding:0 64px; }
.navigation button { position: absolute; top:16px; width:42px; height:42px; font-size:20px; background: none; padding:0; color:#096cb8; }
.navigation button.backbtn { left:12px; }
.navigation button.menubtn { right:12px; }

.navigation button.menubtn:after {
    content:'\f142';
    font-family: 'FontAwesome';
    font-weight: 400;
}

.sidr-menu-open .navigation button.menubtn:after {
    content:'\f142  \f0da';
}

/* Search */
.search_wrap {
    position: fixed;
    top: 0;
    padding: 16px;
    width: 100%;
    height: 100%;
    background:radial-gradient(circle at center, #096cb8 0%, #096cb8 50%, rgba(0,0,0,0) 50%);
    background-position: center center;
    background-size:100%;
    color: #fff;
    z-index: 100;
}
.search_wrap.fill {
    -webkit-animation: circlefill 0.6s ease-in-out both; animation: circlefill 0.6s ease-in-out both;
}

.search_wrap.unfill {
    -webkit-animation: circleunfill 0.2s ease-in-out both; animation: circleunfill 0.2s ease-in-out both;
}
.search_wrap button { color:#fff; position: absolute; top:16px; right:12px; width:42px; height:42px; font-size:14px; background: none; padding:0; }
.search_wrap>.title {
    color: #fff;
    font-weight: 600;
    line-height: 42px;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0 64px;
    margin-bottom:16px;
}
.search_wrap .search input {
    color: #fff;
    padding: 15px;
    height: 56px;
    background: rgba(0,0,0,.05);
    box-shadow: inset 0 0 20px 0 rgba(0,0,0,.07);
    border-top: 1px solid rgba(0,0,0,.1);
    border-bottom: 1px solid rgba(255,255,255,.1);
}

.search_wrap .search input::-webkit-input-placeholder { color:rgba(255,255,255,.5); }
.search_wrap .search input:-moz-placeholder { color:rgba(255,255,255,.5); }
.search_wrap .search input::-moz-placeholder { color:rgba(255,255,255,.5); }
.search_wrap .search input:-ms-input-placeholder { color:rgba(255,255,255,.5); }

.search { position: relative; width:100%; max-width: 1024px; margin:0 auto; }
.search input { color:#096cb8; padding:15px; height:56px; background:#fff; box-shadow: 0 0 64px 0 rgba(0,0,0,.07); border-bottom:1px solid rgba(0,0,0,.1); }

.search_results { user-select: none; left:0; width:100%; z-index: 99; list-style: none; padding:10px 0; margin:0; overflow:auto; }
.search_results li { padding:10px 15px; cursor:pointer; }
.search_results li:nth-child(even) { background:rgba(0,0,0,.05); border-radius: 10px; }
.search_results li:last-child { border-bottom:0; }
.search_results li.focused { background:rgba(255,255,255,.05); border-radius: 8px;}
.search_results li .title { padding: 2px 0 8px 0; }
.search_results li .badge { background:#fff; color:#096cb8; font-size:10px; padding: 5px 10px; height: 24px; border-radius: 12px; }

.search_results.noresults { display:table; width:auto; margin:32px auto; }
.search_results.noresults>div { display:table-cell; vertical-align: top; padding:5px; }
.search_results.noresults>div i { font-size:96px; }
.search_results.noresults>div h1 { font-size:22px; color:#fff; margin-top:0; }
.search_results.noresults>div p { font-size:12px;}

.search_help { display:table; margin:32px auto; }
.search_help>div { display:table-cell; vertical-align: top; padding:5px; }
.search_help>div i { font-size:96px; }
.search_help>div h1 { font-size:22px; color:#fff; margin-top:0; }
.search_help>div p { font-size:12px;}

/* View */
view { width:100%; height:100%; display:block; position: relative; margin:0 auto; padding:80px 24px 24px 24px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    backface-visibility: hidden;
}
view .wallpaper { width:calc(100% + 48px); height:50%; margin:0 -24px; position: relative; overflow:hidden; }
view .wallpaper .pattern { width:100%; height:100%; position: absolute; z-index:0; background:rgba(255,255,255,.75); }

    /* Article */
    view.article .content { display:table; width:100%; padding:0;}
    view.article h2 { width:100%; max-width: 1024px; margin:0 auto 32px auto; font-size: 24px; line-height: 1.2em; position: relative; }
    view.article h2:after {
        content: '';
        position: absolute;
        bottom: -16px;
        left: 0;
        width: 50px;
        height: 4px;
        background: #096cb8;
    }

    view.article .content .author { color:888; margin-top:5px; }

    view.article .content .body { display:table-cell; vertical-align: top; padding:0 32px 0 0; }
    view.article .content .images { display:table-cell; vertical-align: top; width:25%; padding-left:24px;  }
    view.article .content .images .box { padding:0; margin-bottom:24px; }
    view.article .content .images .box p { padding:10px 16px; margin:0; display:block; font-size:12px; font-style: italic; color:#555; }
    view.article .content .images .image { width:100%; display: inline-block; height:auto; background-repeat: no-repeat; background-position: center center; background-size:cover; border-top-left-radius: 5px; border-top-right-radius: 5px; vertical-align: bottom; }
    view.article .content .images .image:before {
      content: "";
      display: block;
      padding-top: 56.25%;
      float: left;
    }

    view.article .content .body .text { line-height: 1.5rem; }

    /* Edit article */
    view.editarticle .content { display:table; width:100%; padding:0;}
    view.editarticle h2 { width:100%; max-width: 1024px; margin:0 auto 32px auto; font-size: 24px; line-height: 1.2em; position: relative; }
    view.editarticle h2:after {
        content: '';
        position: absolute;
        bottom: -16px;
        left: 0;
        width: 50px;
        height: 4px;
        background: #096cb8;
    }

    view.editarticle label { display:block; margin:5px 0; text-transform: uppercase; font-size:11px; font-weight: 600; }
    view.editarticle .content .body { display:table-cell; vertical-align: top; padding:0 32px 0 0; }
    view.editarticle .content .body .text { line-height: 1.5rem; }
    view.editarticle .images { list-style: none; padding:0; margin:0; background: rgba(0,0,0,.05); padding:0 0 10px 0; border-radius: 5px; }
    view.editarticle .images:after { content:''; clear: both;}
    view.editarticle .images li {
        display:inline-block;
        vertical-align: top;
        width:160px;
        height:100px;
        line-height:100px;
        margin:10px 0 0 10px;
        border-radius: 5px;
        position: relative;
    }
    view.editarticle .images li .options {
        display:none;
        position: absolute;
        width:100%;
        height:100%;
        top:0;
        left:0;
        text-align: center;
    }

    view.editarticle .images li .options>div {
        width:50%;
        height:100%;
        display: inline-block;
    }

    view.editarticle .images li .options>div.cancel {
        background:#f1f1f1;
        color:#222;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    view.editarticle .images li .options>div.delete {
        background:#cc0000;
        color:#fff;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }

    view.editarticle .images li.showOptions .options { display:block; }


    view.editarticle .images .uploadbtn {
        display:inline-block;
        vertical-align: top;
        width:100%;
        height:100px;
        border-radius: 5px;
        font-size:12px;
        font-weight: 700;
        text-align: center;
        background:#096cb8;
        color:#fff;
        cursor:pointer;
    }
    view.editarticle .images .uploadbtn i { font-size: 32px; line-height:100px; }
    view.editarticle .images .item { background-size:cover; background-position: center center; }

    /* Login */
    view.login { width:100%; height:100%; max-width: 100%; padding-top:0; }
    view.login .wallpaper video {
        position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);
        min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -1; overflow: hidden;
        filter:grayscale(100%);
    }
    view.login .content { width:100%; height:50%; padding:32px 0 32px 0; position: relative;}
    view.login .logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 320px; height: 200px; background: url('/_img/logo.png') no-repeat center center; background-size: contain; }
    view.login .loginform { width:100%; max-width:480px; margin:0 auto; }
    view.login .loginform:before, view.login .loginform:after {
        font-family: 'FontAwesome';
        font-size:32px;
        color:#fff;
        background:#096cb8;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        left:50%;
    }

    view.login .loginform:before { z-index:1; content: ''; width: 72px; height: 72px; top: -36px; margin-left: -36px; animation: ping 1s ease-in-out infinite both; }
    view.login .loginform:after { z-index:2; content: '\f02d'; width:64px; height:64px; line-height: 64px; margin-left:-32px; top:-32px; }
    view.login .loginform label { display:inline-block; margin:5px 0; text-transform: uppercase; font-size:11px; font-weight: 600; }
    view.login .loginform button { margin-top:20px; }

    /* Offline */
    view.offline { width:100%; height:100%; max-width: 100%; padding-top:0; }
    view.offline .wallpaper { background: url('/_img/offline.jpg') no-repeat center center; background-size: cover; filter:grayscale(100%); }
    view.offline .logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 200px; height: 200px; background: url('/_img/logo.png') no-repeat center center; background-size: contain; }
    view.offline .content { width:100%; height:50%; background: #fff; padding:32px; position: relative;}
    view.offline .content>div { max-width: 640px; margin:0 auto; }
    view.offline .content:before, view.offline .content:after {
        font-family: 'FontAwesome';
        font-size:32px;
        color:#fff;
        background:#096cb8;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        left:50%;
    }
    view.offline .content:before { z-index:1; content: ''; width: 72px; height: 72px; top: -36px; margin-left: -36px; animation: ping 1s ease-in-out infinite both; }
    view.offline .content:after { z-index:2; content: '\f1eb'; width:64px; height:64px; line-height: 64px; margin-left:-32px; top:-32px; }

    /* Startup */
    view.startup { width:100%; height:100%; max-width: 100%; padding-top:0; }
    view.startup .wallpaper video {
        position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);
        min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -1; overflow: hidden;
        filter:grayscale(100%);
    }
    view.startup .content { width:100%; height:50%; padding:32px 16px; position: relative; text-align: center; padding-top:64px; }
    view.startup .logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 200px; height: 200px; background: url('/_img/logo.png') no-repeat center center; background-size: contain; }
    view.startup .content:before, view.startup .content:after {
        font-family: 'FontAwesome';
        font-size:32px;
        color:#fff;
        background:#096cb8;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        left:50%;
    }

    view.startup .content:before { z-index:1; content: ''; width: 72px; height: 72px; top: -36px; margin-left: -36px; animation: ping 1s ease-in-out infinite both; }
    view.startup .content:after { z-index:2; content: '\f02d'; width:64px; height:64px; line-height: 64px; margin-left:-32px; top:-32px; }

    /* Home */
    view.home .search input{ cursor:pointer; }
    /* view.home .logo { width: 100%; height: 100px; margin-bottom:32px; background: url('/_img/logo.png') no-repeat center center; background-size: contain; } */


/* Toast */
.toast_window {
	position:absolute;
    width:100%;
	background: #096cb8;
	color:#fff;
	font-size:14px;
	font-weight:600;
	padding:16px 12px;
	text-align:center;
	z-index:99999;
	top:0;
}

.toast_window a { color:#333; font-weight: 400; }
.toast_window .fa-check { color:#00cc00; }
.toast_window .fa-exclamation-triangle { color:#ecab2d; }

/* Modal */
.modal_bg {
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 65px, rgba(0,0,0,.1) 66px, rgba(0,0,0,.1) 100%);
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: fixed;
    z-index: 98;
    display: none;
}
.modal_window {
    position: absolute;
    background:#fff;
    color:#333;
    width: 100%;
    max-width:320px;
    min-height: 32px;
    z-index: 99;
    padding:20px;
    font-family:tahoma, helvetica;
    font-weight: 400;
    font-size:14px;

    -webkit-box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.25);
}
.modal_close { position: absolute; top: 0px; right: 0px; color: #555; font-size: 16px; padding: 21px 23px; }
.modal_window .fa-ul { margin: 0; padding: 0 20px; list-style-type: square; }
.modal_window h1 { margin:0 0 10px 0; }
.modal_window a { color:#096cb8; }
.modal_button_wrapper { display:inline-block; width:50%; vertical-align: top;}
.modal_button_wrapper:first-child { padding-right:10px; }
.modal_button_wrapper:last-child { padding-left:10px; }
.modal_button { margin:0 !important; position:relative; }

.modal_icon.modal_success::before, .modal_icon.modal_success::after, .modal_icon.modal_success .modal_fix { background:#fff; }

/* No internet */
.nointernet { font-size:12px; text-align: center; position: relative; }
.nointernet:before {
    content:'\f1e6';
    font-family: FontAwesome;
    font-size:200px;
    color:#ddd;
    z-index:0;
    display: inline-block;
    vertical-align: middle;
    margin-bottom:20px;
}

/* Empty */
.empty { font-size:12px; text-align: center; position: relative; }
.empty:before {
    content:'\f01c';
    font-family: FontAwesome;
    font-size:200px;
    color:#ddd;
    z-index:0;
    display: inline-block;
    vertical-align: middle;
}

/* Loader */
.loader {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top:-24px;
    margin-left:-24px;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    padding:0;
    box-sizing: border-box;
    border: 5px solid rgba(255, 255, 255, 0.15);
    border-top: 4px solid rgba(255,255,255,1);
    animation: loader 1.2s infinite cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

@keyframes loader { 100% { transform: rotate(360deg); } }

/* Progress */
.progress { width: 75%; height: 5px; background: rgba(0,0,0,.15); margin: 10px auto; }
.progress .fill { width:0; height:100%; background:#096cb8; transition: all .3s ease-in-out; }
.progress .msg { font-size:11px; font-weight: 600; text-transform: uppercase; padding:16px 0; }
.progress .msg i.fa-check { color:#00aa00; }

/* Custom animations */
.puff-out-center { -webkit-animation: puff-out-center 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) both; animation: puff-out-center 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) both; }
.ping { -webkit-animation: ping 0.8s ease-in-out infinite both; animation: ping 0.8s ease-in-out infinite both; }


@keyframes puff-out-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
            transform: scale(2);
    opacity: 0;
  }
}

@keyframes ping {
  0% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    opacity: 0.8;
  }
  100% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
    opacity: 0;
  }
}

@keyframes circlefill {
  0% {
    opacity: .95;
    background-size:100%;
    -webkit-background-size: 100%;
  }
  100% {
    opacity: 1;
    background-size:500%;
    -webkit-background-size: 500%;
  }
}

@keyframes circleunfill {
  0% {
    opacity: 1;
    background-size:500%;
  }
  100% {
    background-size:100%;
    opacity: 0;
  }
}

/* Responsive */
@media (max-width: 768px) {

    ul.list.folders { margin-right:-20px; }
    ul.list.folders li { width:33.33%; padding:0 20px 10px 0; }
    /* ul.list.folders li:nth-child(3n) { padding-left:10px; padding-right:0; } */

    view.login .logo { width: 200px; }

    view.home { padding-top: 72px; }
    /* view.home .logo { height: 72px; margin-bottom:24px; } */

    view.article .content { display:block; }
    view.article .content .body { display:block; padding:0; }
    view.article .content .images { display:block; width:100%; padding:0; }
    view.article .content .images .box { width:100%; margin-top:16px; margin-bottom:0; display:block; }

    .search_help { margin:24px auto; }
    .search_help>div i { font-size:64px; }
    .search_help>div h1 { font-size:16px; }
    .search_help>div p { font-size:10px; }

    .search_results.noresults { margin:24px auto; }
    .search_results.noresults>div i { font-size:64px; }
    .search_results.noresults>div h1 { font-size:16px; }
    .search_results.noresults>div p { font-size:10px; }
}

@media (max-width: 540px) {
    ul.list.folders { margin-right:0px; }
    ul.list.folders li { width:50%; padding:0 10px 10px 0; }
    ul.list.folders li:nth-child(even) { padding-left:10px; padding-right:0; }
}