/********************************************************************************************* 

x. Smaller than 1800px

*********************************************************************************************/
@media only screen and (max-width:1800px) {
	
	#recently-sold .grid li.property, #team-members .grid li.headshot {
		width: 25%;
	}
	
}

/********************************************************************************************* 

x. Smaller than 1600px

*********************************************************************************************/
@media only screen and (max-width:1600px) {
	
	.margin-main {
		margin: 0 30px 0 250px;
	}
	
	#sidebar {
		width: 150px;
	}
	
	#sidebar .navigation.bottom li {
		font-size: 12px;
		line-height: 12px;
	}
	
	#sidebar .navigation.bottom .social-media li {
		font-size: 14px;
	}
	
	#sidebar .navigation.top a span.label {
		font-size: 11px;
		line-height: 11px;
	}
	
	#sidebar .navigation.top a span.number {
		font-size: 11px;
		line-height: 11px;
	}
	
	#sidebar .navigation.top .sub-menu a {
		font-size: 10px;
		line-height: 11px;
	}
	
}

/********************************************************************************************* 

x. Smaller than 1400px

*********************************************************************************************/
@media only screen and (max-width:1400px) {
	
	#recently-sold .grid li.property, #team-members .grid li.headshot {
		width: 33.33%;
	}
	
}

/********************************************************************************************* 

x. Smaller than 1300px

*********************************************************************************************/
@media only screen and (max-width:1300px) {
	
	#calculator .column-18 {
		width: 20%;
	}
	
	#calculator .column.blank {
		display: none;
	}
	
}

/********************************************************************************************* 

x. Smaller than 1200px

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	
	.margin-main {
		margin: 0 15px 0 220px;
	}
	
	.section .content.condensed {
		width: 650px;
	}
	
}

/********************************************************************************************* 

x. Smaller than 1100px

*********************************************************************************************/
@media only screen and (max-width:1100px) {
	
	#about .column-25 {
		visibility: hidden;
	}
	
	#apply .column-10 {
		width: 20%;
	}
	
	#apply .column-90 {
		width: 80%;
	}
	
	#footer {
		height: auto;
		padding: 15px 0;
	}
	
	#footer .column {
		width: 100%;
		float: none;
	}
	
	#footer .navigation {
		margin: 0 0 10px 0;
	}
	
	#footer .navigation li {
		line-height: normal;
	}
	
	#footer .credits {
		line-height: normal;
		text-align: left;
	}
	 	
	#realscout-widget .column-18 {
		width: 20%;
	}
	
	#realscout-widget .column.blank, #recently-sold .grid li.full-information .headshot, #statistics .column-30, #statistics .next {
		display: none;
	}
	
	#recently-sold .grid li.full-information .detailed-information {
		margin: 0;
	}
	
	#statistics .column-70 {
		width: 100%;
	}
	
}

