:root {
    --main-bg-mid-color: rgb(247,234,222);
    --main-bg-mid-grad-color: rgba(247,234,222,1);
    --main-bg-soft-color: rgb(250,237,229);
    --main-bg-soft-blue-color: rgba(70,117,130,1);
    --main-bg-soft-very-brown-color: rgba(212,149,133,1);
    --main-bg-soft-brown-color: rgba(222,173,160,1);
    --main-bg-soft-grad-color: rgba(250,237,229,1);
    --main-bg-very-mid-grad-color: rgba(250,223,212,1);
    --main-bg-less-strong-grad-color: rgba(243,212,202,1);
    --main-bg-strong-color: rgb(233,194,187);
    --main-bg-strong-grad-color: rgba(233,194,187,1);
    --main-bg-very-strong-grad-color: rgba(230,192,185,1);
    --main-bg-very-dark-grad-color: rgba(190,162,155,1);
    --main-bg-grad0-color: var(--main-bg-soft-grad-color);
    --main-bg-grad1-color: var(--main-bg-very-mid-grad-color); 
    --main-bg-grad2-color: var(--main-bg-mid-grad-color);
    --main-bg-grad2-color_50: var(--main-bg-strong-grad-color_50);
    --main-bg-color: var(--main-bg-grad2-color);
    --main-fore-color: rgb(37,70,80);
    --main-fore-color_15: rgba(37,70,80,0.15);
    --main-fore-color_25: rgba(37,70,80,0.25);
    --main-fore-color_50: rgba(37,70,80,0.5);
    --main-fore-color_75: rgba(37,70,80,0.75);
    --main-fore-color_100: rgba(37,70,80,1);
    --main-fore-color2: rgb(47,84,96);
    --main-fore-color2_15: rgba(57,90,100,0.15);
    --main-fore-color2_25: rgba(57,90,100,0.25);
    --main-fore-color2_50: rgba(57,90,100,0.5);
    --main-fore-color2_75: rgba(57,90,100,0.75);
    --main-fore-color2_100: rgba(57,90,100,1);
    --main-fore-color-warning: rgb(233,88,88);
    --main-H-font: var(--main-fore-color);
    --main-T-font: rgb(111,111,111);
    --main-T-font_25: rgb(111,111,111,0.25);
    --main-T-font_50: rgb(111,111,111,0.50);
    --main-T-font_75: rgb(111,111,111,0.75);
    --main-D-font: rgb(95,95,95);
    --sub-T-font: rgb(80,151,171);
    
/*    --main-bg-soft-grad-color_15: rgba(250,237,229,0.15);
    --main-bg-strong-grad-color_15: rgba(233,194,187,0.15);   
    --main-bg-soft-grad-color_25: rgba(250,237,229,0.25);
    --main-bg-strong-grad-color_25: rgba(233,194,187,0.25);   
    --main-bg-soft-grad-color_50: rgba(250,237,229,0.5);
    --main-bg-strong-grad-color_50: rgba(233,194,187,0.5);   
    --main-bg-strong-grad-color_75: rgba(233,194,187,0.75);
    */
    --main-bg-soft-grad-color_15: rgba(202,160,159,0.15);
    --main-bg-strong-grad-color_15: rgba(217,147,139,0.15);   
    --main-bg-soft-grad-color_25: rgba(202,160,159,0.25);
    --main-bg-strong-grad-color_25: rgba(217,147,139,0.25);   
    --main-bg-strong-grad-color_38: rgba(217,147,139,0.38);
    --main-bg-soft-grad-color_50: rgba(202,160,159,0.5); 
    --main-bg-strong-grad-color_50: rgba(217,147,139,0.5);   
    --main-bg-strong-grad-color_75: rgba(217,147,139,0.75);   
}

html,body{
/*    height: 90%;*/
    padding:0;
    margin:0;
    scroll-behavior: smooth;
}

