//Estilos de la vista global de calendario.
.view-eventos {

	.view-filters {
		border: 1px solid $c-silver;
		padding: 1%;
		margin-bottom: 1em;

		.views-exposed-widgets {
			margin: 0;

			> div {
				margin-right: 3%;
				padding: 0;
				width: 24%;
			}

			label {
				font-size: 0.9em;
				font-weight: bold;
				margin-bottom: 9px;
				padding: 0;
			}

			.form-text {
				@include input-text;
			}

			.views-widget-filter-title{
				.form-item-title{
					label{
						display: none;
					}

					input[type="text"]{
						color: $c-b-gray;
						text-transform: capitalize;
					}
				}
			}

			.views-submit-button {
    			float: right;
    			margin: 30px 0 0 0;
				width: auto;

    			.form-submit {
    				@include button;
    			}
			}
		}
	}
	
	.not-calendar {
		.views-row-first {
			width: 23.8%;

			.block-event {
				width: 100%;
			}
		}

		.views-row-11,
		.views-row-7,
		.views-row-3 {
			margin-right: 1%;
		}

		.views-row {
			&:nth-child(4n) {
				margin-right: 0;
			}		
		}
		
	}

	.views-row {
		@include inline-block(top);
		border: 1px solid shade($c-brand-whitesmoke, 10);
		box-shadow: 2px 2px 1px shade($c-brand-whitesmoke, 20);
		margin: 0 1% 1em 0;
		padding-bottom: 50px;
		position: relative;
		text-align: center;
		width: 23.7%;

		.event-image {
			img {
				width: 100%;
			}
		}
		
		.event-date {
			background: shade($c-blue-menu, 20);
			padding: 10px;
			text-align: center;
				
			.date-display-single {
				color: $c-white;
				display: block;
    			font-size: 1.1em;
				font-weight: 100;
			}

			> .date-display-single {
				font-size: 1.3em;
				font-weight: 500;
				margin-bottom: 3px;
				padding-bottom: 10px;
				
				@include line-text(after, 50%, $c-white, 30px);
					
					&:after {
						margin-left: -15px;
					}
				}	
			}

			.event-title {
				line-height: 1.2;
				margin-top: 10px;
				padding: 2%;

				a, a:link {
					color: shade($c-brand-green-lawn, 20);
					font-size: 1.1em;
					font-weight: 400;
				}
			}

			.event-city {
				color: $c-dimgray;
    			font-size: 0.9em;
			}
			
			.event-end-date {
				border-top: 1px solid shade($c-brand-whitesmoke, 10);
				margin-top: 3em;

 				@media (min-width: $s-sms) {
 					bottom: 0;
					position: absolute;
					margin: 0;
					width: 100%;
 				}

				span {
					color: $c-dimgray;
					display: block;
					font-size: 0.9em;
					font-weight: bold;
				}

				.date-display-single {
					font-size: 1em;
					font-weight: 100;
				}
			}
		}

		.views-row-first {
			box-shadow: none;
			border: 1px solid transparent;
			padding-bottom: 0; 
			width: 49.1%;

			.views-fieldset {
				display: initial;
				height: 100%;
			}

			.views-field-views-conditional {
				height: 100%;

				.field-content {
					height: 100%;
				}
			}

			.block-event {
				box-shadow: 2px 2px 1px shade($c-brand-whitesmoke, 20);
    			border: 1px solid shade($c-brand-whitesmoke, 10);
    			float: right;
    			margin-right: 0;
    			padding-bottom: 50px; 
    			position: relative;
        		width: 48.47%;
        		height: 100%!important;
			}
		}

	.event-calendar {
   		border: 1px solid shade($c-brand-whitesmoke, 10);
   		border-bottom: 10px solid #678e00;
		box-shadow: 2px 2px 1px shade($c-brand-whitesmoke, 20);
    	float: left;
    	height: 100%;
    	padding-bottom: 40px;
        width: 48.47%;

        .today {
        	background: shade($c-brand-green, 10);
   	 		border-bottom: 1px solid tint($c-brand-green, 40);
        	color: $c-white;
        	display: block;
    		font-size: 115%;
    		font-weight: 100;
    		margin-bottom: 0;
   		 	padding: 3px 0;
    		text-transform: uppercase;
        }

        .dayofweek {
        	background: shade($c-brand-green, 10);
        	color: $c-white;
        	display: block;
        	font-size: 115%;
        	margin-bottom: 0;
   	 		font-weight: 100;
   	 		padding-top: 0.5em;
		}
        	
    	.daynumber {
        	background: shade($c-brand-green, 10);
        	color: $c-white;
        	display: block;
        	margin-bottom: 0;
    		font-size: 160%;
    		padding-bottom: 0.5em;
    	}

        .mini {
        	background: $c-white;
        	border-radius: 0;
        	text-align: center;

        	th {
        		background: none;
        		border: none;
        		font-size: 0.9em;
        		color: $c-black;
        	}

        	tr {
        		background: none;
        	}

        	td {
    			color: $c-black;
    			font-size: 0.9em;
    			font-weight: 100;
    			padding: 7px;
				
				&.today {
					.month {
						background: shade($c-brand-whitesmoke, 10);
						border-radius: 50%;
					}
				}
        	}

        	.mini-day-on {
        		a, a:link {
        			color: shade($c-blue-menu, 20);
    				font-weight: bold;
        			text-decoration: none;
        		}
        	}
        }

        .view-header {
        	.date-nav  {
        		border-bottom: 1px solid shade($c-brand-whitesmoke, 10);
        		margin-bottom: 10px ;
        		padding: 10px 0;

	        	h3 {
	        		font-size: 1em;
	        		font-weight: normal;

	        		a, a:link {
		        		color: $c-dimgray;
		        		font-weight: normal;
	        		}
	        	}
        	}

        	.pager {
    			display: inline-block;
        		margin: 0 0 0 -25%;
    			position: absolute;
    			left: 50%;
    			top: 8px;
        		width: 50%;

        		li {
					a, a:link {
						@include imgreplace;
						background: url('../images/sprite.png') no-repeat -159px -17px;
						font-size: 0;
						height: 13px;
						margin-top: 11px;
						width: 13px;
        			}
        		}

				.date-prev {
					background: none;
					left: 0;
					padding: 0;
					width: 16px;
				}

				.date-next {
					background: none;
					padding: 0;
					width: 16px;

					a, a:link {
						background-position: -159px -36px;
					}
				}
        	}
        }
	}

	.views-row-11,
	.views-row-7,
	.views-row-3 {
		margin-right: 0;
	}

	.view-footer {
		margin-top: 2em;
		text-align: right;

		a, a:link {
			color: $c-brand-green-dark;
			font-weight: 100;
			font-size:  1.4em;
			padding: 5px 35px 5px 0px;
			position: relative;

			&:after {
				@include size(29px);
				background: url('../images/sprite.png') no-repeat -149px -92px;
				content: '';
				display: inline-block;
				position: absolute;
				right: 0;
				margin-top: -14px;
				top: 50%;
			}

			&:hover {
				text-decoration: none;
			}
		}
	}
}