/*==========================================================================*/
/* axisCom.css                                                              */
/*                                                                          */
/* The style sheet is used on all pages, it imports the other style sheets. */
/* This makes changing style sheet structure easier and the HTML-code       */
/* cleaner.                                                                 */
/*                                                                          */
/* 20061012 Jonas Elmqvist jonase@axis.com                                  */
/* adding comments and reviewing the styles                                 */
/*                                                                          */
/*                                                                          */
/* Axis Classic design                                                      */
/* -----------------------------                                            */
/* In this design paradigm we have styles for .title links etc. A classic   */
/* usage of css styles. Only applied on content and almost no style for     */
/* design.                                                                  */
/*                                                                          */
/* Axis Round design                                                        */
/* -----------------------------                                            */
/* In this design paradigm we added classes for design of the <table> based */
/* round corned boxes. It bases on <table> and blank.gif technique.         */
/*                                                                          */
/* Axis Light design                                                        */
/* -----------------------------                                            */
/* In this design paradigm we rebuild the outer <table> based design an     */
/* converted it to a design a based on <div> and background-images. The     */
/* inner design still was based on <table> technique.                       */
/*                                                                          */
/* Axis Flex design                                                         */
/* -----------------------------                                            */
/* In this design paradigm all tables for layout/design was removed and     */
/* replaced of <div> and background-images. The new design is totaly css    */
/* controlled. All main <div> are positioned with css. We have also        */
/* created some fiexes of the old classes for better performance. A new     */
/* includes level was implemented in the css folder. The main ide is that   */
/* the design should be easy changed by switching css. Following structure  */
/* for the main divs.                                                       */
/*                                                                          */
/* head                                                                     */
/* body                                                                     */
/* top                                                                      */
/* mainBanner                                                               */
/* subBanner                                                                */
/* mainMenu                                                                 */
/* subMenu                                                                  */
/* mainContent                                                              */
/* subContent                                                               */
/* bottom                                                                   */
/* foot                                                                     */
/*                                                                          */
/*                                                                          */
/*                                                                          */
/*                                                                          */
/* (c) Axis Communications                                                  */
/*==========================================================================*/

@import url('includes/axisComFix_html_basic.css');   /* Fix for correction behavior of old axis.css classes */
@import url('includes/axisComFix_axis_classes.css'); /* Fix for correction behavior of old axis.css classes */
@import url('includes/axisComFix_axis_design.css');  /* Fix for correction behavior of old axis.css classes */
@import url('includes/axisComContent.css');         /* Formatting mainContent and subContent div */
@import url('includes/axisComTopMenu.css');          /* Formatting topMenu div */
@import url('includes/axisComLangMenu.css');         /* Formatting langMenu div */
@import url('includes/axisComMainMenu.css');         /* Formatting mainMenu div */
@import url('includes/axisComContextMenu.css');      /* Formatting contextNav in subMenu div */
@import url('includes/axisComFlexAddress.css');      /* Formatting foot and adress div */
@import url('includes/axisComIcons.css');           /* Formatting for icons */

/*
AxisCom Layout formatting
*/

	
#axisFlexHead {
	background-image: url('/core/graphics/flex/top_border.gif');
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: block;
	height: 6px;
	width: 750px;
	margin-left: auto;
	margin-right: auto;
}

#axisFlexBody {
	background-image: url('/core/graphics/flex/background_wide.gif');
	background-repeat: repeat-y;
	background-position: left top;
	padding-left: 1px;
	padding-right: 1px;
	text-align: left;
	width: 748px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#axisFlexTop {
	display: block;
	background-color: #FFF;
	border-bottom: 1px solid #CCC;
	width: 748px;
	/*height: 66px;*/
	height: 46px;
	
}

#axisFlexTop .outer{
	/*padding: 3px 10px 10px 7px;*/
	
}

#axisFlexMainBanner {
	border-bottom: 1px solid #CCC;
	float: right;
	/*display: inline-block;*/
	width: 570px;
	position: relative;
} 

