/*	--------------------------------------------------
	Reveal Modals
	-------------------------------------------------- */
		
	.reveal-modal-bg { 
		position: fixed; 
		height: 100%;
		width: 100%;
		background: #000;
		background:rgba(0,0,0,0.7);
		box-shadow:0px 2px 2px 1px black;
		z-index: 100;
		display: none;
		top: 0;
		left: 0; 
		}
	
	.reveal-modal {
		visibility: hidden;
		top: 100px; 
		margin-left:30%;
		width: 40%;
		background-color:white;
	
		/*background: #eee url(modal-gloss.png) no-repeat -200px -80px;*/
		position: absolute;
	 
	    padding-bottom: 5px;
		z-index: 101;
	    
	    overflow: auto;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-box-shadow: 0 0 10px rgba(0,0,0,.4);
		}
		
	.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
	.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
	.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
	.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}
	
	.reveal-modal .close-reveal-modal {
		font-size: 22px;
		line-height: .5;
		position: absolute;
		top: 8px;
		right: 11px;
		color: #aaa;
	    text-shadow: 0 -1px 1px;
		font-weight: bold;
		cursor: pointer;
		} 
		
 .textbox { 
    border: 1px solid #c4c4c4; 
    height: 25px; 
    width: 80%;
     margin-left: 10%; 
    font-size: 14px; 
    padding: 4px 4px 4px 4px; 
    border-radius: 4px; 
    -moz-border-radius: 4px; 
    -webkit-border-radius: 4px; 
    box-shadow: 0px 0px 8px #d9d9d9; 
    -moz-box-shadow: 0px 0px 8px #d9d9d9; 
    -webkit-box-shadow: 0px 0px 8px #d9d9d9; 
} 
 
.textbox:focus { 
    outline: none; 
    border: 1px solid #207cca; 
    box-shadow: 0px 0px 8px #207cca; 
    -moz-box-shadow: 0px 0px 8px #207cca; 
    -webkit-box-shadow: 0px 0px 8px #207cca; 
} 

.css_button1 {
    font-size: 20px;
    font-family: Arial;
    font-weight: normal;
    text-decoration: inherit;
    -webkit-border-radius: 4px 4px 4px 4px;
    -moz-border-radius: 4px 4px 4px 4px;
    border-radius: 4px 4px 4px 4px;
    border: 2px solid #3866A3;
    padding: 7px;
    width: 82%;
    margin-left: 10%;
    margin-top: 4px;
    text-shadow: 1px 1px 0px #5E5E5E;
    -webkit-box-shadow: inset 1px 1px 0px 0px #BEE2F9;
    -moz-box-shadow: inset 1px 1px 0px 0px #BEE2F9;
    box-shadow: inset 1px 1px 0px 0px #BEE2F9;
    cursor: pointer;
    color: #FFFFFF;
    display: inline-block;
    background: -webkit-linear-gradient(90deg, #468ccf 5%, #63b8ee 100%);
    background: -moz-linear-gradient(90deg, #468ccf 5%, #63b8ee 100%);
    background: -ms-linear-gradient(90deg, #468ccf 5%, #63b8ee 100%);
    background: linear-gradient(180deg, #63b8ee 5%, #468ccf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#63b8ee",endColorstr="#468ccf");
}

.css_button1:hover {
    background: -webkit-linear-gradient(90deg, #63b8ee 5%, #468ccf 100%);
    background: -moz-linear-gradient(90deg, #63b8ee 5%, #468ccf 100%);
    background: -ms-linear-gradient(90deg, #63b8ee 5%, #468ccf 100%);
    background: linear-gradient(180deg, #468ccf 5%, #63b8ee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#468ccf",endColorstr="#63b8ee");
}

.css_button1:active {
    position:relative;
    top: 1px;
}

.css_button2 {
    font-size: 20px;
    font-family: Arial;
    font-weight: normal;
    text-decoration: inherit;
    background: #228b22;
    border: 2px solid #006400;
    padding: 7px;
    width: 90%;
    margin-left: 5%;
    margin-top: 4px;
    text-shadow: 1px 1px 0px #5E5E5E;
    -webkit-box-shadow: inset 1px 1px 0px 0px #BEE2F9;
    -moz-box-shadow: inset 1px 1px 0px 0px #BEE2F9;
    box-shadow: inset 1px 1px 0px 0px #BEE2F9;
    cursor: pointer;
    color: #FFFFFF;
    display: inline-block;
}

.css_button2:hover {
    position:relative;
    top: 1px;
}
  @media screen and (min-width:340px) and (max-width: 720px) 
 {

    .reveal-modal {
        margin-left: 2%;
        width:96%;
     
    }
     
      .textbox { 
    border: 1px solid #c4c4c4; 
    height: 25px; 
    width: 90%;
     margin-left: 3.5%; 
    font-size: 12px; 
    padding: 4px 4px 4px 4px; 
    border-radius: 4px; 
    -moz-border-radius: 4px; 
    -webkit-border-radius: 4px; 
    box-shadow: 0px 0px 8px #d9d9d9; 
    -moz-box-shadow: 0px 0px 8px #d9d9d9; 
    -webkit-box-shadow: 0px 0px 8px #d9d9d9; 
} 
 
.textbox:focus { 
    outline: none; 
    border: 1px solid #207cca; 
    box-shadow: 0px 0px 8px #207cca; 
    -moz-box-shadow: 0px 0px 8px #207cca; 
    -webkit-box-shadow: 0px 0px 8px #207cca; 
} 
      
    }