body {
    font-family: Arial, sans-serif;
    background-color: #f0f8ff;
    color: #333;
    margin: 0;
    padding: 0;
}

header {
    background-color: #005f99;
    color: white;
    padding: 10px 0;
    text-align: center;
}

main {
    padding: 20px;
    max-width: 800px;
    margin: auto;
}

form {
    background-color: #e6f7ff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

input[type="text"], input[type="date"], textarea {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

input[type="submit"] {
    background-color: #005f99;
    color: white;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    border-radius: 4px;
}

input[type="submit"]:hover {
    background-color: #004266;
}

footer {
    background-color: #005f99;
    color: white;
    text-align: center;
    padding: 10px 0;
    width: 100%;
    bottom: 0;
}
.adminmenu {
     list-style-type: none;
}
.gallery img {
    width: 150px;
}
.gallery video {
    width:150px;
}

.videoblock {
    display: inline-block;
}

.posttitle {
    font-size: xx-large;
}
.postbox {
    margin: 15px;
    position: relative;
}

.fade-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
  display: block;
  pointer-events: none;
}
.read-more {
  display: block;
  text-align: center;
  margin-top: 10px;
  font-weight: bold;
  text-decoration: none;
  color: #007BFF;
}
.article {
  position: relative;
  line-height: 1.5;
}
.publink {
    display: none;
}
.word-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.tag {
    display: inline-block;
    margin: 5px;
    color: #333;
    font-family: Arial, sans-serif;
}
 .accordion {
            background-color: #f1f1f1;
            color: #444;
            cursor: pointer;
            padding: 10px;
            width: 100%;
            border: none;
            text-align: left;
            outline: none;
            font-size: 18px;
            transition: 0.4s;
        }

        .active, .accordion:hover {
            background-color: #ccc;
        }

        .panel {
            padding: 0 10px;
            display: none;
            background-color: white;
            overflow: hidden;
            border-top: 1px solid #ccc;
        }
        .code-block {
    background-color: #2d2d2d;
    color: #f8f8f2;
    padding: 15px;
    border-radius: 5px;
    overflow-x: auto;
    font-family: 'Courier New', Courier, monospace;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    white-space: pre-wrap; /* Ensure the text wraps correctly */
}

.code-block .language-bash {
    display: block;
    font-size: 14px;
    line-height: 1.5;
}

.code-block .language-bash .comment {
    color: #75715e;
}

.code-block .language-bash .keyword {
    color: #66d9ef;
}

.code-block .language-bash .string {
    color: #e6db74;
}

.code-block .language-bash .variable {
    color: #a6e22e;
}

.code-block .language-bash .function {
    color: #a6e22e;
}

.code-block .language-bash .operator {
    color: #f92672;
}