@charset "utf-8";
/*
Template Name: Escarine-Edu
Author: <a href="http://www.os-templates.com/">OS Templates</a>
Author URI: http://www.os-templates.com/
Licence: Free to use under our free template licence terms
Licence URI: http://www.os-templates.com/template-terms
File: Layout CSS
*/

@import url("fontawesome-4.4.0.min.css");
@import url("college-font.css");
@import url("framework.css");
/* Rows
--------------------------------------------------------------------------------------------------------------- */
.row0 {
	border: solid;
	border-width: 5px 0 0 0;
}
.row1 {
	border: solid;
	border-width: 1px 0 0 0;
}
.row1, .row1 a {
}
.row2, .row2 a {
}
.row3, .row3 a {
}
.row4, .row4 a {
}
.row5, .row5 a {
}
/* Top Bar
--------------------------------------------------------------------------------------------------------------- */
#topbar {
	padding: 5px 0;
	font-size: 12px;
}
#topbar .fl_left {
	margin-top: 4px;
}
#topbar .fl_left .inline > li i {
	margin: 0 5px 0 0;
	line-height: normal;
}
#topbar .faico li {
	margin: 0;
}
/* Header
--------------------------------------------------------------------------------------------------------------- */
#header {
	padding: 10px 0 10px 0;
}
#header #logo {
margin-top:;
}
#header #logo h1 {
	margin: 0;
	padding: 0;
	font-size: 22px;
	text-transform: uppercase;
}



.telefonetopo {
	color:#fff;
	font-size:0.9em;
	float:left;
	margin-left:7.5%;
	width:60%;
}

@media screen and (max-width:720px) {
.telefonetopo {
	text-align:center;
	width:100%;
	margin:0%;
}

}



.socialmediatopo {
	text-align:right;
	float:left;
	width:25%;
	margin-right:7.5%;
	margin:0%;
}