/********************************************************************************************* 

x. Smaller than 1024px

*********************************************************************************************/
@media only screen and (max-width:1024px) {
	
	#about .title-image {
		margin-top: 0;
	}
	
	#about .triangle, #sidebar .navigation.bottom .line {
		display: none;
	}
	
	#articles {
		margin: 60px 0 0 0;
	}
	
	#blog {
		box-shadow: inset 0 10px 10px -10px #bbbbbb;
		-moz-box-shadow: inset 0 10px 10px -10px #bbbbbb;
		-webkit-box-shadow: inset 0 10px 10px -10px #bbbbbb;
	}
	
	#categories.padding, .section.divider, .hero {
		padding: 0;
	}
	
	#contact, #footer, #sidebar, #wrapper {
		position: relative;
	}
	
	#contact {
		width: auto;
		box-shadow: inset 0 10px 10px -10px #bbbbbb;
		-moz-box-shadow: inset 0 10px 10px -10px #bbbbbb;
		-webkit-box-shadow: inset 0 10px 10px -10px #bbbbbb;
		padding: 30px 80px 30px 30px;
		position: absolute;
		top: auto; bottom: 100%;
		left: 0; right: 0;
	}
	
	#contact form {
		position: static;
	}
	
	#footer {
		padding: 30px 0;
	}
	
	#footer .credits {
		text-align: left;
	}
	
	#footer .navigation {
		margin: 0 0 15px 0;
	}
	
	.gallery-wrapper .caption {
		bottom: 30px;
	}
	
	.hero {
		max-height: 600px;
		min-height: 600px !important;
	}
	
	.hero .title, .hero.large .title {
		margin-top: 0 !important;
		top: 30px;
	}
	
	.hero.small {
		height: 600px !important;
	}
	
	.margin-main {
	    margin: 0 30px;
	}
	
	.page-id-6 .hero {
		padding: 0;
	}
	
	.section {
		padding: 60px 0;
	}
	
	.section.fixed {
		position: static;
	}
	
	.section.offset {
		border-top: 10px solid #fff;
		margin-top: 0 !important;
	}
	
	#sidebar {
		width: auto;
		box-shadow: none;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		padding: 30px;
		position: relative;
		top: 0; bottom: auto;
		left: 0;
	}
	
	#sidebar .hamburger {
		display: block;
	}
	
	#sidebar .logo {
		width: 175px;
		padding: 0;
	}
	
	#sidebar .navigation.bottom {
		margin: 40px 0 0 0;
		position: relative;
		bottom: 0;
		left: 0; right: 0;
		overflow: hidden;
	}
	
	#sidebar .navigation.bottom li {
		font-size: 16px;
		line-height: 22px;
		padding: 0;
		float: left;
	}
	
	#sidebar .navigation.bottom li.last {
		float: right;
	}
	
	#sidebar .navigation.bottom li.contact {
		display: none;
	}
	
	#sidebar .navigation.bottom .social-media li {
		font-size: 22px;
		line-height: 22px;
		padding: 0 0 0 20px;
	}
	
	#sidebar .navigation.top { 
		text-align: left;
		width: 190px; height: auto;
		background: #fff;
		box-shadow: inset 10px 0 10px -10px #bbbbbb;
		-moz-box-shadow: inset 10px 0 10px -10px #bbbbbb;
		-webkit-box-shadow: inset 10px 0 10px -10px #bbbbbb;
		padding: 30px;
		position: fixed;
		top: 0; bottom: 0;
		left: auto; right: -250px;
		overflow: auto;
	}
	
	#sidebar .navigation.top li {
	    padding: 0 0 20px 0;
	}
	
	#sidebar .navigation.top li.first {
		display: none;
	}
	
	#sidebar .navigation.top li.hide {
		display: block;
	}
	
	#statistics {
		padding: 30px 0;
	}
	
	#statistics .content {
		margin: 0 0 50px 0;
	}
	
}

/********************************************************************************************* 

x. Smaller than 800px

*********************************************************************************************/
@media only screen and (max-width: 800px) {
	
	* {
		-webkit-text-size-adjust: none;
	}
	
	#blog .article .content {
		width: auto;
		right: 30px;
	}
	
	#blog .article .link, .section.divider .image, .section.hero {
		background-position: 0 0 !important;
	}
	
	.button {
		-webkit-appearance: none;
	}

	#calculator .columns.top .column-18 {
		width: 25%;
	}
	
	#calculator .columns.top .column-18.first {
		width: 100%;
	}
	
	#calculator .columns.top .column-18.first .inside {
		padding: 0;
	}
	
	#calculator .columns.top .column-18.first .line:last-child {
		display: none;
	}
	
	#calculator .columns.top .column-18:nth-child(3) .inside {
		padding-left: 0;
	}
	
	#calculator form span.label, #realscout-widget form .columns.top span.label, #statistics span.label {
	    height: 2em;
    }
	
	#realscout-widget .column-18 .line:last-child {
		display: none;
	}
	
	#realscout-widget form span.label {
		text-align: left;
	}
	
	.selectric-wrapper {
	    margin: 0 -10px;
	}
	
	.selectric-align-right .label {
		text-align: left;
	}

}

/********************************************************************************************* 

x. Smaller than 770px

*********************************************************************************************/
@media only screen and (max-width: 770px) {
	
	#author {
		width: auto;
	}
	
}

