/********** Shaghalni **********/
.shaghalniPage { display: inline-block; width: 100%; float: right; background: none; margin-bottom: 30px; padding: 0 14px; }
.shaghalniPage .shaghalniLogo { display: inline-block; float: right; width: 120px; margin: 20px calc((100% - 120px) / 2) }
.shaghalniPage .shaghalniLogo img { width: 100%; height: auto }
.shaghalniPage h1 { display: inline-block; float: right; width: 100%; text-align: center; margin-bottom: 40px; font-size: 28px; color: #E03322; font-family: DroidKufiBold, arial; cursor: auto }
.shaghalniPage .shaghalniList { display: inline-block; float: right; width: 100% }
.shaghalniPage .shaghalniList ul { display: inline-block; float: right; width: 100% }
.shaghalniPage .shaghalniList ul li { display: inline-block; float: right; width: calc((100% - 60px) / 3); height: 196px; padding: 20px 20px 10px; margin-left: 30px; margin-bottom: 30px; background: #fff; border: 1px solid #e8e8e8; }
.shaghalniPage .shaghalniList ul li:nth-child(3n) { margin-left: 0 }
/** Top **/
.shaghalniPage .shaghalniList ul li .top { display: inline-block; float: right; width: 100%; border-bottom: 1px solid #e8e8e8 }
.shaghalniPage .shaghalniList ul li .top .jobContainer { display: inline-block; float: right; width: 100%; }
.shaghalniPage .shaghalniList ul li .top .jobContainer .compLogo { display: inline-block; float: right; width: 54px; height: 54px; position: relative }
.shaghalniPage .shaghalniList ul li .top .jobContainer .compLogo img { width: auto; height: auto; max-height: 54px; max-width: 54px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) }
.shaghalniPage .shaghalniList ul li .top .jobContainer .jobTitle { display: inline-block; float: right; width: calc(100% - 54px); padding-right: 20px }
.shaghalniPage .shaghalniList ul li .top .jobContainer .jobTitle h2 { display: inline-block; float: right; width: 100%; margin-bottom: 4px; line-height: 1.8; font-family: DroidKufiBold, Arial; font-size: 17px; color: #1d1d1d; text-align: right; direction: rtl; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.shaghalniPage .shaghalniList ul li .top .jobContainer .jobTitle .jobLocation { display: inline-block; float: right; width: 100%; }
.shaghalniPage .shaghalniList ul li .top .jobContainer .jobTitle .jobLocation img { display: inline-block; float: right; width: 12px; margin-top: 2px }
.shaghalniPage .shaghalniList ul li .top .jobContainer .jobTitle .jobLocation p { display: inline-block; float: right; width: calc(100% - 12px); height: 22px; margin-bottom: 0; padding-right: 6px; font-family: DroidKufiLight, Arial; font-size: 12px; color: #b0b0b0; text-align: right; direction: rtl; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.shaghalniPage .shaghalniList ul li .top .jobDesc { display: inline-block; float: right; width: 100%; padding: 20px 0 10px }
.shaghalniPage .shaghalniList ul li .top .jobDesc p { display: inline-block; float: right; width: 100%; min-height: 44px; font-family: DroidKufiLight, Arial; font-size: 12px; color: #1d1d1d; text-align: right; direction: rtl; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
/** Bottom **/
.shaghalniPage .shaghalniList ul li .bottom { display: inline-block; float: right; width: 100%; padding-top: 10px; }
.shaghalniPage .shaghalniList ul li .bottom .jobTags { display: inline-block; float: right; width: 50% }
.shaghalniPage .shaghalniList ul li .bottom .jobTags:last-child { margin-left: 0; float: left }
.shaghalniPage .shaghalniList ul li .bottom .jobTags p { display: inline-block; float: right; width: auto; font-family: DroidKufiLight, Arial; padding-right: 6px; font-size: 11px; color: #b0b0b0; text-align: right; direction: rtl; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.shaghalniPage .shaghalniList ul li .bottom .jobTags img { display: inline-block; float: right; width: 18px; margin-top: 1px }
.shaghalniPage .shaghalniList ul li .bottom .jobTags.time img { width: 14px; margin-top: 3px }

@media screen and (min-width:1280px) and (max-width:1359px) {
    .shaghalniPage .shaghalniList ul li { width: calc((100% - 30px) / 2); }
    .shaghalniPage .shaghalniList ul li:nth-child(3n) { margin-left: 30px; }
    .shaghalniPage .shaghalniList ul li:nth-child(2n) { margin-left: 0; }
}
@media screen and (min-width:1152px) and (max-width:1279px) {
    .shaghalniPage .shaghalniLogo { width: 100px; margin: 20px calc((100% - 100px) / 2); }
    .shaghalniPage h1 { font-size: 24px }
    .shaghalniPage .shaghalniList ul li { width: calc((100% - 30px) / 2); }
    .shaghalniPage .shaghalniList ul li:nth-child(3n) { margin-left: 30px; }
    .shaghalniPage .shaghalniList ul li:nth-child(2n) { margin-left: 0; }
}
@media screen and (min-width:1024px) and (max-width:1151px) {
    .shaghalniPage .shaghalniLogo { width: 100px; margin: 20px calc((100% - 100px) / 2); }
    .shaghalniPage h1 { font-size: 24px }
    .shaghalniPage .shaghalniList ul li { width: calc((100% - 30px) / 2); }
    .shaghalniPage .shaghalniList ul li:nth-child(3n) { margin-left: 30px; }
    .shaghalniPage .shaghalniList ul li:nth-child(2n) { margin-left: 0; }
}
@media only screen and (max-width: 1023px) {
    .shaghalniPage { padding: 0 4px }
    .shaghalniPage .shaghalniLogo { width: 100px; margin: 20px calc((100% - 100px) / 2); }
    .shaghalniPage h1 { font-size: 24px }
    .shaghalniPage .shaghalniList ul li { width: calc((100% - 20px) / 2); margin-left: 20px; margin-bottom: 20px }
    .shaghalniPage .shaghalniList ul li:nth-child(3n) { margin-left: 20px; }
    .shaghalniPage .shaghalniList ul li:nth-child(2n) { margin-left: 0; }
}
@media screen and (min-width: 320px) and (max-width: 767px) {
    .shaghalniPage { padding: 0 10px }
    .shaghalniPage .shaghalniLogo { width: 80px; margin: 20px calc((100% - 80px) / 2); }
    .shaghalniPage h1 { font-size: 20px }
    .shaghalniPage .shaghalniList ul li { width: 100%; margin-left: 0; margin-bottom: 20px }
    .shaghalniPage .shaghalniList ul li:nth-child(3n) { margin-left: 0; }
    .shaghalniPage .shaghalniList ul li:nth-child(2n) { margin-left: 0; }
}