@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i');
body {
	font-family: 'Open Sans', Arial, sans-serif;
	font-size: 16px;
	line-height: 1.7;
	margin: 0;
	padding: 0;
}
p {
	margin: 0 0 10px 0;
}
a {
	text-decoration: none;
}
.top-support {
	text-align: center;
	margin-top: 30px;
	color: red;
	font-weight: bold;
}
h2,
.col-right a {
	color: #002147;
}
h1.title {
	background-color: #1aa78e;
}
h1.title {
	font-size: 30px;
	margin: 0px;
	text-align: center;
	position: relative;
	color: #fff;
	padding: 15px;
	font-size: 22px;
}
.col-right a:hover {
	text-decoration: underline;
}
.left-menu h2{
	text-align: center;
	color: #fff;
}
.left-menu h2 img {
	width: 170px;
}
h2 {
	padding: 50px 0px 20px;
	margin: 0px;
	font-size: 24px;
	line-height: 1.3;
}
h3 {
	font-size: 22px;
}
h4 {
	font-size: 16px;
	padding: 15px 0px;
	margin: 0px;
}

.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt40 {margin-top: 40px;}
.mt50 {margin-top: 50px;}
.mt60 {margin-top: 60px;}
.mt70 {margin-top: 70px;}
.mt80 {margin-top: 80px;}
.mt90 {margin-top: 90px;}
.mt100 {margin-top: 100px;}

.red {
	color: red;
}
.blue{
	color: #0a658f;
}
code p, code div{
	margin: 0px;
	padding: 0px;
}
section pre {
	background: #f8f8f8;
	width: 96%;
	text-align: left;
	margin: 20px 0; 
	padding: 0px;
}
code {
	border:1px solid red;
	margin: 0px;
	padding: 0px;
}
mark {
	color: red;
}
.mCSB_inside > .mCSB_container {
	margin-right: 10px !important;
}
#wrapper {
	width: 100%;
	margin: auto auto;	
}
#wrapper .col-left {
	background-color: #393939;
	box-shadow: 0 0 15px #bcbcbc;
	height: 100%;
	left: 0;
	min-height: 100%;
	position: fixed;
	width: 255px;
	z-index: 100;
}
#wrapper .col-left ul {
	color: #ffffff;
	font-size: 14px;
	list-style-type: decimal;
	margin-bottom: 10px;
	margin-left: 30px;
	margin-top: 0;
	padding-left: 0;
}
#wrapper .col-left ul li {
	margin: 0px; 
}
#wrapper .col-left ul li a {
	color: #fff;
	display: block;
	padding: 3px 5px;
}
#wrapper .col-left ul li a:hover{
	background: #262626;
}
#wrapper .col-right {
	margin-left: 282px;
	margin-right: 10px;
}
#wrapper .col-right img {
	box-shadow: 0 0 7px #b8b8b8;
	max-width: 99%;
	padding: 5px;
}
.meanheader {
	font-weight: bold;
	padding: 10px 20px;
	text-transform: uppercase;
}
ol.plugins {
	font-weight: bold;
}
ol.plugins span {
	font-weight: normal;
}
ul.special-list li span {
	display: inline-block;
	width: 210px;
}
ul.special-list2 li span {
	display: inline-block;
	width: 105px;
}
@media all and (max-width: 991px) {
	#wrapper .col-left {
		width: 230px;
	}
	#wrapper .col-right {
		margin-left: 250px;
	}
}
@media all and (max-width: 767px) {
	#wrapper .col-left {
		display: none;
	}
	#wrapper .col-right {
		margin: 20px;
	}
}
@media all and (max-width: 767px) {
	#wrapper .col-left {
		display: none;
	}
	#wrapper .col-right {
		margin: 80px 20px 20px;
	}
	.mean-container .mean-nav > ul {
		overflow-y: scroll;
	}
	#meanmenu {
		position: fixed;
		top: 0;
		z-index: 100;
		width: 100%;
	}
}

/* Header Customization */
html body #main-header {
    background-color: #002F34 !important;
}

/* Header Links & Text Color */
html body #main-header .main-navigation ul li a,
html body #main-header .main-navigation-area .header-login-icon .rtin-text,
html body #main-header .main-navigation-area .header-login-icon i,
html body #main-header .main-navigation-area .header-chat-icon i {
    color: #ffffff !important;
}

/* Icons specific styling */
html body #main-header .header-login-icon,
html body #main-header .header-chat-icon {
    color: #ffffff !important;
}

/* Hover effects for links */
html body #main-header .main-navigation ul li a:hover,
html body #main-header .main-navigation-area .header-login-icon:hover .rtin-text,
html body #main-header .main-navigation-area .header-login-icon:hover i,
html body #main-header .main-navigation-area .header-chat-icon:hover i {
    color: #f0f0f0 !important; /* Slightly lighter white/grey on hover */
    opacity: 0.8;
}

/* "Post Your Ad" Button Customization */
html body .main-header .main-navigation-area .header-btn-area .btn-1,
html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1,
html body .main-header .main-navigation-area .header-btn-area .btn-1:hover,
html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1:hover,
html body .main-header .main-navigation-area .header-btn-area .btn-1:focus,
html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1:focus,
html body .main-header .main-navigation-area .header-btn-area .btn-1:active,
html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1:active {
    background-color: #ffffff !important;
    color: #002F34 !important;
    border-color: #ffffff !important;
    background-image: none !important;
    box-shadow: none !important;
    font-weight: bold !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}

html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1 i {
    display: none !important; /* Hide default icon if any */
}

/* Add custom icons via pseudo-element */
html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1:before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23002F34" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>'); /* Example User Icon */
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 5px;
}
/* We need specific icons like car, house, watch, etc. as requested. */
/* Since we can't easily add multiple images to one button without changing HTML structure,
   and the user asked to add icons like in the screenshot (Car, House, Watch),
   we might need to adjust the HTML or use a background image that contains all 3. */

/* Let's try to use a background image with multiple icons if we can find/create one, 
   OR we can use FontAwesome icons if available. */

/* Re-thinking: The user showed an image with Car, House, Watch icons ABOVE the text "Mam coś do sprzedania".
   And the button is quite large and white. */

html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1 {
    flex-direction: column !important;
    padding: 10px 20px !important;
    height: auto !important;
    line-height: 1.2 !important;
}

/* Hide the default Plus icon */
html body .main-header .main-navigation-area .header-btn-area .btn.rdtheme-button-1 i.fa-plus {
    display: none !important;
}