﻿/*
    #082b6b - AZUL TOPO
    #19468C - Azul Novo
    #bf0b28 - Vermelho Menu
    #525051 - Cinza texto
    #
*/

html, body {
    height: 100%;
}

[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important;
}

.input-field label {
    left: 0;
}

content {
    font-size:14px;
    line-height:1.62em;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

.no-margin {
    margin: 0 !important;
}

.no-padding {
    padding: 0 !important;
}

.btn-block {
    display: block;
    width: 100%;
}

.breadcrumb {
    border-bottom: 1px solid #e8e8e8;
    color: #333;
    font-size: 12px;
    padding: 8px 15px 12px !important;
    margin-bottom: 20px;
    list-style: none;
    border-radius: 4px;
}

    .breadcrumb > li {
        display: inline-block;
    }

        .breadcrumb > li + li:before {
            padding: 0 5px;
            color: #ccc;
            content: "/\00a0";
        }

    .breadcrumb > .active {
        color: #777;
    }

    .breadcrumb a {
        color: #333;
        font-weight: 700;
    }

        .breadcrumb a:hover {
            color: #bf0b28;
            text-decoration: none;
        }

    .breadcrumb:last-child {
        color: #333;
    }

.img-responsive {
    width: 100%;
}

.underline {
    text-decoration: underline;
}

.card .card-content .card-title {
    display: block;
    line-height: inherit !important;
    margin-bottom: 10px;
}

.card .card-content p {
    line-height: 1.62em;
}

/*******************************/
a {
    color: #333;
    text-decoration: none;
}

    a:hover {
        color: #900;
        text-decoration: underline;
    }

address {
    font-style: normal !important;
    margin-bottom: 2em;
}

body, html {
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    color: #333;
}

h1, h2, h3 {
    margin-bottom: 1em;
}

h2 {
    color: #29569C;
    font-size: 42px;
    font-weight: 400;
    letter-spacing: -1.5px;
    margin: 0 0 1.25rem;
}

h3 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 18px;
}

h4 {
    font-size: 20px;
}

nav ul a {
    padding: 0 14px;
}

label {
    left: 0;
}

p {
    line-height: 1.62em;
}

section:not(.home):last-child {
    padding-bottom: 20px;
}

strong {
    font-weight: 700;
}

ul {
    margin-left: 0;
}

    ul.list-listed {
        list-style-type: disc;
        margin-left: 2em;
    }

    ul ul li {
        line-height: 1.62em;
        margin-left: 2em;
    }

video {
    width: 100%;
    height: auto;
}

.btn, .btn-large, .btn-flat {
    height: inherit;
}

    .btn:hover, .btn-large:hover, .btn-flat:hover {
        color: #fff !important;
        height: inherit !important;
        text-decoration: none !important;
    }

.icon-text {
    font-size: 22px;
    position: relative;
    right: 3px;
    top: 5px;
}

.santa-azul {
    background: #19468C !important;
}

.no-margin-bottom {
    margin-bottom: 0;
}

.no-margin-top {
    margin-top: 0;
}

/*.row {
    margin: 0;
}*/

.stop-menu-scrollable {
    margin-bottom: 30px;
}

/**********/
/* HEADER */
/**********/
.navbar-fixed {
    z-index: 10000;
}

nav a:hover {
    color: #fff;
    text-decoration: none;
}

nav .brand {
    padding-top: 6px;
}

    nav .brand a {
        padding: 0 15px 0 0;
    }

    nav .brand:hover a {
        background: none;
    }

nav i {
    font-size: 26px !important;
}

ul.side-nav.fixed ul.collapsible-accordion {
    background-color: #FFF;
}

.side-nav .collapsible {
    margin: 0;
    border: none;
    box-shadow: none;
}

    .side-nav .collapsible li {
        margin: 0 !important;
    }

.side-nav a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.logo-abmes {
    margin: 10px 0 0;
    min-height: 150px;
}

.quick-menu {
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 1000000;
    background: #19468C;
    text-align: center;
    display: none;
    padding-bottom: 30px;
}

    .quick-menu .closebtn {
        font-size: 32px;
        color: #fff;
        cursor: pointer;
        position: absolute;
        top: 3%;
        right: 2%;
        text-decoration: none;
    }

    .quick-menu h2 {
        font-size: 22px;
        color: #fff;
        margin: 20px 0 0;
    }

    .quick-menu p {
        color: #fff;
    }

.logo-acesso-rapido {
    border-radius: 2px;
    margin: 20px 0 0;
}

/**********/
/* FOOTER */
/**********/
footer {
    padding: 15px 0 0 0;
}

    footer a {
        color: #fff;
    }

        footer a:hover {
            color: #5986CC;
        }

    footer .fa {
        font-size: 32px;
        margin: 15px 10px;
    }

.linkmap-section h3 {
    color: #fff;
}

.social img {
    margin: 2px;
}

#unisanta-cookie-mensagem {
    background: #B71C1C !important;
    bottom: 1em;
    color: #fff;
    font-size: 13px;
    /*    max-height: 5rem;
*/ padding: 1rem;
    position: relative;
    z-index: 99999999 !important
}

    #unisanta-cookie-mensagem a {
        color: #fff;
        font-size: 13px;
        text-decoration: underline;
    }

.waves-effect {
    z-index: 0 !important;
}

.botao-inscricao-vestibular {
    background: #ce171a;
    border-radius: 50px !important;
    font-size: 15px;
    margin-top: 15px;
    font-weight: 500;
    line-height: 2rem;
    padding: 10px 0;
    color: #fff !important;
    height: inherit !important;
    text-decoration: none !important;
    box-shadow: 0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2);
}
/********/
/* HOME */
/********/
#btm-close-video {
    color: #fff;
    cursor: pointer;
    font-size: 32px;
    font-weight: 700;
    position: absolute;
    right: 1.5%;
    top: 2%;
    z-index: 9999;
}

content #chicken {
    width: 100%;
}

    content #chicken .image-slide {
        width: 100%;
    }

content .linkmap-section {
    padding: 36px 0;
}

content .section-map {
    width: 100%;
}

.course-home a:hover {
    color: #900 !important;
    text-decoration: none;
}

/*.course-home .slick-slide img {
        max-height: 187px;
        max-width: 279px;
    }*/

.news-type-description {
    display: block;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 1.2em;
    margin: 0px 0 0 2px;
}

.santaportal-logo-home {
    max-height: 32px;
    margin-right: 0;
}

.slider .slides li .caption {
    color: #fff;
    position: absolute;
    top: initial !important;
    width: 70%;
    left: initial !important;
    opacity: 0;
}

    .slider .slides li .caption h5 {
        max-width: 60%;
    }

.slider .slides .right-align {
    right: 0 !important;
}

.slider .slides .left-align {
    left: 0 !important;
}

.slider .slides li .caption h3 {
    font-size: 2.2em;
}

.slider .slides li .caption h5 {
    font-size: 1em;
    line-height: 1.5em;
}

#nBlog,
#nDestaques,
#nNatacao,
#nTalentos,
#nUnisantaMidia,
#nOlimpiadas,
#nSantaPortal {
    font-size: 13px;
}

    #nBlog h3,
    #nDestaques h3,
    #nNatacao h3,
    #nTalentos h3,
    #nUnisantaMidia h3,
    #nSantaPortal h3,
    #nOlimpiadas h3 {
        color: #444;
        font-size: 15px;
        font-weight: 600;
        line-height: 1.5em;
        margin-top: 0;
    }

.news-home .sp-img {
    width: 100%;
    height: 225px;
    margin-bottom: 10px;
}

#nBlog a,
#nDestaques a,
#nNatacao a,
#nTalentos a,
#nUnisantaMidia a,
#nSantaPortal a,
#nOlimpiadas a {
    color: #444;
}

    #nBlog a:hover,
    #nDestaques a:hover,
    #nNatacao a:hover,
    #nTalentos a:hover,
    #nUnisantaMidia a:hover,
    #nSantaPortal a:hover,
    #nOlimpiadas a:hover {
        color: #bf0b28;
        text-decoration: none;
    }

.featured-home {
    font-size: 15px;
    line-height: 1.5em;
    padding: 30px 0 40px;
}

    .featured-home h1 {
        margin-bottom: 1em;
    }

    .featured-home a {
        color: #fff;
        text-decoration: underline;
    }

