/**
 * CSS for OFPEC boxes
 *
 * The layout of the site pages is based on a 6-column grid.
 * Presentation "boxes" span 2, 3, 4 or 5 of these columns,
 * and are generic for use across the site.
 *
 * Created 08 December 2011
 * Updated 08 December 2011
 *
 * @author bedges
 */


/* 5-column box
------------------------------------------------------------ */

.a5col_box_container,
.a5col_box_top,
.a5col_box_bottom,
.a5col_box_header,
.a5col_box_content,
.a5col_box_footer {
	float:left;
	width:768px;
}

.a5col_box_container {
	margin:10px 0 0;
	background:url(../images/layout/5col_box_bg.gif) repeat-y #f8f4e4;
}

.a5col_box_top {
	background:url(../images/layout/5col_box_top.gif) no-repeat top;
}

.a5col_box_bottom {
	width:748px;
	padding:0 10px;
	background:url(../images/layout/5col_box_bottom.gif) no-repeat bottom;
}

.a5col_box_header,
.a5col_box_content {
	width:748px;
}

.a5col_box_header {
	border-bottom:1px solid #dfd3c6;
}

.a5col_box_content {
	border-top:1px solid #fff;
}


/* 4-column box
------------------------------------------------------------ */

.a4col_box_container,
.a4col_box_top,
.a4col_box_bottom,
.a4col_box_header,
.a4col_box_content,
.a4col_box_footer {
	float:left;
	width:598px;
}

.a4col_box_container {
	margin:5px 0 0;
	background:url(../images/layout/4col_box_bg.gif) repeat-y #f8f4e4;
}

.a4col_box_top {
	background:url(../images/layout/4col_box_top.gif) no-repeat top;
}

.a4col_box_bottom {
	width:578px;
	padding:0 10px;
	background:url(../images/layout/4col_box_bottom.gif) no-repeat bottom;
}

.a4col_box_header,
.a4col_box_content,
.a4col_box_footer {
	width:578px;
}

.a4col_box_header {
	border-bottom:1px solid #dfd3c6;
}

.a4col_box_content {
	border-top:1px solid #fff;
}


/* 3-column box
------------------------------------------------------------ */

.a3col_box_container {
	float:left;
	width:448px;
	margin:10px 0;
	background:url(../images/layout/left_box_bg.gif) repeat-y #f8f4e4;
	overflow:hidden;
}

.a3col_box_top {
	float:left;
	width:448px;
	background:url(../images/layout/left_box_top.gif) no-repeat top;
	overflow:hidden;
}

.a3col_box_bottom {
	float:left;
	width:428px;
	padding:10px;
	background:url(../images/layout/left_box_bottom.gif) no-repeat bottom;
	overflow:hidden;
}

.a3col_box_header,
.a3col_box_content,
.a3col_box_footer {
	float:left;
	width:428px;
}

.a3col_box_header {
	border-bottom:1px solid #dfd3c6;
}

.a3col_box_content {
	border-top:1px solid #fff;
}

.a3col_box_bottom h2 {
	padding:0 0 5px;
}

.a3col_box_footer {
	padding:10px 0 5px;
	line-height:normal;
}


/* 2-column box
------------------------------------------------------------ */

.a2col_box_container {
	float:left;
	clear:both;
	width:310px;
	margin:0 0 10px;
	background:url(../images/layout/middle_box_bg.gif) repeat-y #f8f4e4;
}

.a2col_box_top {
	float:left;
	width:310px;
	background:url(../images/layout/middle_box_top.gif) no-repeat top;
}

.a2col_box_bottom {
	float:left;
	width:290px;
	padding:10px;
	background:url(../images/layout/middle_box_bottom.gif) no-repeat bottom;
	font-size:80%;
	line-height:120%;
}
/* h- 14.6.2014 */
/* the unfortunate google ads stuff.. */
.g_add_left { /* for the left column depots */
	width:162px;
	float:left;
	position: relative;
	/*left: 1264px;*/
	left: -3px;

}
.add_box_content {/* for the box content */
	float:left;
	width:290px;
	padding:10px 0 0;
	border-top:1px solid #fff;
	text-align: center;
	position: relative;
	/*left:-6px;*/
	left:0px;
}

.add_box_img { /* h-14.6.2014 add box image */
	/*width: 303px;*/
	width: 286px;
/*	height: 254px;*/
	height: 237px;
}
.add_left_img { /* h-14.6.2014 add box image */
	/*width: 162px;*/
	width: 154px;
/*	height: 602px;*/
	height: 594px;
}
/***************/
.a2col_box_header {
	float:left;
	width:290px;
	text-align:right;
	padding:0 0 5px;
	border-bottom:1px solid #dfd3c6;
}

.a2col_box_header h2 {
	padding:2px 0 3px;
	font-size:160%;
	font-weight:bold;
}

.a2col_box_header p {
	padding:0;
	line-height:normal;
	color:#777;
}

.a2col_box_content {
	float:left;
	width:290px;
	padding:10px 0 0;
	border-top:1px solid #fff;
}

.a2col_box_content h3 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:97%;
	margin:0;
	padding:0 0 5px 0;
	color:#333;
}

.a2col_box_content p {
	padding:0 0 5px;
	line-height:normal;
	color:#777;
}

.a2col_box_content img.box_header_icon {
	float:right;
	position:relative;
	margin-top:-35px;
}

.a2col_box_content_left {
	float:left;
	width:25px;
	padding:1px 0 0;
	line-height:1px;
	font-size:1px;
}

.a2col_box_content_right {
	float:left;
	width:260px;
	padding:0 0 0 5px;
}

.a2col_box_footer {
	float:left;
	width:290px;
	clear:both;
	line-height:1px;
	font-size:1px;
}

.a2col_box_footer p {
	padding:0;
	line-height:normal;
	text-align:right;
	text-transform:uppercase;
	font-size:x-small;
}


/* 1-column box
------------------------------------------------------------ */

.box_top,
.box_bottom,
.box_content {
	float:left;
	width:100%;
}

.box_content {
	padding:0 0 10px;
}

.first {
	border-top:none;
}

.multi {
	padding-top:15px;
}