body {
    color: var(--main-T-font);
/*    background: var(--main-bg-grad2-color);*/
/*    background: -moz-linear-gradient(top, var(--main-bg-grad1-color) 0%, var(--main-bg-grad2-color) 69%, var(--main-bg-grad2-color) 70%, var(--main-bg-grad1-color) 100%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad1-color) 0%,var(--main-bg-grad2-color) 69%,var(--main-bg-grad2-color) 70%,var(--main-bg-grad1-color) 100%);
    background: linear-gradient(to bottom, var(--main-bg-grad1-color) 0%,var(--main-bg-grad2-color) 69%,var(--main-bg-grad2-color) 70%,var(--main-bg-grad1-color) 100%);*/
/*    background: -moz-repeating-linear-gradient(top, var(--main-bg-grad1-color) 0px, var(--main-bg-grad2-color) 889px, var(--main-bg-grad2-color) 900px, var(--main-bg-grad1-color) 1200px);
    background: -webkit-repeating-linear-gradient(top, var(--main-bg-grad1-color) 0px,var(--main-bg-grad2-color) 889px,var(--main-bg-grad2-color) 900px, var(--main-bg-grad1-color) 1200px);
    background: repeating-linear-gradient(to bottom, var(--main-bg-grad1-color) 0px,var(--main-bg-grad2-color) 889px,var(--main-bg-grad2-color) 900px, var(--main-bg-grad1-color) 1200px);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );*/
    font-size: 1.3em;
/*    font-family: Lato, serif;*/
}
h1 {
    text-align: center;
    font-variant:small-caps;
    color: var(--main-H-font);
    font-weight: lighter;
}

h2 {
    color: var(--main-H-font);
    font-weight: lighter;
}

h3 {
    color: var(--main-D-font);
    font-weight: lighter;
}

h4 {
    color: var(--main-D-font);
    font-weight: lighter;
}

.vcgreen {
    color:#ddd;
    background-color:#254650;
}
.vcgreen a:link{color:#ddd;}
.vcgreen a:visited{color:#cce;}

#Fullframe {
    height: 100%;
    width: 100%;
    min-height: 700px;
}
#Mainframe {
    position: relative;
    height: 600px;
    width: 900px;
    min-height: 700px;
    margin: 0 auto;
}
#Navigationframe {
    position: relative;
    display: inline-block;
    background-color: white;
    height: 100%;
    width: 180px;
	
    -moz-box-shadow: inset 2px 0px 5px 3px #DDD;
    -webkit-box-shadow: inset 2px 0px 15px 3px #DDDDE5;
    box-shadow: inset 2px 0px 5px 3px #DDD;
    border-radius: 20px 0 0 20px;
    -moz-border-radius: 20px 0 0 20px;
    -webkit-border-radius: 20px 0 0 20px;
}
#Navigatorframe {
    position: absolute;
    bottom: 0px;
    width: 140px;
    background-color: rgba(225,225,225, .9); ;
    padding: 20px 20px 35px;
    margin: 0px;
    vertical-align: baseline;
    border-radius: 0 0 0 20px;
    -moz-border-radius: 0 0 0 20px;
    -webkit-border-radius: 0 0 0 20px;
}
#Navigationframe a{
    display: block;
    transition: all .2s;
    -o-transition: all .2s;
    -moz-transition: all .2s;
    -webkit-transition: all .2s;
}

#Navigationframe a:hover{
    display: block;
    font-weight: bold;
    margin-left: 8px;
    transition: all .4s;
    -o-transition: all .4s;
    -moz-transition: all .4s;
    -webkit-transition: all .4s;
}

#Presentationframe {
    position: relative;
    display: inline-block;
    background-color: white;
    height: 100%;
    width: 710px;
    -moz-box-shadow: inset -2px 0 5px 2px #DDD;
    -webkit-box-shadow: inset -2px 0 5px 2px #DDDDE5;
    box-shadow: inset -2px 0 5px 2px #DDD;
    border-radius: 0 20px 20px 0;
    -moz-border-radius: 0 20px 20px 0;
    -webkit-border-radius: 0 20px 20px 0;
}

#Welcomeframe{
    margin-left: auto;
    margin-right: auto;
}

#Welcomeframe p{
    font-weight: lighter;
/*    font-size: 0.75em;*/
    padding: 3px;
    margin: 3px;
    text-align: center;
}

#Welcomeframe h1{
    margin: 50px 0;
    text-align: center;
}

#Welcomeframe p a{
    color: var(--main-fore-color);
}
#Welcomeframe p a:link{
    color: var(--main-fore-color);
}


#Navigatorbar {
    position: sticky;
    top: 0;
    overflow: visible;
    text-align: center;
/*    width: 100%;
    display: flex;  
    justify-content:space-around;*/
    background-color: white !important;
    vertical-align: center;
    z-index: 999;
    box-shadow: 0 8px 8px -8px rgba(0, 0, 0, 0.3);
}

