html, body {
    height: 100%;
    margin: 0;
}
body{
    background: #FAFAFA;
}
html{
    font-family:Verdana, Geneva, sans-serif;
}
html[lang=HY]{
    font-family:Tahoma, Geneva, sans-serif;
}
*{
    box-sizing: border-box;
}
.home-menu{
    width: 100%;
    display: -webkit-flex; /* Safari */
    display: flex;
}

.home-menu>a{
    -webkit-flex-grow: 1; /* Safari 6.1+ */
    -webkit-flex-shrink: 1; /* Safari 6.1+ */
    -webkit-flex-basis: 100px; /* Safari 6.1+ */
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 100px;
    border-left: 1px solid #EEEEEE;

    display: table-cell;
    background-color: #F5F5F5;
    transition: background-color .5s;
    cursor: pointer;
    text-decoration: none;
    /*border: solid 1px #CFD8DC;*/
}

.home-menu a:first-of-type{
    border: none;
}

.home-menu a:hover{
    background-color: #FFFFFF;
}

.home-menu a:active, .home-menu a:active p, .home-menu a:active h2>span{
    background-color: #01579B;
    color: #FFFFFF;
    transition: background-color .1s;
}
.home-menu a:active span,.home-menu a:active h2{
    color: #ffffff;
}

.home-menu h2{
    font-family:Verdana, Geneva, sans-serif;
    color: #616161;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    margin: 0;
    padding: 10px 0 5px 0;
}
.home-menu span{
    display: block;
    padding-top: 20px;
    margin: 0;
    font-size: 44px;
    color: #2b2b2b;
    text-align: center;
}

.home-menu p{
    display: block;
    padding: 0 25px 25px 25px;
    font-size: 16px;
    color: #BDBDBD;
    margin: auto;
}

.home-sort-label{
    text-decoration: none;
    margin: 0;
    padding: 0;
}

.home-sort-label h2{
    display: block;
    margin: 15px 0 15px 0;
    padding: 8px 8px 8px 20px;
    color: #424242;
    font-size: 22px;
    font-weight: lighter;
    background-color: #F5F5F5;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: 0px 0px 5px #BDBDBD;
}
.home-sort-label:hover h2{
    color: #0277BD;
}

.home-top-group{
    width: 100%;
    display: -webkit-flex; /* Safari */
    display: flex;
}

.news-block{
    -webkit-flex-basis: 500px; /* Safari 6.1+ */
    flex-basis: 500px;
    border: 1px solid #EEEEEE;
    border-radius: 10px;
    background-color: #ffffff;
    margin: 20px 20px 10px 20px;
    box-shadow: 0px 0px 5px #cccccc;
}

.news-block h2{
    display: block;
    width: 100%;
    background-color: #616161;
    color: #ffffff;
    padding: 5px 10px 5px 15px;
    border-radius: 10px 10px 0 0;
}

.news-block .date{
    font-size: 12px;
    color: #727272;
    font-style: italic;
    padding: 15px 15px 15px 15px;
}

.intro-block{
    flex-grow: 1;
    -webkit-flex-grow: 1;
}

.intro-block h1, .news-block h2{
    font-size: 26px;
    font-weight: lighter;
    margin: 0;
    word-wrap: break-word;
}
.intro-block h1{
    padding: 15px 15px 5px 15px;
    color: #212121;
}

.intro-block p,.intro-block a{
    margin: 0;
    padding: 5px 15px 15px 15px;
    font-size: 14px;
    color: #2b2b2b;
    max-width: 800px;
    word-wrap: break-word;
}

.news-block p, .news-block a{
    margin: 0;
    padding: 5px 15px 15px 15px;
    font-size: 14px;
    color: #424242;
    word-wrap: break-word;
}

.page_wrapper{
    width:100%;
    max-width: 1200px;
    margin:auto;
}
#header{
    width:100%;
    height:50px;
    background-color:#78909C;
    box-shadow: 0px 0px 5px #000000;
    border-bottom:1px solid #666666;
    position:relative;
    box-sizing: content-box;
}
#wrapper {
    min-height: 100%;
    height: auto;
    margin: 0px auto -120px;
}
#footer, #push {
    height: 120px;
}
#footer {
    background-color: rgb(51, 51, 51);
    border-top: 1px solid rgb(0, 0, 0);
    box-shadow: 0px 0px 5px #000000;
}
#page-content{
    top: 0px;
}
#header{
    z-index: 2;
}
.copy{
    font-size: 12px;
    color: #ffffff;
    margin: auto;
    text-align: center;
    padding: 0px 10px 0px 10px;
}
.copy>a{
    color: #FFFFFF;
}

