body {background: #fff url(imagini/back.jpg) top left repeat-x; color: #fff; cursor:default;}

#wrapper {
	margin:0 auto;
	width: 800px;
}
#sign {
	float: left;
	width: 800px;
	height: 100px;
	margin-top: 23px;
	background: url(imagini/ionutdesigncom.png) top center no-repeat;
	
}
#meniu {
	float: left;
	margin-top: 30px;
	border: 0px solid #333;
}
#lang {
	float: left;
	width: 800px;
	margin-top: 10px;
	border: 0px solid #333;
	text-align: center;
	color: #000;
	font: normal 12pt Arial, Tahoma;
}
#lang a {
	color: #FF0000;
	text-decoration: none;
}
#lang a:hover {
	color: #FF0000;
	text-decoration: underline;
}

.footer {
	float: left;
	width: 800px;
	margin-top: 277px;
	text-align: center;
	color: #333;
	font: 12px Arial, Tahoma, Verdana;
}
.footer a {
	color: #ff0000;
	text-decoration: none;
}
.footer a:hover {
	color: #ff0000;
	text-decoration: underline;
}

.block {
	float: left;
	width: 138px;
	height: 98px;
	margin-left: 50px;
}

.host {
	width: 130px;
    height: 91px;
	background:url(imagini/hosting.png) top left no-repeat;
	cursor:pointer;
}
.host:hover {
	width: 130px;
    height: 91px;
	background:url(imagini/hosting_o.png) top left no-repeat;
	cursor:pointer;
}
.desi {
	width: 127px;
    height: 91px;
	background:url(imagini/design.png) top left no-repeat;
	cursor:pointer;
}
.desi:hover {
	width: 127px;
    height: 91px;
	background:url(imagini/design_o.png) top left no-repeat;
	cursor:pointer;
}
.solu {
	width: 130px;
    height: 91px;
	background:url(imagini/solution.png) top left no-repeat;
	cursor:pointer;
}
.solu:hover {
	width: 130px;
    height: 91px;
	background:url(imagini/solution_o.png) top left no-repeat;
	cursor:pointer;
}
.mari {
	width: 128px;
    height: 91px;
	background:url(imagini/mariage.png) top left no-repeat;
	cursor:pointer;
}
.mari:hover {
	width: 128px;
    height: 91px;
	background:url(imagini/mariage_o.png) top left no-repeat;
	cursor:pointer;
}


.gazduire {
	width: 130px;
    height: 91px;
	background:url(imagini/gazduire-web.png) top left no-repeat;
	cursor:pointer;
}
.gazduire:hover {
	width: 130px;
    height: 91px;
	background:url(imagini/gazduire-web_o.png) top left no-repeat;
	cursor:pointer;
}
.creare-web {
	width: 127px;
    height: 91px;
	background:url(imagini/creare-web-site.png) top left no-repeat;
	cursor:pointer;
}
.creare-web:hover {
	width: 127px;
    height: 91px;
	background:url(imagini/creare-web-site_o.png) top left no-repeat;
	cursor:pointer;
}
.solutii-it {
	width: 130px;
    height: 91px;
	background:url(imagini/solutii-it.png) top left no-repeat;
	cursor:pointer;
}
.solutii-it:hover {
	width: 130px;
    height: 91px;
	background:url(imagini/solutii-it_o.png) top left no-repeat;
	cursor:pointer;
}
.foto {
	width: 128px;
    height: 91px;
	background:url(imagini/foto-video.png) top left no-repeat;
	cursor:pointer;
}
.foto:hover {
	width: 128px;
    height: 91px;
	background:url(imagini/foto-video_o.png) top left no-repeat;
	cursor:pointer;
}

a.hosting {
    position:relative; /*this is the key*/
    z-index:24;
	border: 0px;
    color:#000;
    text-decoration:none;
	}

a.hosting:hover {
	z-index:25;
	}

a.hosting span {
	display: none;
	}

a.hosting:hover span { /*the span will display just on :hover state*/
    display:block;
    position: absolute;
    top:120px; left:100px;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center;
	}
	
a.design {
    position:relative; /*this is the key*/
    z-index:24;
	border: 0px;
    color:#000;
    text-decoration:none;
	}

a.design:hover {
	z-index:25;
	}

a.design span {
	display: none;
	}

a.design:hover span { /*the span will display just on :hover state*/
    display:block;
    position: absolute;
    top:120px; left:-88px;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center;
	}
	
a.solution {
    position:relative; /*this is the key*/
    z-index:24;
	border: 0px;
    color:#000;
    text-decoration:none;
	}

a.solution:hover {
	z-index:25;
	}

a.solution span {
	display: none;
	}

a.solution:hover span { /*the span will display just on :hover state*/
    display:block;
    position: absolute;
    top:120px; left:-276px;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center;
	}

a.mariage {
    position:relative; /*this is the key*/
    z-index:24;
	border: 0px;
    color:#000;
    text-decoration:none;
	}

a.mariage:hover {
	z-index:25;
	}

a.mariage span {
	display: none;
	}

a.mariage:hover span { /*the span will display just on :hover state*/
    display:block;
    position: absolute;
    top:120px; left:-464px;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center;
	}