#Navigatorbar .round {
    -moz-border-radius: 70px;
    -webkit-border-radius: 70px;
    border-radius: 70px;
}
#Navigatorbar div {
    display: inline-block;
    bottom: 0;
}

#Navigatorbar a {
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    
    display: inline-block;
    color: var(--main-bg-very-dark-grad-color);
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    
    box-shadow: 0 8px 16px -8px rgba(0, 0, 0, 0.3);
}

#Navigatorbar a:hover{
/*    background-color: var(--main-bg-color);*/
/*    background: -moz-linear-gradient(top, var(--main-bg-grad2-color_50) 0%, var(--main-bg-grad1-color) 69%, var(--main-bg-grad1-color) 70%, var(--main-bg-grad2-color_50) 100%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad2-color_50) 0%,var(--main-bg-grad1-color) 69%,var(--main-bg-grad1-color) 70%,var(--main-bg-grad2-color_50) 100%);
    background: linear-gradient(to bottom, var(--main-bg-grad2-color_50) 0%,var(--main-bg-grad1-color) 69%,var(--main-bg-grad1-color) 70%,var(--main-bg-grad2-color_50) 100%);*/
/*    background: -moz-linear-gradient(top, var(--main-bg-grad0-color) 50%, var(--main-bg-strong-grad-color) 79%, var(--main-bg-strong-grad-color) 80%, var(--main-bg-grad0-color) 100%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad0-color) 50%,var(--main-bg-strong-grad-color) 79%,var(--main-bg-strong-grad-color) 80%,var(--main-bg-grad0-color) 100%);
    background: linear-gradient(to bottom, var(--main-bg-grad0-color) 50%,var(--main-bg-strong-grad-color) 79%,var(--main-bg-strong-grad-color) 80%,var(--main-bg-grad0-color) 100%);*/
    background: -moz-linear-gradient(top, white 50%, var(--main-bg-very-mid-grad-color) 79%, var(--main-bg-very-mid-grad-color) 80%, white 100%);
    background: -webkit-linear-gradient(top, white 50%,var(--main-bg-very-mid-grad-color) 79%,var(--main-bg-very-mid-grad-color) 80%,white 100%);
    background: linear-gradient(to bottom, white 50%,var(--main-bg-very-mid-grad-color) 79%,var(--main-bg-very-mid-grad-color) 80%,white 100%);
    color: var(--main-fore-color);
    box-shadow: 0 8px 16px -8px rgba(0, 0, 0, 0.7);
}

#Navigatorbar a.active {
    /*background-color: var(--main-bg-mid-color);*/
/*    background: -moz-linear-gradient(top, var(--main-bg-grad1-color) 0%, var(--main-bg-grad2-color) 69%, var(--main-bg-grad2-color) 70%, var(--main-bg-grad1-color) 100%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad1-color) 0%,var(--main-bg-grad2-color) 69%,var(--main-bg-grad2-color) 70%,var(--main-bg-grad1-color) 100%);
    background: linear-gradient(to bottom, var(--main-bg-grad1-color) 0%,var(--main-bg-grad2-color) 69%,var(--main-bg-grad2-color) 70%,var(--main-bg-grad1-color) 100%);*/

/*    background: -moz-linear-gradient(top, var(--main-bg-grad2-color) 0%, var(--main-bg-grad1-color) 69%, var(--main-bg-grad1-color) 70%, var(--main-bg-grad2-color) 100%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad2-color) 0%,var(--main-bg-grad1-color) 69%,var(--main-bg-grad1-color) 70%,var(--main-bg-grad2-color) 100%);
    background: linear-gradient(to bottom, var(--main-bg-grad2-color) 0%,var(--main-bg-grad1-color) 69%,var(--main-bg-grad1-color) 70%,var(--main-bg-grad2-color) 100%);*/

