html {
  scroll-behavior: smooth;
}

.tabLeft{margin-left:40px;}

.center{text-align:center;}

.right{text-align:right;}

.roman{font-family:"Times New Roman", Times, serif;}

.georgia{font-family:"Georgia", Georgia, serif;}

.arial{font-family:"Arial", Arial, sans-serif;}

.csans{font-family:"Comic Sans MS", cursive;}

.impact{font-family:Impact, Charcoal, sans-serif;}

.altroman{font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;}

.cambria{font-family: Cambria, Georgia, serif;}

.vsmall{font-size:.7em;}

.small{font-size:.8em;}

.smedium{font-size:1.1em;}

.norm{font-size:1.2em;}

.medium{font-size:1.5 em;}

.large{font-size:1.5em;}

.vlarge{font-size:1.8em;}

.xxlarge{font-size:2.5em;}

.toobig{font-size:3.5em;}

.b{font-weight:bold;}

.i{font-style:italic;}

.u{text-decoration:underline;}

.shadow{text-shadow:1px 1px 1px gray;}

.black{color:black}

.blue{color:blue;}

.red{color:red;}

.green{color:green;}

.darkGreen{color:darkgreen;}

.yellow{color:yellow;}

.cyan{color:cyan;}

.orange{color:orangered;}

.violet{color:violet}

.purple{color:purple}

.darkBlue{color:darkblue;}

.bblue{background-color:blue;}

.bred{background-color:red;}

.bgreen{background-color:green;}

.byellow{background-color:yellow;}

.bcyan{background-color:cyan;}

.bdarkBlue{background-color:darkblue;}

.darkgray{color:gray;}

.bdarkgray{background-color:gray;}

.gray{color:lightgray;}

.bgray{background-color:lightgray;}

.lime{color:lime;}

.bdarkGreen{background-color:darkgreen;}

.blime{background-color:lime;}

.white{color:white;}

.bwhite{background-color:white;}

.darkred{color:darkred;}

.lightblue{color:#0099FF}

.goe{color: darkgreen; text-shadow: 1px 1px 1px gray;}

div.stickynote{width: 95%; padding: 15px; background-color: yellow; box-shadow: 10px 10px 5px gray;}

div.tabover{position:relative; left:50px; top:50px; right:-50px; bottom:-50px;}

#rcorner {border-radius:25px; background:white; padding:15px;}

div.whitesticky{width:30%; height:300px; padding:10px; background-color:beige; box-shadow:5px 5px 5px black;}

div.stdbox{float:left; margin:.2em; margin-bottom:1em; border:3px outset grey;}

table#border{border: 1px solid black; border-collapse: collapse;}

table#border tr{border: 1px solid black; border-collapse: collapse;}

table#border tr th{border: 1px solid black; border-collapse: collapse;}

table#border tr td{border: 1px solid black; border-collapse: collapse;}

td{padding:3px;}

ul#linkbar{list-style-type:none; margin:0; padding:0;}

ul#linkbar li{float:left;}

ul#linkbar li a{list-style-type:none; display:inline-block; background-color:blue; color:white; text-decoration:none; padding:5px 5px; font-size:0.86em}

ul#linkbar li a:hover{border:3px ridge lime; padding:2px 2px;}

ul#linkbar li a:active{background-color:darkblue; border:3px ridge lime; padding:2px 2px;}

ul#menu {list-style-type:none; margin-left:0px; padding:0;}

ul#menu li{display:inline; margin:1em; font-style:italic;}

ul#menu li a{background-color:blue; color:white; padding:10px 20px; text-decoration:none; border-radius:6px; box-shadow:3px 3px 3px black}

ul#menu li a:hover{background-color:red; color:black;}

table#bigbox{border:1px solid gray; border-collapse:collapse; width:900px; display:block; table-layout:fixed;}

table#bigbox tr td{border:2px solid gray; padding:5px;}

table#bigbox tr th{border:2px solid gray; padding:5px;}

table#bigbox2{border:1px solid gray; border-collapse:collapse; width:900px; display:block; table-layout:auto;}

table#bigbox2 tr td{border:2px solid gray; padding:5px;}

table#bigbox2 tr th{border:2px solid gray; padding:5px;}

centerd{display:block; margin-left:auto; margin-right:auto}

div#orangebox{width:90%; display:inline-block; padding:15px; border:3px inset gray}

a#pureheader{color:darkgreen; font-size:2.5em; font-weight:bold; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;}

a#pureheader:hover{color:lime;}

a#pureheader:active{color:black;}



ul#linkbar2{list-style-type:none; padding:0; display:inline-block;}

ul#linkbar2 li{float:center;}

ul#linkbar2 li a{display:block; font-family:"Comic Sans MS", cursive; color:white; text-decoration:none; padding:5px 5px; font-size:14px; background: rgb(30,87,153); /* Old browsers */

background: -moz-linear-gradient(top, rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(125,185,232,1))); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* IE10+ */