@media screen and (max-width:720px) {

.socialmediatopo {
	text-align:center;
	width:100%;
	margin:0%;
}
}
/* Sub Pages
--------------------------------------------------------------------------------------------------------------- */
#pagetitle {
	padding: 80px 0 0 0;
}
#pagetitle * {
	margin: 0;
	padding: 0;
}
/* Homepage Specific
--------------------------------------------------------------------------------------------------------------- */
#pageintro {
	padding: 160px 0 280px;
}
#pageintro article {
	display: block;
	max-width: 50%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
}/* Top padding also takes the container class into consideration */
#pageintro article * {
	margin: 0;
}
#pageintro article .heading {
	margin-bottom: 30px;
	font-size: 46px;
}
#pageintro article .underline::after {
	margin-top: 20px;
}
#pageintro article p {
	margin-bottom: 50px;
	font-size: 16px;
	line-height: 1.4;
}
#pageintro article footer {
	margin-bottom: 0;
}
#pageintro article footer .btn {
	margin-bottom: 0;
}
#introblocks {
	position: relative;
	margin: -120px auto 0;
	z-index: 1;
}
#introblocks ul {
	display: table;
	width: 100%;
	height: 100%;
}
#introblocks ul, #introblocks ul li {
	border: none;
}
#introblocks ul li {
	display: table-cell;
	position: relative;
	width: 25%;
	height: 100%;
	padding: 7% 2% 3%;
	text-align: center;
}
#introblocks ul li:last-child {
}
#introblocks ul li * {
	margin: 0;
	padding: 0;
}
#introblocks ul li article {
}
#introblocks ul li article i {
	border-radius: 50% 0;
	position: absolute;
	top: 0;
	left: 50%;
	width: 80px;
	height: 80px;
	line-height: 80px;
	margin: -40px 0 0 -40px;
	text-align: center;
}
#introblocks ul li article .fa {
	font-size: 38px;
}
#introblocks ul li article .clg {
	font-size: 42px;
}
#introblocks ul li article .heading {
	margin-bottom: 30px;
	font-size: 1.2rem;
}
/* Content Area
--------------------------------------------------------------------------------------------------------------- */
.container {
	padding: 80px 0;
}
/* Content */
.container .content {
}
#join {
	display: block;
	padding: 30px;
}
#join article p:last-of-type {
	margin-bottom: 30px;
}
/* Comments */
#comments ul {
	margin: 0 0 40px 0;
	padding: 0;
	list-style: none;
}
#comments li {
	margin: 0 0 10px 0;
	padding: 15px;
}
#comments .avatar {
	float: right;
	margin: 0 0 10px 10px;
	padding: 3px;
	border: 1px solid;
}
#comments address {
	font-weight: bold;
}
#comments time {
	font-size: smaller;
}
#comments .comcont {
	display: block;
	margin: 0;
	padding: 0;
}
#comments .comcont p {
	margin: 10px 5px 10px 0;
	padding: 0;
}
#comments form {
	display: block;
	width: 100%;
}
#comments input, #comments textarea {
	width: 100%;
	padding: 10px;
	border: 1px solid;
}
#comments textarea {
	overflow: auto;
}
#comments div {
	margin-bottom: 15px;
}
#comments input[type="submit"], #comments input[type="reset"] {
	display: inline-block;
	width: auto;
	min-width: 150px;
	margin: 0;
	padding: 8px 5px;
	cursor: pointer;
}
/* Sidebar */
*/.container .sidebar {
}
.sidebar .sdb_holder {
	margin-bottom: 50px;
}
.sidebar .sdb_holder:last-child {
	margin-bottom: 0;
}
/* Quick Links
--------------------------------------------------------------------------------------------------------------- */
#quicklinks {
}
#quicklinks .ui-accordion {
}/* main wrapper */
#quicklinks .ui-accordion .ui-accordion-header {
	display: block;
	width: 100%;
	margin: 0;
	padding: 50px 0;
	text-align: center;
	font-size: 1.4rem;
	text-transform: uppercase;
}/* toggle */
#quicklinks .ui-accordion .ui-accordion-header::before, #quicklinks .ui-accordion .ui-accordion-header::after {
	float: left;
	font-family: "FontAwesome";
	font-size: inherit;
	content: "\f078";
}
#quicklinks .ui-accordion .ui-accordion-header::after {
	float: right;
}
#quicklinks .ui-accordion .ui-accordion-header-active::before, #quicklinks .ui-accordion .ui-accordion-header-active::after {
	content: "\f077";
}
#quicklinks .ui-accordion .ui-accordion-content {
	display: block;
	width: 100%;
	padding: 0 0 40px 0;
	border: solid;
	border-width: 0 0 1px 0;
}/* Content wrapper */
#quicklinks .linkblock div {
	margin-bottom: 0;
}/* Required for smaller viewports when elements stack */
#quicklinks ul {
	margin: 0;
	padding: 0;
	list-style-position: inside;
}
#quicklinks li {
	margin-bottom: 10px;
}
/* Featured
--------------------------------------------------------------------------------------------------------------- */
#featured {
}
#featured article img, #featured article .heading {
	margin-bottom: 20px;
}
#featured article:last-child {
	margin-bottom: 0;
}/* Required for smaller viewports when elements stack */
#featured .meta {
	margin: 0 0 30px 0;
	padding: 20px 0 0 0;
	list-style: none;
	border: solid;
	border-width: 1px 0 0 0;
}
#featured .meta li {
	display: inline-block;
	margin: 0 10px 0 0;
	line-height: 1;
font-size:.8rem;
}
#featured .meta li:nth-child(-n+2) {
	display: block;
	margin: 0 0 10px 0;
	font-size: 1rem;
}/* First 2 li elements only */
#featured .meta li:nth-child(2) 