/********************************************************************************************* 

x. Smaller than 760px

*********************************************************************************************/
@media only screen and (max-width: 760px) {
	
	#cities .button {
		display: block;
	}
	
	#cities iframe {
		display: none;
	}
	
	#realscout-widget form .columns.bottom {
		padding: 0;
	}
	
	#realscout-widget .columns.bottom .column-40, #realscout-widget .columns.bottom .column-60 {
		width: 100%;
		padding: 30px 0 0 0;
	}
	
	#realscout-widget .columns.bottom .column-40 .inside, #realscout-widget .columns.bottom .column-60 .inside {
		padding: 0;
	}
	
	#realscout-widget .columns.bottom .column-40 .button.align-right {
		float: none;
	}
	
	.section .content.condensed {
		width: auto;
	}
	
}

/********************************************************************************************* 

x. Smaller than 700px

*********************************************************************************************/
@media only screen and (max-width: 700px) {
	
	#about .column-25, #cities .line.separator, #neighborhoods .column-28, .page-id-12 #section-6 .column-30 {
		display: none;
	}
	
	#about .column-75, #agent-testimonials .column-30, #calculator form .columns.bottom .column-50, #client-testimonials .column-25, #client-testimonials .column-75, .hero .content, .page-id-12 .column-30, .page-id-12 .column-70, .page-id-14 .column-70, .page-id-16 .column-70 {
		width: 100%;
	}
	
	#about .title-image .image {
		margin: 0;
	}
	
	#about .title-image .title {
		position: static;
	}
	
	#calculator form, #calculator form .columns.bottom .column-50 .inside {
		padding: 0;
	}
	
	#calculator form .columns.bottom {
		padding: 30px 0 0 0;
	}
	
	#calculator form .columns.bottom .button.align-right {
		margin-right: 10px;
		float: left;
	}
	
	#calculator form .columns.bottom .button.margin-right {
		margin-right: 0;
	}
	
	#calculator form .columns.bottom .column.last {
		margin: 10px 0 0 0;
	}
    
    #cities h2, .grid li.full-information .column-33, #neighborhoods .column-36, #neighborhoods h2, #recently-sold .grid li.property, #team-members .grid li.headshot {
		width: 50%;
	}
	
	.grid li.full-information {
		padding: 30px;
	}
	
	.grid li.full-information a.close {
		top: 30px;
	}
	
	.grid li.full-information .column-33.first {
		width: 100%;
		margin: 0 0 30px 0;
	}
	
	.grid li.full-information .column-33:nth-child(2) .inside, #neighborhoods .column-36.middle .inside {
		padding-left: 0;
	}
	
	.hero.small {
		height: 500px !important;
		min-height: 500px !important;
		max-height: 500px;
	}
	
	.line.separator {
		margin: 30px 0;
	}
	
	.quotes .headshot-quote, #team-members .content.top, #team-members .grid {
		margin: 0 0 30px 0;
	}
    
    #recently-sold .grid {
	    margin: 30px 0 0 0;
    }
    
    .section {
    	padding: 30px 0;
    }
    
    .single-post .column-25, .single-post .column-75 {
	    width: 100%;
    }
    
    .single-post .column-25 .inside, .single-post .column-75 .inside {
	    padding: 0;
    }
    
    .single-post #categories {
	    margin: 15px 0 0 0;
	    text-align: left;
    }
    
    .single-post #share {
	    margin: 30px 0 0 0;
	    float: none;
    }
    
	.single-post #share li {
	    padding: 0 10px 0 0;
    }
    .home #footer {
	    position: relative;	
    }
	
}

/********************************************************************************************* 

x. Smaller than 640px

*********************************************************************************************/
@media only screen and (max-width: 640px) {
	
	.section .title.wide {
		width: auto;
	}
	
}

