/*BRAGIO-PLASTIC formating
** http://www.bragio-plastics.com/
** CSS by Radovan Janjusevic / http://www.illumys.com/
**
**
** PLASTIC CATALOGUE FORMATING
*/

/* Formating of boxes which are stacked
	** one beside another horizontaly
	**/
	#info-left{
		float: left;
		width: 385px;
		height: 123px;
		background-color: #C72286;
	}
	#info-right{
		float: right;
		width: 385px;
		height: 123px;
		background-color: #C72286;
	}
	#info-img1{
		float: left;
		width: 105px;
		height: 123px;
		background-color: #000000;
	}
	#info-img2{
		float: left;
		width: 192px;
		height: 123px;
		background-color: #000000;
	}
	#info-right p.head, #info-left p.head{
		float: left;
		width: 270px;
		height: 30px;
		margin: 5px 0px 0px 0px;
		background-color: #583787;
		color: White;
		text-align: center;
		vertical-align: middle;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: bold;
	}
	#info-right div.cont, #info-left div.cont{
		float: left;
		width: 280px;
		height: 87px;
		margin: 1px 0px 0px 0px;
		background-color: #5E5396;
	}
	div.cont #info-holder{
		margin: 10px 0px 0px 10px;
		width: 270px;
	}
	div.cont #info-holder div{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 11px;
		font-weight: bold;
		line-height: 11px;
		color: White;
		background-color: transparent;
		padding: 0px 0px 0px 17px;
		background-image: url(../img/list-2.gif);
		background-position: top left;
		background-repeat: no-repeat;
		width: 270px;
	}
	/* Spacers between info boxes
	**/
	#info-spacer{
		float: right;
		height: 14px;
		width: 770px;
		background: #FFFFFF;
	}
	#info-spacer span{
		display: block;
		width: 770px;
		height: 2px;
		background: #BF453B;
		margin: 6px 0px 6px 0px;
		font-size: 2px;
	}
	/* formating of solo boxes
	**/
	#info-solo{
		float: right;
		width: 770px;
		height: 123px;
		background-color: #C72286;
	}
	#info-solo p.head1, #info-solo p.head2{
		float: left;
		height: 30px;
		margin: 5px 0px 0px 0px;
		color: White;
		text-align: center;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: bold;
		line-height: 14px;
		background-color: #583787;
	}
	#info-solo p.head1{
		width: 291px;
		/*border-right: 2px solid #FFFFFF; IE puts border inside while 
		** Firefox and Opera puts it outside which makes box 2px (or more) wider*/
		background-image: url(../img/dashed-white.gif);
		background-position: right top;
		background-repeat: repeat-y;
		
	}
	#info-solo p.head2{
		width: 277px;
	}
	#info-solo div.cont1{
		float: left;
		width: 291px;
		height: 87px;
		margin: 1px 0px 0px 0px;
		background-color: #5E5396;
		/*border-right: 2px solid #FFFFFF; IE puts border inside while 
		** Firefox and Opera puts it outside which makes box 2px (or more) wider*/
		background-image: url(../img/dashed-white.gif);
		background-position: right top;
		background-repeat: repeat-y;
		text-align: left;
		vertical-align: middle;
	}
	#info-solo div.cont2{
		float: left;
		width: 287px;
		height: 87px;
		margin: 1px 0px 0px 0px;
		background-color: #B4D6F3;
		text-align: left;
		vertical-align: middle;
	}
	div.cont1 #info-holder{
		margin: 10px 0px 0px 10px;
		width: 271px;
	}
	div.cont2 #info-holder{
		margin: 10px 0px 0px 10px;
		width: 267px;
	}
	div.cont1 #info-holder div, div.cont2 #info-holder div{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 11px;
		font-weight: bold;
		line-height: 11px;
		color: White;
		background-color: transparent;
		background-position: top left;
		background-repeat: no-repeat;
		padding: 0px 0px 0px 17px;
	}
	div.cont1 #info-holder div{
		background-image: url(../img/list-2.gif);
		width: 271px;
	}
	div.cont2 #info-holder div{
		background-image: url(../img/list-2.gif);
		width: 267px;
	}
	/*Extra stuff
	**/
	#artnum{
		font-size: 12px;
		font-weight: bolder;
	}
	/* LOWER NAVIGATION FORMATING
	***/
	#lower-nav, #lower-nav1, #lower-nav2{
		float: left;
		width: 770px;
		margin: 10px auto 0px auto;
	}
	#lower-nav1, #lower-nav2{
		height: 21px;
		margin: 0px 0px 5px 0px;
		clear: left;
	}
	#lower-nav2 a, #lower-nav1 a, #lower-nav1 span{
		float: left;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 10px;
		font-weight: bold;
		line-height: 18px;
		height: 18px;
		margin: 0px 3px 0px 0px;
		color: #FFFFFF;
		background-color: #5E5396;
		border: 1px solid #000000;
		text-align: center;
		vertical-align: middle;
		text-decoration: none;
	}
	#lower-nav1 span{
		color: #5E5396;
		background-color: #D5D2E6;
	}
	#lower-nav1 a:link, #lower-nav1 a:visited{
		width: 100px;
		color: #FFFFFF;
		background-color: #5E5396;
	}
	#lower-nav2 a:link, #lower-nav2 a:visited{
		float: left;
		width: 17px;
		background-color: #5E5396;
	}
	#lower-nav1 a:hover, #lower-nav2 a:hover{
		background-color: #C72286;
	}