body {
    font-family:"Intel Clear", Helvetica, Arial, sans-serif;
    margin:0;
    overflow:visible;
    overflow-x:hidden;
    overflow-y:visible;
    padding:0;
}
    
article {
    background-color:#FFF;
    bottom:60px;
    color:#555;
    display:block;
    font-size:16px;
    overflow:auto;
    overflow-x:hidden;
    position:static;
    right:0;
    top:126px;
}

article.full-width {
    left:0;
}

article.with-sidebar {
    left:300px;
    top:248px;
}
    
article.full-width > div.text-contents {
    padding-left:0;
    padding-right:0;
    padding-top:0;
}

article > div.text-contents {
    margin-bottom:50px;
    padding:40px 40px 0;
}

article > div.catalog-contents {
    margin-bottom:-100px;
    padding:0 20px 100px;
}

article > div.focus-contents {
    align-self:center;
    background-color:#f0f0f0;
    margin:40px auto auto;
    margin-bottom:40px;
    max-width:600px;
    min-width:400px;
    padding:40px;
}

footer {
    position:static;
}

article.oneapi-main-art1 {
    top:126px;
}

article p,article li {
    color:#555555;
    font-family:'Intel Clear', sans-serif;
    font-size:15px;
    font-style:normal;
    font-weight:400;
}

article>div.text-contents>h2,article>div.text-contents>h3 {
    margin-top:30px;
}

article>div.text-contents>h2:first-child,article>div.text-contents>h3:first-child {
    margin-top:0;
}



































/*------------------------------------ For oneAPI ---------------------------------------------*/

nav{
    top:0px;
}

.intel-navbar{
    height: 69px;
}

.intel-navbar .navbar-logo{
    height: 69px;
}

div.navbar-right a{
    line-height: normal;
}

div.navbar-right p{
    color: #555555;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
}

div.optionsForLoggedInUser{
    display: flex;
    flex-direction: column;
}

div.optionsForLoggedInUser p{
    line-height: 23px;
    text-align: right;
}

nav.intel-navbar p, nav.intel-navbar li{
    margin-top: 0px;
    margin-bottom: 0px;
}

div.navbar-right a.button.forAccess{
    line-height: 30px;
    margin: auto;
    padding: 0px 5px;
    color:white;
}




header.main-head, nav, footer{
    position: static;
}

div.main_div_with_header_article_and_aside{
    position: static;
}

div.secondary_div_with_article_and_aside >aside.toc1{
    width: 300px;
}

a{
    text-decoration: none;
}

a.button{
    border-radius: 0px;
    text-align: center;
    white-space: normal;
}

div.asideLinks > div > a{
    padding-left:10px;
}

div.asideLinks a{
    font-weight: 400;
    font-style: normal;
    color: #0071C5;
}

h2{
    font-family: "Intel Clear Light", "Intel Clear Regular", "Intel Clear", sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 26px;
    color: #555555;
}

h2.headersForCatalog{
    font-family: 'Intel Clear', sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #0071C5;
    font-size: 15px;
    cursor: pointer;
}

h3{
    font-family: 'Intel Clear Bold', 'Intel Clear Regular', 'Intel Clear', sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 15px;
    color: #555555;
    padding-top: 30px;
}

h4{
    font-family: "Intel Clear Bold", "Intel Clear Regular", "Intel Clear", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 15px;
    color: #555555;
    padding-top: 30px;
}

input.link-like[type=submit] {
    background-color:white;
    color:#0071c5;
    padding:0;
    text-align:left;
    font-size:15px;
    font-weight:bold;
    margin-bottom:0;
}
input.link-like[type=submit]:hover {
    color:#003c71;
}

a.oneapiButtonLink{
    background-color: #FFFFFF;
    color: #0071C5;
    padding: 10px 40px;
    border-radius: 5px;
    text-decoration: none;
}

div.greybackground{
    margin-bottom: 0px;
    padding: 20px 0px;
}

div.reduceMarginForOtherSections{
    padding-bottom: 0px;
}

div.singlesample{
    padding: 15px;
    background-color: rgba(242, 242, 242, 1);
}

div.bluebackground{
    background-color: #003c71;
}

div.bluebackground > *{
    color:#FFFFFF;
}

