/* Default CSS */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700,300,400,500);
@import url(jsforms.css);


html{
margin:0;
padding:0;
font-size:100%;
}

body{
margin:0;
padding:0;
width:100%;
background: #fff;
font-size:100%;
font: 14px 'Open Sans', sans-serif;

}


.logo{
float:left;
text-align:left;
width: 180px;
 }

#conteudo {
width: 95%;
max-width:1920px;
text-align:center;
margin:0 auto;
clear:both;
}

/* Preloader */
#preloader {
    position: fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#fff; /* change if the mask should have another color then white */
    z-index:999999; /* makes sure it stays on top */
}

#carregar {
    width:200px;
    height:200px;
    position:absolute;
    left:50%; /* centers the loading animation horizontally one the screen */
    top:50%; /* centers the loading animation vertically one the screen */
    background-image:url(https://sesieducacao.com.br/images/carregar.gif); /* path to your loading animation */
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px; /* is width and height divided by two */
}

 /* faixa usuario  */

 /*
	input:-moz-placeholder {
      color: green;
    }
 */

.faxiausera{ float:left; width:45%; display:table; line-height:95px; margin-left: 30px;}
.faxiaicons{ float:right; width:45%; display:table; line-height:95px; margin-right: 30px;}

    .fotoaluno{
        width:65px;
        height:65px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        overflow:hidden;
        display:inline-block;
        border:solid;
        border-color:#D9D9D9;
        border-width:2px;
        margin:15px;
    }

    .fotoaluno img{
        width:100%;
        height:auto;
    }
    .fotocabeza{ float:left; }
    .nomecabeza{ float:left; color:#fff; text-align:left; line-height:14px; padding-top: 35px;}

    .primericonfaixa{padding:0px 10px; float:right; }
    .adminiconfaixa {padding:14px 10px; float:right; }
    .demaisiconfaixa { padding:0px 10px; float:right; }


 /* faixa da logo e menu  */
.navimenu{
    text-align:center;
    margin:0 auto;
    width:95%;
    max-width:1960px;
    padding: 0px 30px;
    display:table;
}

.logomarca{ float:right; padding:20px 0px 15px; text-align:right; }
.logomenu{ float:left; padding:20px 0px 15px; text-align:left; min-width:300px;  }

.menuprin {
    float:left;
    text-align:left;
    /*min-width: 320px; */
}

 /* caixa da procura  */

.search {
    float: left;
    padding-top: 30px;
}


#search {
    position: relative;
    float: left;
    width: 56px;
    height: 56px;
    /* margin-left: -56px; */
}
#label {
    width: 56px;
    height: 56px;
    position: relative;
    z-index: 20;
}
#label label {
    display: block;
    width: 56px;
    height: 56px;
    background: url("../img/search.png") 0 0;
    font-size: 0;
    color: rgba(0, 0, 0, 0);
    text-indent: -9999px;
    cursor: pointer;
}
#label label:hover {
    background: url("../img/search.png") -56px 0
}
#label.active label {
    background: url("../img/search.png") -56px 0
}
#input {
    position: absolute;
    top: 0;
    left: 56px;
    width: 300px;
    height: 56px;
    z-index: 5;
    overflow: hidden;
}

input[placeholder] { color: #000000; }
::-moz-placeholder { color: #000000; } /* firefox 19+ */
input:-moz-placeholder { color: #000000; }

#input input {
    display: block;
    position: absolute;
    top: 0;
    left: -300px;
    width: 300px;
    height: 100%;
    margin: 0;
    padding: 27px 10px;
    border: solid;
    border-width: 1px;
    border-color: #C76D01;
    background-color: #fff;
    color: #000;
    font-size: 18px;
    -webkit-backface-visibility: none;
    -moz-backface-visibility: none;
    -ms-backface-visibility: none;
    backface-visibility: none;
    -webkit-border-radius: 2;
    -moz-border-radius: 2;
    border-radius: 2;
    -webkit-transition: left 0;
    -moz-transition: left 0;
    -ms-transition: left 0;
    -o-transition: left 0;
    transition: left 0;
}
#input input:focus {
    outline: none
}
#input.focus {
    z-index: 20
}
#input.focus input {
    left: 0;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;
}


