.shadow{
	box-shadow: 0 0 4px 0 rgba(0,0,0,.5);
	transition: box-shadow 0.5s ease-in-out;
}

@media only screen and (max-width: 768px) {
 	.grid-sizer,
	.grid-item { 
		width: 33.3333%;
	}
 	.w_x2 { width:  66.6666%; }
	.w_x3 { width:  100%; }

	.sec {
	    padding: 10px 0;
	    width: 90%;
	    margin: 0 auto;
	    text-transform: uppercase;
	    font-size: 12px;
	}
/*
	.left{
		display: none;
	}

	.right{
		width: 100%;
	}
*/
	.index {
	 	width: 100%;
	  	transition: margin-left .4s;
	}

	.section {
	 	width: 100%;
	 	margin-top: 85px;
	}

	#logo_top{
		display: block;
		text-align: center;
		width: 100%;
		margin: 0 auto;
		background-color: #fff;
		z-index: 2;
		position: fixed;
		top:0;
		height: 85px;
	}

	#logo_top .logo{
		width: auto;
		height: 85px;
		padding: 5px;
	}

	#open_menu{
		display: block;
		z-index: 3;
		position: fixed;
		top: 56px;
    	left: 3px
	}

/* Menú */
	#open_menu div {
		width: 26px;
	    height: 3px;
	    background-color: #435465;
	    margin: 4px 0;
	}

	.container {
	  display: inline-block;
	  cursor: pointer;
	}

	.bar1, .bar2, .bar3 {
	  width: 35px;
	  height: 5px;
	  background-color: #333;
	  margin: 6px 0;
	  transition: 0.4s;
	}

	/* Rotate first bar */
	.change .bar1 {
	  -webkit-transform: rotate(-45deg) translate(-6px, 6px) ;
	  transform: rotate(-45deg) translate(-6px, 6px) ;
	}

	/* Fade out the second bar */
	.change .bar2 {
	  opacity: 0;
	}

	/* Rotate last bar */
	.change .bar3 {
	  -webkit-transform: rotate(45deg) translate(-4px, -4px) ;
	  transform: rotate(45deg) translate(-4px, -4px) ;
	}

	.grid-in {
		margin-top: 85px;
	}

	.footer{
		position: fixed;
		bottom: 5%;
		width: 130px;
	}

	.footer .btn-circle {
	  	width: 30px;
	    height: 30px;
	    padding: 4px 0;
	    border-radius: 15px;
	    text-align: center;
	    font-size: 15px;
	    margin: 0 4px;
	}

	/* The side navigation menu */
	.sidenav {
	  	height: 100%;
		width: 130px;
		position: fixed;
		z-index: 1;
		top: 0;
		left: -130px;
		background-color: #fff;
		overflow-x: hidden;
		transition: 0.4s;
		margin-top: 85px;
		padding-top: 15px;
	}
	
	.sidenav .logo{
		display: none;
	}

	.ml_open{
		left: 0px;
		/*box-shadow: 0 0 4px 0 rgba(0,0,0,.5);*/
	}

	.m_open{
		margin-left: 130px;
		width: calc(100% - 130px) !important;

	}

	/* Desactivando hovers */
	.grid-item a:hover div {
		opacity: 0;
	}

	.grid-item:hover a div h3 {
		opacity: 0;
	}

	.formulario {
		width: 80%;
	}

	#overbox-cookies .popup-content #popup-text .image {
	    width: 70px;
	    height: 66px;
	    background: url(../img/cookies-monster-70.png) no-repeat;
	    top: -26px;
	}

	#overbox-cookies .popup-content #popup-text{
		/*width: 296px;*/
		width: 72%;
		/*padding: 4px 0 0 10px;*/
		padding: 4px 0 0 0.2%;
	}

	#overbox-cookies .popup-content #popup-text p {
	    font-size: 12px;
	    line-height: 16px;
	}

	#overbox-cookies .popup-content #popup-buttons {
    	margin: 3px 12px 0 0;
    }

}


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

	.sobre-mi img.pic {
    	float: none;
    	width: 100%;
    	margin: 0;
    	max-width: none;
    	min-width: 0;
    }

    .sobre-mi p {
    	padding: 0 10px;
	}

    .sobre-mi p.logos {
    	padding: 10px 5px;
    }

    .formulario {
		width: 95%;
	}

}

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

	#overbox-cookies .popup-content {
	    height: 58px;
	}

	#overbox-cookies .popup-content #popup-text {
		width: 60%;
		padding: 4px 0 0 2%;
	}

	#overbox-cookies .popup-content #popup-buttons {
	    margin: 12px 12px 0 0;
	}
	
	#overbox-cookies .popup-content #popup-text .image {
	    top: -12px;
	}
}