.jumbotron{
    background-color:#ffffff;
    border:1px solid #AAA;
    border-bottom:3px solid #BBB;
    padding:0px;
    margin-top:4em;
    overflow:hidden;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.blue h1, h2, h3 {
    color: #2196F3;
}
.headline {
    color: #FFFFFF;
    margin: 1em;
}
.card {
    background-repeat: no-repeat;
    background-image: url(../images/bg-keynote.png);
    background-size: contain;
    margin-top: 15px;
    display: block;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: block;
    border:1px solid #AAA;
    border-bottom:3px solid #BBB;
    padding:0px;
    overflow:hidden;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-body{
    min-height: 430px;
    margin:1em;
}

.pull-left {
    float: left;
}

.pull-none {
    float: none !important;
}

.pull-right {
    float: right;
}
.card-header-height{
    height: 147px;
}
.card-body-height{
    height: 280px;
}
.card-body-height-talk{
    height: 229px;
}
.card-hr-height{

}
.card-header{
    width:100%;
    color:#2196F3;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);

}
.card-header-blue{
    background-color:#2196F3;
    color:#FFFFFF;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-header-red{
    background-color:#F44336;
    color:#FFFFFF;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-header-gold{
    background-color: goldenrod;
    color:#FFFFFF;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-header-purple{
    background-color: rebeccapurple;
    color:#FFFFFF;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-header-grey{
    background-color:#424242;
    color:#FFFFFF;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-header-orange{
    background-color:#E65100;
    color:#FFFFFF;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-header-grenn{
    background-color: #1bbb7c;
    color:#FFFFFF;
    border-bottom:3px solid #BBB;
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-family: 'Roboto', sans-serif;
    padding:0px;
    margin-top:0px;
    overflow:hidden;
    -webkit-transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-heading {
    display: block;
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 24px;
    margin-left:1em;
    border-bottom: 1px #2196F3;
    color:#fff;

}
@media (max-width: 1200px) {
    .card-heading{
        font-size: 20px;
    }
    .card-hr-height{
        height: 43px;
    }
    .card-body{
        font-size: smaller;
    }
}
@media (max-width: 1200px) and (min-width: 993px){
    .card-sbes{
        min-height: 750px !important;
    }
    .card-tutorial-2{
        min-height: 542px !important;
    }
    .card-tutorial-3{
        min-height: 698px !important;
    }
    .card-tutorial{
        min-height: 785px !important;
    }
}
.card-tutorial-3{
    min-height: 698px !important;
}
@media (min-width: 1399px) {
    .card-short3{
        min-height: 624px;
    }
    .card-short6{
        min-height: 743px;
    }
    .card-short7{
        min-height: 565px;
    }
    .card-short8{
        min-height: 575px;
    }
    .card-tutorial-3{
        min-height: 586px !important;
    }
}
#flowFramework{
    font-size: 12px !important;
}

@media (max-width: 992px) {
    .card-tutorial{
        min-height: inherit !important;
    }
    .card-tutorial-2{
        min-height: inherit !important;
    }
    .card-tutorial{
        min-height: inherit !important;
    }
}
@media (max-width: 416px) {
    .responsive{
        font-size: 11px;
    }
}
.card-speaker {
    display: block;
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 24px;
    margin-left:1em;
    padding-right: 10%;
    float: right;
    border-bottom: 1px #2196F3;
    color:#fff;

}
.card-hr{
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #5a5f69;
    margin: 1em 0;
    padding: 0;
}
.card-p{
    width: 100%;
    text-align: justify;
    word-break: break-all;
}
.card-footer{
    border-top:1px solid #000;

}

.card-action-pink{
    color:#E91E63;

}
.card-action-red{
    color:#F44336;

}
.card-action-grey{
    color:#424242;

}
.card-action-pink{
    color:#E91E63;

}
.card-action-orange{
    color:#E65100;

}
.img-fill  {
    max-height: 100%;
    max-width: 100%;
    display :inline-block;
    margin: 1em;
}

/**OVERFLOW MENU**/
/**MENU SETTINGS POPUP**/

.menu {
    display: none;
    background:#607D8B;
    width: 100%;
    padding: 30px 10px 50px;
    margin: 0 auto;
    text-align: center;
    background-color: #fff;
}
.menu ul {
    margin-bottom: 0;
}
.menu a {
    color: #000;
    text-transform: uppercase;
    opacity: 0.8;
}
.menu a:hover {
    text-decoration: none;
    opacity: 1;
}

.m-b-20{
    margin-bottom: 20px;
}
.m-t-20{
    margin-top: 20px;
}
.m-b-10{
    margin-bottom: 10px;
}
.m-b-0{
    margin-bottom: 0px;
}
@media (max-width: 440px){
    .resize {
        font-size: xx-small;
    }
}
.keynote-title{
    font-size: 14px;
    text-align: center;
    color: black;
    font-weight: 700;
}
.card-text{
    position: relative;
    font-size: 13px;
}
.card-img-top{
    margin-top: 1%;
    margin-left: 5%;
    margin-bottom: 1%;
    width: 230px;
    height: 200px;
}
@media (max-width: 375px) {
    .card-img-top{
        margin-left: 4%;
    }
}
@media (max-width: 320px) {
    .card-img-top{
        margin-left: -7%;
    }
}
.card-title{
    color: white;
    font-size: 13px;
    margin-bottom: 5%;
    font-weight: 500;
    text-align: center;
    margin-top: 9.5%;
    width: 100%;
    text-transform: uppercase;
}
.card-title-prev-edition{
    color: white;
    font-size: 10px;
    margin-bottom: 5%;
    font-weight: 500;
    text-align: center;
    margin-top: 8.5%;
    width: 100%;
    text-transform: uppercase;
}
.scrollC::-webkit-scrollbar {
    width: 10px;
}

.scrollC::-webkit-scrollbar-thumb {
    background: #555;
    border-radius: 20px;
}

.scrollC::-webkit-scrollbar-track {
    background: #313234;
    border-radius: 20px;
}
.triangle-down {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 0px solid transparent;
    border-top: 14px solid #313234;
    top: 0px;
    position: absolute;
}
.triangle-up {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 14px solid #313234;
    bottom: 0px;
    position: absolute;
}
.card-sbes{
    min-height: 592px;
}
.card-short{
    min-height: 550px;
}
.card-short2{
    min-height: 635px;
}
.card-short3{
    min-height: 690px;
}
.card-short4{
    min-height: 597px;
}
.card-short5{
    min-height: 665px;
}
@media (min-width: 992px) and (max-width: 1265px){
    .card-short2{
        min-height: 810px !important;
    }
    .card-short{
        min-height: 710px !important;
    }
}
@media (max-width: 1242px){
    .card-short3{
        min-height: 679px;
    }
}

@media (max-width: 1024px){
    .card-short3{
        min-height: 911px;
    }
    .card-short6{
        min-height: 934px;
    }
    .card-short4{
        min-height: 594px!important;
    }

    .card-short7{
        min-height: 754px;
    }
    .card-short8{
        min-height: 760px;
    }
    h4#groundedTheory{
        font-size: 12px !important;
    }
    h4#cognition{
        font-size: 11px !important;
    }
}
@media (max-width: 768px) {
    #AcceptedTutorials .card-body,
    #AcceptedTutorials .card{
        min-height: 0 !important;
    }
    #flowFramework,
    #combinatorial{
        font-size: 14px !important;
    }
}
@media (max-width: 1000px){
    .card-short3{
        min-height: 893px;
    }
}
@media (max-width: 451px){
    .card-img-top{
        height: auto;
        width: 100%;
        margin: initial;
        margin-bottom: 8px;
    }

}
.card-tutorial{
    min-height: 655px!important;
}
.card-sblp{
    min-height: 496px;
}