/* Footer
--------------------------------------------------------------------------------------------------------------- */
#footer {
	padding: 80px 0 50px;
}
#footer.topspace-0 {
	padding-top: 0;
}
#footer .title {
	margin: 0 0 30px 0;
	padding: 0 0 8px 0;
	border-bottom: 1px solid;
	font-size: 1.2rem;
}
#footer .linklist li {
	margin-bottom: 10px;
}
#footer .linklist li:last-child {
	margin-bottom: 0;
}
#footer .font-xs {
	margin: 0;
}
#footer #newsletter {
	display: block;
	margin: 0 0 80px 0;
	padding: 25px;
}
#footer #newsletter input, #footer #newsletter button {
	padding: 10px 12px;
	border: none;
}
#footer #newsletter button {
	padding: 9px 18px;
	font-weight: bold;
	text-transform: uppercase;
	cursor: pointer;
}
/* Copyright
--------------------------------------------------------------------------------------------------------------- */
#copyright {
	padding: 20px 0;
}
#copyright * {
	margin: 0;
	padding: 0;
}
/* Transition Fade
--------------------------------------------------------------------------------------------------------------- */
/**, *::before, *::after {
	transition: all .3s ease-in-out;
}*/
.accordion, .accordion *, .accordion *::before, .accordion *::after {
	transition: none;
!important
}
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Navigation
--------------------------------------------------------------------------------------------------------------- */
nav ul, nav ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
#mainav, #breadcrumb, .sidebar nav {
	line-height: normal;
}
#mainav .drop::after, #mainav li li .drop::after, #breadcrumb li a::after, .sidebar nav a::after {
	position: absolute;
	font-family: "FontAwesome";
	font-size: 10px;
	line-height: 10px;
	text-decoration:underline;
}
/* Top Navigation */
#mainav {
}
#mainav ul.clear {
	margin-top: 3px;
}
#mainav ul {
	text-transform: uppercase;
}
#mainav ul ul {
	z-index: 9999;
	position: absolute;
	width: 180px;
	text-transform: none;
}
#mainav ul ul ul {
	left: 180px;
	top: 0;
}
#mainav li {
	display: inline-block;
	position: center;
	margin: 0 15px 0 0;
	padding: 0;
}
#mainav li:last-child {
	margin-right: 0;
}
#mainav li li {
	width: 100%;
	margin: 0;
}
#mainav li a {
	display: block;
	padding: 0 0 32px 0;
}
#mainav li li a {
	border: solid;
	border-width: 0 0 1px 0;
}
#mainav .drop {
	padding-left: 15px;
}
#mainav li li a, #mainav li li .drop {
	display: block;
	margin: 0;
	padding: 10px 15px;
}
#mainav .drop::after, #mainav li li .drop::after {
	content: "\f0d7";
}
#mainav .drop::after {
	top: 5px;
	left: 5px;
}
#mainav li li .drop::after {
	top: 15px;
	left: 5px;
}
#mainav ul ul {
	visibility: hidden;
	opacity: 0;
}
#mainav ul li:hover > ul {
	visibility: visible;
	opacity: 1;
	text-transform: uppercase;
	color: #00a2e8
}
#mainav form {
	display: none;
	margin: 0;
	padding: 0;
}
#mainav form select, #mainav form select option {
	display: block;
	cursor: pointer;
	outline: none;
}
#mainav form select {
	width: 100%;
	padding: 5px;
	border: 1px solid;
}
#mainav form select option {
	margin: 5px;
	padding: 0;
	border: none;
}
/* Breadcrumb */
#breadcrumb {
	padding: 0 0 30px 0;
}
#breadcrumb ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#breadcrumb li {
	display: inline-block;
	margin: 0 3px 0 0;
	padding: 0;
}
#breadcrumb li a {
	display: block;
	position: relative;
	margin: 0;
	padding: 0 12px 0 0;