background: linear-gradient(to bottom, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */}





ul#linkbar3{list-style-type:none; padding:0; display:inline-block;}

ul#linkbar3 li{float:center;}

ul#linkbar3 li a{display:block; font-family:"Comic Sans MS", cursive; color:#FFFFFF; text-decoration:none; padding:5px 5px; font-size:14px; background: rgb(30,87,153); /* Old browsers */

background: -moz-linear-gradient(top, rgba(255,255,255,1.00) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6+ */

	

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1.00)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(125,185,232,1))); /* Chrome,Safari4+ */

	

background: -webkit-linear-gradient(top, rgba(255,255,255,1.00) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10+,Safari5.1+ */

	

background: -o-linear-gradient(top, rgba(255,255,255,1.00) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Opera 11.10+ */

	

background: -ms-linear-gradient(top, rgba(255,255,255,1.00) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* IE10+ */

	

background: linear-gradient(to bottom, rgba(125,185,232,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C */

	

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */}

ul#linkbar3 li a:hover{border:5px ridge #7ADBFF; padding:2px 2px;}

ul#linkbar3 li a:active{background-color:#FFFFFF; border:3px ridge lime; padding:2px 2px;}



div#orangebox{width:90%; display:inline-block; padding:15px; border:3px inset gray}

table#greenbox{border:none; width:100%; border-collapse:collapse; margin:0 auto;}

table#greenbox tr td{border:2px solid lime; border-collapse:collapse;}

table#orangebox{border:none; width:100%; border-collapse:collapse; margin:0 auto;}

table#orangebox tr td{border:2px solid darkorange; border-collapse:collapse;}

div.box2{border: 10px solid transparent; padding: 1px; -webkit-border-image: url(border.png) 30 stretch; -o-border-image: url(border.png) 30 stretch; border-image: url(border.png) 30 stretch;}



.xMasFont {

      font-family: 'Calligraffitti', cursive;

  }





/* Navbar Container */

.navbar {

    list-style: none;

    margin: 0;

    padding: 0;

    display: flex;

    justify-content: center;

    position: relative;

	background-color: transparent;

}



/* Individual Navbar Items */

.navbar li {

    position: relative; /* Ensure dropdown positions correctly */

    list-style: none;

}



/* Navbar Links */

.navbar a {

    display: block;

    padding: 10px 15px;

    text-decoration: none;

    color: #444;

    font-size: 15px;

    font-weight: 600;

    letter-spacing: 0.5px;

    text-align: center;

    position: relative;

    transition: all 0.3s ease-in-out;

    white-space: nowrap; /* Prevents text wrapping */

}



/* Borders */

.navbar .rBorder {

    border-right: 1px solid #0A00FF;

}



.navbar .lBorder {

    border-left: 1px solid #0A00FF;

}



/* Hover Effects */

.navbar a:hover {

    color: black;

    transform: scale(1.05);

}



/* Hover Underline Effect */

.navbar a::after {

    content: "";

    position: absolute;

    bottom: 5px;

    left: 15%;

    width: 70%;

    height: 2px;

    background: #4d9df2;

    box-shadow: 0 0 5px #4d9df2;

    transform: scaleX(0);

    transition: transform 0.3s ease-in-out;

}



.navbar a:hover::after {

    transform: scaleX(1);

}



/* Drop Down Menu Styling */

.dropdown {

    display: none;

    position: absolute;

    top: 100%;

    left: 50%;

    transform: translateX(-50%);

    background: white;

    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

    border-radius: 5px;

    padding: 5px 0;

    min-width: 180px;

    z-index: 1000;

}





/* Dropdown Menu Items */

.dropdown li {

    display: block;

    text-align: left;

    width: 100%;

}



/* Dropdown Links */

.dropdown a {

    display: block;

    padding: 8px 15px;

    color: #444;

    font-size: 14px;

    transition: background 0.3s ease-in-out, color 0.3s ease-in-out;

    white-space: nowrap;

}



/* Dropdown Hover Effect */

.dropdown a:hover {

    background: #4d9df2;

    color: white;

}



/* Show Dropdown on Hover */

.navbar li:hover > .dropdown {

    display: block;

}





/* Change color on hover */

.dropdown2-content a:hover {

    background-color: #f1f1f1;

}



/* Show the dropdown content when hovering */

.dropdown2:hover .dropdown2-content {

    display: block;

}