/********************************************************************************************* 

x. Smaller than 600px

*********************************************************************************************/
@media only screen and (max-width: 600px) {
	
	#about .column-75 .column-50, .grid li.full-information .column-33, .hero .content .column-50, #neighborhoods .column-36, .page-id-12 .column-70 .column-50, .page-id-14 .column-70 .column-50, .page-id-16 .column-70 .column-50 {
		width: 100%;
	}
	
	#about .column-75 .column-50 .inside, .grid li.full-information .column-33 .inside, .hero .content .column-50 .inside, #neighborhoods .column-36 .inside, .page-id-12 .column-70 .column-50 .inside, .page-id-14 .column-70 .column-50 .inside, .page-id-16 .column-70 .column-50 .inside {
		padding: 0;
	}
	
	#articles, .hero .content .columns, #recently-sold .grid, .section .title .blurb {
		margin: 20px 0 0 0;
	}

	#calculator form input.textfield {
		font-size: 20px;
		margin: 20px 0 0 0;
	}
	
	#calculator form span.label.margin-bottom {
		margin-bottom: 30px;
	}
	
	#contact {
		padding: 20px 60px 20px 20px;
	}
	
	#contact .close, .grid li.full-information a.close, #sidebar .hamburger {
		top: 20px; right: 20px;
	}
	
	#footer, .section {
		padding: 20px 0;
	}
	
	.gallery {
		min-height: 500px;
	}
	
	.grid li.full-information, #sidebar {
		padding: 20px;
	}
	
	.grid li.full-information .column-33.first {
		margin: 0 0 10px 0;;
	}
	
	h1.line-top .line {
		display: none;
	}
	
	.hero, .hero.small {
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
		padding: 20px 0;
	}
	
	.hero .content, .hero .meta, .hero .title, #statistics {
		position: relative;
		top: auto; bottom: auto;
	}
	
	.hero .title, .hero.large .title {
		top: 0;
	}
	
	.hero .margin-main {
		height: auto;
	}
	
	.line.separator {
		margin: 20px 0;
	}
	
	.margin-main {
		margin: 0 20px;
	}
	
	#realscout-widget form {
		padding: 20px 0 0 0;
	}
	
	.section .title {
		width: auto;
	}
	
	.section .title.wide {
		padding: 0 0 20px 0;
	}
	
	.selectric .label {
		font-size: 20px;
	}
	
	.selectric-wrapper {
		margin: 20px -10px;
	}
	
	#statistics {
		background: none;
		padding: 0;
	}
	
	#statistics .content {
		margin: 0;
	}
	
	#statistics .content .line:last-child {
		display: none;
	}
	
	#statistics span.label {
		margin: 10px 0;
	}
	
	#team-members .grid li.full-information .links {
		padding: 0;
	}

}

/********************************************************************************************* 

x. Smaller than 500px

*********************************************************************************************/
@media only screen and (max-width: 500px) {
	
	#author .quote, .serif, .serif *, #article .serif, #article .serif *, #recently-sold .grid span.location, #team-members .grid span.position {
		font-size: 14px !important;
	}
	
	#calculator form input.textfield, .divider .article-link, h3, .selectric .label, #recently-sold .grid span.address, #team-members .grid span.name {
		font-size: 16px;
	}
	
	#calculator .columns.top .column-18, #realscout-widget .column-18.forth, #realscout-widget .column-18.fifth, #statistics .column-25 {
		width: 50%;
	}
	
	#calculator .columns.top .column-18.first, #calculator .columns.top .column-18.second, #calculator .columns.top .column-18.third, #calculator .columns.top .column-18.forth, #statistics .column-25.first, #statistics .column-25.second {
		margin: 0 0 20px 0;
	}
	
	#calculator .columns.top .column-18.forth .inside, #realscout-widget .column-18.third .inside, #statistics .column-25.second .inside {
		padding-right: 0;
	}
	
	#calculator .columns.top .column-18.fifth .inside, #realscout-widget .column-18.forth .inside, #statistics .column-25.third .inside {
		padding-left: 0;
	}
	
	#calculator .columns.top .column-18.fifth .line:first-child, #calculator .columns.top .column-18.sixth .line:first-child, #statistics .column-25 .line:last-child {
		display: none;
	}
	
	#footer .navigation li {
		padding: 0 0 5px 0;
		float: none;
	}
	
	#footer .navigation li.separator {
		display: none;
	}
	
	.gallery {
		min-height: 400px;
	}
	
	.gallery .date-price, h2 .label {
		font-size: 18px;
	}
	
	.gallery .neighborhood, #statistics span.number {
		font-size: 26px;
	}
	
	h1 .label {
		font-size: 30px;
	}
	
	.menu.dropit a {
		width: 200px;
	}
	
	.quotes .quote {
		font-size: 13px;
	}
	
	#realscout-widget .column-18.first, #realscout-widget .column-18.second, #realscout-widget .column-18.third {
		width: 33.33%;
		margin: 0 0 20px 0;
	}
	
}

