publiccode.si/site/static/css/custom.css

275 lines
5.3 KiB
CSS
Raw Blame History

This file contains invisible Unicode characters!

This file contains invisible Unicode characters that may be processed differently from what appears below. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to reveal hidden characters.

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

/* SUBPAGES */
.subpage {
background-image: url(../img/header.jpg);
background-size: cover;
color: #fff;
min-height: 90%
}
.subpage h1 {
text-align: center;
}
/* ABOUT SECTION w/ video */
#about video {
width: 100% !important;
height: auto !important;
}
/* ARGUMENTS SECTION */
#arguments #arguments-followup p {
margin-top: 50px;
font-size: 18px;
}
/* LANGUAGE SECTION */
#language {
color: #fff;
background-color: #333;
padding: 20px;
}
#language p {
margin-bottom: 5px;
}
#language ul {
padding: 0px;
}
#language li {
display: inline-block;
margin-right: 10px;
}
#language li::before {
content: " ";
}
/* LEGAL SECTION */
#legal {
color: #fff;
background-color: #000;
padding: 10px;
margin: 0px;
}
#legal p {
padding: 0px;
margin: 0px;
font-size: 0.9em;
}
#legal a {
color: #83bdd6;
}
#legal a:hover {
color: #2093C4;
}
/* ORGANISATIONS SECTION */
#organisations ul {
display: block;
position: relative;
list-style: none;
text-align: center;
padding: 0;
}
#organisations ul li {
display: inline-block;
position: relative;
list-style: none;
}
#organisations ul li a {
display: block;
position: relative;
width: 12vw;
height: 8vw;
max-width: 120px;
max-height: 80px;
min-width: 120px;
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
transform: scale(0.8);
opacity: 1;
transition: opacity .5s, transform .5s, background-color .5s, filter .5s;
}
#organisations ul li a:hover {
opacity: 1;
transform: scale(0.9);
z-index: 5;
}
/* SIGN FORM */
#action form {
color: #333;
font-size: 18px;
}
#action form label {
font-weight: 400;
margin: 5px 3px;
}
.sign-input {
position: relative;
}
.sign-input:before {
font-family: "FontAwesome";
font-size: 20px;
position: absolute;
left: 4px;
top: 2px;
}
.sign-input input {
background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
border-radius: 7px;
padding: 0 0 0 30px;
width: 270px;
height: 31px;
}
.sign-input.form-co input {
width: 554px;
}
.sign-input select {
background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
border-radius: 7px;
padding: 0 0 0 30px;
width: 270px;
height: 31px;
}
.form-na:before {
content: "\f2c3";
}
.form-em:before {
content: "\f003";
}
.form-cn:before {
content: "\f041";
padding-left: 4px;
}
.form-zp:before {
content: "\f08d";
padding-left: 3px;
}
.form-co:before {
content: "\f27a";
padding-left: 3px;
}
p.form-pe {
text-align: left;
max-width: 530px; /* to not let the checkboxed go far more left than the input boxes above */
margin: 0 auto;
}
p.form-pe a {
color: inherit;
}
#honey {
display: none;
}
/* SIGNATURE TABLE */
table#signatures {
margin: 0 auto;
}
table#signatures th, table#signatures td {
border: 1px solid darkgrey;
border-collapse: collapse;
text-align: left;
padding: 2px;
}
/* SPECIAL LINK UNDERLINE EFFECT */
a:not(.btn):not(.hiddenlink) {
box-shadow: 0 0 1px transparent;
display: inline-block;
overflow: hidden;
position: relative;
transform: perspective(1px) translateZ(0px);
vertical-align: middle;
margin-top: -3px;
}
a:not(.btn):not(.hiddenlink)::before {
background: #006d9e none repeat scroll 0 0;
bottom: 2px;
content: "";
height: 1px;
left: 50%;
position: absolute;
right: 50%;
transition-duration: 0.3s;
transition-property: left, right;
transition-timing-function: ease-out;
z-index: -1;
}
a:not(.btn):not(.hiddenlink):hover::before, a:not(.btn):not(.hiddenlink):focus::before, a:not(.btn):not(.hiddenlink):active::before {
left: 0;
right: 0;
}
/* Bouncing down arrow */
.arrow-bounce {
text-align: center;
margin: -60px 0 -20px 0;
-moz-animation: bounce 2s infinite;
-webkit-animation: bounce 2s infinite;
animation: bounce 2s infinite;
}
.arrow-bounce a {
color: #168EC1;
padding: 30px;
}
.arrow-bounce a:hover {
color: #0F5E80;
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
transform: translateY(0);
}
40% {
transform: translateY(-20px);
}
60% {
transform: translateY(-10px);
}
}
/* Scroll to top arrow */
#scroll-to-top {
position: fixed;
bottom: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.7);
width: 50px;
height: 50px;
text-decoration: none;
border-radius: 50%;
}
#scroll-to-top i {
color: #fff;
margin: 0;
position: relative;
left: 16px;
top: 13px;
font-size: 19px;
}
/* DEFINITION BOX */
.definition {
margin: 20px 10px;
padding: 0px;
background-image: linear-gradient(white, white),
linear-gradient(white, white),
linear-gradient(white, white),
linear-gradient(white, white),
linear-gradient(rgba(288, 288, 288, 0.3), rgba(288, 288, 288, 0.3));
background-repeat: no-repeat;
background-size: 4px 30px, 30px 4px, 4px 30px, 30px 4px, calc(100% - 8px) calc(100% - 8px);
background-position: left top, left top, right bottom, right bottom, 4px 4px;
}
.definition.blue {
background-image: linear-gradient(#2093C4, #2093C4),
linear-gradient(#2093C4, #2093C4),
linear-gradient(#2093C4, #2093C4),
linear-gradient(#2093C4, #2093C4),
linear-gradient(rgba(32, 147, 196, 0.2), rgba(32, 147, 196, 0.2));
}
.definition p {
margin: 0;
padding: 20px 30px;
font-style: italic;
}