/***
 * CSS code to support http://www.imsmachines.net, http://www.integrimachserv.com/
 * Last updated: 30 October, 2008
 * Xhtml/CSS Designed by: Osama Zakaria
 * Contact Info:
 *      E-mail eng.osama.cs@gmail.com
 *      Mobile 0020125438279
 ***/


/************* Defaults *******************/


*{
	margin: 0;
	padding: 0;
	line-height: 1.3em;
}

body{
    padding: 0 20px 20px 20px;
    background: #FFF;
	text-align: center;
	font: 10px Arial, Helvetica, sans-serif;
}

body.admin{
	padding-top: 20px;
}

img{
    border: none;
}

a{
    text-decoration: none;
}

li{
    list-style-type: none;
}

img.left{
	margin-right: 10px;
}

h1, h2, h3, h4, h5, h6{
	font-weight: normal;	
}

/**************** Global Classes *****************/

.left{
    float: left;
}

.right{
    float: right;
}

.clear{
    clear: both;
}

.invisible{
	display: none;
	visibility: hidden;
}

.visible{
	display: block;
	visibility: visible;
}

.important{
	color: red;
}

/*arrow*/

ul.arrow li{
    padding-left: 10px;
    margin-bottom: 4px;
}

ul.arrow.green li{
	background: url(images/arrow_green2.gif) no-repeat left 3px;
}

li.arrow{
    padding-left: 10px;
    margin-bottom: 4px;
	background: url(images/arrow_green2.gif) no-repeat left 3px;
}

/*decimal*/

.decimal{
    padding-left: 28px;
}

.decimal li{
    list-style-type: decimal;
}

/*link*/

.link1{
	color: #22B14C;
	border-bottom: dotted 1px;
}

.link1:hover{
	border-bottom: solid 1px;
}

.link2{
	color: #707070;
	border-bottom: dotted 1px;
}

.link2:hover{
	border-bottom: solid 1px;
}

/*text and textarea*/

.text, .textarea{
    background: #FFF url(images/box_body_bg1.jpg) repeat-x;
    border: 1px solid #CCC;
    padding-top: 2px;
    color: #333;
    font-size: 13px;
}

.text{
    height: 16px;
    width: 250px;
}

.textarea{
    height: 140px;
    width: 265px;
}

/*button*/

.button{
	padding: 0 15px 0 15px;
	height: 30px;
	background: url(images/button.jpg) repeat-x left top;
	border: none;
	color: #fff;
	font-size: 12px;
	cursor: pointer;
}

.button:hover,
.button.hover{
	background-image: url(images/button_green.jpg);
}

/**************** IDs and Inner Classes *******************/

/*wrraper*/

#wrapper{
    min-width: 777px;
    width: 77.7em;
    margin: auto;
    text-align: left;
}

.admin #wrapper{
    width: 100%;	
}

/*logo*/

#logo{
    margin-top: 17px;
    text-align: center;
}

.admin #logo{
    width: 15%;
}

.admin.login #logo{
    width: auto;
    margin-bottom: 17px;
}

/*left-content*/

#left-content{
    min-width: 146px;
    width: 14.6em;
    margin-top: 16px;
}

.admin #left-content{
    min-width: 15%;
    width: 15%;
    margin-top: 0;
}

/*#left-content .request-quote*/

#left-content .request-quote{
    margin: 14px 0 10px 0;
}

#left-content .request-quote *{
    line-height: 1em;
}

#left-content .request-quote a{
	display: block;
	min-width: 146px;
	width: 14.6em;
	min-height: 35px;
	height: 3.5em;
	padding: 10px 0 12px 0;
	background: #22B14C;
	text-align: center;
}

#left-content .request-quote a:hover{
	background: #707070;
}

#left-content .request-quote big{
	display: block;
	color: #000;
	font-size: 23px;
	letter-spacing: -1px;
}

#left-content .request-quote small{
	display: block;
	color: #FFF;
	font-size: 13px;
	letter-spacing: -1px;
}

/*#left-content .contact*/

#left-content .contact p{
    color: #707070;
    font-size: 10px;
}
#left-content .phone p { color: #707070; font-weight: bold; font-size: 18px }
#left-content .contact p b{
    font-size: 11px;
}

/*#menu .menu*/

#menu li{
    font-size: 11px;
}

#menu .menu li{
    margin-bottom: 2px;
}

#menu .menu li a{
    display: block;
    padding: 4px 5px 4px 5px;
    background: #EEF0F1;
    color: #707070;
}

/*IE5.5, 6 hack*/
* html #menu .menu li a{
	height: 0;	
}

#menu .menu li a:hover{
    background: #707070;
    color: #FFF;
}

#menu .menu .selected{
    background: #707070;
	color: #FFF;
}

#menu .menu .checked a{
    background: #22B14C;
	color: #FFF;
}

/*#menu .sub-menu*/

#menu .sub-menu{
	padding: 1px 0 1px 0;
    margin-bottom: 2px;
    background: #707070;
}

#menu .sub-menu li{
    padding-left: 12px;
	margin: 6px 0 6px 5px;
}

#menu .sub-menu li a{
    color: #EEF0F1;
}

#menu .sub-menu li a:hover{
    color: #22B14C;
}

#menu .sub-menu.checked{
    background: #22B14C;
}

#menu .sub-menu.checked li a:hover{
    color: #707070;
}

#menu .sub-menu.checked .selected{
    background: url(images/arrow_white.gif) no-repeat left;
    padding-left: 12px;
}

