﻿.group:after { content: ""; display: table; clear: both; }
.epgPsCaseStudyArea { margin: 40px 0; position: relative; }
.epgPsCaseStudyArea h1 { font-size: 1.8em; font-weight: normal; font-family: 'Segoe UI Light', Arial, Verdana, Tahoma, sans-serif; padding-bottom: 14px; border-bottom: 1px solid #333; position: relative; }
.viewToggle { position: absolute; right: 0; top: -14px; display: none; }
html[dir="RTL"] .viewToggle {left:0;right:auto;}
.viewToggle a { display: inline-block; width: 55px; height: 55px; text-indent: -9999px; }
.viewToggle a.viewGallery { background: url(/global/enterprise/PublishingImages/publicsector/epgPsCaseStudies/grid_icon_sprite.png) no-repeat; }
.viewToggle a.viewGallery.selected { background-position: 0 -57px; }
.viewToggle a.viewList { background: url(/global/enterprise/PublishingImages/publicsector/epgPsCaseStudies/list_icon_sprite.png) no-repeat; }
.viewToggle a.viewList.selected { background-position: 0 -57px; }
.epgPsCaseStudyArea h3 { font-family: 'Segoe UI Semibold','Segoe UI',Arial, Verdana, Tahoma, sans-serif; font-weight: normal; color: #585858; }
.filterOptions { margin: 10px 0 40px 0; min-height: 30px; }
.filterOptions h3.main { margin-right: 100px; vertical-align: top; }
html[dir="RTL"] .filterOptions h3.main {margin-right:0;margin-left:100px;}

.filterOptions h3 a { color: #D43F00; text-transform: none; }
#resultInfo { }
.filterOptions .filterLabel { display: inline-block; margin: -4px 6px 4px 0; font-size: 13px; text-transform: capitalize; }
.filters { margin: 20px 0; }
.filter { width: 100%; margin: 0 0 10px 0; box-sizing: border-box; }
.filter h3 { padding-bottom: 10px; border-bottom: 1px solid #000; margin-bottom: 14px; }
.filter:nth-child(4n+0) { margin-right: 0; }
.filter a { display: inline-block; margin: 0 40px 8px 0; color: #646464; font-weight: bold; font-size: 13px; text-transform: capitalize; }
html[dir="RTL"] .filter a {margin: 0 0 8px 40px;}
.filter a:hover { color: #038CEA; }
.filter a.selected { color: #038CEA; }
.filter .toggle { }
.apps { margin: 20px 0; border-bottom: 1px solid #000; }
.apps .app { float: left; width: 24%; margin: 0 1.3% 40px 0; border: 1px solid #d2d2d2; box-sizing: border-box; display: none; }
html[dir="RTL"] .apps .app {float:right;margin:0 0 40px 1.3%}
.apps .app:nth-child(4n+0) { margin-right: 0; }
html[dir="RTL"] .apps .app:nth-child(4n+0) { margin-left:0;}
.apps .app .logo { text-align: center; height: 122px; display: block; }
.apps .app .logo img { max-height: 100%; max-width: 100%; vertical-align: middle; }
.apps .app .title { border-top: 3px solid #4C65C9; padding: 10px; height: 122px; overflow: hidden; }
.apps .app .title h3 { color: #4a4a4a; font-size: 18px; margin-bottom: 6px; }
.apps .app .title h3 a { color: #008cf2; }
.apps .app .title h4 { color: #4a4a4a; margin: 0; font-size: 14px; line-height: 1.4em; }
.epgSocialWidget-root { left: auto; right: 0; }
.appsList { margin: 20px 0; border-bottom: 1px solid #000; padding-bottom: 40px; }
.appsList .app { padding: 10px 120px 14px 20px; margin: 0; position: relative; display: none; }
.appsList .app:nth-child(odd) { background: #eee; }
.appsList .app a { color: #008cf2; }
.appsList .app h4 { font-size: 16px; margin-bottom: 10px; }
.appsList .app p { font-size: 12px; }
.appsList .app .viewNow { display: inline-block; font-size: 12px; position: absolute; right: 50px; bottom: 18px; padding: 0; }
.appsList .app .viewNowArrow { position: absolute; right: 20px; bottom: 10px; font-size: 24px; }

.icon-closex { display: inline-block; color: #D43F00; font-size: 24px; vertical-align: middle; width: 22px; }

.pop-container .middle ul { font-size: 14px; list-style-type: disc; margin-left: 40px; text-align: left; }

@media screen and (max-width: 768px), only screen and (max-device-width: 768px) {
    .apps .app { width: 49%; margin-right: 2%; }
    .apps .app:nth-child(4n+0) { margin-right: 2%; }
    .apps .app:nth-child(2n+0) { margin-right: 0; }
    html[dir="RTL"] .apps .app:nth-child(2n+0) {margin-left:0;}
    .epgPsCaseStudyArea h1 { font-size: 24px; }
    .epgPsCaseStudyArea { margin: 20px 0; }
}

@media screen and (max-width: 500px), only screen and (max-device-width: 500px) {

    .apps .app, .filter { width: 100%; margin-right: 0; }
    .apps .app:nth-child(4n+0), .filter:nth-child(4n+0) { margin-right: 0; }
    .apps .app:nth-child(2n+0), .filter:nth-child(2n+0) { margin-right: 0; }
}
