.o_0,.o_1,.o_3,.o_6,.o_8{
    text-align:left;
}
.o_0{

}
.o_1{

}
.o_3{transform:rotate(180deg);

}
.o_6{
    -webkit-transform: translateY(-100%) rotate(90deg); /* Safari */
    -moz-transform: translateY(-100%) rotate(90deg); /* Firefox 3.6 Firefox 4 */
    /*-moz-transform-origin: right top; */
    -ms-transform: translateY(-100%) rotate(90deg); /* IE9 */
    -o-transform: translateY(-100%) rotate(90deg); /* Opera */
    transform: translateY(-100%) rotate(90deg); /* W3C */
    -webkit-transform-origin: left bottom;
    -moz-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    -o-transform-origin: left bottom;
    transform-origin: left bottom;
    height:auto;

}
.o_8{
    -webkit-transform: translateX(-100%) rotate(-90deg); /* Safari */
    -moz-transform: translateX(-100%) rotate(-90deg); /* Firefox 3.6 Firefox 4 */
    -ms-transform: translateX(-100%) rotate(-90deg); /* IE9 */
    -o-transform: translateX(-100%) rotate(-90deg); /* Opera */
    transform: translateX(-100%) rotate(-90deg); /* W3C */
    -webkit-transform-origin: top right;
    -moz-transform-origin: top right;
    -ms-transform-origin: top right;
    -o-transform-origin: top right;
    transform-origin: top right;
    height:auto;

}
.o_land{

}
.o_image {
    width:200px;
    height:200px;
    overflow:hidden;
    background: green;
}
.o_image img{
    object-fit:cover;
}
.o_images{
    text-align:center;
    background: #efefef;
    padding:3px;
}
.o_card{
    margin:3px;
    border:1px solid #ccc;
    padding:4px;
    float:left;
    font-family:Arial;
    font-size:11px;
}*{
    padding:0px;
    margin:0px;
    box-sizing:border-box;
    -webkit-tap-highlight-color: transparent;
    scroll-behavior: smooth;
}
body{
    background:#efefef;
    font-family:Rubik;
    -webkit-font-smoothing:antialiased;
    color:#444;
    font-size:80%;
}
body:before{
    content: "";
    position: fixed;
    top: -10px;
    left: 0;
    width: 100%;
    height: 10px;
    z-index: 1000;
}
.clear:after{
    visibility:hidden;
    display:block;
    font-size:0;
    content:" ";
    clear:both;
    height:0;
}
.clear{
    display:inline-block;
}
* html .clear {
    height:1%;
}
.clear{
    display: block;
}
.left{
    float:left;
}
.right{
    float:right;
}
a{color:#333;text-decoration:none;}
.click{
    cursor: pointer;
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:transparent;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    -o-user-select:none;
    user-select:none;
}
.ns{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
progress{
    -webkit-appearance: none;
    appearance: none;
    padding:0px;
    margin:0px;
    border:0px;
    background-color: #eee;
    border-radius: 2px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}
progress[value]::-webkit-progress-value{
    -webkit-appearance: none;
    appearance: none;
    padding:0px;
    margin:0px;
    border:0px;
    background-image:
            -webkit-linear-gradient(-45deg,
            transparent 33%, rgba(0, 0, 0, .1) 33%,
            rgba(0,0, 0, .1) 66%, transparent 66%),
            -webkit-linear-gradient(top,
            rgba(255, 255, 255, .25),
            rgba(0, 0, 0, .25)),
            -webkit-linear-gradient(left, #09c, #f44);
    border-radius: 2px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}
.d{
    padding:3px;
    margin:3px;
    align-text:center;
}

.header{
    position:fixed;
    top:0px;
}
.content{
    margin-top:126px;
}
.footer{
    position:fixed;
    bottom:0px;
}
.panel{
    border:1px solid #ccc;
    padding:3px;
    margin:3px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}
.card{
    width:150px;

    background:#FFF;
}
.member-image{
    width:40px;
    height:40px;
    -webkit-border-radius:40px;
    -moz-border-radius:40px;
    border-radius:40px;
    overflow:hidden;
}

#catch_status{
    font-weight:bold;
    font-size:27px;
}
.input{
    border:1px solid #ccc;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    font-size:16px;
    padding:6px;
    font-family:Rubik;
}
.gofish{
    font-family:Rubik;
    border:0px;
    width:80px;
    height:40px;
    -webkit-border-radius:40px;
    -moz-border-radius:40px;
    border-radius:40px;
    background:#6EBF55;
    text-align:center;
    font-weight:bold;
    font-size:16px;
    line-height:40px;
    color:#FFF;
    cursor: pointer;
}
h6{color:#999;}