/*    background: -moz-linear-gradient(top, var(--main-bg-grad0-color) 50%, var(--main-bg-very-strong-grad-color) 79%, var(--main-fore-color_100) 80%,var(--main-bg-grad0-color) 83%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad0-color) 50%,var(--main-bg-very-strong-grad-color) 79%, var(--main-fore-color_100) 80%,var(--main-bg-grad0-color) 83%);
    background: linear-gradient(to bottom, var(--main-bg-grad0-color) 50%,var(--main-bg-very-strong-grad-color) 79%, var(--main-fore-color_100) 80%,var(--main-bg-grad0-color) 83%);*/
    background: -moz-linear-gradient(top, white 50%, var(--main-bg-very-mid-grad-color) 79%, var(--main-bg-very-mid-grad-color) 80%, white 100%);
    background: -webkit-linear-gradient(top, white 50%,var(--main-bg-very-mid-grad-color) 79%,var(--main-bg-very-mid-grad-color) 80%,white 100%);
    background: linear-gradient(to bottom, white 50%,var(--main-bg-very-mid-grad-color) 79%,var(--main-bg-very-mid-grad-color) 80%,white 100%);

    color: var(--main-fore-color);
    box-shadow: 0 8px 16px -8px rgba(0, 0, 0, 0.5);
}

#Navigatorbar a.active img{
    /*background-color: var(--main-bg-mid-color);*/
/*    background: -moz-linear-gradient(top, var(--main-bg-grad1-color) 0%, var(--main-bg-grad2-color) 69%, var(--main-bg-grad2-color) 70%, var(--main-bg-grad1-color) 100%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad1-color) 0%,var(--main-bg-grad2-color) 69%,var(--main-bg-grad2-color) 70%,var(--main-bg-grad1-color) 100%);
    background: linear-gradient(to bottom, var(--main-bg-grad1-color) 0%,var(--main-bg-grad2-color) 69%,var(--main-bg-grad2-color) 70%,var(--main-bg-grad1-color) 100%);*/
/*    background: -moz-linear-gradient(top, var(--main-bg-grad2-color) 0%, var(--main-bg-grad0-color) 69%, var(--main-bg-grad0-color) 70%, var(--main-bg-grad2-color) 100%);
    background: -webkit-linear-gradient(top, var(--main-bg-grad2-color) 0%,var(--main-bg-grad0-color) 69%,var(--main-bg-grad0-color) 70%,var(--main-bg-grad2-color) 100%);
    background: linear-gradient(to bottom, var(--main-bg-grad2-color) 0%,var(--main-bg-grad0-color) 69%,var(--main-bg-grad0-color) 70%,var(--main-bg-grad2-color) 100%);*/
    background: -moz-linear-gradient(top, white 50%, var(--main-bg-very-mid-grad-color) 79%, var(--main-bg-very-mid-grad-color) 80%, white 100%);
    background: -webkit-linear-gradient(top, white 50%,var(--main-bg-very-mid-grad-color) 79%,var(--main-bg-very-mid-grad-color) 80%,white 100%);
    background: linear-gradient(to bottom, white 50%,var(--main-bg-very-mid-grad-color) 79%,var(--main-bg-very-mid-grad-color) 80%,white 100%);
    color: var(--main-fore-color);
}


#Infofooter {
    overflow: hidden;
    text-align: center;
    background-color: var(--main-fore-color) !important;
    color: var(--main-bg-strong-color);
    z-index: 999;
    width: 100%;
    padding: 3px 0px 8px; 
}

#Infofooter p {
    text-align: center;
    font-size: 12px;
    padding:3px 30px; 
    margin: 3px;
}
#Infofooter a {
    font-size: 17px;    
}

a.anchor {
    display: block;
    position: relative;
    top: -150px;
    visibility: hidden;
}

hr {
/*    color: var(--main-T-font);*/
    background-color: var(--main-T-font);
}

hr.small{
    border: none;
    height: 1px;
    background-color: var(--main-T-font_25);
}
hr.medium{
    border: none;
    height: 1px;
    background-color: var(--main-T-font_50);
}

.content {
    padding: 16px;
    /*padding: 16px;*/
    display: block; 
    margin-left: auto;
    margin-right: auto;
/*  font-family: 'Pacifico'; */
}

.baumimage {
    height: 160px;
    width: 160px;
}

.baumimage_small {
    height: 60px;
    width: 60px;
}

.baumcover {
    margin:0px 20px !important;
    padding:0px !important;
    box-shadow: 0 0 0 0 !important;
    border-radius: 0px !important;
 }

.content div {
    margin: 0px 0px 30px;
}
.content_end {
    text-align: center;
    display: flex;
    justify-content:center;
    margin:0 !important;
}
div.complex {
    position: relative;
    text-align: center;
}

div.complex div {
    position: absolute;   
}
div.complex .centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

div.complex span {
    background-color: silver;
    background-color: hsla(0, 0%, 100%, 0.5);
}

div.parallax {
    margin: 0px;
}