div.bluebackground > h2{
    text-align: center;
}

footer{
    height:100%;
}

div.selectWithHeader{
    position: relative;
    width: 310px;
    height: 60px;
    padding: 0px 20px;
}

div.selectWithHeader select.dropdownmenu.withHeader{
    height: 60px;
    position:absolute;
    left: 0px;
}

label.headerForDropdown{
    position: absolute;
    left:5px;
    font-weight: normal;
    z-index: 1;
}

div.headerSecton{
    display: flex;
    justify-content: space-between;
}

h4.greyText{
    color: #555555;
}

.breadcrumb-bar-wrap-outer .breadcrumb-bar-wrap .breadcrumb-bar > li{
    margin-left: 0px;
}

footer{
    padding: 0px;
}

footer li, footer p{
    margin: 0px;
    line-height: auto;
}

ul.footer-links li{
    line-height: 22px;
}

ul.footer-links.secondary-links li{
    line-height: 17px;
    font-size: 0.75rem;
    color: #000;
}

footer.global a{
    line-height: auto;
    padding: 0px;
}

div.loggedOutSection a.button-modalLogin{
    padding: 10px 0px;
}

img.illustration_img{
    display: block;
    max-height: 480px;
    position: relative;
    transition: .1s ease;
    margin: 10px auto 20px;
    padding: 0;
}

/*------------------------------------ For Header Section ----------------------------------------------*/

header.oneapi-main-head{
    background-color: #fff;
    color: #555555;
    height: 66px;
}

header.oneapi-main-head > img{
    background-color: red;
}

header.oneapi-main-head > div.main-project-name > div{
    padding-top: 20px;
}

nav.oneapi-main-nav{
    top:66px;
}

div.loggedOutSectionInBanner{
    display: flex;
    flex-direction: column;
    max-width: 200px;
    margin: auto;
}

div.loggedOutSectionInBanner a{
    margin-top: 0px;
    margin-bottom: 0px;
}



a.button{
    background-color: #0071c5;
}

input[type=submit].oneapiJupyterButton{
    background-color: #0071c5;
}

input[type=submit].oneapiJupyterButton:hover{
    background-color: #013467;
}

:not(pre) > code[class*="language-"], pre[class*="language-"]{
    background: #FEFEFE;
}

@media screen and (max-width: 1000px) {
    :not(pre) > code[class*="language-"], pre[class*="language-"]{
        max-width: 600px;
    }
}

@media screen and (max-width: 600px) {
    :not(pre) > code[class*="language-"], pre[class*="language-"]{
        max-width: 250px;
    }
}


div.panel-item.with-sep-line p{
    text-align: left;
}

h3.section-title{
    color: #555555;
}

a.signInForoneAPI{
    padding-top: 10px;
    padding-bottom: 10px;
}

input[type=submit]{
    background-color: #0071C5;
}

div.flex-layout-md.flex-align-center.vertical-gutter input[type=submit]:hover{
    background-color: #003C71;
}
/*------------------------------------ For oneAPI home page ---------------------------------------------*/

div.oneapiHome > div{
    padding: 20px 50px;
}

span.message-date{
    display: inline-block;
    min-width: 150px;
}

span.message-control::after{
    color: #0071c5;
    font-family: "site-global-icons";
    content:"\E80B";
}



span.message-control.expanded::after{
    font-family: "site-global-icons";
    content:"\E80C";
}

div.message-body{
    background-color: white;
    padding: 10px;
}

span#message.expandable, div.message-container{
    cursor: pointer;
}

div.oneapiHome div.announcement_section.oneapi_announcement_section{
    padding-top: 0px;
    padding-bottom: 0px;
}

div.oneapiHome div.announcement_section.oneapi_announcement_section > div.announcement_list{
    padding-left: 0px;
}

div.hideMessageOnCollapse{
    display:none;
}

div.showAllMessages{
    display:block;
}

div.whyONEAPI{
    display:flex;
    flex-wrap: wrap;
    padding-top: 50px;
}

div.whyONEAPI > h2 {
    display: block;
    width: 100%;
}

div.whyONEAPI> div{
    max-width: 440px;
    padding: 0px 20px;
}

div.whatCanBeDoneWithoneAPI{
    display:flex;
    padding-bottom: 50px;
    justify-content: center;
    flex-wrap: wrap;
}

