מדיה ויקי:Common.css

/* הסגנונות הנכתבים כאן ישפיעו על כל העיצובים */
:root {
	--red-orange: #F0542A;
	--brand-09: #474647;
	--brand-05: #1E65AD;
    --fox-purple: #CB4DA2;
    --fox-azure: #33AFD6;
    --fox-magenta: #F6882C;
    --fox-gray: #575757;
    --fox-black: #222222;
    --light-color: #fff;
    --fox-body: none;
    --sidebar-height: 80px;
    --fox-card-radius: 27px;
    --fox-login: url(https://files.cdn.openfox.io/w/skins/Spni/includes/images/fennec-login.jpg);
    --gray-bg: #F4F4F4;
    --light-bg1: rgba(210, 224, 239, 0.60);;
    --light-bg2: #BDE0A1;
    --light-bg3: linear-gradient(0deg, #F3D4E9 0%, #F3D4E9 100%), #FFF;;
    --bg1-transparent: #73228261;
    --bg2-transparent: #7bc243ab;
    --bg3-transparent: #0c9fcd61;
    --bg1-box-shadow: 0px 0px 6.1px 0px rgba(0, 0, 0, 0.10);
    --bg2-box-shadow: var(--bg2-transparent) 0px 4px 13px 1px;
    --bg3-box-shadow: var(--bg3-transparent) 0px 4px 13px 1px;
    --bg1-box-shadow-hover: var(--bg1-transparent) 0px 2px 17px 1px;
    --bg2-box-shadow-hover: var(--bg2-transparent) 0px 2px 17px 1px;
    --bg3-box-shadow-hover: var(--bg3-transparent) 0px 2px 17px 1px;
    --fox-links: var(--fox-purple);
    --redlinks: initial;
    --user-redlinks: var(--fox-magenta);
    --redlinks-cursor: text;
    --redlinks-event: none;
    --redlinks-user-cursor: cell;
    --redlinks-user-event: auto;
    --create-page: "Page does not exist,click to create";
    --navbar-bgcolor: #fff;
    --sidebar-bgcolor: var(--light-bg1);
    --sidebar-title-color: var(--fox-purple);
    --sidebar-title-sec-color: var(--light-bg1);
    --sidebar-active-bgcolor: var(--fox-purple);
    --sidebar-active-title-color: #fff;
    --sidebar-active-sec-title-color: #1389cb;
    --sidebar-border-gcolor: #626daf63;
    --nav-hover: #36a484;
    --navbar-links: var(--fox-purple);
    --navbarleft-width: 450px;
    --footer-bg: #343956;
    --action-footer-button: var(--fox-purple);
    --footer-share-links: var(--fox-purple);
    --search-bg: var(--fox-azure);
    --button-bg: #fff;
    --button-border: var(--fox-purple);
    --button-color: var(--fox-purple);
    --button-progressive: var(--fox-purple);
    --button-progressive-hover: var(--fox-magenta);
    --button-progressive-light: var(--light-bg1);
    --search-bar-bg: var(--gray-bg);
    --search-bar-lines: #047dc77a;
    --search-bar-active: #047dc7;
    --search-bar-shadow: rgba(0, 0, 0, 0.10);
    --search-bar-boxshadow: 0px 0px 6.1px 0px rgba(0, 0, 0, 0.10);
    --search-result-image: url(https://static.openfox.io/systems/systems-logo.svg);
    --no-resuls-color: #78c043;
    --fox-notifications: red;
    --fox-inputs: var(--fox-purple);
    --fox-active-inputs: var(--fox-magenta);
    --meta-padding: inherit;
    --meta-background: var(--light-bg1);
    --meta-radius: inherit;
    --meta-shadow: inherit;
    --meta-top: inherit;
    --fox-delimiter: ",\a0\20";
    --hero-height: 44vh;
    --hero-position: center;
    --hero-sm-position: var(--hero-position);
    --hero-sm-height: 40vh;
    --hero-xl-height: 44vh;
    --hero-xl-position: center 70%;
    --content-precentage-width: 75%;
    --modal-bg: var(--bg1-transparent);
    --modal-shadow: var(--bg1-box-shadow);
    --fa-sy-penta: "";
	--fa-sy-sq-empty: "";
	--fa-sy-quarter: "";
	--fa-sy-triangle: "";
	--fa-sy-half-empty: "";
	--fa-pentagon-empty: "";
	--fa-sy-circle: "";
	--fa-sy-sq-stand: "";
	--fa-sy-triangle-stand: "";
	--fa-sy-circle-empty: "";
	--fa-sy-triangle-flip: "";
	--fa-sy-half: "";
}

.azure-bg {
	background: var(--fox-azure);
}

.orange-bg {
	background: var(--fox-magenta);
}

.magenta-bg {
	background: var(--fox-purple);
}
.gray-bg {
	background: var(--gray-bg);
}

.rounded {
    border-radius: 7px !important;
}
.bg-light {
    background-color: #D2E0EF !important;
}

.border-left {
    border-right: 2px solid #222222 !important;
}
.mw-body {
    line-height: 170%;
    font-size: 16px;
}

.btn {
	border-radius: 10px;
	padding: 7px 18px;	
}
.btn-primary {
	background: var(--brand-05);
}

 #sidebar-right > .aside {
    padding: 59px 32px 1em 21px;
}
#sidebar-right {
    background: var(--gray-bg);
}
#sidebar-right a {
	color: var(--brand-09);	
}
#sidebar-right .aside.dynamic-multi-levels h5 {
	color: var(--brand-09);
	font-size: 16px;
	font-weight: 500;
	line-height: 142%; /* 22.72px */
	letter-spacing: 0.16px;
}
#sidebar-right aside.dynamic-multi-levels ul li ul li a, #sidebar-right .aside.dynamic-multi-levels ul li ul li a, #menu-fixed aside.dynamic-multi-levels ul li ul li a, #menu-fixed .aside.dynamic-multi-levels ul li ul li a {
	color: var(--brand-09);
	font-size: 15px;
	font-weight: 500;
	line-height: 24px; /* 160% */
}