.lateral-menu {
    list-style-type: none !important;
    margin: 0 0 50px;
    padding: 0;
}

    .lateral-menu:after {
        content: '\A\A';
        white-space: pre;
    }

    .lateral-menu li {
        border-bottom: 1px solid #ddd;
        margin-bottom: 0;
        padding: 7px 0;
    }

        .lateral-menu li a {
            color: #494949;
            text-decoration: none;
        }

        .lateral-menu li:before {
            color: #0D47A1;
            content: '\00bb';
            margin: 0 .5em 0 0;
        }

.linkmap-section {
    background: #29569C;
    padding: 30px 0;
}

    .linkmap-section h3 {
        margin-bottom: 5px;
    }

    .linkmap-section ul li {
        margin-bottom: 0;
    }

        .linkmap-section ul li a {
            color: #fff !important;
            font-size: 12px;
            line-height: 1.62em;
        }

.name-course-home {
    font-size: 19px;
    font-weight: 600;
    margin: 5px 0 0;
}

    .name-course-home ~ p {
        margin: 5px 0 30px;
    }

.news-home {
    background: #fff;
    padding: 30px 0;
}

    .news-home h3 {
        height: 66px;
        overflow: hidden;
    }

    .news-home .item-noticia {
        width: 100%;
        height: 55px;
        margin: 10px 0 20px;
        display: block;
        overflow: hidden;
        position: relative;
        /*transition:0.1s ease-in all;*/
    }

.red-background {
    color: #fff;
    background: #900;
}

.slider .slides li .caption {
    bottom: 3%;
    top: 0;
}

.slides h3 {
    background: rgba(5, 92, 173, .95);
    color: #fff;
    display: inline-flex;
    font-size: 28px;
    margin-bottom: -10px;
    margin-top: 230px;
    padding: 15px;
}

    .slides h3:after {
        content: "\a";
        white-space: pre;
    }

.slides h5 {
    background: rgba(221, 221, 221, .95);
    color: #000 !important;
    display: inline-flex;
    line-height: 1.62em;
    max-width: 45%;
    padding: 15px;
}

.slider .indicators .indicator-item.active {
    background: #19468C;
}

.talents-description {
    font-size: 1.0em;
    line-height: 1.62em;
    margin-bottom: 1.62em;
}

    .talents-description ~ .card-panel {
        padding: 0 !important;
    }

.titulo-fundadores {
    margin-bottom: 5px;
    margin-top: 1.5em;
}

.video-home {
    position: relative;
}

.videos-home h1, .news-home h1 {
    margin-bottom: 10px !important;
}

.videos-home .card-videos {
    position: relative;
}

    .videos-home .card-videos .video-item {
        height: 200px;
        padding: 20px 0;
        transition: all 175ms cubic-bezier(0.19, 1, 0.22, 1);
    }

        .videos-home .card-videos .video-item a {
            text-decoration: none;
            font-weight: 600;
        }

        .videos-home .card-videos .video-item:hover {
            background: #e1e1e1;
        }

        .videos-home .card-videos .video-item img {
            border-radius: 2px;
        }

        .videos-home .card-videos .video-item .row {
            padding: 0 20px;
        }

.video-overlay {
    background: rgba(0, 0, 0, 0.1) url(/images/video-overlay.png);
    bottom: 5px;
    left: 0;
    top: 0;
    right: 0;
    position: absolute;
}

.video-text {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: 150px;
    text-align: center;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
}

    .video-text h2 {
        color: #fff;
        font-size: 5.5em;
        font-weight: 400;
        letter-spacing: -0.08em;
        margin: 0;
        text-transform: uppercase;
    }

        .video-text h2 span {
            color: #fff;
            font-weight: 700;
        }

    .video-text h3 {
        color: #fff;
        font-size: 1.4em;
        line-height: 0.8em;
    }

.videos-home {
    background: #e0e0e0;
    padding: 40px 0 20px !important;
}

.videos-home-description {
    line-height: 1.62em !important;
}

.videos .video-item h5 {
    line-height: 1.6em;
}

/**********/
/* CURSOS */
/**********/
.area-pos-7 {
    background-color: #9575CD;
}

.area-pos-8 {
    background-color: #80CBC4;
}

.area-pos-9 {
    background-color: #f57c00;
}

.area-pos-1, .area-pos-10 {
    background-color: #64b5f6;
}

.area-pos-ead {
    background-color: #bf360c;
}

.card-content-course {
    padding-bottom: 0 !important;
}

    .card-content-course h4 {
        margin-bottom: 0 !important;
        margin-left: -5px !important;
    }

.collapsible li {
    margin-bottom: 0;
}

.course-box h4, .course-box h5 {
    font-size: 18px;
}

.course-information {
    margin: 0 0 20px !important;
    padding-bottom: 60px;
}

    .course-information h2 {
        color: #fff;
        font-size: 48px !important;
        font-weight: 600;
        margin: 0 0 4rem;
    }

    .course-information h2 {
        font-size: 1.0em;
        font-weight: 300;
    }

.course-information-box {
    font-size: 2.15em;
    font-weight: 800;
}

    .course-information-box small {
        display: block;
        font-size: 13px;
    }

.course-information-description {
    font-size: 17px;
    font-weight: 300;
    margin-bottom: 20px;
    margin-top: 10px;
}

.course-grid {
    padding-bottom: 5px;
}

.course-pos {
    margin-bottom: 40px;
    padding: 0 !important;
}

    .course-pos .course-grid .row {
        margin: 0 !important;
    }

        .course-pos .course-grid .row:nth-child(2n) {
            background: #f1f1f1;
        }

        .course-pos .course-grid .row div {
            padding: 5px 20px 5px;
        }

        .course-pos .course-grid .row .col-md-8 {
            padding-left: 20px;
        }

.course-pos-area {
    color: #fff;
    font-size: 32px !important;
    padding: 1rem;
}

    .course-pos-area i {
        color: #fff;
        font-size: 24px;
        left: 5px;
        margin-right: 5px;
        position: relative;
        top: 2px;
    }

.course-pos-name {
    display: inline-block;
    padding-top: 5px;
}

.course-pos-name-inside {
    font-size: 36px !important;
    letter-spacing: -1px !important;
    max-width: 66%;
}

.courses a:hover {
    color: #900;
    text-decoration: none;
}

.courses h3 {
    color: #3F51B5;
    font-size: 26px;
    font-weight: 500;
    letter-spacing: -0.8px;
    margin: 30px 0 10px;
    text-transform: uppercase;
}

    .courses h3.first-title {
        margin-top: -30px;
    }

.courses span {
    line-height: 2em;
}

.courses #course-header {
    background-position: center !important;
    background-size: cover !important;
    height: 500px;
    position: relative;
}

.courses #course-header-pos {
    background-position: center !important;
    background-size: cover !important;
    height: 400px;
    position: relative;
}

.courses #course-header-overlay {
    bottom: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
}

.courses .course-area {
    font-size: 14px;
    padding: 5px;
    position: absolute;
    text-shadow: none !important;
    top: -25px;
}

.courses .course-name {
    color: #fff;
    font-weight: 700;
    margin: 350px 0 0;
    text-shadow: 2px 1px #000;
}

.course-name-pos {
    margin: 220px 0 0 !important;
}

.courses .course-name small {
    color: #fff;
    font-size: 0.6em;
}

.courses .course-name-complement {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    margin: 2px 0 0 5px;
    text-shadow: 1px 1px #000;
}

.courses .icon-text {
    font-size: 1em;
    margin-top: -4px;
    position: relative;
    top: 5px;
}

.courses .waves-effect:hover {
    background: rgba(25,70,140, 0.5) !important;
    color: #fff !important;
    text-decoration: none;
}

.destaque-course h4 {
    font-size: 36px;
    line-height: 1.4em;
}

.filter-cursos .chip {
    font-size: 12px;
    line-height: 12px !important;
    margin: 0 5px 15px 0 !important;
    padding: 5px;
}

.frase-destaque, .frase-destaque-pos {
    background-color: #19468C;
    color: #fff;
    margin: 40px 0 0;
    padding: 100px 0;
}

    .frase-destaque span {
        font-size: 2.5em;
        letter-spacing: -1px;
        line-height: 1.4em !important;
    }

    .frase-destaque-pos span {
        font-size: 2em;
        line-height: 1.4em !important;
    }

.informacao-turno {
    bottom: -40px;
    position: relative;
    text-align: left;
}