/********************************************************************************************* 

x. Smaller than 440px

*********************************************************************************************/
@media only screen and (max-width: 440px) {
	
	.button {
		line-height: 1.5em;
		white-space: normal;
		height: auto;
		padding: 10px;
	}
	
	#cities h2, #neighborhoods h2 {
		width: auto;
	}
	
	#cities .button {
		margin: 20px 0 0 0;
	}
	
	#author .contact-information li {
		padding: 0 0 5px 0;
		float: none;
	}
	
	.divider {
		height: 200px;
	}
	
	.divider .property, .gallery-wrapper .caption {
		width: auto;
		left: 0; right: 0;
	}
	
	h1 .label {
		font-size: 26px;
	}
	
	.menu.dropit {
		margin: 0 -10px;
		position: static;
	}
	
	.menu.dropit a {
		width: 100%;
	}
	
}

/********************************************************************************************* 

x. Smaller than 400px

*********************************************************************************************/
@media only screen and (max-width: 400px) {
	
	#apply .column-10 {
		width: 30%;
	}
	
	#apply .column-90 {
		width: 70%;
	}
	
	.quotes .headshot-quote .headshot {
		display: none;
	}
	
	.quotes .headshot-quote .quote {
		padding: 0;
	}
	
	#realscout-widget .columns.bottom .column-50 {
		width: 100%;
	}
	
	#sidebar .navigation.bottom li {
		font-size: 15px;
		line-height: 20px;
	}
	
	#sidebar .navigation.bottom .social-media li {
		font-size: 20px;
		line-height: 20px;
		padding: 0 0 0 15px;
	}
	
	#team-members .grid .caption {
		bottom: 15px;
		left: 15px; right: 15px;
	}
	
}

/********************************************************************************************* 

x. Smaller than 1100px (HEIGHT)

*********************************************************************************************/
@media only screen and (max-height:1100px) {
	
	.hero {
		min-height: 600px;
	}
	
	.hero.small {
		height: 600px;
	}
	
}

/********************************************************************************************* 

x. Smaller than 800px (HEIGHT)

*********************************************************************************************/
@media only screen and (max-height:800px) {
	
	#sidebar .logo {
		padding: 0;
	}
	
	#sidebar .navigation.top li.first .line {
		display: none;
	}
	
}

/********************************************************************************************* 

x. Retina Graphics

*********************************************************************************************/
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
	
	.divider .neighborhood {
		background: none;
		background-image: url(../img/arrow-white-right-small-retina.png);
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 17px 17px;
	}
	
	.gallery .neighborhood {
		background: none;
		background-image: url(../img/arrow-white-right-large-retina.png);
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 27px 27px;
	}
	
	.grid li.full-information .close {
		background: none;
		background-image: url(../img/close-retina.png);
		background-position: left top;
		background-repeat: no-repeat;
		background-size: 20px 40px;
	}
	
	.links.domino a.external {
		background: none;
		background-image: url(../img/arrows-external-domino-retina.png);
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 14px 28px;
	}
	
	.links.dusty-gray a.external {
		background: none;
		background-image: url(../img/arrows-external-dusty-gray-retina.png);
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 14px 28px;
	}

	.offset .triangle .next .arrow {
		background: none;
		background-image: url(../img/arrow-next-white-retina.png);
		background-position: left top;
		background-repeat: no-repeat;
		background-size: 18px 18px;
	}
	
	#statistics .next {
		background: none;
		background-image: url(../img/arrow-next-domino-retina.png);
		background-position: left top;
		background-repeat: no-repeat;
		background-size: 18px 36px;
	}
	
	.no-touch .grid li.full-information .close:hover {
		background-position: left bottom;
	}
	
	.no-touch .links.domino a.external:hover {
		background-position: right bottom;
	}
	
	.no-touch .links.dusty-gray a.external:hover {
		background-position: right bottom;
	}
	
	.no-touch #statistics .next:hover {
		background-position: left bottom;
	}
    
}