.modal-box{ font-family: 'Poppins', sans-serif; } .modal-box .show-modal{ color: #fff; background-color: #222; font-size: 17px; font-weight: 500; text-transform: capitalize; padding: 10px 20px; margin: 80px auto 0; border: none; border-radius: 0; outline: none; display: block; transition: all 0.3s ease 0s; } .modal-box .show-modal:hover, .modal-box .show-modal:focus{ color: #fff; outline: none; } .modal-backdrop.in{ opacity: 0; } .modal-box .modal-dialog{ width: 750px; margin: 70px auto 0; } .modal.fade .modal-dialog{ transform: translateY(100px); } .modal.in .modal-dialog{ transform: translateY(0); } .modal-box .modal-dialog .modal-content{ color: #1B2541; background: #fff; border: none; border-radius: 0; box-shadow: 0 0 25px rgba(0,0,0,0.1); } .modal-box .modal-dialog .modal-content .close{ color: rgba(0,0,0, 0.9); background-color: rgba(255,255,255,0.5); font-size: 25px; font-weight: 300; text-shadow: none; line-height: 32px; height: 25px; width: 25px; padding: 0 0 0 2px; border-radius: 50%; opacity: 1; overflow: hidden; position: absolute; left: auto; right: 15px; top: 15px; z-index: 2; transition: all 0.3s ease 0s; } .modal-box .modal-dialog .modal-content .close span{ margin: -2px 0 0; display: block; } .modal-box .modal-dialog .modal-content .close:hover{ color: #222; } .modal-box .modal-dialog .modal-content .close:focus{ outline: none; } .modal-box .modal-dialog .modal-content .modal-body{ padding: 0 !important; margin: 0; } .modal-box .modal-dialog .modal-content .modal-body .content{ padding: 50px 30px; } .modal-box .modal-dialog .modal-content .modal-body .title{ color: #222; font-size: 40px; font-weight: 500; margin: 0 0 15px; } .modal-box .modal-dialog .modal-content .modal-body .description{ color: #999; font-size: 15px; font-weight: 500; margin: 0 0 25px; } .modal-box .modal-dialog .modal-content .modal-body .form-group{ font-size: 0; margin: 0 0 40px; } .modal-box .modal-dialog .modal-content .modal-body .form-group .form-control{ color: #222; width: calc(100% - 96px); height: 40px; padding: 10px 15px; border-radius: 0; border: 3px solid #222; display: inline-block; } .modal-box .modal-dialog .modal-content .modal-body .form-group .btn{ color: #fff; background-color: #222; font-weight: 600; padding: 10px 15px; border-radius: 0; border: none; vertical-align: top; display: inline-block; } .modal-box .modal-dialog .modal-content .modal-body .image{ padding: 0; } .modal-box .modal-dialog .modal-content .modal-body .modal-image{ height: 100%; width: 100%; } .modal-box .modal-dialog .modal-content .modal-body .terms-desc{ color: #999; font-size: 13px; } @media only screen and (max-width: 767px){ .modal-dialog{ width: 95% !important; } .modal-box .modal-dialog .modal-content .modal-body .content{ padding: 30px; } .modal-box .modal-dialog .modal-content .modal-body .title{ font-size: 30px; } .modal-box .modal-dialog .modal-content .modal-body .image{ height: 200px; overflow: hidden; } .modal-box .modal-dialog .modal-content .modal-body .modal-image{ height: auto; } }