/*default-header*/

#default-header{
    min-width: 613px;
    width: 61.3em;
    padding: 25px 0 10px 0;
    background: url(images/header_bg.jpg) repeat;
    text-align: center;
}

#default-header *{
	line-height: 1em;
}

#default-header .line1{
	color: #FFF;
    font-size: 35px;
}

#default-header .line2{
	color: #FFF;
    font-size: 47px;
}

#default-header .line3{
	color: #000;
    font-size: 38px;
}

/*header*/

#header{
    min-width: 613px;
    width: 61.3em;
    padding: 40px 0 15px 0;
    background: url(images/header_bg.jpg) repeat;
    text-align: center;
}

.admin #header{
    min-width: 84%;
    width: 84%;
}

#header *{
    line-height: 1em;
}

#header p{
    color: #FFF;
    font-size: 40px;
}

/*page-nav*/

#page-nav{
    min-width: 613px;
    width: 61.3em;
    padding: 5px 0 5px 0;
    background: #EEF0F1;
}

.admin #page-nav{
    width: 84%;
}

.admin.login #page-nav{
    width: 100%;
}

#page-nav ul{
    margin-left: 20px;
}

#page-nav li{
    float: left;
    padding: 0 15px 0 15px;
    background: url(images/arrow_gray.gif) no-repeat left;
    font-size: 11px;
}

#page-nav li a{
    float: left;
    color: #707070;
}

#page-nav .selected{
    background: url(images/arrow_green.gif) no-repeat left;
    color: #22B14C;
    font-weight: bold;
}

#page-nav a:hover{
    color: #22B14C;
}

/*main-content*/

#main-content{
	min-width: 613px;
	width: 61.3em;
	min-height: 380px;
	margin-top: 25px;
    color: #707070;
}

* html #main-content{
	height: 380px;
}

.admin #main-content{
    width: 84%;
}

.admin.login #main-content{
    width: 100%;
}

.home #main-content{ background: #FFF url(images/yogurt2.jpg) no-repeat right top; }
.fillers #main-content{ background: url(images/filler_v1.jpg) no-repeat right top; }
.application #main-content{ background: url(images/yogurt.jpg) no-repeat top right; }
.questions #main-content{ background: url(images/mayo.jpg) no-repeat right top; }
.parts #main-content { background: url(images/trio.jpg) no-repeat right top; }
.instock #main-content { background: url(images/juice.jpg) no-repeat right top; }
.contact #main-content { background: url(images/pb.jpg) no-repeat right top; }

#main-content h1{
    margin-bottom: 10px;
    color: #22B14C;
    font-size: 27px;
}

#main-content h2{
	margin-bottom: 15px;
	color: #707070;
    font-size: 17px;
}

#main-content h3{
	margin-bottom: 5px;
	color: #707070;
    font-size: 12px;
}

#main-content p,
#main-content li{
    font-size: 11px;
}

#main-content .comparison{
    width: 300px;
}

#main-content .left.style1{
	min-width: 350px;
	width: 35em;
}

.home #main-content ul.left{
    padding-right: 35px;
}

.home #main-content ul.left li{
    margin-bottom: 5px;
}

.foilsealers3 #main-content ul.left{
    min-width: 150px;
    width: 15em;
}

.fillers #main-content .caption{
	min-width: 135px;
	width: 13.5em;
	margin: 95px 0 0 290px;
}

.foilsealers3 #main-content .caption{
	text-align: right;
}

/*#main-content .img-table*/

#main-content .img-table .head{
	padding: 3px 20px 3px 20px;
	margin-bottom: 2px;
	background: #707070;
	color: #FFF;
	font-size: 14px;
}

#main-content .img-table .center{
	float: left;
	margin-left: 8px;
}

#main-content .img-table .left,
#main-content .img-table .center,
#main-content .img-table .right{
	margin-top: 5px;		
	margin-bottom: 2px;	
	cursor: pointer;
}

#main-content .img-table p{
	text-align: right;
}

#main-content .img-table .box{
	position: relative;
	display: block;
	min-width: 199px;
	width: 19.9em;
	min-height: 138px;
	height: 13.8em;
    color: #707070;
}

#main-content .img-table .box *{
	position: relative;
	z-index: 1;
}

#main-content .img-table .box img{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

#main-content .img-table .box big{
	display: block;
	padding: 7px 10px 0 20px;
    font-size: 15px;
}

#main-content .img-table .box small{
	display: block;
	margin: 15px 10px 0 0;
	text-align: left;
    font-size: 11px;
}

/*.home .img-table*/

.home #main-content .img-table .box{
	text-align: right;
}

.home #main-content .img-table .box1 small{margin-left: 135px;}
.home #main-content .img-table .box2 small{margin-left: 120px;}
.home #main-content .img-table .box3 small{margin-left: 130px;}
.home #main-content .img-table .box4 small{margin-left: 100px;}
.home #main-content .img-table .box5 small{margin-left: 125px;}

/*form*/

.form .input{
	clear: both;
	margin-bottom: 6px;
}

.form .input p{
	float: left;
	width: 240px;
	text-align: right;
	margin-top: 4px;
}

.form .input input,
.form .input textarea{
	margin-left: 10px;
}

.form .checkboxs{
	padding-top: 10px;
}

html>/**/body .form .checkboxs input{
	margin-bottom: 7px;
}

.form .checkboxs input{
	margin-left: 25px;
}

.form .checkboxs p{
	margin-top: 30px;
}
