/*  IAT 235 Project 2 Part 3 Wireframes
	Posting page 5 (Review/Publish) - CSS | www.sfu.ca/~rllee/dPost1.html	*/
	
/* Posting page styling */	
@media(min-width:500px) {		/* previously specified width: 1280px */

.header{					/*Beginning of header*/
	font-family:Arial;

}
.header li{
	list-style-type:none;
}

.pRow1{
	height:20%;
	display:flex;
	
}
.pRow1 li {
	float:left;
	border:1px solid black;
	width:100%;
}

.logo{
}
.home{
}
.account{
}

.pRow2 {
	clear:both;
	display:flex;
}

.pRow2 li{
	float:left;	
	width:90%;
	border:1px solid black;
}

.pageTitle{
}
.changeLoc{
}

.pRow3 {
	clear:both;
	display:flex;
	width:90%;
}

.pRow3 li{
	float:left;
	width:50%;
	border:1px solid black;
}

.postProg{
	text-indent:30px; 
	font-size:20px;
}

.progCat{
  background:#EBEBEB;
}
.progLoc{
  background:#EBEBEB;  
}
.progDet{
  background:#EBEBEB;  
}
.progImg{
  background:#EBEBEB;  
}
.progRev{
  background:#EBEBEB; 
}

.pageInstruct{						/* Page Instructions */
	display:flex;
	width:100%;
	margin-left:5%;
	border:1px solid black;
}

.listContent{						/* For Lists */
	display:flex-row;
	width:95%;
}
.listContent li{
	border:1px solid black;
	list-style-type:none;
	width:50%;
	margin-left:20%;
}

#contentHead{						/* Page 3 - Filling information */
  display:flex;
  background:#B2B2B2;
  border:1px solid black;
  padding:5px;
  margin-left:5%;
  width:90%;
  position:relative;
}

#contentTitle{
  background:white;
  border:1px solid red;
  padding:5px;
  top:20px;
  left:1%;
  width:90%;
  position:relative;
}
#contentList{
  background:white;
  border:1px solid black;
  padding:5px;
  top:40px;
  left:1%;
  width:25%;
  position:relative;
}
#contentList2{
  background:white;
  border:1px solid black;
  padding:5px;
  top:60px;
  left:1%;
  width:25%;
  position:relative;
}
#contentList3{
  background:white;
  border:1px solid black;
  padding:5px;
  top:80px;
  left:1%;
  width:25%;
  position:relative;
}
.contentSides{
	display:flex;
	width:90%;
	position:relative;
	top:130px;
}
.contentSides li{
	float:left;
	list-style-type:none;
	border:1px solid black;
}
.contentSides1{
  background:white;
  border:1px solid black;
  padding:5px;
  top:180px;
  width:250px;
  position:relative;  
  left:10px; 
}
.contentSides2{
  left:300px;
  background:white;
  border:1px solid black;
  padding:5px;
  top:330px;
  width:250px;
  position:absolute;  
}
.contentSides3{
  left:600px;
  background:white;
  border:1px solid black;
  padding:5px;
  top:330px;
  width:250px;
  position:absolute;  
}

#contentDesc{
  float: right;
  background:white;
  border:1px solid black;
  padding:5px;
  bottom:140px;
  right:30px;
  width:60%;
  height:200px;
  position:relative;  
}

#contentTags{
  left:10px;
  background:white;
  border:1px solid black;
  padding:5px;
  top:200px;
  width:900px;
  position:relative;   
}

#contactBox{
  background:white;
  border:1px solid black;
  padding:5px;
  width:400px;
  position:relative;   
}
.nameBox{
  left:10px;
  top:240px;
}
.emailBox{
  left:10px;
  top:260px;
}
.phoneBox{
  top:230px;
  background:white;
  border:1px solid black;
  padding:5px;
	left:500px;
  width:400px;
  position:absolute;   
}

#prefBox{
  left:500px;
  background:white;
  border:1px solid black;
  padding:5px;
  top:480px;
  width:400px;
  position:absolute;   
}

#addImg {						/* Page 4 - Images */
	font-family:Arial;
	background:#EBEBEB;
	width:20%;
	top:5px;
	height:100px;
	left:15%;
	padding: 20px 20px 20px 20px;
	border:1px solid black;  
	text-align:center;  
	position:relative;
}

#prevImg {
	font-family:Arial;
	background:white;
	width:30%;
	height:100px;
	left:40%;
	bottom:138px;
	padding: 20px 20px 20px 20px;
	border:1px solid black;  
	text-align:center;  
	position:relative;
	margin-left:10%;
}

#uploadTitle {
	font-family:Arial;
	background:#B2B2B2;
	width:90%;
	height:5px;
	left:10%;
	bottom:100px;
	padding: 20px 20px 20px 20px;
	border:1px solid black;  
	text-align:left;  
	position:relative;
}

#uploadBox{
	width:90%;

}
.uploadThumb {
	background:white;
	left:9%;
	width:15%;
	height:70px;
	padding: 20px 20px 20px 20px;
	border:1px solid black;  
	text-align:center;  
	display:inline-block;
	position:relative;
	margin:2%;
	bottom:100px;
}



.end{
	display:flex;
}
.end li{
	list-style-type:none;
	border:1px solid black;
	width:90%;
}
.next{
	clear:both;
	width:50%;
	margin-left:60%;
}
.back{
	clear:both;
	width:50%;
	margin-left:30%;
	margin-bottom:20%;
}


}