/* break point: 900px, 520px */

@font-face {
    font-family: 'proxima_nova_ltlight';
    src: url('proximanova_light_macroman/ProximaNova-Light-webfont.eot');
    src: url('proximanova_light_macroman/ProximaNova-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('proximanova_light_macroman/ProximaNova-Light-webfont.woff') format('woff'),
         url('proximanova_light_macroman/ProximaNova-Light-webfont.ttf') format('truetype'),
         url('proximanova_light_macroman/ProximaNova-Light-webfont.svg#proxima_nova_ltlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'proxima_nova_rgbold';
    src: url('proximanova_bold_macroman/ProximaNova-Bold-webfont.eot');
    src: url('proximanova_bold_macroman/ProximaNova-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('proximanova_bold_macroman/ProximaNova-Bold-webfont.woff') format('woff'),
         url('proximanova_bold_macroman/ProximaNova-Bold-webfont.ttf') format('truetype'),
         url('proximanova_bold_macroman/ProximaNova-Bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

* {
	margin: 0;
	padding: 0;
}
body {
	background: url("../images/stripe_large.png");
}
#info, #comments {
	font-family: "proxima_nova_ltlight", Arial, san-serif;
}
#info {
	float: left;
	color: white;
	margin: 25px 0 0 15px;
	text-align: left;
}
#info ul {
	margin: 100px 0 0 0;
	list-style-type: none;
}
#info li {
	margin: 40px 0 0 0;
}
#info a {
	color: white;
	text-decoration: none;
}
#info a:hover {
	color: white;
	text-decoration: underline;
}
#info a:visited {
	color: white;
	text-decoration: none;
}
#info h1, #info h2, #comments h3 {
	font-family: "proxima_nova_rgbold", Arial, san-serif;
	font-weight: normal;
}
#info h1 {
	/*font-size: 1.125 em;*/
	font-size: 112.5%;
	text-transform: uppercase;
	margin: 7px 0 0 0;
}
#info h2 {
	margin: 39px 0 0 0;
	font-size: 100%;
}
#comments {
	float: left;
}
#comments .entry {
	text-align: center;
	margin: 120px 0 0 50px;	
	width: 505px;
	height: 505px;
	background: url("../images/lips.png") no-repeat;
	color: #F00000;
}
#comments .content {
	position: relative;
	top: 200px;
	width: 170px;
	margin: 0px auto;
	text-align: left;
}
#comments h3 {
	font-size: 150%;
	text-transform: uppercase;
	margin: 0 0 10px 0;
}
#comments p {
	font-size: 87.5%;
}
#comments p.date {
	font-size: 71.4%;
	margin: 10px 0 0 0;
}
a[href^="tel:"] {
	color: white !important; 
	background-color: inherit !important;
	text-decoration: none;
}

@media only screen and (max-width: 900px) and (min-width: 521px) {
	#comments {
		float: none;
		clear: both;
	}
	#comments .entry {
		margin: 0 auto;	
	}
}
@media only screen and (max-width: 520px) {
	#info h2 {
		font-size: 90%;
	}
	#info {
		margin-bottom: 10px;
		width: 320px;
	}
	#comments {
		float: none;
		clear: both;
		width: 320px;
		margin: 0 auto;	
	}
	#comments .content{
		top: 108px;
	}
	#comments .entry {
		margin: 0 auto;	
		width: 320px;
		height: 320px;
		background: url("../images/lips_small.png") no-repeat;
	}
	#comments h3 {
		font-size: 112.5%;
		margin: 0 0 5px 0;
	}
	#info ul {
		margin: 103px 0 0 0;
		list-style-type: none;
	}
}