div.whatCanBeDoneWithoneAPI > div.padding-images > img{
    width: 100px;
}

div.whatCanBeDoneWithoneAPI > div{
    width: 100%;
    max-width: 230px;
    background-color: rgba(242, 242, 242, 1);
    margin: 10px 10px;
}

div.howYouCanDoIt > div.description{
    display: flex;
    justify-content: center;
    padding-bottom: 50px;
    flex-wrap: wrap;
}

div.howYouCanDoIt > div.description > h4{
    width: 216px;
    margin: 10px;
    background-color: rgba(242, 242, 242, 1);
    padding: 10px;
    text-align: center;
}

div.oneAPIToolkits {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}

@media screen and (min-width: 1100px) {
    div.oneAPIToolkits > div {
        width: 33%;
    }
}

div.oneAPIToolkits img{
    display: inline;
    float: left;
    margin-top: 0px;
    margin-right: 15px;
    width: 80px;
}

div.oneAPIToolkits a{
    text-decoration: none;
}

div.featuredTools{
    display: flex;
    padding-top: 30px;
}

@media screen and (max-width: 1100px) {
    div.featuredTools{
        flex-direction: column;
    }
}

@media screen and (min-width: 600px){
    div.featuredTools > div{
        min-width: 347px;
    }
}

div.featuredTools > div > img{
    display:block;
    margin: auto;
    height:auto;
}

@media screen and (min-width: 1100px){
    div.featuredTools > div > img{
        padding-left: 60px;
    }
}

div.readyToGetStarted > h2{
    font-size: 70px;
}

div.oneapiHome > div.wantToExploreAndSupport{
    display:flex;
    padding-top: 50px;
    justify-content: space-evenly;
    width: 100%;
}

div.instructionsToConnect{
    display:flex;
    justify-content: space-evenly;
}


@media screen and (max-width: 600px) {
    div.instructionsToConnect{
        flex-direction: column;
    }
}


div.trainingResources  h4{
    color: #0071c5;
    padding-top: 0px;
}

div.trainingResources div.intro-panel:nth-child(1) div.intro-description > h4{
    padding-top: 20px;
}

div.wantToExploreAndSupport>div{
    padding-right: 50px;
}

div.wantToExploreAndSupport a{
    text-decoration: none;
}

div.bluebackground > a.oneapiButtonLink{
    background-color: #FFFFFF;
    color: #0071C5;
    font-size: 15px;
    margin: 0px 40px;
}

div.readyToGetStarted > p{
    text-align: center;
    padding-top: 20px;
}


div.whatsInside{
    padding: 40px;
}

div.whatsInside h4, div.whatsInside h2{
    text-align: left;
}

div.wantToExploreAndSupport{
    display: flex;
}

div.wantToExploreAndSupport > div{
    width: 100%;
}

div.wantToExploreAndSupport a, div.wantToExploreAndSupport h2{
    text-align: left;
}

div.optionToConnectOnHomePage h4{
    display: none;
}

div.descriptionOfToolkit a.button{
    margin-left: 0px;
}

div.descriptionOfToolkit > div > h4{
    margin-bottom: 0px;
}

div.descriptionOfToolkit > div div.expandable::after{
    font-family: "site-global-icons";
    content:"\E80B";
}

div.descriptionOfToolkit > div div.expandable.expanded::after{
    font-family: "site-global-icons";
    content:"\E80C";
}

div.oneapi_get_started_guide{
    max-width: 100%
}

div.oneapi_get_started_guide h2{
    text-align: left;
}

div.oneapi_get_started_guide> div.oneapi_learn_links > h2.howYouCanDoIt{
    font-weight: bold;
    font-size: 15px;
}

@media screen and (min-width: 768px) {
    div.oneapi_get_started_guide > div.oneapi_learn_links{
        padding-left: 30px;
    }
}

@media screen and (max-width: 600px) {
    div.oneapi_get_started_guide > div> iframe{
        max-width: 300px;
    }
}

/*------------------------------------ For oneAPI Get Started ---------------------------------------------*/

div.oneapiGetStarted{
    margin-bottom: 50px;
}

div.oneapiGetStarted > div{
    margin: 0px 50px;
}