div.parallax1 {
    margin: 0px;
    background-position-x: center;
    background-position-y: 0px;
    background-attachment: scroll;
    background-repeat: no-repeat;
    
    -webkit-transition: all 0s ease;
    -moz-transition: all 0s ease;
    -o-transition: all 0s ease;
    -ms-transition: all 0s ease;
    transition: all 0s ease;
    
/*    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -o-transition: all 2s ease;
    -ms-transition: all 2s ease;
    transition: all 2s ease;
    */
}


.parallax .pA {
  background-image: url("../img/IMG_2930_r.JPG");
}
.parallax .pB0 {
  background-image: url("../img/IMG_2970_Startbild_4_r.JPG");
}
.parallax .pB1 {
  background-image: url("../img/bsp_frauen.jpg");
}
.parallax .pB2 {
  background-image: url("../img/bsp_schwangere.jpg");
}
.parallax .pB3 {
  background-image: url("../img/bsp_mutter_baby.jpg");
}
.parallax .pC {
  background-image: url("../img/IMG_2915_r.JPG");
}
.parallax .pD {
  background-image: url("../img/IMG_2985_r.JPG");
}

.parallax1 p {
/*    filter: alpha(opacity=80); 
    opacity: 0.8; 
    -moz-opacity: 0.8;*/
    margin: 200px 0;
    text-align: center;
    background-color: silver;
    background-color: hsla(0, 0%, 100%, 0.7);
}
.parallax1 .pC p {
    background-color: hsla(0, 0%, 100%, 0.7);
}

p.pocket {
    width:100%;
    text-align: center;
    display: flex;
    justify-content:space-between; 
}

.pocket a:any-link {
    background-image: linear-gradient(rgba(255,255,255,0.5), var(--main-bg-strong-grad-color_25));
    text-decoration:none;
    color: var(--main-T-font);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 5px 0 rgba(0, 0, 0, 0.1);
}

.pocket a:hover{
    background-image: linear-gradient(rgba(255,255,255,0.15), var(--main-bg-strong-grad-color_50));
    transition: opacity 2.4s;
    -o-transition: opacity 2.4s;
    -moz-transition: opacity 2.4s;
    -webkit-transition: opacity 2.4s;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.2);
}
.pocket a:active{
    background-image: linear-gradient(rgba(255,255,255,0.75), var(--main-bg-strong-grad-color_15));
    transition: all .4s;
    -o-transition: all .4s;
    -moz-transition: all .4s;
    -webkit-transition: all .4s;
}

.pocket .invert {
    color: var(--main-bg-strong-color) !important;
    background-color: var(--main-fore-color) !important;
}
.pocket .invert span {
    color: var(--main-bg-mid-color) !important;
}

.pocket .invert strong {
    color: var(--main-bg-strong-color) !important;
}

.pocket .p0 {
    text-align: center;
    display: flow-root;
}
.pocket .p0 img{
    display: inline;
    justify-content: center;
}
.pocket .p1 {
    padding: 10px;
    text-align: center;
    display: flow-root;
}
.pocket .p1small {
    padding: 5px;
    font-weight: lighter;
    font-size: 0.75em;
    text-align: center;
    display: flow-root;
}
.pocket .p1 img{
    display: inline;
    justify-content: center;
}
.pocket .p1small img{
    display: inline;
    justify-content: center;
}

a.p1small:any-link {
}

