@charset"UTF-8";

/* MATERIAL ICONS EN LOCAL */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(commun/assets/fonts/MaterialIcons-Regular.woff2) format('woff2'),
    url(commun/assets/fonts/MaterialIcons-Regular.woff) format('woff'),
    url(commun/assets/fonts/MaterialIcons-Regular.ttf) format('truetype');
	font-display: swap;
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}

/* GOOGLE FONT ROBOTO EN LOCAL */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url(commun/assets/fonts/roboto-ext.woff2) format('woff2');
  font-display: swap;

}

/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url(commun/assets/fonts/roboto.woff2) format('woff2');
  font-display: swap;
}

html, body {
  font-family: 'Roboto', 'Helvetica', sans-serif;
}
body {
  margin: 0;
  background-color: #fff;
}

/* Disable ugly boxes around images in IE10 */
a img{
  border: 0px;
}

::-moz-selection {
  background-color: #fff;
  color: #fff;
}

::selection {
  background-color: #fff;
  color: #fff;
}

.logotop {
	height: 120px;   
    padding:8px 8px 0 0;
	} 
	
.mdl-layout__header {
background-color: #fff;
}
.mdl-layout__header-row .mdl-navigation__link {
color: #3c4249;
}

.mdl-layout__container {

}
.mdl-grid {
    margin: 80px 0 0 0;
}
.grid-bgimg-1 {
	background: url('portfo/images/bgimg1.jpg') center / cover;
}
.img-cell{
background: url('portfo/images/accueil.png') center / contain no-repeat;	
}
.card-square {
	min-width: 290px;
}
.card-center {
	margin: 0 25% 0 25%;
}
.txt-center{
text-align: center;
}
.mdl-card__title{

}
.txt-cell p{
    font-size: 14px;
    line-height: 20px;
    color: #5c5e53e0;
    margin: 0 25% 0 25%;
}

.mdl-typography--font-light {
    color: #a8b1b1;
    line-height: 1.4;
}

.img1 {
    background-color: #a7c94b0f;
    margin: 0 !important;
    width: 100%;
	padding: 2%;
	font-family: 'Days One', sans-serif;
	font-size: 40px;
	color: #4e4e4e;
}
.img1 p{
	font-family: 'Open Sans Condensed', sans-serif;
    font-size: 28px;
    line-height: 35px;
    color: #4a7184e0;
    padding: 2% 8% 2% 8%;
}
.img1 h5{
	font-family: 'Open Sans Condensed', sans-serif;
    font-size: 35px;
	font-weight:600;
    line-height: 45px;
    color: #4a7184e0;
}

.img2 {
  background: url('portfo/images/img2.jpg') center / cover;	
}
.img3 {
  background: url('portfo/images/img3.jpg') center / cover;	
}
.img4 {
  background: url('portfo/images/img4.jpg') center / cover;	
}
.logos{
	margin: 8px 24px 0 0;
}

.mdl-layout__header .mdl-layout__drawer-button {
    color: #4e4e4e;
}

/********** MTLINKS ******************/
.mel2{
    font-weight: 600;
	color:inherit;
}
.mel2 :hover{
cursor:pointer;
}
.mel{
	display: inline-flex;
    vertical-align: middle;

}
.mel:before {
	content: attr(data-ma);
	/*unicode-bidi: bidi-override;
	direction: rtl;*/
}
.mel-ico{
    font-size: inherit;
    font-weight: inherit;
	line-height:1.3;
}
.mel:after {
	content:attr(data-il) "\002E" attr(data-to);
	/*unicode-bidi: bidi-override;
	direction: rtl;*/
}
.mdl-layout__drawer.is-visible {
    background-color: #001125;
	color: #fff;
}

.mdl-mega-footer {
    padding: 16px 40px;
    color: #626262;
    background-color: #006a8a1a;
}

/**** Mobile layout ****/
@media (max-width: 800px) {
   .logotop {
	height: 80px;   
    padding:8px 8px 0 0;
	margin: 0 0 0 50%;
	} 
  .img-cell{
  min-height:80px;	
	}
	.mdl-layout__header-row {
    height: 36px;
    padding: 0 16px 0 72px;
}
.mdl-layout__header-row .mdl-navigation__link {
display: none;
}



h5{
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: .03em;
	padding-right: 8px;	
}

.mdl-card__title {
    display: inline-table;
}
.mdl-typography--font-light {
    font-size: smaller;
}
  .mdl-mega-footer--bottom-section {
    display: none;
  }
}
@media screen and (max-width: 1024px){
.mdl-layout__header-row .mdl-navigation__link {
display: none;
}
  .logotop {
	height: 80px;   
    padding:8px 8px 0 0;
	} 
}