/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */

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

}

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

}

/* Medium Devices, Desktops */

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

/* Small Devices, Tablets */

@media only screen and (max-width: 768px) {
	.karina-img {
		width: 90%;
	}

	.img-logo {
		width: 5%;
	}

	.box-title {
		margin-top: 0;
		width: 50%;
		height: auto;
		font-size: 7em;
		float: right;
	}

	.big-about {
		font-size: 2em;
	}

	.box-title span {
		width: auto;
		height: auto;
		margin-top: 50%;
	}

	.big-about p {
		margin-top: 5%;
		float: left;
	}

	.about-me-text {
		padding-left: 2%;
	}
}



/* Extra Small Devices, Phones */

@media only screen and (max-width: 480px) {
	.karina-img {
		width: 100%;
	}

	.img-logo {
		width: 7%;
	}
	.img-social {
		width: 15%;
	}
	.social-links span {
		font-size: 1em;
	}
	.modal-body a {
		font-size: 0.7em;
	}
	.about-me-text {
		width: 80%;
	}
	.big-about {
		font-size: 2em;
	}
	.box-title {
		font-size: 5em;
	}
	.box-title span {
		margin-left: 3%;
	}
	.about-me-text {
		padding-left: 3%;
	}
	.portfolio-header span {
		float: left;
		margin-left: 5%;
		line-height: 0;
		margin-bottom: 5%;
	}
	.portfolio-header img {
		width: 20%;
	}
	.contact h1 {
		font-size: 2em;
	}
	.contact img {
		display: none;
	}

	.contact span {
		float: left;
		line-height: 0;
		margin: 5% 0 15% 0;
	}
}

/* Custom, iPhone Retina */

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




@media screen and (min-width: 576px) {
	.grid-sizer {
		width: 50%;
	}
	.grid-item {
		width: 50%;
	}
}

@media screen and (min-width: 768px) {
	.grid-sizer {
		width: 33.3333%;
	}
	.grid-item {
		width: 33.3333%;
	}
}

@media screen and (min-width: 992px) {
	.grid-sizer {
		width: 25%;
	}
	.grid-item {
		width: 25%;
	}
}

@media screen and (min-width: 1200px) {
	.grid-sizer {
		width: 20%;
	}
	.grid-item {
		width: 20%;
	}
}