a.p1small:hover {
    box-shadow: 0px 4px 8px -4px rgba(0, 0, 0, 0.4), 0 6px 20px 0 rgba(0, 0, 0, 0.39),inset 0px -5px 0px -3px rgba(0, 0, 0, 0.25);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

/*.pocket .p3 {
    display: inline;
    width:28.3%;
    float:left;
    margin:0.852%;
    padding:1.666%;
}*/

.pocket .p3 {
    display: inline;
    width:30%;
    justify-content: center;
}

.pocket a.p3 {
    padding: 5px 2px 15px;
    margin-bottom: 10px;
}

.pocket .p3 img{
    display: inline;
    width: 90%;
    justify-content: center;
    margin: 5px 2px 5px;
}

.pocket .p4 {
    display: inline;
    width:22%;
    justify-content: center;
}

.pocket a.p4 {
    padding: 5px 2px 15px;
    margin-bottom: 10px;
}

.pocket .p4 img{
    display: inline;
    width: 90%;
    justify-content: center;
    margin: 5px 2px 5px;
}

.pocket .ps3 {
    display: inline;
    width: 30%;
    justify-content: center;
}

.pocket a.ps3 {
    padding: 2px 2px 10px;
    margin-bottom: 10px;
}

.pocket .ps3 img{
    display: inline;
    width: 90%;
    justify-content: center;
    margin: 8px 2px 0px;
}

.pocket .ps4 {
    display: inline;
    width: 20%;
    justify-content: center;
}

.pocket a.ps4 {
    padding: 2px 2px 10px;
    margin-bottom: 10px;
    font-size: 0.95em;
}

.pocket .ps4 img{
    display: inline;
    width: 90%;
    justify-content: center;
    margin: 8px 2px 0px;
}

.pocket .ps5 {
    display: inline;
    width: 18%;
    justify-content: center;
}

.pocket a.ps5 {
    padding: 2px 2px 10px;
    margin-bottom: 10px;
    font-size: 0.9em;
}

.pocket .ps5 img{
    display: inline;
    width: 90%;
    justify-content: center;
    margin: 8px 2px 0px;
}

div.infobox {
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3), 0 2px 5px 0 rgba(0, 0, 0, 0.3);
    background-color: var(--main-bg-strong-grad-color_38);
	line-height: 1.2;
}
div.infobox br{

}
#dezent {
    font-weight: lighter;
    font-size: 17px;
}

.stickytop {
  position: fixed;
  top: 0;
  width: 100%;
}
.stickydown {
  position: fixed;
  bottom: 0;
}

.stickytop + .content {
  padding-top: 135px;
}

p {
    text-align: justify;
    line-height: 1.5;
    font-weight: lighter;
    display: flow-root;
}

p strong {
    font-size: 1.15em;
    color: var(--main-D-font)
}
p span {
    color: var(--main-fore-color)
}

.hidden {
    visibility: hidden;
}

.collapse {
    visibility: collapse;
    display: none;
    overflow: hidden;
}

.displaynone {
    display: none;
}

#Menucaption{
    margin-top: -50px;
}
#Introframe {
    position: absolute;
    height: 300px;
    width: 50%;
    margin-top: -150px;
    top: 50%;
    left: 25%;
    vertical-align: middle;
    font-style: italic;
}
#Introcanal1{
    height: 125px;
    width: 100%;
}
#Introcanal1 div{
    height: 120px;
    font-size: 450%;
    text-align: right;
}
#Introcanal2{
    height: 70px;
    width: 100%;
}
#Introcanal2 div{
    height: 65px;
    font-size: 200%;
    text-align: right;
}
#Introcanal3{
    height: 100px;
    width: 100%;
}
#Introcanal3 div{
    display: inline-block;
    height: 95px;
    font-size: 250%;
    animation-timing-function: linear;
}
#Intro1{
    width: 85%;
    -webkit-animation-name: ani1; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 5s; /* Chrome, Safari, Opera */
    animation-name: ani1;
    animation-duration: 5s;
}
#Intro2{
    width: 60%;
    -webkit-animation-name: ani2; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 5s; /* Chrome, Safari, Opera */
    animation-name: ani2;
    animation-duration: 5s;
}
#Intro3{
    width: 150px;
    text-align: right;
    -webkit-animation-name: ani3; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 5s; /* Chrome, Safari, Opera */
    animation-name: ani3;
    animation-duration: 5s;
}
#Intro4{
    width: 80px;
    text-align: center;
    -webkit-animation-name: ani4; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 5s; /* Chrome, Safari, Opera */
    animation-name: ani4;
    animation-duration: 5s;
}
#Intro5{
    width: 200px;
    text-align: left;
    -webkit-animation-name: ani5; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 5s; /* Chrome, Safari, Opera */
    animation-name: ani5;
    animation-duration: 5s;
}

#motion1 div{
    border: 1px solid red;  
    width: 30px;     
    height: 30px;
    text-align: center;
    background-color: red; /* for vizualization purposes */
    display: inline-block;    
}