#sidebar-right aside.dynamic-multi-levels ul li ul, #sidebar-right .aside.dynamic-multi-levels ul li ul, #menu-fixed aside.dynamic-multi-levels ul li ul, #menu-fixed .aside.dynamic-multi-levels ul li ul {
    padding: 0;
    background: none;
}
#sidebar-right .aside.dynamic-multi-levels ul li ul:has(.selflink) {
	display: block;
}
.dynamic-multi-levels > ul > li.listed:nth-of-type(3) {--sidebar-title-color: var(--fox-azure);}
.dynamic-multi-levels > ul > li.listed:nth-of-type(4) {--sidebar-title-color: var(--fox-magenta);}
.dynamic-multi-levels > ul > li.listed:nth-of-type(5) {--sidebar-title-color: var(--fox-purple);}
.dynamic-multi-levels > ul > li.listed:nth-of-type(6) {--sidebar-title-color: var(--fox-gray);}
#sidebar-right .aside.dynamic-multi-levels ul li ul li:not(:has(.selflink)):not(:hover):before {
   color: var(--brand-09);
}


.active + .haslist-toglle-js, .active .haslist-toglle-js, .haslist-toglle-js {
        color: var(--sidebar-title-color) !important;
}

.page-עמוד_ראשי #main {
    background-image: url(https://static.openfox.io/systems/home-bg.svg);
    background-size: cover;
    background-position: center;
}

.site-title {
	color: #212529;
	text-align: center;
	leading-trim: both;
	text-edge: cap;
	font-size: 50px;
	line-height: 130%; /* 65px */
	letter-spacing: 1px;
	margin: 145px 0 120px;
}

#bodyContent {
    max-width: 1462px;
    margin: auto;
}
@media (min-width: 768px) {
	.cat-שער #contentwrapper {
		    -webkit-box-flex: 0;
	        -ms-flex: 0 0 83.333333%;
	        flex: 0 0 83.333333%;
	        max-width: 83.333333%;
	}
	#intro {
		height: 196px;
	}
	.page-עמוד_ראשי #contentwrapper .row {
		column-gap: 6%;
	}
	.menu-desktop .show-menu-mobile {
    display: none;
	}
}
.Fennec-embed-wrp {
    padding: 56.26% 0 0;
}
.menu-desktop > div {
	    padding: 15px 46px;
}
.menu-desktop .float-left .nav-new a {
	line-height: 1;
}
.navbar-left-wrp {margin: 0;}