#logo{
    float: left;
    width:218px;
    height:50px;
    background-image: url("../images/logo/slimber-large.png");
}
#main_nav, #nav_icons{
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: right;
    display: block;
}

#nav_icons{
    padding-left: 15px;
    padding-right: 20px;
}

#main_nav>li, #nav_icons>li{
    float: left;
}

#main_nav>li>a {
    display: block;
    color: #FFFFFF;
    font-size: 16px;
    text-align: center;
    padding: 15px 20px;
    text-decoration: none;
}

#nav_icons>li>a {
    display: block;
    color: #FFFFFF;
    size: 20px;
    text-align: center;
    padding: 16px 10px;
    text-decoration: none;
    cursor: pointer;
}

#nav_icons #profile_details a {
    padding: 16px 0 0 15px;
}

#profile_details{
    display: none;
}

#nav_icons #open_profile a {
    padding: 10px 10px;
}

#search_container{
    position: absolute;
    top: 0px;
    z-index: 10;
    width: 100%;
    height: 50px;
    margin: auto;
    display: none;
}

#search_bar{
    width: 100%;
    max-width: 1200px;
    margin: auto;
    height: 50px;
    background-color: #78909C;
    padding: 10px 60px 10px 25px;
}

#search_bar input[type=search]{
    width: 100%;
    height: 30px;
    position: relative;
    top: -30px;
    border-radius: 5px;
    border:solid 1px #0277BD;
    font-size: 16px;
    padding: 0px 35px 0px 15px;
}

#search_bar input[type=search]::placeholder{
    color: #999999;
}

#search_bar button{
    outline: none;
    width: 30px;
    height: 30px;
    position: relative;
    float: right;
    z-index: 11;
    background:none;
    border: none;
    padding: 0;
    font-size: 18px;
    cursor: pointer;
}

#search_bar #search_button{
    top: -60px;
    right: 5px;
    color: #999999;
}

#search_bar #close_search_button{
    position: relative;
    top: 0;
    right: -35px;
    color: #FFFFFF;
}

#popupWindow{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    margin: auto;
    display: none;
}

#popupBackground{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-color: #333333;
    opacity: 0.5;
}

.popup{
    position: relative;
    z-index: 1;
    background-color: #F9F9F6;
    border-radius: 5px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
    margin: auto;
    display: none;
}

.popup-block{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    margin: auto;
    display: none;
    align-content: center;
}

.prompt{
    padding: 15px;
}

.login{
    width: 300px;
    max-width: 100%;
    height: 480px;
    top: calc(50% - 240px);
}

.login_header{
    width: 100%;
    display: -webkit-flex; /* Safari */
    display: flex;
}

.forgot-password{
    display: block;
    margin: 0;
    padding: 10px 0 10px 0;
    text-decoration: underline;
    font-weight: bold;
    font-size: 14px;
    color: #2b2b2b;
    cursor: pointer;
}
.forgot-password:hover{
    color: #0277BD;
}

.profile-details .popup{
    position: absolute;
    z-index: 111;
    background-color: rgba(66, 66, 66, 0.9);
    display: block;
    top: 52px;
    color: #FFFFFF;
    border:1px solid #B0BEC5;
}
.profile-details li{
    list-style-type: none;
}

.profile-details li:last-of-type{
    margin-top: 5px;
    border-top: 1px solid #333333;
}

.profile-details li:last-of-type a{
    padding-top: 10px;
    border-top: 1px solid #999999;
}

.profile-details a{
    display: block;
    padding: 5px;
    color: #FFFFFF;
    text-decoration: none;
}

.profile-details span{
    padding-right: 10px;
}

.profile-details ul{
    margin: 0;
    padding: 10px;
}

.popup-menu-item{
    display: none;
}