.status-pos {
    display: inline-block;
    color: #fff;
    font-size: 9px;
    margin-left: 10px;
    padding: 5px;
}

.status-pos-1 {
    background: #2E7D32;
}

.status-pos-2 {
    background: #EF6C00;
}

.status-pos-3 {
    background: #B71C1C;
}

.status-pos-4 {
    background: #01579b;
}

.subarea-pos {
    font-size: 1.9em;
    font-weight: 700;
}

    .subarea-pos ~ ul li {
        list-style-type: disc !important;
        margin-left: 20px !important;
    }

.mestrado-box {
    background: #3F51B5;
    color: #fff;
    font-size: 1.3em;
    /*margin: -300px 0 130px;*/
    padding: 30px;
    position: relative;
    z-index: 9999;
    /*min-height: 200px;*/
}

    .mestrado-box loading {
        width: 128px;
        height: 128px;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        margin: auto;
    }

    .mestrado-box .botao-inscricao-vestibular {
        background: transparent;
        border: 1px solid #fff;
        font-size: 15px;
        text-decoration: none !important;
    }

        .mestrado-box .botao-inscricao-vestibular:hover {
            background: none !important;
        }

.botao-inscricao-mestrado {
    background: transparent;
    font-size: 15px;
    text-decoration: none !important;
}

    .botao-inscricao-mestrado:hover {
        background: #C62828 !important;
    }


.mestrado-box * {
    color: rgba(255,255,255,1) !important;
}

.mestrado-box label {
    color: rgba(255,255,255,.8);
}

.mestrado-box .botao-inscricao-vestibular.disabled:hover {
    background-color: #DFDFDF !important;
    box-shadow: none;
    color: #9F9F9F !important;
    cursor: pointer;
}

.mestrado-box .title {
    font-size: 2.2em;
    font-weight: 700;
    margin: 0 0 .5em;
}

.mestrado-box .title-small {
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.6em;
    text-transform: uppercase;
}

.mestrado-box ul li {
    margin-bottom: 0.75em;
}

.vestibular-box {
    background: #3F51B5;
    color: #fff;
    font-size: 1.3em;
    margin: -300px 0 50px;
    padding: 30px;
    position: relative;
    z-index: 9999;
    min-height: 220px;
}

    .vestibular-box loading {
        width: 128px;
        height: 128px;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        margin: auto;
    }

    .vestibular-box .botao-inscricao-vestibular {
        background: transparent;
        border: 1px solid #fff;
        font-size: 15px;
        text-decoration: none !important;
    }

        .vestibular-box .botao-inscricao-vestibular:hover {
            background: none !important;
        }

    .vestibular-box * {
        color: rgba(255,255,255,1) !important;
    }

    .vestibular-box label {
        color: rgba(255,255,255,.8);
    }

    .vestibular-box .botao-inscricao-vestibular.disabled:hover {
        background-color: #DFDFDF !important;
        box-shadow: none;
        color: #9F9F9F !important;
        cursor: pointer;
    }

    .vestibular-box .title {
        font-size: 2.2em;
        font-weight: 700;
        margin: 0 0 .5em;
    }

    .vestibular-box .title-small {
        font-size: 1.2em;
        font-weight: 700;
        line-height: 1.6em;
        text-transform: uppercase;
    }

    .vestibular-box ul li {
        margin-bottom: 0.75em;
    }

conceito-guia-estudante {
    color: #FDD835;
    font-size: 36px !important;
    margin-top: 30px;
}

#courseVideos {
    padding: 40px 0;
}

/************/
/* 360 Tour */
/************/
.tour-360 {
    position: relative;
    background: #000;
}

    .tour-360 iframe {
        border: 0;
    }

    .tour-360 .tour-places {
        width: 20%;
        position: absolute;
        height: 99%;
        background: #000;
        top: 0;
        overflow: scroll;
        overflow-x: hidden;
        transition: all ease-in 0.2s;
        z-index: 1000;
    }

    .tour-360 .menu-active {
        left: 0;
    }

    .tour-360 .menu-off {
        left: -20%;
    }

.tour-360-fullscreen {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 100000000;
}

.body-no-scroll {
    overflow: hidden !important;
}

.tour-360-fullscreen iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.tour-360 button {
    background: none;
    border: none;
    color: #fff;
    font-size: 45px;
    position: absolute;
    top: 2%;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
    z-index: 1000;
}

    .tour-360 button.menu {
        top: 2%;
        left: 2%;
    }

    .tour-360 button.fullscreen {
        top: 2%;
        right: 2%;
    }

.tour-360 .tour-places .tour-place-item {
    cursor: pointer;
}

    .tour-360 .tour-places .tour-place-item h1 {
        font-size: 17px;
        text-transform: uppercase;
        color: #fff;
        text-shadow: 0 0 1px #000;
        background: rgba(0,0,0,0.8);
        margin: 2px 0;
        padding: 26px 10px;
        transition: all ease-in 0.1s;
    }

    .tour-360 .tour-places .tour-place-item:hover h1 {
        background: rgba(0,0,0,0.6);
    }

.tour-360 .tour-places::-webkit-scrollbar {
    width: 0.4em;
}

.tour-360 .tour-places::-webkit-scrollbar-thumb {
    background-color: darkgrey;
}


/**********/
/* HELPER */
/**********/
.helper-space {
    width: 100%;
    padding: 10px 0;
}

.no-border {
    border: 0 !important;
}

.padding-inside-10 {
    padding: 10px;
}

h1.default-section-title,
h1.default-section-title small,
h1.primary-section-title,
h1.primary-section-title small,
h1.white-section-title,
h1.white-section-title small {
    text-transform: uppercase;
    font-size: 42px;
    letter-spacing: -2.3px;
    margin: 20px 0;
    padding: 0;
    font-weight: 400;
}

    h1.default-section-title small,
    h1.primary-section-title small,
    h1.white-section-title small {
        font-weight: 700;
    }

    h1.default-section-title, h1.default-section-title small {
        color: #19468C;
    }

    h1.primary-section-title, h1.primary-section-title small {
        color: #525051;
    }

    h1.white-section-title, h1.white-section-title small {
        color: #fff;
        font-size: 52px;
        letter-spacing: -2px;
    }

.blue-background {
    background: #19468C;
    color: #fff;
    padding: 30px 0;
}

    .blue-background .fa {
        font-size: 32px;
        margin: 15px 10px;
    }

.embed-responsive-24by9 {
    padding-bottom: 37.5%;
}

.maps iframe {
    pointer-events: none;
}

.no-underline {
    text-decoration: none !important;
}

.filter-cursos {
    margin-bottom: 50px;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
    display: flex;
    flex-wrap: wrap;
    /*justify-content: center;
    align-content: center;*/
}

    .filter-cursos div.item {
        background: #eee;
        border-left: 4px solid #19468C;
        cursor: pointer;
        font-size: 13px;
        margin: 5px;
        opacity: 0.5;
        padding: 10px;
        text-transform: uppercase;
        text-align: center;
        transition: 0.1s all ease-in;
    }

        .filter-cursos div.item.active {
            background-color: #19468C;
            color: #fff;
            opacity: 1;
        }

        .filter-cursos div.item:hover {
            opacity: 1;
        }

.areas .item {
    border: 0;
    border-left: 5px solid #fff;
    display: block;
    height: 120px;
    padding: 20px;
    background: #f9f9f9;
    margin-bottom: 30px;
    transition: 0.1s all ease-in;
    overflow: hidden;
}

    .areas .item h4,
    .areas .item h5 {
        margin: 0;
    }

    .areas .item h5 {
        line-height: 1.3em;
        display: none;
    }

    .areas .item:hover h5 {
        display: block;
        color: #fff;
        font-size: 1.2em;
        font-weight: 700;
    }

    .areas .item:hover h4 {
        display: none;
    }

.item:hover {
    color: #fff;
}

.item-area-0 {
    border-color: #19468C !important;
}

    .item-area-descricao-0,
    .item-area-0.active,
    .item-area-0:hover {
        background: #19468C !important;
    }


.item-area-1 {
    border-color: #03A9F4 !important;
}

    .item-area-descricao-1,
    .item-area-1.active,
    .item-area-1:hover {
        background: #03A9F4 !important;
    }

.item-area-2 {
    border-color: #009688 !important;
}

    .item-area-descricao-2,
    .item-area-2.active,
    .item-area-2:hover {
        background: #009688 !important;
    }

