@charset "utf-8";
/* CSS Document */

html {
            height: 100%;
            margin: 0;
            -moz-user-select:-moz-none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -o-user-select: none;
            user-select: none;
        }
		
		body {
			height: 100%;
            margin: 0;
			padding:0;
			background: #eeeeee;
            font-family: 'Brush Script MT', cursive;
            -moz-user-select:-moz-none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -o-user-select: none;
            user-select: none;
		}

/* Mobile

        @media screen and (max-width:767px) {
           
                width: 100% !important;
                transform: scale(1.3);
            }

            */
		
		span {
			margin:0;
		padding:0;
		}

        

        .aligntopright {
            float: right;
            position:fixed;
            right:3%;
            top:3%;
            z-index:3;
            
            text-align:right;
            max-width: 20%;
            -webkit-filter: invert(100%);
            
        }

        .aligntopleft {
            float: left;
            position:fixed;
            left:3%;
            top:3%;
            z-index:3;
            
            text-align:left;
            -webkit-filter: invert(100%);
            max-width: 15%;
        }

        .alignbottomright {
            float: right;
            position:fixed;
            right:3%;
            bottom:3%;
            z-index:3;
            text-align:right;
            
            max-width: 12%;
            
        }

        .alignbottomleft {
            float:left;
            position:fixed;
            left:3%;
            bottom:3%;
            z-index:3;
           width:fit-content;
            text-align:left;
            max-width: 25%;
            -webkit-filter: invert(100%);
            
        }

        
       

        .aligncenter {
            position:absolute;
            top:0;
            left:0;
            right:0;
            bottom:0;
            margin:auto;
            z-index:1;
        }

.aligncenterwheel {
    width: 100%;  height: auto;
    position:absolute;
    z-index:2;
    cursor:pointer;
    pointer-events: none;
    -moz-user-select:-moz-none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -o-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: transparent;
    outline: none;
}



.aligncenterwheeltop {
    width: 100%;  height: auto; 
    position:relative;
    z-index:0;
    pointer-events:visible;
    cursor: pointer;
    transform-origin: center center;
    -moz-user-select:-moz-none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -o-user-select: none;
            user-select: none;
            -webkit-tap-highlight-color: transparent;
    outline: none;
}


.sidebar {
    position:fixed;
    float: left;
    top:15%;
    left:4%;
    display: flex;
    flex-direction:column;
    gap:5%;
    max-height: 90vh;
    overflow-y: auto;
    user-select: none;
}

iframe {
    position: relative;
    z-index: 9999 !important; /* Force the video to the very front */
    pointer-events: auto !important; /* Ensure it accepts mouse input */
    height: 100%;
    width:100%;
}

.nav-link {
    color:gray;
    text-decoration:none;
    transition: color 0.3s;
    font-size:clamp(1.2rem, 1.4vw, 1.4rem);
            font-family:Arial, Helvetica, sans-serif;
            user-select: none;
            margin:0;
            display:table;
            letter-spacing: .5px;
            line-height:clamp(1);
            padding-top: clamp(2rem, 3vw, 1.8rem);
            font-style:normal;
            text-align: left;
}

.nav-link.active {
    color:black;   
}

		
        #responsive-image {  width: 100%;  height: auto;display: inline-block;} 

        #container {
            position:relative;
    height: 100%;
    width:100%;
        }

        #container4 {
            position:relative;
-moz-user-select:-moz-none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -o-user-select: none;
            user-select: none;
            
    width: 100%;
            
            
            
           
            height: auto;
        }



        #container2 {
            content: "";
            display:block;
            clear:both;
            margin-left:23%;
            margin-right:23%;
            margin-top:0;
            margin-bottom:0;
            padding-bottom:50px;
            width:54%;
            height: auto;
        }

        #container3 {
            content: "";
            display:block;
            clear:both;
            margin-left:8%;
            margin-right:8%;
            margin-top:10%;
            margin-bottom:0;
            padding-top:15%;
            bottom:5%;
        }

        .copyright {
            font-family: Arial, Helvetica, sans-serif;
            text-align:center;
            color:#000;
            padding-top:10%;
            padding-bottom:5px;
            font-size:0.5em;
            letter-spacing: .5px;
            line-height:1.3;
            bottom:0%;
            position: relative;
        
        }

         .smalltitlesright {
            font-size:1.24em;
            font-family:Arial, Helvetica, sans-serif;
            
            margin:0;
            display:table;
            color:black;
            letter-spacing: .5px;
            line-height:1.2;
            font-style: normal;
            text-align: right;
        }

        .smalltitles {
            font-size:1.24em;
            font-family:Arial, Helvetica, sans-serif;
            padding-top:2%;
            padding-bottom:35%;
            margin:0;
            display:table;
            color:black;
            letter-spacing: .5px;
            line-height:1.3;
            font-style: normal;
            text-align: left;
        }


        .titles {
            font-style: bold;
            font-size:2em;
            font-family:Arial, Helvetica, sans-serif;
            padding-top:7%;
            
            margin:0;
            display:table;
            color:black;
            letter-spacing: .5px;
            line-height:1.2;
            text-wrap: wrap !important; /* Forces standard wrapping */
    word-break: normal;
    
        }

        .titles a {
            font-size:2em;
            font-family:Arial, Helvetica, sans-serif;
            margin:0;
            
            color:black;
            letter-spacing: .5px;
            
        }

        p {
            font-family: 'Brush Script MT', cursive;
            color:black;
            
            
        }

         a {
            font-family: 'Brush Script MT', cursive;
            color:black;
            
        }

        .quote-title {
            font-family:Arial, Helvetica, sans-serif;
            color:black;
            
            font-style:bold;
            font-size:3.236em;
            line-height:1.3;
            text-align: left;
            letter-spacing: .5px;
            padding-bottom:10%;
            padding-top:15%;
        }

        .quote-title-top {
            font-family:Arial, Helvetica, sans-serif;
            color:black;
            
            font-style:bold;
            font-size:3.236em;
            line-height:1.3;
            text-align: left;
            letter-spacing: .5px;
            padding-bottom:10%;
            padding-top:22%;
        }

        #art {
            content: "";
            clear:both;
            text-align:center;
            width:50%;
            height: 100%;
            
            margin: auto;
            display:block;
	overflow:auto;
            }

            #description {text-align:left;
                padding-top: 10%;
				}

        #containerback {
            position:relative;
    height:auto;
    width:auto;
    padding: 20%;
    z-index: -1;
    display: none;
        }

        .bio {
            
            z-index: -1;
            font-size:1px;
            display: none;
        }

        #myVideo {
            position: fixed;
            bottom: 0;
            right:0;
            min-width: 100%; 
            min-height: 100%;
            z-index: -1;
            transform: translateX(calc((100% - 100vw) / 2));
            
          }