/* global */

#ipostcardBlock form {
	margin: 0;
	padding: 0;
}

#ipostcardBlock img {
	border: 0;
}


#ipostcardBlock {
	width: 710px;
	margin: 0 auto;
	padding-bottom: 15px;
}


/* row 1 */

#vps-row1 {
	width: 710px;
	overflow: hidden;
	margin: 0 0 15px 0;
}

#vps-row1Left {
	width: 355px;
	float: left;
	margin: 0;
	padding: 0;
	overflow: hidden;
}	

#vps-row1Right {
	width: 345px;
	float: right;
	margin: 0 0 0 10px;
	padding: 0;
	overflow: hidden;
}	

#noFour {
	width: 308px;
	height: 30px;
	background: url(../images/dot.png) no-repeat 0px 0px;
	position: relative;
	padding-bottom: 5px;
	float: left;
	overflow: hidden;
}

#noFourNumber {
	width: 23px;
	height: 20px;
	font-size: 17px;
	line-height: 17px;
	color: #FFF;
	float: left;
	text-align: center;
	padding-top: 3px;
}

#noFour h2 {
	color: #461300;
  font-size: 0.9em;
  line-height: 1em;
	width: 275px;
	height: 23px;
	float: right;
	margin: 0;
	padding: 5px 0 0 0;
	text-transform:uppercase;
}

#noFive {
	width: 308px;
	height: 30px;
	background: url(../images/dot.png) no-repeat 0px 0px;
	position: relative;
	padding-bottom: 5px;
	float: left;
	overflow: hidden;
}

#noFiveNumber {
	width: 23px;
	height: 25px;
	font-size: 17px;
	line-height: 17px;
	color: #FFF;
	float: left;
	text-align: center;
	padding-top: 3px;
}

#noFive h2 {
	color: #461300;
  font-size: 0.9em;
  line-height: 1em;
	width: 275px;
	height: 23px;
	float: right;
	margin: 0;
	padding: 5px 0 0 0;
	text-transform:uppercase;
}

 #vps-row1 label {
	width: 308px;
	display: block;
	margin: 0 0 3 0;
	padding: 0;
	font-size: 13px;
	color: #461300;
}

.normalField {
	width: 335px !important;
	padding: .5em;
	margin: 0 0 10px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ef5a28;
	background-color: #ffe9c2;
}


/* row 2 */

#photoBlock {
	width: 650px;
	height: 77px;
	margin-bottom: 15px;
	position: relative;
}

#noOne {
	width: 117px;
	height: 50px;
	background: url(../images/dot.png) no-repeat 0px 0px;
	position: relative;
	padding-bottom: 5px;
	float: left;
}

#noOneNumber {
	width: 23px;
	height: 20px;
	font-size: 17px;
	line-height: 17px;
	color: #FFF;
	float: left;
	text-align: center;
	padding-top: 3px;
}

/*h2 {
	font-family: "proxima-nova",sans-serif;
}*/

#noOne h2 {
	color: #461300;
  font-size: 0.875em;
  line-height: 1em;
	line-height: 17px;
	width: 80px;
	float: right;
	margin: 0;
	padding: 0;
	text-transform:uppercase;
}

#photosHolder {
	width: 530px;
	float: right;
	position: relative;
}

/*
#theThumbnailsHolder {
	width: 468px;
	height: 77px;
	position: absolute;
	left: 26px;
	top: 0px;
	overflow: hidden;
}

#theThumbnails {
	width: 1200px;
	height: 77px;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 100;
}

#theThumbnails img {
	border: solid 1px #999;
	color: #000;
	margin-right: 20px;
}

#theThumbnails ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#theThumbnails li {
	margin: 0;
	padding: 0;
	list-style: none;
	display: inline;
	float: left;
}

#leftArrow {
	width: 36px;
	height: 36px;
	position: absolute;
	left: -11px;
	top: 20px;
	z-index: 101;
	display: none;
}

#rightArrow {
	width: 36px;
	height: 36px;
	position: absolute;
	left: 495px;
	top: 20px;
	z-index: 102;
}

*/

#theThumbnails {
	overflow: hidden;
	width: 100%;
	z-index: 100;
}

#theThumbnails ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#theThumbnails li {
	margin: 0 20px 20px 0;
	padding: 0;
	list-style: none;
	display: inline;
	float: left;
}

#theThumbnails img {
	border: solid 2px #FFF;
	color: #000;
	
}


/* row 3 */

#mobileBodyBlock {
	display: none;
}

#subjectBlock {
	width: 710px;
	position: relative;
	overflow: hidden;
}

#noTwo {
	width: 140px;
	height: 50px;
	background: url(../images/dot.png) no-repeat 0px 0px;
	position: relative;
	padding-bottom: 5px;
	float: left;
}

#noTwoNumber {
	width: 23px;
	height: 20px;
	font-size: 17px;
	line-height: 17px;
	color: #FFF;
	float: left;
	text-align: center;
	padding-top: 3px;
}

#noTwo h2 {
	color: #461300;
  font-size: 0.875em;
  line-height: 1em;
	line-height: 17px;
	width: 110px;
	float: right;
	margin: 0;
	padding: 0;
	text-transform:uppercase;
}

#theSubject {
	width: 440px;
	height: 24px;
	position: absolute;
	left: 151px;
	top: 9px;
}

.subjectField {
	width: 554px;
	padding: .5em;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: #ffe9c2;
	color:#ef5a28;
}


/* row 4 */


#ipostcardHolder {
	width: 600px;
	margin: 0 auto;
	padding: 0;
	clear: both;
	position: relative;
}

