unps.us-Shortener/assets/css/elements.css

292 lines
6.6 KiB
CSS
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

.hidden { display: none; }
.unhidden { display: block; }
body{
line-height:1;
font-family:"Lucida Grande", Arial, Helvetica, Sans-Serif;
background-color: #434C56;
background-image: url(../images/body.jpg);
}
.navbar-wrapper {
position: relative;
z-index: 15;
}
.navbar{
background: rgba(34, 34, 34, 0.2);
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
box-shadow: 0 0 8px rgba(0, 0, 0, .8);
}
.navbar-nav a{
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
}
.navbar-nav a:hover{
background-color: #000;
color: #248;
webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 15px rgba(94, 125, 142, 0.9) !important;
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 15px rgba(94, 125, 142, 0.9) !important;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 15px rgba(94, 125, 142, 0.9) !important;
}
.navbar-nav a:focus{
background: rgba(0, 0, 0, 0.275) !important;
}
#selected{
background: rgba(0, 0, 0, 0.275);
-webkit-box-shadow: 0 8px 6px -6px rgba(94, 125, 142, 0.9);
-moz-box-shadow: 0 8px 6px -6px rgba(94, 125, 142, 0.9);
box-shadow: 0 8px 6px -6px rgba(94, 125, 142, 0.9);
}
.dropdown-menu{
background-color: rgba(34, 34, 34, 0.775);
color: #ffffff;
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
box-shadow: 0 0 8px rgba(0, 0, 0, .8);
}
.dropdown-menu li a{
color: #ffffff;
}
ul.nav li.dropdown:hover > ul.dropdown-menu {
-webkit-transition: all 0.70s ease-in-out;
-moz-transition: all 0.70s ease-in-out;
-ms-transition: all 0.70s ease-in-out;
-o-transition: all 0.70s ease-in-out;
display: block;
}
#wrap {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -46px;
padding: 0 0 46px;
}
#note{
color: #eee;
font-size: 12px;
margin: 0 auto;
padding: 4px;
text-align: center;
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
width: 400px;
}
.form-shorten {
max-width: 600px;
padding: 15px;
margin: 0 auto;
}
.form-shorten .form-shorten-heading{
margin-bottom: 10px;
color: #bbb;
}
.form-shorten .radio-center .btn{
color: #eee;
}
.form-shorten #radio-center .btn:checked{
border: 1px solid rgba(200, 200, 200, 0.64);
background-color: #1e3148;
}
.form-shorten input[type="text"], .form-shorten textarea{
position: relative;
font-size: 14px;
padding: 7px;
margin-bottom: -1px;
box-shadow: 0;
border: 1px solid rgba(200, 200, 200, 0.64);
padding: 6px 0px 6px 6px;
resize: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.form-shorten input[type="text"]:focus, .form-shorten textarea:focus{
z-index: 2;
border: 1px solid rgba(200, 200, 200, 0.64);
box-shadow: 0;
}
.form-shorten .radio-center input[type="radio"]:hover{
background:#200;
}
.form-shorten .btn-primary{
background-color: #333;
border: 1px solid #444;
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
padding-bottom: 5px;
text-shadow: 0.1em 0.1em 0.2em #222;
}
.form-shorten .btn-primary:hover{
background-color: #3c6190;
border: 1px solid rgba(81, 203, 238, 1);
text-shadow: 0.1em 0.1em 0.2em #222;
}
.form-shorten input[type="radio"]{
display:none;
}
.form-shorten .fbtn{
width:58.47% !important;
}
#message{
float: center;
text-align: center;
color: #bbb;
padding-left: 25.6% !important;
}
#message #error{
float: center;
text-align: center;
background: rgba(203, 52, 52, 0.7);
color: #fff;
border-radius: 5px;
padding: 5px;
width: 66%;
}
#message #success{
float: center;
text-align: center;
background: rgba(0, 158, 0, 0.7);
color: #fff;
border-radius: 5px;
padding: 5px;
width: 66%;
font-size: medium;
}
#message a{
color: #76b4ef;
}
#message a:hover{
color: #e2e6e9;
}
#privacy-link, #tos-link, #reg-link{
padding-left: .8%;
color: #eee;
}
#privacy-link:hover, #tos-link:hover, #reg-link:hover{
-webkit-box-shadow: 0 8px 6px -6px rgba(94, 125, 142, 0.9);
-moz-box-shadow: 0 8px 6px -6px rgba(94, 125, 142, 0.9);
box-shadow: 0 8px 6px -6px rgba(94, 125, 142, 0.9);
-webkit-transition: all 0.90s ease-in-out;
-moz-transition: all 0.90s ease-in-out;
-ms-transition: all 0.90s ease-in-out;
-o-transition: all 0.90s ease-in-out;
}
input[type=text], textarea, input[type=password] {
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
outline: none;
border: 1px solid #DDDDDD;
}
input[type=text]:focus, textarea:focus, input[type=password]:focus {
box-shadow: 0 0 5px rgba(200, 200, 200, 0.64);
border: 1px solid rgba(200, 200, 200, 0.64);
padding: 6px 0px 6px 6px;
}
h2 {
text-shadow: 0.1em 0.1em 0.2em #222;
}
/*#theLoader{ display: none; }*/
#loading{
position: relative;
left: -10%;
top: 15%;
margin: -22px 0 0 0;
color: #aaa;
}
#ajaxloader{ /* Modified from http://unps.us/?ygi1h9 */
position: relative;
width: 30px;
height: 30px;
left: 32%;
top: 15%;
margin: 0 0 0 -15px;
border: 6px solid #fff;
border-right: none;
border-top: 0 none;
border-bottom: 0 none;
border-radius: 100%;
-webkit-animation: spin 1s linear infinite;
-moz-animation: spin 1s linear infinite;
-ms-animation: spin 1s linear infinite;
-o-animation: spin 1s linear infinite;
animation: spin 1s linear infinite;
}
@-webkit-keyframes spin
{
from { -webkit-transform: rotate(0deg); opacity: 0.4; }
50% { -webkit-transform: rotate(180deg); opacity: 1; }
to { -webkit-transform: rotate(360deg); opacity: 0.4; }
}
@-moz-keyframes spin
{
from { -moz-transform: rotate(0deg); opacity: 0.4; }
50% { -moz-transform: rotate(180deg); opacity: 1; }
to { -moz-transform: rotate(360deg); opacity: 0.4; }
}
@-ms-keyframes spin
{
from { -ms-transform: rotate(0deg); opacity: 0.4; }
50% { -ms-transform: rotate(180deg); opacity: 1; }
to { -ms-transform: rotate(360deg); opacity: 0.4; }
}
@-o-keyframes spin
{
from { -o-transform: rotate(0deg); opacity: 0.4; }
50% { -o-transform: rotate(180deg); opacity: 1; }
to { -o-transform: rotate(360deg); opacity: 0.4; }
}
@keyframes spin
{
from { transform: rotate(0deg); opacity: 0.2; }
50% { transform: rotate(180deg); opacity: 1; }
to { transform: rotate(360deg); opacity: 0.2; }
}