#optin-modal-custom{
        display:none;
    }
    
    #opt-in{
        display: flex;
        margin-top: 1.5rem;
        color: #5E5E5E;
		width: 42%;
    }
    
    #opt-in p {
        margin-left: 0.5rem;
    }
    
    #optin-modal-custom label{
        position:relative;
        pointer-events: all;
    }
    
    .modal{
        display: none;
        position: fixed;
        z-index: 99;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow:auto;
        background-color: rgb(0,0,0);
        background-color: rgba(0,0,0,.4);
    }
    
    .modal-content-custom {
        background-color: #FEFEFE;
        margin: 15% auto;
        padding: 1rem;
        border: 1px solid #888;
        width: 35%;
        border-radius: 3px;
    }
    
    #optin-modal-custom p {
        line-height: 1.5;
        padding: 1rem 1rem 0;
        color: #2E3542;
        font-size: 1rem;
    }
    
    .close{
        color: #aaa;
        float: right;
        font-size:  1.75rem;
    }
    
    .close:hover, .close:focus{
        color: #000;
        text-decoration: none;
        cursor: pointer;
    }
    
    html.no-scroll, body.no-scroll {
        overflow: hidden;
    }
    
    @media only screen and (max-width: 1300px) {
      .modal-content-custom {
        width: 40%;  
      }
    }
    
    @media only screen and (max-width: 1100px) {
      .modal-content-custom {
        width: 45%;  
      }
    }
    
    @media only screen and (max-width: 1100px) {
      .modal-content-custom {
        width: 50%;  
      }
    }
    
    @media only screen and (max-width: 900px) {
      .modal-content-custom {
        width: 60%;  
      }
    }
    
    @media only screen and (max-width: 600px) {
      .modal-content-custom {
        width: 70%;  
      }
      #optin-modal-custom p{
          font-size: 0.8rem;
      }
    }
    
    @media only screen and (max-width: 450px) {
      .modal-content-custom {
        width: 85%;  
      }
    }