/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}

@media only screen 
and (max-device-width : 767px) {
	img {
	    width: 100%;
	    height: auto;
	}
	#header {
    	position: relative;
    }
    #header .responsive-social {
		display: block;
	    position: relative;
	    width: 100%;
	    float: left;
	}
	#sidebar {
		display: none;
	}
	#header .responsive-social #sidebar {
		display: block;
	    width: 100%;
	    position: relative;
	    margin: 10px 0;
	    min-height: auto;
	}
	#header .responsive-social #sidebar .sidebar-box {
		width: 100%;
	}
	#header .responsive-social #sidebar .sidebar-box .textwidget {
	    padding:  0;
	    margin: 0;
	}
	#header .responsive-social #sidebar .sidebar-box .textwidget a {
	    width: 25%;
	    float: left;
	    text-align: center;
	}
	#header .responsive-social #sidebar .sidebar-box .textwidget a img {
	    height: auto;
	    width: auto;
	    vertical-align: middle;
	}
	#main-container {
	    width: 100%;
	}
	.center {
	    margin: 0 5% auto;
	    width: 90%;
	}
	#content-container {
	    width: 100%;
	    padding-top: 0;
	}
	#content {
		margin-top: 0;
	    width: 100%;
	}
	#content iframe {
		width: 100% !important;
		height: auto !important;
	}
	#gallery {
		width: 100% !important;
	}
	#gallery div {
		width: 100% !important;
	}
	.portfolio-item {
		width: 100%;
	}
	.page-wrapper {
		width: 100% !important;
	}
	.layout-left #content {
		margin-left: 0;
	}
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
}