@media (min-width: 1240px) {
    .card-sblp{
        min-height: 489px;
    }
    .card-sbcars{
        min-height: 574px;
    }
}
.card-sast{
    min-height: 517px;
}
@media (max-width: 1258px) and (min-width:1135px ) {
    .card-sast{
        min-height: 575px;
    }
}
@media (max-width: 1135px) and (min-width:1081px ) {
    .card-sast{
        min-height: 625px;
    }
}
@media (max-width: 1081px) and (min-width:1014px ) {
    .card-sast{
        min-height: 665px;
    }
}
@media (max-width: 1014px) and (min-width:991px ) {
    .card-sast{
        min-height: 695px;
    }
}
@media (max-width: 1240px) and (min-width: 1165px) {
    .card-sblp{
        min-height: 501px;
    }
    .card-sbcars{
        min-height: 586px;
    }
}
@media (max-width: 1165px) and (min-width: 1121px) {
    .card-sblp{
        min-height: 518px;
    }
    .card-sbcars{
        min-height: 640px;
    }
}
@media (max-width: 1121px) and (min-width: 1094px) {
    .card-sblp{
        min-height: 528px;
    }
    .card-sbcars{
        min-height: 640px;
    }
}
@media (max-width: 1094px) and (min-width: 1055px) {
    #redux{
        margin-top: 8%;
        margin-bottom: 2.5%;
    }
    .card-sbcars{
        min-height:689px;
    }
}
@media (max-width: 1055px) and (min-width: 1041px) {
    .card-sblp{
        min-height: 573px;
    }
    .card-sbcars{
        min-height: 707px;
    }
}
@media (max-width: 1040px) and (min-width: 992px) {
    .card-sblp{
        min-height: 608px;
    }
    .card-sbcars{
        min-height: 742px;
    }
    .card-adjust{
        font-size: 12px;
        margin-top: 9%;
    }
    #speakerSblp .card-img-top{
        width: 215px;
    }
    #redux{
        margin-top: 7.5%;
        margin-bottom: 4%;
    }
}