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

body {padding-top: 30px;color: #333;font-size: 16px;line-height: 160%;}

body, h1, h2, h3, h4, h5, h6, div, p {font-family: 'Open Sans', Helvetica, Arial, sans-serif;}

h1, h2, h3, h4, h5, h6 {line-height: 1.2;}

h1 {font-size:38px;color:#358AC8;margin-top: 40px;}
h2 {font-size:34px;color:#358AC8;margin-bottom: 20px;}
h3 {font-size:26px;color:#358AC8;}
h4 {font-size:22px;color:#333333;margin-top: 20px;}
h5 {font-size:18px;color:#333333;}
h6 {font-size:14px;color:#666666;}

a {color: #358AC8;}
a:hover, a:focus {color: #666666;outline: 0;}

a, button, input[type="button"], input[type="submit"] {
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	-ms-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

.text-alternative {color: #003a7c;}
.text-secondary {color: #358AC8;}

.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 0;
}
.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
  padding-bottom: 75%;
}

/* AgroInnovation Tour */
#ait {padding: 40px 0;}
#ait .head img {display:block;margin: 0 auto;}
#ait .evento {background:url(https://cdn.imagelinenetwork.com/iln3/c_grafica/imageline/ait/fondo-evento-ait.jpg) no-repeat center;text-align:center;color:#fff;padding: 32px 0 24px 0;margin: 0 0 15px 0;font-size:28px;}
#ait h4 {font-size: 22px;color:#358AC8;margin-bottom: 30px;}
#ait .title {font-size:32px;background:url(https://cdn.imagelinenetwork.com/iln3/c_grafica/imageline/ait/fondo-title-ait.jpg) no-repeat center;text-align:center;padding: 6px 0;margin:80px 0 30px 0;text-transform: uppercase;color:#358AC8;height: 50px;}
#ait .boxFormContatti {border-left:1px solid #358AC8;margin-top: 25px;}
#ait .boxFormContatti h3 {text-align:center;text-transform: uppercase;padding:12px;color:#358AC8;margin-top: 0;background:url(https://cdn.imagelinenetwork.com/iln3/c_grafica/imageline/ait/fondo-form-ait.jpg) no-repeat left center;font-size:22px;}
#ait .field {border:1px solid #358AC8;background-color: transparent;padding:10px;margin: 5px 0;width:100%;color:#666;}
#ait .privacy {font-size: 12px;}
#ait .boxSpeaker {min-height: 390px;border-color: #358AC8;}
#ait .boxSpeaker h3 {font-size:24px;font-weight: bold;}
#ait .boxSpeaker h5 {color:#358AC8;}
#ait .boxSpeaker h6 {font-size:12px;}
#ait .must .boxSpeaker {min-height: 350px;}
#ait .speaker {font-style: italic;font-size: 18px;margin:0;}
#ait .ruolo {color:#666;font-size: 14px;line-height: normal;}
#ait .foto {display: block;margin:0 auto;-webkit-border-radius: 120px;-moz-border-radius: 120px;border-radius: 120px;border:2px solid #ffffff;}
#ait .foto.blue {background-color:#358AC8;}
#ait .foto.green {background-color:#96BD0E;}
#ait .foto.maroon {background-color:#A65F21;}
#ait .foto:hover {background-color:transparent;border:2px solid #358AC8;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;-o-transition: 0.3s ease-in-out;-ms-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out;}
#ait .date {min-width: 315px;}
#ait .date a {font-size: 16px;}
#ait .btn-group-vertical a {margin: 3px 0;background: none;color:#358AC8;border:1px solid #358AC8;box-shadow: none;overflow: hidden;}
#ait .btn-group-vertical a:hover {background: #358AC8;color:#fff;}

#chartCategorie g text {font-size:11px;}

.thumbnail.pull-left, .img-thumbnail.pull-left {margin-right: 20px;margin-bottom: 20px;}

.push-top {margin-top: 20px !important;}
.push-bottom {margin-bottom: 20px !important;}
.push-top-half {margin-top: 10px !important;}
.push-bottom-half {margin-bottom: 10px !important;}
.push-top-quarter {margin-top: 5px !important;}
.push-bottom-quarter {margin-bottom: 5px !important;}
.push-top-double {margin-top: 40px !important;}
.push-bottom-double {margin-bottom: 40px !important;}
.no-margin {margin: 0 !important;}

.btn {font-weight:700;border: none;-moz-box-shadow: 0 2px 0 #001a38;-webkit-box-shadow: 0 2px 0 #001a38;box-shadow: 0 2px 0 #001a38;}
.btn:hover {text-decoration: none;-moz-box-shadow: 0 2px 0 #333;-webkit-box-shadow: 0 2px 0 #333;box-shadow: 0 2px 0 #333;}

.btn-default {background-color: #F7F7F7;color: #333333;}
.btn-default:hover {background-color: #cccccc;color: #333333;}
.btn-primary {background-color: #358AC8;color: #ffffff;}
.btn-primary:hover {background-color: #cccccc;color: #333333;}
.btn-secondary {background-color: #358AC8;color: #fff;}
.btn-secondary:hover {background-color: #cccccc;color: #333333;}
.btn-success {background-color: #008634;color: #fff;}
.btn-success:hover {background-color: #cccccc;color: #333333;}
.btn-info {background-color: #6a9e16;color: #fff;}
.btn-info:hover {background-color: #cccccc;color: #333333;}
.btn-warning {background-color: #a65f21;color: #fff;}
.btn-warning:hover {background-color: #cccccc;color: #333333;}
.btn-danger {background-color: #754218;color: #fff;}
.btn-danger:hover {background-color: #cccccc;color: #333333;}

.bg-primary {background-color: #358AC8;}
.bg-secondary {background-color: #358AC8;}
.bg-success {background-color: #009733;}
.bg-info {background-color: #f7f7f7;}
.bg-warning {background-color: #A65F21;}
.bg-danger {background-color: #754218;}
.bg-black {background-color: #282828;}
.bg-gray {background-color: #f5f5f5;}

.text-primary {color: #358AC8;}
.text-secondary {color: #358AC8;}
.text-success {color: #009733;}
.text-info {color: #6A9E16;}
.text-warning {color: #A65F21;}
.text-danger {color: #754218;}
.text-black {color: #282828;}
.text-gray {color: #f5f5f5;}

ul.breadcrumb {margin-bottom: 0;font-size: 0.85em;padding: 4px 0;}

/* HEADER*/
div.ricerca {padding: 0;padding-top: 20px;}
div.ricerca input {font-size: 12px;}
div.ricerca .btn.btn-primary {width:36px;padding:6px;border: 1px solid #2f81bd;-moz-box-shadow: none;-webkit-box-shadow: none;box-shadow: none;}
div.ricerca .btn.btn-primary:hover {border-color: #bbbbbb;}


/* NAVIGATION */
.navbar-default {background:transparent;border:none;font-weight:400;margin: 15px auto;}
.navbar-header {padding: 0;}
.navbar-default .navbar-nav {padding-top: 30px;}
.navbar-default .navbar-nav > li.first {border-left:none;}
.navbar-default .navbar-nav  li a {font-size: 14px;color: #666;padding: 6px 10px;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
.navbar-default .navbar-nav  li.shopping-cart a {font-size: 20px;margin-top: -1px;}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li.active > a {color: #358AC8;background: none;}

.navbar-default .navbar-nav ul.dropdown-menu li a {text-transform: none;padding: 7px 20px;}
.navbar-default .navbar-nav ul.dropdown-menu li a:hover {background-color: #E2E2E2 !important;color: #358AC8;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.navbar-default .navbar-nav ul.dropdown-menu > li.active a {color: #358AC8;background: none;}

.navbar-collapse {border:0;}


/* CAROUSEL - SLIDER */
#main-slider .carousel h2.boxed {font-size: 20px;line-height: 150%;padding: 10px;background-color: rgba(255, 255, 255, 0.9);color:#358AC8;display:block;margin: 0 auto 20px auto;text-align: center;width:550px;-webkit-border-radius: 16px;-moz-border-radius: 16px;border-radius: 16px;}
#main-slider .carousel .btn-info {margin: 10px auto;}
#main-slider .carousel .video {float:right;}
#main-slider .carousel .item {background-position: center !important;}

/* box-blue Homepage */
#box-blue {background-color: #358AC8;color:#fff;padding-top: 7px;padding-bottom: 7px;}
#box-blue h1 {color:#fff;text-align: center;margin-bottom: 30px;line-height: 160%;}
#box-blue h2 {color:#fff;margin: 10px 0 12px 0;font-weight: 300;font-size: 28px;}
#box-blue h4 {color: #fff;font-size:18px;line-height: 150%;margin-bottom: 30px;text-align: center;}
.video {max-width:590px;padding: 10px;background-color: #282828;border:2px solid #000;margin: 10px auto 30px auto;}
.video iframe {min-height:315px;display: block;}

/* Pop Up Bottom */
div#popup {background: #fff;text-align:center;background: url(../c_grafica/imageline/noi/fondino.png) repeat left top;width:410px;padding:14px 20px;position:fixed;bottom: 25px;right: 25px;display: none;-webkit-border-radius: 16px;-moz-border-radius: 16px;border-radius: 16px;line-height: normal;}
div#popup h3, div#popup h5 {margin: 0 0 10px 0;font-weight: 700;}
div#popup .button {background-color: #E09000;margin: 0 auto;}


/* Mappa Scuole Homepage */
#mappa-scuole {padding: 80px 0 0 0;background-color: #4D6A79;}/*background-color: #4D6A79;*/
#mappa-scuole a {color: #fff;text-decoration: underline;}
#mappa-scuole h2, #mappa-scuole h4 {text-align: center;color:#fff;}
#mappa-scuole h4 {font-size:18px;line-height: 150%;margin-bottom: 30px;}


/* ULTIME NOVITA' */
#recent-works {padding: 80px 0;}
#recent-works .item-inner {position: relative;margin: 0;}
#recent-works h5 {line-height: 160%;font-weight: normal;}


/* TESTIMONIALS */
#testimonial {padding-top: 60px;padding-bottom: 60px;font-weight: 400;margin: 0;background-color: #F4F6F7;}
#testimonial h2, #testimonial h4 {text-align: center;}
#testimonial h4 {font-size: 20px;margin-bottom: 50px;line-height: 160%;}
#testimonial blockquote {border-left-color: #ccc;}
#testimonial blockquote small {color:#333;font-size: 14px;}
blockquote p {color:#666;line-height: 160%;font-weight: 400;font-style: italic;}

.container.colori-network img {margin: 3px 0;padding: 0;display: block;}

/* social login */
.btn-facebook {
  color: #FFFFFF;
  background-color: #4267B2;
  border-color: #2950a0;
}
.btn-facebook:hover, .btn-facebook:focus, .btn-facebook:active, .btn-facebook.active {
  color: #FFFFFF;
  background-color: #2e57aa;
  border-color: #2950a0;
}
.btn-google {
  color: #FFFFFF;
  background-color: #DB3236;
  border-color: #bd272a;
}
.btn-google:hover, .btn-google:focus, .btn-google:active, .btn-google.active {
  color: #FFFFFF;
  background-color: #b8272a;
  border-color: #bd272a;
}

/* FOOTER */
.footer {background-color: #282828;color: #E0E0E0;font-size: 12px;}
.footer dl {max-width: 200px;min-height: 215px;margin: 20px auto;}
.footer dl dt {height:36px;padding:8px 0 0 15px;color:#ffffff;font-weight: 700;font-size: 13px;border-bottom:1px solid #515151;}
.footer dl dd {padding:16px 8px 8px 8px;line-height:18px;margin:0;}
.footer dl dd a {text-decoration: none;color: #FFFFFF;}
.footer dl dd a:hover {text-decoration: underline;}
.footer dl dd.contatti {line-height: 160%;}
.footer dl dd.contatti a.mail {text-transform: uppercase;font-weight: 700;font-size: 14px;padding: 10px 0;display: block;}
.footer dl dd.contatti a.mail:hover {color:#ccc;text-decoration: none;}
.footer dl dd ul {list-style: none;padding: 0;}
.footer dl dd ul li {padding:4px 0;}
.footer li.social {padding-top: 20px;}
.footer li.social a {font-size: 20px;padding: 0 4px;}
.footer li.social a:hover {text-decoration: none;color:#ccc;}

.footer dl dd a.contatti {text-transform: uppercase;font-weight: bold;font-size: 12px;width:142px;height:27px;display: block;padding:6px 0 0 32px;margin:5px 0;background: url(../c_grafica/sdsondemandpiu/btn_contatti.png) no-repeat left top transparent;color:#ffffff;}
.footer dl dd a.contatti:hover {color:#003366;text-decoration: none;}



/********** CSS SLIDER e ULTIME NOVITA' da template ********/
#main-slider {position: relative;}

#main-slider .carousel .item h2 {color:#004493;}

#main-slider .carousel .item {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  left: 0 !important;
  opacity: 0;
  top: 0;
  position: absolute;
  width: 100%;
  display: block !important;
  height: 600px;
  -webkit-transition: opacity ease-in-out 500ms;
  -moz-transition: opacity ease-in-out 500ms;
  -o-transition: opacity ease-in-out 500ms;
  transition: opacity ease-in-out 500ms;
}
#main-slider .carousel .item:first-child {
  top: auto;
  position: relative;
}
#main-slider .carousel .item.active {
  opacity: 1;
  -webkit-transition: opacity ease-in-out 500ms;
  -moz-transition: opacity ease-in-out 500ms;
  -o-transition: opacity ease-in-out 500ms;
  transition: opacity ease-in-out 500ms;
  z-index: 1;
}
#main-slider .prev,
#main-slider .next {
  position: absolute;
  top: 50%;
  background-color: rgba(0, 0, 0, 0.3);
  color: #fff;
  display: inline-block;
  margin-top: -25px;
  font-size: 24px;
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 4px;
  z-index: 5;
}
#main-slider .prev:focus,
#main-slider .next:focus,
#main-slider .prev:hover,
#main-slider .next:hover {
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  text-decoration: none;
}
#main-slider .prev {
  left: 10px;
}
#main-slider .next {
  right: 10px;
}
#main-slider .active .animation.animated-item-1 {
  -webkit-animation: fadeInUp 300ms linear 300ms both;
  -moz-animation: fadeInUp 300ms linear 300ms both;
  -o-animation: fadeInUp 300ms linear 300ms both;
  -ms-animation: fadeInUp 300ms linear 300ms both;
  animation: fadeInUp 300ms linear 300ms both;
}
#main-slider .active .animation.animated-item-2 {
  -webkit-animation: fadeInUp 300ms linear 600ms both;
  -moz-animation: fadeInUp 300ms linear 600ms both;
  -o-animation: fadeInUp 300ms linear 600ms both;
  -ms-animation: fadeInUp 300ms linear 600ms both;
  animation: fadeInUp 300ms linear 600ms both;
}
#main-slider .active .animation.animated-item-3 {
  -webkit-animation: fadeInUp 300ms linear 900ms both;
  -moz-animation: fadeInUp 300ms linear 900ms both;
  -o-animation: fadeInUp 300ms linear 900ms both;
  -ms-animation: fadeInUp 300ms linear 900ms both;
  animation: fadeInUp 300ms linear 900ms both;
}
#main-slider .active .animation.animated-item-4 {
  -webkit-animation: fadeInUp 300ms linear 1200ms both;
  -moz-animation: fadeInUp 300ms linear 1200ms both;
  -o-animation: fadeInUp 300ms linear 1200ms both;
  -ms-animation: fadeInUp 300ms linear 1200ms both;
  animation: fadeInUp 300ms linear 1200ms both;
}



/* ULTIME NOVITA' */
.portfolio-items, .portfolio-filter {list-style: none;padding: 0;margin: 0 -20px 20px 0;}
.portfolio-filter > li {display: inline-block;}
.portfolio-items > li {float: left;padding: 0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.portfolio-items.col-2 > li {width: 50%;}
.portfolio-items.col-3 > li {width: 33%;}
.portfolio-items.col-4 > li {width: 25%;}
.portfolio-items.col-5 > li {width: 20%;}
.portfolio-items.col-6 > li {width: 16%;}
.portfolio-item {padding: 0;margin: 0;}
.portfolio-item .item-inner {background: #fff;border: 1px solid #eee;padding: 10px 10px 0;margin: 0 20px 20px 0;position: relative;}
.portfolio-item img {width: 100%;}
.portfolio-item h5 {background: #fff;margin: 0;padding: 10px 0;font-weight: 700;font-size: 14px;color: #2c3e50;}
.portfolio-item .overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;background: rgba(255, 255, 255, 0.9);text-align: center;vertical-align: middle;-webkit-transition: opacity 300ms;-moz-transition: opacity 300ms;-o-transition: opacity 300ms;transition: opacity 300ms;}
.portfolio-item .overlay .preview {position: relative;top: 50%;display: inline-block;margin-top: -20px;}
.portfolio-item:hover .overlay {opacity: 1;}

@media (max-width: 1200px) {
	.navbar-default .navbar-nav  li a {padding: 4px 6px;}
}

@media (max-width: 992px) {
	.navbar-header {text-align: center;}
	#main-slider .carousel .item {height: 325px;background-position: inherit;}
	#main-slider .carousel h2.boxed {font-size: 18px;width: 70%;}
}

@media (max-width: 768px) {
	.navbar-header {text-align: left;}
	.logo img {margin-left: 20px;}
	.navbar-form {border: none;padding-bottom: 0;}
	#main-slider .carousel .item {height: 290px;}
	#main-slider .carousel h2.boxed {font-size: 16px;width: 65%;}
	div.ricerca {padding: 0;padding-top: 8px;width: auto;float: none;}
}

@media (max-width: 468px) {
	#recent-works {padding: 40px 0;}
	#box-blue h1 {font-size:20px;margin-bottom: 40px;}
	#box-blue h1 a.button {font-size:14px;}
	#box-blue div.media {padding-top: 20px;padding-bottom:20px;}
	.footer dl {max-width: 100%;}
	
	#main-slider .carousel .item {height: 200px;}
	#main-slider .carousel h2.boxed {font-size: 14px;width:85%;}
}

@media (min-width: 992px) {
	.navbar.container {padding: 0 !important;}
}

.panel-warningEdu {border-color: #358AC8 ;}

.panel.date {margin: 0;border: none;text-align: center;}
.panel.date h1, .panel.date h2, .panel.date h3, .panel.date h4, .panel.date h5, .panel.date h6 {margin: 0;color: #fff;}
.panel.date .panel-heading, .panel.date .panel-body, .panel.date .panel-footer {padding: 2px;border: none;}
.panel.date .panel-body {padding: 0 2px;}
.panel.date .panel-body h3 {font-size: 32px;}
.panel.date .panel-footer {padding-top: 0;}
.panel.date .panel-footer h6 {color: #ddd;}
.panel.date .panel-heading {background-color: #282828;}
.panel.date .panel-body, .panel.date .panel-footer {background-color: #666;text-transform: uppercase;}

.eventi .panel.date .panel-footer h6 {color: #fff;}
.eventi .panel.date .panel-heading {background-color: #282828;}
.eventi .panel.date .panel-body, .eventi .panel.date .panel-footer {background-color: #666;}

.eventi .event-row {border-bottom: 1px solid #ddd;margin: 0;}
.eventi .event-row .start-date, .eventi .event-row .end-date {padding: 0;}
.eventi .end-date .panel.date .panel-heading {background-color: #282828;}
.eventi .end-date .panel.date .panel-body, .eventi .end-date .panel.date .panel-footer {background-color: #434343;}

.panel-warningEdu {border-color: #f2ccbb ;}

.dayofmonth {
  width: 40px;
  font-size: 36px;
  line-height: 36px;
  float: left;
  text-align: right;
  margin-right: 10px; 
}
.shortdate {
  font-size: 0.75em; 
}

.media.search-result {border-bottom: 1px solid #ddd;margin: 0;padding: 12px 10px;overflow: visible;}
.media.search-result.highlight {border-bottom: 2px solid #ccc;padding: 20px 10px;}
.media.search-result .media-body {overflow: visible;}
.media.search-result.highlight h5.media-heading {font-size: 20px;}
.media.search-result p, .media.search-result address {margin: 0;}
.media.search-result .dl-horizontal dt {white-space: normal;}
.media.search-result h4.media-heading {line-height: 1em;}
.media.search-result .panel {margin-bottom: 0;}
.media.search-result .panel-body {padding: 8px;}
.media.search-result:last-child {border-bottom: none;}
.bg-info-light {background-color: #f7f7f7;}

.flexible-container {
	padding-top: 0;
	padding-bottom: 56%;
	position: relative;
	overflow: hidden;
	height: 0;
} 

.flexible-container embed, .flexible-container iframe, .flexible-container object, .flexible-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#ILNregister {text-align: center;font-size: 0.9em;}
#ILNregister p {}
#ILNregister h2 {text-align: left;}
#ILNregister table {margin: 0 auto;}
#ILNregister table .label, #ILNstore table .label {text-align: right;display: table-cell;color: #333;font-size: 1em;font-weight: 600;}
#ILNregister table select, #ILNregister table input[type="text"], #ILNregister table input[type="password"] {width: 75%;}
#ILNregister .dataCheck {background-image: none !important;padding-left: 2px;display: block;}
#ILNregister .cropsModule {width: auto;}
#ILNregister .cropsModule .cropsLeft, #ILNregister .cropsModule .cropsRight {width: 48%;}
#ILNregister .mandatory, #ILNregister .cropsModule h4, #ILNregister .cropsModule h5 {font-weight: 600;}

#ILNbar img {vertical-align: inherit;}
#ILNbar .close {float: none;text-shadow: none;font-size: inherit;color: #FFF;opacity: 1;}


@media print {
	body {width: 1024px !important;padding-top: 0;}
	#ILNbar {display: none;}
	@page {size: 297mm 420mm;margin: 12mm;}
	.container {width: 994px;}
	.search-result .classificazione img {width: 50px;}
	.product-page .collapse {display: block;}
	.product-page .collapse.in {display: none;}
}
/*
Ref:
Thanks to:
http://www.jqueryscript.net/layout/Simple-jQuery-Plugin-To-Create-Pinterest-Style-Grid-Layout-Pinterest-Grid.html
*/ 

#pinBoot {
  position: relative;
  max-width: 100%;
  width: 100%;
}
article img {
/*   width: 100%; */
  max-width: 100%;
  height: auto;
}

.text-right {
    text-align: right !important;
}

.white-panel {
  position: absolute;
  background: white;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
  padding: 10px;
}
/*
stylize any heading tags withing white-panel below
*/

.white-panel h1 {
  font-size: 1em;
}
.white-panel h1 a {
  color: #A92733;
}
.white-panel:hover {
  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
  margin-top: -5px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.hovereffect {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
}

.hovereffect .overlay {
  position: absolute;
  overflow: hidden;
  width: 80%;
  height: 80%;
  left: 10%;
  top: 10%;
  border-bottom: 1px solid #FFF;
  border-top: 1px solid #FFF;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: scale(0,1);
  -ms-transform: scale(0,1);
  transform: scale(0,1);
}

.hovereffect:hover .overlay {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.hovereffect img {
  display: block;
  position: relative;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}

.hovereffect:hover img {
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="https://www.w3.org/2000/svg"><filter id="filter"><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="0.6" /><feFuncG type="linear" slope="0.6" /><feFuncB type="linear" slope="0.6" /></feComponentTransfer></filter></svg>#filter');
  filter: brightness(0.6);
  -webkit-filter: brightness(0.6);
}

.hovereffect h2 {
  text-transform: uppercase;
  text-align: center;
  position: relative;
  font-size: 17px;
  background-color: transparent;
  color: #FFF;
  padding: 1em 0;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(0,-100%,0);
  transform: translate3d(0,-100%,0);
}

.hovereffect a, .hovereffect p {
  color: #FFF;
  padding: 1em 0;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(0,100%,0);
  transform: translate3d(0,100%,0);
}

.hovereffect:hover a, .hovereffect:hover p, .hovereffect:hover h2 {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}