.item-area-3 {
    border-color: #FF9800 !important;
}

    .item-area-descricao-3,
    .item-area-3.active,
    .item-area-3:hover {
        background: #FF9800 !important;
    }

.item-area-4 {
    border-color: #FF5722 !important;
}

    .item-area-descricao-4,
    .item-area-4.active,
    .item-area-4:hover {
        background: #FF5722 !important;
    }

.item-area-5 {
    border-color: #9C27B0 !important;
}

    .item-area-descricao-5,
    .item-area-5.active,
    .item-area-5:hover {
        background: #9C27B0 !important;
    }

.item-area-6 {
    border-color: #FF3D00 !important;
}

    .item-area-descricao-6,
    .item-area-6.active,
    .item-area-6:hover {
        background: #FF3D00 !important;
    }

.item-area-7 {
    border-color: #607D8B !important;
}

    .item-area-descricao-7,
    .item-area-7.active,
    .item-area-7:hover {
        background: #607D8B !important;
    }

.item-area-8 {
    border-color: #263238 !important;
}

    .item-area-descricao-8,
    .item-area-8.active,
    .item-area-8:hover {
        background: #263238 !important;
    }

.item-area-9 {
    border-color: #795548 !important;
}

    .item-area-descricao-9,
    .item-area-9.active,
    .item-area-9:hover {
        background: #795548 !important;
    }


/***********/
/* Loading */
/***********/
.loader {
    position: relative;
    margin: 0px auto;
    width: 100px;
}

    .loader:before {
        content: '';
        display: block;
        padding-top: 100%;
    }

.circular {
    -webkit-animation: rotate 2s linear infinite;
    animation: rotate 2s linear infinite;
    height: 100%;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.path {
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0;
    -webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
    animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
    stroke-linecap: round;
}

.section {
    margin: 0;
    padding: 80px 0;
}

.section-padding {
    padding: 40px 0;
}

/*.slick .slick-next .slick-arrow*/

.slick-slider .slick-arrow {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 32px;
    height: 32px;
    font-family: 'Material Icons';
    background: rgba(0,0,0,0.8);
    text-align: center;
    border-radius: 100%;
    color: #fff;
    border: 0;
    z-index: 1000;
}

.slick-slider .slick-next {
    right: 0;
}

.slick-slider .slick-prev {
    left: 0;
}

.slick-slider .slick-list {
    width: 90%;
    margin: 0 103px;
}

.slick-slider .slick-slide {
    transition: all ease 0.1s;
    /*padding: 10px;*/
}

.slick-slider .slick-center {
    background: #fafafa;
}

.tab-news {
    border-bottom: 1px solid #bf0b28;
}

    .tab-news .open-tab-link,
    .tab-news .tab a {
        color: #bf0b28 !important;
        display: block;
        width: 100%;
        height: 100%;
        text-overflow: ellipsis;
        overflow: hidden;
        transition: color .28s ease;
        cursor: pointer !important;
    }

    .tab-news .col {
        padding: 0;
    }

    .tab-news .tab a:hover {
        color: #900;
    }

    .tab-news .indicator {
        background-color: #bf0b28;
    }

@-webkit-keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes dash {
    0% {
        stroke-dasharray: 1,200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -124px;
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1,200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -124px;
    }
}

@-webkit-keyframes color {
    100%, 0% {
        stroke: #bf0b28;
    }

    40% {
        stroke: #19468C;
    }

    66% {
        stroke: #bf0b28;
    }

    80%, 90% {
        stroke: #19468C;
    }
}

@keyframes color {
    100%, 0% {
        stroke: #bf0b28;
    }

    40% {
        stroke: #19468C;
    }

    66% {
        stroke: #bf0b28;
    }

    80%, 90% {
        stroke: #19468C;
    }
}

/**************/
/* Calendario */
/**************/
.calendar {
    width: 100%;
    height: 400px;
    overflow: hidden;
    position: relative;
}

calendar .header {
    width: 100%;
    text-align: center;
}

calendar .week {
    width: calc(100% - 10px);
}

calendar .names .day {
    cursor: auto !important;
}

calendar .week .day {
    width: calc(100% / 7);
    text-align: center;
    display: block;
    float: left;
    padding: 20px 4px;
    font-weight: 600;
    color: #29569C;
    position: relative;
    transition: 0.1s ease-in all;
}

    calendar .week .day span {
        width: 30px;
        display: block;
        height: 30px;
        border-radius: 100%;
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
        margin-top: -4px;
        padding-top: 2px;
    }

    calendar .week .day:hover span {
        background: #e1e1e1;
    }

    calendar .week .day.different-month {
        color: #aaa;
    }

calendar .week .event {
    cursor: pointer;
}

    calendar .week .event span {
        border: 2px solid #bf0b28;
        background: none;
    }

    calendar .week .event:hover span {
        background: #bf0b28;
        color: #fff;
    }

calendar .week .today span {
    background: #19468C;
    color: #fff;
    margin-top: -4px;
    padding-top: 4px;
}

calendar .week .today:hover span {
    background: #29569C;
    color: #fff;
}

calendar event {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: -100%;
    background: #fff;
    width: 100% !important;
    height: 100% !important;
}

    calendar event .close-event {
        font-size: 32px;
        text-decoration: none;
        font-weight: 300;
        position: absolute;
        top: 0;
        right: 10px;
    }

calendar .event-open {
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 1000;
    display: block !important;
    text-align: left !important;
}

calendar event.active-ev {
    display: block;
    top: 0;
}

calendar .footer {
    width: 100%;
    padding: 28px 20px 0;
    display: block;
    font-weight: 600;
    color: #aaa;
    position: absolute;
    width: 100%;
    bottom: 18px;
}

calendar .tabs {
    margin-top: 10px;
}

calendar .tab a {
    color: #bf0b28 !important;
}

calendar #agenda {
    height: calc(100% - 54px);
    position: absolute;
    width: calc(100% + 6px);
    bottom: -16px;
    overflow-x: scroll;
    background: #fff;
}

    calendar #agenda::-webkit-scrollbar {
        width: 5px;
    }

    calendar #agenda::-webkit-scrollbar-track {
        border-radius: 10px;
    }

    calendar #agenda::-webkit-scrollbar-thumb {
        background: rgba(0,0,0,0.3);
    }

        calendar #agenda::-webkit-scrollbar-thumb:hover {
            background: rgba(0,0,0,.6);
        }


    calendar #agenda .collection,
    calendar event .collection {
        margin: 0;
        border-top: 0;
        border: 0;
    }

        calendar #agenda .collection .collection-item .circle,
        calendar event .collection-item .circle {
            padding-top: 10px;
            font-weight: 600;
        }

        calendar #agenda .collection .collection-item b,
        calendar event .collection .collection-item b {
            font-size: 20px;
            font-weight: 400;
            color: #333;
        }

        calendar #agenda .collection .collection-item span,
        calendar event .collection-item div {
            color: rgba(0,0,0,0.4);
        }

        calendar #agenda .collection .collection-item a,
        calendar event .collection .collection-item a {
            color: #333;
            text-decoration: none !important;
        }

        calendar #agenda .collection .collection-item:hover,
        calendar event .collection .collection-item:hover {
            background: rgba(0,0,0,0.1);
        }

select {
    border: 0 !important;
    border-bottom: 1px solid #9e9e9e !important;
    margin-bottom: 10px;
}

    select:active {
        border: 0 !important;
        border-bottom: 1px solid #9e9e9e !important;
    }

/*********/
/* INTRO */
/*********/
.introjs-showElement i {
    color: #19468C;
}

.introjs-overlay {
    position: absolute;
    z-index: 999999;
    background-color: #000;
    opacity: 0;
    background: -moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);
    background: -webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.4)),color-stop(100%,rgba(0,0,0,0.9)));
    background: -webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);
    background: -o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);
    background: -ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);
    background: radial-gradient(center,ellipse cover,rgba(0,0,0,0.4) 0,rgba(0,0,0,0.9) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66000000',endColorstr='#e6000000',GradientType=1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.introjs-fixParent {
    z-index: auto !important;
    opacity: 1.0 !important;
    position: inherit !important;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important;
    transform: none !important;
}

.introjs-showElement,
tr.introjs-showElement > td,
tr.introjs-showElement > th {
    z-index: 9999999 !important;
}

.introjs-disableInteraction {
    z-index: 99999999 !important;
    position: absolute;
}

.introjs-relativePosition,
tr.introjs-showElement > td,
tr.introjs-showElement > th {
    position: relative;
}

