/* GENERAL */
html {
    position: relative;
    min-height: 100%;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    background: url(../img/bg.jpg);
}

h1,h2,h3 {
    color: #ae4f00;
    font-weight: bold;
    text-transform: uppercase;
    font-family: Tahoma, Arial, sans-serif;
}

h2 {
    font-size: 24px;
}

.img-centered {
    display: block;
    margin: auto;
}

.nopad {
    padding: 0 !important;
    margin: 0 !important;
}

.error {background: #740925;color: #FFF;padding: 20px;text-transform: uppercase;max-width: 740px;margin: 0 auto;}
.success {background: #27ae60;color: #FFF;padding: 20px;text-transform: uppercase;max-width: 740px;margin: 0 auto;}


/* HEADER */
.navbar {
    background-image: -webkit-gradient(
            linear,
            left top,
            left bottom,
            color-stop(0, rgb(189, 90, 3)),
            color-stop(1, rgb(127, 62, 5))
    );
    background-image: -o-linear-gradient(bottom, rgb(189, 90, 3) 0%, rgb(127, 62, 5) 100%);
    background-image: -moz-linear-gradient(bottom, rgb(189, 90, 3) 0%, rgb(127, 62, 5) 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(189, 90, 3) 0%, rgb(127, 62, 5) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(189, 90, 3) 0%, rgb(127, 62, 5) 100%);
    background-image: linear-gradient(to bottom, rgb(189, 90, 3) 0%, rgb(127, 62, 5) 100%);
    -moz-box-shadow: 0px 0px 15px #000;
    -webkit-box-shadow: 0px 0px 15px #000;
    box-shadow: 0px 0px 15px #000;

    border: none;
    margin-bottom: 0;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: white;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: orange;
}

.navbar-default .navbar-toggle {
    border: none;
}

.navbar-default a {
    color: white !important;
    text-transform: uppercase;
    text-shadow: 2px 3px 6px #3E3E3E;
    font-weight: bold;

    transition-property:color;
    -moz-transition-property: color;
    -webkit-transition-property:color;
    -o-transition-property:color;
    transition-duration:0.5s;
    -moz-transition-duration: 0.5s;
    -webkit-transition-duration:0.5s;
    -o-transition-duration:0.5s;
    transition-timing-function: linear, ease-in;
    -moz-transition-timing-function: linear, ease-in;
    -webkit-transition-timing-function: linear, ease-in;
    -o-transition-function: linear, ease-in;
}
.navbar-default a:hover, .navbar-default a:focus, .navbar-default .active {
    color: #ffdf9b !important;
}

.nav li a {
    font-size: 16px;
}


/* CONTENT */
.content {
    background: url(../img/bg-content.jpg);
    padding: 20px 50px 75px;
}

.separator {
    background: url("../img/line.png") center no-repeat;
    background-size: cover;
    height: 5px;
    margin: 40px 0;
}

.content a, .content a:visited {
    color: #c14a22;
}
.content a:hover {
    color: orange;
}

.content p {
    font-family: Tahoma, Arial, sans-serif;
    font-size: 16px;
    color: #4f4f4f;
}

.splash-btn-en,
.splash-btn-fr {
    display: block;
    width: 240px;
    height: 80px;
    margin: 75px auto;
}

.splash-btn-en {
    background: url("../img/english-btn.gif") 0 0 no-repeat;
    background-size: cover;
}

.splash-btn-fr {
    background: url("../img/french-btn.gif") 0 0 no-repeat;
    background-size: cover;
}



.splash-btn-en:hover,
.splash-btn-fr:hover {
    background-position-y: -84px;
}



.stories-list li {
    list-style: none;
}

.character {
    margin: 20px 20px 40px;
}

.character .character-block {
    margin: 0;
    padding: 0;
}

.character .character-block li {
    list-style: none;
    background: #8f3500;
    border-bottom: 1px solid white;
    color: white;
}

.character .character-block li h3 {
    color: white;
    margin: 0;
    padding: 18.3px;
    cursor: pointer;
    font-size: 12px;
    text-align: center;
}

.character .character-block li div {
    margin: 10px;
    display: none;
}

.character .card-image {
    height: 151px;
    background-size: cover;
    background-position: 50%;
	border:solid 5px;
	border-color:#000;
}



.post-container {
    margin: 20px 20px 0 0;  
    border: 5px solid #333;
    overflow: auto
}
.post-thumb {
    float: left;
	margin-right:-40px;

}
.post-thumb img {
    display: block;
	width: 80%;
}
.post-content {
    margin-left: 210px
}
.post-title {
    font-weight: bold;
    font-size: 200%
}


#index_text01
{
	text-align:center;
}

#index_text02
{
	font-size:24px;
	color:#ae4f00;
}


.center_div_01 {
  width: auto;
  margin: 0 auto;
}

.cover_div_01 {
  width: 45%;
  float: left;
}

.text_cover_01 {
  width: 55%;
  float: left;
}

.coverimgage {
width:90%;
height: auto;
margin-top:40px;
}

.date p
 {
	 font-size:15px;
	 margin-top:-10px;
}

.button_comicPage {
  background-color: #393941; /* Green */
  border: none;
  color: #FFC18F;
  padding: 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 18px;
  margin: 4px 7px;
  cursor: pointer;
  border-radius: 12px;
  box-shadow: 0 6px #999;
  font-family:Verdana, Geneva, sans-serif;
  float:left;
  padding-bottom:20px;
  
}
.button_comicPage:hover {background-color: #2b2b2b}

.button_comicPage:active {
  background-color: #2b2b2b;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}

.changefont
{
	font-family:"Courier New", Courier, monospace;
	font-size: 18px;
	color:red;
}

.floatRight
{ float: right;} 

.adjust_box
{ height:20px;} 

/* FOOTER */
.footer {
    background: url(../img/bg.png);
    color: white;
    padding: 20px;
    box-shadow: 0 0 15px #000;
}

.footer p {
    margin: 0; padding: 0;
}

.footer a, .footer a:visited {
    color: #ffae62;
}
.footer a:hover {
    color: orange;
}

@media screen and (min-width:768px) {
    /* HEADER */
    .brand {
        background: url(../img/header.jpg) no-repeat;
        background-position-x: 50%;
        height: 134px;
    }

    .navbar-header {
        display: none;
    }

    .navbar {
        height: 85px;
        margin-bottom: 3px;
        border-radius: 0;
    }

    .navbar-nav {
        display: table;
        float: none;
        margin: 0 auto;
        table-layout: fixed;
        font-size: 1.25em;
    }

    .nav li a {
        padding: 32px 18px;
    }


    /* CONTENT */

    .splash-btn-en,
    .splash-btn-fr {
        display: block;
        width: 356px;
        height: 121px;
        margin: 150px auto;
    }

    .splash-btn-en:hover,
    .splash-btn-fr:hover {
        background-position-y: -125px;
    }
	
	


  
	
}

@media screen and (min-width:992px) {
    .nav li a {
        padding: 32px;
    }
}