
body{
	font-family: 'Lato', sans-serif;
	color :#4c366e;

}
h1 {color:#e66687; margin:3% 0;}
h2 {color:#e66687; font-weight:bold;}
h3 {font-size: 1.5rem;}
h4 {font-size: 1.2rem;}

.p18 {font-size:1.15em} /*18px*/
.p14 {font-size:0.85em} /*14px}
.rose {color:#e66687;}*/

/*img, object, embed, canvas, video, audio, picture {
       max-width: 100%;
       height: auto;
	   }*/
	   
.gris { background: #e4e4e4;}
.blanc { background:#fff}
section.violet { background-color:#3c295b; color:#fff;}
section.gris, section.blanc {padding:3% 0;}
section.blanc p a, section.gris p a, section.violet p a, section.haut-page p a, li a{
    border-bottom: 1px solid;
    color: inherit;
}
section.blanc p a.btn, section.gris p a.btn, section.violet p a.btn {border-bottom:none; color: #fff;}
section.blanc p a.btn:hover, section.gris p a.btn:hover, section.violet p a.btn:hover { color: inherit;}
a, a:hover, a:focus, a:active, a.active, a:visited { color: inherit; text-decoration: none; border-bottom: 1px dotted;}

.bold {font-weight:700;}
.scroll-top {
    z-index: 1049;
    position: fixed;
    right: 2%;
    bottom: 2%;
    width: 60px;
    height: 60px;
}
.scroll-top .btn {
    width: 60px;
    height: 60px;
    border-radius: 100%;
    font-size: 35px;
    line-height: 30px!important;
}
.scroll-top .btn:focus {
    outline: 0;
}
.btn-top, .btn-top:visited {
    color: #ffffff;
    background-color: #6BC3C3;
    border-color: #6BC3C3;
}
/* Menu */
.navM {	background-color: #c2e6e6;}
.navM li a, .navM  a, .navM a:hover, .navM a:focus,.navM a:active,.navM a.active,.navM a:visited  {border:none}
.navbar {	
	background-color: #c2e6e6;
	color: #106978;
	line-height:1;
	font-size: 1.2rem;
	}
.navbar-light .navbar-nav .nav-link {color: #106978;   transition-property: font-size; /* Active la transition sur ... */
    transition-duration: 0.7s; /* La transition dure 1s */
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
font-size:1.1rem; color: #106978;}


.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link , .navbar-light .navbar-nav .active>.nav-link:hover{
     color: #3c295b; font-size:1.2rem; 
}
.navbar a img {
	display: inline-block;
    margin: 0.4rem 0 0.4rem 1.25rem;
    font-size: 1.25rem;
    line-height: inherit;
    white-space: nowrap;
}
.navbar a i {color:#fff; margin: 0.4rem 0 0.4rem 1.25rem;}
footer .footer-above {
    padding: 1% 0;
    background-color: #c2e6e6;
}
footer .footer-col {
    margin-bottom: 0px;
}

footer .footer-below {
    padding: 25px 0;
    background-color: #006978;
	
}
footer .footer-above a.a, footer .footer-above a.a:hover , footer .footer-above a.a:focus, footer .footer-above a.a:active { color:#106978 ; border-bottom:none;}	

.videoWrapper { height: 0; padding-bottom: 52.6%; padding-top: 25px; position: relative;}
.videoWrapper iframe {
	height: 100%; left: 0; position: absolute; top: 0; width: 100%;
}
/* accueil--------------*/
.entete-accueil {
	height:170px; 
}
/*.entete-accueil .logo {padding-left:8.5%}*/
.accueil {
	background-image: url("images-mathador-V4/fond-accueil.png");
	background-repeat: no-repeat;
	background-position: top center; 
}

.accueil h2 {
	color:#fff;
    font-size: 2.3rem;
    font-weight: bold;}
.accueil a, .accueil a  i.fab, .accueil a:hover, .accueil a:visited {color:#fff; text-decoration:none;}

 .jeux-acc h2 span.decale {font-weight:300; padding-left:37%}
#L1-accueil .container, #L2-accueil .container, #L3-accueil .container {padding:0!important; }

/* page numérique*/

.numerique .fond-classe {
	background-image: url("images-mathador-V4/fond-num-classe.png");
	background-repeat: no-repeat;
	background-position: top center; 
}
.numerique h2.rose { color:#e66687;
	margin: 9% 0 0;
    font-size: 3rem;
    font-weight: bold;}
h2.rose .h2-classe {font-weight:300; font-size:4.5rem}
.numerique h2{color:#3c295b ;
	padding:0;
	margin:0;
    font-size: 3.4rem;
    font-weight: bold;} 

.btn {padding: 0.7rem;
    font-size: 1.2rem;
    margin: 0.4rem;
}
.btn:hover, .btn:active, .btn:focus { color: #3c295b; }
.btn:focus { box-shadow: none!important;}
.btn-vert, .btn-vert:visited  {color:#fff; background-color:#7e8b0c; width:140px;}
.btn-vert-lg, .btn-vert-lg:visited  {color:#fff; background-color:#7e8b0c;}
.btn-bleu, .btn-bleu:visited  {color:#fff; background-color:#2b8896; width:140px;}
.btn-bleu-lg, .btn-bleu-lg:visited  {color:#fff; background-color:#2b8896; }
.btn-rouge, .btn-rouge:visited  {color:#fff; background-color:#b7474c; width:140px;}
.btn-rouge-lg, .btn-rouge-lg:visited  {color:#fff; background-color:#b7474c; }
.btn-orange, .btn-orange:visited  {color:#fff; background-color:#d66330; width:140px;}
.btn-orange-lg, .btn-orange-lg:visited  {color:#fff; background-color:#d66330; }
.btn-orange-200, .btn-orange-200:visited  {color:#fff; background-color:#d66330;width: 200px;}
.btn-jeu {background-image: url("images-mathador-V4/fond-jeu-en-ligne.png"); 
	background-repeat: no-repeat;
	background-position: center 10px;
    padding: 52px 0 5px 0;
    width: 155px;
    margin: 0 0.5em 0.5em 0;}
.btn-app {background-image: url("images-mathador-V4/fond-app.png"); 
	background-repeat: no-repeat;
	background-position: center 10px;
    padding: 52px 0 5px 0;
    width: 155px;
    margin: 0 0.5em 0.5em 0;}
.btn-md {
    font-size: 1rem;
    margin: 0.2rem 0 ;
    padding: 0.5rem;
}
.numerique p {line-height: 1.2em}
.numerique .solo {
	background-image: url("images-mathador-V4/fond-num-solo2.png");
	background-repeat: no-repeat;
}
.numerique .chrono {
	background-image: url("images-mathador-V4/fond-num-chrono2.png");
	background-repeat: no-repeat;
}
.numerique .chrono .texte-chrono {padding-right:140px;	}

.marg-menu {margin-top:30px; padding-top:10px;}
/* page classe ---*/
.titre-classe h1, .titre-jeux h1, .titre h1, .numerique h1 {color:#106978; font-size: 2rem; font-weight:300; margin:0 0 3%;}
.numerique h1 {margin:0 0 1%;}
.fond-classeT {
	background-image: url("images-mathador-V4/fond-transp-classe.png");
	background-repeat: no-repeat;
	background-position: top center; 
	margin-bottom: 3%;
}
.classe-conc {margin-bottom: 3%;}
.fond-classeT  h2, .classe-conc h2 { color:#e66687;
	margin: 8% 0 0;
    font-size: 3rem;
    font-weight: bold;}
.classe-conc h2 {margin-top:8.9%; line-height:1.83em;}

.btn-outline-primary, .btn-outline-primary:disabled {
    color: #3c295b;
    border-color: #3c295b;
	background-color: #fff;
}
.btn:disabled {color:#2b8896; font-weight:700; opacity:1;}
.btn-outline-primary:not(:disabled):not(.disabled):hover, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: #3c295b;
    border-color: #3c295b;
}
.deux-lignes {line-height:2.95em}
.card-title a {color: #4c366e; border-bottom:none;}
.blanc .card-header {   background-color: #e4e4e4; }
.change {font-size:0.9rem; margin :0.2rem 0; padding:0.2rem 0 0 }
/* pop in selfie */
#selfie .modal-dialog {max-width:90%}*/

/* page jeux et activités ----------*/
.titre-jeux {margin-bottom:3%}
.titre-jeux h2 a {color:#4c366e; font-weight:400; font-size:1.4rem; margin-top:2%; border:none;}
.titre-jeux img { margin:6% 0 0;}
.jeux h2 {color:#4c366e; margin:0;}
.encart-gris {border-top: 8px solid #b1a9bd; background-color:#e4e0e9; padding-top:5%; margin-right:15px}
.encart-gris p {font-size:1.15rem; line-height: 1.3em}
.encart-gris .btn-bleu {width:90%}
.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%234c366e' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}
.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%234c366e' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}
	/*bouton carrousel bte mathador*/
#Mathador-Carousel  .carousel-control-next{ right:-80px}
#Mathador-Carousel  .carousel-control-prev{ left:-80px}

/* pages chrono et solo*/
iframe#solo, iframe#chrono {max-width:100%;}


@media (min-width:992px) { /* en dessous passage au menu burger */
    .navbar {	max-height:30px ;	}
	
	.navbar-expand-lg .navbar-nav .nav-link {   padding-right: 1.4rem;}
	/*.accueil .container { max-width: 960px; }*/
	.entete-accueil .logo {padding-right:7%}
		#L1-accueil {
		background-image: url("images-mathador-V4/fond-L1.png");
		background-repeat: no-repeat;
		background-position: top center; 
		width:100%;
		height:auto;
}

	#L2-accueil {
		background-image: url("images-mathador-V4/fond-L2.png");
		background-repeat: no-repeat;
		background-position: top center; 
		height:auto;
		width:100%;
}

	 #L3-accueil {
		background-image: url("images-mathador-V4/fond-L3.png");
		background-repeat: no-repeat;
		background-position: top center; 
		height:auto;
		width:100%;
	}
	.gd-fin {font-size : 3rem; font-weight:300;}
	.num-acc {background-image: url("images-mathador-V4/mathador-numerique-2.png");
	background-repeat: no-repeat;
	background-position: top right;
	height:240px;
	margin-bottom: 20px;
	border-right:20px solid transparent; }
	.num-acc h2 {padding: 25% 0 0 5%; line-height:0.9em;}
	.jeux-acc {background-image: url("images-mathador-V4/jeux-de-societe-activites-2.png");
		background-repeat: no-repeat;
	background-position: top left;
	margin-bottom: 20px;
	height:240px; }
	.jeux-acc h2 {padding: 5% 0 0 18%; line-height:0.9em;}
	.actu-acc {background-image: url("images-mathador-V4/fond-actu-semaine-maths-2021.png");
	background-repeat: no-repeat;
	background-position: top right;
	height:200px;
	margin-bottom: 20px;
	/*padding: 0 20px 0 0 ;*/
	border-right:20px solid transparent; }
	.actu-acc h2 {padding:33% 0 0 24% ;line-height:1.1em; }
	.principe-acc {background-image: url("images-mathador-V4/principe-mathador-2.png");
	background-repeat: no-repeat;
	background-position: top right;
	height:200px;
	margin-bottom: 20px;
	padding: 0 20px 0 0 ;
	border-right:20px solid transparent; }
	.principe-acc h2 {padding: 3% 0 0 ;}
	.classe-acc {background-image: url("images-mathador-V4/mathador-Classe-et-concours-2.png");
		background-repeat: no-repeat;
	background-position: top left;
	margin-bottom: 20px;
	height:200px; }
	.classe-acc h2 {padding: 3.5% 0 0 3%; line-height:0.9em;}
	.rech-acc {background-image: url("images-mathador-V4/fond-recherche.png");
		background-repeat: no-repeat;
	background-position: top right;
	margin-bottom: 20px;
	height:160px; 
	}
	.rech-acc h2 {padding:15% 0 0 25%;line-height:0.9em; }
	.twitter-acc, .facebook-acc {background-image: url("images-mathador-V4/fond-RS.png");
		background-repeat: repeat-x;
	background-position: top center;
	margin-bottom: 20px;
	text-align:center;
	height:160px; 
	
	}
	.twitter-acc {border-left:20px solid #fff; border-right:1px solid #fff; padding:0;}
	.facebook-acc {border-left:1px solid #fff; border-right:20px solid #fff; padding:15% 0 0;}
	.twitter-acc h2 {padding: 15% 0 5% ; font-weight:300; font-size: 1.8rem;}
	.facebook-acc h2 {padding: 10% 0 5%; font-weight:300; font-size: 1.8rem;}
	.blog-acc {background-image: url("images-mathador-V4/Le-blog-mathador-2.png");
		background-repeat: no-repeat;
	background-position: top left;
	margin-bottom: 20px;
	height:160px; 
	}
	.blog-acc h2 {padding: 22% 0 0 20%; font-weight:300;}
	.svg-acc {margin:0 10%}

/*numérique*/
	.numerique .solo {
		background-position: 140px 0; 
		padding:4% 0 0 0;
	}
	.numerique .chrono {
		background-position: 25px 110px; 
		padding:9% 0 0 0;
	}
	.numerique .flash {padding: 0 0 0 5%}	
	.numerique .classe {padding: 5% 0 0 }

/* classe*/
.classe-conc h2 { line-height:1.8em;}
.fond-classeT  h2, .classe-conc h2 { margin: 6% 0 0;}
#tarifs .btn {margin:0}
/*page 20ans*/
.defi-20ans .modal-dialog {max-width:60%}

}

@media (min-width:991.98px) and (max-width:1199.98px) {
	.accueil h2 {	font-size: 2rem; }
	.num-acc h2 { padding: 28% 0 0 ;}
	.rech-acc h2 {padding: 22% 0 0 10%;line-height:0.9em;}
	.classe-acc h2 { padding: 4% 0 0 3%;}
	.blog-acc h2 {padding: 25% 0 0 20%; }
	.actu-acc h2 {padding: 40% 0 0 15%;}
	.twitter-acc, .facebook-acc {width:165px;}
	.twitter-acc h2, .facebook-acc h2{font-size: 1.8rem; }
	.numerique .chrono .texte-chrono {padding-right:70px;	}
	.fond-classeT  h2, .classe-conc h2 { margin: 8% 0 0;}
	.navbar-expand-lg .navbar-nav .nav-link {padding-right: 0.8rem;}
}
@media (max-width:991.98px) {
	/*menu*/
	.dropdown-menu { background-color:inherit; border:none;}
	/* accueil*/
	.accueil .container, #L1-accueil .container, #L2-accueil .container, #L3-accueil .container {max-width:100%; }
	.gd-fin {font-size : 3rem; font-weight:300;}
	.num-acc {background-image: url("images-mathador-V4/mathador-numerique-2.png");
		background-repeat: no-repeat;
	background-position: top center;
	height:240px;
	background-size:contain; }
	.num-acc h2 {margin: 0; padding-top:22%; }
	.accueil div.violet  {background : url("images-mathador-V4/fond-L1-col1.png") repeat-x ; text-align:center!important; margin-bottom:20px;}
	.jeux-acc {background-image: url("images-mathador-V4/jeux-de-societe-activites-2.png");
	background-repeat: no-repeat;
	background-position: top left;
	background-size:contain;
	height:240px; }
	.accueil div.orange {background : url("images-mathador-V4/fond-L1-col2.png") repeat-x ; margin-bottom: 20px; text-align:center!important;}
	.jeux-acc h2 {padding: 3% 0 0 8%; line-height:0.9em;}
	.actu-acc {background-image: url("images-mathador-V4/fond-actu-semaine-maths-2021.png");
	background-repeat: no-repeat;
	background-position: top right;
	height:200px;
	margin-bottom: 20px;
	/*padding: 0 20px 0 0 ;*/
	 }
	.actu-acc h2 {padding:20% 0 0 20% ; /*line-height:1.1em;*/ }
.principe-acc {background-image: url("images-mathador-V4/principe-mathador-2.png");
	background-repeat: no-repeat;
background-position: top right;
background-size:contain;
height:200px;
padding: 0 20px 0 0 ;
 }
.principe-acc h2 {padding: 3% 0 0 8%;line-height:0.9em;text-align:left!important;}
.classe-acc {background-image: url("images-mathador-V4/mathador-Classe-et-concours-2.png");
	background-repeat: no-repeat;
background-position: top left;
background-size:contain;
height:200px; }
.classe-acc h2 {padding: 2% 0 0 3%; line-height:0.9em;}
.accueil div.rose {background : url("images-mathador-V4/fond-L2-col2.png") repeat-x ; text-align:center!important; margin-bottom:20px;}
.rech-acc {background-image: url("images-mathador-V4/fond-recherche.png");
	background-repeat: no-repeat;
background-position: top right;
background-size:contain;
height:160px; 
}
.rech-acc h2 {padding: 5% 0 0 ;/*line-height:0.9em;*/}
.accueil div.vert {background : url("images-mathador-V4/fond-L3-col1.png") repeat-x ; text-align:center!important; margin-bottom:20px;}
.twitter-acc, .facebook-acc {background-image: url("images-mathador-V4/fond-RS.png");
		background-repeat: repeat-x;
	background-position: top center;
text-align:center;
height:160px; 
}
.twitter-acc { border-right:1px solid #fff; padding:0;}
.facebook-acc {border-left:1px solid #fff; padding:8% 0 0;}
.twitter-acc h2 {padding: 8% 0 1% 0; font-weight:300;}
.facebook-acc h2 {padding:3% 0 0; font-weight:300;}
.accueil div.bleu {background : url("images-mathador-V4/fond-RS.png") repeat-x ; text-align:center!important; margin-bottom:20px;}
.blog-acc {background-image: url("images-mathador-V4/Le-blog-mathador-2.png");
	background-repeat: no-repeat;
background-position: top left;
background-size:contain;
height:160px; 
}
.blog-acc h2 {padding: 5% 0 0 10%; font-weight:300;}
.marg-menu{margin-top:96px;}	
	/* numérique*/
	.numerique .solo {
	background-image: url("images-mathador-V4/fond-num-solo2-mob.png");	
	background-position: 200px 50px; 
	padding: 5% 0 5% 10%;
	}
	.numerique h2.vertS	{margin: 5% 0 0;}
	.numerique .chrono {
		background-position: 35% 29%; 
		padding:5% 0 0 0;
	}
	.numerique .chrono .texte-chrono {padding-right:29%;	}
	.numerique .chrono .btn-chrono {text-align:center!important; }

	.numerique .flash {text-align:center!important; padding-top: 10%; }
	.numerique .classe {padding-top: 0; }
	/* classe */
	.fond-classeT  h2, .classe-conc h2 { margin: 4.7% 0 0;}
	
}


@media (max-width: 768px){
	.accueil h2 {font-size:3rem;}
	.gd-fin {font-size : 3.5rem; font-weight:300;}
	.rech-acc {background-position: top center; }
	.rech-acc h2 { padding: 3% 0 0 15%; line-height: 1.2em; text-align: left!important;}
.num-acc h2 {padding-top:18%}
.blog-acc {background-size:auto; background-position: 60% 0%;}	
.blog-acc h2 {padding: 10% 0 0 5%;	}
.principe-acc h2 { padding: 3% 12% 0 0;  line-height: 1.2em; text-align: center!important; }
.numerique h2.rose {font-size:2.5rem;   margin: 5% 0 0;}
h2.rose .h2-classe { font-size:3.5rem}
.fond-classeT h2, .classe-conc h2 {  margin: 8% 0 0;}
.numerique .chrono .texte-chrono {padding-right:23%;}
.numerique .chrono {background-position: 26% 15%; padding: 0 0 10% 0; }
.numerique .solo {background-image: url("images-mathador-V4/fond-num-solo2-mob.png");  background-position: 285px 80px;}
.numerique .flash { padding-top: 0; }
.deux-lignes {line-height:1.5em}
.encart-gris {margin: 0 0 5% 0;}
.btn-orange-200 {width: 100%;}
}
@media (max-width: 576px){
.gd-fin {font-size : 2.5rem; font-weight:300;}
.accueil div.violet, .accueil div.orange, .accueil div.rose, .accueil div.vert, .accueil div.bleu { margin-bottom:12px;}	
.logo {padding: 0 1rem 0 2rem}
.num-acc {background-image: url("images-mathador-V4/mathador-numerique-phone.png"); background-size:auto; height:112px; }
.jeux-acc {background-image: url("images-mathador-V4/jeux-de-societe-activites-phone.png"); background-size:auto; height:112px; background-position: top right;  }
.actu-acc {background-image: url("images-mathador-V4/fond-actu-semaine-maths-2021-phone.png");
	background-repeat: no-repeat;
	background-position: top right; background-size:auto;
	height:112px;
	 }

.principe-acc {background-image: url("images-mathador-V4/principe-mathador-phone.png" );background-size:auto; height:112px; background-position: 80% 0%;}
.classe-acc {background-image: url("images-mathador-V4/mathador-Classe-et-concours-phone.png"); background-size:auto; height:112px; background-position: 20% 0%; padding: 0 0 0 20%; }
.rech-acc {background-size:auto; height:112px; background-position: top right;}
.twitter-acc, .facebook-acc { height:112px; padding-top:5%;}
.blog-acc {background-size:auto; height:112px;background-position: 60% 0%;}
.twitter-acc h2,.facebook-acc h2 {padding : 0; font-size:1.8rem;}
 .jeux-acc h2 { text-align: left; padding: 6% 0 0 8%; font-size: 1.8rem; line-height: 1em;}
 .jeux-acc h2 span.decale {padding-left:25%}
 .actu-acc h2 {font-size: 1.8rem; padding:22% 0 0 18% ;line-height:1.1em; text-align:left!important; }
 .principe-acc h2 {font-size: 1.8rem; line-height: 1.2em; padding-top: 5%;}
.num-acc h2 {margin: 0;  padding-top: 17%;  line-height: 1em;  font-size: 1.8rem; }
#Mathador-Carousel  .carousel-control-prev, #Mathador-Carousel  .carousel-control-next { display: none;}
.classe-acc h2 {text-align:right;font-size: 1.8rem; line-height: 1.2em; padding: 2% 5% 0;font-size: 1.8rem;}
.blog-acc h2 { padding: 15% 0 0 ; font-size: 1.8rem;}
.rech-acc h2 { font-size: 1.8rem; padding: 5% 0 0 8%;  text-align: left!important; line-height: 1em;}
.fond-classeT h2, .classe-conc h2 {  margin: 10% 0 0;}
.numerique .chrono .texte-chrono {padding-right:15%;}
.numerique .chrono {padding-top:10% ; background-position: 22% 25%; }
.numerique .solo {padding-top:5% ; padding-bottom:5%; background-position: 210px 40px;}
.numerique h2.rose {margin: 5% 0 0;}
.deux-lignes {line-height:1.5em}
.encart-gris {margin:5% 0;}
.encart-gris .btn-bleu {width:60%}
.encart-gris .col-6 p {word-wrap: break-word; -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  hyphens: auto;
}
.btn-orange-200 {width: 60%; font-size:1.1em}
}
@media (max-width: 376px){
	.numerique .solo {padding:5% 0 5% 5%;     background-position: 190px 40px;}
	.numerique .chrono {background-position: 18% 25%; }
}