.navbar-left
.intro-internal p {
	padding: 0 4px 0 0;
	margin: 0;
}
.intro-internal {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.intro-text {
    padding: 53px;
}

.intro-text h3 {
	color: #2B2B2B;
	text-align: right;
	font-size: 22px;
	font-weight: 700;
	line-height: 26px;
}
.card {
	box-shadow: 0px 0px 6.1px 0px rgba(0, 0, 0, 0.10);
}

.card-intro {
	padding: 45px 36px;
}

.card-intro .card-header, .card-intro .card-body {
	background: none;
	padding: 0;
}
.card-intro a {
	color: #2B2B2B;
}
.card-intro .card-body {
	padding-top: 32px;
}
.card-intro .card-header {
	padding-bottom: 32px;
}
.form-group input.form-control {
	border-radius: 33.599px;
	border: 1px solid var(--brand-09);
	background: #FFF;
	height: 40px;
	font-size: 16px;
    padding-right: 1.5em;
}
.search-label i {
    top: -5px;
    left: 5px;
    color: #fff;
    background: var(--red-orange);
    width: 26px;
    height: 26px;
    border-radius: 100%;
    padding: 7px;
    font-size: 13px;
}

.chapter-tag {
    border-radius: 1em;
    padding: 4.5px 15px;
    color: #FFF;
    text-align: center;
    text-edge: cap;
    font-size: 18px;
    font-style: normal;
    line-height: 26px;
    letter-spacing: 0.36px;
}



/* systems list */
.systems-list li {
	list-style: none;
}
.systems-list li:before {
  font-family: 'Font Awesome Kit' !important;
  display: inline-block;
  width: 1.25em;
  height: 1em;
  margin-left: 20px;
}
.systems-list li:nth-child(1)::before {  content: var(--fa-sy-penta) !important; /* fa-sy-penta */}
.systems-list li:nth-child(2)::before {  content: var(--fa-sy-sq-empty) !important; /* fa-sy-sq-empty */}
.systems-list li:nth-child(3)::before {  content: var(--fa-sy-quarter) !important; /* fa-sy-quarter */}
.systems-list li:nth-child(4)::before {  content: var(--fa-sy-triangle) !important; /* fa-sy-triangle */}
.systems-list li:nth-child(5)::before {  content: var(--fa-sy-half-empty) !important; /* fa-sy-half-empty */}
.systems-list li:nth-child(6)::before {  content: var(--fa-pentagon-empty) !important; /* fa-pentagon-empty */}
.systems-list li:nth-child(7)::before {  content: var(--fa-sy-circle) !important; /* fa-sy-circle */}
.systems-list li:nth-child(8)::before {  content: var(--fa-sy-sq-stand) !important; /* fa-sy-sq-stand */}
.systems-list li:nth-child(9)::before {  content: var(--fa-sy-triangle-stand) !important; /* fa-sy-triangle-stand */}
.systems-list li:nth-child(10)::before {  content: var(--fa-sy-circle-empty) !important; /* fa-sy-circle-empty */}
.systems-list li:nth-child(11)::before {  content: var(--fa-sy-triangle-flip) !important; /* fa-sy-triangle-flip */}
.systems-list li:nth-child(12)::before {  content: var(--fa-sy-half) !important; /* fa-sy-half */}

/* 3 collumns list */
.systems-list.3-cols-list li:nth-child(1)::before {  content: var(--fa-sy-half-empty) !important; /* fa-sy-half-empty */}
.systems-list.3-cols-list li:nth-child(2)::before {  content: var(--fa-pentagon-empty) !important; /* fa-pentagon-empty */}
.systems-list.3-cols-list li:nth-child(3)::before {  content: var(--fa-sy-circle) !important; /* fa-sy-circle */}
.systems-list.3-cols-list li:nth-child(4)::before {  content: var(--fa-sy-sq-stand) !important; /* fa-sy-sq-stand */}
.systems-list.3-cols-list-3 li:nth-child(1)::before {  content: var(--fa-sy-triangle-stand) !important; /* fa-sy-triangle-stand */}
.systems-list.3-cols-list-3 li:nth-child(2)::before {  content: var(--fa-sy-circle-empty) !important; /* fa-sy-circle-empty */}
.systems-list.3-cols-list-3 li:nth-child(3)::before {  content: var(--fa-sy-triangle-flip) !important; /* fa-sy-triangle-flip */}
.systems-list.3-cols-list-4 li:nth-child(4)::before {  content: var(--fa-sy-half) !important; /* fa-sy-half */}
/*4 columns list */
.systems-list.4-cols-list li:nth-child(1)::before {  content: var(--fa-sy-triangle) !important; /* fa-sy-triangle */}
.systems-list.4-cols-list li:nth-child(2)::before {  content: var(--fa-sy-half-empty) !important; /* fa-sy-half-empty */}
.systems-list.4-cols-list li:nth-child(3)::before {  content: var(--fa-pentagon-empty) !important; /* fa-pentagon-empty */}
.systems-list.4-cols-list-3 li:nth-child(1)::before {  content: var(--fa-sy-circle) !important; /* fa-sy-circle */}
.systems-list.4-cols-list-3 li:nth-child(2)::before {  content: var(--fa-sy-sq-stand) !important; /* fa-sy-sq-stand */}
.systems-list.4-cols-list-3 li:nth-child(3)::before {  content: var(--fa-sy-triangle-stand) !important; /* fa-sy-triangle-stand */}
.systems-list.4-cols-list-4 li:nth-child(1)::before {  content: var(--fa-sy-circle-empty) !important; /* fa-sy-circle-empty */}
.systems-list.4-cols-list-4 li:nth-child(2)::before {  content: var(--fa-sy-triangle-flip) !important; /* fa-sy-triangle-flip */}
.systems-list.4-cols-list4 li:nth-child(3)::before {  content: var(--fa-sy-half) !important; /* fa-sy-half */}

#sidebar-right > div.aside:nth-child(4) {display: none;}