body {
  background-color: #fff;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  min-height:1200px;
  min-width:320px;
}

h1 , h2, h3, h4 {
  font-family: 'Montserrat', sans-serif;
}

.container {
  width:100%;
}

.logo {
  margin-top:10px;
  margin-bottom:10px;
}

.navbar-fixed , .nav-wrapper , nav {
  height: 90px !important;
}

.referencia , .referencia-agenda {
  display: block;
  height: 90px;
  margin-top: -90px;
  visibility: hidden;
}

.referencia-agenda {
  height: 110px;
  margin-top: -110px;
}

.cultural img {
  vertical-align: middle;
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  opacity: 0.8;
  margin:0 15px;
}

.cultural-pie img {
  width: 130px;
  vertical-align: middle;
  filter: brightness(0) invert(1);
  margin:0 15px 15px 15px;
}

.portada {
    height: auto;
}

.inscripciones {
  padding:50px !important;
  margin:20px 0 !important;
}

.inscripciones .icono-titulo {
  opacity: 0.3;
  filter: alpha(opacity=30);
}

.icono-titulo {
  font-size:50px;
}

.calendario-agosto li {
  padding:10px;
  line-height: normal;
}

.calendario-agosto .divider {
  padding:0px;
  margin:0;
}

.calendario-agosto-dia {
  font-size:16px !important;
  text-align:center;
  text-transform:uppercase;
}

.calendario-agosto-fecha {
  font-size:100px !important;
  text-align:center;
  font-weight:bold;
  line-height: 90px !important;
}

.calendario-agosto-mes {
  font-size:20px !important;
  text-align:center;
  text-transform:uppercase;
}

.jurado {
  width: 200px;
  margin: 5px auto 25px auto;
}

.jurado .card-content {
  padding:0px !important;
}

.jurado .card-content p {
  margin:0;
}

.jurado .card-image p , .jurado .card-image a {
  margin:0 !important;
}

.jurado .card-title {
  font-size: 1em !important;
  font-weight: bold;
  text-align: center;
  margin:0 !important;
}

.jurado-instagram {
  padding: 10px 0 5px 0 !important;
}

.info {
  border:1px solid #e0e0e0;
}

.card-title {
  font-family: 'Montserrat', sans-serif;
}

.card-title i.right {
  margin-left: 0;
}

.card-content {
    padding: 17px !important;
}

.premio {
  width:100%;
}

.premio li {
  line-height:20px;
  font-size:1.1em;
  color:#757575;
  background:#f3e5f5;
  margin-bottom:5px;
  padding:10px 5px;
}

.premio i {
  font-size:16px;
  margin-right:5px;
}

.workshop {
  background:url('../images/foto02.jpg') center no-repeat;
  background-size: cover;
  min-height:600px;
  line-height: normal;
}

.workshop h5 {
  font-weight:bold;
}

.workshop-box {
  height:560px;
  margin-top:10px;
}

.workshop-border {
  margin:5px;
  padding:5px;
  border:3px solid white;
  height:100%;
}

.workshop-price  {
  font-weight:bold;
  line-height:40px;
  font-size:40px;
}

.workshop-currency  {
  font-weight:normal;
  line-height:20px;
  font-size:20px;
  text-transform:uppercase;
  padding-left:5px;
}

.workshop-day  {
  font-size:100px;
  font-weight:bold;
  line-height:90px;
}

.workshop-day em {
  font-size:50px;
}

.workshop-month  {
  font-size:24px;
}

.workshop-hour  {
  font-size:28px;
}

.icon-block h2 , .icon-block h4  {
  margin:0;
  padding:0;
}

.footer-copyright , .footer-copyright .row {
  margin:0 !important;
  padding:0 !important;
}

.agenda-post{
  position:relative;
  width:100%;
  height:150px;
  margin:0 auto;
}