/* icones nas paginas */
    .iconespaginas{
        padding: 10px 15px;
        width: 100%;
        max-width: 1260px;
        font-size: 11px;
        display: table;
        border-bottom: solid;
        border-bottom-color: lightgray;
        border-bottom-width: 1px;
        border-top: solid;
        border-top-color: lightgray;
        border-top-width: 1px;
    }

    .iconespaginas .caixaicones{
        float: left;
        text-align: left;
       /* padding: 0px 15px 0px 0px;*/
        width: 33%;
        display: table;
    }

    .iconespaginas .caixaicones .icones{
        float: left;
        text-align: left;
        /* padding: 0px 15px 0px 0px;
        width: 25%;
        max-width: 73px; */
    }

    .iconespaginas .caixaicones .caixas{
        float: left;
        text-align: left;
        max-width: 75%;
        padding-left: 15px;
        padding-right: 30px;
    }

    /* icones das paginas mais brasil  */
    .iconespaginas .caixabrasil{
        float: left;
        text-align: left;
        /* padding: 0px 15px 0px 0px;*/
        width: 25%;
        display: table;
    }

    .iconespaginas .caixabrasil .icones{
        float: left;
        text-align: left;
        /* padding: 0px 15px 0px 0px;
        width: 25%;
        max-width: 73px; */
    }

    .iconespaginas .caixabrasil .caixas{
        float: left;
        text-align: left;
        max-width: 75%;
        padding-left: 15px;
        padding-right: 30px;
    }


    /* icones projetos */

    .barraiconesprojetos{
        width:95%; max-width:1450px; margin: 0px auto; text-align: center; clear: both; display: table;
    }

    .iconesproje {
       width: 20%; padding: 25px; display: inline-block; text-align: center;
    }
    .textoproje{
        width: 100%;
        padding: 15px 0px;
        text-align: center;
        font-size: 18px;
        font-weight: 700;
        text-decoration: none;
        text-transform:uppercase;
        color: #878787;
    }

    .textoproje .a {
        text-decoration: none;
        text-transform:uppercase;
        color: #878787;
        border: none;
    }

    .botongeekie{
        background: #d2d2d2 url(../images/bannerprojetos/geekie2.png) no-repeat center center;
        position: relative;
        border: none;
        overflow: hidden;
        width: 75%;
        height:0;
        padding-bottom: 75%;
        -webkit-border-radius: 120px;
        -moz-border-radius: 120px;
        border-radius: 120px;
        -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
        box-shadow:3px 3px 5px rgba(0, 0, 0, 0.1);
        outline: none;
    }

    .botongeekie .a {
        border: none;
    }


    .botonser {
        background: #3764b7 url(../images/bannerprojetos/ser2.png) no-repeat center center;
        position: relative;
        border: none;
        overflow: hidden;
        width: 75%;
        height:0;
        padding-bottom: 75%;
        background-size: 125%;
        color: #fff;
        -webkit-border-radius: 120px;
        -moz-border-radius: 120px;
        border-radius: 120px;
        -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
        box-shadow:3px 3px 5px rgba(0, 0, 0, 0.1);
        outline: none;
    }

    .botonser .a {
        border: none;
    }

    .botonsge{
        background: url(../images/bannerprojetos/sge.jpg) no-repeat center center;
        position: relative;
        border: none;
        overflow: hidden;
        width: 75%;
        height:0;
        padding-bottom: 75%;
        background-size: 125%;
        -webkit-border-radius: 120px;
        -moz-border-radius: 120px;
        border-radius: 120px;
        -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
        box-shadow:3px 3px 5px rgba(0, 0, 0, 0.1);
        outline: none;
    }

    .botonsge .a {
        border: none;
    }


    /* calendarios */
    .calend{
        margin:0px auto;
        width: 100%;
        text-align:center;
        display:block;
    }

    .calendatas{
        margin:0px auto;
        width: 95%;
        text-align:center;
        display:block;
    }

    .titulodecalendarios {
        width: 100%;
        text-align:center;
        margin:20px auto 10px;
        text-align:center;
        font-family:'Open Sans', sans-serif;
        font-weight:300;
        font-size:28px;
        color:#878787;
    }

 /* rodape */

.rodape{
    width: 100%;
    padding: 30px;
    color: #ffffff !important;
    text-align: center !important;
}

 .conteudorodape{
     width: 100%;
     max-width: 980px;
     margin: 0 auto;
     text-align: center;
     display: table;
     color: #ffffff;

 }

 .caixalogo{
     float: left;
     max-width: 320px;
     padding: 2px;
     display: block;
}

 .caixaendereco{
     float: left;
     text-transform: uppercase;
     font-size: 11px;
     text-align: left;
     max-width: 320px;
     padding: 0px 15px 0px 15px;
     display: block;
 }

 .caixamenu{
    float: left;
    display: block;
    padding: 0px 30px 0px 30px;
    text-transform: uppercase;
    text-align: left;
    color: #ffffff;
 }

 .caixamenu a{
     color: #fff;
     text-decoration: none;
 }

 /* media screen para tables */
@media screen and (max-width: 768px) {

  .logomarca, .logomenu{ min-width:300px; padding:20px 0px;}

    .logo{
    max-width: 300px;
    min-height: 56px;
    }

    .titulodecalendarios {
        font-size:28px;
    }

    .search {
        padding-top: 20px;
    }


}

 /* media screen para mobile*/
