/* ============================ */
/* MAIN                         */
/* ============================ */

body
{
    margin                      :   0px;
    padding                     :   0px;
    font-family                 :   'Rajdhani';
    font-size                   :   18px;
    color                       :   #fff;
    background-color            :   #1C1C1C;
    background-image            :   url('../img/binding-dark.png');
    text-align                  :   center;
}

#header
{
    height                      :   100px;
    position                    :   absolute;
    top                         :   0px;
    width                       :   100%;
    background-image            :   url('../img/binding-darker.png');
    box-shadow                  :   0px 0px 15px rgb(0 0 0 / 50%);
}

#footer
{
    height                      :   100px;
    width                       :   100%;
}

#content-wrapper
{
    margin                      :   130px auto 50px;
    max-width                   :   800px;
    text-align                  :   left;
}

#content-wrapper-inner
{
    margin                      :   0px 15px;
}

#content-wrapper-inner h1, #content-wrapper-inner h2, #content-wrapper-inner h3, #content-wrapper-inner h4, #content-wrapper-inner h5, #content-wrapper-inner  p
{
    margin                      :   0px 0px 20px 0px;
    text-align                  :   justify;
}

section
{
    margin                      :   0px 0px 50px 0px;
}

.post-date
{
    font-size                   :   15px;
    font-weight                 :   bold;
    margin                      :   -21px 0px 15px 0px;
    padding                     :   0px;
}

.post-tag
{
    font-size                   :   14px;
    padding                     :   5px;
    margin                      :   7px 7px 7px 0px;
    border-radius               :   5px;
    background-color            :   #444;
}

.post-tag:hover
{
    color                       :   #FFF;
    background-color            :   #C33;
}

.post-tag a
{
    color                       :   #FFF !important;
}

.post-tag a:hover
{
    background-color            :   none;
}

.pagetitle
{
    font-family                 :   "Telegraphem";
    font-size                   :   30px;
    display                     :   inline-block;
    padding                     :   30px 0px;
    margin                      :   auto auto;
    vertical-align              :   middle;
}

/* ============================ */
/* HEADINGS                     */
/* ============================ */

h1, h2, h3, h4, h5
{
    font-weight                 :   bold;
    margin                      :   0px;
}

h1
{
    font-size                   :   40px;
    line-height                 :   40px;
}

h2
{
    font-size                   :   35px;
    line-height                 :   35px;
}

h3
{
    font-size                   :   30px;
    line-height                 :   30px;
}

h4
{
    font-size                   :   25px;
    line-height                 :   25px;
}

h5
{
    font-size                   :   20px;
    line-height                 :   20px;
}

/* ============================ */
/* MENU                         */
/* ============================ */

.overlay
{
  font-size                     :   20px;
  height                        :   100%;
  width                         :   0;
  position                      :   fixed;
  z-index                       :   10;
  top                           :   0;
  left                          :   0;
  background-color              :   rgba(0,0,0, 0.9);
  overflow-x                    :   hidden;
  transition                    :   0.5s;
  background-image              :   url('../img/XnqN.gif');
  background-blend-mode         :   darken;
  font-weight                   :   bold;
}

.overlay-content
{
  position                      :   relative;
  top                           :   25%;
  width                         :   100%;
  text-align                    :   center;
  margin-top                    :   30px;
}

.overlay a
{
  padding                       :   8px;
  text-decoration               :   none;
  color                         :   #818181;
  display                       :   block;
  transition                    :   0.2s;
}

.overlay a:hover, .overlay a:focus
{
  color                         :   #f1f1f1;
}

.overlay .closebtn
{
    background-color            :   #900;
    color                       :   #FFF;
    position                    :   absolute;
    display                     :   inline-block;
    top                         :   15px;
    left                        :   15px;
    font-size                   :   45px;
    padding                     :   3px 10px 0px 10px;
    margin                      :   15px;
    height                      :   42px;
    line-height                 :   42px;
    border-radius               :   10px;
    vertical-align              :   middle;
    background-image            :   url('../img/noise.gif');
    background-size             :   100px;
    background-blend-mode       :   screen;
}

@media screen and (max-height: 450px)
{
    .overlay a
    {
        font-size               :   30px
    }

    /*.overlay .closebtn
    {
        font-size               :   35px;
        top                     :   15px;
        left                    :   15px;
    }*/
}

#menubtn
{
    color                       :   #FFF;
    vertical-align              :   middle;
    border-radius               :   10px;
    font-size                   :   25px;
    cursor                      :   pointer;
    line-height                 :   42px;
    height                      :   42px;
    overflow                    :   hidden;
    display                     :   inline-block;
    position                    :   absolute;
    top                         :   15px;
    left                        :   15px;
    padding                     :   0px 12px;
    margin                      :   15px;
}

/* ============================ */
/* HYPERLINKS                   */
/* ============================ */

a, a:link, a:active, a:visited
{
    color                       :   #C33;
    text-decoration             :   none;
    padding                     :   5px;
}

a:hover
{
    color                       :   #FFF;
    background-color            :   #C33;
}

/* ============================ */
/* GENERIC STUFF                */
/* ============================ */

.finetext
{
    font-size                   :   12px;
    font-weight                 :   bold;
    color                       :   #444;
    padding                     :   5px 0px;
}
