.green-text {
    color: green;
}
.red-text {
    color: red;
}
.blue-text {
    color: rgb(55, 88, 208);
}

.redWhite{
    color: #FFF;
    background-color: red;
}
.greenWhite{
    color: #FFF;
    background-color: darkgreen;
}
.md-nav__link, a{
    /*color: var(--md-typeset-a-color);
    text-decoration: underline;*/
}

/* Extend the width of the main content area */
.md-grid {
   /* max-width: 100% !important;*/
   /* padding: 0 2rem;*/
}
body{
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, "Helvetica Neue", Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
}
.md-content, .md-sidebar--secondary .md-sidebar__inner{
   /* border-left: 1px solid rgba(0, 0, 0, .1);*/
}
.md-typeset h1 {
    color: #2980B9;
    border-bottom: 1px solid #2980B9;
    border-top: 1px solid #2980B9;
    font-weight : 600;
}

.md-typeset h2  {
    color: #2980B9;
    border-bottom: 1px solid #2980B9;
}

.md-typeset .admonition, .md-typeset details{
    font-size: inherit !important;
}
/**********Iframe************/
.containerFrame {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
  }
  
  .responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: none;
  }

/************edit code pen********************/
.editCp{
    display: inline-flex;
    /*flex-flow: row nowrap;
    justify-content: center;*/
    align-items: center;
    min-height: 50px;
   /* background-color: #4CAF50; */
    background-image: url('../images/editOnCp.png');
    background-repeat: no-repeat;
    padding: 0 3px 0 170px;
    color: rgb(60, 58, 58);
    border : 1px solid rgb(60, 58, 58);
    text-decoration: none;
    vertical-align: middle;
    /*margin-left: 10rem;*/
}
 
.editCpLong{
    display: inline-flex;
    
    align-items: center;
    min-height: 50px;
    background-color: #3d3d3f;  
    background-image: url('../images/editOnCpLong.png');
    background-repeat: no-repeat;
    padding: 0 15px 0 170px;
    color: #FFF;
    text-decoration: none;
    vertical-align: middle;
   

    outline: 1px solid #FFF; 
    outline-offset: -5px; 

}
 
.editCp2{
    display: inline-flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    min-height: 40px;
    background-color: #4CAF50; 
    background-image: url('../images/logo-w3schools-small.png');
    background-repeat: no-repeat;
    padding: 0 3px 0 40px;
    color: white;
    text-decoration: none;
    vertical-align: middle;
    margin-left: 10rem;
}

/**align img****/
.clearFloat{
    clear: both;
}

/*******************/
.widthInhe{
    width: inherit !important;
}
/*******************/
.flex-container {
    display: flex;
    justify-content: space-between;
  }
  
.flex-item {
    flex: 1;
    padding: 10px;
  }
  /*******quiz************/

.explanation{
    margin-bottom: 1rem;
}


/**********mettre à la ligne la navigation************/
.md-tabs {
    flex-wrap: wrap;
    white-space: normal;
  }
  
  .md-tabs__list {
    flex-wrap: wrap;
  }