*{
box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;
padding:0;
margin:0;
border:0;
}
.accesshide, .sr-only{
display:none;
}

h6{
font-size: 1em;
font-weight: normal;
}

.alert{
color: #b22213;
text-align: center;
}

html,body{
font-family:Varela, sans-serif;
font-size:14px;

margin:0;
padding:0;
width:100%;
height:100%;
color:#333;

background-size: cover;
background-position: center center;
background-attachment: fixed;
}

h1{
font-size:2em;
color:#1b741c;
padding:0;
float:left;
}
h2{
font-size:1.2em;
color: #00055C;
}
h3{
font-size:1em;
color: #00055C;
}
h4{
font-size:1em;
color:#FFF;
margin:0.5em 0 0 0;
}
h5{
font-size:1em;
}

hr {
margin: 0.5em 0 0.5em 0;
}

a, a:link, a:visited{
color: #00055c;
text-decoration: none;
}
a:active, a:hover, a:focus{
color: #00055c;
text-decoration: underline;
}

article a{
color: #00055c;
}

ul, ol{
padding: 0 0 0 2em;
}

header{
float: left;
position: relative;
z-index:1000;
margin-left: 2em;
width: 15%;
}

header h1 img{
width:100%;
margin-top: 1em;
background-color:rgba(255,255,255,0.75);
box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.5);
}

section{
float: left;
margin-right: 2em;
width: 100%;
height: 75%;
}

#left {
float: left;
width: 50%;
}

#right {
float: left;
width:50%;
}

section article{
position: relative;
margin: 0.5em;
float:left;
padding: 1em;
background-color:rgba(255,255,255,0.75);
box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.5);
z-index: 1000;
}


.potentialidplist{
margin: 0.25em 0;
margin-bottom: 0.4em;
background-color: #b22213;
cursor: pointer;
padding: 0.5em;
font-size: 1em;
width: 71.5%;
}

.potentialidplist img{
display: none;
}

.potentialidplist a, .potentialidplist a:link, .potentialidplist a:visited{
color: white !important;
display: block;
text-decoration: none;
}


#loginid {
width: calc(36% - 1em);
margin-left: 2em;
}

#loginid h2{
width: 100%;
border-bottom: 0.05em solid #00055C;
margin-bottom: 0.5em;
padding-bottom: 0.5em;
}
#loginid form input{
display: block;
width: 100%;
padding: 0.25em;
margin: 0.2em 0;
color: #808080;
border: 0.15em solid #808080;
}
#loginid form a{
margin: 0.25em 0;
width: 50%;
}
#loginid #rememberusername {
width: initial;
}
#loginid form input.button{
float: right;
margin: 0.25em 0;
margin-bottom: 0.4em;
background-color: #233D7D;
color: #ffffff;
cursor: pointer;
padding: 0.5em;
font-size: 1em;
}

#loginid{
    text-align: left;
}

#loginid img{
    width:40%;
}


.col-md-4, .loginbox{
    text-align: left;
}


.loginpanel h2{
    display: none;
}


.loginpanel .desc{
    display: none;
}


.row .push-md-3 .m-t-1{
margin-top: 0.5em;
margin-bottom:0.5em;
}
.google::before{
    display: none !important;
}

.form-input input{
width: 100%;
padding: 0.25em;
margin: 0.2em 0;
color: #808080;
border: 0.15em solid #808080;
}

button, #loginbtn, .guestform input{
margin: 0.25em 0;
margin-bottom: 0.4em;
background-color: #233D7D;
color: #ffffff;
cursor: pointer;
padding: 0.5em;
font-size: 1em;
}

.potentialidp img{
width: unset !important;
}



#news, #msg {
clear: both;
float: right;
right: 2em;
width: calc(75% - 1em);
}

#news h2, #msg h2{
width: 100%;
border-bottom: 0.05em solid #00055C;
margin-bottom: 0.5em;
padding-bottom: 0.5em;
}

#msg {
overflow: auto;
}

#news {
overflow-y: hidden;
height: 280px ! important;
}

#news a {
background-color: #233D7D;
padding: 0.5em;
position: relative;
top: 1em;
text-decoration: none;
color: #FFF;
}

