/* 
==================================================
|| VARIABLES
==================================================
*/

:root{
    --color-orange:  #1D976C;
    --color-yellow: #93F9B9;
    --color-gradient-yellow: linear-gradient(to left, #93F9B9,#1D976C);
}

.hero-content{
    padding: 30px 0;
}

.hero-content h2 span{
    color: var(--color-orange);
}

.video-wrapper{
    background: url(../img/hero-recyclage.jpg) center center no-repeat;
}

.video-wrapper div,
.video-wrapper div iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

#about .row{
    align-items: initial;
}

table{
    padding: 15px;
    background-color: #FFFFFF;
    border-radius: 4px 4px;
    box-shadow: 0 14px 28px rgba(0,0,0,0.05), 0 10px 10px rgba(0,0,0,0.02);
    margin-top: -300px;
}

table tr th, table tr td{
    text-align: left;
    vertical-align: middle;
    padding: 8px;
}

table tr th.center, table tr td.center{
    text-align: center;
}

table tr td.title{
    font-weight: bold;
}

table tr th{
    background-color: #1D976C;
    color: #FFFFFF;
}

table tbody tr.mint{
    background-color: #93F9B9;
}

.edit-input{
    padding: 5px 15px;
    text-align: center;
    font-size: 1rem;
}

@media only screen and (max-width: 940px){
    table{
        margin-top: 30px;
        padding: 0;
        font-size: 0.75rem;
        box-shadow: none;
        width: 100%;
    }
}