.no-padding > [class*='col-'] {
    padding-right:0;
    padding-left:0;
    }
    
    .login, body{
        background-color: white;
    }
    
    .container-login{
        margin-top: 80px;
        box-shadow: 10px 10px 23px 0px rgba(199,199,199,1);
        background-color: white;
    }
    
    .contain-logo{
        background-color: #34a936;
    }
    
    .imgSGA{
      display: block;
      margin: auto;
      margin-top: 40vh;
      transform: translateY(-50%); 
      height: 350px;
      width: 350px;
    }
    
    .contain-logo p{
      color: white;
      font-size: 15px;
      text-align: center;
      margin-bottom: 70px;
    }
    
    .imgBorneEau{
      display: block;
      margin: 30px auto;
      width: 150px;
      height: 150px;
    }
    
    .imgSGAphone, .imgBorneEauphone{
      height: 120px;
      width: 120px;
      display: block;
      margin: 20px auto;
    }
    
    h1{
      color: #34a936;
      font-size: 50px;
      letter-spacing: 8px;
      text-align: center;
      margin-top: 120px !important;
    }
    
    form{
      margin-top: 50px;
    }
    
    .group {
      position: relative;
      margin-bottom: 45px;
    }
      
    input {
      width: 100%;
      height: 50px;
      font-size: 18px;
      padding: 10px 10px 10px 5px;
      -webkit-appearance: none;
      display: block;
      background: transparent;
      color: #34a936;
      border: none;
      border-radius: 0;
      border-bottom: 1px solid #ddd;
    }
      
    input:focus {
      outline: none;
    }
      
     
    label {
      color: #999;
      font-size: 18px;
      font-weight: normal;
      position: absolute;
      pointer-events: none;
      left: 20px;
      top: 10px;
      -webkit-transition: all 0.2s ease;
      transition: all 0.2s ease;
    }
      
    .item{
      padding-right: 10px;
    }
      
    input:focus ~ label,
    input.used ~ label {
      top: -20px;
      -webkit-transform: scale(0.75);
      transform: scale(0.75);
      left: -2px;
      color: #34a936;
    }
      
    .bar {
      position: relative;
      display: block;
      width: 100%;
    }
    
    .bar:before,
    .bar:after {
      content: "";
      height: 2px;
      width: 0;
      bottom: 1px;
      position: absolute;
      background: #34a936;
      -webkit-transition: all 0.2s ease;
      transition: all 0.2s ease;
    }
    
    .bar:before {
      left: 50%;
    }
    
    .bar:after {
      right: 50%;
    }
      
    input:focus ~ .bar:before,
    input:focus ~ .bar:after {
      width: 50%;
    }
      
      
    .highlight {
      position: absolute;
      height: 60%;
      width: 100px;
      top: 25%;
      left: 0;
      pointer-events: none;
      opacity: 0.5;
    }
    
    input:focus ~ .highlight {
      -webkit-animation: inputHighlighter 0.3s ease;
      animation: inputHighlighter 0.3s ease;
    }
     
    @-webkit-keyframes inputHighlighter {
      from {
        background: #34a936;
      }
      to {
        width: 0;
        background: transparent;
      }
    }
      
    @keyframes inputHighlighter {
      from {
        background: #34a936;
      }
      to {
        width: 0;
        background: transparent;
      }
    }
    
    .optionslogin{
      margin-top: -20px;
    }
    
    .check-box {
      display: flex;
      position: relative;
      align-items: center;
      line-height: 20px;
      height: 20px;
      z-index: 100000;
      cursor: pointer;
      
    }
    
    input#rememberMe {
      position: relative;
      cursor: pointer;
      width: 20px;
      height: 20px;
      background: white;
      outline: none;
      z-index: 100000;
      
    }
    
    input#rememberMe:before {
      content: "";
      position: absolute;
      width: 20px;
      height: 20px;
      background: white;
      cursor: pointer;
    }
    
    input#rememberMe:after {
      content: "";
      transition: .25s ease-in-out;
      position: absolute;
      z-index: 1;
      width: 20px;
      height: 20px;
      border: 1px solid #ddd;
      margin-top: 0px;
      outline: none;
    }
    
    input#rememberMe:checked:after {
      transform: rotate(-45deg);
      height: 5px;
      border: 1px solid #29be0b;
      border-top-color: transparent;
      border-right-color: transparent;
      margin-top: 5px;
    }
    
    .check-box span{
      padding-left: 10px;
      color: #90B590;
    }
    
    .passforget{
      color: #1f8a0a;
      float: right;
      text-decoration: none;
    }
    
    .passforget:hover{
      color: #34a936;
    }
      
    .divbuttonform{
      margin-top: 20px;
    }
    
    .btnform{
      
      height: 50px;
      background-color: #34a936;
      color: white;
      line-height: 50px;
      font-size: 18px;
      padding: 0px;
      text-align: center;
      transition: .2s ease;
    }
    
    .btnform:hover{
      transform: translateY(3px);
      box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
      color: white;
    }
    
    .info{
      margin-top: 20px;
      color: red;
      text-align: center;
    }
    
    @media screen and (max-width: 1710px) {
      .btnformcreate{
        line-height: normal;
        font-size: 18px;
        padding-top: 0px;
        text-align: center;
        transition: .2s ease;
      }
     }
    
     @media screen and (max-width: 1140px) {
      .btnformcreate{
        font-size: 15px;
      }
    
      .btnformcreate{
        padding-top: 5px;
      }
     }
    
    @media screen and (max-width: 1010px) {
     .imgSGA{
        height: 320px;
        width: 320px;
     }
    }
    
    @media screen and (max-width: 990px) {

    h1{
        margin-top: 10px !important;
    }
    
    .container-login{
      margin-top: 20px;
    
    }
      
    .btnform{
      height: 50px;
      background-color: #34a936;
      color: white;
      line-height: 50px;
      font-size: 18px;
      padding: 0px;
      text-align: center;
      transition: .2s ease;
      margin-top: 10px;
    }
    
    }
    
    
    @media screen and (max-width: 380px) {
      
      h1{
        font-size: 40px;
        letter-spacing: 8px;
      }
    
      .info{
        text-align: justify;
      }
      }
       
     
    
    
    @media screen and (max-width: 340px) {
      
      .check-box span, .passforget{
        font-size: 12px;
      }
      
      .passforget{
        margin-top: 2px;
      }
      }