font-size:.8rem;
	text-transform: uppercase;
}
#breadcrumb li a::after {
	top: 2px;
	right: 0;
	content: "\f101";
}
#breadcrumb li:last-child a {
	margin: 0;
	padding: 0;
}
#breadcrumb li:last-child a::after {
	display: none;
}
/* Sidebar Navigation */
.sidebar nav {
	display: block;
	width: 100%;
}
.sidebar nav li {
	margin: 0 0 3px 0;
	padding: 0;
}
.sidebar nav a {
	display: block;
	position: relative;
	margin: 0;
	padding: 5px 10px 5px 15px;
	text-decoration: none;
	border: solid;
	border-width: 0 0 1px 0;
}
.sidebar nav a::after {
	top: 9px;
	left: 5px;
	content: "\f101";
}
.sidebar nav ul ul a {
	padding-left: 35px;
}
.sidebar nav ul ul a::after {
	left: 25px;
}
.sidebar nav ul ul ul a {
	padding-left: 55px;
}
.sidebar nav ul ul ul a::after {
	left: 45px;
}
/* Pagination */
.pagination {
	display: block;
	width: 100%;
	text-align: center;
	clear: both;
}
.pagination li {
	display: inline-block;
	margin: 0 2px 0 0;
}
.pagination li:last-child {
	margin-right: 0;
}
.pagination a, .pagination strong {
	display: block;
	padding: 8px 11px;
	border: 1px solid;
	background-clip: padding-box;
	font-weight: normal;
}
/* Back to Top */
#backtotop {
	z-index: 999;
	display: inline-block;
	position: fixed;
	visibility: hidden;
	bottom: 20px;
	right: 20px;
	width: 36px;
	height: 36px;
	line-height: 36px;
	font-size: 16px;
	text-align: center;
	opacity: .2;
}
#backtotop i {
	display: block;
	width: 100%;
	height: 100%;
	line-height: inherit;
}
#backtotop.visible {
	visibility: visible;
	opacity: .5;
}
#backtotop:hover {
	opacity: 1;
}
/* Tables
--------------------------------------------------------------------------------------------------------------- */
table, th, td {
	border: 1px solid;
	border-collapse: collapse;
	vertical-align: top;
}
table, th {
	table-layout: auto;
}
table {
	width: 100%;
	margin-bottom: 15px;
}
th, td {
	padding: 5px 8px;
}
td {
	border-width: 0 1px;
}
/* Gallery
--------------------------------------------------------------------------------------------------------------- */
#gallery {
	display: block;
	width: 100%;
	margin-bottom: 50px;
}
#gallery figure figcaption {
	display: block;
	width: 100%;
	clear: both;
}
#gallery li {
	margin-bottom: 30px;
}
/* Font Awesome Social Icons
--------------------------------------------------------------------------------------------------------------- */
.faico {
	margin: 0;
	padding: 0;
	list-style: none;
}
.faico li {
	display: inline-block;
	float: left;
	margin: 0 2px 0 0;
	padding: 0;
	line-height: normal;
}
.faico li:last-child {
	margin-right: 0;
}
.faico a {
	display: inline-block;
	width: 30px;
	height: 30px;
	line-height: 30px;
	font-size: 14px;
	text-align: center;
}
.faico a {
	color: inherit;
	background-color: transparent;
}
.faicon-dribble:hover {
	color: #EA4C89;
}
.faicon-facebook:hover {
	color: #3B5998;
}
.faicon-google-plus:hover {
	color: #DB4A39;
}
.faicon-linkedin:hover {
	color: #0E76A8;
}
.faicon-pinterest:hover {
	color: #C8232C;
}
.faicon-rss:hover {
	color: #EE802F;
}
.faicon-twitter:hover {
	color: #00ACEE;
}
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Colours
--------------------------------------------------------------------------------------------------------------- */
body {
	alignment-baseline: central;
}
a {
	color: #26255c;
}
a:active, a:focus {
	background: transparent;
}/* IE10 + 11 Bugfix - prevents grey background */
hr, .borderedbox, .boxed {
	border-color: #D7D7D7;
}
label span {
	color: #FF0000;
	background-color: inherit;
}
input:focus, textarea:focus, *:required:focus {
border-color:#35356b;
}
.overlay {
	color: #FFFFFF;
	background-color: inherit;
}
.overlay::after {
	color: inherit;
	background-color: rgba(53,52,110,.45);
}
.overlay.coloured::after {
	color: inherit;
	background-color: rgba(91,155,189,.65);
}/* #35356b */
.overlay .underline::after {
	background-color: #FFFFFF;
}
.btn {
	color: inherit;
	background-color: transparent;
	border-color: inherit;
}
.btn:hover {
	color: #FFFFFF;
	background-color: #35356b;
	border-color: #35356b;
}
.btn2 {
	color:#fff;
	background-color:#35346e;
	border-color:#fff;
}
.btn2:hover {
	color:#35346e;
	background-color:#fff;
	border-color:#35346e;
}

