html {
overflow-x: hidden;
}
body {
background-image:url(../img/bg.jpg);
width: 100%;
margin: 0;
}
.outline {
outline: 0.01em solid;
color: none;
}
/* NAWIGACJA GŁÓWNA */
nav#first_nav {
width: inherit;
background: #23688e;
background: -moz-linear-gradient(left, #236b8e 0%, #66cc00 0%, #236b8e 46%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#23688e), color-stop(0%,#66cc00), color-stop(46%,#236b8e));
background: -webkit-linear-gradient(left, #236b8e 0%,#66cc00 0%,#236b8e 46%);
background: -o-linear-gradient(left, #236b8e 0%,#66cc00 0%,#236b8e 46%);
background: -ms-linear-gradient(left, #236b8e 0%,#66cc00 0%,#236b8e 46%);
background: linear-gradient(to right, #236b8e 0%,#66cc00 0%,#236b8e 46%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#236b8e', endColorstr='#236b8e',GradientType=1 );
background-size: 120%;
color: white;
border: white solid;
border-width: 5px 0 5px 0;
}
nav#first_nav > ul {
width: inherit;
margin: 0;
padding: 0;
list-style-type: none;
display: inline-block;
font-family: 'loveloblack';
font-size: 1.1em;
font-weight: 100;
}
nav#first_nav > ul > li {
padding: 1%;
float: right;
transition: 0.5s background-color;
}
nav#first_nav > ul > li > a:link, a:visited {
color: white;
text-decoration: none;
}
nav#first_nav > ul > li > a:hover {
color: white;
}
nav#first_nav > ul > li:hover {
background-color: #ff0066;
}
nav#first_nav > ul > li:active {
background-color: #6b238E;
color: white;
}
/* TREŚĆ GŁÓWNA STRONY */
div#main_content {
width: 80%;
height: 80%;
margin: auto;
}
div#main_content p, h1, h2, h3 {
margin: 0;
text-align: justify;
}
div#main_content > article > figure {
float: right;
}
div#main_content > article {
width: 98%;
height: auto;
background-color: rgba(255,255,255,0.6);
color: #696969;
float: left;
padding: 1%;
border: 1px solid #6b238E;
overflow-y: auto;
margin-bottom: 2%;
}
div#main_content > article > p {
line-height: 100%;
margin-bottom: 2%;
text-indent: 5%;
font-size: 1em;
font-family: 'ubuntulight';
}
div#main_content > article > span {
font-family: 'loveloblack';
font-weight: 100;
font-size: 1.2em;
text-decoration: none;
color: white;
background-color: grey;
text-align: center;
width: 98%;
padding: 1%;
display: inline-block;
margin-bottom: 1%;
}
div#main_content > article > #subspan {
font-family: 'ubuntulight';
font-size: 1em;
text-decoration: none;
color: white;
background-color: #6b238E;
text-align: center;
width: 90%;
padding: 0.5%;
display: inline-block;
margin-bottom: 1%;
margin-left: 4%;
margin-right: 4%;
opacity: 0.4;
border: 1px black solid;
}
div#main_content > article > #portfolio {
background-color: black;
width: 60%;
height: auto;
float: right;
color: white;
overflow: auto;
}
div#main_content > article > #portfolio > img {
width: 30%;
height: auto;
display: inline-block;
}
div#main_content > article > form > fieldset {
background: white;
font-size: 1em;
font-family: 'ubuntulight';
}
div#main_content > article > form > fieldset > figure {
float: right;
padding: 2%;
}
div#main_content > article > form > fieldset > figure > img {
width: 100%;
height: auto;
}
div#main_content > article > form > fieldset > input, textarea {
margin-bottom: 1%;
border: 5px solid #fae3fa;
-webkit-box-shadow:
inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1);
-moz-box-shadow:
inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1);
box-shadow:
inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1);
background: rgba(255,255,255,0.5);
font-family: 'ubuntulight';
font-size: 0.8em;
}
div#main_content > article > form > fieldset > select {
margin-bottom: 1%;
border: 5px solid #fae3fa;
-webkit-box-shadow:
inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1);
-moz-box-shadow:
inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1);
box-shadow:
inset 0 0 8px rgba(0,0,0,0.1),
0 0 16px rgba(0,0,0,0.1);
background: rgba(255,255,255,0.5);
font-family: 'ubuntulight';
font-size: 0.8em;
}
div#main_content > article > form > fieldset > center > legend {
font-family: 'loveloblack';
font-weight: 100;
font-size: 1.2em;
background: #6b238E;
color: white;
}
.guzik {
font-family: 'loveloblack';
font-weight: 100;
font-size: 1.2em;
margin: 1%;
margin-left: 0;
}
div#main_content > article > a:hover {
background-color: #ff0066;
color: white;
}
div#main_content > article > a:active {
background-color: #66cc00;
color: white;
}
div#main_content > article > h2 {
font-family: 'loveloblack';
font-weight: 100;
font-size: 1.2em;
}
/* STOPKA I NAWIGACJA DOLNA */
footer {
width: 80%;
height: auto;
margin: auto;
background-color: #236b8e;
overflow: auto;
}
footer > nav#second_nav {
clear: both;
}
footer > nav#second_nav > ul {
margin: 0;
padding: 0;
list-style-type: none;
background-color: grey;
color: white;
text-align: center;
font-family: 'loveloblack';
border: white solid;
border-width: 5px 0 5px 0;
font-size: 1.1em;
font-weight: 100;
}
footer > nav#second_nav > ul > li {
padding: 1%;
display: inline-block;
transition: 0.5s background-color;
}
footer > nav#second_nav > ul > li > a {
color: white;
text-decoration: none;
}
footer > nav#second_nav > ul > li:hover {
background-color: #ff0066;
color: white;
}
footer > nav#second_nav > ul > li:active {
background-color: #66cc00;
color: white;
}
/*-------------------------*/
section#hyperlink_image {
width: 100%;
height: auto;
}
section#hyperlink_image > h2 {
margin-left: 4%;
margin-top: 1%;
font-family: 'ubuntulight';
color: white;
font-weight: 100;
}
section#hyperlink_image > div {
float: left;
display: block;
width: 12%;
height: auto;
margin: 4%;
margin-top: 1%;
margin-bottom: 1%;
background-image: url(../img/ikonki/DW.png);
background-repeat: no-repeat;
background-position: center;
background-size: 85% auto;
}
section#hyperlink_image > div:nth-child(3) {
background-image: url(../img/ikonki/FL.png);
}
section#hyperlink_image > div:nth-child(4) {
background-image: url(../img/ikonki/ID.png);
}
section#hyperlink_image > div:nth-child(5) {
background-image: url(../img/ikonki/AI.png);
}
section#hyperlink_image > div:nth-child(6) {
background-image: url(../img/ikonki/PS.png);
}
section#hyperlink_image > div > a {
}
section#hyperlink_image > div > a > img {
width: 100%;
height: auto;
transition: 0.5s ease-in opacity;
}
section#hyperlink_image > div > a > img:hover {
opacity: 0;
}
/*-------------------------------------------*/
section#info_page {
width: 100%;
height: auto;
background-color: #ff0066;
overflow: auto;
border-top: 5px solid white;
font-family: 'ubuntulight';
color: white;
}
section#info_page > p {
line-height: 100%;
margin-bottom: 2%;
text-indent: 5%;
font-size: 1em;
text-align: center;
}