body, html {
height: 100%;
}
.parallax_home_1, .parallax_home_2 {
/* Create the parallax scrolling effect */
background-attachment: scroll;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.parallax_home_1 {
/* The image used */
background-image: url("california-1751455_1920.jpg");
/* Link: https://pixabay.com/de/california-sonnenuntergang-1751455/
Author: Inactive account - ID 12019
*/
/* Set a specific height */
height: 100%;
}
.parallax_home_2 {
/* The image used */
background-image: url("cairn-1531997_1920.jpg");
/* Link: https://pixabay.com/de/steinhaufen-nebel-mystisch-1531997/
Author: Momonator
*/
/* Set a specific height */
height: 100%;
}
.container {
width: 95%;
}
.col, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
padding-right: 20px;
padding-left: 20px;
padding-top: 20px;
padding-bottom: 20px;
}
.caption {
position: absolute;
left: 0;
top: 50%;
width: 100%;
text-align: center;
color: #000;
}
.caption_floweroflife {
position: absolute;
}
.caption_floweroflife img.size {
width: 100%;
height: 100%;
}
@media only screen and (orientation: portrait){
.caption_floweroflife{
top: 35%;
left: 20%;
right: 20%;
}
.container-profile {
padding-top: 30%;
padding-left: 5%;
padding-right: 5%;
}
}
@media only screen and (orientation: portrait) and (max-width: 360px){
.container-profile {
padding-top: 5%;
padding-left: 5%;
padding-right: 5%;
}
}
@media only screen and (orientation: landscape){
.caption_floweroflife{
top: 10%;
left: 30%;
right: 30%;
}
.container-profile {
padding-top: 0%;
padding-left: 5%;
padding-right: 5%;
}
}
@media only screen and (orientation: landscape) and (max-width: 1340px){
.caption_floweroflife{
top: 23%;
left: 30%;
right: 30%;
}
.container-profile {
padding-top: 15%;
padding-left: 5%;
padding-right: 5%;
}
}
@media only screen and (orientation: landscape) and (max-width: 1280px) and (max-height: 650px){
.caption_floweroflife{
top: 15%;
left: 32%;
right: 32%;
}
.container-profile {
padding-top: 0%;
padding-left: 5%;
padding-right: 5%;
}
}
@media only screen and (orientation: landscape) and (max-width: 640px){
.caption_floweroflife{
top: 23%;
left: 30%;
right: 30%;
}
.container-profile {
padding-top: 15%;
padding-left: 5%;
padding-right: 5%;
}
}
@media only screen and (orientation: landscape) and (max-width: 480px){
.caption_floweroflife{
top: 30%;
left: 30%;
right: 30%;
}
.container-profile {
padding-top: 10%;
padding-left: 5%;
padding-right: 5%;
}
}
.caption span.border {
background-color: #111;
color: #fff;
padding: 18px;
font-size: 25px;
letter-spacing: 10px;
}
.navbar-brand {
float: left;
height: 50px;
padding: 11px 15px;
font-size: 24px;
line-height: 24px;
}
.navbar-inverse {
background-color: #222;
border-color: #080808;
padding: 0px;
}
.navbar-inverse .navbar-brand {
color: #9d9d9d;
}
.navbar-inverse .navbar-brand:hover,
.navbar-inverse .navbar-brand:focus {
color: #fff;
background-color: transparent;
}
.navbar-inverse .navbar-text {
color: #9d9d9d;
}
.navbar-inverse .navbar-nav > li > a {
color: #9d9d9d;
padding-left: 15px;
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
color: #fff;
background-color: transparent;
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
color: #fff;
background-color: #080808;
}
.navbar-inverse .navbar-nav > .disabled > a,
.navbar-inverse .navbar-nav > .disabled > a:hover,
.navbar-inverse .navbar-nav > .disabled > a:focus {
color: #444;
background-color: transparent;
}
.navbar-inverse .navbar-toggle {
border-color: #333;
}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
background-color: #333;
}
.navbar-inverse .navbar-toggler {
border-color: #333;
margin-right: 15px;
border-radius: 4px;
}
.navbar-inverse .navbar-toggler:hover,
.navbar-inverse .navbar-toggler:focus {
background-color: #333;
}
.navbar-inverse .navbar-toggler-icon {
background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(100%, 100%, 100%, 1.0)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
color: #fff;
}
.navbar-toggler-icon {
display: inline-block;
width: 1.5em;
height: 1.5em;
vertical-align: middle;
content: "";
background: no-repeat center center;
background-image: none;
background-size: auto auto;
background-size: 100% 100%;
}
.navbar-inverse .navbar-toggler .icon-bar {
background-color: #333;
}
.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
border-color: #101010;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
color: #fff;
background-color: #080808;
}
.form-inline {
margin-right: 15px;
}
.form-control {
height: 30px;
margin-left: 15px;
width: 70%;
}
.btn {
padding: 0 15px;
}
.btn-outline-success {
color: #9d9d9d;
border-color: #9d9d9d;
height: 30px;
margin-left: 5px;
}
.btn-outline-success:hover {
color: #000;
background-color: #fff;
border-color: #fff;
}