.btnensino1 {
	color:#fff;
	background-color:#21b096;
	border:1px;
	font-weight:bold;
	padding:35px;
	text-align:center;
	font-size:larger;
}
.btnensino1:hover {
	color: #21b096;
	border:solid;
	font-weight:bold;
	background-color: #fff;
	border-color: #21b096;
	font-size:larger;
}

.btnensino2 {
	color:#fff;
	background-color:#95b235;
	border:1px;
	font-weight:bold;
	padding:35px;
	text-align:center;
	font-size:larger;
}
.btnensino2:hover {
	color: #95b235;
	font-weight:bold;
	background-color: #fff;
	border:solid;
	border-color: #95b235;
	font-size:larger;
}

.btnensino3 {
	color:#fff;
	background-color:#f8bd0f;
	border:1px;
	font-weight:bold;
	padding:35px;
	text-align:center;
	font-size:larger;
}
.btnensino3:hover {
	color: #f8bd0f;
	background-color: #fff;
	font-weight:bold;
	border:solid;
	border-color: #f8bd0f;
	font-size:larger;
}

.btnensino4 {
	color:#fff;
	background-color:#f3496f;
	border:1px;
	font-weight:bold;
	padding:35px;
	text-align:center;
	font-size:larger;
}
.btnensino4:hover {
	color: #f3496f;
	background-color: #fff;
	font-weight:bold;
	border:solid;
	border-color: #f3496f;
	font-size:larger;
}


