/* |--------------------------------------------------------------- | GLOBAL STYLE |--------------------------------------------------------------- | | RESET all html element. | */ /* This should always stay the same. Level of importance: 1. */ * { margin: 0; padding: 0; } /* This should always stay the same. Level of importance: 2. */ h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,th { font-size: 1em; font-weight: normal; font-style: normal; } h2{ font-weight:bold; } ul,ol,li { list-style: none; margin:0px; padding:0px; } fieldset,img { border: none; padding:0px; margin:0px; } div { clear:both; border:0px solid #0066FF; overflow:hidden; } a { color:#ffffff; text-decoration:none; } /* This should always stay the same. Level of importance: 3. Change only when it is very needed, for instance, the font used in tag. */ p{ border: 0px solid #999999; padding:0px 0px 0px 0px; } html,body { overflow:hidden; font-family:Arial, Helvetica, sans-serif; font-weight:normal; font-size:12px; color:#ffffff; background:#000; } input { border:1px solid #808080; background:#eeeeee; } /* |--------------------------------------------------------------- | LOCAL STYLE |--------------------------------------------------------------- | | Change the style of the site from here according to the design. | */ /*background Styles*/ #supersize { float:none; } #supersize li { float:none; } #supersize img{ height:100%; width:100%; } /*global style*/ #container { text-align:left; position:absolute; width:916px; height:570px; top:50%; left:50%; margin-left:-458px; margin-top:-286px; z-index:10; } .offscreen { display:none; } /**************************************/ /************ Shared Style ************/ /**************************************/ .align-center { width:1016px; margin:0em auto; overflow:hidden; } .left { float:left; } .right{ float:right; } .hint { color: #808080; } /**************************************/ /************** Main Style ************/ /**************************************/ /* main style */ .exit{ float:right; background:#000000; padding:3px 10px 1px 10px; border-top-right-radius:8px; -moz-border-radius-topright:8px; -webkit-border-top-right-radius:8px; border-top-left-radius:8px; -moz-border-radius-topleft:8px; -webkit-border-top-left-radius:8px; } .main { /*width:100%;*/ height:465px; padding:35px 0px 35px 35px; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; border-top-right-radius:0px; -moz-border-radius-topright:0px; -webkit-border-top-right-radius:0px; /*background: rgba(0, 0, 0, 0.5);*/ background:url(../images/local/transparent_content_black.png) repeat; } .main div { float:left; clear:none; } /* menu style */ .menu { margin:0px 30px 0px 0px; } .menu h2 { width: 150px; font-size:11px; background:#999999; margin:0px 0px 1px 0px; padding:2px 5px 2px 5px; cursor:pointer; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; } .menu h2 a{ background: url(../images/local/bullet_arrow_white_down.png) no-repeat left 3px; } .menu h2 span{ padding:0px 0px 0px 12px; } .menu .active a{ background: url(../images/local/bullet_arrow_white_right.png) no-repeat left 3px; } .menu ul{ margin:5px 0px 0px 5px; } .menu ul a:hover{ color:#dd0806; } .menu .first{ margin:0px 0px 0px 0px; } .menu .last{ margin:0px 0px 10px 0px; } .menu .current-menu{ /*font-weight:bold;*/ } .menu-netwrok { bottom:40px; position:absolute; } .menu-netwrok li{ float:left; margin: 0px 4px 0px 0px !important; } /* option style */ .panel-3 { border:0px solid #ffffff; margin:0px 0px 0px 0px; width:338px; } .option-scroll { overflow:auto; height:465px; width:338px; } .option-scroll ul { /* overflow:auto; height:465px; width:338px; */ } .submenu-1 li { float:left; } .submenu-1 > li > a { float:left; margin:0px 5px 5px 0px; border:1px solid #333333; height:100px; width:100px; overflow:hidden; } .submenu-1 > li > a:hover { border:1px solid #dd0806; } .submenu-1 .current-option a{ border:1px solid #dd0806; } .submenu-1 .current-option .highlight { background:#dd0806; width:100px; height:100px; margin:1px 0px 0px -106px; border:none; cursor:default; filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; } .submenu-2 > li { list-style-image:url(../images/local/bullet_round_white.png); /*list-style:disc;*/ margin:0px 0px 0px 15px; padding:0px; } .submenu-2 > li > a { margin:0px 0px 0px -4px; } .submenu-2 .current-option { list-style-image:url(../images/local/bullet_arrow_red_right.png); } /* content style */ .panel-4 { border:0px solid #ffffff; width:325px; margin:0px 0px 0px 8px; /*height:465px; overflow:auto; float:right; margin:0px 0px 0px 8px; */ } .panel-4 p img{ border:1px solid #999999; max-width:300px; } .panel-4 p{ padding:0px 0px 20px 0px; } .panel-4 a{ color:#dd0806; } .panel-4 a:hover{ color:#FF9900; } .content-scroll { overflow:auto; height:465px; width:325px; float:right; } .list li { float:left; margin:0px 3px 3px 0px; /*border:1px solid #FF0000;*/ } .list img{ /*max-width:98px; margin:0px 0px -3px 0px; */ border:1px solid #999999; padding:0px; } /* home style */ #content-home { text-align:center; width:190px; height:190px; top:50%; left:50%; margin-left:-100px; margin-top:-90px; position:absolute; } #content-home li { float:left; margin:0px 5px 5px 0px; } #content-home img { float:left; margin:0px; padding:0px; } #menu-home { display:none; } /* tooltip */ #tooltip{ position:absolute; border:1px solid #333; background:#f7f5d1; padding:2px 5px; color:#333; display:none; z-index:10; font-family:Verdana, Arial, Helvetica, sans-serif; font-weight:normal; font-size:11px; } /* tab */ #tab-background { position:absolute; top:0px; right:50px; width:765px; /*for IE*/ z-index:100; } #tab-contact-me { position:absolute; bottom:0px; left:50px; z-index:100; } #tab-background h2 { float:right; width: 78px; font-size:11px; background:#000; margin:0px 0px 1px 0px; padding:1px 10px 3px 10px; cursor:pointer; /* -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; */ border-bottom-right-radius:8px; -moz-border-radius-bottomright:8px; -webkit-border-bottom-right-radius:8px; border-bottom-left-radius:8px; -moz-border-radius-bottomleft:8px; -webkit-border-bottom-left-radius:8px; } #tab-background h2 .btn-slide{ background: url(../images/local/bullet_arrow_white_right.png) no-repeat left 3px; width: 78px; text-align:right; display: block; } #tab-contact-me h2 { float:left; width: 75px; font-size:11px; background:#000; margin:0px 0px 0px 0px; padding:3px 10px 1px 10px; border-top-right-radius:8px; -moz-border-radius-topright:8px; -webkit-border-top-right-radius:8px; border-top-left-radius:8px; -moz-border-radius-topleft:8px; -webkit-border-top-left-radius:8px; } #tab-contact-me h2 .btn-slide{ background: url(../images/local/bullet_arrow_white_right.png) no-repeat left 3px; width: 75px; text-align:right; display: block; } #tab-background h2 .active { /*background-position: left 10px;*/ background: url(../images/local/bullet_arrow_white_up.png) no-repeat left 3px; } #tab-contact-me h2 .active { /*background-position: left 10px;*/ background: url(../images/local/bullet_arrow_white_down.png) no-repeat left 3px; } #panel-1 { background: url(../images/local/transparent_contact.png) repeat; width:765px; height:57px; /*for IE */ display:none; border-bottom-left-radius:4px; -moz-border-radius-bottomleft:4px; -webkit-border-bottom-left-radius:4px; overflow:hidden; } #panel-1 ul { margin:5px 0px 0px 0px; } #panel-1 li { float:left; margin:0px 0px 5px 5px; border:1px solid #ffffff; max-height:45px; overflow:hidden; } #panel-1 img:hover { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; } #panel-2 { background: url(../images/local/transparent_contact.png) repeat; height:300px; width:400px; display:none; padding:20px 0px 0px 20px; border-top-right-radius:4px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px; } .panel-4 img{ max-width:300px; } /*form style*/ .form div { text-align:left; overflow:hidden; /*overflow:visible;*/ } .form p { margin:0px; padding:0px; } .field { border: 1px solid #999999; background-color:#eeeeee; width:99.5%; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; padding:2px 2px 2px 2px; } .field50px_height { height:50px; } .field100px_height { height:100px; } .field150px_height { height:150px; } .field200px_height { height:200px; } .textfield600px_height{ height:600px; } .field100px_width { width:100px; } .field157px_width { width:157px; } .field200px_width { width:200px; } .field300px_width { width:300px; } .field400px_width { width:400px; } .field415px_width { width:415px; } .fieldselect202px_width{ width:202px; } .button { width: 60px; height: 26px; border: 1px solid #999999; background-color: #ffffff; cursor: pointer; margin: 2px 0px 0px 0px; padding:0px 0px 2px 0px; color: #4763c9; } .button_public { width: 60px; height: 26px; border: 1px solid #999999; background-color: #ffffff; cursor: pointer; margin: 2px 0px 0px 0px; padding:0px 0px 2px 0px; color: #4763c9; } .button_comment { width: 80px; } .form div { clear:both; } .form_item div { clear:none; border:0px solid #cc0066; } .form_item { margin:0px 0px 10px 0px; } .form_item .form_left { float:left; } .form_item .form_right { float:left; } .form_head { font-family:"Times New Roman", Times, serif; font-size:24px; } .form_note{ color:#333333; margin-bottom:10px; } .form_note p { padding:0px; margin:0px; } .form_note a { color:#4763c9;/**/ text-decoration:underline; } .form_note a:hover { text-decoration:underline; } .message p { padding:0px; margin:0px; }