.popup-menu-item+label{
    background-color: #666666;
    display: block;
    float: left;
    padding: 12px 20px;
    -webkit-flex: 1;  /* Safari 6.1+ */
    -ms-flex: 1;  /* IE 10 */
    flex: 1;
    color: #FFFFFF;
    font-size: 18px;
    cursor: pointer;
    text-shadow: #263238 -1px -1px 1px;
    box-shadow: inset #000000 0 0 3px;
}

.popup-menu-item:first-child+label{
    border-top-left-radius: 5px;
    border-left: none;
}

.popup-menu-item:last-of-type+label{
    border-top-right-radius: 5px;
    border-right: none;
}

.popup-menu-item:checked+label{
    background-color: #F9F9F6;
    color: #263238;
    border: none;
    cursor: default;
    text-shadow: none;
    box-shadow: none;
}

.popup-content{
    position: absolute;
    top: 50px;
    left: 0;
    padding: 0 20px 20px 20px;
    width: 100%;
}

.popup-content label{
    display: block;
    color: #666666;
    padding-top: 10px;
    padding-bottom: 3px;
    font-size: 14px;
}

.popup-content input:not([type=checkbox]){
    width: 100%;
    border: solid 1px #CFD8DC;
    border-radius: 5px;
    height: 30px;
    padding-left: 5px;
    padding-right: 5px;
}
.popup-content input[type=checkbox]{

}
.popup-content input[type=checkbox]+label{
    display:inline-block;
}

.popup-content button, .cm_btn{
    background-color: #2196F3;
    border: none;
    border-radius: 5px;
    height: 30px;
    margin-top: 15px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    outline: none;
}
.popup-content button{
    width: 100%;
}

.cm_ipt{
    display: block;
    border: solid 1px #CFD8DC;
    border-radius: 5px;
    height: 30px;
    padding-left: 5px;
    padding-right: 5px;
}

select[class='cm_ipt']{
    color: #666666;
    font-size: 14px;
}

.cm_ipt option{
    color: #666666;
    font-size: 14px;
}

textarea[class='cm_ipt']{
    height: auto;
}

input[type=file][class='cm_ipt']{
    display: none;
}

.cm_lbl>.img_cnt{
    border: solid 1px #CFD8DC;
    border-radius: 5px;
    cursor: pointer;
    width: 185px;
    height: 185px;
    overflow: hidden;
    text-align: center;
}

.cm_btn{
    padding-left: 25px;
    padding-right: 25px;
}

.cm_btn:active{
    background-color: #01579B;
}
.cm_h1{
    color: #263238;
    font-size: 28px;
    text-align: center;
}

.cm_lbl{
    display: block;
    color: #666666;
    padding-top: 10px;
    padding-bottom: 3px;
    font-size: 14px;
}

.cm_hr{
    border: none;
    border-top: 1px solid #EEEEEE;
    border-bottom: 1px solid #FFFFFF;
}

.user-input-page{
    position: relative;
    top: 0;
    left: 0;
    max-width: 350px;
    margin: auto;
}

.user-input-page h1{
    color: #263238;
    font-size: 28px;
    text-align: center;
}

.user-input-page hr{
    border: none;
    border-top: 1px solid #EEEEEE;
    border-bottom: 1px solid #FFFFFF;
}

.avatar_nav {
    vertical-align: middle;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    position: relative;
    border: 1px solid #546E7A;
}


.info-container, .user-profile-box{
    background-color: #FFFFFF;
    box-shadow: 1px 1px 10px #E0E0E0;
    padding: 25px;
}
.user-profile-box{
    width: 100% !important;
    display: flex;
    align-items: stretch;
}

.user-profile-box>div{
    display: table-cell;
    vertical-align: top;
}

.user-profile-avatar-container{
    width: 215px;
}

.user-profile-avatar-container img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.user-profile-info-container{
    padding-left: 25px;
    flex-grow: 1;
}

.user-profile-box label{
}

.user-profile-box h1{
    font-size: 22px;
    color: #424242;
    margin: 0;
    padding: 0;
}

.user-profile-box h2, .user-profile-box h3{
    font-size: 14px;
    font-weight: lighter;
    color: #757575;
    margin: 0;
}