.infolist li {
	border-color: #D7D7D7;
}
.infolist li div:first-of-type time {
	color: #FFFFFF;
	background-color: #252C34;
}
/* Month name colour pre-set + the choice of adding specific header colours for different months (3 provided as examples) */
.infolist li div:first-of-type time strong {
	background-color: #35356b;
}
.infolist li div:first-of-type time[data-title*="April"] strong {
	background-color: #21b096;
}/*Green*/
.infolist li div:first-of-type time[data-title*="May"] strong {
	background-color: #95b235;
}/*Orange*/
.infolist li div:first-of-type time[data-title*="June"] strong {
	background-color: #f8bd0f;
}/*Purple*/
/* Rows */
.row0 {
	color: #FFFFFF;
	background-color: #252C34;
	border-color: #35356b;
}
.row1 {
	color: #26255c;
	background-color: #fff;
	border-color: #D7D7D7;
}
.row2, .row2 a {
}
.row3 {
	color: #888888;
	background-color: #FFFFFF;
}
.row4, .row4 a {
	color: #AAAAAA;
	background-color: #35346e;
}
.row4 a {
	color: #FFFFFF;
}
.row4 a:hover {
	color: #fff;
}
.row5, .row5 a {
	color: #AAAAAA;
	background-color: #272657;
}
/* Top Bar */
#topbar .fl_left a {
	color: inherit;
}
#topbar .fl_left a:hover {
	color: #35356b;
}
/* Header */
#header #logo a {
	color: inherit;
}
/* Homepage Specific */
#introblocks ul li, #introblocks ul li a, #introblocks ul li a i {
	color: #FFFFFF;
}
#introblocks ul li:hover a {
	color: #13171C
}
#introblocks ul li:nth-child(1) {
	background-color: #21b096;
}/*Green*/
#introblocks ul li:nth-child(2) {
	background-color: #95b235;
}/*Orange*/
#introblocks ul li:nth-child(3) {
	background-color: #f8bd0f;
}/*Purple*/
#introblocks ul li:nth-child(4) {
	background-color: #f3496f;
}/*Red*/
#introblocks ul li:nth-child(1) i {
	background-color: #27D18D;
}/*Dark Green*/
#introblocks ul li:nth-child(2) i {
	background-color: #FF502B;
}/*Dark Orange*/
#introblocks ul li:nth-child(3) i {
	background-color: #8456B1;
}/*Dark Purple*/
#introblocks ul li:nth-child(4) i {
	background-color: #F03E54;
}/*Dark Red*/
/* 3D Shadow only works in modern browsers - inpired by http://markdotto.com/playground/3d-text/ */
#introblocks li:hover i {
	box-shadow: 2px 2px 5px rgba(0,0,0,.3);
	text-shadow: 0 1px 0 #CCCCCC, 0 2px 0 #666666, 0 3px 0 #000000, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25);
}
#introblocks .underline::after {
	background-color: #FFFFFF;
}
/* Content Area */
.container .underline::after {
	background-color: #D7D7D7;
}
#join {
	color: #FFFFFF;
	background-color: #35356b;
}
#join .underline::after {
	background-color: #FFFFFF;
}
#join .btn:hover {
	color: #35356b;
	background-color: #FFFFFF;
	border-color: #FFFFFF;
}
/* Featured */
#featured .meta {
	border-color: #D7D7D7;
}
#featured .cat-1 {
	border-color: #21b096;
}/*Green*/
#featured .cat-2 {
	border-color: #95b235;
}/*Orange*/
#featured .cat-3 {
	border-color: #f8bd0f;
}/*Purple*/
#featured .cat-4 {
	border-color: #F36174;
}/*Red*/
/* Quick Links */
#quicklinks .ui-accordion .ui-accordion-header:hover {
	color: inherit;
}
/* Footer */
#footer .title {
	border-color: #aaa;
}
#footer #newsletter {
	color: #FFFFFF;
	background-color: #13171C;
}
#footer #newsletter input {
	color: #FFFFFF;
	background-color: #1E252B;
}
#footer #newsletter button {
	color: #FFFFFF;
	background-color: #35356b;
}
/* Navigation */
#mainav li a {
	color: inherit;
}
#mainav .active a, #mainav a:hover, #mainav li:hover > a {
	color: #5B9BBD;
	background-color: inherit;
}
#mainav li li a, #mainav .active li a {
	color: #FFFFFF;
	background-color: rgba(53,52,110,.9);
	border-color: rgba(0,0,0,.6);
}
#mainav li li:hover > a, #mainav .active .active > a {
	color: #FFFFFF;
	background-color: #5B9BBD;
}
#mainav form select {
	color: #FFFFFF;
	background-color: #2c2c60;
	border-color: rgba(136,136,136,.5);/* #888888 */
}
#breadcrumb a {
	color: #888888;
	background-color: inherit;
}
#breadcrumb li:last-child a {
	color: inherit;
}
.container .sidebar nav a {
	color: inherit;
	border-color: #D7D7D7;
}
.container .sidebar nav a:hover {
	color: #35356b;
}
.pagination a, .pagination strong {
	border-color: #D7D7D7;
}
.pagination .current * {
	color: #FFFFFF;
	background-color: #35356b;
}
#backtotop {
	color: #FFFFFF;
	background-color: #35356b;
}
/* Tables + Comments */
table, th, td, #comments .avatar, #comments input, #comments textarea {
	border-color: #D7D7D7;
}
#comments input:focus, #comments textarea:focus, #comments *:required:focus {
border-color:#35356b;
}
th {
	color: #FFFFFF;
	background-color: #373737;
}
tr, #comments li, #comments input[type="submit"], #comments input[type="reset"] {
	color: inherit;
	background-color: #FBFBFB;
}
input[type="submit2"] {
	color: #fff;
	background-color: #35346e;
}
tr:nth-child(even), #comments li:nth-child(even) {
	color: inherit;
	background-color: #F7F7F7;
}
table a, #comments a {
	background-color: inherit;
}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Media Queries
--------------------------------------------------------------------------------------------------------------- */
@-ms-viewport {
width:device-width;
}


