.cal-evento{ max-width:1100px; margin:0 auto;}
.cal-evento h3{ font-weight:normal; margin:20px 0 10px;}
.cal-evento h3 i{ font-weight:100;}
.cal-evento .detalles{ color:#666; font-size:15px; margin:25px 0;}
.cal-evento .mas_info{ margin-bottom:25px;}
.cal-evento .gal{ border-left:1px solid #DDD; padding-left:30px;}
.cal-evento .info1{ padding-right:30px;}
.cal-evento .precios_gratis{ font-weight:bold; font-size:16px; margin-bottom:5px;}
.cal-evento .precios1{ margin-bottom:5px;}
.cal-evento .precios2{ margin-bottom:5px;}
.cal-evento .precios_detalles{ font-style:italic; color:#666; margin-bottom:5px;}
.cal-evento .edad_minima{ margin-top:25px;}



.cmm{ position:relative; }
.cmm .left{ top:0px; left:0px; position:absolute; z-index: 10; }
.cmm .right{ top:0px; right:0px; position:absolute; z-index: 10; }
.cmm .left a, .cmm .right a{ display:inline-block; padding:11px; box-sizing:border-box; height:40px; width:40px; background-color:#F5F5F5; border-radius:50%; vertical-align:middle; text-align:center; margin:8px; border: 1px solid #DDD; }
.cmm .left a:hover, .cmm .right a:hover{ background-color:#666; }
.cmm .left i, .cmm .right i{ color:#333; font-size:16px; vertical-align:top; }
.cmm .left a:hover i, .cmm .right a:hover i{ color:#FFF; }

.calendar{ position:relative; margin: 5px;}
.calendar .load{ position:absolute; top:0; left:0; right:0; bottom:0; display:none; background-color:rgba(255,255,255,0.5);}
.calendar .fila{ display:table; width:100%; table-layout:fixed;}
.calendar .dia{ border:1px solid #DDD; width:14.285%; min-width:14.285%; max-width:14.285%; box-sizing:border-box; border-collapse:collapse; display:table-cell; color:#000; height:40px; background-color:#FFF;}
.calendar .nombredia{ line-height:40px; vertical-align:middle; text-align:center; background-color:#DDD;}
.calendar .nombredia .completo{ display:none;}
.calendar .dia.activo{ background-color:#2771A0; color:#FFF;}
.calendar .dia.hoy{ font-weight:bold; border-color:#C00;}
.calendar .dia.out{ background-color:#EEE; cursor:default;}
.calendar .dia.act{ border-bottom:8px solid #72747C;}
.calendar .dia.coneventos:hover{ background-color:#F5F5F5; cursor:pointer;}
.calendar .dia .num{ text-align:center; font-size:15px; color:#333; font-weight:bold; padding:4px 4px 0 4px; }
.calendar .top{ padding:10px; background-color:#FFF; position:relative;}
.calendar .nombremes{ text-align:center;}
.calendar .nombremes .ano{ font-size:18px; font-weight:bold; color:#999;}
.calendar .nombremes .mes{ font-size:26px; line-height: 20px; text-transform:lowercase; margin:0; font-weight:300;}
	
.calendar .dia .eventos{ text-align:center;}
.calendar .dia .evento{ border:1px solid #DDD; margin:1px; padding:1px; box-sizing:border-box; display:inline-block;}
.calendar .dia .evento .color{ width:10px; min-width:10px; max-width:10px; height:10px;}
.calendar .dia .evento .nombre{display:none;}
.calendar .dia .maseventos{ text-align:center; color:#999; line-height:5px; margin-bottom:6px;}

.calendar .detalles_fila{ display:none; border:1px solid #72747C; border-top:3px solid #72747C; padding:10px 12px;}
.calendar .detalles_d{ display:none;}
.calendar .detalles_d .evento{ border:1px solid #DDD; margin:5px 0px; padding:5px; box-sizing:border-box; display: -webkit-flex; display: -moz-flex; display:flex; cursor:pointer; position:relative;}
.calendar .detalles_d .evento:hover{ background-color:#F5F5F5;}
.calendar .detalles_d .evento .color{ -webkit-flex: 1; -moz-flex: 1; flex: 1; width:46px; min-width:46px; max-width:46px; height:46px; margin-right:8px; background-color:#EEE;}
.calendar .detalles_d .evento .info{ min-width: 0; display:block; width:100%;}
.calendar .detalles_d .evento .info .nombre{ font-size:17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width:100%; display:block;}
.calendar .detalles_d .evento .info .detalles{ font-size:15px; color:#888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width:100%; display:block;}
.calendar .detalles_d .evento .arrow{ -webkit-flex: 1; -moz-flex: 1; flex: 1; width:35px; min-width:35px; max-width:35px; height:35px; text-align:right;}
.calendar .detalles_d .evento .arrow i{ margin-top:10px; margin-right:4px; color:#AAA;}

.cml .evento{ border:1px solid #DDD; margin:0px 0px 15px; padding:5px; box-sizing:border-box; display: -webkit-flex; display: -moz-flex; display:flex; cursor:pointer; position:relative;}
.cml .evento:hover{ background-color:#F5F5F5;}
.cml .evento .foto{ -webkit-flex: 1; -moz-flex: 1; flex: 1; width:90px; min-width:90px; max-width:90px; height:90px; margin-right:10px; background-color:#F5F5F5; background:no-repeat center center #F5F5F5; background-size:contain;}
.cml .evento .info{ min-width: 0; display:block; width:100%;}
.cml .evento .info .nombre{ font-size:22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width:100%; display:block;}
.cml .evento .info .detalles{ font-size:15px; color:#888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width:100%; display:block;}
.cml .evento .info .fecha{ font-size:18px; color:#536A7A; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width:100%; display:block;}
.cml .evento .arrow{ -webkit-flex: 1; -moz-flex: 1; flex: 1; width:35px; min-width:35px; max-width:35px; height:35px; text-align:right;}
.cml .evento .arrow i{ margin-top:30px; margin-right:4px; color:#AAA;}


@media screen and (min-width: 990px) {
	
	.calendar.lg .nombredia.dia{ height:40px; text-align:center; cursor:default;}
	.calendar.lg .nombredia .inicial{ display:none;}
	.calendar.lg .nombredia .completo{ display:block;}
	.calendar.lg .dia{ height:110px;}
	.calendar.lg .dia .num{ text-align:right; font-size:13px; color:#333; font-weight:bold; padding:4px 8px 0 4px; }
	
	.calendar.lg .dia .eventos{ text-align:left;}
	.calendar.lg .dia .evento{ border:1px solid #DDD; margin:3px 6px; padding:2px; box-sizing:border-box; display: -webkit-flex; display: -moz-flex; display:flex;}
	.calendar.lg .dia .evento .color{ -webkit-flex: 1; -moz-flex: 1; flex: 1; width:19px; min-width:19px; max-width:19px; height:19px; margin-right:4px; background-color:#EEE;}
	.calendar.lg .dia .evento .nombre{ font-size:13px;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; display:block;}
	.calendar.lg .dia .maseventos{ text-align:center; color:#999; line-height:5px; margin:10px 0;}
	
	.cml-lg .evento{ width:49%; float:left; margin:5px 0.5%;}
}

@media screen and (max-width: 480px) {
	.cal-evento{ padding: 0 15px;}
	.cal-evento .gal{ border-left:none; padding-left:0;}
}