.introjs-helperLayer {
    position: absolute;
    z-index: 9999998;
    background-color: #fff;
    border: 1px solid #1e88e5;
    border-radius: 0px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.introjs-tooltipReferenceLayer {
    position: absolute;
    visibility: hidden;
    z-index: 10000000;
    background-color: transparent;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.introjs-helperLayer *,
.introjs-helperLayer *:before,
.introjs-helperLayer *:after {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -ms-box-sizing: content-box;
    -o-box-sizing: content-box;
    box-sizing: content-box;
}

.introjs-helperNumberLayer {
    display: none;
    position: absolute;
    visibility: visible;
    top: -16px;
    left: -16px;
    z-index: 9999999999 !important;
    padding: 2px;
    font-family: Arial, verdana, tahoma;
    font-size: 13px;
    font-weight: bold;
    color: white;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0,0,0,.3);
    background: #ff3019; /* Old browsers */
    background: -webkit-linear-gradient(top, #ff3019 0%, #cf0404 100%); /* Chrome10+,Safari5.1+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff3019), color-stop(100%, #cf0404)); /* Chrome,Safari4+ */
    background: -moz-linear-gradient(top, #ff3019 0%, #cf0404 100%); /* FF3.6+ */
    background: -ms-linear-gradient(top, #ff3019 0%, #cf0404 100%); /* IE10+ */
    background: -o-linear-gradient(top, #ff3019 0%, #cf0404 100%); /* Opera 11.10+ */
    background: linear-gradient(to bottom, #ff3019 0%, #cf0404 100%); /* W3C */
    width: 25px;
    height: 26px;
    line-height: 20px;
    border: 3px solid white;
    border-radius: 50%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3019', endColorstr='#cf0404', GradientType=0); /* IE6-9 */
    filter: progid:DXImageTransform.Microsoft.Shadow(direction=135, strength=2, color=ff0000); /* IE10 text shadows */
    box-shadow: 0 2px 5px rgba(0,0,0,.4);
}

.introjs-arrow {
    border: 10px solid #1e88e5;
    content: '';
    position: absolute;
}

    .introjs-arrow.top {
        top: -20px;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: #1e88e5;
        border-left-color: transparent;
    }

    .introjs-arrow.top-right {
        top: -20px;
        right: 20px;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: #1e88e5;
        border-left-color: transparent;
    }

    .introjs-arrow.top-middle {
        top: -20px;
        left: 50%;
        margin-left: -1px;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: #1e88e5;
        border-left-color: transparent;
    }

    .introjs-arrow.right {
        right: -20px;
        top: 20px;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: #1e88e5;
    }

    .introjs-arrow.right-bottom {
        bottom: 20px;
        right: -20px;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: #1e88e5;
    }

    .introjs-arrow.bottom {
        bottom: -20px;
        border-top-color: #1e88e5;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    }

    .introjs-arrow.left {
        left: -20px;
        top: 20px;
        border-top-color: transparent;
        border-right-color: #1e88e5;
        border-bottom-color: transparent;
        border-left-color: transparent;
    }

    .introjs-arrow.left-bottom {
        left: -20px;
        bottom: 20px;
        border-top-color: transparent;
        border-right-color: #1e88e5;
        border-bottom-color: transparent;
        border-left-color: transparent;
    }

.introjs-tooltip {
    position: absolute;
    visibility: visible;
    background-color: #1e88e5;
    color: #fff;
    min-width: 300px;
    max-width: 300px;
    box-shadow: 0 1px 10px rgba(0,0,0,.4);
    -webkit-transition: opacity 0.1s ease-out;
    -moz-transition: opacity 0.1s ease-out;
    -ms-transition: opacity 0.1s ease-out;
    -o-transition: opacity 0.1s ease-out;
    transition: opacity 0.1s ease-out;
}

    .introjs-tooltip .introjs-tooltiptext {
        padding: 10px;
        font-size: 22px;
        font-weight: 300;
    }

.introjs-tooltipbuttons {
    text-align: right;
    white-space: nowrap;
    padding: 10px;
    border-top: 1px solid rgba(255,255,255,0.5);
}

/*
 Buttons style by http://nicolasgallagher.com/lab/css3-github-buttons/
 Changed by Afshin Mehrabani
*/
.introjs-button {
    padding: 0 10px !important;
}

    /* overrides extra padding on button elements in Firefox */
    .introjs-button::-moz-focus-inner {
        padding: 0;
        border: 0;
    }

.introjs-skipbutton {
    position: absolute;
    top: 5px;
    right: -3px;
}

    .introjs-skipbutton i {
        font-size: 14px;
    }

.introjs-prevbutton {
    float: left;
}

.introjs-disabled, .introjs-disabled:hover, .introjs-disabled:focus {
    color: #9a9a9a;
    border-color: #d4d4d4;
    box-shadow: none;
    cursor: default;
    background-color: #f4f4f4;
    background-image: none;
    text-decoration: none;
}

.introjs-bullets {
    text-align: center;
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
}

    .introjs-bullets ul {
        clear: both;
        margin: 15px auto 0;
        padding: 0;
        display: inline-block;
    }

        .introjs-bullets ul li {
            list-style: none;
            float: left;
            margin: 0 2px;
        }

            .introjs-bullets ul li a {
                display: block;
                width: 6px;
                height: 6px;
                background: #fff !important;
                opacity: 0.5;
                border-radius: 10px;
                -moz-border-radius: 10px;
                -webkit-border-radius: 10px;
                text-decoration: none;
                transition: 0.1s ease-in all;
            }

                .introjs-bullets ul li a:hover {
                    opacity: 1;
                }

                .introjs-bullets ul li a.active {
                    opacity: 1;
                    width: 8px;
                    height: 8px;
                    margin-top: -1px;
                }

.introjs-progress {
    overflow: hidden;
    height: 10px;
    margin: 10px 0 5px 0;
    border-radius: 4px;
    background-color: #ecf0f1;
}

.introjs-progressbar {
    float: left;
    width: 0%;
    height: 100%;
    font-size: 10px;
    line-height: 10px;
    text-align: center;
    background-color: #08c;
}

.introjsFloatingElement {
    position: absolute;
    height: 0;
    width: 0;
    left: 50%;
    top: 50%;
}

.item-talent .card-panel {
    background:#eee !important;
    margin: 0 !important;
}

#pop {
    width: 100%;
    padding: 16px;
    text-transform: uppercase;
    position: fixed;
    top: 64px;
}

    #pop span {
        font-size: 22px;
        font-weight: 300;
    }

    #pop button {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
    }

/******************/
@media (max-width: 764px) {
    .header .container .brand {
        margin: 15px auto;
        display: block;
    }

    .tour-360 .tour-places {
        width: 80%;
    }

    .tour-360 .menu-active {
        left: 0;
    }

    .tour-360 .menu-off {
        left: -80%;
    }

    #pop {
        width: 100%;
        padding: 16px;
        text-transform: uppercase;
        position: fixed;
        top: 52px !important;
    }

        #pop .container {
            width: 100%;
        }

        #pop span {
            font-size: 16px;
            font-weight: 300;
            padding-bottom: 10px;
            display: block;
        }

        #pop button {
            position: absolute;
            top: 10px;
            right: -15px;
            bottom: inherit;
            margin: 0;
        }

        #pop .right {
            float: none !important;
        }

        #pop a {
            display: block;
            float: none !important;
        }
}

@media (max-width: 992px) {
    h1.default-section-title,
    h1.default-section-title small,
    h1.primary-section-title,
    h1.primary-section-title small,
    h1.white-section-title,
    h1.white-section-title small {
        font-size: 32px;
        margin: 0 0 10px !important;
    }

    h2 {
        font-size: 24px;
        margin: 0 0 20px;
    }

    p {
        font-size: 12px !important;
    }

    #nDestaques img, #nNatacao img, #nTalentos img, #nUnisantaMidia img {
        min-width: unset;
        width: 100%;
    }

    .acesso-rapido h2 {
        margin: 20px 0 !important;
    }

    .course-pos-area {
        font-size: 19px !important;
    }

    .courses #course-header, .courses #course-header-pos {
        height: 300px;
    }

    .courses .course-name, .courses .course-name-pos {
        margin: 100px 0 0 !important;
    }

    .courses .course-pos-name-inside {
        display: inline-block;
        font-size: 26px !important;
        margin-top: 20px !important;
        max-width: 95% !important;
        position: absolute;
        top: 20px;
    }

    .course-home img {
        margin-top: 20px;
    }

    .name-course-home ~ p {
        margin-bottom: 0 !important;
    }

    .name-course-home h6 {
        font-size: 16px;
    }

    .news-home .item-noticia {
        height: auto !important;
    }

    .logo-abmes {
        width: auto;
    }

    .navbar-default .navbar-nav {
        font-size: 13px;
    }

    .subarea-pos {
        font-size: 20px;
    }

    .talents-home .row .media {
        padding: 0px;
        margin: 0;
    }

    .talents-home .row div.item-talent:nth-child(2n+1) {
        background: #f9f9f9;
    }

    .vestibular-box {
        margin: 30px auto;
    }
}