div.oneapiGetStarted >  p.exploreToolkitDescription{
    padding: 0px 70px;
}

div.oneapiGetStarted > div.greybackground{
    padding-top: 0px;
}

div.oneapiGetStarted > div.greybackground > h1{
    text-align: left;
}

span.highlightExpiry{
    color: #F73B3B;
}

div.introToGetStarted{
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}

div.introToGetStarted > div.intro-panel{
    flex:1;
    flex-basis:40%;
    flex-wrap:nowrap;
    padding: 20px;
    display: flex;
    justify-self: flex-start;
    min-width:300px;
    width: 100%;
    
}

div.introToGetStarted > div.intro-panel > div.intro-image {
    flex-shrink:0;
    flex-grow:0;
    width:100px;
}

div.introToGetStarted > div.intro-panel > div.intro-image > img{
    display: block;
    max-height: 90px;
    margin: 0px;
}


div.introToGetStarted > div.intro-panel > div.intro-description > h4, div.introToGetStarted > div.intro-panel div.options_to_connect{
    margin-top: 0px;
    padding-top: 0px;
}

div.introToGetStarted > div.intro-panel > div.intro-description{
    padding-left: 20px;
}

div.introToGetStarted > div.intro-panel > div.intro-description > a{
    margin-left: 0px;
}

div.options_to_connect > span{
    display: block;
}

div.options_to_connect > span label{
    font-weight: normal;
}

div.options_to_connect h4{
    display: inline;
}

div.exploreoneAPIToolkits{
    background-color: #f3f3f3;
}

div.exploreoneAPIToolkits > div{
    border-bottom: 5px solid white;
}

div.exploreoneAPIToolkits div.descriptionOfToolkit{
    display: flex;
}

div.exploreoneAPIToolkits div.descriptionOfToolkit > div{
    padding-right : 20px;
}

div.exploreoneAPIToolkits div.expandable{
    cursor: pointer;
    margin: 10px 0px;
}

div.exploreoneAPIToolkits div.descriptionOfToolkit > img{
    width: 150px;
    height: 150px;
    margin: 10px 20px;
}

div.exploreoneAPIToolkits div.descriptionOfToolkit > div > h4{
    padding-top: 0px;
}

div.exploreoneAPIToolkits div.expandable{
    color: #0071C5;
}

div.exploreoneAPIToolkits div.expandable.expanded > div >h4, div.exploreoneAPIToolkits div.expandable.expanded > div >p{
    color: #FFFFFF;
}

div.exploreoneAPIToolkits div.showOnExpand{
    display: none;
    padding-left: 188px;
    padding-right: 20px;
}


div.exploreoneAPIToolkits div.showOnExpand.expanded{
    display: block;
}

div.exploreoneAPIToolkits div.showOnExpand > ul{
    -webkit-column-count: 3;  /* Chrome/Opera, Safari */
    -moz-column-count: 3; /* Mozilla Firefox */
    column-count: 3;

    padding-bottom: 20px;
}

@media screen and (max-width: 1000px) {
    div.exploreoneAPIToolkits div.showOnExpand > ul{
        -webkit-column-count: 2;  /* Chrome/Opera, Safari */
        -moz-column-count: 2; /* Mozilla Firefox */
        column-count: 2;
    }
}

