/*
#252526
#E8E8E8
#595959
#BFBFBF
#8C8C8C
#C77531 - orange
#427500 - green
*/


        /* Lightweight responsive two-column layout */
        body {
            margin: 0;
            padding: 0;
            font-family: sans-serif;
			font-size: 1em;
			line-height: 1.6;
			background-color: #252526;
        }
		.site-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 20px 30px;
            background-color: #252526;
			box-shadow: 4px 4px 4px rgb(0,0,0,0.5);
			
        }
        .site-header .logo img {
            max-height: 80px;
            width: auto;
			padding: 0;
			margin: 0;
        }
        .nav-links a {
            margin-left: 15px;
            text-decoration: none;
            color: #0066cc;
        }
        .nav-links a:hover {
            text-decoration: underline;
        }
        .container {
            display: flex;
            flex-wrap: wrap;
            max-width: 1280px;
            margin: 0 auto;
			background-color: #E8E8E8;
        }
        .main-content {
            flex: 1 1 70%;
            min-width: 300px;
            padding: 20px;
        }
        .sidebar {
            flex: 1 1 20%;
            min-width: 200px;
            padding: 20px;
            background-color: #BFBFBF;
			z-index: 99;
        }
        @media (max-width: 768px) {
            .container {
                flex-direction: column;
            }
            .sidebar {
                order: 2;
            }
        }
		h1 {
			text-transform: uppercase;
			font-weight: 600;
			font-size: 24px;
			border-bottom: 1px solid #222;
			padding: 0 0 20px 0;
		}
		h2 {
			text-transform: uppercase;
			font-weight: 600;
			font-size: 22px;
			padding: 20px 0 0 0;
			border-bottom: 1px solid #222;
			line-height: 1.2;
		}
		h3 {
			line-height: 1.2;
			font-weight: 600;
			font-size: 18px;
			padding: 20px 0 0 0;
		}
		p {
			
		}

		li {
			padding: 0 0 8px 0;
		}

        a {
            color: #0066cc;
            text-decoration: underline;
        }
        a:hover {
            text-decoration: underline;
        }


	.index-list-container {

		gap: 30px 10px;
		
	}

	.index-list-header {
		display: flex;
		font-weight: 600;
		padding: 12px 0;
		border-bottom: 1px solid #BFBFBF;
	}

	.index-list {
		display: flex;
		padding: 12px 0;
		border-bottom: 1px solid #BFBFBF;
	}
	
	.cve-index-date {
		flex: 1 1 1 1 10%;
        flex-grow: 1;
		min-width: 100px;
	}
	.cve-index-id {
		flex: 1 1 1 1 10%;
        flex-grow: 1;
		min-width: 140px;
	}
	.cve-index-title {
		flex: 1 1 1 1 10%;
        flex-grow: 2;
	}
	.cve-index-youtube {
		flex: 1 1 1 1 10%;
        flex-grow: 1;
		justify-content: end;
		min-width: 100px;

	}


		@media (max-width: 768px) {
		.index-list-container {
			flex-direction: column;
			gap: 10px 10px;
		}
		.cve-index-date {
			order: 1;
		}
		.cve-index-id {
			order: 1;
		}
		.cve-index-title {
			order: 2;
		}
		.cve-index-youtube {
			order: 1;
		}
		
	}








		.you-tube {
			/* background-color: #C77531; */
			padding: 2px 20px;
		}


        .highlight-box-1 {
            background-color: azure;
			padding: 0 20px 20px 20px;
			margin: 10px 0;
			clear: both;
        }






		.action-step {
			color: #fff;
			background-color: #333;
			text-align: center;
			padding: 20px 20px 20px 20px;
			margin: 20px;
		}

		.action-actor {
			text-align: center;
			border: 2px solid #000;
			background-color: #fff;
			padding: 20px;
			margin: 20px auto;
			width: 50%;
			color: #000;
		}
		.action-action {
			text-align: center;
			color: #42AA00;
			font-weight: 600;
		}
		.action-system {
			border: 2px solid #000;
			background-color: #fff;
			padding: 20px;
			margin: 20px auto;
			width: 50%;
			color: #000;
		}

		.action-example p {
			padding-top: 30px;
		}
		.action-example  ul {
			font-family: 'Courier New', Courier, monospace;
			background-color: #ddd;
			color: #000;
			margin: 10px;
			padding: 10px;
			text-align: left;
			border: 1px solid #000;
			box-shadow: 4px 4px 4px rgb(0,0,0,0.1);
		}


		

		.exploit-step {
			color: #fff;
			background-color: #333;
			text-align: center;
			padding: 0 20px 20px 20px;
			margin: 20px;
		}

		.exploit-actor {
			text-align: center;
			border: 2px solid #000;
			background-color: #fff;
			padding: 20px;
			margin: 20px auto;
			width: 50%;
			color: #000;
		}
		.exploit-action {
			text-align: center;
			color: #CA3C00;
			font-weight: 600;
		}
		.exploit-system {
			border: 2px solid #000;
			background-color: #fff;
			padding: 20px;
			margin: 20px auto;
			width: 50%;
			color: #000;
		}

		.exploit-example p {
			padding-top: 30px;
		}
		.exploit-example  ul {
			font-family: 'Courier New', Courier, monospace;
			background-color: #000;
			color: #fff;
			margin: 10px;
			padding: 10px;
			text-align: left;
			border: 1px solid #000;
			box-shadow: 4px 4px 4px rgb(0,0,0,0.1);
			
		}

		.exploit-example  li {
			list-style: none;
		}
		.exploit-example  li:before {
			content: "> "
		}






		.cve-source > div {
			display: flex;
			flex-wrap: wrap;
			padding: 8px 0;
			border-bottom: 1px solid #ccc;
			font-size: 0.8em;
		}
		.cve-source .col-1 {
			flex: 0 0 30%;
			min-width: 150px;
			font-weight: 600;
		}
		.cve-source .col-2 {
			flex: 1 1 70%;
		}
		@media (max-width: 768px) {
			.cve-source > div {
				flex-direction: column;
			}
			.cve-source .col-1 {
				margin-bottom: 5px;
			}
		}


		.site-footer {
            text-align: center;
            padding: 15px 20px;
            background-color: #252526;
            font-size: 0.9em;
			color: #fff;
        }