@media screen and (max-width: 600px) {

     .faxiausera, .faxiaicons {
        float:none;
        width:100%;
        min-width:300px;
        text-align:center;
        line-height: 100%;
        margin-left: 0;
     }

    .fotocabeza, .nomecabeza{ float:none; text-align:center; line-height:100%;}
    .fotoaluno{ margin:5px;}
    .nomecabeza{padding-top: 0px;}
    .primericonfaixa {width: 16.6%; text-align:center; padding: 12px 10px 8px;}
    .demaisiconfaixa {width: 16.6%; text-align:center; padding: 10px;}

    .navimenu{
        padding: 0px;
    }

    .menuprin {
        float:none;
        text-align:center;
        /*min-width: 280px;*/
        margin: 0 auto;
    }

    .logomarca, .logomenu{float:none; width:100%; padding:20px 0px; text-align:center;}

    .logo {
        float: none;
        display: block;
        max-width: 200px;
        /*width:95%;*/
        /*min-height: 56px;*/
        text-align:center;
        margin:0 auto;
    }

    .iconespaginas {
        padding: 15px 15px 0px;
    }

    .search {
        float: left;
        padding-top: 0px;
    }

    #input {
        width: 254px;
    }
    #input input {
        /*left: -254px;*/
        width: 254px;
    }


    .iconespaginas .caixaicones{
        float: none;
        text-align: left;
        padding: 0px 15px 15px 0px;
        width: 95%;
        display: table;
    }

    /* icones projetos */
    .iconesproje {
        width: 50%;
        max-width: 100%;
        padding: 15px;
    }

    .textoproje {
        padding: 10px;
        font-size: 14px;
    }
    .titulodecalendarios {
        font-size:18px;
    }

    .calend{
        width:100%;
        float: none;
    }
    
    #loginform{
        float:none;
        margin:0px;
    }

    /* rodape */
    .caixalogo{
        width: 100%;
        max-width: 100%;
        float: none;
    }

    .caixaendereco{
        width: 100%;
        max-width: 100%;
        float: none;
        text-align: center;
    }

    .caixamenu{
        width: 100%;
        max-width: 100%;
        float: none;
        text-align: center;
        padding: 20px 30px 20px 30px;
    }
}


/* Novo Layout de páginas do portal */
.imgicon {
    width: 32px; height: 32px;
 }

 .tipo_conteudo {
     text-transform: uppercase; font-weight: 300; font-size: 20px; padding: 0px 0px 5px;
     text-align: center;
 }

 .div_externa{
     width: 100%; max-width: 1260px; text-align: center; margin: 0 auto;
 }

 .div_table_externa{
     display: table; margin:0 auto; width: 100%;
 }

 .titulo_conteudo{
     text-transform:uppercase; font-size: 24pt; padding: 15px; font-weight: bold;
 }

 .div_corpo_conteudo{
     display: table; margin: 0 auto; width: 100%; background-color: rgba(152, 152, 152, 0.12) !important; padding: 10px;
 }

 .div_icone_segmento{
     width: 100%; margin-bottom: 2px; padding-bottom: 2px; padding-top: 2px; display: table;
 }

 .div_segmento_conteudo{
     background: #0068b3; color: #ffffff;
     /*padding: 18px;*/
     padding: 10px;
     width: 40%;
     text-align: left;
     margin-bottom: 5px;
     /*border: #0068b3 solid 1px;*/
 }

 .font_label_icones{
     font-size: 12pt; padding: 0px;
 }

 .div_icone_componente{
     width: 100%; margin-bottom: 2px; padding-bottom: 2px; padding-top: 2px; display: table;
 }

 .div_objeto_estudo{
     width: 100%; margin-bottom: 2px; padding-bottom: 2px; padding-top: 2px; display: table;
 }

 .div_descricao_corpo{
     text-align:left; padding: 15px 11px; font-size: 14px; background-color: #0068b3; color: #ffffff; margin: 0 auto;
 }

 .div_orientacao_estudo{
     width: 100%; margin-bottom: 3px; padding-bottom: 2px; padding-top: 2px; display: table;
 }

 .div_descricao_conteudo{
     text-align:left; padding:15px; font-size: 16px; background-color: rgba(76, 172, 228, 0.41) !important; color: #006699;
 }

 .div_descricao_segmento {
     width: 60%;
     /*border: rgba(0,155,171,1) solid 1px;*/
     border: rgba(76, 172, 228, 0.41) 1px;
     padding: 16px; text-align: left; background: rgba(76, 172, 228, 0.41); color: #006699;
 }

 .div_conteudo{
     text-align:left; padding:15px; font-size: 16px; background-color: #ffffff !important;
 }

 .div_conteudo table{
    max-width: 1260px;
 }
 .div_tema_transversal{
     width: 100%; margin-bottom: 2px; padding-bottom: 2px; padding-top: 2px; display: table;
 }

 .div_anexos_conteudo{
     width: 100%; margin-bottom: 2px; padding-bottom: 2px; padding-top: 2px; display: table;
 }

 .div_complementos{
     width: 100%; margin-bottom: 2px; padding-bottom: 2px; padding-top: 2px; display: table;
 }

 @media screen and (max-width: 600px) {
     .div_descricao_segmento{
         width: 100%;
         float:left;
     }

     .div_segmento_conteudo{
         width: 100%;
         margin-bottom: 0px;
         float:left;
     }
 }