@charset "utf-8";

body {
	background: url(/imagens/main-bg.gif);
}

/* CABECALHO DO SITE */

	.header {
		position: relative;
		width: 100%;
		height: 106px;
		background-image: linear-gradient(#00529b 10%, #3b7cb4);
	}

	.logo {
		position: absolute;
		display: flex;
		align-items: center;
		height: 86px;
		left: 50%;
		top: 10px;
		margin-left: -450px;
		overflow: hidden;
	}

	.publicidade {
		position: absolute;
		top: 10px;
		left: 50%;
		margin-left: -150px;
	}

/* FIM CABECALHO DO SITE */

/* WRAPPER MENU */

	.wrapper-menu {
		display: flex;
		flex-direction: column;
		gap: 5px;
		width: 180px;
		float: left;
		position: sticky;
		top: 10px;
	}

	.wrapper-menu .btn-menu {
		display: flex;
		align-items: center;
		color: #00529b;
		background-color: #ffffff;
		border: 1px solid #b8d6fb;
		font-size: 13px;
		padding: 10px;
		border-radius: 5px;
		transition: all 0.1s ease;
	}

	.wrapper-menu .btn-menu:hover {
		background-color: #F1F5F9;
		border: 1px solid #007aff;
		transition: all 0.1s ease;
	}

	.wrapper-menu .btn-menu span {
		width: 22px;
		color:#b8d6fb;
	}

	.wrapper-menu .btn-pacote {
		display: flex;
		align-items: center;
		font-family: 'Oswald', sans-serif;
		background-color: #009c00;
		color: #fff;
		font-size: 17px;
		border-radius: 5px;
		margin-bottom: 5px;
		text-shadow: 1px 1px rgba(0,0,0,0.6);
		box-shadow: inset 1px 1px 0px 0px rgba(94, 197, 13, 0.7);
		border: solid 1px #009c00;
	}

	.wrapper-menu .btn-pacote span {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 20px;
		background-color: #0e7100;
		height: 35px;
		width: 35px;
		border-radius: 50%;
		margin: 7px;
		border: 2px solid #fff;
		box-shadow: 1px 1px rgba(0, 0, 0, 0.5);
	}

/* FIM WRAPPER MENU */

/* WRAPPER LOGIN */

	.wrapper-login {
		background-color: #fff;
		border: 1px solid #b8d6fb;
		padding: 10px;
		margin-bottom: 5px;
		line-height: 170%;
		border-radius: 5px;
	}

	.wrapper-login a {
		color: #000000;
	}

	.wrapper-login a:hover {
		text-decoration:underline;
	}

	.wrapper-login .wrapper-erro {
		display: flex;
		align-items: center;
		gap: 5px;
		color: #FF0000;
		background-color: #FFEAEA;
		border: 1px solid #ffc4c4;
		padding: 10px;
		margin-bottom: 10px;
		border-radius: 5px;
		line-height: normal;
	}
	
	.wrapper-login .wrapper-password {
		position: relative;	
		margin-bottom: 10px;
	}
	
	.wrapper-login .toggle-password {
		position: absolute;
		right: 0;
		top: 0;
		height: 30px;
		width: 30px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 14px;
		cursor: pointer;		
	}

	.wrapper-login input[name=email], .wrapper-login input[name=senha] {
		font-size: 13px;
		width:100%;
		height: 30px;				
		background: none;
		border: 1px solid #d8d8d8;
		border-radius: 5px;
	}
	
	.wrapper-login input[name=email] {
		padding: 5px;
		margin-bottom: 10px;
	}
	
	.wrapper-login input[name=senha] {
		padding: 5px 30px 5px 5px;
	}

	.wrapper-login input[name=email]:focus, .wrapper-login input[name=senha]:focus {
		border-color: #007aff;
		outline: 0;
	}

	.wrapper-login input[type=submit] {
		width: 100%;
		font-size: 17px;
		color: #fff;
		background-color: #4267b2;
		border: none;
		padding: 12px;
		cursor: pointer;
		border-radius: 5px;
		transition: background-color 0.2s ease;
		margin-bottom: 5px;
	}

	.wrapper-login input[type=submit]:hover {
		background-color: #365899;
		transition: background-color 0.2s ease;
	}

/* FIM WRAPPER LOGIN */

/* WRAPPER BOTÃO CADASTRAR */

	.wrapper-cadastro {
		background-color:#fff;
		border:1px solid #b8d6fb;
		color:#000000;
		padding:10px;
		text-align:center;
		border-radius:5px;
	}

	.wrapper-cadastro a {
		font-size:17px;
		padding: 12px;
		color:#ffffff;
		display: block;
		background-color:#009c00;
		margin-top:10px;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-webkit-transition: all 0.1s ease;
	}

	.wrapper-cadastro a:hover {
		text-decoration: underline;
	}

/* FIM WRAPPER BOTÃO CADASTRAR */

/* WRAPPER USUÁRIO */

	.wrapper-user {
		background-color: #ffffff;
		border:1px solid #b8d6fb;
		color: #00529b;
		line-height: 170%;
		padding: 10px 10px 5px 10px;
		text-align: center;
		border-radius: 5px 5px 0 0;
	}

	.wrapper-user .wrapper-avatar {
		position: relative;
		width: 125px;
		margin: 5px auto 10px auto;
	}

	.wrapper-user .wrapper-avatar img.avatar {
		width: 125px;
		height: 125px;
		cursor: pointer;
	}

	.wrapper-user .wrapper-avatar img.escola {
		position: absolute;
		bottom: 0;
		right: -10px;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		cursor: pointer;
		/* box-shadow: 2px 1px 1px rgba(0, 0, 0, 0.15); */
	}

	.wrapper-user a {
		color: #00529b;
	}

	.wrapper-user a:hover {
		text-decoration: underline;
	}

	.wrapper-user a.icon {
		font-size: 20px;
		margin: 0 5px 0 5px;
		transition: all 0.2s ease;
	}

	.wrapper-user a.icon:hover {
		color: #b8d6fb;
		transition: all 0.2s ease;
		text-decoration: none;
	}

/* FIM WRAPPER USUÁRIO */

/* WRAPPER MÍDIAS SOCIAIS */

	.wrapper-sociais {
		display: flex;
		flex-direction: column;
		gap: 10px;
		position: fixed;
		bottom: 70px;
		left: 15px;
	}

	.wrapper-sociais img {
		width: 35px;
		border-radius: 50%;
	}

/* FIM WRAPPER MÍDIAS SOCIAIS */

/* BOTÃO WHATSAPP */

	.btn-whatsapp {
		position: fixed;
		bottom: 70px;
		right: 15px;
	}

	.btn-whatsapp .icon-whatsapp {
		color: #fff;
		font-size: 40px;
		width: 60px;
		height: 60px;
		background-color: #4dc247;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
	}

	.btn-whatsapp .tooltip {
		color: #fff;
		font-size: 14px;
		width: 95px;
		height: 30px;
		background-color: #0e7100;
		display: none;
		align-items: center;
		justify-content: center;
		border-radius: 6px;
		position: absolute;
		top: 30px;
		right: 70px;
		margin-top: -15px;
	}

	.btn-whatsapp .tooltip::after {
		content: "";
		position: absolute;
		top: 50%;
		left: 100%;
		margin-top: -5px;
		border-width: 5px;
		border-style: solid;
		border-color: transparent transparent transparent #0e7100;
	}

	.btn-whatsapp:hover .tooltip {
	  display: flex;
	}

/*  FIM BOTÃO WHATSAPP */

/* BOTÃO SCROLLUP */

	.scrollup {
		position: fixed;
		bottom: 70px;
		left: 50%;
		margin-left: -450px;
		visibility: hidden;
		opacity: 0;
		transition: opacity .3s 0s, visibility 0s .3s;
	}

	.scrollup span {
		color: #fff;
		font-size: 25px;
		width: 50px;
		height: 50px;
		background-color: #000;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 5px;
	}

	.fade-in {
		visibility: visible;
		opacity: 0.4;
		transition: opacity .3s 0s, visibility 0s 0s;
	}

/* FIM BOTÃO SCROLLUP */

@media screen and (max-width: 1023px) {
	/*
	.main {
		padding-bottom: 110px;
	}

	.footer {
		height: 30px;
	}

	.btn-whatsapp, .scrollup {
		bottom: 40px;
	}
	*/
	.wrapper-sociais {
		display: none;
	}
}