|
|
/******************************* Dimmer Styles *******************************/ /* the one true page dimmer */ #dimmer { position: absolute; visibility: hidden; top: 0px; left: 0px; z-index: 999; margin: 0px; width: 100%; height: 100%; padding: 0px; } #dimmer .content { position: fixed; top: 0px; left: 0px; margin: 0px; width: 100%; height: 100%; padding: 0px; visibility: hidden; background-color: #000000; opacity: 0.0; } /* a generic dimmer */ .dimmer { display: none; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; background-color: #000000; z-index: 999; } .white.dimmer { background-color: #FFFFFF; } .loading .dimmer { display: block; opacity: 0.8; -webkit-transition: opacity 0.5s linear; -moz-transition: opacity 0.5s linear; -o-transition: opacity 0.5s linear; -ms-transition: opacity 0.5s linear; transition: opacity 0.5s linear; } /******************************* Modal Styles *******************************/ .modal { display: none; position: fixed; z-index: 1000; top: 50%; left: 50%; margin-left: -400px; width: 800px; -webkit-box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.8); -moz-box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.8); box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.8); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .modal.absolute { position: absolute; } .modal.fixed { position: fixed; } /*-------------- Close Button ---------------*/ .modal > .close { cursor: pointer; position: absolute; font-size: 14px; color: #FFFFFF; top: -18px; right: -18px; opacity: 0.8; } .modal > .close:hover { opacity: 1; } /*-------------- Header ---------------*/ .modal > hgroup { background-color: #442359; padding: 15px 20px; -webkit-border-radius: 10px 10px 0px 0px; -moz-border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px; } .modal > hgroup h2 { margin: 0px; font-size: 22px; font-weight: bold; color: #FFFFFF; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.75); } .modal > hgroup h3 { font-size: 18px; color: #FFF; } .modal > .content { position: relative; overflow: hidden; padding: 20px 20px 40px; background-color: #FAFAFA; -webkit-border-radius: 0px 0px 10px 10px; -moz-border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px; } .modal > .content .left { float: left; width: 50%; } .modal > .content .right { float: right; width: 50%; } /* Static In-Page Modal */ .modal.static { display: block; position: relative; overflow: hidden; top: 0px; left: 0px; border: 1px solid #CCCCCC; width: auto; height: auto; margin: 0px auto; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; color: #555555; z-index: 2; -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); } .modal.static > hgroup, .modal.static > .content { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; }
|