.course-home {
    margin-top: -35px;
    padding: 0 0 10px;
}


.talents-home {
    padding: 30px 0 0;
}

@media (max-width: 1100px) {
    .slider .slides li .caption h3 {
        font-size: 1.6em;
    }

    .slider .slides li .caption h5 {
        font-size: 0.85em;
    }
}

@media (max-width: 1350px) {
    .vestibular-box .title {
        font-size: 2em;
    }

    .vestibular-box .botao-inscricao-vestibular {
        font-size: 15px;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .container {
        width: 90%;
        min-width: 90%;
    }
}

.card-vencido {
    border-left: 4px solid #bf0b28;
}

.card-normal {
    border-left: 4px solid #2E7D32;
}


#listaDocentes .collection .collection-item {
}

#listaDissertacoes .collapsible-header {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#listaDocentes {
    margin-top: 1.5rem !important;
}

#listaDissertacoes .collapsible-header.active {
    background: #f5f5f5;
    border-left: 4px solid green !important;
    font-weight: 700;
}

#listaDissertacoes a, #listaDissertacoes span {
    font-size: 13px;
}

#listaDissertacoes * {
    text-align: justify;
}

#listaDissertacoes a {
    margin-top: 10px;
}

#listaDissertacoes i {
    font-size: 18px;
}

#listaDissertacoes p {
    line-height: 1.62em;
}

    #listaDissertacoes p span {
        margin-top: .5em;
    }

.detalhes-dissertacao {
    line-height: 2em;
}

/* EDITAL - OLIMPIADAS */
.edital-olimpiadas .news {
    margin: -10px;
}

    .edital-olimpiadas .news .news-item {
        display: block;
        float: left;
        border-radius: 2px;
        position: relative;
        margin: 10px;
        transition: 0.2s ease-in all;
    }

        .edital-olimpiadas .news .news-item * {
            transition: 0.2s ease-in all;
        }

        .edital-olimpiadas .news .news-item .thumb {
            position: relative;
            width: 100%;
            overflow: hidden;
            border-radius: 2px;
        }

            .edital-olimpiadas .news .news-item .thumb img {
                width: 100%;
                height: 100%;
                display: block;
                border-radius: 2px;
            }

            .edital-olimpiadas .news .news-item .thumb::after {
                position: absolute;
                content: " ";
                width: 100%;
                height: 100%;
                z-index: 100;
                background: rgba(0,0,0,1);
                background: -moz-linear-gradient(45deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 100%);
                background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(0,0,0,0.3)), color-stop(100%, rgba(0,0,0,0.1)));
                background: -webkit-linear-gradient(45deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 100%);
                background: -o-linear-gradient(45deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 100%);
                background: -ms-linear-gradient(45deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 100%);
                background: linear-gradient(45deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 100%);
                margin: auto;
                top: 0;
                transition: 0.2s ease-in all;
            }

        .edital-olimpiadas .news .news-item .title {
            width: 100%;
            position: absolute;
            bottom: 0;
            font-size: 15px;
            line-height: 1.2em;
            color: #fff;
            z-index: 1000;
            padding: 15px;
        }

        .edital-olimpiadas .news .news-item:nth-child(1),
        .edital-olimpiadas .news .news-item:nth-child(2) {
            width: calc(50% - 20px);
            height: 362px;
        }

            .edital-olimpiadas .news .news-item:nth-child(1) .title,
            .edital-olimpiadas .news .news-item:nth-child(2) .title {
                font-size: 20px;
                font-weight: 700;
            }

            .edital-olimpiadas .news .news-item:nth-child(1) .thumb,
            .edital-olimpiadas .news .news-item:nth-child(2) .thumb {
                height: 362px;
            }

        /*.edital-olimpiadas .news .news-item:nth-child(2),
.edital-olimpiadas .news .news-item:nth-child(3) {
    width:calc(50% - 20px);
    height:200px;
}

.edital-olimpiadas .news .news-item:nth-child(2) .thumb,
.edital-olimpiadas .news .news-item:nth-child(3) .thumb {
    height:200px;
}*/

        /*.edital-olimpiadas .news .news-item:nth-child(2) .thumb img,
.edital-olimpiadas .news .news-item:nth-child(3) .thumb img,*/
        .edital-olimpiadas .news .news-item:nth-child(n + 3) .thumb img {
            width: 100%;
            height: auto;
            margin: auto;
        }

        .edital-olimpiadas .news .news-item:nth-child(n + 3) {
            width: calc(33.33333333333333% - 20px);
        }

            .edital-olimpiadas .news .news-item:nth-child(n + 3) .thumb {
                height: 200px;
            }

        .edital-olimpiadas .news .news-item:hover .thumb::after {
            background: -moz-linear-gradient(45deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%);
            background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(0,0,0,0.7)), color-stop(100%, rgba(0,0,0,0.3)));
            background: -webkit-linear-gradient(45deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%);
            background: -o-linear-gradient(45deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%);
            background: -ms-linear-gradient(45deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%);
            background: linear-gradient(45deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%);
        }

.atletas {
    display: inline-block;
    text-align: center;
    width: 25%;
}

    .atletas .atleta {
        border-radius: 100%;
        display: inline-block;
        margin: 16px;
        overflow: hidden;
    }

    .atletas h5 {
        margin: -10px 0 3px !important;
    }

    .atletas .atleta img {
        display: block;
        width: 100%;
    }

    .atletas .social {
        margin-top: 8px;
    }

/***********************/
.card-dissertacoes .collapsible {
    margin: 0;
    box-shadow: none;
    border: 0;
}

    .card-dissertacoes .collapsible .collapsible-header span {
        line-height: 3rem;
    }

.card-dissertacoes input {
    width: calc(100% - 20px);
    padding: 10px 10px 0;
}

.matriz-curricular .card .card-content {
    margin-top: 15px;
}

.matriz-curricular-graduacao .card .card-content {
    margin-top: 0;
}

.courses-mestrado .tabs {
    background: #3F51B5;
}

    .courses-mestrado .tabs .tab a {
        color: #eee !important;
    }

        .courses-mestrado .tabs .tab a:hover {
            color: #fff !important;
        }

    .courses-mestrado .tabs .indicator {
        background-color: yellow;
    }

.courses-mestrado .collection .collection-item {
    display: inline-table;
    width: 50%;
}

    .courses-mestrado .collection .collection-item.avatar .title {
        font-size: 18px;
    }

.courses-mestrado .collection-item .title {
    line-height: 1;
}

.courses-mestrado .collection .collection-item.avatar {
    padding-left: 90px;
}

    .courses-mestrado .collection .collection-item.avatar .circle {
        height: 64px;
        width: 64px;
    }


.docentes-mestrado .parent {
    width: 100%;
    float: left;
}

.docentes-mestrado .avatar img {
    max-width: 48px;
    border-radius: 50% !important;
}

.docentes-mestrado .card-profile {
    background-color: rgba(0,0,0,0.2);
    padding: 10px;
    height: 101px;
}

.docentes-mestrado .profile-name .first-name {
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.2em;
    padding-bottom: 10px;
}

.docentes-mestrado .last-name {
    font-size: 13px;
    color: #fff;
}

.docentes-mestrado .card-action {
    height: 62px;
}

.matriz-curricular .card .card-content .card-title {
    font-size: 28px;
    margin-bottom: -10px !important;
}

.cursos-ofertados-lembrar th {
    background: #333 !important;
    border-radius: 0;
    color: #fff;
    font-size: 1.4em;
}

.cursos-ofertados-lembrar .areas {
    font-size: 1.6em;
    max-width: 200px;
    padding: 10px;
}

