whisper.cat/weboasis/text/password/css/style.css
2023-10-05 23:28:32 +11:00

345 lines
6.4 KiB
CSS

body{
font-family:Tahoma,Geneva,sans-serif;
}
.jumbotron {
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
color: #ffffff;
text-align: center;
width: 100%;
border-radius: 0px;
}
.ad-head{
margin-bottom: 20px;
}
.box{
border-radius: 5px;
margin-bottom: 10px;
background-color: #ecf0f1;
}
.box:hover{
box-shadow: 0px .5px .5px .5px rgba(0,0,0,0.26);
}
.box-head{
width: 100%;
height: 50px;
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
border-radius: 5px 5px 0px 0px;
color: #ffffff;
}
.box-head h3{
padding-top: 15px;
font-size: 22px;
}
a:link {
color:#000000;
}
a:visited {
color:#000000;
}
a:hover {
color:#0280CF;
}
a:active {
color:#0280CF;
}
.description .d-content{
padding: 10px;
color: #2c3e50;
}
.d-content h2{
font-size: 24px;
color: #2c3e50;
}
.btn{
color: #ffffff;
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
border:0px;
font-family:Tahoma,Geneva,sans-serif;
transition: 0.5s;
}
.btn:hover{
box-shadow: none !important;
outline: none !important;
}
.btn:focus{
box-shadow: none !important;
outline: none !important;
}
.widgets-form{
padding: 20px;
margin-left: 40px;
padding-top: 30px;
}
.widgets-form label{
padding-left: 0px;
padding-top: 5px;
font-size:17px;
}
.widgets-form .row{
padding-bottom: 15px;
}
.w-btn{
margin-top: 5px;
}
.result-label{
padding: 9px;
}
.result{
background-color: #ffffff;
border-radius: 5px;
height: 40px;
padding: 9px;
}
::-moz-selection { /* Code for Firefox */
color: #ffffff;
background-color:#ffc371;
}
::selection {
color: #ffffff;
background-color: #9b59b6;
}
input::placeholder {
font-family:Tahoma,Geneva,sans-serif;
}
.ad-slot{
width:100%;
}
.ad-slot ins{
margin-bottom:5px;}
.foot-link:link, .foot-link:visited{
color:#fff;
}
/* Responsive Design Strat */
@media(max-width:1199px ){
.w-btn{
margin-left: 100px;
margin-top: 5px;
}
.result{
font-size: 15px;
}
.copy span{
display: none;
}
}
@media(max-width:991px ){
.w-btn{
margin-left: 50px;
margin-top: 5px;
}
.result-label{
padding: 0px;
padding-top: 5px;
}
.result{
font-size: 15px;
margin-left: 10px;
padding: 0px;
}
.widgets-form{
padding-top: 20px;
margin-left: 0px;
}
.widgets-form label{
padding-left: 0px;
padding-top: 8px;
text-align: left;
}
.box-head h3{
font-size: 18px;
}
.copy span{
display: none;
}
}
@media screen and (max-width: 768px) {
.box-head h3{
font-size: 18px;
}
.widgets-form{
padding: 20px;
margin-left: 0px;
padding-top: 20px;
}
.widgets-form label{
padding-left: 0px;
padding-top: 8px;
text-align: left;
}
.widgets-form .row{
padding-bottom: 10px;
}
.w-btn{
margin-left: 0px;
}
.result-label{
padding: 9px;
}
footer {
height: 40px;
padding-top: 10px;
margin-top: 0px;
}
footer p{
font-size: 14px;
}
footer .pull-left{
float: none;
}
footer .pull-right{
display: none;
}
.result{
margin-left: 0px;
padding: 9px;
}
.copy{
padding: 15px;
}
.copy span{
display: inline-block;
}
}
@media(max-width:360px ){
.jumbotron h2{
font-size: 22px;
}
footer p{
font-size: 11px;
}
}
@media(max-width:320px ){
.box-head h3{
font-size: 17px;
}
}
h2{
color: #ffffff;
}
input[type=range] {
-webkit-appearance: none;
margin: 10px 0;
width: 80%;
}
input[type=range]:focus {
outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
width: 100%;
height: 13px;
cursor: pointer;
animate: 0.2s;
box-shadow: 0px 0px 0px #000000;
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
border-radius: 25px;
border: 0px solid #000101;
}
input[type=range]::-webkit-slider-thumb {
box-shadow: 0px 0px 0px #000000;
border: 1px solid #616161;
height: 18px;
width: 30px;
border-radius: 7px;
background: #FFFFFF;
cursor: pointer;
-webkit-appearance: none;
margin-top: -3px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
}
input[type=range]::-moz-range-track {
width: 100%;
height: 13px;
cursor: pointer;
animate: 0.2s;
box-shadow: 0px 0px 0px #000000;
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
border-radius: 25px;
border: 0px solid #000101;
}
input[type=range]::-moz-range-thumb {
box-shadow: 0px 0px 0px #000000;
border: 1px solid #616161;
height: 18px;
width: 30px;
border-radius: 7px;
background: #FFFFFF;
cursor: pointer;
}
input[type=range]::-ms-track {
width: 100%;
height: 13px;
cursor: pointer;
animate: 0.2s;
background: transparent;
border-color: transparent;
color: transparent;
}
input[type=range]::-ms-fill-lower {
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
border: 0px solid #000101;
border-radius: 50px;
box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-fill-upper {
background: #9B59B6;
border: 0px solid #000101;
border-radius: 50px;
box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-thumb {
margin-top: 1px;
box-shadow: 0px 0px 0px #000000;
border: 1px solid #616161;
height: 18px;
width: 30px;
border-radius: 7px;
background: #FFFFFF;
cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
}
input[type=range]:focus::-ms-fill-upper {
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
}
.range-slider__value {
display: inline-block;
position: relative;
width: 60px;
color: #fff;
line-height: 15px;
text-align: center;
border-radius: 3px;
background: -webkit-linear-gradient(to bottom, #004e92, #000428);
background: linear-gradient(to bottom, #004e92, #000428);
padding: 5px 8px;
margin-left: 3px;
float:right;
margin-top: 6px;
&:after {
position: absolute;
top: 8px;
left: -7px;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-right: 7px solid #9b59b6;
border-bottom: 7px solid transparent;
content: '';
}
}