*{
    box-sizing: border-box;
    /*border:1px solid red;*/
}

html,body{
    margin:0px;
    border:none;
    padding:0px;
    width:100%;
    height:100%;
    overflow:auto;
    font-family:sans-serif;
}

.background{
    width:calc(100% + 10px);
    height:calc(100% + 10px);
    position:fixed;
    top:-10px;
    left:-10px;
    background-attachment: fixed;
    filter: blur(8px);
    -webkit-filter: blur(8px);
    background-position: center;
    background-size:cover;
    z-index:-1;
    background-image:url("/static/img/background.png");
    transform:scale(1.1);
}

.vertical_line{
    height:100%;
    display:inline-block;
    border-left:1px solid #000;
}

.main{
    width:100%;
    max-width:1200px;
    min-height:100%;
    margin:0px auto;
    overflow:auto;
    padding:0 5px;
}

.obody {
  padding:5px;
  font-size: 10px;
  font-family: sans-serif;
  text-align: left;
}

.ohead{
    border-top:1px solid #999;
    border-left:1px solid #999;
    border-right:1px solid #999;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    padding:10px;
    background-color:#89a;
}

header{
    border-radius:20px;
    box-shadow:-3px -3px 3px #0003;
    overflow:auto;
    margin-top:10px;
}

header .logo{
    margin:0px auto;
    display:block;
    height:75px;
    margin-top:15px;
    max-width:100%;
}

header .search{
    max-width:400px;
    width:100%;
    margin:10px auto;
    height:40px;
}

header .search .searchinput{
    float:left;
    display:inline-block;
    margin:0px;
    outline:none;
    height:100%;
    padding:10px;
    width:calc(100% - 60px);
    background-color:white;
    border:1px solid #aaa;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

header .search .searchbtn{
    width:60px;
    height:40px;
    float:left;
    display:inline-block;
    line-height:40px;
    text-align:center;
    background-color:#2288ff;
    color:white;
    cursor:pointer;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    transition-property: background-color;
    transition-duration:0.2s;
}

header .search .searchbtn:hover{
    background-color:#5af;
}

header .menu{
    width:100%;
    height:40px;
    border:1px solid #ddd;
    border-radius:20px;
    padding:0px 20px;
    background-color:white;
}

header .menu .item{
    height:40px;
    border-right:1px solid #ddd;
    display:inline-block;
    /*padding:0px 10px;*/
    /*line-height:40px;*/
    float:left;
    cursor:pointer;
    text-decoration:none;
    color:black;
    box-sizing: border-box;
    margin-top:-1px;
}

header .menu .item:hover{
    background-color:#def8;
}

header .menu .item_link{
    color:black;
    text-decoration:none;
    padding:0px 10px;
    line-height:40px;
    display:inline-block;
    box-sizing: border-box;
}

header .menu .item .dropdown_menu{
    display:none;
    position:absolute;
    background-color:rgba(255, 245, 245, 0.6);
    border-radius:5px;
    backdrop-filter: saturate(180%) blur(5px);
    z-index:10;
}

header .menu .item .dropdown_menu .item:hover{
    background-color:rgba(136, 153, 170, 0.7);
}

header .menu .item:hover .dropdown_menu{
    display:block;
}

header .menu .item .dropdown_menu .item{
    float:none;
    display:block;
    border:none;
    border-radius:5px;
    margin:5px;
}

header .menu .vertical_line{
    border-left:1px solid #ddd;
    float:left;
}

header .banner{
    border-radius:20px;
    background-position:center;
    background-size:cover;
    background-blend-mode: color;
    overflow: auto;
}

.content{
    width:100%;
    min-height:calc(var(--dcv-window-height) - (var(--dcv-header-height) + var(--dcv-footer-height)) - 51px);
    background-color:#eeee;
    border:1px solid #ddd;
    border-radius:20px;
    margin-top:10px;
    margin-bottom:10px;
    box-shadow:-3px -3px 3px #0003;
    background-image:url("/static/img/contentbg.png");
    background-position:center;
}

footer{
    width:100%;
    padding:10px;
    background-color: #3338;
    border:1px solid #777;
    border-bottom:none;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    color:white;
    text-align:center;
    vertical-align: bottom;
    box-shadow:-3px -3px 3px #0003;
}

footer .f_container{
    display:inline-block;
    text-align:center;
    margin:10px;
    vertical-align:top;
}

footer .f_container .head{
    border-top:1px solid #999;
    border-left:1px solid #999;
    border-right:1px solid #999;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    padding:10px;
    background-color:#89a;
}

footer .f_container .body{
    border-bottom:1px solid #999;
    border-left:1px solid #999;
    border-right:1px solid #999;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
    background-color:#0006;
    padding:20px;
}

footer .f_container .body a{
    color:orange;
    text-decoration: underline;
}

footer .politic{
  padding:10px;
  background-color:#0006;
    border-top:1px solid #0000;
    border-left:1px solid #0000;
    border-right:1px solid #0000;
    border-bottom:1px solid #0000;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
}

footer .politic .pbody {
  padding:5px;
  font-size: 15px;
  font-family: sans-serif;
  text-align: centre;
}

footer .politic .pbody a{
  color:orange;
  text-decoration: underline;
}

footer .politic .pbody a:visited{
  color:yellow;
  text-decoration: underline;
}

footer .politic .pbody a:hover{
  text-decoration: none;
}

footer .f_container .body a:visited{
    color:yellow;
    text-decoration: underline;
}

footer .f_container .body a:hover{
    text-decoration:none;
}

footer .f_container.dmca{
    max-width:500px;
}

.content_message{
    width:100%;
    display:block;
    text-align:center;
    margin:10px 0;
    padding:10px 0;
}

.container{
    width:calc(100% - 20px);
    margin:10px;
    box-sizing:border-box;
    border:1px solid #ddd;
    border-radius:15px;
    overflow:auto;
}

.container .container_title{
    width:100%;
    height:30px;
    padding:5px;
    background-color:#379;
    line-height:20px;
    text-align:center;
    color:white;
}

.container .container_content{
    padding:5px;
    background-color:white;
}

.testbox{
    position:fixed;
    z-index: 5;
    left: 10px;
    bottom: 10px;
    width:300px;
    /*border-radius:10px;
    border:1px solid #489;
    background-color: #f557;*/
    box-sizing: border-box;
    /*padding:10px;*/
    opacity:0.7;
}

.menukep{
    width: 20px;
    height: 20px;
}
.uploadgallery_background{
    background-image:url("/static/img/contentbg.png");
}

.arrow{
   font-size: 50px;
   position: fixed;

   right: 25px;
   bottom: 25px;
   color:rgba(184, 197, 211, 0.76);
   text-decoration: none;
}

#usermenu{
    float:right;
    margin-top:-1.5px;
    margin-right:-20px;
}

@media only screen and (max-width:600px){
    .testbox{
        left:0;
        bottom:0;
        width:100%;
    }

    header .logo{
        width:100%;
        height:auto;
        max-width:466px;
    }

    header .menu.opened{
        height:auto;
        overflow:auto;
        padding:10px;
    }

    header .menu .vertical_line{
        display:none;
    }

    header .menu .item{
        display:block;
        width:100%;
        border:1px solid #ddd;
        border-radius:20px;
        margin:3px 0;
        text-align:center;
        font-size:20px;

    }
}