#msg p, #news p{
font-size: 14px;
}

#controls {
clear:both;
border-top: 0.05em solid #00055C;
}

#controls a{
float: left;
padding: 0.6em;
margin-top: 0.5em;
background-color:rgba(255,255,255,0.75);
box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.5);
text-align: center;
}
#controls a:nth-child(1){
width: calc(62% - 1em);
margin-right: 1.5em;
}
#controls a:nth-child(2){
width: calc(40% - 1em);
margin-right:0px;
}

#news .news{
margin:1em 0;
}
#news .news p{
margin:0 0 0.5em 0;;
}
#news .date{
font-size:0.75em;
}

footer {
position: fixed;
bottom: 0;
font-size: 12px;
width: 100%;
height: 15%;
background-color:rgba(255,255,255,0.75);
box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.5); 
color: #00055C;
margin: 0;
z-index: 1000;
}

footer #footer-left {
float: left;
padding: 1em 2%;
}

footer #footer-right {
float: right;
padding: 1em 10%;
}

footer #footer-center {
clear: both;
background-color:rgba(255,255,255,0.75);
padding-top: 0.3em;
margin-top: 0.3em;
padding-bottom: 2em;
text-align: center;
}

footer #footer-center .socialicon{
margin-right: -2em ! important;
}

footer #footer-center p{
margin-right: 20%;
}

footer p a, footer p a:link, footer p a:visited{
color: #00055C;
}
footer p a:hover, footer p a:active{
color: #00055C;
cursor: pointer;
}

footer img:first-of-type{
margin-left:2.5em;
}

footer .socialicon {
float:left;
margin-left: 0.3em;
}

#cursos{
display: none;
position: fixed;
background-color: rgba(0,0,0,0.25);
z-index: 10000;
height: 100%;
width: 100%;
top: 0;
bottom: 0;
left: 0;
right: 0;
padding: 5% 20%;
}
#cursos article{
padding: 1em 2em;
background-color: rgba(255,255,255,0.75);
box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.5);
height: 100%;
overflow-y: auto;
}

.background-image{
position:fixed;
z-index:0;
left:0;
top:0;
width:100%;
}

#background-image-1{

}
#background-image-2{

opacity:0;

animation:background-image-2 9s;
-webkit-animation:background-image-2 9s;
animation-iteration-count:infinite;
-webkit-animation-iteration-count:infinite;
}
@keyframes background-image-2{
0%{opacity:0;}
25%{opacity:0;}
40%{opacity:1;}
55%{opacity:1;}
70%{opacity:1;}
100%{opacity:0;}
}
@-webkit-keyframes background-image-2{
0%{opacity:0;}
25%{opacity:0;}
40%{opacity:1;}
55%{opacity:1;}
70%{opacity:1;}
100%{opacity:0;}
}

#background-image-3{

opacity:0;

animation:background-image-3 9s;
-webkit-animation:background-image-3 9s;
animation-iteration-count:infinite;
-webkit-animation-iteration-count:infinite;
}
@keyframes background-image-3{
0%{opacity:0;}
55%{opacity:0;}
70%{opacity:1;}
85%{opacity:1;}
100%{opacity:0;}
}
@-webkit-keyframes background-image-3{
0%{opacity:0;}
55%{opacity:0;}
70%{opacity:1;}
85%{opacity:1;}
100%{opacity:0;}
}
@media (max-width: 800px) {
html, body{
height: auto;
background-position: left center;
padding-bottom: 3em;
}
header, section, section article, section aside, #login, #news, #msg{
height: unset !important;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin-top:0;
margin: 0.5em;
float: left;
width: calc(100% - 1em);
clear: both;
overflow: auto;
max-height: none;
}

.background-image{
display: none;
}

#left, #right {
	float: none;
	width: 100%;
}

#loginid {
    width: 85%;
}

#controls a{
	display: none;
}

header h1 img{
width: 50%;
margin: 0 0 50% 0;
}

footer  {
display:none;
}

#cursos{
padding: 0.5em 1em;
height: 100%;
overflow: auto;
}
}