/* CSS Document */ body{ margin:0px; padding:0px; font-family:"Lucida Grande", "Trebuchet MS", Arial, Helvetica, sans-serif; background-color:#f7f7f7; font-weight:bold;} h1,h2,h3,h4,h5,h6,p,form,input,ul,address{ margin:0px; padding:0px; font-weight:normal;} html a{ outline:none;} #container{ width:992px; margin:0 auto; overflow:hidden;} #header{ margin:10px 6px 0px 0px; float:left; overflow:hidden;} #header h1{float:left; width:336px;margin:0px 0px 0px 10px; height:85px; background:url(../images/logo.jpg) no-repeat;} #header h1 a{float:left; width:336px; display:block; text-indent:-999999px;height:85px;} #header #top-nav{ width:auto; float:right; margin:30px 5px 0px 0px;} #header #top-nav ul{ margin:0px; padding:0px; list-style:none;} #header #top-nav ul li{ float:left; height:25px; line-height:23px; color:#797979; font-size:12px; font-weight:bold; margin:0px 0px 0px 0px;} #header #top-nav ul li a{color:#797979; font-size:12px; height:25px; line-height:23px; font-weight:bold; display:block; text-decoration:none; padding:0px 0px 0px 5px;} #header #top-nav ul li a:hover{ background:url(../images/left-nav.jpg) no-repeat; color:#ffffff;} #header #top-nav ul li a span{ overflow:hidden; display:block; padding-right:9px;} #header #top-nav ul li a:hover span{ background:url(../images/right-nav.jpg) right top no-repeat;} #header #top-nav ul li#active{background:url(../images/left-nav.jpg) no-repeat; color:#FFFFFF;} #header #top-nav ul li#active a{background:url(../images/left-nav.jpg) no-repeat; color:#FFFFFF !important;} #header #top-nav ul li#active span{background:url(../images/right-nav.jpg) right top no-repeat;} #inner-nav{ width:510px; margin:33px 3px 6px 0px; padding:0px; list-style:none; float:right; } #inner-nav li{float:left; height:25px; line-height:25px; color:#797979; font-size:12px; font-weight:bold;} #inner-nav li a{color:#797979; font-size:12px; height:25px; line-height:23px; font-weight:bold; display:block; text-decoration:none; padding:0px 0px 0px 10px;} #inner-nav li a:hover{background:url(../images/left-nav.jpg) left -23px no-repeat; color:#ffffff;} #inner-nav li a span{overflow:hidden; display:block; padding-right:10px;} #inner-nav li a:hover span{background:url(../images/right-nav.jpg) right -23px no-repeat;} #inner-nav li.buy-now{background:url(../images/buy-now.jpg) left top no-repeat; float:right; width:80px; height:24px; line-height:22px; color:#ffffff; text-align:center; margin-left:15px;} #inner-nav li.buy-now a{color:#ffffff!important; padding-right:5px;} #inner-nav li.buy-now a:hover{background:url(../images/buy-now.jpg) left -24px no-repeat;} #inner-nav li.active{background:url(../images/left-nav.jpg) left -23px no-repeat;} #inner-nav li.active a{ color:#FFF;} #inner-nav li.active span{background:url(../images/right-nav.jpg) right -23px no-repeat;} /****************/ #banner-index{background:url(../images/banner.jpg) no-repeat; width:992px; height:595px; overflow:hidden; clear:both; } #banner-index h1{ font-size:19px; color:#ffffff; width:868px; height:48px; text-align:center; margin:32px 0px 0px 60px;} #banner-index .product-icon{ margin:407px 0px 0px 0px; position:relative; overflow:hidden;} .left-arrow{background:url(../images/arrow.png) left top no-repeat; height:20px; width:18px; text-indent:-999999px; position:absolute; left:25px; top:13px;} .left-arrow a{height:20px; width:18px; text-indent:-999999px; display:block;} .left-arrow a:hover{background:url(../images/arrow.png) left -24px no-repeat;} .right-arrow{background:url(../images/arrow.png) -19px top no-repeat; height:20px; width:18px; text-indent:-999999px; position:absolute; right:25px; top:13px;} .right-arrow a{height:20px; width:18px; text-indent:-999999px; display:block;} .right-arrow a:hover{background:url(../images/arrow.png) -19px -24px no-repeat;} #banner-index .product-icon ul{ margin:0px 0px 0px 55px; padding:0px; list-style:none;} #banner-index .product-icon ul li{ float:left; text-align:center; overflow:hidden;} #banner-index .product-icon ul li span{ font-size:13px; font-weight:bold;line-height:13px; color:#173c69;display:block; } #banner-index .product-icon ul li.clander,.interface{margin-left:67px; } #banner-index .product-icon ul li.Management{ margin-left:82px;} #banner-index .product-icon ul li.odbc{margin-left:81px;} #banner-index .product-icon ul li.outlook{margin-left:95px;} #banner-index .product-icon ul li.outlook img{ margin-top:-5px; margin-bottom:5px;} #banner-index .product-icon ul li.Management img{ margin-top:-5px; margin-bottom:5px;} /**************************/ #center-heading-text{height:32px;font-size:14px;position:relative; height:44px;width:986px; background:url(../images/heading.jpg) no-repeat; margin:0px 0px 0px 5px;} #center-heading-text h5{ color:#9d0024; font-size:14px; float:left; padding:16px 0px 0px 35px;} #center-heading-text h6{ color:#9d0024; font-size:14px; float:right; padding:16px 40px 0px 15px;} #center-heading-text span{color:#9d0024; font-size:12px; background:url(../images/arrow.png) 47px -43px no-repeat; font-weight:bold; padding:1px 15px 0px 0px; position:absolute; right:249px; top:18px; } #center-heading-text span a{color:#9d0024; font-size:12px; text-decoration:none; display:block;} #video-left-border-bottom{ width:758px;float:left; margin:0px 0px 0px 5px; overflow:hidden; background:url(../images/reapter.gif) left bottom repeat-y;} #video-left-border-reapt{width:758px; overflow:hidden; background:url(../images/bottom-center.gif) left bottom no-repeat;} #video-left-border{width:758px; overflow:hidden; background:url(../images/reapter-center.gif) left top no-repeat; } #video-part{ width:754px; overflow:hidden; background:url(../images/reapter-x.gif) top right no-repeat; margin:0px 0px 0px 3px; overflow:hidden; float:left; padding-bottom:15px;} #right-main{ width:227px; overflow:hidden; background:url(../images/reapter-right.gif) right top repeat-y; float:right; margin-right:2px;} #right-main-border{ background:url(../images/bottom-center.gif) right bottom no-repeat; height:380px; overflow:hidden; padding:0px 0px 10px 0px;} #customer-right{ overflow:hidden; background:url(../images/right-reapter-center.gif) left bottom repeat-x ; height:380px; margin:0px 5px 0px 0px; float:right; overflow:hidden; padding:5px 0px 0px 0px;} .view-more{color:#4a8ad4; font-size:12px; float:right; background:url(../images/arrow1.png) 56px 13px no-repeat; padding:8px 30px 4px 0px;} .view-more a{color:#4a8ad4; text-decoration:none; font-size:12px; float:right; display:block;} .view-more a:hover{ color:#9d0024;} #video-part ul{ margin:12px 0px 0px 15px; padding:0px; width:145px; float:left;} #video-part ul li span{ display:block; font-size:14px; color:#414141;} #video-part .video-play{ margin:20px 0px 0px 55px; float:left; width:auto;} .customer-text{padding:15px 0px 10px 0px; overflow:hidden; border-bottom:1px solid #c1c1c1; margin:0px 15px 0px 15px;} .customer-text span{display:block; font-size:11px;color:#9e0025; float:right; line-height:14px;} .customer-text p{ font-weight:bold;font-size:11px; color:#676767; line-height:14px; padding-bottom:15px;} /*******************************/ #rss-and-news{ clear: both; overflow:hidden; float:left; margin:19px 0px 0px 18px; width:75%;} .rss{ background:url(../images/rss.jpg) no-repeat; color:#f87d00; font-size:13px; float:left; padding:7px 11px 20px 42px;} .rss a{ color:#f87d00; font-size:13px; text-decoration:none;} .rss a:hover{color:#902529;} #rss-and-news p{ color:#8e8e8e; font-size:13px; width:auto; padding-top:5px;} #rss-and-news p span{ color:#7da9e6; padding-left:9px;} /*******************************/ .social-icons{ float:right; margin:19px 18px 0px 0; width:15%;} .social-icons p{ color:#8e8e8e; font-size:13px; margin-top:-4px;} .social-icons p span{float: right; margin-top: 6px; color:#7da9e6; padding-right:9px;} .social-icons p a{float:right;} /***********************/ #footer-bg{ background:url(../images/footer.jpg) no-repeat; height:97px; clear:both; width:995px; margin:0px 0px 20px 0px;} #footer-link{float:left; font-size:13px; color:#7f7f7f; padding:25px 0px 0px 0px; text-align:center; width:100%;} #footer-link a{ text-decoration:none; font-size:13px; color:#7f7f7f;} #footer-link a:hover{ text-decoration:underline; color:#9e0025;} #footer-copy{ font-size:10px; color:#7f7f7f; clear:both; position:relative; padding:28px 30px 0px 20px; float:left; width:995px;} #footer-copy span{ position:absolute; right:90px; top:30px;} /******************** inner page ***************************/ #inner-reapter{ width:988px; overflow:hidden; background:url(../images/inner-reapter.gif) left top repeat-y; clear:both;} #inner-reapter-center{ width:988px; overflow:hidden; background:url(../images/inner-reapter-center.gif) left top repeat-y; clear:both;} #inner-top{ width:988px; overflow:hidden; background: url(../images/inner-top.gif) left top no-repeat;} #inner-bottom{ width:988px; background:url(../images/inner-bottom.gif) 1px bottom no-repeat; overflow:hidden;} #inner-bottom-center{ width:988px; background:url(../images/inner-bottom-center.gif) 1px bottom no-repeat; overflow:hidden;} #inner-left-main{ width:249px; float:left; overflow:hidden;margin:0px 0px 0px 4px;} #inner-left{ width:240px; float:left; margin:20px 0px 20px 7px; overflow:hidden; } #inner-left ul{ margin:0px; padding:0px; list-style:none; font-weight:bold;} #inner-left ul li{padding:9px 0px 5px 48px; font-size:12px; color:#173c69; } #inner-left ul li a{font-size:12px; color:#173c69; text-decoration:none; display: block; margin-right: 10px;} #inner-left ul li a span{ display:block; padding: 3px 0px 7px 10px;} #inner-left ul li a:hover{ background:url(../images/inner-hover.gif) no-repeat; color:white;} #inner-left ul li a span:hover{ background:url(../images/inner-hover-right.gif) right top no-repeat;} #inner-left ul li#light{ color:white;} #inner-left ul li#light a{background:url(../images/inner-hover.gif) no-repeat;color:white;} #inner-left ul li#light span{background:url(../images/inner-hover-right.gif) right top no-repeat;} #inner-left-center{ color:#173c69; float:left; margin:20px 0px 20px 7px; overflow:hidden; } #inner-left-center ul{ margin:0px; padding:0px; list-style:none; font-weight:bold;} #inner-left-center ul li{padding:9px 0px 5px 48px; font-size:12px; color:#173c69; } #inner-left-centerul li a{font-size:12px; color:#173c69; text-decoration:none; display: block; margin-right: 10px;} #inner-left-center ul li a span{ color:#173c69; display:block; padding: 3px 0px 7px 10px;} #inner-left-center ul li a:hover{ color:#173c69; } #inner-left-center ul li a span:hover{ color:#173c69; } #inner-left-center ul li#light{ color:white;} #inner-left-center ul li#light a{background:url(../images/inner-hover.gif) no-repeat;color:white;} #inner-left-center ul li#light span{background:url(../images/inner-hover-right.gif) right top no-repeat;} #inner-left ul li.hosted{ background:url(../images/icon.jpg) left top no-repeat;} #inner-left ul li.Flight{ background:url(../images/icon.jpg) left -40px no-repeat; height:29px;} #inner-left ul li.crw_Management{ background:url(../images/icon.jpg) left -80px no-repeat; height:35px;} #inner-left ul li.Hotel{ background:url(../images/icon.jpg) left -130px no-repeat; height:35px;} #inner-left ul li.Integration{ background:url(../images/icon.jpg) left -190px no-repeat; height:30px; margin-top:10px;} #inner-left ul li.Interface{ background:url(../images/icon.jpg) left -230px no-repeat; height:30px;} #inner-left ul li.Logs-Interface{ background:url(../images/icon.jpg) left -270px no-repeat; height:33px;} #inner-left ul li.Services-Data{ background:url(../images/icon.jpg) left -312px no-repeat; height:33px;} #inner-left ul li.ODBC-Data{background:url(../images/icon.jpg) left -357px no-repeat; height:30px;} #inner-left ul li.Interface-Data{background:url(../images/icon.jpg) left -400px no-repeat; height:30px;} #inner-left ul li.Programs-Interface{background:url(../images/icon.jpg) left -440px no-repeat; height:30px;} #inner-left ul li.Maintenance-Interface{background:url(../images/icon.jpg) left -485px no-repeat; height:30px;} /******************/ #pay-and-add{border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; clear:both; height:150px; overflow:hidden; float:left; width:100%; margin:7px 0px 30px 0px; padding-bottom:25px; text-align:center;} #pay-and-add address{ width:130px; overflow:hidden; font-style:normal; color:#797979; font-size:12px; margin:26px 0px 20px 50px;} #pay-and-add address a{ color:#797979; font-size:12px; text-decoration:none;} #pay-and-add address a:hover{ color:#9d0025;} /*********************************/ #inner-center-main{width:981px; float:right; overflow:hidden; background:url(../images/inner-center-bg.png) no-repeat; margin:6px 3px 0px 0px;} #inner-center-main #inner-right-top{ margin:30px 0px 0px 0px; width:100%; float:right; overflow:hidden; } #inner-center-main #inner-right-top h1{ padding-bottom: 30px; color:#FFFFFF; font-size:23px; line-height:24px;text-align:center; } #inner-center-main #inner-right-top h4{ color:#FFFFFF; font-size:15px; width:305px; padding:33px 0px 0px 110px; line-height:27px; } #inner-right-main{width:731px; float:right; overflow:hidden; background:url(../images/inner-bg.jpg) no-repeat; margin:6px 3px 0px 0px; } #inner-right-main #inner-right-top{ margin:30px 0px 0px 0px; width:100%; float:right; overflow:hidden; } #inner-right-main #inner-right-top h1{ padding-bottom: 30px; color:#FFFFFF; font-size:23px; line-height:24px;text-align:center; font-weight:bold;} #inner-right-main #inner-right-top h4{ color:#FFFFFF; font-size:15px; width:305px; padding:33px 0px 0px 110px; line-height:27px; } #addons_texts {font-size:14px; padding: 0 20px 0 0; line-height:27px; } #addons_texts2 { color:#385778; font-size:14px; width:305px; padding: 0 10px 0 20px; line-height:27px; } #addons_texts2 p { color:#385778; font-size:12px; line-height:21px; padding:10px 0 0; font-weight:normal;} #Remotely-main{ width:100%; position:relative;overflow:hidden; margin:33px 0px 0px 45px; float:left; clear:both;} #Remotely-main #Remotely{ margin:30px 0px 0px 0px; overflow:hidden; width:315px;} #Remotely-main #Remotely h2{ color:#385778; font-size:16px;} #Remotely-main #Remotely p{ font-size:12px; color:#385778; line-height:21px; padding:25px 0px 0px 0px;} #customer-says{width:305px;right:95px; top:0px; background:url(../images/customer-bg-bottom.png) left bottom no-repeat;} #customer-says-bottom{width:305px; overflow:hidden; background:url(../images/customer-bg-top.png) left top no-repeat; } #customer-says-text{ margin:20px 10px 25px 25px; clear:both; overflow:hidden; } #customer-says-text h2{ color:#143e6b; font-size:15px; padding:3px 0px 0px 25px; } #customer-says-text p{ font-size:11px; color:#656565; padding:20px 0px 10px 15px; line-height:18px; } #customer-says-text span{ display:block; text-align:right; font-size:10px; color:#656565; float:right;clear:both; padding:2px 15px 0px 0px;} /**********************************/ #Demo-Access{width:309px; height:93px; background:url(../images/bottom.jpg) no-repeat; margin:0 0px 0px 30px; float:left; color:#ffffff; font-size:14px; line-height:45px; } #Demo-Access a{ display:block; width:309px; padding-left:20px; color:#FFFFFF; text-decoration:none; } #Demo-Access a:hover{ background:url(../images/bottom.jpg) -337px top no-repeat;} #Demo-Access2{width:309px; height:93px; background:url(../images/bottom.jpg) -337px top no-repeat; margin:0 0px 0px 35px; float:left; line-height:45px; font-size:14px;} #Demo-Access2 a{ display:block; font-size:14px; width:309px; padding-left:20px; color:#FFFFFF; text-decoration:none; } #Demo-Access2 a:hover{background:url(../images/bottom.jpg) left top no-repeat;} /********************************/ #user-explorer{overflow:hidden; clear:both; width:100%;margin:0px 0px 50px 38px;} #user-explorer h6{ background:url(../images/arrer.jpg) left top no-repeat; overflow:hidden; font-size:11px; color:#737373; padding:0px 0px 0px 55px;} #user-explorer h6 span{ display:block; color:#878787;} #user-explorer ul{ margin:30px 40px 0px 0px; padding:0px; list-style:none; width:300px; float:left;} #user-explorer ul li{ color:#737373; font-size:11px; line-height:17px; padding:1px 0px 0px 0px; font-weight:normal;} #user-explorer ul li.heading1{ font-size:12px; font-weight:bold; padding-bottom:1px;} .pricing-name { color:#173C69; margin-bottom:15px; width:100%; font-size:13px; font-weight:bold; line-height:13px; text-decoration:none; } div.scrollable { /* required settings */ position:relative; overflow:hidden; width: 750px; height:90px; } div.scrillable span { font-size:13px; font-weight:bold;line-height:13px; color:#173c69;display:block; } /* root element for scrollable items. Must be absolutely positioned and it should have a extremely large width to accomodate scrollable items. it's enough that you set width and height for the root element and not for this element. */ div.scrollable div.items { /* this cannot be too large */ width:20000em; position:absolute; } /* a single item. must be floated in horizontal scrolling. typically, this element is the one that *you* will style the most. */ div.scrollable div.items div { float:left; } /* you may want to setup some decorations to active the item */ .scrollable { float:left; } a { text-decoration:none; } a:hover { text-decoration:underline; } /* prev, next, prevPage and nextPage buttons */ a.browse { background:url(../images/hori_large.png) no-repeat; display:block; width:30px; height:30px; float:left; margin:20px 40px; cursor:pointer; font-size:1px; } /* right */ a.right { background-position: 0 -30px; clear:right; margin-right: 0px;} a.right:hover { background-position:-30px -30px; } a.right:active { background-position:-60px -30px; } /* left */ a.left { margin-left: 0px; } a.left:hover { background-position:-30px 0; } a.left:active { background-position:-60px 0; } /* up and down */ a.up, a.down { background:url(http://static.flowplayer.org/tools/img/scrollable/arrow/vert_large.png) no-repeat; float: none; margin: 10px 50px; } /* up */ a.up:hover { background-position:-30px 0; } a.up:active { background-position:-60px 0; } /* down */ a.down { background-position: 0 -30px; } a.down:hover { background-position:-30px -30px; } a.down:active { background-position:-60px -30px; } /* disabled navigational button */ a.disabled { visibility:hidden !important; } .overwin1 { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 1000; background-color: #000000; opacity: 0.2; filter: alpha(opacity=20); display:none; } .overwin2 { position: fixed; top: 0; left: 0; z-index: 1500; width: 100%; height: 100%; display:none; } #page-wrap { width: 520px;} #slider { height: 30px; overflow: hidden; position: relative; } /* DEFAULT is for three panels in width, adjust as needed This only matters if JS is OFF, otherwise JS sets this. */ #mover { width: 2880px; position: absolute; } .slide { width: 520px; float: left; position: relative; } /*.slide h1 { font-size: 13px; font-family: "Trebuchet MS", Arial; color: #666; } */ .slide a { font-size: 12px; font-family: Georgia, "Times New Roman", Times, serif; color: #434343; text-decoration: none} .slide a:hover { text-decoration: underline } #slider-stopper { position: absolute; top: 1px; right: -100px; background: #ac0000; color: white; padding: 3px 2px; font-size: 10px; text-transform: uppercase; z-index: 1000; } .slide h1 { font-family: Georgia, "Times New Roman", Times, serif; font-size: 12px; color: #999; } .slidetext { font-size: 12px; font-family: Georgia, "Times New Roman", Times, serif; color: #434343; text-decoration: none} .form_text { font-size: 13px; height: 30px;width: 200px;float: left; color: #143E6B; font-weight: bold} .form_inputs { font-size: 13px; height: 30px;width: 400px;float: left; color: #143E6B; font-weight: bold} .form_comments { font-size: 13px; height: 110px;width: 200px;float: left; color: #143E6B; font-weight: bold} .form_comments_inputs { font-size: 13px; height: 110px;width: 400px;float: left; color: #143E6B; font-weight: bold}