h1.hTag, h2.hTag{
	position: absolute;
	left: 0;
/*	top: -300px;*/
	margin: 0;
	padding: 0;
	z-index: 2;
	display: inline;
}

h2.hTag{
	top: 30px;
}

.image_tag{
	position: relative;
	z-index: 10;
}

#axisFlexMainBanner img {
	border: 0px solid red;
}

#axisFlexSubBanner {
	display: none;
	visibility: hidden;
	position: absolute;
} 

#axisFlexMainNav {
	display: block;
	float: left;
	width: 178px;
	padding-right: 0px;
} 
	
#axisFlexSubNav {
	float: left;
	/*display: inline-block;*/
	width: 570px;
	padding-top: 15px;
}	

#axisFlexMainContent {
	/*display: inline-block;*/
	float: left;
	width: 570px;
	padding-top: 15px;
} 

#axisFlexSubContent {
	display: none;
	width: 226px;
	
	display: none;
	visibility: hidden;
	position: absolute;
}

#axisFlexBottom {
	display: block;
	height: 1px;
	clear: both;
}

#axisFlexFoot {
	background-image: url('/core/graphics/flex/bottom_border.gif');
	background-repeat: no-repeat;
	background-position: 0px -5px;
	display: block;
	clear: both;
	height: 25px;
	width: 750px;
	margin-left: auto;
	margin-right: auto;
	
}
#axisFlexAddress {
	width: 725px;
}

#axisFlexFoot .outer{
	background-image: url('/core/graphics/flex/dotted_vertical.gif');
	background-repeat: no-repeat;
	background-position: 178px -67px;
	padding-top: 10px;
	
}
table.axisFlexAccTable {
	margin-top: 15px;
	margin-right: 15px;
	margin-left: 15px;
	margin-bottom: 15px;
}

table.axisFlexAccTable td {
	vertical-align: top;
}

table.axisFlexAccTable td img {
	margin-right: 15px;
}

.mobile_only {
	display:none;
}

/* product lists */
.product-list {
	clear: both;
}
.product-list .content {
	width: 100%;
}

/** table with images */
table.image-list {
	width: 100%;
}
table.image-list td {
	width: 25%;
	text-align: center;
	vertical-align: bottom;
	padding-bottom: 5px;
}
table.image-list .col_names td {
	padding: 0 0 15px 0;
	vertical-align: middle;
}
table.image-list tr.first td {
}
table.image-list img {
	display: block;
	border: none;
	padding-bottom: 10px;
	margin: 0 auto;
}

.product-list .hr {
	margin: 15px;
	border-top: 1px solid #999;
}
.product-list .hr hr {
	display: none;
}
.product-list h4 {
	text-align: center;
	font-size: 13px;
	color: #666;
	margin-bottom: 10px;
	margin-top: 0px;
}

/* need to use #axis.. to override included css */
#axisFlexMainContent .product-list .jumplink {
	clear: both;
	margin-top: 5px !important;
	margin-bottom: 0 !important;
	padding: 0 !important;
/* 	padding-top: 15px; */
/* 	border-top: 1px solid #999; */
	text-align: right;
	font-size: 11px;
}

li.products {
	margin-bottom: 0 !important;
}
li.notitle {
	background: none !important;
}
li.products h4 {
	font-size: 11px;
	margin-top: 0;
	margin-bottom: 8px !important;
/*	margin-bottom: 0 !important; */
	line-height: 1.3;
}
li.products h5 {
	font-size: 11px;
	font-weight: normal;
	margin: 4px 0 8px 0 !important;
	position: relative;
	left: -8px;
}
li.products ul {
	list-style: none !important;
	margin: 0 0 10px 0 !important;
	padding-left: 0 !important;
}
li.products ul li {
	padding-left: 0 !important;
	background: none !important;
}
li.products ul ul li {
	padding-left: 8px !important;
	margin-left: 0 !important;
	background: transparent url(/core/graphics/dash-small.gif) no-repeat 0 7px !important;
	margin-left: 5px !important;
}