@font-face {
    font-family: GlacialIndifference;
    src: url('../../fonts/GlacialIndifference-Regular.otf');
}

@font-face {
    font-family: FontAwesome;
    src: url('../../fonts/fontawesome/webfonts/fa-solid-900.ttf');
}

@font-face {
    font-family: Orkney;
    src: url('../../fonts/Orkney_Regular.eot');
    src: url('../../fonts/Orkney_Regular.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Orkney_Regular.woff2') format('woff2'),
         url('../../fonts/Orkney_Regular.woff') format('woff'),
         url('../../fonts/Orkney_Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'pajarita';
  src:  url('../../fonts/pajarita/pajarita.eot?sk23xk');
  src:  url('../../fonts/pajarita/pajarita.eot?sk23xk#iefix') format('embedded-opentype'),
    url('../../fonts/pajarita/pajarita.ttf?sk23xk') format('truetype'),
    url('../../fonts/pajarita/pajarita.woff?sk23xk') format('woff'),
    url('../../fonts/pajarita/pajarita.svg?sk23xk#pajarita') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'pajarita' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-icone-pajarita:before {
  content: "\e900";
}


body{
	padding-top: 50px;
	background-color: #EEE;
}

*z{
	border: 1px solid red;
}

.col{
}

.row{
	margin-bottom:2em;
}

.row-pres{
	width: 95%; 
	margin: 0 auto;
}

a{
	color: #28A745;
	text-decoration: underline;
}

a.bg-dark, .nav-item a, a.btn, .btn a{	
	text-decoration: none;
}

a:hover{
	color: #218838;
}

.row, .col, div[class|=col]{
	margin-bottom: 0;
	margin-top: 0;
}

divz[class|=col]{
	background-color: #778899;
	/**margin: 1rem;**/
	border: 1px solid red;
}

/* spacing between middle columns */
.row.wide-gutter [class*='col-']:not(:first-child):not(:last-child) {
  padding-right:20px;
  padding-left:20px;
}

.time{
	margin-bottom: 1rem !important;
}

.jb_home{
	background: url('../../images/photo1-1.jpg');
}

.jb_profil{
	background: url('../../images/photo2-1.jpg');
}

.jb_competences{
	background: url('../../images/photo3-1.jpg');
}

.jb_parcours{
	background: url('../../images/photo-parcours.jpg');
}

.jb_formation{
	background: url('../../images/photo-formation.jpg');
}

.jb_portfolio{
	background: url('../../images/photo-portfolio.jpg');
}

.jb_meconnaitre{
	background: url('../../images/photo-meconnaitre.jpg');
}

.jb_about{
	background: url('../../images/photo-about.jpg');
}

.jb_mentions{
	background: url('../../images/photo-mentions.jpg');
}

.jb_contact{
	background: url('../../images/photo-contact.jpg');
}

.jb_links{
	background: url('../../images/liens.jpg');
}

.jb_vudailleurs{
	background: url('../../images/photo-vudailleurs.jpg');
}

.jumbotron{
	color: #FFF;
	background-color: #000;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.tag_idx{
	color: #343A40;
	/**color: #FFF;**/
	padding: 0 0.25rem !important;
	border-radius: 0.25rem !important;
	background-color: #FFC107;
	/**background-color: #17A2B8;*/
	margin: 0.25rem 0 !important;
	display: inline-block;
}

.footer{
  position: auto;
  width: 100%;
  bottom: 0;
  padding-top: 0.2rem;
	background-color: #A9A9A9;
}

.footer p{
	margin: 0;
	margin-bottom: 0.1rem;
	font-size: 0.8rem;
}

.footer a, .CV a{
	color: inherit;
}

.footer a:hover{
	text-decoration: underline;
}
  
  .footer h6{
	  margin-top: 1rem;
  }
	

.reseaux{
	display: table;
	width: 50%;
	margin: 0px auto;
	font-size: 1em;
	padding: 0;
}

.reseaux li{
	display: table-cell;
	text-align: center;
}

.reseaux .fab, .reseaux .fas{
	font-size: 1.5em;
}

.reseaux a, .mentions a, #accordionFAQ .btn-link{
	color: #000;
	text-decoration: none;
}

.reseaux a:hover, .mentions a:hover, #accordionFAQ .btn-link:hover{
	/*color: rgba(0, 0, 0, 0.5);*/
	text-decoration: none;
}

.mentions{
	width: 100%;
	text-align: center;
	margin: 0.5em;
}

h1{
	font-size: 1.8rem;
	font-family: GlacialIndifference;
}

h2{
	font-size: 1.5rem;
	margin-bottom: .75rem;
}

p+h2, ul+h2{
	margin-top: 1.5rem;
}

h3{
	font-size: 1rem;
}

p{
	font-family: Orkney;
}

.progress{
	height: 20px;
	background-color: #DCDCDC;
	margin: 0.5em auto;
	font-size: .8rem;
}

.progress-bar{
	text-align: left;
	padding-left: .5em;
}

.competences .bg-warning, .competences .bg-danger{
	color: #000;
}

.bg-warning, .bg-danger, .bg-info, .bg-success{
	border-radius: inherit;
}

.bg-danger a, .bg-info a, .bg-success a{
	color: #FFF;
	text-decoration: underline;
}

.bg-warning a{
	color: #343A40;
	text-decoration: underline;
}

.bg-warning a:hover, .bg-danger a:hover, .bg-info a:hover, .bg-success a:hover{
	color: #EEE;
}

.progress-bar span{
}

.lgd_competences{
	margin: .5rem 0;
	padding: 0.4rem;
	line-height: 1;
    border-radius: .25rem;
	font-size: .8rem;
}

.competences p, .competences ul{
	font-size: 80%;
}

