/*======================= Home Page ==============================================*/
.visual
{
    width: 100%;
    height: auto;
    padding: 0px;
    margin: 0px auto;
    float: none;
    text-align: center;
    position: relative;
    border: 1px solid #fff;
}
.visual img
{
    width: 100%;
    height: auto;
}

.visualjumbotron
{
    width: 100%;
    height: auto;
    padding: 0px;
    margin: 0px auto;
    float: none;
    text-align: center;
    position: relative;
}
.visualjumbotron img
{
    width: 100%;
    height: auto;
}

.caption
{
    width: 100%;
    margin: 0px;
    padding: 0px;
    position: absolute;
    top: 05px;
    font-size: !1.5em;
    text-align: center;
    color: #fff;
    margin-left: 10px;
    display: block;
}

.btns
{
    width: 100%;
    margin: 0px;
    padding: 0px;
    position: absolute;
    bottom: 05px;
}
.hm-login
{
    padding: 1% 0%;
    width: 49%;
    margin: 0px;
    background: url(/media/bg-login.png);
    font-size: 25px;
    color: #fff;
    float: left;
    margin-left: 5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
}
.hm-login:hover
{
    padding: 1% 0%;
    margin: 0px;
    background: url/media/bg-hover.png);
    font-size: 25px;
    color: #000;
    float: left;
    margin-left: 5px;
}
.hm-register
{
    padding: 1% 0%;
    width: 49%;
    margin: 0px;
    background: url(/media/bg-register.png);
    font-size: 25px;
    color: #fff;
    float: right;
    margin-right: 5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
}
.hm-register:hover
{
    padding: 1% 0%;
    margin: 0px;
    background: url(/media/bg-hover.png);
    font-size: 25px;
    color: #000;
    float: right;
    margin-right: 5px;
}

.hm-jb-login
{
    margin: 0px;
    color: #fff;
    margin-left: 5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
}
.hm-jb-login:hover
{
    margin: 0px;
    color: #e5e600;
    margin-left: 5px;
}
.hm-jb-register
{
    margin: 0px;
    color: #fff;
    margin-right: 5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
}
.hm-jb-register:hover
{
    margin: 0px;
    color: #e5e600;
    margin-right: 5px;
}
.visual a
{
    color: inherit;
    text-decoration: none;
    display: block;
}
.visual a:hover
{
    color: inherit;
    text-decoration: none;
}

@media screen and (max-width:767px)
{

    .mobile-links
    {
        display: block;
        position: absolute;
        bottom: 5%;
        width: 98%;
        margin-left: 1%;
        opacity: .75 !important;
    }
    .btns2
    {
        display: none;
    }
    .caption
    {
        font-size: .1.1em !important;
    }

}
@media screen and (max-width:767px) and (orientation:landscape)
{

    .mobile-links
    {
        display: block;
        position: absolute;
        bottom: 25%;
        width: 98%;
        margin-left: 1%;
        opacity: .85 !important;
    }

    .caption
    {
        font-size: .1.1em !important;
    }

}
@media screen and (min-width:768px) and (max-width:1024px)
{

    .caption
    {
        font-size: 1.5em !important;
    }
    .mobile-links
    {
        display: block;
        position: absolute;
        bottom: 5%;
        width: 98%;
        margin-left: 1%;
    }
}
@media screen and (max-width:1024px)
{
    .hm-login
    {
        padding: 1% 0%;
        width: 49%;
        margin: 0px;
        background: url(/media/bg-login.png);
        font-size: 14px;
        color: #fff;
        float: left;
        margin-left: 5px;
        -webkit-transition: all 300ms linear;
        -moz-transition: all 300ms linear;
        -o-transition: all 300ms linear;
        -ms-transition: all 300ms linear;
    }
    .hm-login:hover
    {
        padding: 1% 0%;
        margin: 0px;
        background: url(/media/bg-hover.png);
        font-size: 14px;
        color: #000;
        float: left;
        margin-left: 5px;
    }
    .hm-register
    {
        padding: 1% 0%;
        width: 49%;
        margin: 0px;
        background: url(/media/bg-register.png);
        font-size: 14px;
        color: #fff;
        float: right;
        margin-right: 5px;
        -webkit-transition: all 300ms linear;
        -moz-transition: all 300ms linear;
        -o-transition: all 300ms linear;
        -ms-transition: all 300ms linear;
    }
    .hm-register:hover
    {
        padding: 1% 0%;
        margin: 0px;
        background: url(/media/bg-hover.png);
        font-size: 14px;
        color: #000;
        float: right;
        margin-right: 5px;
    }
    .mobilemargin
    {
        margin-top: 125px;
    }
    .btns2
    {
        display: none;
    }






}
@media screen and (min-width:1025px)
{

    .mobilemargin
    {
        margin-top: 20px;
    }

    .caption
    {
        font-size: 2.5em !important;
    }
    .mobile-links
    {
        display: none;
    }

}
.mobile-background
{
    display: none;
}
.kaigie-background
{
    display: block;
}
@media screen and (orientation:portrait) and (max-width:767px)
{
    .mobile-background
    {
        /* waiting for good image */
        display: none;
        width: 100%;
        margin:0 auto;
    }
    .kaigie-background
    {
        display: none;
    }
}