.agenda {
  top:0em;
  left:1em;
  margin:10px 0 0 0;
  padding:5px;
  width:100%;
  background:#ededef;
  background: -webkit-gradient(linear, left top, left bottom, from(#ededef), to(#ccc));
  background: -moz-linear-gradient(top,  #ededef,  #ccc);
  font-size:5em;
  font-weight:bold;
  text-align:center;
  color:#000;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  border-radius:3px;
  -moz-box-shadow:0 2px 2px #888;
  -webkit-box-shadow:0 2px 2px #888;
  box-shadow:0 2px 2px #888;
}

.agenda em {
  display:block;
  font-size: 20px;
  font-family: 'Montserrat', sans-serif;
  font-style: normal;
  color:#fff;
  background:#4527a0;
  -moz-border-radius-bottomright:3px;
  -webkit-border-bottom-right-radius:3px;
  border-bottom-right-radius:3px;
  -moz-border-radius-bottomleft:3px;
  -webkit-border-bottom-left-radius:3px;
  border-bottom-left-radius:3px;
  border-top:1px solid #00365a;
  text-transform:uppercase;
}

.agenda-detalle {
  background: #d7d7d8 !important;
  font-size: 16px !important;
  font-weight: normal !important;
  border:none !important;
  text-transform: lowercase !important;
}

.agenda:before, .calendar:after{
	content:'';
	float:left;
	position:absolute;
	top:5px;
	width:8px;
	height:8px;
	background:#111;
	z-index:1;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	-moz-box-shadow:0 1px 1px #fff;
	-webkit-box-shadow:0 1px 1px #fff;
	box-shadow:0 1px 1px #fff;
}
.agenda:before{left:11px;}
.agenda:after{right:11px;}

.agenda em:before, .calendar em:after{
	content:'';
	float:left;
	position:absolute;
	top:-5px;
	width:4px;
	height:14px;
	background:#dadada;
	background:-webkit-gradient(linear, left top, left bottom, from(#f1f1f1), to(#aaa));
	background:-moz-linear-gradient(top,  #f1f1f1,  #aaa);
	z-index:2;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
}
.agenda em:before{left:13px;}
.agenda em:after{right:13px;}

.main-example {
  margin: 0 auto;
  width: 355px;
}
.main-example .countdown-container {
  height: 130px;
}
.main-example .time {
  border-radius: 5px;
  box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
  display: inline-block;
  text-align: center;
  position: relative;
  height: 95px;
  width: 65px;

  -webkit-perspective: 479px;
  -moz-perspective: 479px;
  -ms-perspective: 479px;
  -o-perspective: 479px;
  perspective: 479px;

  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;

  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);

  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.main-example .count {
  background: #202020;
  color: #f8f8f8;
  display: block;
  font-size: 2.7em;
  line-height: 2.4em;
  overflow: hidden;
  position: absolute;
  text-align: center;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
  top: 0;
  width: 100%;

  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);

  -webkit-transform-style: flat;
  -moz-transform-style: flat;
  -ms-transform-style: flat;
  -o-transform-style: flat;
  transform-style: flat;
}
.main-example .count.top {
  border-top: 1px solid rgba(255,255,255,0.2);
  border-bottom: 1px solid rgba(255,255,255,0.1);
  border-radius: 5px 5px 0 0;
  height: 50%;

  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
}
.main-example .count.bottom {
  background-image: linear-gradient(rgba(255,255,255,0.1), transparent);
  background-image: -webkit-linear-gradient(rgba(255,255,255,0.1), transparent);
  background-image: -moz-linear-gradient(rgba(255,255,255,0.1), transparent);
  background-image: -ms-linear-gradient(rgba(255,255,255,0.1), transparent);
  background-image: -o-linear-gradient(rgba(255,255,255,0.1), transparent);
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  border-radius: 0 0 5px 5px;
  line-height: 0;
  height: 50%;
  top: 50%;

  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  -o-transform-origin: 50% 0;
  transform-origin: 50% 0;
}
.main-example .count.next {
}
.main-example .label {
  color: #d81b60;
  margin-top: 5px;
  display: block;
  position: absolute;
  top: 95px;
  width: 100%;
  text-transform: uppercase;
}
/* Animation start */
.main-example .count.curr.top {
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  transform: rotateX(0deg);
  z-index: 3;
}
.main-example .count.next.bottom {
  -webkit-transform: rotateX(90deg);
  -moz-transform: rotateX(90deg);
  -ms-transform: rotateX(90deg);
  -o-transform: rotateX(90deg);
  transform: rotateX(90deg);
  z-index: 2;
}
/* Animation end */
.main-example .flip .count.curr.top {
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;

  -webkit-transform: rotateX(-90deg);
  -moz-transform: rotateX(-90deg);
  -ms-transform: rotateX(-90deg);
  -o-transform: rotateX(-90deg);
  transform: rotateX(-90deg);
}
.main-example .flip .count.next.bottom {
  -webkit-transition: all 250ms ease-in-out 250ms;
  -moz-transition: all 250ms ease-in-out 250ms;
  -ms-transition: all 250ms ease-in-out 250ms;
  -o-transition: all 250ms ease-in-out 250ms;
  transition: all 250ms ease-in-out 250ms;

  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  transform: rotateX(0deg);
}

.sending {
	border-radius: 50%;
	max-width: 43px;
}

/*
	---------------------------------------------------
	MAIL CONTENT
	---------------------------------------------------
*/

.mail-back {
  display: none;
}

.mail-back .fa {
	margin: 25px 0;
}

p.thanks-title {
	font-size: 35px;
	font-weight: 200;
	margin: 0;
	text-shadow: 0 1px 1px #fff;
}

p.thanks-msg {
	margin: 0 0 40px;
}

.mail-body {
	padding: 20px;
	margin-bottom: 5px;
}

.mail-body .input-container {
	margin-bottom: 20px;
}

/*
	---------------------------------------------------
	LOADING PANEL
	---------------------------------------------------
*/

.loading {
	width: 100%;
	height: 100%;
	text-align: center;
	font-size: 10px;
	position: absolute;
  top:0;
  left: 0;
	background: rgba(0, 0, 0, 0.65);
	display: none;
	z-index: 9999;
	color: #fff;
}

.loading > p {
	font-size: 30px; font-weight: 200;
}

.loading > div {
	background-color: #fff;
	height: 30px;
	width: 3px;
	margin-top: 215px;
	display: inline-block;
}

/*
	---------------------------------------------------
	ANIMATIONS
	---------------------------------------------------
*/

@-webkit-keyframes fadein {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

.loading > div {
	-webkit-animation: stretchdelay 1.2s infinite ease-in-out;
	animation: stretchdelay 1.2s infinite ease-in-out;
}

.loading .rect2 {
	-webkit-animation-delay: -1.1s;
	animation-delay: -1.1s;
}

.loading .rect3 {
	-webkit-animation-delay: -1.0s;
	animation-delay: -1.0s;
}

.loading .rect4 {
	-webkit-animation-delay: -0.9s;
	animation-delay: -0.9s;
}

.loading .rect5 {
	-webkit-animation-delay: -0.8s;
	animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
	0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
	20% { -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
	0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); }
	20% { transform: scaleY(1.0); -webkit-transform: scaleY(1.0); }
}

@media screen and (max-width: 48em) {
  .main-example {
    width: 100%;
  }
  .main-example .countdown-container {
    height: 100px;
  }
  .main-example .time {
      height: 70px;
      width: 48px;
  }
  .main-example .count {
    font-size: 1.5em;
    line-height: 70px;
  }
  .main-example .label {
    font-size: 1em;
    top: 72px;
  }
}

@media screen and (max-width: 1070px) {
  .workshop-day  {
    font-size:80px;
    line-height:70px;
  }
}

@media screen and (max-width: 950px) {
  .workshop-price  {
    line-height:24px;
    font-size:24px;
  }

  .workshop-day  {
    font-size:70px;
    line-height:60px;
  }

  .workshop-day em {
    font-size:30px;
  }

  .workshop-hour  {
    font-size:24px;
  }
}

@media screen and (max-width: 800px) {
  .workshop {
    background-position:left;
  }

  .card-title {
    font-size: 20px !important;
  }
}

@media (min-width:600px) and (max-width:800px) {
  .jurado {
    width: 160px;
  }

  .cultural img {
    margin:15px 25px;
  }
}

@media screen and (max-width: 700px) {
  .card-title {
    font-size: 18px !important;
  }

  .cultural img {
    margin:15px 25px;
  }
}

@media screen and (max-width: 680px) {
  .card-title {
    font-size: 16px !important;
  }

  .workshop h4  {
    font-size:2.0em;
  }

  .workshop-price  {
    line-height:20px;
    font-size:20px;
  }

  .workshop-day  {
    font-size:50px;
    line-height:50px;
  }

  .workshop-hour  {
    font-size:20px;
  }
}


@media screen and (max-width: 600px) {
  .jurado {
    width: 180px;
  }

  .card-title {
    font-size: 24px !important;
  }

  .workshop {
    height: 910px !important;
    background-position:center;
  }

  .workshop-box {
    height:auto;
  }

  .workshop-day {
    font-size: 50px;
    line-height: 50px;
  }

  .workshop-day em {
    font-size:18px;
  }

  .workshop-month {
    font-size: 16px;
  }

  .workshop-hour {
    font-size: 18px;
  }

  .workshop-price {
    font-size: 18px;
  }

  .workshop p  {
    font-size:16px;
  }

  .workshop h4  {
    font-size: 1.7em;
  }

  .workshop h5  {
    font-size: 1.3em;
  }

  .workshop-border,  .workshop-border h3 , .workshop-border h4 , .workshop-border h5 , .workshop-border p {
    margin:0;
  }
}

@media screen and (max-width: 550px) {
  .menu-redes {
    position: fixed;
    top: 75px;
    right: 35%;
  }

  .navbar-fixed , .navbar-fixed nav, .nav-wrapper {
    height: 125px !important;
  }

  .referencia {
    height: 130px;
    margin-top: -115px;
  }
}

@media screen and (max-width: 450px) {
  h3 {
    font-size: 2.6em;
  }

  h4 {
    font-size: 2em;
  }

  .menu-redes {
    right: 30%;
  }


  .agenda em {
    font-size: 15px;
  }

  .inscripciones {
    padding:50px 25px !important;
  }
}

@media screen and (max-width: 390px) {
  .workshop h4  {
    font-size: 1.4em;
  }
}

@media screen and (max-width: 350px) {
  h3 {
    font-size: 2.1em;
  }

  h4 {
    font-size: 1.7em;
  }

  .menu-redes {
    right: 25%;
  }

  .workshop h4  {
    font-size: 1.3em;
  }
}

#header .sidenav a , #header .sidenav i {
  height: 90px;
  line-height: 90px;
}

#header .sidenav i {
  font-size:18px;
}

#header .sidenav a {
  font-weight: normal !important;
  text-transform: uppercase !important;
}

#header .sidenav .divider {
  margin:0 !important;
}

#header .sidenav-trigger {
  top: 17px;
  left: -5px;
}