.nav-archives {
    width: 100%;
    text-align: center;
    margin-top: -1rem;
    margin-bottom: 1rem;
}

.archive-photo{
	margin-bottom: 1rem;
}

.archive-photo img{
	max-width: 100%;
	padding: .25rem;
    /**background-color: rgba(255, 255, 255, 0.5);**/
    /**border: 1px solid rgba(255, 255, 255, 0.5);**/
    border-radius: .5rem;
    height: auto;
    opacity: 1;
	display: block;
	transition: .5s ease;
	backface-visibility: hidden;
}

.figure-caption{
	color: #000;
	text-align: right;
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.img-fade:hover img {
  opacity: 0.3;
}

.img-fade:hover .middle {
  opacity: 1;
}

.text {
  /**background-color: rgba(255, 255, 255, 0.7);**/
  //*color: #000;**/
  font-size: 01rem;
  padding: 0.5rem 1rem;
}

.ico-pf img{
	background-color: transparent;
}

.ico-pf .figure-caption{
	text-align: center;
	font-size: 1.5rem;
	width: 100% !important;
}

.ico-pf .figure{
	display: block;
}

.pf-cine img{
    background-color: rgba(0, 123, 255, 1);
}

.pf-cine .text{
    background-color: rgba(0, 123, 255, 0.7);
  color: #FFF;
}

.pf-zic img{
    background-color: rgba(108, 117, 125, 1);
}

.pf-zic .text{
    background-color: rgba(108, 117, 125, 0.7);
  color: #FFF;
}

.pf-stv img{
    background-color: rgba(40, 167, 69, 1);
}

.pf-stv .text{
    background-color: rgba(40, 167, 69, 0.7);
  color: #FFF;
}

.pf-pod img{
    background-color: rgba(220, 53, 69, 1);
}

.pf-pod .text{
    background-color: rgba(220, 53, 69, 0.7);
  color: #FFF;
}

.pf-jeu img{
    background-color: rgba(255, 193, 7, 1);
}

.pf-jeu .text{
    background-color: rgba(255, 193, 7, 0.7);
  color: #343A40;
}

.pf-ori img{
    background-color: rgba(23, 162, 184, 1);
}

.pf-ori .text{
    background-color: rgba(23, 162, 184, 0.7);
  color: #FFF;
}

.pf-mis img{
    background-color: rgba(52, 68, 64, 1);
}

.pf-mis .text{
    background-color: rgba(52, 68, 64, 0.7);
  color: #FFF;
}

.rounded-bottom{
	margin-bottom: 2rem;
}

.bloc-texte, .h-titre{
	background-color: rgba(255, 255, 255, 0.8);
}

.h-titre{
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	padding-left: 1rem;
	padding-right: 1rem;
	margin: 0 auto;
	border-bottom: 1px dotted #6C757D;
	/*margin: auto 0.1em;*/
}

.bloc-texte{
	padding: 1rem;
	/*height: 100%;*/
}

.badge{
	padding: 0.4rem 0.6rem;
	font-size: 0.9rem;
}

.formation .badge{
	margin-right: 0.5rem;
}

.competences .bg-success{
	background-color: #333 !important;
}

.competences .bg-info{
	background-color: #666 !important;
}

.competences .bg-warning{
	background-color: #999 !important;
}

.competences .bg-danger{
	background-color: #CCC !important;
}

.back-to-top{
	background: none;
	margin: 0;
	position: fixed;
	bottom: 0;
	right: 0;
	width: 70px;
	height: 70px;
	z-index: 100;
	display: none;
	text-decoration: none;
	color: #FFF;
	/*background-color: #ff9000;*/ 
} 

.back-to-top a{
	color: #FFF;
}

.back-to-top a:hover, .back-to-top .fa-stack:hover, a.back-to-top:hover{
	color: #FFF;
}
 
.back-to-top span{
	font-size: 30px; 
}

.back-to-top .fa-arrow-up{
	color: #343A40;
}
	
.liste-sites{
	list-style-type: none;
	padding-left: 0;
}

.liste-sites li{
	margin-bottom: 0.4rem;
}

.list-budget, .list-budget ul{
	list-style-type: none;
}

.list-budget li{
	margin-bottom: 0.5rem;
}

.list-budget li::before {
    font-family: FontAwesome;
    content: "\f0da";
    margin-right: 0.5em;
    color: #666;
}

.list-budget ul li::before{
    color: #A9A9A9;
}

#accordionRumilly .btn-link::before {
    font-family: FontAwesome;
    content: "\f077";
    margin-right: 1em;
    color: #A9A9A9;
}

#accordionRumilly .btn-link{
	font-size: 1.2rem;
	text-decoration: none;
}

#accordionRumilly .btn-link.collapsed::before {
    content: "\f078";
    color: #343A40;
}	

#accordionRumilly{
	margin: 0 -1rem -1rem;
}

#accordionRumilly *{
	border-radius: 0;
}

#accordionRumilly .card{
	border-left: none;
	border-right: none;
	border-bottom: none;
}

#accordionRumilly .card-header{
	padding: 0.25rem 0.75rem;
}

#accordionRumilly .btn-link{
    color: #A9A9A9;
	font-weight: bold;
}
#accordionRumilly .btn-link.collapsed{
    color: #343A40;
}
	
.mulhouse{
	font-size: 1.25rem;
	font-weight: 300;
	margin-bottom: 1rem !important;
	color: #343A40 !important;
}

.vudailleurs .twt{
	background-color: transparent;
	border: none;
}
	

@media (min-width: 768px) {
  .footer{
	  position: fixed;
  height:100px;
  }
  
  .footer h6{
	  margin-top: auto;
  }

body{
	margin-bottom: 100px;
}

a{
	text-decoration: none;
}

.ico-pf .figure{
	display: inline-block;
}

}