 body {
            font-family: Arial, Helvetica, sans-serif;
        }

        /* The Modal (background) */
        .modal {
            display: none;
            /* Hidden by default */
            position: fixed;
            /* Stay in place */
            z-index: 999;
            /* Sit on top */
            padding-top: 40px;
            /* Location of the box */
            left: 0;
            top: 0;
            width: 100%;
            /* Full width */
            height: 100%;
            /* Full height */
            overflow: auto;
            /* Enable scroll if needed */
            background-color: rgb(0, 0, 0);
            /* Fallback color */
            background-color: rgba(255, 255, 255, 0.7);
            /* Black w/ opacity */
        }

        /* Modal Content */
        .modal-content {
			overflow: auto;
            position: relative;
            background-color: #FFF;
            margin: 50px auto auto auto;
            padding: 0px 0px 0px 0px;
            border: 0px solid #888;
			border-radius:5px;
            width: 100%;
			max-width: 650px;
            box-shadow: 0 4px 18px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.3);
            -webkit-animation-name: animatetop;
            -webkit-animation-duration: 0.4s;
            animation-name: animatetop;
            animation-duration: 0.4s
        }

/* The Close Button */
.close {
  color: #333;
  float: right;
	padding-right: 20px;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #888;
  text-decoration: none;
  cursor: pointer;
}

        /* Add Animation */
        @-webkit-keyframes animatetop {
            from {
                top: -300px;
                opacity: 0
            }

            to {
                top: 0;
                opacity: 1
            }
        }

        @keyframes animatetop {
            from {
                top: -300px;
                opacity: 0
            }

            to {
                top: 0;
                opacity: 1
            }
        }

        

        .modal-header {
            padding: 20px 5px 20px 20px;
			margin-bottom: 10px;
            background-color: rgba(21,171,186,1.00);
			font-family: Proxima Nova, sans-serif;
			font-size:140%;
            color: white;
        }
        .modal-header_2 {
            padding: 15px 0px 20px 30px;
			margin-bottom: 0px;
            background-color: white;
			font-family: Proxima Nova, sans-serif;
			font-size:150%;
            color: #000;
        }
.modal-header_reg {
            padding: 20px 0px 15px 20px;
			margin-bottom: 0px;
            background-color: white;
			font-family: Proxima Nova, sans-serif;
			font-size:130%;
            color: #000;
        }

        .modal-body {
            padding: 0px 10px 10px 20px;
			background-color: white;
        }

        .modal-footer {
            padding: 10px 10px 10px 20px;
            background-color: rgba(255,255,255,1);
			font-family: Proxima Nova, sans-serif;
font-size:85%;
            color: #555;
			text-align: left;
        }

  .modal-header_P {
            padding: 20px 5px 20px 20px;
			margin-bottom: 10px;
            background-color: #FFFFFF;
			font-family: Proxima Nova, sans-serif;
			font-size:140%;
            color: #000;
        }

/* --  media768-- */
@media all and (max-width: 480px)

{

 .modal-body {
            padding: 0px 10px 10px 10px;
	 margin-top: 0px;
	 background-color: white;
	
        }
	
	        .modal-header_2 {
            padding: 20px 0px 20px 20px;
			margin-bottom: 0px;
        
			font-family: Proxima Nova, sans-serif;
			font-size:140%;

        }
	}
@media all and (max-width: 1280px)

{
	.modal-content {
            overflow: auto;
            position: relative;
            margin: 15px auto auto auto;
            padding: 0;
            border: 1px solid #888;
            width: 100%;
			max-width: 650px;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
            -webkit-animation-name: animatetop;
            -webkit-animation-duration: 0.4s;
            animation-name: animatetop;
            animation-duration: 0.4s
        }
	        .modal-header {
            padding: 20px 5px 20px 15px;
			margin-bottom: 0px;
            background-color: rgba(21,171,186,1.00);
			font-family: Proxima Nova, sans-serif;
font-size:120%;
            color: white;
        }
	   .modal-footer {
		   display: none;
            padding: 10px 10px 10px 20px;
            background-color: rgba(100,190,39,1);
			font-family: Proxima Nova, sans-serif;
font-size:85%;
            color: white;
			text-align: center;
        }
		  .modal-header_P {
            padding: 20px 5px 20px 20px;
			margin-bottom: 10px;
			font-family: Proxima Nova, sans-serif;
			font-size:120%;
        }
	
}
    .modal-body_SP {
            padding: 0px 20px 20px 20px;
        }
