@font-face {
    font-family: 'SAPIcons';
    src: url('../fonts/SAP-icons.woff2') format('woff2');
    src: url('../fonts/SAP-icons.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'SAPicons1-28-10';
    src: url('../fonts/SAP-icons1-28-10.eot');
    src: url('../fonts/SAP-icons1-28-10.eot?#iefix') format('embedded-opentype'), url('../fonts/SAP-icons1-28-10.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html {
    min-width: 320px;
}
.learning-journey #ljOwner{
float:left;
color:red;
}

.learning-journey #ljUniqueID{
float:left;
color:red;
margin-right: 10px;
}



.learning-journey p {
        line-height: 1.6em;
}

.learning-journey a, .learning-journey a:link {
    color: #0FAAFF !important;
    text-decoration: none !important;
}

.learning-journey #banner-top #banner-content .prod-description h4 {
    font-family: "Benton Sans";
    color: #FFF;
}
.learning-journey #banner-top #banner-content .title h1  {
    font-family: "Benton Sans";
    color: #FFF;
}

.learning-journey #banner-top #banner-content .title p  {
    font-family: "Benton Sans";
    color: #FFF;
}

.learning-journey .related_journeys.banner_link{
	 font-family: "Benton Sans";
     color: #0645AD !important;
}

.learning-journey.dark-theme-lj {
    background: #000; /* For browsers that do not support gradients */
    /*background: -webkit-linear-gradient(#000, #383838); /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(#000, #383838); /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(#000, #383838); /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(#000, #383838); /* Standard syntax */
}

.learning-journey div.page {
   background: transparent; 
}

.learning-journey .sap-icon {
    font-family: "SAPIcons";
}


.learning-journey .lj-centered {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    box-sizing: border-box;
}

.learning-journey #d4h5-main-container header,
.learning-journey #breadcrumb-container,
.learning-journey div.body>div[id$='DESCRIPTION'],
.learning-journey div.body>div>p[id$='grouppage'],
.learning-journey div.body>div>p[id$='type'],
.learning-journey div.body table.datatable 
/*,*/
/*.learning-journey .table-wrapper.tablenoborder,*/
/*.learning-journey .tablecap */
{
    display: none;
}

.learning-journey div.body table.datatable.displaytable {
    display: block;
}

.learning-journey #d4h5-section-container {
    padding: 0;
    margin-bottom: 10px;
}

.learning-journey {
  margin: 0;
  background-color: #FFF;
}

.learning-journey .hide {
    display: none !important;
}

.learning-journey .tileGroup .hide {
    display: block;
}

.learning-journey div.page > h1.title,
.learning-journey div.page > div.body > .shortdesc {
  display: none;
}

.learning-journey #d4h5-main-container {
    min-height: auto;
    margin-bottom: 20px;
}

.learning-journey #footer-container {
    display: none;
}


.learning-journey div.page {
    margin: 0;
}

.learning-journey div.body {
    display: inline-block;
    width: 100%;
	margin-top: -10px;
}
 @media screen and (max-width: 640px) and (max-width: 1023px) {
 .learning-journey div.body {
	margin-top: -29px;
}
 }

/* Custom, iPhone Retina */ 
@media only screen and (min-width : 320px) {
}

/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {
    .learning-journey div.body {
        max-width: 480px;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    .learning-journey div.body {
        max-width: 700px;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .learning-journey div.body {
        max-width: 950px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .learning-journey div.body {
        max-width: 1200px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1600px) {
    .learning-journey div.body {
        max-width: 1600px;
    }
}

/* motion band */

.learning-journey div.motion-band {
    width: 5vw;
    height: 100%;
    position: absolute;
    top: 0;
/* 
    max-width: 270px;
    max-height: 45px;

    min-width: 120px;
    min-height: 20px;
*/
}

/*@media screen and (min-width: 1475px) {
.learning-journey  div.motion-band {
    height: 100%;
    max-height: none;
  }
}*/

html[dir='ltr'] .learning-journey div.motion-band,
div.secondary-language-level[dir='ltr'] .learning-journey div.motion-band,
html[dir='rtl'] div.secondary-language-level[dir='ltr'] .learning-journey div.motion-band {
    right: 0;
    left: initial;
}

html[dir='rtl'] .learning-journey div.motion-band,
div.secondary-language-level[dir='rtl'] .learning-journey div.motion-band,
html[dir='ltr'] div.secondary-language-level[dir='rtl'] .learning-journey div.motion-band {
    left: 0;
    right: initial;
}

.learning-journey div.motion-band>span {
    width: 33.3333333333%;
    height: 100%;
    display: inline-block;
    background-color: #F0AB00;
}

.learning-journey div.motion-band>span.part1 {
    opacity: 0.4;
}

.learning-journey div.motion-band>span.part2 {
    opacity: 0.7;
}

.ui-widget-overlay {
    position: fixed !important;
}