@-webkit-keyframes ani1 {
    0% {width: 85%;}
    100% {width: 60%;}
}
@keyframes ani1 {
    0% {width: 85%;}
    100% {width: 60%;}
}
@-webkit-keyframes ani2 {
    0% {width: 60%;}
    100% {width: 45%;}
}
@keyframes ani2 {
    0% {width: 60%;}
    100% {width: 45%;}
}
@-webkit-keyframes ani3 {
    0% {width: 150px;}
    50% {width: 230px;}
    100% {width: 280px;}
}
@keyframes ani3 {
    0% {width: 150px;}
    50% {width: 230px;}
    100% {width: 280px;}
}
@-webkit-keyframes ani4 {
    0% {width: 80px;}
    50% {width: 130px;}
    100% {width: 100px;}
}
@keyframes ani4 {
    0% {width: 80px;}
    50% {width: 130px;}
    100% {width: 100px;}
}
/*Block: Size up*/
@media screen and (max-width: 400px) {
    #Welcomeframe p{
        font-size: 0.7em; 
    }
    #Navigatorbar a {
        font-size: 18px;
        padding: 8px 10px;
        margin: 4px 10px;
    }
    #Navigatorbar div {
        max-width: 100%;
    }
#Navigatorbar #Innerbar{
    max-width: 360px;
}
  div.content {
    max-width: 360px;
  }
  div.p1 {
    max-width: 360px;
  }
  img {
    max-width: 360px;      
  }
  div.parallax1 {
    background-size: 360px;
    min-height: 220px; 
  }
  div p img {
    max-width: 360px;            
  }
  p.pocket {
    display: block;
    }
  .pocket .p3 {
    display: block;
    width:100%;
    justify-content: center;
    }
    .pocket .p4 {
        display: block;
        width:100%;
        justify-content: center;
    }
    .pocket .ps3 {
        display: inline-block;
        width: 60%;
    }
    .pocket .ps4 {
        display: inline-block;
        width: 40%;
    }
    .pocket .ps5 {
        display: inline-block;
        width: 30%;
    }
}
@media screen and (min-width: 400px) {
    #Welcomeframe p{
        font-size: 0.72em; 
    }
    #Navigatorbar a {
        font-size: 19px;
        padding: 10px 12px;
        margin: 5px 12px;
    }
    #Navigatorbar div {
    max-width: 100%;
    }
#Navigatorbar #Innerbar{
    max-width: 360px;
}
    div.content {
      max-width: 360px;
    }
    div.p1 {
      max-width: 360px;
    }
    img {
      max-width: 360px;      
    }
    div.parallax1 {
      background-size: 360px;
      min-height: 220px; 
    }
    div p img {
      max-width: 360px;            
    }
    p.pocket {
      display: block;
      }
    .pocket .p3 {
      display: block;
      width:100%;
      justify-content: center;
     }
    .pocket .p4 {
        display: block;
        width:100%;
        justify-content: center;
    }
    .pocket .ps3 {
        display: inline-block;
        width: 60%;
    }
    .pocket .ps4 {
        display: inline-block;
        width: 40%;
    }
    .pocket .ps5 {
        display: inline-block;
        width: 30%;
    }
}
@media screen and (min-width: 540px) {
    #Welcomeframe p{
        font-size: 0.73em; 
    }
    #Navigatorbar a {
        font-size: 20px;
        padding: 12px 14px;
        margin: 5px 14px;
    }
    #Navigatorbar div {
        max-width: 100%;
    }
#Navigatorbar #Innerbar{
    max-width: 480px;
}
  div.content {
    max-width: 480px;
  }
  div.p1 {
    max-width: 480px;
  }
  img {
    max-width: 480px;      
  }
  div.parallax1 {
    background-size: 480px;
    /*background-position: center 110px;*/
    min-height: 300px; 
  }
  div p img {
    max-width: 480px;            
  }
    p.pocket {
        display: flex;
    }
    .pocket .p3 {
        display: inline;
        width:30%;
        justify-content: center;
    }
    .pocket .p4 {
        display: inline;
        width:22%;
        justify-content: center;
    }
    .pocket .ps3 {
        width: 30%;
    }
    p.pocket .ps4 {
        width: 20%;
    }
    .pocket .ps5 {
        width: 18%;
    }
}
@media screen and (min-width: 780px) {
    #Welcomeframe p{
        font-size: 0.74em; 
    }
    #Navigatorbar a {
        font-size: 21px;
        padding: 12px 14px;
        margin: 5px 16px;
    }
    #Navigatorbar div {
        max-width: 40%;
    }
