body {
    color: #7f7f7f;
    font-size: 14px;
}

.img-responsive {
    display: block;
    width: 100%;
    height: auto;
}

h2 {
    margin-bottom: 0;
}

h1.headline {
    margin: 0 2% 40px 2%;
    text-align: center;
    color: #38709D;
    font-weight: bold;
    line-height: 1em;
    width: 96%
}

.fr {
    float: right;
}

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

.appstores {
    padding-top: 20px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.appstores.right {
    text-align: left;
    padding-left: 20px;
}

.appstores.left {
    text-align: right;
    padding-right: 20px
}

.gplay, .applestore {
    /*     padding-right: 20px; */
}

/* colors */

.bg-lb {
    background-color: #F1F9FF;
}

.txt-blue {
    color: #38709D;
}

.txt-green {
    color: #92d050;
}

.txt-default {
    color: #7f7f7f;
}

.small-de {
    font-size: .4em;
}

a.hidden-link {
    text-decoration: none;
}

.header-title {
    font-size: 7em;
    margin: 0;
}

.subheader-title {
    font-size: 1.5em;
    margin: 0 0 0 0;
    color: #7f7f7f;
}

.clear {
    clear: both;
}

section {
    padding: 20px 0;
}

.portals {
    /*background-color: #fff;*/
    margin-top: 2%;
}

.tile {
    position: relative;
    bottom: 0;
    background: none;
    text-align: center;
}

.tile img {
    display: block;
    max-width: 150px;
    min-width: 90px;
    width: 100%;
    height: auto;
    margin: 0 auto
}

.tile {}

.tile:hover {}

.tile span.logo_abr {
    position: absolute;
    top: 90px;
    font-size: 2.5em;
    font-weight: bold;
    left: 42%;
}

.tile>a {
    display: block;
    text-decoration: none;
    color: #38709D;
}

.tile.active, .tile.inactive {
    /*padding-left:20px;*/
    background: none;
}

.tile.active .cyrcle_time_green, .tile.active .cyrcle_time_red, .tile.inactive .cyrcle_time_red, .tile.inactive .cyrcle_time_green {
    background: none;
    box-shadow: none;
}

.tile.active {
    width: 150px;
    margin: 0 auto;
}

.tile.itp.active {
    width: 170px;
}

.tile.active a, .tile.inactive a {
    color: #38709D;
}

.minmarginbottom {
    margin-bottom: 0.9em;
}

p {
    padding: 0;
    margin: 0;
}

.tile p {
    color: #38709D;
    font-weight: bold;
    padding: 6px 0 20px;
    line-height: 1.2em;
}

p+h5 {
    margin-top: 10px;
}

.tile.inactive p {
    color: #555;
}

.supportedby .tile.inactive {}

.supportedby .tile.inactive a {}

.supportedby .tile.additional {
    background: #ccc;
}

.tile.inseklink {}

.col-4, .col-6-sm {
    margin: 1%;
}

.linkgreen1 {
    background-color: #3D6139;
    color: #fff;
}

.partner {
    height: auto;
    max-width: 100%;
}

.subheader-partner {
    color: #265697;
    font-weight: 400;
    text-align: left;
}

.zurueck {
    color: #265697;
    font-size: 20px;
    text-decoration: none;
}

.logo {
    float: left;
}

a {
    color: #7f7f7f;
}

header {
    margin: 0;
    padding: 20px 20px 30px 100px;
    padding: 0% 3% 1% 3%;
    /*background-color: #f1f9ff !important;*/
    /*   border-bottom: 1px solid #ededed; */
}

header ul.nav {
    display: inline-block;
}

header ul.nav {
    list-style-type: none;
    float: right;
}

header ul.nav li {
    display: inline-block;
}

header ul.nav li a {
    text-decoration: none;
}

header .logo {
    display: block;
    text-align: center;
    width: 100%;
}

header .img-responsive {
    width: 65%;
    margin: 0 auto;
}

footer {
    background-color: #f1f9ff !important;
    margin: 2% 0 0 0;
    /*   border-top: 1px solid #ededed; */
    border-bottom: 1px solid #ededed;
}

footer .logoleiste {
    text-align: center;
}

.logoleiste a {
    margin-right: 80px;
}

footer .logoleiste img {
    width: auto;
    /*height: 55px;*/
    padding: 10px 20px;
    opacity: 1;
}

footer .logoleiste .bigger-logo {
    height: 65px;
}

footer .logoleiste img:hover {
    opacity: 1;
}

footer .logoleiste a img:hover {
    opacity: 1;
}

footer .nav {
    float: right;
    font-size: .8em;
}

footer .nav a {
    text-decoration: none;
}

footer .nav a:hover {
    border-bottom: 1px solid #7f7f7f;
}

footer .nav li {
    display: inline-block;
    text-transform: uppercase;
}

@media (max-width: 720px) {
    .header-title {
        font-size: 3.3em;
    }
    .subheader-title {
        font-size: 1.2em;
    }
    .gplay, .applestore {
        display: block;
        width: 100%;
        height: auto;
    }
}

.row.kongress, .row.cme {
    margin-top: 50px;
}

.row.studienfinder {
    margin-top: 20px;
}

.row.studienfinder div div {
    text-align: center;
}

.supportedby {
    padding: 20px 0;
}

.supportedby div {
    text-align: center;
    color: #757575;
}

.supportedby a {
    font-size: 1.1em;
    color: #38709D;
    text-transform: uppercase;
    text-decoration: none;
}

.row.studienfinder div div img {
    height: 40px;
}

.badge {
    display: inline-block;
    padding: .5em .8em;
    font-size: 75%;
    /*font-weight: 700;*/
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    right: 6px;
    top: 6px;
    position: absolute;
    border-radius: 16px;
}

.badge-light {
    color: #212529;
    background-color: #f8f9fa;
}

.badge-new {
    background-color: #f60000;
    right: inherit;
    color: #fefefe;
    display: inline;
    font-size: 100%;
    left: -11%;
    top: -5px;
    width: auto;
}

.modal-body img {
    max-width: 100%;
    height: auto;
}

.modal-body .akademischepartner img, .modal-body .kooperationspartner img {
    max-width: 50%;
    height: auto;
}

.akademischepartner>div, .kooperationspartner>div, .expertenbeirat>div, .sponsorenlogos>div {
    text-align: center;
    margin-bottom: 2.5em !important;
}

.expertenbeirat>div {
    text-align: left;
    /* white-space: nowrap; */
}

button.close {
    font-size: 3em;
}

.buttonspacer {
    height: 1px;
    width: 100%;
    margin-top: 40px;
}

img.rotator {
    -webkit-transform: rotate(-40deg);
    -moz-transform: rotate(-40deg);
    -o-transform: rotate(-40deg);
    transform: rotate(-40deg);
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}

img.rotator:hover {
    -webkit-transform: rotate(-16deg);
    -moz-transform: rotate(-16deg);
    -o-transform: rotate(-16deg);
    transform: rotate(-16deg);
    -webkit-transition-duration: 2s;
    -moz-transition-duration: 2s;
    -o-transition-duration: 2s;
    transition-duration: 2s;
}

/*
############
#### ### Responsive Section ### ###
############
*/

@media (max-width: 575px) {
    .col-sm-6 {
        width: 48% !important;
    }
    .tile.active, .tile.itp.active {
        width: 135px;
    }
}

@media (max-width: 460px) {
    .container {
        width: 100%;
    }
    .row [class^="col"] {
        margin: 0;
    }
    .col-sm-6 {
        width: 48% !important;
    }
    h1.headline {
        font-size: 1.9em;
    }
    .tile {
        border-top: 0;
        width: 100%;
        padding-right: 0;
    }
    .tile a {
        margin-left: 0;
    }
    .tile p {
        font-size: 0.8em;
    }
    .supportedby {
        padding-left: 2%;
        padding-right: 2%;
    }
    .supportedby a, .nav a {
        font-size: 0.8em;
    }
    .supportedby .tile.inactive a {
        padding-left: 0;
    }
    .portals {
        margin-top: 0;
    }
    .appstores.right, .appstores.left {
        text-align: center;
        padding: 0;
    }
    .appstores.left {
        padding-left: 1%;
    }
}

.ribbon {
    position: absolute;
    right: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

.tile.itp.active .ribbon {
    right: 5px;
}

.ribbon span.biggertext {
    font-size: 13px;
}

.ribbon span {
    font-size: 10px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    width: 100px;
    display: block;
    background: #79A70A;
    background: linear-gradient(#FF0000 0%, #FF0000 100%);
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 19px;
    right: -21px;
}

.ribbon span::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid #FF0000;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF0000;
}

.ribbon span::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-right: 3px solid #FF0000;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF0000;
}