.user-profile-box h2{
    font-style: italic;
    padding: 5px 0;
    color: #616161;
}

.user-profile-box p{
    color: #616161;
    font-size: 14px;
}

#user-profile-details{
    width: 300px;
}
#user-profile-details p{
    display: inline-block;
    width: 50%;
    margin: 0;
    padding: 4px;
}

#user-profile-details p:nth-child(odd){
    color: #9E9E9E;
}
#user-profile-details p:nth-child(odd)::after{
    content: ":";
}

.img-container{
    text-align: center;
}

.img-url-label{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.img-url-label,.img-url-label:visited{
    color: #01579B;
}

.img-container figure{
    display: inline-block;
    margin: 10px;
    vertical-align: top;
}

.img-container:not(own) figure, .img-container:not(browse) figure{
    width: 140px;
}

.img-container.browse figure{
    width: 110px;
}

.img-container.own figure{
    text-align: center;
    width: 200px;
    margin-bottom: 25px;
}

.img-container.own .img-action{
    display: inline-block;
    font-size: 12px;
    color: #666666;
    padding: 5px 10px;
    font-weight: bold;
    cursor: pointer;
}

.img-container.own .img-action:hover{
    color: #0277BD;
}

.img-container.own .img-action span{
    margin-right: 5px;
    font-size: 14px;
}
.img-container.own .img-action .icon-round-brush{
    color: #2E7D32;
}
.img-container.own .img-action .icon-close-solid{
    color: #D50000;
}

.img-container.own .img-url-label{
    display: block;
    width: 190px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding:0 5px;
}

.img-container a{
    text-decoration: none;
    font-size: 14px;
    display: block;
}

.img-container img{
    box-shadow: 1px 1px 10px #BDBDBD;
}

.img-container .img-f140{
    width: 140px;
}

.img-container .img-s100{
    width: 100px;
}

.img-container .img-s52{
    width: 52px;
}

.prof-container{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.prof-container .prof-block{
    margin: 10px;
    display: inline-block;
    vertical-align: top;
    width: 260px;
    background-color: #FFFFFF;
    padding: 5px;
    box-shadow: 1px 1px 5px #E0E0E0;
    border-radius: 3px;
}

.prof-container .prof-block img{
    float: left;
    display: table-cell;
}

.prof-container .prof-block .prof-label{
    text-decoration: none;
    font-size: 14px;
    display: block;
    font-weight: bold;
    color: #01579B;

    text-align: left;
    white-space: nowrap;
    width: 145px;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 5px;
}
.prof-container .prof-block .prof-detail{
    text-align: left;
    white-space: nowrap;
    width: 145px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
    padding: 0 5px;
    font-size: 14px;
    color: #9E9E9E;
}

.ads-block{
    overflow: hidden;
    height: fit-content;
}

/* Custom checkbox */
.checkbox {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-top: 10px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    border-radius: 5px;
    margin-top: 5px;
    background-color: #FFFFFF;
    border: solid 1px #cccccc;
}

.checkbox:hover input ~ .checkmark {
    background-color: #F0F0F0;
}

.checkbox input:checked ~ .checkmark {
    background-color: #2196F3;
    border: none;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.checkbox input:checked ~ .checkmark:after {
    display: block;
}

.checkbox .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#register-forms label::before{
    content: "*";
    color: #FF3D00;
}

#login-item:checked ~ div>#register-forms{
    display: none;
}

#login-item:checked ~ div>#login-forms{
    display: block;
}

#register-item:checked ~ div>#register-forms{
    display: block;
}

#register-item:checked ~ div>#login-forms{
    display: none;
}

/* message field style*/
.error-mark, .success-mark{
    display: block;
    float: left;
    height: 22px;
    margin-right: 5px;
    font-size: 16px;
}
.error-message{
    color: #D50000;
    font-size: 12px;
    margin: 0;
    padding: 5px;
    font-family: Verdana, Geneva, sans-serif;
}
.success-block,.error-block{
    border-radius: 7px;
    margin: 25px;
    padding: 15px;
    color: #212121;
}
.error-block{
    background-color: #FFEBEE;
    border: 2px solid #D50000;
}
.success-block{
    background-color: #E8F5E9;
    border: 2px solid #2E7D32;
}