@media screen and (max-width: 600px) {
    div.exploreoneAPIToolkits div.showOnExpand > ul{
        -webkit-column-count: 1;  /* Chrome/Opera, Safari */
        -moz-column-count: 1; /* Mozilla Firefox */
        column-count: 1;
    }
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages{
    display: flex;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div{
    background-color: #FFFFFF;
    border: 1px solid #e6e6e6;
    margin: 0px 20px 20px 0px;
    padding: 20px;
    width: 100%;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div:first-child{
    margin-left: 0px;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div{
    padding-bottom: 50px;
    max-width: 700px;
    position: relative;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > h4, div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > div {
    text-align: center;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > h4{
    margin-top: 0px;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > div{
    position: absolute;
    bottom: 10px;
    width: 100%;
    left:0px;
    padding-left:20px;
    padding-right: 20px;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > div > a{
    margin-bottom: 0px;
}

div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > h4, div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > div > a{
    white-space: break-spaces;
    width: 100%;
    margin-right: 0px;
    margin-left: 0px;
}

@media screen and (max-width: 1000px) {
    div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages{
        flex-wrap: wrap;
    }
    div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > h4, div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div > div > a{
        margin: 0px;
        min-width: 0px;
    }
}

@media screen and (max-width: 600px) {
    div.exploreoneAPIToolkits div.showOnExpand > div.linkToOtherPages > div{
        margin-right: 0px;
        margin-left: 0px;
    }
}

@media screen and (max-width: 600px){
    div.exploreoneAPIToolkits div.descriptionOfToolkit{
        flex-direction: column;
    }
    div.exploreoneAPIToolkits div.showOnExpand{
        padding-left: 30px;
    }
    div.exploreoneAPIToolkits div.descriptionOfToolkit div{
        padding-left: 30px;
    }
}


div.showOnExpand.expanded h4{
    padding-top: 0px;
}

div.oneapiGetStarted > h2{
    padding: 0px 70px;
}

nav a{
    white-space: normal;
    padding: 0px;
}

nav p, nav li{
    margin-top:0px;
    margin-bottom: 0px;
}

.intel-navbar .mega-navbar .primary-nav-item{
    padding: 0px;
}

.intel-navbar .navbar-logo{
    margin-right: 0px;
}

div.oneapi_get_started_guide > div, div.oneapi_get_started_guide > div.oneapi_learn_links{
    width: 100%;
}


/*------------------------------------ For oneAPI baseToolkitSamples, baseTrainingModules and renderingToolkitSamples ---------------------------------------------*/

div.toolkitExample{
    padding: 20px 40px 50px 40px;
}

div.toolkitExampleWithBorder{
    background-color: rgba(255, 255, 255, 1);
}

h1.headerForSamplePages{
    text-align: left;
    padding: 0px 0px 20px 40px;
    font-family: 'Intel Clear Light', 'Intel Clear Regular', 'Intel Clear', sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 26px;
    color: #555555;
    text-transform: none;
}

h1.instructionHeaderForSamplePages{
    text-align: left;
    padding: 0px 70px 0px 70px;
    font-family: 'Intel Clear', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    color: #555555;
    text-transform: none;
}

@media screen and (max-width: 1000px) {
    h1.headerForSamplePages{
        text-align: center;
    }
    div.headerSecton{
        display: block;
    }
    div.selectWithHeader{
        margin: auto;
        padding-bottom: 80px;
    }
}

div.toolkitExample > h1{
    font-size: 20px;
    font-family: IntelClear-Regular, "Intel Clear", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    text-transform: none;
    padding-left: 20px;
}

div.toolkitExample > p.description{
    color:#0071C5;
    font-size: 15px;
}

div.toolkitExample > p{
    color: #555555;
    padding-left: 20px;
}

div.toolkitExample > div.sampleslist{
    justify-content: flex-start;
}

@media screen and (max-width: 1000px) {
    div.toolkitExample > div.sampleslist{
        justify-content: center;
    }
}

div.toolkitExample > div.sampleslist > div.singlesample{
    flex-basis: 30%;
    margin: 10px;
    max-width: 300px;
}

div.toolkitExample > div.sampleslist > div.singlesample >div.singlesample-description > h4{
    font-size: 15px;
    color: #555555;
    font-style: bold;
    padding-top: 0px;
    margin-top: 0px;
}

div.toolkitExample > div.sampleslist > div.singlesample >div.singlesample-description > h4.greyText{
    color: #555555;
}

div.toolkitExample > div.sampleslist > div.singlesample >div.singlesample-description > p.categorytag{
    font-style: normal;
    display: none;
}

div.toolkitExample > div.sampleslist > div.singlesample > div.singlesample-description > p{
    color: #555555;
    font-size: 14px;
}

div.toolkitExample > div.sampleslist > div.singlesample > div.singlesample-description > input.jupyter-link[type=submit], div.toolkitExample > div.sampleslist > div.singlesample > div.singlesample-description > form >input.jupyter-link[type=submit]{
    text-decoration: none;
    font-size: 15px;
}

p.userInfoInToolkit{
    background-color: rgba(134, 179, 43, 1);;
    font-size: 18px;
    padding: 10px;
}

p.userInfoInToolkitForLoggedOut{
    color:#FFFFFF;
    background-color: rgb(0, 113, 197);
    font-size: 18px;
    padding: 10px;
    margin-bottom: 0px;
}

p.userInfoInToolkitForLoggedOut > a{
    color:white;
    text-decoration: underline;
}

div.steps_to_connect_and_use_sample{
    display: flex;
    flex-direction: column;
    padding: 20px 65px;
    padding-bottom: 0px;
}

div.steps_to_connect_and_use_sample > div{
    border-bottom: 1px solid #cac9c9;
    display: flex;
    flex-wrap: wrap;
}


@media screen and (min-width: 600px) {
    div.steps_to_connect_and_use_sample > div{
        flex-wrap: nowrap;
    }
}

div.steps_to_connect_and_use_sample > div:nth-child(3){
    border-bottom: 0px;
}

div.step_number{
    font-weight: 700;
    font-size: 75px;
    color: #555555;
    padding-right: 15px;
}

div.steps_to_connect_on_logged_out_page{
    background-color: rgb(0, 113, 197);
}

div.steps_to_connect_on_logged_out_page > div{
    background-color: white;
    padding: 10px;
    margin: 20px;
}

div.steps_to_connect_on_logged_out_page, div.steps_to_connect_on_logged_out_page > div {
    display: flex;
    width: 100%;
}

@media screen and (max-width: 600px) {
    div.steps_to_connect_on_logged_out_page, div.steps_to_connect_on_logged_out_page {
        flex-wrap: wrap;
    }
}


div.steps_to_connect_on_logged_out_page div.step_number{
    font-family: 'Intel Clear Light', 'Intel Clear Regular', 'Intel Clear', sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 26px;
    color: #555555;
    padding: 20px;
}


div.steps_to_connect_on_logged_out_page div.step_description h1{
    font-family: 'Intel Clear Bold', 'Intel Clear Regular', 'Intel Clear', sans-serif;
    font-weight: 700;
    font-size: 18px;
    text-align: left;
    text-transform: none;
}

div.steps_to_connect_and_use_sample > div > div.step_description > h1{
    font-size: 25px;
    text-align: left;
    color: #0071C5;
    font-family: 'Intel Clear Light', 'Intel Clear Regular', 'Intel Clear', sans-serif;
    text-transform: none;
}

span.browseAvailableSamples{
    background-color: white;
    padding: 10px 20px;
    display: inline-block;
}

div#vasForm > div.modal-content > div.modal-body > form > textarea{
    border: 1px solid #555;
}
div#vasForm > div.modal-content{
    max-width: 800px;
}

a.showVASForm{
    cursor: pointer;
}

span.vasTitle{
    display: none;
}

div.system_maintenance{
    padding: 50px;
}

div.system_maintenance > p{
    text-align: center;
}

div.system_maintenance > p.notification{
    font-size: 16px;
    color: #555555;
    font-weight: 700;
}

div.sectionForConnectAndCreate > h1{
    font-size: 27px;
}

div.sectionForConnectAndCreate div{
    text-align: center;
}

/*------------------------------------ For oneAPI SSH Connection ---------------------------------------------*/
div.options_to_connect{
    background-color: rgba(255, 255, 255, 1);
    color:#555555;
    padding: 10px;
}

div.options_to_connect label{
    display: inline-block;
}

div#modalToChangeOpenVinoVersion label{
    color: #555555;
}

div.typeAndVersionOfJupyter{
    display: flex;
    justify-content: space-evenly;
    padding-bottom: 20px;
}

div.typeAndVersionOfJupyter > div{
    position: relative;
    padding: 0px 10px;
}

div.modal.notification#modalToChangeOpenVinoVersion div.modal-content{
    max-width: 700px;
    width: 100%;
}

div.typeAndVersionOfJupyter > div > p{
    border-bottom: 1px solid #555;
    padding-bottom: 10px;
}

div.typeAndVersionOfJupyter > div > p > span.badge {
    padding: 3px 8px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    font-size: 15px;
    color: white;
    text-align: center;
    background-color: rgba(0, 153, 255, 1);
}

div.modal.notification#modalToChangeOpenVinoVersion > div.modal-content > div.modal-body > input{
    margin-left: 30px;
}

div.modal.notification#modalToChangeOpenVinoVersion > div.modal-content > div.modal-body > a.button{
    margin-top: 20px;
    max-width: 50px;
    text-align: center;
    margin-left: 30px;
}

a.jupyter-maintenance-button {
    border-radius: 3px;
    border: none;
    color: #FFF;
    background-color: #39C6FC;
    font-size: 18px;
    display: inline-block;
    cursor: pointer;
    margin: 10px 0;
    padding: 5px 20px;
}

div.asideLinks a.currentArticleInDocument{
    color: #555555;
    font-weight:700;
}

div.asideLinks a{
    display: block;
    padding: 5px 0px;
}

div.asideLinks>div{
    display: none;
}

div.asideLinks>div.visible{
    display: block;
}

div.asideLinks p.catalogDescription{
    font-family: 'Intel-Clear';
    color: #0071C5;
    font-size: 15px;
    font-weight: bold;
    text-align: left;
    padding-top:5px;
    padding-bottom:5px;
    margin:0;
}

h2.invisble::before{
    font-family: "site-global-icons";
    content:"\E80B";
    padding-right: 5px;
}

h2.visible::before{
    font-family: "site-global-icons";
    content:"\E80C";
    padding-right: 5px;
}

span.expandable::after{
    content:"(show more)";
    color: #0071C5;
    font-size: 15px;
    font-weight: normal;
}

span.expandable.expanded::after{
    content:"(show less)";
    color: #0071C5;
    padding-right: 100px;
    font-size: 15px;
    font-weight: normal;
}



div.listOfHeaders{
    padding-left: 30px;
}

div.listOfHeaders a.selectedHeader{
    color:#555555;
    font-weight:700;
}

div.steps_to_connect_as_per_option_selected > div{
    display: none;
}

h1#runningAppSteps.expandable::after, h1#connectionWithDevCloud.expandable::after{
    font-family: "site-global-icons";
    content:'\E80B';
    padding-left: 10px;
}

h1#runningAppSteps.expandable.expanded::after, h1#connectionWithDevCloud.expandable.expanded::after{
    font-family: "site-global-icons";
    content:'\E80C';
    text-transform: none;
    font-size: 17px;
    padding-left: 10px;
}


