/* =====================================================
jacen shrine
====================================================== */

/* ---------- Background ---------- */

body{

    margin:0;
    padding:40px;

    background:
        url("https://beskarsteel.neocities.org/shrines/jacenbackground.jpg")
        repeat;

    background-color:#263316;

    color:#263316;

    font-family:Verdana, Geneva, sans-serif;
    font-size:15px;

}


/* ---------- Main Container ---------- */

.container{

    position:relative;

    width:900px;

    margin:auto;

    padding:35px;

    background: #465237;

    border:5px ridge #354B63;

    box-shadow:
    0 0 35px #347CC9,
    inset 0 0 25px #347CC9;

}


/* ---------- Header ---------- */

header{

    text-align:center;

    margin-bottom:30px;

}


.headerimg{

    width:100%;

    border:4px ;

    margin-bottom:20px;

}


h1{

    margin:0;

    color:#347CC9;

    font-size:20px;

    text-shadow:

    3px 3px #114173,

    0 0 18px #3C75B0;

    letter-spacing:4px;

}


/* ---------- Marquee ---------- */

marquee{

    margin-top:15px;

    padding:8px;

    background:#2E471E;

    border:3px outset #3C76A3;

    color:white;

}


/* ---------- Headings ---------- */

h2{

    color:#3C76A3;

    margin-top:40px;

    margin-bottom:15px;

    padding:8px;

    border-bottom:2px dashed #1B4363;

    text-shadow:0 0 8px blue;

}


/* ---------- Text Boxes ---------- */

.textbox{

    overflow:hidden;

    padding:20px;

    background:#2C5E7D;

    border:3px ridge #2C5E7D;

    box-shadow:

    inset 0 0 15px #2C5E7D;

}


/* ---------- Portrait Images ---------- */

.portrait{

    width:240px;

    border:3px blue;

    margin:8px;

}


.left{

    float:left;

    margin-right:20px;

}


.right{

    float:right;

    margin-left:20px;

}


/* ---------- Gallery ---------- */

.gallery{

    text-align:center;

}


.gallery img{

    width:180px;

    margin:10px;

    padding:6px;

    background:#2C5E7D;

    border:3px ridge #2C5E7D;

    transition:.2s;

}


.gallery img:hover{

    transform:scale(1.08);

    box-shadow:

    0 0 18px blue;

}


/* ---------- Lists ---------- */

ul{

    line-height:2;

}


/* ---------- Quotes ---------- */

blockquote{

    color:#212A33;

    background:#4A5934;

    padding:15px;

    border-left:6px blue;

    margin-bottom:15px;

}


/* ---------- Back Button ---------- */

.backbutton{

    text-align:center;

    margin:25px 0;

}


.backbutton a{

    display:inline-block;

    padding:12px 24px;

    text-decoration:none;

    color:white;

    background:linear-gradient(#5789BA,#557D34);

    border:3px outset #5789BA;

    font-weight:bold;

    font-size:18px;

    box-shadow:0 0 15px #5789BA;

}


.backbutton a:hover{

    background:linear-gradient(#b65fff,#6320b0);

}


/* ---------- Table ---------- */

.main{

    width:100%;

    border-collapse:separate;

    border-spacing:0 30px;

}


/* ---------- Sticker Decorations ---------- */

.sticker{

    position:absolute;

    width:110px;

    image-rendering:pixelated;

    z-index:999;

}


/* Top Left */

.tl{

    left:-45px;

    top:-35px;

}


/* Top Right */

.tr{

    right:-45px;

    top:-25px;

}


/* Bottom Left */

.bl{

    left:-45px;

    bottom:-25px;

}


/* Bottom Right */

.br{

    right:-45px;

    bottom:-35px;

}


/* ---------- Links ---------- */

a{

    color:#8ee8ff;

}


a:hover{

    color:white;

}


/* ---------- Blink ---------- */

.blink{

    animation:blink 1s steps(2,start) infinite;

    color:#ffff88;

    font-weight:bold;

    font-size:22px;

}


@keyframes blink{

    to{

        visibility:hidden;

    }

}


/* ---------- Horizontal Rule ---------- */

hr{

    border:none;

    border-top:2px dashed #b56eff;

}


/* ---------- Visitor Counter Area ---------- */

center{

    padding:20px;

}


/* ---------- Scrollbar (Webkit Browsers) ---------- */

::-webkit-scrollbar{

    width:14px;

}


::-webkit-scrollbar-track{

    background:#150326;

}


::-webkit-scrollbar-thumb{

    background:#8f48ff;

    border:2px solid #2c004f;

}


/* ---------- Selection ---------- */

::selection{

    background:#bf77ff;

    color:white;

}


/* ---------- Responsive ---------- */

@media (max-width:980px){

.container{

    width:95%;
    padding:20px;

}

.headerimg{

    width:100%;

}

.portrait{

    width:100%;
    float:none;
    margin:0 0 20px 0;

}

.gallery img{

    width:44%;

}

.sticker{

    width:75px;

}

h1{

    font-size:28px;

}

}