/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  padding-bottom: 10px;
  color: #000000;
  background-image: url("../images/parchment2.jpg");
  background-attachment: fixed;	
}

a:{
  color: #880204;
}
a:visited {
  color: #880204;	
}
a:active {
  color: #000000;
}
a:hover {
  color:#000000;
}
footer {
  font-weight: bold; 	
}
.antispam { 
  display:none;
}

h4 {
  color: #880204;
  font-weight: bold;    
}
h5 {
	color: #880204;
	font-size: 16px;
	font-weight: bold;
}
hr {
  display: block;
  margin: auto;
  border-style: inset;
  border-width: 2px;
  color: #880204;
}
/*Video Style
-------------------------------------------------- */

/* Parallax Scroll 
-------------------------------------------------- */
.parallax {
 /* image used */
	background-image: url("../images/parchment.jpg");
	
 /* height */
	height: 1920px;

/* Parallax effect */
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

.navbar-default {
    background-color: #CD0202;
    border-color: #AA0000;
    border-radius: 0;
}

.navbar-default .navbar-brand,
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: #FFF;
}

.navbar-default .navbar-nav > li > a {
    color: #FFF;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #FFF;
	background-color: #AA0000;
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #FFF;
    background-color: #AA0000;
}

.navbar-default .navbar-text {
    color: #FFF;
}

.navbar-default .navbar-toggle {
    border-color: #AA0000;
}

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

.navbar-default .navbar-toggle .icon-bar {
    background-color: #FFF;
}
.navbar-default .navbar-nav > li > .dropdown-menu {
  background-color: #cd0202;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus {
  color: #ffffff;
  background-color: #aa0000;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > .divider {
  background-color: #aa0000;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
  color: #ffffff;
  background-color: #000;
}

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 5;	
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
  padding-right: 0;
  padding-left: 0;
}
.navbar-wrapper .navbar {
  padding-right: 15px;
  padding-left: 15px;
}
.navbar-wrapper .navbar .container {
  width: auto;
  background-color: #cd0202;	
}

/* ACCORDIAN
-------------------------------------------------- */
 .personnal{
   margin: 20px;
   color: #000000;	 
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  height: 400px;
  margin-bottom: 30px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 400px;
  background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 400px;
  margin:0 auto;	
}
.carousel-inner>.item {
    -webkit-transition: -webkit-transform 0.6s ease-in-out !important;
    -o-transition: -o-transform 0.6s ease-in-out !important;
    transition: transform 0.6s ease-in-out !important;
}

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 20px;
  text-align: center;
}
.marketing h2 {
  font-weight: normal;
}
.marketing .col-lg-4 p {
  margin-right: 10px;
  margin-left: 10px;
}



/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {
  /* Navbar positioning foo */
  .navbar-wrapper {
    margin-top: 20px;
  }
  .navbar-wrapper .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .navbar-wrapper .navbar {
    padding-right: 0;
    padding-left: 0;
  }

  /* The navbar becomes detached from the top, so we round the corners */
  .navbar-wrapper .navbar {
    border-radius: 4px;
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 20px;
    font-size: 21px;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 992px) {
  .featurette-heading {
    margin-top: 120px;
  }
}

/* Pop Up
------------------------------------------------ */
    #thover{
      position:fixed;
      background:#000;
      width:100%;
      height:100%;
      opacity: .6
    }
     
    #tpopup{
      position:absolute;
      width:300px;
      height:180px;
      background:#fff;
      left:50%;
      top:50%;
      border-radius:5px;
      padding:60px 0;
      margin-left:-320px; /* width/2 + padding-left */
      margin-top:-150px; /* height/2 + padding-top */
      text-align:center;
      box-shadow:0 0 10px 0 #000;
    }
    #tclose{
      position:absolute;
      background:black;
      color:white;
      right:-15px;
      top:-15px;
      border-radius:50%;
      width:30px;
      height:30px;
      line-height:30px;
      text-align:center;
      font-size:8px;
      font-weight:bold;
      font-family:'Arial Black', Arial, sans-serif;
      cursor:pointer;
      box-shadow:0 0 10px 0 #000;
    }

/*CodePen Popup
------------------------------------------------ */
.popup{
    width: 900px;
    margin: auto;
    text-align: center
}
.popup img{
    width: 200px;
    height: 200px;
    cursor: pointer
}
.show{
    z-index: 999;
    display: none;
}
.show .overlay{
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.66);
    position: absolute;
    top: 0;
    left: 0;
}
.show .img-show{
    width: 600px;
    height: 400px;
    background: #FFF;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden
}
.img-show span{
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 99;
    cursor: pointer;
}
.img-show img{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
/*End style*/