div.runningAppSteps{
    display: none;
}

div.runningAppSteps.expanded{
    display: block;
}


div.steps_to_connect_as_per_option_selected h2{
    font-size: 20px;
    font-weight: 700;
}

div.steps_to_connect_as_per_option_selected h3{
    font-size: 16px;
}

p.description{
    color:#023F62;
}

div#list_of_steps_to_connect_with_devcloud > div#steps_to_connect_with_devcloud{
    padding-bottom: 20px;
}

div.sample_type_selector{
    padding: 5px 20px;
    background-color: rgba(242, 242, 242, 1);
    display: inline-block;
}

div.oneapi-signin-banner{
    z-index:1;
}

div.oneapi-signin-banner p{
    text-align: center;
    font-weight: 700;
    color:#555555;
}

div.oneapi-signin-banner div{
    text-align: center;
    padding: 10px;
}


div.breadcrumb_for_news_container{
    background-color: #f3f3f3;
}

.panel_navbar{
    background-color: #f3f3f3;
}

.announcement_section{
    background-color: #f3f3f3;
}

.dot {
    background-color: #f3f3f3;
}

div#modalExtension h2{
    font-family: "Intel Clear", Helvetica, Arial, sans-serif;
    text-transform: capitalize;
}

img.illustration{
    max-width:100%;
}

