/* REF:Please Dont Change this styles*/ #REF_ColorFirst{color:#00baff; display:none} #REF_ColorSecond{color:#000; display:none} /*REF*/ /******** CSS Start ********/ /*Body Loading*/ #bodyLoading{width:100%; position:absolute; left:0; top:0; text-align:center} #loading{margin:200px auto 0px auto; text-align:center} /* General */ *{-webkit-user-drag:none; margin:0px; padding:0px; border:none; outline:none; font-size:12px; line-height:1.4em; color:#ccc; font-family:'PT Sans',sans-serif} * html .clearfix{height:1%; /* IE5-6 */} *+html .clearfix{display:inline-block; /* IE7not8 */} .clearfix:after{/* FF,IE8,O,S,etc. */content:"."; display:block; height:0; clear:both; visibility:hidden} ::selection{ background:#00baff; /* Safari */color:#000} ::-moz-selection{ background:#00baff; /* Firefox */color:#000} body{background:#000; overflow:hidden} html{overflow:hidden; background:#000} #fullControl{opacity:0; position:absolute; right:10px; top:100px} #body-wrapper{width:100%; height:600px;background-color:#000; text-align:center; overflow:hidden; position:relative; opacity:0} #content{opacity:0; display:none; position:absolute; overflow:hidden; width:600px; left:0px; top:70px; padding:20px;} #contentBox{position:relative; overflow:hidden; text-align:left; width:600px} #contentBoxScroll{top:70px; position:absolute; display:none; text-align:left; width:27px;} #contentBoxContainer{position:relative} .dragcontainer{position:relative; height:500px} .dragger{position:absolute; left:8px; width:10px; height:150px; background-color:#00baff; cursor:pointer} .scroll_up, .scroll_down{} .scroll_down{} #closeButton:link, #closeButton:visited{display:block; width:27px; height:27px; background-image:url('../images/dark-close_btn_bg.png')} #closeButton:hover, #closeButton:active{background-position:0 -27px} #bgImages{list-style:none; position:absolute; left:0px; bottom:-50px; height:92px;} #bgImages li{position:relative; margin:0; float:left; padding:3px} #bgImages img.thumb{height:80px; margin:0; padding:3px 0 0 0; cursor:pointer; opacity:.30; border-top:3px solid #666} #bgImages li .thumbType{opacity:0; position:absolute; width:20px; height:20px; right:3px; bottom:7px; background-color:#00baff} #bgImages li .thumbVideo{opacity:0; background-image:url('../images/thumb_video.png')} #bgImages li .thumbImage{opacity:0; background-image:url('../images/thumb_image.png')} #bgImages img.source, #bgImages iframe{display:none} #bgImages h3, #bgImages p{ display:none; font-weight:bold; background-color:#000;} #bgImages li.active img.thumb{border-top:3px solid #00baff} #bgImage{position:absolute; left:0; top:0} #bgText{display:inline-block; text-align:left; position:absolute; left:7px; bottom:14px; padding:10px; width:100%} #bgText .headerText{display:inline; font-size:40px; line-height:94px; color:#fff; padding:0px 10px; font-weight:100; font-family:'Raleway',sans-serif; text-transform:lowercase } #bgText .headerText{ top:1200px; font-size:40px; background-color:#000; filter:alpha(opacity=70); /* CSS3 standard */ opacity:0.7; } @media screen and (max-width: 2000px) { #bgText .headerText{font-size:40px !important; line-height:120px !important;} #bgText .subText {font-size:20px !important;}} @media screen and (max-width: 1300px) { #bgText .headerText{font-size:40px !important; line-height:94px !important;} #bgText .subText {font-size:16px !important;}} @media screen and (max-width: 1024px) { #bgText .headerText{font-size:40px !important; line-height:74px !important;} #bgText .subText {font-size:14px !important;}} @media screen and (max-width: 800px) { #bgText .headerText{font-size:40px !important; line-height:64px !important;} #bgText .subText {font-size:12px !important;}} @media screen and (max-width: 600px) { #bgText .headerText{font-size:40px !important; line-height:64px !important;} #bgText .subText {font-size:8px !important;}} #bgText .subText{margin-top:10px; display:inline; font-size:16px; padding:0 10px; text-transform:uppercase; color:#00baff; font-family:'PT Sans',sans-serif; font-weight:500; } #bgImageWrapper{position:relative} #bgImageWrapper img{position:absolute} #ytVideo, #vmVideo, #jwVideo{position:absolute} #bgPattern{position:absolute; background:url('../images/pattern.png')} .bgCanvas{position:absolute; left:0; top:0} /*Image Animate*/ .hoverWrapperBg{opacity:.50; background-color:rgba(0,0,0,.4);background-image:url('../images/pattern.png'); position:absolute; width:100%; left:0px; top:0px} .image_frame{position:relative; cursor:pointer} .image_frame >a{display:block; padding:0; margin:0; font-size:0px} .hoverWrapper{position:absolute; width:100%; left:0; top:0} .hoverWrapper .link:link, .hoverWrapper .link:visited, .hoverWrapper .modal:link, .hoverWrapper .modal:visited, .hoverWrapper .modalVideo:link, .hoverWrapper .modalVideo:visited{-moz-transition:all 0.3s ease-in-out 0s; transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; background-color:#00baff; display:block; width:33px; height:33px; position:absolute; bottom:5px} .hoverWrapper .link:link, .hoverWrapper .link:visited{ right:15px; background-image:url('../images/imageLink.png') } .hoverWrapper .modal:link, .hoverWrapper .modal:visited{right:49px; background-image:url('../images/imageModal.png')} .hoverWrapper .modalVideo:link, .hoverWrapper .modalVideo:visited{right:49px; background-image:url('../images/imageVideo.png')} .hoverWrapper .link:hover, .hoverWrapper .link:active, .hoverWrapper .modal:hover, .hoverWrapper .modal:active, .hoverWrapper .modalVideo:hover, .hoverWrapper .modalVideo:active{background-position:0 -33px; box-shadow:-2px -2px rgba(0,0,0,.5) inset,2px 2px rgba(0,0,0,.5) inset} .blogdatemeta{height:33px; padding:10px 0; border-top:1px solid #999; border-bottom:1px solid #999} .blogdate{float:left; display:inline-block; line-height:33px; font-size:18px; color:#000; font-family:'Open Sans',sans-serif} .hoverWrapper h3{opacity:0; text-align:left; padding:15px; margin:10px; font-size:18x; line-height:20px; color:#000; background-color:#00baff; font-family:'Open Sans',sans-serif} .hoverWrapper .enter-text{opacity:0; text-align:left; padding:0px 15px 10px 15px; font-size:11px; color:#fff;} /*Play List*/ #playList{display:none; position:absolute; left:0; top:0; background:url('../images/dark-content-bg.png'); color:#555} #playWrapper{padding:10px; position:relative; width:600px; background-image:none; color:#aaa; text-align:justify; line-height:16px} #playWrapper span {font:18px 'Raleway', sans-serif;line-height:0; color:#fff} #playWrapper strong {font:16px Arial, Helvetica, sans-serif; font-weight:normal;line-height:0; color:#999} #playWrapper em {font:14px Georgia, "Times New Roman", Times, serif; letter-spacing:1px; font-style:italic;line-height:0; color:#ddd} #playListCloseIcon{padding:5px; position:absolute; font-size:14px; font-family:'Open Sans',sans-serif; background-color:#00baff; color:#000} /*Menu*/ #logo img{margin:0; padding:0; line-height:1em} #logo{text-align:left; float:left; display:inline-block} #menu-container{position:absolute; left:0px; top:0px; width:100%; float:left;} a{-moz-transition:all 0.3s ease-in-out 0s; transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out} a:link, a:visited{text-decoration:none;} a:hover, a:active{text-decoration:none} #mainmenu2{ display:inline; margin:60px 0 0 30px} #mainmenu2 ul{list-style:none; display:inline;} #mainmenu2 ul li{ display:inline; position:relative;text-align:left;} #mainmenu12 ul li a:visited{ display:inline; text-decoration:none; text-align:left; } #mainmenu2 ul li a:hover, #mainmenu2 ul li a:active{ text-decoration:none; } #mainmenu2 ul li.active >a:link, #mainmenu2 ul >li.active >a:visited{ text-decoration:none; } #mainmenu1{ display:inline; margin:60px 0 0 30px} #mainmenu1 ul{list-style:none; display:inline;} #mainmenu1 ul >li{ display:inline; position:relative;text-align:left;} #mainmenu1 ul li a:link, #mainmenu1 ul li a:visited{ display:inline; text-decoration:none; text-align:left; } #mainmenu1 ul li a:hover, #mainmenu1 ul li a:active{ text-decoration:none; } #mainmenu1 ul >li.active >a:link, #mainmenu1 ul >li.active >a:visited{ text-decoration:none; } #mainmenu1 ul li a span.title{ border-right:1px #FFF solid; width:180px; display:inline; margin:0; padding:10px 10px 10px 8px; position:relative; color:#fff; font-size:13px; font-weight:900; letter-spacing:0px} #mainmenu1 ul >li >a{ text-decoration:none; /*background-image:url('images/light-menu-bg.png')*/} #mainmenu1 ul li ul li a:link, #mainmenu1 ul li ul li a:visited{ text-decoration:none; } #mainmenu1 ul li ul li a:hover, #mainmenu1 ul li ul li a:active{} #mainmenu1 ul li ul li a span.title{ text-decoration:none; color:#fff} #mainmenu1 ul li a:hover span.title, #mainmenu1 ul li a:active span.title, #mainmenu1 ul >li.active >a:link span.title, #mainmenu1 ul >li.active >a:visited span.title{ text-decoration:none; -moz-transition:all 0.3s ease-in-out 0s; transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; color:#fff; background-color:#232323; } #mainmenu1 ul li ul li a:hover span.title, #mainmenu1 ul li ul li a:active span.title{ text-decoration:none; color:#fff; background-color:#FC0; } #mainmenu1 ul .description{display:none} #mainmenu1 ul ul{top:0; margin-left:-6px} #mainmenu1 ul ul li{float:left;} /* Footer */ #footer{position:absolute; left:0; bottom:0; width:100%; background-color:#000; height:32px; padding-top:1px} #footertext{float:left; padding:0 10px; height:30px; line-height:30px; color:#555} #footertext a{color:#888; text-decoration:none}#footertext a:hover{color:#00baff;} #footeraudio{float:right} #footeraudio a{float:left; margin-left:1px} #footeraudio .soundmute{display:none} #bgControl{display:inline-block; position:absolute; right:20px; top:100px; padding:5px; height:30px} #bgControlCount{display:inline-block; padding:0 15px 0 10px; font-size:16px; line-height:30px; vertical-align:top; font-family:'Open Sans',sans-serif; color:#fff} #bgControlButtons{display:inline-block} #bgControlButtons a{margin-right:1px} #bgControl .play, #bgControl .full, #bgControl .close, #bgControl .info{display:none} #bgControl .next:link, #bgControl .next:visited{background-image:url('../images/bgControlRight.png')} #bgControl .prev:link, #bgControl .prev:visited{background-image:url('../images/bgControlLeft.png')} #bgControl .pause:link, #bgControl .pause:visited{background-image:url('../images/bgControlPause.png')} #bgControl .play:link, #bgControl .play:visited{background-image:url('../images/bgControlPlay.png')} #bgControl .full:link, #bgControl .full:visited{background-image:url('../images/bgControlFull.png')} #bgControl .fitte:link, #bgControl .fitte:visited{background-image:url('../images/bgControlFit.png')} #bgControl .soundicon:link, #bgControl .soundicon:visited{display:none; background-image:url('images/icon_sound.png')} #bgControl .soundmute:link, #bgControl .soundmute:visited{display:none; background-image:url('images/icon_mute.png')} #bgControl .close:link, #bgControl .close:visited{background-image:url('../images/bgControlClose.png')} #bgControl .info:link, #bgControl .info:visited{background-image:url('../images/bgControlInfo.png')} #footeraudio .soundicon:link, #footeraudio .soundicon:visited{background-image:url('../images/icon_sound.png')} #footeraudio .soundmute:link, #footeraudio .soundmute:visited{background-image:url('../images/icon_mute.png')} #footeraudio .soundplaylist:link, #footeraudio .soundplaylist:visited{background-image:url('../images/icon_playlist.png')} #share{float:right; } #share ul{list-style:none} #share li{float:left; margin-right:6px} a.btnCtrl:link, a.btnCtrl:visited{-moz-transition:all 0.3s ease-in-out 0s; transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; float:left; display:inline; width:30px; height:30px; background-color:#000} a.btnCtrl:hover, a.btnCtrl:active{ background-position:0 -30px} #share .tw{background-image:url('../images/icon_tw.png'); padding-left:0px;} #share .fb{background-image:url('../images/icon_fb.png')} #share .gp{background-image:url('../images/icon_gp.png')} #share .rss{background-image:url('../images/icon_rss.png')} #circleC{display:none; position:absolute; left:200px; top:100px} /*STYLES*/ h1, h2, h3, h4, h5, h6{clear:both; font-family:'Lato',sans-serif; font-weight:400; color:#FC0; text-transform:uppercase;} h1{font-size:24px;} h2{font-size:20px} h3{font-size:18px} h4{font-size:18px} h5{font-size:18px} h6{font-size:12px} .divider{clear:both; height:20px} .vericaldivider{display:inline-block; width:20px} hr.seperator{clear:both; float:left; margin-top:20px; height:1px; background-color:#444; width:100%} hr.seperatorBold{clear:both; float:left; margin-top:20px; height:3px; background-color:#00baff; width:100%} .quotes-one{margin-left:20px; border-left:1px solid #00baff; padding-left:20px} .quotes-two{padding-left:35px; background:url('images/quote-bg.png') 0px 5px no-repeat} .dropcap{text-align:center; display:block; float:left; font-weight:500; font-size:28px; line-height:40px; width:40px; font-family:'Open Sans',sans-serif; background-color:#FC0; color:#000; padding:0; margin:7px 5px 0 0} .quotes-writer{color:#fff} .right{float:right; margin:5px 0 5px 15px} .left{float:left; margin:5px 15px 5px 0px} span.highlight{background-color:#00baff; color:#000; padding:0px 2px} span.textlight{color:#00baff} ul.list{list-style:none} ul.list li{padding:3px 0 3px 20px} ul.check li{background:url('images/list-check.png') left 6px no-repeat} ul.cross li{background:url('images/list-cross.png') left 7px no-repeat} ul.arrow li{background:url('images/list-arrow.png') left 8px no-repeat} ul.circle li{background:url('images/list-circle.png') left 7px no-repeat} .infobox, .attentionbox, .downloadbox, .crossbox{padding:20px 20px 20px 75px; border:2px solid #333} .infobox{border-color:#06c; color:#06c; background:url('images/box-info.png') 20px 24px no-repeat} .attentionbox{border-color:#fc0; color:#fc0; background:url('images/box-attention.png') 20px 24px no-repeat} .downloadbox{border-color:#090; color:#090; background:url('images/box-download.png') 20px 24px no-repeat} .crossbox{border-color:#f00; color:#f00; background:url('images/box-cross.png') 20px 24px no-repeat} .tipbox{position:absolute; color:#000; padding:10px 10px; background-color:#fc0; border-radius:6px} .tipbox span{width:9px; height:5px; background:url('images/tips-bottom.png') center center no-repeat; position:absolute; bottom:-5px; left:50%} div.item_two_one{clear:both; float:left; width:80px; padding:12px 5px 12px 0; vertical-align:top; font-family:'Open Sans',sans-serif; font-size:16px} div.item_two_two{float:left; width:170px; margin-left:10px; padding:15px 5px; border-bottom:1px solid #333; vertical-align:top} #dim {width:100%; height:100%; position:fixed; background:url('../images/dark-content-bg.png'); display:none} .fb_like {width:145px; height:26px; position:fixed; bottom:5px; right:130px; overflow:hidden;} .new-back{ width:100%; margin-top:0px; margin-left:0px; margin-right:0px; height:100px; float:left; background-image:url(../images/menu-bg1.png); background-repeat:repeat-x; } .about-bg{ background-image:url(../images/about-bg.png); background-repeat:no-repeat; width:1280px; height:1000px; margin:0px auto; } .about-innerbg{ background-image:url(../images/about-inner-bg.png); background-repeat:repeat-x; width:1000px; height:891px; margin:0px auto; }