.overlay-modal, #overlay_modal
{
display: block;
background: rgba(0, 0, 0, 0.75);
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
z-index: 9999;
}
.overlay-modal-content-container
{
margin: 9% auto 0%;
padding: 20px;
/*border: 0px solid #888;*/
background: url("/images/pickleball/pickleroll Denver pic1.png") 0 0 / cover no-repeat;
width: 92%;
max-width: 816px;
min-height: 439px;
text-align: center;
color: #000000;
position: relative;
}
.overlay-modal-content
{
margin: auto;
padding: 4% 0% 0%;
width: 100%;
text-align: center;
position: relative;
top: 0px;
display: block;
min-height: 424px;
background: rgba(21, 96, 129, 0.735);
border: 2px solid rgba(0, 0, 0, 0.735);
}
.overlay-modal-content img
{
max-width: 187px;
}
.overlay-modal-content h2
{
color: #FFFFFF;
text-align: center;
font-size: 2.1em;
line-height: 132%;
}
.overlay-modal-content p
{
font-size: 1em;
margin: 19px auto 22px;
color: #FFFFFF;
text-align: center;
line-height: 124%;
font-size: 1.2em;
width: 80%;
max-width: 523px;
}
.overlay-modal-content hr
{
width: 46%;
}
.overlay-modal-section a:link
{
text-decoration: none;
color: #000000;
border: 1px solid #000000;
padding: 7px 40px;
background: var(--primary_color);
font-size: 1.1em;
}
.overlay-modal-section a:visited
{
text-decoration: none;
color: #3E3E3E;
border: 1px solid #000000;
}
.overlay-modal-section a:active
{
text-decoration: underline;
color: var(--primary_color);
background: #FFFFFF;
}
.overlay-modal-section a:hover
{
text-decoration: underline;
color: var(--primary_color);
background: #FFFFFF;
}
.sm_logo
{
color: #FFFFFF;
font-size: 32px;
font-weight: bold;
position: absolute;
left: 20px;
top: 20px;
z-index: 9999;
}
.sm_logo img
{
height: 100px;
width: auto;
}
.closeBtn
{
color: #FFFFFF;
float: right;
font-size: 32px;
font-weight: bold;
position: relative;
top: 9px;
right: 15px;
z-index: 9999;
}
.closeBtn:hover
{
color: #FFFFFF;
text-decoration: none;
cursor: pointer;
}
.closeBtn:focus
{
color: #FFFFFF;
text-decoration: none;
cursor: pointer;
}
.toggleBtn
{
position: fixed;
top: 209px;
right: 36px;
z-index: 20;
max-width: 163px;
background-size: contain;
padding: 15px 30px;
background: var(--primary_color);
color: #FFFFFF;
border-radius: 9px;
font-size: 1em;
text-align: center;
line-height: 140%;
}
.toggleBtn:hover
{
background: var(--primary_color);
color: #FFFFFF;
cursor: pointer;
}
.modal_form .modal_disclaimer
{
font-size: 0.8em;
font-style: italic;
padding: 10px 0px 0px 0px !important;
}
.modal_section p
{
font-size: 1em;
margin: 5px 0 13px;
color: #FFFFFF;
text-align: left;
line-height: 126%;
}
.overlay-modal-section a:active
{
text-decoration: underline;
color: var(--primary_color);
background: #FFFFFF;
}
.modal_form input[type=text], .modal_form textarea, .modal_form input[type=password], .modal_form input[type=email]
{
padding: 5px 10px !important;
width: 96%;
border: 0px;
border-bottom: 1px solid #FFF;
font-size: 1em;
line-height: 22px;
color: #000000;
background-color: #FFFFFF;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.09) inset;
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.09) inset;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.09) inset;
-o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.09) inset;
transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
}
.modal_form input[type=text]:focus, .modal_form textarea:focus, .modal_form select:focus, .modal_form input[type=radio]:focus, .modal_form input[type=email]:focus
{
background-color: #F1F1F1;
border-color: rgba(238, 191, 41, 0.880);
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
box-shadow: inset 0 1px 1px rgba(238, 191, 41, 0.075), 0 0 8px rgba(238, 191, 41, 0.6);
}
.modal_form select:focus
{
background-color: #FBFBFB;
border-color: rgba(238, 191, 41, 0.880);
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
box-shadow: inset 0 1px 1px rgba(238, 191, 41, 0.075), 0 0 8px rgba(238, 191, 41, 0.6);
}
.modal_form input[type=submit]:focus
{
border-color: rgba(238, 191, 41, 0.880);
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
box-shadow: inset 0 1px 1px rgba(238, 191, 41, 0.075), 0 0 8px rgba(238, 191, 41, 0.6);
}
.modal_form select
{
padding: 10px !important;
width: 94%;
border: 0px !important;
border: none !important;
font-size: 0.95em;
line-height: 22px;
color: #555;
background-color: #FFF;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16) !important;
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16) !important;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16) !important;
-o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16) !important;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
}
.modal_form p
{
font-size: 1.15em;
color: #FFFFFF;
text-align: left;
margin: auto;
padding-bottom: 20px;
line-height: 165%;
}
.modal_form a
{
font-size: 0.75em;
margin: 5px 0 5px 13px;
}
.modal_list
{
list-style: none;
display: block;
}
.modal_half_width
{
list-style: none;
width: 48%;
padding: 0px 0% 5px;
text-align: center;
display: inline-block;
}
.modal_full_width
{
list-style: none;
width: 100%;
padding: 8px 0% 5px;
text-align: left;
}
.modal_section
{
padding: 4% 5% 7%;
background: var(--primary_color);
}
.modal_section h2
{
color: #FFFFFF;
text-align: left;
font-size: 1.6em;
line-height: 132%;
}
.modal_submit
{
border: 0px solid;
background: #FFFFFF;
color: var(--primary_color);
font-size: 1.1em;
font-family: sansation_regular, arial, helvetica, sans-serif;
padding: 8px 30px 6px 30px;
text-decoration: none;
display: inline-block;
font-weight: bold;
cursor: pointer;
opacity: 1;
filter: alpha(opacity=100);
width: 100%;
}
.modal_submit:hover
{
opacity: 95;
filter: alpha(opacity=95);
}
.modal_captcha
{
width: 145px;
position: relative;
top: 12px;
margin-top: 0px;
margin-left: 7px;
}
.modal_refresh
{
width: 23px;
max-width: 15%;
margin-bottom: -4px;
margin-left: -3px;
}
.overlay-modal-section a:active
{
text-decoration: underline;
color: var(--primary_color);
background: #FFFFFF;
}
.links_container
{
display: flex;
justify-content: space-around;
padding-bottom: 28px;
}
.links_container a
{
color: #FFFFFF;
background: #4EA72E;
padding: 10px 80px;
border: 2px solid #000000;
border-radius: 10px;
line-height: 150%;
text-transform: uppercase;
}
@media screen and (max-width: 550px)
{
.sm_logo
{
display: none;
}
.links_container
{
display: flex;
justify-content: space-around;
flex-direction: column;
padding-bottom: 8px;
}
.links_container a
{
color: #FFFFFF;
background: #4EA72E;
padding: 10px 45px;
border: 2px solid #000000;
border-radius: 10px;
line-height: 150%;
text-transform: uppercase;
margin: 0px 11px 16px;
}
}
@media screen and (max-width: 420px)
{
.links_container a
{
color: #FFFFFF;
background: #4EA72E;
padding: 10px 45px;
border: 2px solid #000000;
border-radius: 10px;
line-height: 150%;
text-transform: uppercase;
}
}