div.loggedOutSection > a.signInForoneAPI{
    display: inline-block;
}

div.oneapiHome div.whyONEAPI>div{
    justify-content: center;
}

div.early_access_resources div.whyONEAPI>div{
    justify-content: left;
    padding-left: 70px;
}


div.early_access_resources>h2, div.early_access_resources> p, div.early_access_resources>div.whyONEAPI>h2, div.trademarks{
    padding-left: 70px;
    padding-right: 70px;
}

div.early_access_resources>div.whyONEAPI h4{
    padding-top: 0px;
    margin-top: 0px;;
}

div.early_access_resources div.toolkitExample h1{
    font-family: "Intel Clear Light", "Intel Clear Regular", "Intel Clear", sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 26px;
    color: #555555;
}

div.early_access_resources> p{
    padding-bottom: 20px;
}

div.early_access_resources div.wantToExploreAndSupport{
    padding: 20px 70px 20px 70px;
}



div.oneapiGetStarted div.nda{
    background-color: rgba(242, 242, 242, 1);
    margin: 20px 50px;
    padding: 20px 40px;
}

div.oneapiGetStarted div.instructionsToConnect{
    padding: 0px 20px
}

div.nda a{
    margin-left: 0px;
}

div.nda_access{
    padding-left: 50px;
    padding-right: 50px;
}