#noThree {
	width: 23px;
	height: 25px;
	font-size: 17px;
	line-height: 17px;
	text-align: center;
	padding-top: 3px;
	background: url(../images/dot.png) no-repeat 0px 0px;
	position: absolute;
	left: 308px;
	top: 26px;
	z-index: 103;
	color: #FFF;
}

#successStuff {
    background-color: #30f41c;
    border: 2px solid #fff;
    color: #000;
    display: none;
    font-size: 15px;
    left: 0;
    line-height: 18px;
    margin-left: 10%;
    padding: 10px 15px;
    position: absolute;
    text-align: center;
    top: 6600px;
    width: 80%;
    z-index: 200;
}

.typeField {
	width: 245px;
	height: 205px;
	padding: 4px;
	border: solid 1px #999;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: #ffe9c2;
	color:#ef5a28;
	resize: none;
}

.typeFieldMobile {
	width: 100%;
	height: 199px;
	padding: 4px;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: #ffe9c2;
	color:#ef5a28;
	resize: none;
}

/* buttons */

#addMoreButton {
	padding-top: 0px;
}

#resetInfoButton {
	padding-top: 10px;
}

#addMoreButton a:link, #addMoreButton a:visited, #resetInfoButton a:link, #resetInfoButton a:visited {
	display: block;
	padding: 5px;
	font-size: 13px;
	text-decoration: none;
	margin: 0 auto;
	font-weight: bold;
	text-align: center;
	/* small button colors */
	color: #FFF;
	background-color: #999999;
}

#addMoreButton a:link, #addMoreButton a:visited {
	width: 150px;
}

#resetInfoButton a:link, #resetInfoButton a:visited {
	width: 100px;
}

#addMoreButton a:hover, #addMoreButton a:active, #resetInfoButton a:hover, #resetInfoButton a:active {
	background-color: #868686;
}

#submitButton {
	width: 215px;
	position: relative;
	margin: 10px 110px 0 0;
	float: right;
}

#theSubmitButton a:link, #theSubmitButton a:visited {
	font-family:'Cinzel', 'Avant Garde', 'Futura', 'Helvetica Neue', 'Helvetica', Tahoma, 'Trebuchet MS', sans-serif ;
	width: 180px;
	padding: 5px 0px 5px 0px;
	margin: 0 auto;
	display: block;
	background-position: 0 -26px;;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	/* submit button colors */
	color: #461300;
	background-color: #fdbe00;
	float: right;
}

#theSubmitButton a:hover, #theSubmitButton a:active {
	color: #fff;
	background-color: #461300;
}


#noSixNumber {
	width: 23px;
	height: 25px;
	font-size: 17px;
	line-height: 17px;
	color: #FFF;
	text-align: center;
	padding-top: 3px;
	position: absolute;
	left: 0px;
	top: 3px;
	background: url(../images/dot.png) no-repeat 0px 0px;
	float: right;
}

#bodyText {
	padding: 15px;
}

#ipostcardLoader {
	position: absolute;
	left: -75px;
	bottom: 5px;
	display: none;
}

@media only screen and (max-width:865px) {
	
	#vps-row1 {
			margin: 0 0 15px;
			padding: 0;
			width: 100%;
	}
	
	#vps-row1Left,#vps-row1Right {
		width: 100%
	}
	
	#ipostcardBlock {
    width: 100%;
	}
	
	#noFour h2, #noFive h2 {
    width: 85%;
		text-align: left;
	}
	
	#ipostcardBlock label, input {
    width: 100% !important;
	}
	
	#vps-row1 label {
			width: 100%;
	}
	
	.normalField {
			width: 100% !important;
	}
	
	

}

@media only screen and (max-width:780px) {
	
	#noOne, #noTwo {
    width: 100%;
		overflow: hidden;
	}
	
	#noOne h2, #noTwo h2 {
    width: 85%;
		text-align: left;
		padding-top: 3px;
		margin: 0;
	}
	
	#photoBlock {
    width: 100%;
}
	
	#photosHolder {
    width: 100%;
	}
	
	#theThumbnails {
		overflow: hidden;
		width: 100%;
		z-index: 100;
		margin: 0 0 0 0;
	}
	
	#theThumbnails ul {
		width: 100%;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	
	#theThumbnails li {
		width: 40%;
		margin: 0 5% 20px 5%;
		padding: 0;
		list-style: none;
		display: inline;
		float: left;
	}
	
	#theThumbnails li.even {
		margin: 0 5% 20px 0;
	}
	
	#theThumbnails img {
		width: 100%;
		height: auto;
	}
	
	#subjectBlock {
    width: 100%;
}
	
	#theSubject {
		height: auto;
		position: relative !important;
		left: 0;
		top: 0;
    width: 100% !important;
		margin-bottom: 2em;
}

#ipostcardBlock label, input {
    width: 100% !important;
}

.subjectField {
    width: 90%;
}

#ipostcardHolder {
	display: none;
}

#mobileBodyBlock {
	display: block;
}

form {
	position: relative;
}

#successStuff {
    font-size: 1em;
    height: 65px;
    left: 0;
    margin-left: 0;
    top: 87%;
    width: 95%;
}


#ipostcardBlock {
    width: 95%;
		margin: 0;
}

#vps-row1 {
    width: 100%;
		margin: 0;
		float: none;
		overflow: hidden;
}

#vps-row1Left, #vps-row1Right {
	width: 100% !important;
	margin: 0;
	float: none;
}

#noFour, #noFive {
	width: 100% !important;
	text-align: left !important;
}

#noFour h2, #noFive h2 {
	text-align: left !important;
}

#formHolder label, #formHolder input {
	width: 100% !important;
	float: none !important;
}

}