/* Max Wrapper Width - Laptop, Desktop etc.
--------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:978px) {
.hoc {
	max-width: 978px;
}
}


/* Smartphone + Tablet
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:900px) {
.hoc {
	max-width: 90%;
}
#topbar {
}
#header {
	padding-bottom: 30px;
}
#mainav {
}
#mainav ul {
	display: none;
}
#mainav form {
	display: block;
}
#breadcrumb {
}
.container {
}
#comments input[type="reset"] {
	margin-top: 10px;
}
.pagination li {
	display: inline-block;
	margin: 0 5px 5px 0;
}
#footer {
}
#copyright {
}
#copyright p:first-of-type {
	margin-bottom: 10px;
}
}
 @media screen and (max-width:750px) {
.inicio {
	font-size:9px;
}

.imgl, .imgr {
	display: inline-block;
	float: none;
	margin: 0 0 10px 0;
}
.fl_left, .fl_right {
	display: block;
	float: none;
}
.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter {
	display: block;
	float: none;
	width: auto;
	margin: 0 0 30px 0;
	padding: 0;
}
#topbar {
	text-align: center;
}
#topbar * {
	margin: 0;
}
#topbar .fl_left ul {
	margin: 0 0 10px 0;
	line-height: normal;
}
#topbar .fl_left ul li {
	display: inline-block;
	margin-right: 20px;
}
#topbar .fl_left ul li:last-child {
	margin-right: 0;
}
#topbar .faico li {
	float: none;
}
#header {
	text-align: center;
}
#header #logo {
	margin-bottom: 15px;
}
#pageintro article {
	max-width: 80%;
}
#pageintro article .heading {
	font-size: 36px;
}
#introblocks ul, #introblocks ul li {
	display: block;
	width: 100%;
}
#introblocks ul li {
	float: left;
	width: 50%;
	min-height: 260px;
	padding: 5%;
	text-align: center;
}
#introblocks ul li:nth-child(3) {
	clear: left;
}
#introblocks ul li article i {
	position: inherit;
	top: auto;
	left: auto;
	margin: 0 0 20px 0;
}
.container {
	padding-bottom: 50px;
}
#footer {
	padding-bottom: 20px;
}
#footer #newsletter input {
	display: block;
	width: 100%;
	padding: 10px 12px;
}
#footer #newsletter form, #footer #newsletter button {
	margin-bottom: 0;
}
}
 @media screen and (max-width:450px) {
#topbar .fl_left ul li {
	display: block;
	margin: 5px 0 0 0;
}
#topbar .fl_left ul li:first-child {
	margin: 0;
}
#introblocks ul li {
	width: 100%;
	min-height: initial;
	padding: 25px;
}
#quicklinks .ui-accordion .ui-accordion-header::before {
	float: none;
	margin-right: 10px;
}
#quicklinks .ui-accordion .ui-accordion-header::after {
	display: none;
}


.titlebox {
	background-color:#10b69d; 
	padding: 1.5% 3% 0.2% 3%;
	margin: 1% 0 3% 0;
}


/* Other
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:650px) {
.scrollable {
	display: block;
	width: 100%;
	margin: 0 0 30px 0;
	padding: 0 0 15px 0;
	overflow: auto;
	overflow-x: scroll;
}
.scrollable table {
	margin: 0;
	padding: 0;
	white-space: nowrap;
}
.inline li {
	display: block;
	margin-bottom: 10px;
}
.pushright li {
	margin-right: 0;
}
.font-x2 {
	font-size: 1.4rem;
}
.font-x3 {
	font-size: 1.6rem;
}

.ensino {
	float: left;
	width: 25%;
	padding: 2% 2%;
	
}

.inicio {
	font-size:14px;
}

}


/*---------galeria index---------*/