div.early_access_resources div.whyONEAPI{
    padding-top: 20px;
}

div.early_access_resources  div.toolkitExample{
    padding-left: 50px;
    padding-right: 50px;
}

@media screen and (max-width: 600px){
div.oneapiGetStarted > div.introToGetStarted{
    margin: 0px;
}
}

div.early_access_resources  div.whyONEAPI{
    padding-bottom: 20px;
}




div.oneapiHome div.whyONEAPI{
    justify-content:center;
}

div.nda_access h4{
    padding-top: 0px;
}















/* Banner */

div.full-width-banner {
    width:100%;
    background-color:#0071c5;
    background-size:cover;
    background-position:center center;
    display:table;
    height:150px;
    margin:0;
    padding:20px;
    }
    
    div.full-width-banner p {
    color:#FFF;
    font-size:18px;
    text-align:center;
    }
    
    div.full-width-banner h1 {
    line-height:65px;
    vertical-align:middle;
    display:block;
    text-transform:none;
    color:#FFF;
    font-size:36px;
    font-family:intel-clear, Helvetica, Arial, sans-serif;
    text-align:left;
    font-weight:200;
    text-shadow:none;
    margin:0;
    padding:0 0 4px;
    }
    
    div.full-width-banner a {
    text-decoration:none;
    color:#FFFFFF;
    margin-right:20px;
    padding-bottom:10px;
    white-space:pre-line;
    }
    
    div.full-width-banner a.current {
    font-weight:400;
    border-bottom:3px solid #FFFFFF;
    }
    
    div.full-width-banner a:hover {
    text-decoration:underline;
    }
    
    @media screen and (max-width: 1200px){
        div.full-width-banner h1 {
            margin-top:20px;
        }
    }

    @media screen and (max-width: 600px){
        div.full-width-banner a {
            padding-bottom:0px;
        }
    }


    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h2 {
        list-style-type: none;
        counter-increment: h2HeaderCount 1;
    }

    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h2::before{
        content: "1." counter(h2HeaderCount) " " ;
    }


    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h2 ~ h3{
        list-style: none;
        counter-increment: h3HeaderCount 1;
    }


    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h2 ~ h3::before{
        content: "Option " counter(h3HeaderCount) ": ";
    }


    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h2{
        counter-reset: h3HeaderCount;
    }


    div.steps_to_connect_and_use_sample > div:nth-child(2) h3{
        list-style: none;
        counter-increment: h3HeaderCountForSecondStep 1;
    }

    div.steps_to_connect_and_use_sample > div:nth-child(2) h3::before{
        content: "2." counter(h3HeaderCountForSecondStep) ". ";
    }

    div.runningAppSteps.expanded{
        padding-bottom: 20px;
    }


    /* ----- Padding for lists -----*/
    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h2 ~ *{
        padding-left: 20px;
    }


    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h3 ~ *{
        padding-left: 40px;
    }

    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h3{
        padding-left: 20px;
    }

    div.steps_to_connect_as_per_option_selected > div:not(:first-child) > h2{
        padding-left: 0px;
    }

    div.steps_to_connect_and_use_sample > div:nth-child(2) h3 ~ *{
        padding-left: 20px;
    }

    div.steps_to_connect_and_use_sample > div:nth-child(2) h4 ~ *{
        padding-left: 40px;
    }

    div.steps_to_connect_and_use_sample > div:nth-child(2) h4{
        padding-left: 20px;
    }

    div.steps_to_connect_and_use_sample > div:nth-child(2) h3{
        padding-left: 0px;
    }


.announcement_section{
    background-color: #E3E3E3;
    padding-bottom: 20px;
}

div.loggout_warning{
    display: none;
}