/**
 * Voici une feuille de style type, bien entendu vous pouvez ajouter
 * ou supprimer des propriétés CSS en fonction de vos besoins.
 */

@import url('https://fonts.googleapis.com/css?family=Aclonica&display=swap');

html {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

/** Barre de téléchargement */
#fixed {
  width: 25%;
  position: fixed;
}
#dev {
  margin-top: 50px;
}

/* Petits média */
@media (max-width: 783px) {
/*  #go {
  margin-top: 50px;
  }*/
  #fixed {
    display: flex;
    justify-content: center;
    position: relative;
    width: auto;
  }
  #dev {
  margin-top: 100px;
}

}

@media (min-width: 783px) {
  #portfolio, #features, #temoignages  {
  margin-top: 230px;
  margin-bottom: 50px;
  padding-top:30px;
  }  
}
  

/*Images features*/
.features img {
  float: left;
  margin: 0 10px;
} 

/*Zoom Logo*/
.zoom {
	width: auto;
	height: auto;
	margin-left:auto;
	margin-right:auto;
}
.image {
  text-align: center;
}


.image img {
  /* La transition s'applique à la fois sur la largeur et la hauteur, avec une durée d'une seconde. */
  -webkit-transition: all 1s ease; /* Safari et Chrome */
  -moz-transition: all 1s ease; /* Firefox */
  -ms-transition: all 1s ease; /* Internet Explorer 9 */
  -o-transition: all 1s ease; /* Opera */
  transition: all 1s ease;
}
.image:hover img {
  /* L'image est grossie de 25% */
  -webkit-transform:scale(1.25); /* Safari et Chrome */
  -moz-transform:scale(1.25); /* Firefox */
  -ms-transform:scale(1.25); /* Internet Explorer 9 */
  -o-transform:scale(1.25); /* Opera */
  transform:scale(1.25);
}




// News
.newsTitle {
	color: red !important;
}

#fixed button {
	width: 150px !important;
    margin: 10px 5px 10px 5px;
}

row button:hover {
	background-color: rgba(255, 255, 255, .4);
	text-decoration: none;
}
button#downloadStable {
	background-color: rgba(46, 204, 113, .6);
}
button#downloadStable:hover {
	background-color: rgba(46, 204, 113, .8);
}
button#downloadBeta {
	background-color: rgba(46, 204, 255, .6);
}
button#downloadBeta:hover {
	background-color: rgba(46, 204, 255, .8);
}
button#demoLive {
	background-color: rgba(231, 76, 60, .8);
}
button#demoLive:hover {
	background-color: rgba(231, 76, 60, .6);
}


/* GitHub bandeau */
#forkongithub a{
	background:#2C4B6D;
	color:#fff;
	text-decoration:none;
	font-family:arial,sans-serif;
	text-align:center;
	font-weight:bold;
	padding:5px 40px;
	font-size:0.7rem;
	line-height:1.2rem;
	position:relative;
	transition:0.5s;}
#forkongithub a:hover{
	background:#c11;
	color:#fff;
}
#forkongithub a::before,#forkongithub a::after{
	content:"";
	width:100%;
	display:block;
	position:absolute;
	top:1px;
	left:0;
	height:1px;
	background:#fff;
}
#forkongithub a::after{
	bottom:1px;
	top:auto;
}
@media screen and (min-width:800px){
	#forkongithub{
		position:fixed;
		display:block;
		top:-30px;
		right:0;
		width:200px;
		overflow:hidden;
		height:200px;
		z-index:9999;
	}
	#forkongithub a{
		width:200px;
		position:absolute;
		top:60px;
		right:-60px;
		transform:rotate(45deg);
		-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
		-moz-transform:rotate(45deg);
		-o-transform:rotate(45deg);
		box-shadow:4px 4px 10px rgba(0,0,0,0.8);
	}
}


/**
 * Éléments principaux
 */


/* 
* Grille du site
* Barres et page
*/
#contentLeft {
}
#contentRight {
}
#contentSite {
}

/* Bannière */
header {
}

/* Titre de la bannière */
header span {
}

/* Menu */
nav {
}

/* Items du menu */
nav a {
}

/* Items au survol du menu */
nav a:hover {
}

/* Item courant du menu */
nav a.active {
}

/* Menu latéral */
/* aspect des puces */
ul #menuSide  {
} 
/* Block menu à droite */
#menuSideRight {
}
/* Block menu à gauchle */
#menuSideLeft {
}


/* Bas de page */
footer {
}

footer #footersite, #footerbody {
}

/* Liens du bas de page */
footer #footersite, #footerbody a {
}

/* footer bloc gauche */
footer #footersiteLeft, #footerbodyLeft  {
}

/* footer bloc central */
footer #footersiteCenter, #footerbodyCenter {
}

/* footer bloc droite */
footer #footersiteRight, #footerbodyRight {
}



/**
 * Éléments de contenu
 */

/* Titres */
h1,
h2,
h3,
h4 {
}

/* Liens */
a {
}

/* Liens au survol */
a:hover {
}

/* Liens au clic */
a:active {
}

/* Boutons */
.button,
button[type='submit'],
.pagination a {
}

/* Boutons au survol */
.button:hover,
button[type='submit']:hover,
.pagination a:hover {
}

/* Boutons au clic */
.button:active,
button[type='submit']:active,
.pagination a:active {
}

/* Cases à cocher */
input[type='checkbox']:checked + label:before {
}

/* Cases à cocher au survol */
input[type='checkbox']:not(:active):checked:hover + label:before,
input[type='checkbox']:active + label:before {
}

/* Champs de formulaire */
input[type='text'],
input[type='password'],
.inputFile,
select,
textarea {
}

/* Champs de formulaire au survol */
input[type='text']:hover,
input[type='password']:hover,
.inputFile:hover,
select:hover,
textarea:hover {
}

/* Modules News et Blog */

.blogDate {
}

.blogPicture {
}

.blogPicture img {
}

.blogComment {
}

.blogTitle {
}

.blogContent {
}

.newsTitle {
    /*background-color: grey;*/
}

.newsContent {
}

.newsDate {
    color:	lightgrey;
}

.newsSignature {
    color: 	lightgrey;
}