.galery {
	margin: 5px;
  }
  
  .picture {
	cursor: pointer;
	height: 155px;
	width: 230px;
	box-sizing: border-box;
	margin: 1px 1px;
	padding: 0px;
	transition-property: border;
	transition-duration: .8s;
	transition-timing-function: ease-in;
  }
  
  .caption{
	float: left;
	padding-top: 10px;
	margin: 0;
  }
  
  .close {
	float: right;
	font-size: 2.5em;
	cursor: pointer;
	margin: 0;
	opacity: 100%;
  }
  
  #pack {
	position: relative;
	display: none;
	text-align: center;
  }
  
  #ligthbox {
	margin-top: 10%;
	position: relative;
	text-align: center;
	display: inline-block;
	box-shadow: 0px 0px 40px #000;
	box-sizing: border-box;
	background-color: #fff;
  }
  
  
  #onBillboard {
	background-color: #fff;
	transition-property: width, height;
	transition-duration: 0.3s, 0.35s;
	transition-delay: 0s;
	transition-timing-function: cubic-bezier(0.56, 0.39, 0.29, 0.52);
  }
  
  #dataclose {
	position: relative;
	color: white;
	margin: 0 auto;
	padding: 1px 10px;
  }
  
  #prevPic, 
  #nextPic {
	position: absolute;
	top: 0%;
	width: 35%;
	height: 100%;
	cursor: pointer;
  }
  
  #prevPic {
	left: 0;
	text-align: left;
	padding-left: 3%;
  }
  
  #nextPic {
	right: 0;
	text-align: right;
	padding-right: 3%;
  }
  
  #prevPic::before, 
  #nextPic::before {
	content: "";
	display: inline-block;
	height: 100%;
	  vertical-align: middle;
  }
  
  #nextPic:hover :first-child, 
  #prevPic:hover :first-child {
	opacity: 1;
  }
  
  #larr, 
  #rarr {
	color:#8abf27;
	font-size: 7em;
	text-shadow: 0px 0px 5px #000;
	opacity: 0;
	transition-property: opacity;
	transition-duration: 1.2s;
	transition-timing-function: cubic-bezier(0.56, 0.39, 0.29, 0.52);
	transition-delay: 0s;
	display: inline-block;
	vertical-align: middle;
	margin: 0;
  }
  <!------------------------------------------------------------->

  
  /*-----BLOG-----*/

.blog{
	padding: 70px 0px;
	text-align: center;
	background: #ebebeb6e;
}
.title-blog{
	margin-bottom: 50px;
}


.item-blog{
background: #fff;
border-radius: 8px;
transition: 400ms;
box-shadow: 5px 5px 18px -5px #00000017;
margin-top: 20px;
}

.item-blog:hover{
cursor: pointer;
box-shadow: 5px 5px 18px -5px #00000069;
transition: 400ms;
}

.item-blog img{
border-radius: 8px 8px 0px 0px;
border-bottom: 2px solid #194189;
}


.date-blog {
    background-color: #0f8bcd;
    width: 125px;
    bottom: 208px;
    display: flex;
    position: absolute;
    align-items: center;
}

.date-number{
	font-size: 45px;
	 padding: 5px;
	 color: #fff;
}

.month{
	font-size: 15px;
    padding: 5px;
    color: #fff;
}

.blog-entry:after {
    position: absolute;
    bottom: -10px;
    left: 40px;
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #0f8bcd transparent transparent;
    }

.item-blog p{
	padding: 10px 8px;
	text-align: left;
	font-size: 15px;
}

.item-blog h4{
text-align: left;
padding: 10px 8px;
font-size: 22px;
}