.cursos-ofertados-lembrar .nome-curso {
    font-size: 1.15em;
    padding: 0 20px;
}

.subarea-pos-0 {
    margin-top: 0;
}

.tabs-cursos-pos {
}

#div-youtube,
#div-facebook {
    position: relative;
    padding-bottom: 86.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden !important;
}

#div-youtube {
    padding-bottom: 56.25%;
}

    #div-youtube iframe,
    #div-facebook iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

/*TABS*/
/* Style the tab */
div.tab {
    background-color: #f1f1f1;
    overflow: hidden;
}

    /* Style the buttons inside the tab */
    div.tab button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        transition: 0.3s;
    }

        /* Change background color of buttons on hover */
        div.tab button:hover {
            background-color: #ddd;
        }

        /* Create an active/current tablink class */
        div.tab button.active {
            border-bottom: 3px solid #64b5f6;
        }

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 0;
    border: none;
    border-top: none;
}

.first-letter:first-letter {
    text-transform: uppercase;
}

.agenda {
    background: #f3f3f3 !important;
    padding: 16px 0 32px;
    transition: all 175ms cubic-bezier(0.19, 1, 0.22, 1);
    overflow: hidden;
}

    .agenda .container {
        transition: all 175ms cubic-bezier(0.19, 1, 0.22, 1);
    }

.agenda-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    transition: all 175ms cubic-bezier(0.19, 1, 0.22, 1);
    position: relative;
}

.agenda .agenda-container.show-less {
    height: 0px;
    opacity: 0;
    z-index: -1;
}

.agenda .agenda-container.show-more {
    opacity: 1;
    z-index: 1;
    height: auto;
}

.agenda-container .agenda-item {
    flex: 1 1 auto;
    margin: 8px;
    width: calc(33% - 16px);
    text-decoration: none !important;
}

@media (max-width: 768px) {
    .agenda-container .agenda-item {
        flex: 1 1 auto;
        margin: 8px 0;
        width: 100%;
    }
}

@media (min-width: 768px) and (max-width: 1368px) {
    .agenda-container .agenda-item {
        flex: 1 1 auto;
        margin: 8px;
        width: calc(50% - 16px);
    }
}

.agenda-container .agenda-item .agenda-info {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 100%;
}

    .agenda-container .agenda-item .agenda-info .date {
        border-right: 1px solid #f1f1f1;
        text-align: center;
        text-transform: capitalize;
    }

        .agenda-container .agenda-item .agenda-info .date .day {
            font-size: 32px;
            font-weight: 100;
            color: #19468C;
        }

    .agenda-container .agenda-item .agenda-info .content {
        padding: 8px 16px;
        min-width: 220px;
    }

    .agenda-container .agenda-item .agenda-info .date .first-date,
    .agenda-container .agenda-item .agenda-info .date .second-date {
        padding: 16px 32px;
    }

    .agenda-container .agenda-item .agenda-info .date .second-date {
        background: #f1f1f1;
    }

.curso-pos h3 {
    font-size: 22px !important;
    font-weight: 500;
}

.titulo-forma-ingresso {
    color: #fff;
    display: block;
    font-size: 20px;
    font-weight: 700;
    padding: 10px;
    text-align: center
}

.botao-inscreva-se {
    font-size: 1.2em;
    font-weight: 700;
    padding: 10px;
}

.beneficios-texto a {
    color: blue;
    text-decoration: underline;
}

.beneficios-texto .botoes a {
    color: #fff;
    font-size: .9em;
    margin: 0 0 25px;
    text-decoration: none;
}

.beneficios-texto .botoes i {
    font-size: 6em;
    display: block;
    margin: 25px 0 10px;
}

.beneficios-texto .botoes {
    margin: 0 0 25px;
}

.vestibular-cursos .btn {
    border-radius: 0;
    font-weight: 500;
    line-height: 20px;
    padding: 20px 0;
}

.vestibular-cursos .card-action {
    font-weight: 700;
    text-align: center;
}

.link-pesquisa {
    color: inherit;
    text-decoration: none !important;
}

#curso-pos {
}

    #curso-pos .vestibular-box p {
        font-size: 15px;
        line-height: inherit;
    }

    #curso-pos .vestibular-box h4 {
        font-size: 28px !important;
        margin-bottom: -10px
    }

    #curso-pos .vestibular-box .botao-inscricao-vestibular {
        font-size: 13px;
        padding: 5px inherit !important
    }

    #curso-pos #course-header-pos {
        height: 250px;
    }

    #curso-pos .course-name-pos {
        margin-top: 100px !important
    }

    #curso-pos h3 {
        font-size: 20px !important;
        margin: 10px 0 0 !important
    }

    #curso-pos .collapsible-header {
        background: #0D47A1 !important;
        color: #fff;
        font-size: 16px !important;
        padding: 10px !important;
    }

.slider .indicators {
    position: absolute;
    z-index: 9999999;
    bottom: 50px;
}

.slider .indicators {
    position: absolute;
    z-index: 9999999;
    bottom: 50px;
}

    .slider .indicators .indicator-item {
        border: 1px solid #19468C;
        -webkit-box-shadow: 1px 1px 14px -1px rgba(0,0,0,0.75);
        -moz-box-shadow: 1px 1px 14px -1px rgba(0,0,0,0.75);
        box-shadow: 1px 1px 14px -1px rgba(0,0,0,0.75);
    }

#card-cursos .card h6 {
    color: rgba(0, 69, 168, 1);
    font-size: 26px;
    margin-bottom: 15px;
    text-align: center;
}

#card-cursos .card p {
    font-size: 1.15em;
    margin: 20px;
}

#card-cursos .row .col {
    padding: 0 5px !important;
}

#card-cursos img {
    margin: 0 -20px !important;
}

.box-cursos-home {
    background: #eee;
    border-top-right-radius: 50px;
    border-bottom-left-radius: 50px;
    padding: 23px 10px;
    text-align: center !important;
}

    .box-cursos-home a,
    .box-cursos-home a:hover,
    .box-background-cursos-home a,
    .box-background-cursos-home a:hover,
    .cursos-home a,
    .cursos-home a:hover {
        color: #0D47A1 !important;
        font-size: 19px;
        font-weight: 700;
        letter-spacing: -1.2px;
        line-height: 1.2em;
        text-transform: uppercase;
    }

.box-background-cursos-home {
    height: 240px;
}

.cursos-home a,
.cursos-home a:hover {
    font-size: 14px;
}

.cursos-home .destaque {
    font-size: 17px
}

.box-background-cursos-home-texto {
    background: #eee;
    border-bottom-left-radius: 25px;
    color: #0D47A1 !important;
    font-weight: 700;
    line-height: 1.25rem;
    margin: -5px 0 0;
    padding: 15px;
    text-align: right !important;
    text-transform: uppercase;
    ;
}

.box-background-cursos-ead-home-texto {
    background: #0D47A1 !important;
    border-bottom-left-radius: 25px;
    color: #eee;
    font-weight: 700;
    line-height: 1.25rem;
    margin: -5px 0 0;
    padding: 15px;
    text-align: right !important;
    text-transform: uppercase;
    ;
}

.box-curso-home-resumido {
    background: #eee;
    padding: 29px 15px;
    text-align: left !important;
}

.botao-curso-presencial-home {
    background: #eee;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
    display: block;
    font-size: 13px;
    height: 36px;
    letter-spacing: -0.9px;
    line-height: 1.2rem;
    margin-bottom: .45rem !important;
    padding: 3px 10px;
}

.botao-curso-ead-home {
    background: #0D47A1;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
    font-size: 13px;
    height: 45px;
    letter-spacing: -0.5px;
    line-height: 1.25rem;
    margin-bottom: .6rem !important;
    padding: 7px 10px;
}

.botao-curso-presencial-home a {
    font-size: 13px !important;
}

a.link-curso-ead-home,
a.link-curso-ead-home:hover,
a.link-curso-presencial-home,
a.link-curso-presencial-home:hover {
    color: #eee !important;
    font-size: 13px !important;
}

.curso-novo {
    color: red;
    font-style: italic;
    margin-left: 5px
}

.cursos-home img {
    width: 100% !important;
}

.cursos-home .col {
    border: 0px solid #fff;
    margin: 0 !important;
    padding: 0 !important;
}

.pagina-extensao * {
    line-height: 1.62em;
}

.pagina-extensao li,
.pagina-extensao p {
    font-size: 15px;
}

.pagina-extensao li {
    margin-bottom: 1em;
}