#Navigatorbar #Innerbar{
    max-width: 720px;
}
  div.content {
    max-width: 720px;
  }
  div.p1 {
    max-width: 720px;
  }
  img {
    max-width: 720px;      
  }
  div.parallax1 {
    background-size: 720px;
    /*background-position: center 140px;*/
    min-height: 360px; 
  }

  div p img {
    max-width: 480px;            
  }
    p.pocket {
        display: flex;
    }
    .pocket .p3 {
        display: inline;
        width:30%;
        justify-content: center;
    }
    .pocket .p4 {
        display: inline;
        width:22%;
        justify-content: center;
    }
    .pocket .ps3 {
        width: 30%;
    }
    .pocket .ps4 {
        width: 20%;
    }
    .pocket .ps5 {
        width: 18%;
    }
}
@media screen and (min-width: 1000px) {
    #Welcomeframe p{
        font-size: 0.74em; 
    }
    #Navigatorbar a {
        font-size: 22px;
        padding: 13px 15px;
        margin: 5px 17px;
    }
    #Navigatorbar div {
        max-width: 40%;
    }
#Navigatorbar #Innerbar{
    max-width: 720px;
}
  div.content {
    max-width: 720px;
  }
  div.p1 {
    max-width: 720px;
  }
  img {
    max-width: 720px;      
  }
  div.parallax1 {
    background-size: 720px;
    /*background-position: center 145px;*/
    min-height: 380px; 
  }
  div p img {
    max-width: 480px;            
  }
    p.pocket {
        display: flex;
    }
    .pocket .p3 {
        display: inline;
        width:30%;
        justify-content: center;
    }
    .pocket .p4 {
        display: inline;
        width:22%;
        justify-content: center;
    }
    .pocket .ps3 {
        width: 30%;
    }
    .pocket .ps4 {
        width: 20%;
    }
    .pocket .ps5 {
        width: 18%;
    }
}

@media screen and (min-width: 1200px) {
#Welcomeframe p{
    font-size: 0.75em; 
}
#Navigatorbar a {
    font-size: 25px;
    padding: 14px 16px;
    margin: 5px 18px;
}
#Navigatorbar div {
    max-width: 40%;
}
#Navigatorbar #Innerbar{
    max-width: 1140px;
}
  div.content {
    max-width: 1140px;
  }
  div.p1 {
    max-width: 1140px;
  }
  img {
    max-width: 1140px;      
  }
  div.parallax1 {
    background-size: 1140px;
    /*background-position: center 105px;*/
    min-height: 400px; 
  }
  div p img {
    max-width: 800px;            
  }
    p.pocket {
        display: flex;
    }
    .pocket .p3 {
        display: inline;
        width:30%;
        justify-content: center;
    }
    .pocket .p4 {
        display: inline;
        width:22%;
        justify-content: center;
    }
    .pocket .ps3 {
        width: 30%;
    }
    .pocket .ps4 {
        width: 20%;
    }
    .pocket .ps5 {
        width: 18%;
    }
}

@media screen and (min-width: 1413px) {
#Welcomeframe p{
    font-size: 0.75em; 
}
#Navigatorbar a {
    font-size: 25px;
    padding: 14px 16px;
    margin: 5px 18px;
}
#Navigatorbar div {
    max-width: 40%;
}
#Navigatorbar #Innerbar{
    min-width: 100%;
}
  div.content {
    max-width: 1140px;
  }
  div.p1 {
    max-width: 1140px;
  }
  img {
    max-width: 1140px;      
  }
  div.parallax1 {
    background-size: 1140px;
    /*background-position: center 105px;*/
    min-height: 400px; 
  }
  div p img {
    max-width: 800px;            
  }
    p.pocket {
        display: flex;
    }
    .pocket .p3 {
        display: inline;
        width:30%;
        justify-content: center;
    }
    .pocket .p4 {
        display: inline;
        width:22%;
        justify-content: center;
    }
    .pocket .ps3 {
        width: 30%;
    }
    .pocket .ps4 {
        width: 20%;
    }
    .pocket .ps5 {
        width: 18%;
    }
}
/*Block: Size down*/
@media screen and (max-width: 840px) {
    .minor {
        visibility: collapse !Important;
        height: 0px !Important;
        width: 0px !Important;
        margin: -3px !Important;
        padding: 0px !Important;
    }
    .minor img {
        visibility: collapse !Important;
        height: 0px !Important;
        width: 0px !Important;
        margin: -3px !Important;
    }
}
 /* Turn off parallax scrolling for all tablets and phones. Increase/decrease the pixels if needed */
@media only screen and (max-device-width: 1366px) {
  .parallax {
    background-attachment: scroll;
  }
}