/* I N F O Kachelgroesse: 284px, ohne margin: 283px; small:141px main-content-warp: 852px (3x Kachelgroesse) main-content 852px (-1px width) orange: #ff6600, rgba(255,102,0,1); dunkler: rgba(255,102,0,1); */ * {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} body, .editmode #bar_content .bgholder { background: url(../images/m1.jpg) right bottom no-repeat, #ff6600 url(../images/m2.jpg) right bottom no-repeat; xxxbackground: url(../images/m1small.png) right bottom no-repeat, #ff6600 url(../images/m2small.png) right bottom no-repeat; xxxbackground: #ff6600 url(../images/m1.jpg) center 0px no-repeat; xxxbackground: #ff6600; } /* body.projekt_logbuecher, body.projekt_mhh {background: url(/cargo/projects/o8/images/bg_mhh.jpg) right bottom no-repeat, #ff6600 url(/cargo/projects/o8/images/bg_mhh.jpg) right bottom no-repeat;} */ /* body::after { content: ""; background: url(/cargo/projects/o8/images/m1.jpg) right bottom no-repeat, #ff6600 url(/cargo/projects/o8/images/m2.jpg) right bottom no-repeat; opacity: 0.8; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: -1; } */ a img {border: 0px;} a {text-decoration: none;} @font-face { font-family: 'Din'; src: url('../../../css/fonts/Din/dinrrg.eotba72.html?v=4.0.3'); src: url('../../../css/fonts/Din/dinrrg.eotd41d.html?#iefix&v=4.0.3') format('embedded-opentype'), url('../../../css/fonts/Din/dinrrgba72.woff?v=4.0.3') format('woff'), url('../../../css/fonts/Din/dinrrg.ttfba72.html?v=4.0.3') format('truetype'), url('../../../css/fonts/Din/dinrrgba72.svg?v=4.0.3#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Din'; src: url('../../../css/fonts/Din/dinbbba72.eot?v=4.0.3'); src: url('../../../css/fonts/Din/dinbbd41d.eot?#iefix&v=4.0.3') format('embedded-opentype'), url('../../../css/fonts/Din/dinbbba72.woff?v=4.0.3') format('woff'), url('../../../css/fonts/Din/dinbbba72.ttf?v=4.0.3') format('truetype'), url('../../../css/fonts/Din/dinbbba72.svg?v=4.0.3#fontawesomeregular') format('svg'); font-weight: bold; font-style: normal; } * {font-family: Din;} body {margin:0; padding:0; font-size:13px;} #page {margin:0px auto; max-width:853px;} /* teaser + 1px x3 */ .box {border: 1px dotted white; border-bottom:0;} /* #page +1px */ .box.footer {border-bottom: 1px dotted white;} /* #page +1px */ .nav1 {background: rgba(233,93,0,0.6); xxxbackground: rgba(0,0,0,0.03); position:relative; padding:4px; padding-left:3px;margin-top:0px; z-index:1001; width:100%; top:0; border-top:none; height:40px;} .nav2 {background: rgba(233,93,0,0.3); xxxbackground: rgba(0,0,0,0.03); position:relative; padding:6px 6px 6px 10px; color:white; padding-bottom:20px; font-size: 13px; height:157px;} .sidenav {position: absolute; z-index:1; right:0; top:0; padding: 6px 8px 0 0; text-align:right;} .sidenav a {display: block; text-decoration: none; color:white; font-style: italic} .sidenav a.login {margin-bottom:20px;} .sidenav a:hover {text-decoration: underline;} .footer {color:#fff; padding:6px; clear: both; border-top:0;} .clearer {position:relative; width:0; height:0; clear: both;} .box.top {display: none; xxxbackground:rgba(0,0,0,0.15); color:#ff6600; border:0; padding-left:50px; height:45px; } .box.top-middle {position:relative; padding-top: 5px; font-size:12px;} .box.top #nav_originator {display:inline-block; width:42px; height:42px; left:0px; top:0px; cursor:pointer; position:absolute; z-index:1002; background: url(../images/mobile_nav.png) 0 2px no-repeat} .logo {position:relative; margin-left:-10px; top:35px} .logo img {width:110px;} .company {color:white; font-size:28px; left:142px; top:-38px; position: relative;} .company .tic, .company_small .tic {position:relative; display: inline-block; left:5px; top:5px; width:2px; height:7px; background:white; font-size:0px;} .main-content {xxxbackground: rgba(0,0,0,0.03); padding-top:0; border-top:0; border-bottom:0;} .main-content-wrap {padding-top:0; position:relative; width: 852px; margin-bottom:-1px;} .footer img {left:-10px; position: relative;} .breadcrumbs {top:157px; margin-left: -12px; position: absolute; color:white; transform:rotate(90deg); -webkit-transform:rotate(90deg); transform-origin: 0 0;} .breadcrumbs a {color:white;} .breadcrumbs span {opacity:0.5;} .startpage .breadcrumbs {top:212px; } /* startpage settings */ .startpage .logo img {width:183px} .startpage .nav2 {height:215px;} .startpage .company {left:193px;} /* M E N U */ /* start element */ .nav1 .menu {position:relative; margin:0; z-index:1001; top:0; left:0; width:auto; height:28px; padding:0 0 2px 0;} .nav1 .menu ul {position: absolute;} .nav1 .menu ul, .nav1 .menu>li:hover {margin-left:0; opacity:1; background: rgba(255, 102, 0, 1);} /* start li */ .nav1 ul.menu li {float: left; list-style:none;} .nav1 ul.menu>li.arrow {background-image:none;} .nav1 .menu li ul li {list-style:none; width:100%; opacity: 1; } .nav1 .menu li ul {border:1px solid white; xxxdisplay:none; opacity:0.0; pointer-events: none; margin-top:-1px; padding: 12px 0 12px 0; margin-left:0px;} .nav1 .menu li ul li ul {margin-left:196px; margin-top: -21px} .nav1 .menu a {display: block; cursor:default; font-weight: normal; font-size:13px; text-align: left; text-decoration: none; border:0} /* startlayer */ .nav1 ul.menu>li {border:1px solid transparent; padding:0px; padding-bottom:8px; height:42px;} .nav1 ul.menu>li:hover {box-shadow: rgba(0,0,0,0.1) 8px 8px 8px;} .nav1 ul.menu>li>a {border:1px solid transparent; border-bottom:0; font-size:24px; padding: 0 8px 9px 5px; position:relative; z-index: 20; display:inline-block; } .nav1 ul.menu>li:hover> a {border:1px solid white; border-bottom:0; background: #ff6600;} /* sublayer */ .nav1 .menu li ul li:hover {background: #b24700} /* separator */ .nav1 .menu li.seperator {height:10px; font-size:0px;} .nav1 .menu li.seperator {height:2px; margin: 8px 0 8px 0; padding:0} /* Hover, behaviour */ .nav1 .menu li:hover ul ul, .nav1 .menu li:hover ul ul ul, .nav1 .menu li.hover ul ul, .nav1 .menu li.hover ul ul ul {xxxdisplay:none} .nav1 .menu li:hover ul, .nav1 .menu li li:hover ul, .nav1 .menu li li li:hover ul, .nav1 .menu li.hover ul, .nav1 .menu li li.hover ul, .nav1 .menu li li li.hover ul {display:block; opacity:1; pointer-events: auto;} .nav1 {margin-bottom: 0px;} .nav1 ul {margin:0} .nav1 ul li, .nav1 ul li span, .nav1 ul li a {background: none; padding:0; margin:0; white-space: nowrap; color:white; text-decoration:none;} .nav1 ul li span {display:none;} .nav1 ul li {display:inline-block; xxxpadding-right:8px;} .nav1 ul li ul li a {margin:0 13px 0 13px; padding-bottom:5px; padding-top:4px; } .nav1 .menu li ul li a {cursor:pointer} /* Hintergund, Schatten und Trennlinien */ .nav1 .menu li ul li ul {margin-left:246px;} .nav1 .menu li ul {width:370px;} .nav1 .menu li ul li a {border-bottom:1px dotted white} /*#fea760; */ .nav1 .menu li ul li:last-child a {border-bottom:none;} .nav1 .menu ul {box-shadow: rgba(0,0,0,0.1) 8px 8px 8px;} .nav2 ul {margin: 0px; padding:1px; list-style:none; } .nav2 ul li {display:inline-block; padding-right:12px;} .nav2 li a {font-size:13px; color:white; text-decoration:none;} .nav2 li a:hover {text-decoration:underline;} .cargo_fg_form {width:350px;} .cargo_fg_form .cargofield {border:1px solid #ff6600; height:25px; background: white; xxfloat:left; margin-right:30px;} .cargo_fg_form textarea.cargofield {height:200px; width:500px;} .cargo_fg_form label {width:90px; float:left; xxxmargin-bottom: 10px;} .cargo_fg_form #cargo_comment_text {margin-top:2px;} .o8button {background: #ff6600; color:white; border:0; cursor: pointer; margin:3px; padding:5px 10px 5px 10px; margin-left:70px; position: relative;} .buttonline li {list-style: none; list-style-image: none;} .cargofield {margin-bottom:5px;} @media only screen and (min-width: 900px) { .nav1 .menu ul { -moz-transition: all 1.0s ; -o-transition: all 1.0s ; transition: all 1.0s ; } .nav1 .menu li , .nav1 .menu ul li { -moz-transition: all 1.0s ; -o-transition: all 1.0s ; transition: all 1.0s ; } .nav1 .menu li a { -moz-transition: all 1.0s ; -o-transition: all 1.0s ; transition: all 1.0s ; } } .bb {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; *behavior: url(../../../js/polyfill/boxsizing.html);} .teaser_element {width:283px; height:283px; margin:0; margin-right:1px; margin-top: 1px; float:left; position:relative; } .teaser_element .caption {position:absolute; left:12px; top:8px; padding:0; margin:0;} .teaser_element .caption dd {padding:0; margin:0; font-size:13px} .teaser_element .caption dd a.head {color:black; text-decoration:none;} .teaser_element .caption dd.text {color: #aaa;} .teaser_element img {width:100%; height:auto;} .teaser_element.small {width:142px; height:142px;} .image {width: 283px; height:283px; margin:0; margin-right:1px; margin-top: 1px; float:left; position: relative;} .image.small {width:141px; height:141px;} .image dt img {width:100%; height:auto;} .image .icon_open {pointer-events: none; position: absolute; display:block; top:10px; left:10px; display: none; width:52px; height:52px; background: url(../images/icon_open.png) 0 0 no-repeat; } .kunden .image.small {background: white;} .kunden .image dt img {width:141px;} .kunden .image a {cursor: default !important;} .image.nolink a {cursor: default !important;} .article {width: 567px; height:567px; float:right; position: relative; padding:20px; background:white; margin-right:1px; margin-top:1px; xxxbackground: white url(../images/article_bar_top.gif) 0 0 repeat-x;} .article.rows1 {height:283px;} .article.rows2 {height:567px;} .article.rows3 {height:851px;} .article.rows4 {height:1136px;} .article.rows5 {height:1420px;} .article.rows6 {height:1704px;} .article.rows100 {height:100%;} .article h2.head {font-size:30px; font-weight:normal; margin: 0 0 6px 0;} .article div.leadin {font-size:14px; font-weight:normal; font-style:italic; color: #666; margin:0px 0 32px 0; padding-top:2px; letter-spacing:0.03em; border-top: 1px dotted #ccc;} .article > div.text {font-size:14px; width:360px; float:left} .article > div.textright {float: right; width: 150px; color:#ff6600; line-height:1.4em;} .article > div.textright div {border-top: 1px solid #ff6600;} .article > div.textright a {color: #ff6600; text-decoration: none;} .article a {color: #666;} .article ul {margin:10px; padding-left:20px; list-style-image: url(../images/bullet.gif)} .article.kunden {height: 283px} .article.empty {padding:0px;} .article.empty .emptycontent {width:auto; height:100%;} .c2c-slideshow-overlay {position: absolute; width:100%; height:100%; left:0; top:0; z-index: 1000; } .c2c-slideshow-container {position:fixed; left:-10000px; width:1200px; box-shadow: rgba(0,0,0,0.35) 10px 10px 30px; border-spacing:0; border-collapse: collapse; } .c2c-slideshow-container td {padding:0;} .c2c-slideshow-caption {position: absolute; color: #aaa; padding:3px 6px; background:white; float:left; top:-20px; font-size:11px; z-index:2; box-shadow: rgba(0,0,0,0.15) 2px 0px 2px;} .c2c-slideshow-caption span {color: #000;} .c2c-slideshow-row.thumps >td {} .c2c-slideshow-image-container {position: relative; xxxwidth:10%;} .c2c-slideshow-ff-cell-pos-bug-fix {position: relative; left:0; top:0; width:100%; height:100%; z-index:1;} .c2c-slideshow-image-pl {position:relative;} .c2c-slideshow-overimg-pl {position:absolute; top:0;} .c2c-slideshow-overimg, .c2c-slideshow-img {width:100%;} .c2c-slideshow-container .thumbs {vertical-align:top;} .c2c-slideshow-container .thumbs img {width:100%; z-index:10; position:relative; z-index:1; } .c2c-slideshow-container .thumbs.bottom .inner {margin-left:-5px;} .c2c-slideshow-container .thumbs .inner > div {width:80px; float:left; padding:5px; cursor:pointer;} .c2c-slideshow-arrow1 {vertical-align:middle; cursor:pointer; width:80px; -moz-user-select:none;} .c2c-slideshow-arrow2 {vertical-align:middle; cursor:pointer; width:80px;-moz-user-select:none;} .c2c-slideshow-arrow1-inner {xxxborder:1px solid cyan; xxxposition: absolute; height:150px; background: url(../../../images/c2c-slideshow-arrow1.png) center center no-repeat;} .c2c-slideshow-arrow2-inner {xxxborder:1px solid cyan; xxxposition: absolute; height:150px; background: url(../../../images/c2c-slideshow-arrow2.png) center center no-repeat;} .c2c-slideshow-close {position:absolute; cursor:pointer; background: url(../../../images/c2c-icon-slideshow-close.png) 0 0 no-repeat; height:21px; width:21px; top:1px; right:-26px; -moz-user-select:none} .c2c-slideshow-container .thumbs.bottom {xxxpadding-bottom:20px;} .c2c-slideshow-container .thumbs.top {padding-top:20px;} /* f�r Beschriftung */ .c2c-slideshow-container .thumbs.left {width:0;} .c2c-slideshow-container .thumbs.right {width:0;} .c2c-slideshow-container .thumbs.left .inner {margin-top:-5px;} .c2c-slideshow-container .thumbs.right .inner {margin-top:-5px; margin-left:5px;} .slideshow_right .c2c-slideshow-close {left:-25px;} /* slideshow width */ .c2c-slideshow-overimg-pl, .c2c-slideshow-image-pl {width:100%;} .c2c-slideshow-overlay {background: rgba(0,0,0,0.0) } /* xxxurl(/cargo/projects/o8/images/stripes_trans_white.png) 0 0*/ /* orange, #ff6600 */ .c2c-slideshow-container td {} .c2c-slideshow-container {background: rgba(0,0,0,0.5); border:1px solid black;} /* alternatives Layout */ .c2c-slideshow-container {background: rgba(0,0,0,0.0); border:0; box-shadow:none;} .c2c-slideshow-img, .c2c-slideshow-overimg, .c2c-slideshow-container .thumbs .inner img {border:1px solid white; box-shadow: rgba(0,0,0,0.45) 10px 10px 30px; } .c2c-slideshow-overimg {box-shadow:none;} .project_adabweb .c2c-slideshow-container {max-width:1300px;} .project_tacheles .c2c-slideshow-container {max-width:1200px;} .project_kaercher .c2c-slideshow-container {max-width:1080px;} .project_kaercher .c2c-slideshow-container .thumbs .inner > div {width:60px;} .project_kaercher .c2c-slideshow-container .thumbs .inner {width:150px;} .project_nephrologie .c2c-slideshow-container {max-width:750px;} .projekt_logbuecher .c2c-slideshow-container {max-width:1050px;} /* andere widths, projektbezogen */ /* .project_kaercher .c2c-slideshow-overimg-pl, .project_kaercher .c2c-slideshow-image-pl {width:562px;} .project_kaercher .thumbs.right .inner {width:200px;} .project_kaercher .c2c-slideshow-container .thumbs .inner > div {width:75px;} .project_freibad .c2c-slideshow-overimg-pl, .project_freibad .c2c-slideshow-image-pl {width:700px;} .project_freibad .c2c-slideshow-img, .project_"fg_formfreibad .c2c-slideshow-overimg, .project_freibad .c2c-slideshow-container .thumbs .inner img {} .project_freibad .thumbs.right .inner {width:200px;} .project_freibad .c2c-slideshow-container .thumbs .inner > div {width:75px; min-height:75px;} .project_freibad .c2c-slideshow-close {left:-25px;} .project_rehrbrink .c2c-slideshow-overimg-pl, .project_rehrbrink .c2c-slideshow-image-pl {width:720px;} .project_freibad .c2c-slideshow-container .thumbs.right .inner {width:100px;} .project_freibad .c2c-slideshow-container .thumbs .inner > div {width:75px; min-height:75px;} .project_kaercher .c2c-slideshow-container .thumbs .inner {width:150px;} .project_kaercher .c2c-slideshow-container .thumbs .inner > div {width:65px;} .project_urologie .c2c-slideshow-container .thumbs .inner > div {width:65px;} .project_urologie .c2c-slideshow-container .thumbs .inner > div {width:65px;} .project_adabweb .c2c-slideshow-container {max-width:1300px;} .project_cdk .c2c-slideshow-container .thumbs .inner >div {width:70px;} @media only screen and (max-width: 860px) { #page {max-width: 570px;} .box {width: 570px;} .main-content-wrap {width: 570px;} } */ @media only screen and (max-width: 900px) { #page {max-width: 568px;} .box {width: 568px; xxxborder:0; xxxbackground-color:none;} .main-content-wrap {width: 568px;} } /* smartphone portrait */ @media only screen and (max-width: 660px) { /* 620 tablet*/ body, .editmode #bar_content .bgholder {background: #f06000 url(../images/m2.jpg) -400px -237px no-repeat;} #page {max-width: 426px;} .box {width: 426px; border:0; background-color:none;} .main-content-wrap {width: 426px;} .box.top {display: block; z-index:10; position: fixed; background:#f06000; width:426px;} .xsmartphone {display: none;} .cargo_fg_form textarea.cargofield {width:159px;} .logo .company {display: none;} .startpage .logo .company {display: block; font-size: 22px; padding-top:8px; left:10px; top:-38px;z-index:1} .company_small {position: relative; font-size: 14px; color: white; top:20px; left:-4px} .company_small .tic {left:2px; height:3px; width:1px; top:3px;} .startpage .company_small {display: none} .startpage .logo_small {display: none} .logo_small {display: block; float:right; top:-15px; right:5px; position: relative;} .nav2 {height:56px;} .startpage .nav2 {height:146px; } .startpage .box.top {background:none; } .nav2 {background: rgba(0,0,0,0); padding:0; border-top:0;} .logo .company .tic {left:3px; height:4px; width:1px; top:4px;} .logo img {display: none;} .startpage .logo img {display: block; width: 133px; left:308px; top:-28px; position:relative;} .sidenav {display: none} .nav1 {margin-top:45px; background: rgba(255,102,0,0.9); height:100%; width:60%; min-width:250px;position:absolute; top:0; left:-600px; padding:0;} .nav1 ul.menu {margin-top:0px;} .nav1 ul.menu li {float: none; display:block; width:100%; opacity: 100%;} .nav1.out {left:0px;} .nav1 .menu li ul {width:100%;} .nav1 .menu ul, .nav1 .menu>li:hover {background: rgba(255, 119, 9, 1);} .sidenav {font-size:11px; bottom: 10px; top:auto;} .sidenav a.login {display: none;} .servicenav {display:none} .company {xxxposition: absolute;} .article {width: 283px;} .article h2.head {font-size: 18px;} .article > div.text {font-size: 12px; width:auto; } .article > div.textright {display: none;} .article > div.leadin {margin-bottom:10px; font-size: 12px} .image {width:141px; height:141px;} .teaser_element {width:141px; height:141px; } .teaser_element .caption .text {display: none;} .teaser_element .caption .head {font-size: 9px;} .teaser_element .caption {left: 4px; top:2px;} .in_editmode {display: none;} #nav_originator {display:inline-block;} .nav1.out {width:100%} .nav1 .menu > li > ul {border-top: 0;} .nav1 ul.menu {border-top:1px dotted white;} .nav1 ul.menu > li {height:auto; background: #ff7709 url(../images/c2c-arrow-mobile.png) right center no-repeat; border-bottom:1px dotted white; } .nav1 ul.menu > li a {width:100%; border:none; background: none; padding-top:12px;} .nav1 ul.menu>li:hover {background-color: #ff6600; } .nav1 ul.menu>li:hover> a {border: 0; padding-left:5px; background: url(../images/c2c-arrow-mobile.png) right center no-repeat;} .nav1 ul.menu .openshower {display: none;position: absolute; z-index:30; top:00px; width:30px; height:50px; right:0; background: url(../images/c2c-close-mobile.png) center 16px no-repeat;} .nav1 ul.menu > li > ul {border:0;} .nav1.out .menu li:hover ul ul, .nav1.out .menu li:hover ul ul ul, .nav1.out .menu li ul, .nav1.out .menu li.hover ul ul, .nav1.out .menu li.hover ul ul ul {display:none} .nav1.out .menu li:hover ul, .nav1.out .menu li li:hover ul, .nav1.out .menu li li li:hover ul, .nav1.out .menu li.hover ul, .nav1.out .menu li li.hover ul, .nav1.out .menu li li li.hover ul {display:none} .nav1.out>ul>li i {position:relative;width:auto;float:right;} i.close_layer {cursor:pointer} .nav1.out ul.menu a {cursor:pointer} .nav1.out ul.menu li.act_nav_element .openshower {display: block;} .nav1.out ul.menu li.act_nav_element {background-image:none; background-color: #ff7709;} .nav1.out ul.menu li.act_nav_element:hover {background-color: #ff7709;} .nav1.out ul.menu li.act_nav_element ul {background-image:none; border-bottom: 1px dotted white; box-shadow: none} .nav1.out ul.menu li.act_nav_element a {background-image:none; cursor:default} .nav1.out .menu li.act_nav_element ul {display:block;opacity:1} .act_nav_element ul {display:block;opacity:1} .nav1.out ul.menu li.act_nav_element ul li a {cursor:pointer} .box.footer {border:0;} /* Slideshow mobile */ .c2c-slideshow-overlay {background: rgba(0,0,0,0.8);} .c2c-slideshow-row.top, .c2c-slideshow-row.bottom {display: none; } .c2c-slideshow-arrow2, .c2c-slideshow-arrow1 {width:30px; min-width: 30px; xxxbackground-color: #eee} .c2c-slideshow-caption, .thumbs.left, .thumbs.bottom, .thumbs.right {display: none !important;} .c2c-slideshow-close {right:-0px; top: -26px; background: url(../../../images/c2c-icon-slideshow-closesmall.png) 0 0 no-repeat; z-index:10} .c2c-slideshow-container {width:100% !important; left:0; top:0;} .c2c-slideshow-overimg-pl, .c2c-slideshow-img-pl {width: 100% !important} .c2c-slideshow-overimg {display: none;} .c2c-slideshow-arrow1 {width:0; min-width:0} .c2c-slideshow-arrow2 {width:0; min-width:0;} .c2c-slideshow-arrow1-inner {xxxopacity:0.5; position: absolute; height:64px; width:30px; min-width:0; left:0px; z-index: 10; margin-top:-32px; background: url(../../../images/c2c-slideshow-arrowinside1.png) 0 0 no-repeat;} .c2c-slideshow-arrow2-inner {xxxopacity:0.5; position: absolute; height:64px; width:30px; min-width:0; right:0px; z-index: 10; margin-top:-32px; background: url(../../../images/c2c-slideshow-arrowinside2.png) 0 0 no-repeat;} .c2c-slideshow-img, .c2c-slideshow-overimg, .c2c-slideshow-container {border:0;} } @media only screen and (max-width: 450px) { /* 400 smartphone */ #page {max-width: 284px;} .box {width: 284px; background-color:none;} .main-content-wrap {width: 284px;} .box.bb.top {width: 284px} .article {height:auto !important;} .xsmartphone {display: none} .startpage .logo img {left:168px;} .cargo_fg_form textarea.cargofield {width:159px;} } .startpage .logo_small {display: none} .logo_small {display: block; float:right; top:-15px; right:5px; position: relative;} .box.bb.nav1.out {background: #ff6600; xxxposition: fixed;} /* .box.bb.nav1.out ul {top:0; margin-top:6px;} .box.bb.nav1.out li {text-align:center} .box.bb.nav1.out li a {width:238px;} .box.bb.nav1 ul li ul li {text-align:center} */ .img_overlay {position: absolute; opacity:0; top:100px; left:100px; min-height:55px; padding:8px; width:212px; background: url(../images/img_overlay1.png) 0 0 no-repeat; pointer-events:none;} .img_overlay .bottom {position: absolute; left:0; bottom:-25px;; width:212px; height:25px; background:url(../images/img_overlay2.png) 0 0 no-repeat; } .img_overlay .head {color: black; margin:0; padding:0; font-size:12px; width:150px;} .img_overlay .text {color: #aaa; margin:0; padding:0; font-size:12px; width:150px;} .img_overlay .text a {color: #aaa; text-decoration: underline}