.error-block>span{
    color: #D50000;
    font-size: 24px;
}

.success-block>span{
    color: #2E7D32;
    font-size: 24px;
}
.sep{
    display: inline-block;
    position: relative;
    border-left: solid 1px #212121;
    border-right: solid 1px #616161;
    font-size: 22px;
    margin: 0 15px;
    padding: 8px 0 8px 0;
    top: 5px;
}
/* Pagination */

.slp-cursor{
    display: block;
    position: relative;
    padding: 20px;
}

.slp-cursor-page{
    color: #444444;
    padding: 6px 12px;
    text-decoration: none;
    font-size: 14px;
    transition: background-color .4s;
    background-color: #F9F9F9;
    margin: 0;
    box-shadow: 0 0 3px #666;
    position: relative;
    z-index: 2;
    display: inline-block;
}

.slp-cursor-current-page{
    background-color: #616161;
    border: none;
    color: white;
    position: relative;
    z-index: 1;
}

.slp-cursor-page:hover:not(.slp-cursor-current-page) {
    background-color: #dedede;
}

.slp-cursor-page:first-child{
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.slp-cursor-page:last-child{
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.slp-tabs{
    width: 100%;
    display: -webkit-flex; /* Safari */
    display: flex;
    padding: 20px;
}

.slp-tab-item:not(.slp-tab-selected){
    color: #424242;
    background-color: #F9F9F9;
    box-shadow: 0 0 3px #666;
}

.slp-tab-item, .slp-tab-item h1{
    transition: background-color .4s;
    display: block;
    padding: 10px 20px;
    font-size: 14px;
    text-decoration: none;
    cursor: pointer;
    flex-grow: 1;
}
.slp-tab-item h1{
    margin: 0 !important;
    padding: 0 !important;
}

.slp-tab-item:first-child{
    border-top-left-radius: 5px;
}

.slp-tab-item:last-child{
    border-top-right-radius: 5px;
}

.slp-tab-item:not(.slp-tab-selected):hover{
    background-color: #E0E0E0;
}

.slp-tab-selected{
    background-color: #616161;
    color: #FFFFFF;
    cursor: default;
}

.slp-drop-down{
    width: fit-content;
    width: -moz-fit-content;
    display: inline-block;
    padding: 0 0 20px 20px;
    position: relative;
    z-index: 111;
}

.slp-drop-down-name{
    font-size: 14px;
    color: #2b2b2b;
}

.slp-drop-down-label{
    background-color: #FFFFFF;
    border: 1px solid #BDBDBD;
    border-radius: 5px;
    font-size: 14px;
    color: #2b2b2b;
    padding: 5px 10px;
    width: fit-content;
    width: -moz-fit-content;
    cursor: pointer;
    margin: 0;
}
.slp-drop-down-label .down-icon{
    margin-left: 6px;
}
.slp-drop-down-button{
    display: none;
    visibility: hidden;
    padding: 0;
    margin: 0;
}

.slp-drop-down>.slp-drop-down-button:hover ~ .slp-drop-down-list, .slp-drop-down>.slp-drop-down-button:checked ~ .slp-drop-down-list,.slp-drop-down-list:hover{
    display: block;
    margin-top: 5px;
}

.slp-drop-down-list{
    display: none;
    border-radius: 5px;
    width: fit-content;
    width: -moz-fit-content;
    box-shadow: 0 0 3px #666;
    -moz-box-shadow: 0 0 3px #666;
    -o-box-shadow: 0 0 3px #666;
    -webkit-box-shadow: 0 0 3px #666;
    position: absolute;
    top: 20px;
    right: 0;
}

.slp-drop-down-item{
    display: block;
    padding: 8px 25px 8px 10px;
    font-size: 14px;
}

.slp-drop-down-item:first-child{
    border-top-left-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;

    border-top-right-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
}
.slp-drop-down-item:last-child{
    border-bottom-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomleft: 5px;

    border-bottom-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomright: 5px;
}

.slp-drop-down-item:not(.slp-tab-selected){
    text-decoration: none;
    transition: background-color .4s;
    background-color: #F9F9F9;
    color: #444444;
    cursor: pointer;
}

.slp-drop-down-item:not(.slp-tab-selected):hover{
    background-color: #E0E0E0;
}



/* Social media icons */
@font-face {
    font-family: 'icomoon';
    src:  url('../fonts/icons/icomoon_2loerp.eot');
    src:  url('../fonts/icons/icomoon_2loerp.eot#iefix') format('embedded-opentype'),
    url('../fonts/icons/icomoon_2loerp.ttf') format('truetype'),
    url('../fonts/icons/icomoon_2loerp.woff') format('woff'),
    url('../fonts/icons/icomoon_2loerp-icomoon.svg') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

[class^="icon-"], [class*=" icon-"] {
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-odnoklassniki:before {
    content: "\e900";
    /*color: #f4731c;*/
}
.icon-vk:before {
    content: "\e901";
    /*color: #6383a8;*/
}
.icon-googleplus:before {
    content: "\e902";
    /*color: #dc4e41;*/
}
.icon-facebook:before {
    content: "\e903";
    /*color: #3b5998;*/
}
.icon-pinterest:before {
    content: "\e905";
    /*color: #bd081c;*/
}
.icon-twitter:before {
    content: "\e904";
    /*color: #1da1f2;*/
}

.icon-chevron-down:before {
    content: "\e90d";
}
.icon-chevron-thin-left:before {
    content: "\e919";
}
.icon-chevron-thin-right:before {
    content: "\e91a";
}
.icon-dots-three-horizontal:before {
    content: "\e910";
}
.icon-triangle-down:before {
    content: "\e911";
}
.icon-add-user:before {
    content: "\e912";
}
.icon-images:before {
    content: "\e90c";
}
.icon-log-out:before {
    content: "\e913";
}
.icon-login:before {
    content: "\e914";
}
.icon-new-message:before {
    content: "\e917";
}
.icon-round-brush:before {
    content: "\e90e";
}
.icon-users:before {
    content: "\e90f";
}
.icon-checkmark:before {
    content: "\e90a";
}
.icon-close:before {
    content: "\e909";
}
.icon-close-solid:before {
    content: "\e91d";
}
.icon-exclamation-solid:before {
    content: "\e90b";
}
.icon-menu:before {
    content: "\e908";
}
.icon-search:before {
    content: "\e907";
}
.icon-user:before {
    content: "\e906";
}
.icon-user-solid-square:before {
    content: "\e918";
}
.icon-view-hide:before {
    content: "\e915";
}
.icon-view-show:before {
    content: "\e916";
}
.social-media-icons{
    margin: auto;
    width: auto;
    text-align: center;
    padding: 10px 10px 10px 10px;
    text-shadow: -1px -1px 1px #000000;
}

.social-media-icons>a{
    display: inline-block;
    font-size: 18px;
    color: #FFFFFF;
    text-decoration: none;
    padding: 0px 13px 0px 13px;
}

#li-icon-menu{
    display: none;
}
/* mobile devices */

@media only screen and (max-width: 800px) {
    #main_nav{
        display: none;
        top: 52px;
        right: 2px;
        position: absolute;
        width: 256px;
        box-shadow: 3px 3px 5px grey;
    }
    #main_nav>li{
        border-bottom:solid 1px #90A4AE;
        width: 256px;
    }
    #main_nav>li>a {
        display: block;
        color: #263238;
        background-color: #B0BEC5;
        font-size: 16px;
        text-align: center;
        padding: 15px 20px;
        text-decoration: none;
    }
    #li-icon-menu{
        display: block;
    }

    .home-top-group{
        display: block;
    }
}

@media only screen and (max-width: 600px) {
    #main_nav{
        width: 100%;
        right: 0;
    }
    #main_nav>li{
        width: 100%;
    }
    .user-profile-box{
        display: grid;
    }
    .user-profile-box>div{
        margin: auto;
    }
}

@media only screen and (max-width: 400px) {
    .copy{
        font-size: 10px;
    }
    #logo{
        width:50px;
        background-image: url("../images/logo/slimber-small.png");
    }
}

@media only screen and (max-width: 345px) {
    .copy{
        font-size: 9px;
    }
}

@media only screen and (max-width: 320px) {
    .copy{
        font-size: 8px;
    }
}