/* GIBcam-DRILL-Website Layout: Screen */
/* Bereichseinteilung */

body {
background: url(http://www.gibcam.com/graphic/logo-background.jpg) #CFCFCF;
color: #000000;
margin: 0;
padding: 10px; /* Ein wenig Abstand damit der Anschein eines Blattes auf der Wand immer erhalten bleibt */
font-size: 100.01%; /* umgeht den Font-Size-Bug im Safari, älteren Operas und IE */
font-family: verdana, arial, sans-serif ;
}

.container  {
position : relative;
top : 0;
left : 0;
width: 1024px;
margin: auto;
}

.hproduct  {
position : relative;
top : 22px;
left : 0;
width: 1024px;
height:1900px;
background: #FFFFFF url(http://www.gibcam.com/graphic/bg_5axmill.gif) no-repeat left bottom;
border: 1px solid #006394;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
box-shadow:8px 8px 8px rgba(0,99,148,0.25);
-webkit-box-shadow:8px 8px 8px rgba(0,99,148,0.25);
-moz-box-shadow:8px 8px 8px rgba(0,99,148,0.25);
} /* viewport für produktseiten */

.viewport  {
position : relative;
top : 22px;
left : 0;
width: 1024px;
height:720px;
background: #FFFFFF url(http://www.gibcam.com/graphic/bg_5axmill.gif) no-repeat left bottom;
border: 1px solid #006394;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
box-shadow:8px 8px 8px rgba(0,99,148,0.25);
-webkit-box-shadow:8px 8px 8px rgba(0,99,148,0.25);
-moz-box-shadow:8px 8px 8px rgba(0,99,148,0.25);
/* For IE 8
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#BFBFBF')";*/
 /* For IE 5.5 - 7
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#BFBFBF');*/
}
#vpindex  {height:  1200px;}
#vpcontact {height: 1020px;}
#vpanreise {height: 1300px;}
#vpdemoanfo {height: 960px;}
#vpmedien {height:800px;}
#vpkoopera {height:1200px;}
#vpprodukte,
#vpmilling,
#vp5axmill,
#vpscan {height:850px;}
#vpdrilling {height:860px; }
#vpimpressum {height:950px;}
#vphardware  {height: 950px;}
#vpupdates {height:1800px;}
#vptippstricks {height:2000px;}

.statusbar {
position : absolute;
top : 1px;
right : 1px;
height : 20px;
width : 511px;
margin : 0;
padding : 0;
background-color : transparent;
font-size: 8pt;
text-align: right;
}
.statusbar h3        {display : none;}
.statusbar a         {color : #C00000; font-size: 8pt; margin-right : 5px; text-decoration : none;}
.statusbar a:link    {color : #4F4F4F; font-size: 8pt; margin-right : 5px; text-decoration : none;}
.statusbar a:visited {color : #8F8F8F; font-size: 8pt; margin-right : 5px; text-decoration : none;}
.statusbar a:hover   {color : #0000FF; font-size: 8pt; margin-right : 5px; text-decoration : underline;}
.statusbar a:active,
.statusbar a:focus   {color : #0000FF; font-size: 8pt; margin-right : 5px; text-decoration : none;}
.statusbar li        {display : inline; font-size: 8pt; margin-right : 5px; }
.statusbar ul        {
display : inline;
list-style-type : none;
padding : 0;/* beides notwendig Netscape u Opera */
margin : 0;
}

.header {
position : absolute;
top : 1px;
left : 1px;
width : 1022px;
height : 150px;
background: url(../graphic/bg_header.png) no-repeat right;
border-bottom: 1px #FFFFFF solid;
}

/* Hauptnavigation, immer sichtbar */
.menubar {
position : absolute;
top : 175px;
left : 2px;
height : 25px;
width : 1022px;
padding-top : 5px;
background-color : #006394;
/*
background :
-webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, rgb(255,255,255)),
    color-stop(0.05, rgb(0,99,148)),
    color-stop(0.95, rgb(0,99,148)),
    color-stop(1, rgb(252,252,252))
);
background : -moz-linear-gradient(
    center bottom,
    rgb(255,255,255) 0%,
    rgb(0,99,148) 5%,
    rgb(0,99,148) 95%,
    rgb(252,252,252) 100%
);
*/
text-align: right;
font-weight: bold;
-webkit-border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
-khtml-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
box-shadow:5px 5px 5px rgba(200,200,200,0.25);
-webkit-box-shadow:5px 5px 5px rgba(200,200,200,0.25);
-moz-box-shadow:5px 5px 5px rgba(200,200,200,0.25);
}
.menubar h3        {display : none;}
.menubar a:link,
.menubar a:visited,
.menubar a:active  {font-size: 12pt; color: #FFFFFF; text-decoration : none; margin-right : 10px;}
.menubar a:hover   {font-size: 12pt; color: #FF9C6B; text-decoration : none; margin-right : 10px;}
.menubar li        {display : inline;}
.menubar ul        {
display : inline;
list-style-type : none;
padding : 0;/* beides notwendig Netscape u Opera */
margin : 0;
}
/* -----Ads------*/
.ads {
position : absolute;
top : 204px;
left : 0;
width: 170px;
margin : 0;
}

.description{
position : absolute;
top : 173px;
left : 1px;
width : 490px;
padding : 10px;
background-color : transparent;
}
/* Themennavigation */
.navigation {
background-color : white;
position : absolute;
top : 220px;
left : 10px;
width: 170px;
margin : 0;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 0px;
padding-right : 0px;
border: solid 1px #7F7F7F;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-khtml-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
border-top: solid 1px #7F7F7F;
box-shadow:5px 5px 5px rgba(200,200,200,0.25);
-webkit-box-shadow:5px 5px 5px rgba(200,200,200,0.25);
-moz-box-shadow:5px 5px 5px rgba(200,200,200,0.25);
}

.navigation h3      {display : none;}
.navigation ul      {padding-left : 5px; background-color : transparent;}
.navigation li      {width: 163px;  height: 20px; color : rgb(0,99,148); display: block; border-bottom: 1px solid #7F7F7F; border-right: 0px solid #7F7F7F; margin-top: 20px; margin-bottom: 15px;
font-family: Tahoma, arial, sans-serif;
font-size: 11pt;
font-weight: bold;
-webkit-border-radius: 0px 0px 9px 0px;
-moz-border-radius: 0px 0px 9px 0px;
-khtml-border-radius: 0px 0px 9px 0px;
border-radius: 0px 0px 9px 0px;
box-shadow:4px 4px 4px rgba(200,200,200,0.25);
-webkit-box-shadow:4px 4px 4px rgba(200,200,200,0.25);
-moz-box-shadow:4px 4px 4px rgba(200,200,200,0.25);
background-color: transparent;
/*background: -moz-linear-gradient(right bottom, rgb(240,240,240) 0%, rgb(255,255,255) 57%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #8598aa), color-stop(0.17, #fff),color-stop(0.83, #fff), color-stop(0.99, #ebebeb), color-stop(1, #fff));*/
}
.navigation a,
.navigation a:link,
.navigation a:visited,
.navigation a:active,
.navigation a:focus   {text-decoration : none;}
.navigation a:hover   {text-decoration : none;}

/* Navigation: Produktportfolio */
.pfolio {
        position : relative;
        top: 190px;
        left : 10px;
        width:170px;
    }
.pfolio h2 {display : none;
    }
.pfolio h3 {margin: 10px 0 0 0;
    padding: 2px 2px 2px 2px;
    border-top:1px solid #7f7f7f;
    border-left:1px solid #7f7f7f;
    border-right:1px solid #7f7f7f;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -khtml-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    background: #7f7f7f;
    font-family: Tahoma, arial, sans-serif;
    font-size : 10pt;
    font-weight : bold;
    color: white;
    }
.pfolio h4 {margin: 0;
    padding: 2px 2px 2px 2px;
    border-left:1px solid #7f7f7f;
    border-right:1px solid #7f7f7f;
    background: white;
    font-family: Tahoma, arial, sans-serif;
    font-size : 18pt;
    font-weight : bold;
    color: #7f7f7f;
    }
.pfolio p  {margin: 0;
    padding: 2px 4px 4px 4px;
    border-left:1px solid #7f7f7f;
    border-right:1px solid #7f7f7f;
    border-bottom: 1px solid  #7F7F7F;
    background: white;
    font-size : 8pt;
    text-align: justify;
    color: #7f7f7f;
    }
.pfolio p.unten  {
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -khtml-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
    }
.folio img {border:0;
    }
.pfolio a   {text-decoration : none;
    }
.pfolio a:hover {color: #7F7F7F; text-decoration : underline;
    }
/* Ende: Navigation: Produktportfolio */

.content {
position : absolute;
top : 180px;
left : 200px;
/* width : 778px; */
padding : 0px;
background-color : transparent;
}
/*
.content table {width: 100%;
border: #EFEFEF solid 1px;
margin: 0.4em 0em 0.2em 0em;
-webkit-border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-khtml-border-radius: 3px 3px 3px 3px;
border-radius: 3px 3px 3px 3px;
box-shadow:4px 4px 4px rgba(200,200,200,0.25);
-webkit-box-shadow:4px 4px 4px rgba(200,200,200,0.25);
-moz-box-shadow:4px 4px 4px rgba(200,200,200,0.25);
}
-*/
/*-------Illustrationen--- 3 Spalten-Layout -------*/
.illustration {
/* display : none; */
position : absolute;
right: 0px;
background-color : transparent;
width : 200px;
margin : 0px;
padding: 0px;
}
#illunormal {top : 210px;}
#illudirekt {top : 113px; padding-top: 20px;}


#illutxt {
font-size : 8pt;
font-style:italic;
padding-bottom: 20px;
}

/*-------Illustrationen--- 2 Spalten-Layout -------*/
.illu {
position : absolute;
right: 1px;
top : 195px;
background-color : transparent;
width : 500px;
margin : 0px;
padding: 0px;
}

.illu table {width: 100%; }
.illu img   {border: #CFCFCF 1px solid; }
.illu td    {vertical-align: top; }
.legend     {padding: 0 0 15px 0; font-size: 8pt; font-style: italic; }


.vcard {
background-color : transparent;
position : absolute;
top : 0px;
left : 0px;
margin : 60px;
margin-left: 35px;
}
.vcard p {display : none;}

.sprachwahl {
position : absolute;
top : 1px;
left : 1px;
height : 20px;
width : 511px;
margin : 0;
padding : 0;
background-color : transparent;
font-size: 8pt;
text-align: left;
}

.sprachwahl span {display : none;}

/* Layout Inhalt */



h1  {
font-family: Tahoma, arial, sans-serif;
margin: 0;
font-size : 20pt;
font-weight : bold;
}

.header h1{
position: relative;
text-shadow: #BFBFBF -4px 4px 10px;
top: +35px;
left: +200px;
font-family: Tahoma, arial, sans-serif;
color: #006394;
margin: 0;
font-size : 48pt;
font-weight : bold;
}


h2 {
font-family: Tahoma, arial, sans-serif;
margin: 13px 0 0 0;
font-size : 20pt;
font-weight : bold;
color:#3F3F3F;
}
.description h2 {font-size: 12pt;  color:#006394; }

h3 {
font-family: Tahoma, arial, sans-serif;
margin: 0;
font-size : 14pt;
color:#3F3F3F;
}

p  {
font-size : 10pt;
text-align: justify;
line-height : 1.3em;
}
.spalte12 { margin-left :   5px; margin-right : 240px; }
.spalte2  { margin-left : 185px; margin-right : 205px; }
.spalte23 { margin-left : 185px; margin-right :   5px; }

q  {
font-size : 10pt;
text-align : left;
font-weight : bold;
}

ul {
font-size : 10pt;
text-align : left;
list-style: square outside;
}

li {
margin: 0.2em;
vertical-align: middle;
}

td  {
font-size : 10pt;
}

hr {
color:#9F9F9F;
height:1px;
}

sup {
font-size: 0.5em;
vertical-align: text-top;
}
/* ----------Features----------- */
/* ----------Featurespalte----------- */

.features {
position : absolute;
top : 225px;
right: 10px;
width : 209px;
background-color : transparent;
}

#featnormal {top : 199px;}
#featdirekt {top : 225px;}
#feattief {top : 450px;}
#feathardware {top : 225px;}
/* ----------Featureboxen----------- */
.box_title {
margin-top : 16px;
margin-left : 8px;
margin-right : 8px;
margin-bottom : 0px;
background-color: #006394;
-webkit-border-radius: 3px 3px 0px 0px;
-moz-border-radius: 3px 3px 0px 0px;
-khtml-border-radius: 3px 3px 0px 0px;
border-radius: 3px 3px 0px 0px;
color: white;
font-family: Tahoma, sans-serif;
font-size: 12px;
font-weight: bold;
padding:3px;
}
.box_content {
margin-left:8px;
margin-right:8px;
margin-bottom:1px;
margin-top:1px;
background-color: white;
border: #006394 solid 1px;
-webkit-border-radius: 0px 0px 3px 3px;
-moz-border-radius: 0px 0px 3px 3px;
-khtml-border-radius: 0px 0px 3px 3px;
border-radius: 0px 0px 3px 3px;
box-shadow:4px 4px 4px rgba(0,99,148,0.25);
-webkit-box-shadow:4px 4px 4px rgba(0,99,148,0.25);
-moz-box-shadow:4px 4px 4px rgba(0,99,148,0.25);
color: black;
font-size: 10pt;
font-weight: normal;
padding:3px;
}

#featin12  { margin-left : 5px; margin-right :240px; }
#featin12p  { margin-left : 5px; margin-right : 240px; }
#featin2  { margin-left : 185px; margin-right : 205px; }
#featin2p  { margin-left : 185px; margin-right : 205px; }
#featin23  { margin-left : 185px; margin-right :155px; }
#featin23p  { margin-left : 185px; margin-right : 155px; }


/* ---------------------------------- */

a  {
color : #C00000;
text-decoration : none;
}
a:link {
color : #4F4F4F;
text-decoration : none;
}
a:visited {
color : #8F8F8F;
text-decoration : none;
}
a:hover {
color : rgb(0,99,148);
text-decoration : underline;
}
a:active {
color : rgb(0,99,148);
text-decoration : none;
}
a:focus {
color : rgb(0,99,148);
text-decoration : none;
}