.menu-extensao {
    background: #0d48a1 !important;
}

    .menu-extensao ul {
        margin: 0 !important;
        padding: 0 !important;
    }

        .menu-extensao ul li a {
            font-size: 18px !important;
            padding: 17px 25px;
        }

            .menu-extensao ul li a:hover {
                background: rgba(0, 0, 0, 0.2);
            }

.lista-extensao h3 {
    background: #2196F3;
    color: #fff;
    margin: -5px 0 0;
    padding: 20px;
    text-transform: uppercase;
}

.lista-extensao .collapsible {
    margin-top: 0 !important;
}

.lista-extensao .collapsible-header {
    background: #f2f2f2;
    color: #555;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .2px;
}

    .lista-extensao .collapsible-header .active {
        background: red;
    }

.lista-extensao a {
    color: blue !important;
    text-decoration: underline !important;
}

.lista-extensao .collapsible-body {
    font-size: 13px !important;
    line-height: 1.62em;
}

.cursos-ead-mobile-titulo,
.cursos-presenciais-mobile-titulo {
    font-size: 1.5rem !important;
    letter-spacing: 0px
}

.cursos-presenciais-mobile,
.cursos-presenciais-mobile:active,
.cursos-presenciais-mobile:link,
.cursos-presenciais-mobile:hover,
.cursos-presenciais-mobile:visited {
    background: #EDEDED;
    color: #0048A3 !important;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5rem;
    margin-bottom: 1.2rem;
    padding: 15px;
}

.cursos-ead-mobile,
.cursos-ead-mobile:active,
.cursos-ead-mobile:link,
.cursos-ead-mobile:hover,
.cursos-ead-mobile:visited {
    background: #0048A3 !important;
    color: #EDEDED !important;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5rem;
    margin-bottom: 1.2rem;
    padding: 15px;
}

    a[name] {
        display: block;
        position: relative;
        top: -80px;
        visibility: hidden;
    }

#destaques-home .slick-list {
    margin: 0 !important;
    width: 100% !important;
}

/* HOME MOBILE */
#home-mobile .item-talent img {
    max-width: 95% !important;
}

#home-mobile .course-home {
    margin-top: 40px !important;
}

#home-mobile .cursos-home a,
#home-mobile #nBlog .btn,
#home-mobile #nDestaques .btn,
#home-mobile #nNatacao .btn,
#home-mobile #nTalentos .btn,
#home-mobile #nUnisantaMidia .btn,
#home-mobile #nSantaPortal .btn,
#home-mobile #nOlimpiadas .btn,
#home-mobile .talents-home .btn {
    background: #0D47A1;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 400;
    letter-spacing: 0 !important;
    line-height: 1.3em;
    padding: 10px !important;
}

#home-mobile .slider {
    height: inherit !important;
}

#home-mobile .news-type-description {
    font-size: 15px !important;
}

#home-mobile .featured-home {
    font-size: 13px;
}

#home-mobile .social img {
    width: 36px !important;
}

#home-mobile .talents-home .black-text {
    display: block;
    font-size: 14px;
    text-align: center !important;
}

    #home-mobile .talents-home .black-text strong {
        color: #444;
        font-size: 18px;
        line-height: 28px;
    }

#home-mobile .talents-home .card-panel {
    background: #f8f8f8 !important;
}

#home-mobile .talents-description {
    font-size: 13px !important;
}

#home-mobile #logo-mobile {
    margin-left: 0 !important;
}

.ingresso-vestibular-graduacao .col {
    margin-bottom: 2em;
}

.beneficios .collapsible-header {
    background: #0D47A1 !important;
    color: #FFF;
    font-size: 1.15em;
    line-height: 1.5em;
    padding: 10px;
}

    .beneficios .collapsible-header i {
        line-height: 1em;
        width: 1.25rem;
    }

.beneficios .collapsible-header {
    background: red;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.beneficios .collapsible-body {
    padding: 1em 2em;
}

.beneficios a {
    color: #00f !important;
    text-decoration: underline !important;
}

.beneficios h2 {
    margin: 4rem 0 0 !important;
}

.grupos-pesquisa .card-title {
    background: #b71c1c;
    color: #fff;
    display: block;
    font-size: 20px;
    padding: 10px 20px;
}

[type="checkbox"],
[type="checkbox"]:checked,
[type="checkbox"]:not(checked) {
    opacity: 1 !important;
    position: relative !important;
}

    [type="checkbox"] + span::before,
    [type="checkbox"] + span::after,
    [type="checkbox"]:checked + span::before,
    [type="checkbox"]:checked + span::after {
        display: none !important;
    }

    [type="checkbox"] + span:not(.lever) {
        padding-left: 10px !important;
    }

.reset-checkbox label .text-line-break {
    font-size: 13px !important;
    line-height: 1.5em !important;
}

.reset-checkbox hgroup h1,
.reset-checkbox hgroup h2 {
    text-align: left !important;
}

.fale-conosco input, select {
    margin-bottom: 2em !important;
}

#box-faq div {
    font-size: 15px;
}

#box-faq a {
    color: blue;
    text-decoration: underline;
}

#box-faq .collapsible-header {
    background: #1976d2;
    border: 0;
    border-bottom: 1px solid #b0daff;
    color: #fff;
    line-height: 1.5em;
    padding: 1rem 1rem;
}

    #box-faq .collapsible-header:before {
        content: "▼";
        font-size: 16px;
        font-weight: 700;
        margin-right: 10px;
    }

    #box-faq .collapsible-header.active:before {
        content: "▲";
        font-size: 16px;
        font-weight: 700;
        margin-right: 10px;
    }

#box-faq .collapsible-body {
    padding: 1rem 2rem;
}

.unisanta-cookie-mensagem {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    z-index: 999;
    border-radius: 0px;
    display: none;
}

.footer-privacidade {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
}

.bricks-form__field [type="checkbox"],
.bricks-form__field [type="checkbox"]:checked,
.bricks-form__field [type="checkbox"]:not(checked) {
    left: 0 !important;
    opacity: 1 !important;
    position: relative !important;
}

    .bricks-form__field [type="checkbox"] + span::before,
    .bricks-form__field [type="checkbox"] + span::after,
    .bricks-form__field [type="checkbox"]:checked + span::before,
    .bricks-form__field [type="checkbox"]:checked + span::after {
        display: none !important;
    }

    .bricks-form__field [type="checkbox"] + span:not(.lever) {
        padding-left: 10px !important;
    }

.exibir-mobile {
    display: none;
}

/* css das páginas e menu de (pesquisa comitê de ética humano) */
.pesquisas-conteudo .img20 {
    width: 20em;
}

.pesquisas-conteudo .img25 {
    width: 25em;
}

.pesquisas-conteudo .liTopo {
    padding-top: 10px;
}

.pesquisas-conteudo ol li ul {
    padding-left: 2.5em;
}

.pesquisas-conteudo ol li ul li {
    list-style-type: disc;
}

.pesquisas-conteudo ul li ul li {
    list-style-type: disc;
}

.pesquisas-conteudo a {
    position: relative;
    color: #29569C;
    outline: none;
    border: none;
    text-decoration: none;
}

.pesquisas-conteudo a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #29569C;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.pesquisas-conteudo a:hover:before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.menu-pesquisa ul li ul {
    display: none;
    position: absolute;
}

.menu-pesquisa ul li:hover ul {
    width: 110px;
    display: block;
    margin-top: -28px;
}

.menu-pesquisa ul li ul li {
    width: 18em;
    cursor: pointer;
}

.menu-pesquisa ul li ul li:hover > a {
    background-color: #0099FF;
    color: #FFFFFF;
}

.menu-pesquisa ul li ul li ul li {
    display: none;
}

.menu-pesquisa ul li ul li ul {
    top: 0;
}

.menu-pesquisa ul li ul li:hover ul li {
    display: block;
    width: 130px;
    left: 100%;
}

.menu-pesquisa .sub-menu ul li {
    margin-left: 14em;
    background-color: #FFFFFF;
}

.myIframe {
    position: relative;
    padding-bottom: 65.25%;
    padding-top: 30px;
    height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch; /*<<--- THIS IS THE KEY*/
    /*border: solid black 1px;*/
}

    .myIframe iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

#preview-frame {
    width: 100%;
    background-color: #fff;
}

@media (max-width: 1050px) {
    nav ul a {
        padding: 0 8px;
    }
}