body { margin: 0; font-size: 16px; font-family: 'Oswald', sans-serif; }
#container { width: 100%; background-color: #FFF; }
#content { width: 1080px; margin: 0 auto; background-color: #FFF; }
.strong { font-weight: 400; }
#mainxtra { background-color: #FFF; }
#videos { background-color: #FFF; }
h2 { font-size: 16px; }

/* HEADER */
.logo { float: left; }
.logo img { /*max-width: 35%;*/ }
.mainimage img { /*max-width: 50%;*/ float: right; }
.copy { float: left; margin-top: 25px; max-width: 500px; margin-left: 57px; }
.copy01 { color: #0089CF; font-size: 250%; font-weight: 400; max-width: 360px; min-width: 320px; margin: 0px; }
.copy02 { color: #09223F; font-size: 190%; font-weight: 300; }
.copy03 { color: #09223F; font-size: 120%; font-weight: 300; margin-top: 20px; }
.copy03 a { color: #333; font-weight: 300; text-decoration: none; }
.copy03 a:hover { text-decoration: underline; }
.copy04 { color: #09223F; font-size: 150%; font-weight: 400; }

/* MENU */
#menuToggle { display: block; position: relative; z-index: 1; -webkit-user-select: none; user-select: none; }
#menuToggle a { text-decoration: none; color: #09223F; transition: color 0.3s ease; } #menuToggle a:hover { color: #09223F99; }
#menuToggle .mcpbs a { color: #FF6319; } #menuToggle .mcpbs a:hover { color: #FF631999; }
#menuToggle .mdireito a { color: #D52B1E; } #menuToggle .mdireito a:hover { color: #D52B1E99; }
#menuToggle .mesb a { color: #F47422; } #menuToggle .mesb a:hover { color: #F4742299; }
#menuToggle .mics a { color: #F0AB00; } #menuToggle .mics a:hover { color: #F0AB0099; }
#menuToggle .mfep a { color: #003478; } #menuToggle .mfep a:hover { color: #00347899; }
#menuToggle .martes a { color: #0D776E; } #menuToggle .martes a:hover { color: #0D776E99; }
#menuToggle input { display: block; width: 40px; height: 32px; position: absolute; top: 60px; left: 95%; cursor: pointer; opacity: 0; z-index: 2; -webkit-touch-callout: none; }
#menuToggle span { display: block; width: 33px; height: 4px; margin-bottom: 5px; position: relative; top: 75px; left: 95%; background: #0089CF; border-radius: 3px; z-index: 1; transform-origin: 4px 0px; transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease; }
#menuToggle span:first-child { transform-origin: 0% 0%; }
#menuToggle span:nth-last-child(2) { transform-origin: 0% 100%; }
#menuToggle input:checked ~ span { opacity: 1; transform: rotate(45deg) translate(-2px, -1px); background: #0089CF; }
#menuToggle input:checked ~ span:nth-last-child(3) { opacity: 0; transform: rotate(0deg) scale(0.2, 0.2); }
#menuToggle input:checked ~ span:nth-last-child(2) { transform: rotate(-45deg) translate(0, -1px); }


#menu { position: absolute; width: 100%; margin-top: -30px; padding: 100px 0 0; height: calc(100vh - 95px); background: #E3E3E3; list-style-type: none; -webkit-font-smoothing: antialiased; }
#menu li { padding: 10px 0; font-size: 80%; text-align: center; border-bottom: 1px solid #CCC; }
#menuToggle input:checked ~ ul { transform: none; }
/*
#menuToggle { display: block; position: relative; top: 50px; left: 95%; z-index: 1; -webkit-user-select: none; user-select: none; }
#menuToggle a { text-decoration: none; color: #09223F; transition: color 0.3s ease; }
#menuToggle a:hover { color: #0089CF; }
#menuToggle input { display: block; width: 40px; height: 32px; position: absolute; top: -7px; left: -5px; cursor: pointer; opacity: 0; z-index: 2; -webkit-touch-callout: none; }
#menuToggle span { display: block; width: 33px; height: 4px; margin-bottom: 5px; position: relative; background: #0089CF; border-radius: 3px; z-index: 1; transform-origin: 4px 0px; transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease; }
#menuToggle span:first-child { transform-origin: 0% 0%; }
#menuToggle span:nth-last-child(2) { transform-origin: 0% 100%; }
#menuToggle input:checked ~ span { opacity: 1; transform: rotate(45deg) translate(-2px, -1px); background: #0089CF; }
#menuToggle input:checked ~ span:nth-last-child(3) { opacity: 0; transform: rotate(0deg) scale(0.2, 0.2); }
#menuToggle input:checked ~ span:nth-last-child(2) { transform: rotate(-45deg) translate(0, -1px); }
#menu { position: absolute; width: 315px; margin: -100px 0 0 -50px; padding: 50px; padding-top: 125px; background: #DDD; list-style-type: none; -webkit-font-smoothing: antialiased; transform-origin: 0% 0%; transform: translate(100%, 0); transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0); height: calc(100vh - 170px); }
#menu li { padding: 10px 0; font-size: 125%; }
#menuToggle input:checked ~ ul { transform: none; }
*/

/* MAIN */
#container\ main { background-color: #F2F2F2; }
#maintxt { width: 100%; background-color: #F2F2F2; padding: 20px; padding-top: 40px; }
#maintxt .info { color: #09223F; text-align: center; font-weight: 300; font-size: 115%; max-width: 950px; margin: 0 auto; }
#maintxt .info .darkblue { color: #09223F; font-size: 115%; text-transform: uppercase; }
#maintxt .info .darkblue2 { color: #09223F; font-size: 115%; text-transform: uppercase; margin: 20px 0; }
#maintxt .info .lightblue { color: #0089CF; font-weight: 400; font-size: 115%; margin: 20px 0; }
.mainuatxt.smaller { font-size: 80%; margin: 20px 0; }
#coursestxt { width: 100%; padding: 20px; text-align: center; font-weight: 300; font-size: 115%; max-width: 950px; margin: 0 auto; color: #09223F; font-size: 115%; text-transform: uppercase; }

/* COURSES */
#main .courses { margin-top: 40px; }
.cpbs { background-color: #FF6319; }
.direito { background-color: #D52B1E; }
.esb { background-color: #F47422; }
.ics { background-color: #F0AB00; }
.fep { background-color: #003478; }
.artes { background-color: #0D776E; }
.darkblue { color: #09223F; }
.gray { color: #333; }
.course { height: 200px; width: 32%; float: left; margin: 0.65%; display: flex; align-items: center; justify-content: center; background-image: url('../img/click.png'); background-repeat: no-repeat; background-position: right top; position: relative; }

.course:before { content: ""; position: absolute; top: 0; left: 0; border-width: 45px 45px 0 0; border-style: solid; border-color: #FFF #DDD; filter: drop-shadow(3px 3px 2px #0006); }
.course:hover { opacity: 0.8; }
.course .name { color: #FFF; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 125%; }
.course .name .smaller { color: #09223F; text-align: center; text-transform: uppercase; font-weight: 300; font-size: 85%; background-color: #EEE; padding: 1px 3px; }
.course .ua { color: #FFF; text-align: center; text-transform: uppercase; font-weight: 300; font-size: 90%; margin-top: 10px; }
.course .limite { background-color: #000; color: #FFF; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 100%; width: 250px; margin: auto; }

/* FORM */
.form { width: 61.50%; margin-left: 0.65%; margin-top: 40px;; margin-bottom: 0.65%; background-color: #0089CF; color: #FFF; font-size: 110%; font-weight: 300; padding: 20px; float: left; }
.inputtit { font-size: 75%; margin-top: 10px; }
input[type="text"], input[type="text"]:focus, input[type="email"], input[type="email"]:focus { border-radius: 7px; border: 1px solid #0089CF; width: 98%; height: 25px; padding-left: 10px; font-size: 75%; font-family: 'Oswald', sans-serif; margin: 10px 0; }
textarea { resize: none; border-radius: 7px; border: 1px solid #0089CF; width: 96.5%; height: 100px; font-size: 75%; font-family: 'Oswald', sans-serif; padding: 10px; margin-top: 10px; }
.form button { margin-top: 20px; font-size: 75%; text-transform: uppercase; background-color: #0A2240; border: none; border-radius: 5px; color: #FFF; -webkit-transition: all .25s; -moz-transition: all .25s; -ms-transition: all .25s; -o-transition: all .25s; transition: all .25s; cursor: pointer; padding: 10px; width: 100%; }
.form button:hover { background-color: #FFF; color: #0A2240; }
.form .text { margin-bottom: 20px; display: flex; }
.form .textsmaller { font-size: 90%; }
.ckbox { margin: 5px 0; }
.ckboxtit { font-size: 80%; }
.form.inner { width: 28.25%; }
.form.inner input[type="text"], .form.inner input[type="text"]:focus, .form.inner input[type="email"], .form.inner input[type="email"]:focus { width: 96%; }
.form.inner textarea { width: 93.5%; }
.form.inner .text { display: block; }
.space { width: 25%; margin-left: 1.25%; margin-top: 40px; float: left; }

/* THE */
.the { width: 32%; margin-left: 1.25%; float: left; }
.theimg { text-align: center; margin-top: 40px; }
.theimg img { width: 50%; }
.thetxt { font-size: 100%; margin-top: 15px; text-align: center; color: #333; max-width: 220px; margin-left: auto; margin-right: auto; }
.thetxt a { color: #333; text-decoration: none; }
.thetxt a:hover { color: #666; text-decoration: underline; }
.the.inner .theimg img { width: 60%; }
.the.inner .theimg { margin-top: 100px; }
.the.inner .thetxt { font-size: 120%; max-width: 270px; }

/* INSCREVE-TE */
.minscrevete { display: none; }
.inscrevete { width: 32%; margin-left: 1.25%; margin-top: 40px; float: left; }
.inscrevetetxt { color: #0089CF; font-size: 120%; text-transform: uppercase; margin-top: 62px; position: absolute; } /* was margin-top: 70px; */
/*.inscrevetetxt img { width: 40px; margin-left: 25px; } - com clickB.png */
.inscrevetetxt img { width: 125px; margin-left: 30px; } /* was width: 150px; margin-left: 5px; */
/*.inscreveteimg { text-align: center; }*/
.inscreveteimg { height: 650px; text-align: center; align-items: flex-end; display: flex; }
/*.inscreveteimg img { width: 88%; margin-top: -10px; } - com clickB.png */
/*.inscreveteimg img { width: 88%; }*/
.inscreveteimg img { width: 88%; margin-left: 50px; }
.inscrevete.inner .inscreveteimg img { width: 76%; } /* was 100% */
.inscrevete.inner .inscrevetetxt { font-size: 150%; margin-left: 0; }
.minscrevetetxt.noline a, .inscrevetetxt.noline a { text-decoration: none; color: #0089CF; }

/* VIDEOS */
.videos { /*margin-top: 40px;*/ margin-bottom: 40px; }
.video { float: left; width: 48%; margin: 0.65%; }
/*.video { margin: 5% auto; width: 48%; }*/
.video iframe { width: 100%; height: 290px; }
.copydestaque { color: #0089CF; font-size: 250%; font-weight: 400; max-width: 360px; min-width: 320px; margin: 50px auto; }
.video.destaque { float: none; position: relative; padding-bottom: 56.25%; width: 100%; height: 0; }
.video.destaque iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


/* FOOTER */
#container\ bottom { background-color: #F2F2F2; }
#footer { width: 100%; background-color: #F2F2F2; text-align: center; padding: 10px; color: #09223F; }
#footer a { text-decoration: none; color: #09223F; }
#footer a:hover { text-decoration: underline; }
.socials { margin: 40px 0; }
.social { display: contents; }
.social img { max-width: 40px; margin: 0 40px; }
.url { font-size: 175%; margin-bottom: 20px; }
.bigger { font-size: 110%; }
.ucpdmc { padding-bottom: 20px; }

/* CONTENT UAS */
#mainua { padding: 0 10px 20px 10px; }
.teammember { margin: 40px 0; }
.teammember .tmphoto img { width: 100px; height: 130px; object-fit: cover; float: left; }
.teammember .tminfo { float: left; margin-left: 10px; max-width: 75%; font-weight: 100; }
.teammember .tminfo .tminfoname { font-weight: 400; }

@media only screen and (max-width: 1080px) {
	body { background-color: #FFF; overflow-x: hidden; }
	#content { width: 100%; }
	#menuToggle span { top: 40px; left: 92%; }
	#menuToggle input { top: 25px; left: 89.5%; }
	#menu { font-size: 3vw; }
	.logo { max-width: 45%; padding-left: 10px; }
	.logo img { /*max-width: 60%;*/ }
	.mainimage img { max-width: 50%; padding-right: 10px; float: right; }
	.copy { clear: both; width: 100%; margin: 0 auto; padding: 20px 0; background-color: #DDD; text-align: center; max-width: 100%; }
	.copy01 { font-size: 4.5vw; max-width: none; }
	.copy02 { font-size: 3.5vw; }
	#maintxt { padding: 40px 0; }
	#maintxt .info { max-width: 85%; font-size: 2.5vw; }
	#main .courses { margin-top: 0; }
	.course { height: 30vw; width: 85%; float: none; margin: 2% auto; }
	.course .ua { font-size: 2vw; }
	.course .name { font-size: 3vw; }
	.form { width: 100%; float: none; margin-left: 0; margin-top: 0; margin-bottom: 0; padding: 30px 0; }
	input[type="text"], input[type="text"]:focus, input[type="email"], input[type="email"]:focus { width: 86vw; margin-left: 20px; }
	textarea { width: 84vw; margin-left: 20px; }
	.ckbox { margin: 5px 20px; }
	.form button { width: 92vw; margin-left: 20px; }
	.form .text {  margin-left: 20px; font-size: 3vw; display: block; }
	.form .textsmaller { font-size: 2.75vw; margin-left: 20px; }
	.form.inner { width: 100%; }
	.form.inner input[type="text"], .form.inner input[type="text"]:focus, .form.inner input[type="email"], .form.inner input[type="email"]:focus { width: 90vw; }
	.form.inner textarea { width: 88vw; }
	.the { width: 60%; margin: 0 auto; float: none; }
	.theimg img { width: 80%; }
	.the.inner .theimg { margin-top: 40px; }
	.minscrevete { display: block; text-align: center; }
	.minscrevetetxt { position: absolute; margin-top: 13vw; margin-left: 25vw; text-transform: uppercase; font-size: 2.5vw; }
	.minscrevetetxt img { max-width: 17vw; margin-left: 5vw; }
	.minscreveteimg img { max-width: 40vw; }
	.inscrevete { display: none; }
	.video { float: none; width: 100%; margin: 20px 0; position: relative; overflow: hidden; }
	.video::after { padding-top: 56.25%; display: block; content: ''; }
	.video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
	#footer { padding: 20px 0; }
	.social img {  margin: 0 3vw; }
	.url { font-size: 4vw; }
	.bigger { font-size: 2.2vw; }
	.address, .phone, .bottommenu, .ucpdmc { font-size: 2.2vw; }
	
	#mainua { margin-bottom: 50px; }
}

@media only screen and (max-width: 719px) {
	.logo { float: none; }
	.logo img { max-width: 150%; }
    .mainimage img { max-width: 50%; width: 40%; float: none; display: block; margin: auto; }
}

@media only screen and (max-width: 361px) {
	#menu li { font-size: 125%; }
	#menuToggle input { top: 17px; left: 87%; }
	#menuToggle span { top: 25px; left: 89%; }
	.logo { float: none; max-width: 25%; }
	.logo img { max-width: 100%; }
	.mainimage img { max-width: 60%; float: right;}
	.copy02 { font-size: 4vw; }
	#maintxt { padding: 20px 0; }
	#maintxt .info { font-size: 3vw; }
	#maintxt .info .lightblue { font-size: 3.5vw; }
	.teammember .tminfo { max-width: 60%; }
	.minscrevetetxt { font-size: 4vw; }
	.course .name { font-size: 4vw; }
	.course .ua { font-size: 3.5vw; }
	.form .text { font-size: 4vw; }
	.social img { max-width: 25px; margin: 0 3.5vw; }
	.form .textsmaller { font-size: 3.5vw; }
	.form.inner input[type="text"], .form.inner input[type="text"]:focus, .form.inner input[type="email"], .form.inner input[type="email"]:focus { width: 86vw; }
	.form.inner textarea { width: 84vw; }
	.ckboxtit { font-size: 3.5vw; }
	.form button { width: 90vw; }
	.ckbox { margin: 15px 20px; }
	.url { font-size: 6vw; }
	.bigger { font-size: 4vw; }
	.address, .phone, .bottommenu, .ucpdmc { font-size: 3vw; }
}