/* * * Author: Gregory Maher (Look North Inc.) * Version: 1.0 * Notes: Raritan.com [RAM] Stylesheets * */ /* * Globals */ BODY, HTML * { font-family: "DIN Next W01 Light", Helvetica, Arial, sans-serif; } #SiteWrapper { margin: 0 auto; padding-top: 125px; } #SiteWrapper #Masthead { height: 125px; z-index: 100000; width: 100%; margin: 0 auto; position: fixed; top: 0; background: #FFF url(/images/site/bg-masthead-bordertop.png) top repeat-x; -moz-box-shadow: 0 0 5px #999; -webkit-box-shadow: 0 0 5px #999; box-shadow: 0 0 5px #999; } #SiteWrapper.NoShadow #Masthead { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #SiteWrapper #Masthead .logo { margin: 26px 0 0 0; padding: 0; width: 200px; } #SiteWrapper #Masthead #NavRow { margin-top: 22px; height: 103px; overflow: hidden; } /* * Typography */ H1,H2,H3,H4,H5,H6 { color: #000; font-family:'DIN Next W01 Regular', Helvetica, Arial, sans-serif; font-weight: normal; } H1 { font-size: 55px; } H2 { font-size: 46px; } H3 { font-size: 36px; } H4 { font-size: 24px; line-height: 1.30em; } H5 { font-size: 18px; line-height: 1.35em; } H6 { font-size: 14px; margin: 0 0 2px 0; } P { color: #000; margin: 0 0 15px 0; } A { color: #4791d0; } A:HOVER { color: #58b2fa; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-family:'DIN Next W01 Regular', Helvetica, Arial, sans-serif; } #Intro { height: 210px; background: #333333 url(/assets/ram/images/global/bg-intro.jpg) center top no-repeat; } #Intro { height: 210px; background: #333333; } #Intro H1 { margin-top: 110px; color: #FFF; font-size: 46px; } #Intro H2 { margin-top: 110px; color: #FFF; } .Wrapper { width: 100%; display: block; clear: both; position: relative; } /* * Utility */ .Right { float: right; } .Left { float: left; } HR { border: none; margin: 20px auto; display: block; clear: both; background-color: #CCC; height: 1px; } UL, OL { color: #000; margin: 0; padding: 0; } UL LI { list-style: disc; font-size: 14px; margin-left: 20px; line-height: 1.3em; } OL LI { list-style: decimal; font-size: 14px; margin-left: 25px; margin-bottom: 5px; line-height: 1.3em; } DL { padding: 0 0 20px 0; line-height: 1.25em; color: #000; } DT { font-size: 14px; margin: 0 0 10px 0; font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } DD { font-size: 12px; } B, STRONG { font-family:'DIN Next W01 Medium', Helvetica, Arial, sans-serif; font-weight: normal !important; } I,EM { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; font-style: normal !important; } P { font-size: 14px; } HR.Dotted { margin: 25px 0 15px; } .end { float: right !important; } .Dotted { background: transparent; border-bottom: 1px dotted #CCC !important; margin: 5px 0 10px; } .Image { float: left; width: 100%; height: auto !important; } .Image IMG { width: 100%; height: auto !important; margin: 0; padding: 0; } .Image.right, IMG.Right { width: 49%; float: right; margin: 0 0 10px 15px; padding: 0; } .Image.left, IMG.Left { width: 49%; float: left; margin: 0 15px 10px 0px; padding: 0; } .Image SPAN { font-size: 11px; display: block; text-align: left; color: #555; line-height: 1.25em; } .Light { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } .Medium { font-family:'DIN Next W01 Regular', Helvetica, Arial, sans-serif; } .MediumCondensed { font-family:'DIN Next LT W04 Medium Cond', Helvetica, Arial, sans-serif; } .Bold { font-family:'DIN Next W01 Medium', Helvetica, Arial, sans-serif; } .TextCenter { display: block; text-align: center; } .TextRight { display: block; text-align: right; } .TextSmall, .TextSmall P, .TextSmall LI { font-size: 12px; } .TextMedium, .TextMedium P, .TextMedium LI { font-size: 16px; } .TextLarge, .TextLarge P { margin: 0 0 25px 0; } .TextLarge, .TextLarge P, .TextLarge LI { font-size: 18px; } .TextSmall .Button { padding: 7px 15px; } .Button { font-size: 14px; font-family:'DIN Next W01 Medium', Helvetica, Arial, sans-serif; padding: 10px 20px; line-height: 1.25em; color: #FFF; background-color: #5eace3; } .Button:HOVER { color: #FFF; background-color: #000; } .ButtonList LI { list-style: none; margin-left: 0; } .ButtonList LI .Button { display: block; margin: 7px 0 0 0; padding: 8px 15px; font-size: 16px; } .ButtonList LI .Button:HOVER { background-color: #000; color: #FFF; } .ButtonList LI .Button.BgBlue { color: #FFF; } .ButtonList LI .BgByBlue.Selected { color: #333; background-color: #f2f2f2; } .FourColButtons { } .FourColButtons LI { list-style: none; margin-left: 0; float: left; width: 25%; line-height: 1.3em; } .FourColButtons LI A { color: #10619f; font-size: 20px; margin: 1px; background-color: #e3f4fd; min-height: 70px; padding: 12px 20px; display: block; } .FourColButtons LI A.Selected, .FourColButtons LI A:HOVER { color: #333; background-color: #f2f2f2; } .Listing DL { margin: 0px 0 0 0px; } .Listing DL DT { font-size: 18px; } .Listing DL DD { font-size: 14px; } .Listing .ListItem { margin: 0 0 10px 0; } .Listing .ListItem A { color: #10619f; } .Listing .ListItem A:HOVER { color: #000; } .Listing .ListingPhoto { float: left; } .Listing .ListingPhoto IMG { width: 100%; height: auto !important; margin: 0 !important; padding: 0 !important; float: left; } .TwoColList { -moz-column-count: 2; -moz-column-gap: 20px; -webkit-column-count: 2; -webkit-column-gap: 20px; column-count: 2; column-gap: 20px; margin-bottom: 20px; } .SubListing DL { margin: 10px 0 10px 0px; padding: 0 0 7px 0;} .SubListing DL DT { font-size: 14px; line-height: 1.35em; margin: 0 0 3px 0; padding: 0; } .SubListing DL DT A { color: #4791d0; } .SubListing DL DT A:HOVER { color: #000; } .SubListing DL DD { font-size: 13px; line-height: 1.35em; } .Bulleted { margin: 20px 0 25px 0; font-size: 14px; } .Bulleted LI { margin: 0 0 0px 20px; list-style: disc; } /* * Spacing/Padding */ .Pad10 { padding: 10px; } .Pad15 { padding: 15px; } .Pad20 { padding: 20px; } .Pad30 { padding: 30px; } .Pad40 { padding: 40px; } .Pad50 { padding: 50px; } .NoPad { padding: 0; } .PushDown100 { margin-top: 100px; } .PushDown110 { margin-top: 110px; } .PushDown220 { margin-top: 220px; } .clearfix { display: block; clear: both; } .Shadow { margin: 5px 0; -moz-box-shadow: 0 0 5px #CCC; -webkit-box-shadow: 0 0 5px#CCC; box-shadow: 0 0 5px #CCC; } A:HOVER .Shadow { -moz-box-shadow: 0 0 2px #CCC; -webkit-box-shadow: 0 0 2px#CCC; box-shadow: 0 0 2px #CCC; } /* * Columns and Page Specific Styles */ .TwoCol .columns { width: 48.333% !important; } .ThreeCol .Col1 .Spacer { padding: 0 20px 0 0; } .ThreeCol .Col2 .Spacer { padding: 0 10px 0 10px; } .ThreeCol .Col3 .Spacer { padding: 0 0px 0 20px; } /* .ThreeCol.Borders { background: url(http://ram.raritanassets.com/images/global/bg-full-three_column_borders.png) repeat-y center; } */ .FiveCols { width: 100%; float: left; } .FiveCols .Spacer { padding: 10px 20px; } .FiveCols .Col1, .FiveCols .Col2, .FiveCols .Col3, .FiveCols .Col4, .FiveCols .Col5 { float: left; width: 20%; } #Breadcrumb { padding-top: 25px; } #Breadcrumb P { position: relative; } .Feedback A { -moz-box-shadow: 0 0 5px #888; -webkit-box-shadow: 0 0 5px#888; box-shadow: 0 0 5px #888; } /* * Background and Text Color */ .BgBlue { background-color: #5eace3; color: #FFF; } .BgGreen { background-color: #a1d528; color: #000; } .BgOrange { background: #fccb05; } .BgGray { background: #efefef; } .BgLgtGray { background-color: #f2f2f2; color: #000; } .BgDrkGray { background-color: #333; color: #CDCDCD; } .BgLgtBlue { background-color: #a1dafa; color: #FFF;} .BgByBlue { background-color: #e3f4fd; color: #10619f; } .BgSkyBlue { background-color: #9fcfff; color: #000; } .BgLgtGreen { background-color: #cffc70; color: #FFF;} .BgPeach { background-color: #feeeac; color: #000; } .BgWhite { background-color: #FFF; color: #000; } .BgBlack { background-color: #000; color: #FFF; } .BgRed { background-color: #ff0000; color: #FFF; } .BgMagenta { background-color: #ff33cc; color: #FFF; } .BgYellow { background: #ffd323 url(http://ram.raritanassets.com/images/global/bg-yellow_fade.jpg) top center repeat-x; color: #FFF; } .BgBrown { background-color: #663300; color: #FFF; } .BgWhite { background-color: #FFF; } .BgTrans { background-color: transparent !important; background: url(http://ram.raritanassets.com/images/global/bg-trans_white.png) !important; color: #222; } .BgTrans:HOVER { background: url(http://ram.raritanassets.com/images/global/bg-trans_white_80.png) !important; color: #000 !Important; } .NoImage { background-image: none !important; } .TxtWhite { color: #FFF; } .TxtBlack { color: #000; } .TxtDrkGray { color: #333333; } .TxtLgtGray { color: #CDCDCD; } .TxtGray { color: #999; } .TxtBlue { color: #4791d0; } .TxtLgtBlue { color: #10619f; } /* Color Overrides */ .BgBlue.Wrapper { background: #4791d0 url(http://ram.raritanassets.com/images/global/bg-blue.jpg) top center no-repeat; } .BgWhite,.BgWhite A { color: #10619f; } .BgWhite:HOVER, .BgWhite A:HOVER { color: #000; } .BgBlue.Button { color: #FFF; } .BgBlue.Button:HOVER { color: #FFF; background-color: #000 !important; } .BgLgtGreen .Button { color: #005319; } .BgLgtGreen.Button:HOVER { color: #000; } .TxtBlack.Button:HOVER { color: #FFF; } /* * Main Navigation */ .MainNavigation { width: 100%; } .MainNavigation > ul { margin: 49px 0 0 0px; width: 100%; } .MainNavigation li, .MainNavigation > a { text-transform: uppercase; font-family:'DIN Next W01 Medium', Helvetica, Arial, sans-serif !important; font-size: 18px; color: #000; float: left; display: inline; margin: 0 20px 0 0; padding: 0; } .MainNavigation .Dropdown { display: block; float: left; padding: 0 10px 38px 10px; } .MainNavigation .Dropdown > A { font-family:'DIN Next W01 Medium', Helvetica, Arial, sans-serif !important; background: url(/assets/ram/images/global/nav-blue_arrow-dwn.gif) right no-repeat; } .MainNavigation .Dropdown.Open > A { background: url(/assets/ram/images/global/nav-blue_arrow-up.gif) right no-repeat; } .MainNavigation .Dropdown.Open { border-bottom: 8px solid #333; padding-bottom: 25px; margin-bottom: 0; } .MainNavigation a:hover { color: #58b2fa; } .MainNavigation li a { font-family:'DIN Next W01 Medium', Helvetica, Arial, sans-serif !important; padding: 15px 18px 15px 0; margin: 0; color: #666666; } .MainNavigation DIV.NavDropDown { display: none; float: left; position: absolute; background-color: #EEE; width: 100%; top: 131px; left: 0px; } .MainNavigation DIV.NavDropDown UL { list-style: none; display: block; float: left; width: 100px; } .MainNavigation DIV.NavDropDown.Open { display: block; } /* * Mobile Navigation */ #MobileNav { display: none; } #MobileNavSearch.Open, #MobileNavSearch { display: none; } #MobileNavContent.Open, #MobileNavContent { padding: 0 20px; display: none; } #MobileNavContent .NavCols { width: 100%; display: block; clear: both; } #MobileNavContent .row A { margin: 0; } #MobileNavContent .row, #MobileNavContent .columns { display: block; clear: both; width: 100%; margin: 0; padding: 0; } #MobileNavContent .row { margin: 0 auto !important; } #MobileNavContent .row IMG { display: none; } /* * Navigation Panels */ #Panels { position: relative !important; top: 0px; color: #FFF; background-color: #333333; float: left; display: block; height: 0px; width: 100%; z-index: 10000; overflow: hidden; } #Panels .SlideContent { width: 100%; display: block; } #Panels #PanelSlide { width: 100%; } .NavPanels { display: block; float: left; max-width: 100%; width: 100% !important; background: #333333; } .NavPanels H3 { color: #999; margin: 20px 0 20px 0; } .NavPanels H5 { padding: 25px 10px 7px; color: #767676; } .NavPanels H5.NoPad { padding-top: 15px; } .NavPanels H5 A { color: #767676; } .NavPanels H5 A:HOVER { color: #FFF; } .NavPanels .PromoButton A { float: left; width: 100%; background-color: #444; padding: 12px 15px 12px 10px !important; margin: 0 0 2px 0; border-bottom: 1px solid #767676; } .NavPanels .PromoButton .PromoTitle { color: #FFF; margin: 0; padding: 0 0 1px 0; line-height: 1.25em; font-size: 14px; width: 55%; clear: both; display: block; } .NavPanels .PromoButton .PromoLink { color: #000; margin: 0; padding: 0; line-height: 1.2em; font-size: 11px; width: 55%; clear: both; display: block; } .NavPanels .PromoButton.ProductKVM A { background: #fcca03 url(/assets/ram/images/global/promo-bg-kvm.png) right no-repeat; } .NavPanels .PromoButton.ProductPower A { background: #98cd1b url(/assets/ram/images/global/promo-bg-power.png) right no-repeat; } .NavPanels .PromoButton.ProductCatalog A { background: #444 url(/assets/ram/images/global/promo-bg-product_catalog.png) right no-repeat; } .NavPanels .PromoButton.ProductDCIM A { background: #4894cf url(/assets/ram/images/global/promo-bg-dcim-new.png) right no-repeat; border-bottom: none; } .NavPanels .PromoButton.ProductDCIM .PromoTitle { width: 75%; } .NavPanels .PromoButton A:HOVER { background-color: #666; } .NavCols { padding: 0; margin: 0; } .NavCols A { float: left; padding: 14px 10px 14px 10px; color: #FFF; display: table-cell; width: 100% !important; vertical-align: middle; float: left; line-height: 1em; } .NavThreeCols .NavCols { font-size: 14px; border-bottom: 1px solid #555; width: 32%; display: inline-block; vertical-align: middle; margin: 0; padding: 0; } .NavThreeCols .NavCols:HOVER { background-color: #555; } .NavTwoCols .NavCols { font-size: 14px; border-bottom: 1px solid #555; width: 49%; display: inline-block; vertical-align: middle; margin: 0 0px 0 0; padding: 0; } .NavTwoCols .NavCols:HOVER { background-color: #555; } .NavFourCols .NavCols { font-size: 14px; border-bottom: 1px solid #555; width: 24%; display: inline-block; vertical-align: middle; margin: 0; padding: 0; } .NavFourCols .NavCols:HOVER { background-color: #555; } .NavOneCols .NavCols { width: 100%; } /* Nav Override based on Content */ .NavProducts .NavTwoCols .NavCols, .NavProducts .NavOneCols .NavCols { padding: 3px 0px; } .NavBuy .NavCols A, .NavResources .NavCols A { padding: 9px 10px 9px; } .SlideContent .NavBuy, .SlideContent .NavResources { display: block !important; } /* * Utility Navigation Styles */ .UtilityNavigation { position: relative; margin: 0 auto 0; } .UtilityNavigation ul { float: right; margin-top: 7px; position: absolute; right: 0px; z-index: 999999; } .UtilityNavigation li { font-size: 11px; display: block; margin: 0; color: #FFF; } .UtilityNavigation ul > li { list-style: none; padding: 0 10px; float: left; border-left: 1px solid #CCC; color: #FFF; } .UtilityNavigation ul li:first-child A, .UtilityNavigation ul li:first-child { border-left: none; } .UtilityNavigation li A { font-family: 'DIN Next W01 Light', Helvetica, Arial, sans-serif; color: #FFF; } .UtilityNavigation li li A { font-size: 11px; font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } .UtilityNavigation li A:HOVER { color: #EEE; } .UtilityNavigation .UtilWorld {} /* .UtilityNavigation .UtilWorld { margin-right: 10px; margin-top: -10px; padding-top: 10px; padding-right: 65px; padding-bottom: 12px; background: url(/assets/ram/images/global/btn-world_map.gif) right top no-repeat; } */ .UtilityNavigation .UtilWorld.Open { /* border-bottom: 10px solid #333; */ } .UtilityNavigation .UtilWorld .Languages { display: none; } .UtilityNavigation .UtilWorld .Languages .Spacer { padding: 20px 35px !important; } .UtilityNavigation .UtilWorld.Open .Languages {} .UtilityNavigation .UtilWorld .Languages { background: url(/assets/ram/images/global/bg-regional_map.png) center top; position: absolute; right: 0px; top:20px; z-index: 99999999; float: right; padding: 0px; width: 645px; height: 255px; } .UtilityNavigation .UtilWorld .Languages LI { float: left; } .UtilityNavigation .UtilWorld .Languages LI A { padding: 3px 6px; font-size: 12px; color: #ccc; border: none; font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } .UtilityNavigation .UtilWorld .Languages LI A:HOVER { } .UtilityNavigation .UtilWorld .RegionList > LI { border-left: none; display: block; clear: both; width: 100%; font-size: 14px; border-bottom: 1px solid #666; float: left; padding: 7px 0; } .UtilityNavigation .UtilWorld .RegionList SPAN { float: left; width: 150px; color: #FFF; } .UtilityNavigation .UtilWorld .RegionList { display: block; width: 100%; float: left; padding: 0 35px; } .UtilityNavigation .UtilWorld .RegionList UL { float: left; width: 68%; margin: 2px 0 0; padding: 0; } .UtilityNavigation .UtilWorld .RegionList LI LI { float: left; } .UtilityNavigation .UtilWorld .RegionList .TwoLevel { height: 60px; } .UtilityNavigation .UtilWorld .RegionList .LevelTwo { top: 100px; } .UtilityNavigation .UtilWorld .RegionList LI LI A { font-size: 12px; padding: 0 7px !important; color: #a99b98; } .UtilityNavigation .UtilWorld .RegionList LI LI A.Selected { color: #FFF; } .UtilityNavigation .UtilWorld .RegionList LI LI A:HOVER { color: #FFF; } /* * Language Selector Popup */ #LanguageSelector { padding: 30px; width: 100%; height: 100%; float: left; background: url(/assets/ram/images/global/bg-regional_map.png) center no-repeat; background-size: cover; } #LanguageSelector LI, #LanguageSelector P { color: #FFF; } #LanguageSelector .RegionList { padding: 0; margin: 0; } #LanguageSelector .RegionList Ul { padding: 0; margin: 0; } #LanguageSelector .RegionList > LI { margin: 0; padding: 10px 0; list-style: none; clear: both; float: left; width: 100%; border-top: 1px solid #FFF; width: 100%; } #LanguageSelector .RegionList LI LI { margin: 0; padding: 0; display: inline-block; font-size: 12px; } #LanguageSelector .RegionList LI LI A { float: left; padding: 3px 15px 0px 0px; vertical-align: middle; } #LanguageSelector .RegionList LI SPAN { float: left; width: 30%; } #LanguageSelector .RegionList .LanguageList { float: left; width: 70%; } #LanguageSelector .Selector { padding: 10px 0 15px; } /* * Sub-Navigation Styles */ #SubNav .ButtonList { margin: 0 35px 0 0; } #SubNav UL LI { list-style: none; margin-left: 0; } #SubNav .Spacer { margin: 0 35px 0 0px; } #SubNav P { margin: 0 0 15px 0; } #SubNav .ButtonList .Button { color: #10619f; background-color: #e3f4fd; } #SubNav .ButtonList .Button:HOVER { color: #FFF; background-color: #000; } #SubNav .ButtonList .Button.Selected { background-color: #EEE; color: #000; } #SubNav .ButtonList A.Open { display: block; } #SubNav .ButtonList A { float: left; width: 100%; } /* * Footer Specific Styles */ #Footer { padding: 50px 0; } #Footer P { color: #CDCDCD; } #Footer H5 { color: #CDCDCD; font-size: 14px; margin: 10px 0 8px; } #Footer H4 { color: #CDCDCD; margin: 0 0 15px 0; font-size: 18px; font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } #Footer H4 A { color: #CDCDCD; } #Footer H4 A:HOVER { color: #FFF; } #Footer LI { margin: 0; padding: 0; } #Footer LI A { font-size: 12px; color: #CDCDCD; margin: 0; padding: 0; line-height: 1.25em; } #Footer LI A:HOVER { color: #FFF; } #Footer .Copyright { padding: 20px 0; } #Footer .Copyright A { color: #CDCDCD; } #Footer .Copyright A:HOVER { color: #FFF; } #FooterNav .columns { width: 20% !important; margin: 0; padding: 0; } #FooterNav .columns LI, #FooterNav .columns LI A { line-height: 1.25em !important; margin: 0 0 8px 0; display: block; } #Footer .EmailSubmit { height: 30px; margin-bottom: 10px; margin-left: 0 !important; margin-right: 0 !important; width: 95px; display: inline-block; float: left; } #Footer .EmailData { height: 30px; margin-bottom: 10px; float: left; margin-right: 8px; } /* * Homepage Specific Styles */ #Homepage .Wrapper.BgGreen { background: #98cd1b url(http://ram.raritanassets.com/images/global/bg-green.jpg) top center no-repeat; } #Homepage .caroufredsel_wrapper { float: left; overflow: hidden; background: url(http://ram.raritanassets.com/images/global/pdu-slide_bg.png) left top no-repeat; background-size: contain; } /* Homepage PDU Styles */ #Homepage #PDUPanel { padding: 0; background: #98cd1b url(http://ram.raritanassets.com/images/global/bg-green.jpg) top center no-repeat; } #Homepage #PDUPanel .row { min-height: 446px; position: relative; } #Homepage #PDUPanel .Button { background-color: #629017; } #Homepage #PDUPanel .Button:HOVER { background-color: #000; } #Homepage #PDUSlides { display: none; } #Homepage .caroufredsel_wrapper #PDUSlides { display: block; } #Homepage #PDUSlides IMG { float: left; } #Homepage .PDUPager { float: left; clear: both; } #Homepage .PDUPager A { height: 1px; width: 1px; float: left; padding: 20px 20px 0 0; background-color: #e2fda8; overflow: hidden; border-radius: 20px; margin: 0 10px 0 0; } #Homepage .PDUPager A.selected { background-color: #FFF; } #Homepage .PDUContent { padding-top: 20px; padding-bottom: 20px; clear: both; display: block; height: 145px; } #Homepage .PDUContainer { float: left; position: absolute; width: 580px; right: 70px; } #Homepage .PDUFloat { position: absolute; top: 0; left: 0; max-width: 400px; } #Homepage #CustomerPanel, #Homepage #AwardsPanel { background: url(http://ram.raritanassets.com/images/global/bg-gray.jpg) top center no-repeat; background-size: cover; color: #000; } #Homepage #FeatureKVM { background: #fbcc04 url(http://ram.raritanassets.com/images/global/bg-orange.jpg) center top no-repeat; padding-top: 100px; } #Homepage #FeatureKVM .KVMImage { display: block; margin: 0 auto; position: relative; margin: -140px auto 0; z-index: 200; } #Homepage #FeatureKVM H3 { margin-bottom: 15px; } #Homepage #FeatureKVM H5 { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } #Homepage #FeatureKVM P { color: #000; margin-bottom: 10px; width: 95%; } #Homepage #FeatureDCIM { height: 400px; } #Homepage #FeatureDCIM H4 { margin: 0 0 10px 0; } #Homepage #FeatureDCIM .DCIMLaptop { position: absolute; bottom: 0px; width: 100%; text-align: center; height: 10px; } #Homepage #FeatureDCIM .DCIMLaptop IMG { margin: -250px 0 0px 300px; } #Homepage #FeatureDCIM .DCIMIpad { position: absolute; bottom: 0; width: 100%; } #Homepage #FeatureDCIM .PushDown { margin-top: 0px; } #Homepage #FeatureDCIM .Text { padding: 40px 0 50px; } #Homepage #FeatureDCIM .Button { background: #a1dafa; color: #000; } #Homepage #FeatureDCIM .Button:HOVER { background-color: #000; color: #FFF; } #Homepage #AwardsPanel { padding: 60px 0 50px; } #Homepage #AwardsPanel H3 { margin: 0 0 30px 0; } #Homepage #AwardsPanel P { color: #000; padding: 0px 10px 25px; margin-bottom: 10px; } #Homepage #AwardsPanel P.TextCenter { margin-bottom: 0px; padding-bottom: 20px; } #Homepage #CustomerPanel { padding: 70px 0 50px; } #Homepage #CustomerPanel P.TextLarge { color: #333333; font-size: 28px; margin: 10px 0; } #Homepage .Hero, .Wrapper.Hero { width: 100% !important; height: 500px !important; position: relative; display: block; clear: both; opacity: 1.0; } #Homepage .Hero .GraphicViewMore { margin-top: 10px; display: block; clear: both; } #Homepage .Hero H3 { padding-bottom: 10px; } #Homepage .Hero P { padding-bottom: 20px; } #Homepage .HeroSlider { width: 100% !important; position: relative; height: 499px; overflow: hidden; } #Homepage .HeroSlider .Slide { height: 499px !important; width: 100% !important;background: transparent !Important; } #Homepage .HeroSlider .PushDown { margin-top: 150px; } #Homepage .HeroPager { position: absolute; bottom: 30px; width: 100%; display: block; text-align: center; z-index: 12; } #Homepage .HeroPager A { display: inline-block; padding: 12px 12px 0 0; background-color: #FFF; border-radius: 10px; height: 1px; width: 1px; overflow: hidden; margin: 0 7px; } #Homepage .HeroPager A.activeSlide { background-color: #c4f74a; } /* New Carousel */ .HomepageSlides { text-align: center; margin: 0 !important; padding: 0 !important; position: relative !important; background-image: none; background-color: #4791d0; } .HomepageSlides A { display: block; text-align: center !important; } .HomepageSlides A .slide-large {} .HomepageSlides A .slide-small { display: none; } .HomepageSlides A IMG { margin: 0 auto; } .slick-dots { position: absolute; z-index: 99; bottom: 20px !important; } .slick-dots li { background-color: #000; border-radius: 100px; overflow: hidden; opacity: 0.4; height: 11px !important; width: 11px !important; display: inline-block !important; } .slick-dots li.slick-active { opacity: 1; } @media only screen and (max-width: 768px) { .HomepageSlides A .slide-large { display: none; } .HomepageSlides A .slide-small { display: block; } } #Homepage #CaseStudyPanel .CaseLogo { margin-top: 15%; } #SignUpPromo { padding: 20px 0 20px; } #SignUpPromo P { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; line-height: 1.4em; } #SignUpPromo INPUT { background-color: #666666; border: none; color: #CCC; padding: 10px; width: 200px; } #SignUpPromo .Button { background-color: #797a7a; color: #CCC; padding: 7px 20px 8px !Important; margin: 0 0 0 5px; } #SignUpPromo .Button:HOVER { background-color: #DDD; color: #000; } /* * Product Specific Styles */ #Products #Intro { height: 210px; background: #333333; } #Products #Intro H2 { font-size: 26; } #Products H2.ProductGroup { font-size: 36px; } #Products H1.ProductGroup { font-size: 36px; } #Products .ProductGroupDescription { padding-bottom: 25px; border-bottom: 1px solid #CCC; margin-bottom: 25px; } #Products .ProductTitle { color: #006699; margin-bottom: 10px; clear: both; } #Products .ProductTitle:HOVER { color: #58b2fa; } #Products .ProductLabel { background-color: #f2c800; color: #FFF; padding: 2px 10px; float: right; border: 3px solid #FFF; margin: 0px -15px 0 0; } #Products .ProductImage { margin: 0px 15px 0 0; padding: 0px; } #Products .ProductIntro UL { list-style: disc; margin: 0 0 0 20px; } #Products .ProductIntro LI P { margin: 0 !important; padding: 0 !important; } #Products .ProductIntro LI { margin: 0 0 10px 0; } #Products.Detail #Intro { height: 355px; background: #333333 url(http://ram.raritanassets.com/images/global/product-placeholder.jpg) center top; } #Products.Detail #Intro H2 { font-size: 46px; text-transform: uppercase; text-shadow: 3px 3px 4px rgba(60, 60, 60, 0.75); } #Products.Detail #Intro .PushDown { margin-top: 260px; } #Products.Detail .Prod-FeaturedImage { width: 100%; height: auto !important; padding: 0; margin: 8px 0 0px; } #Products.Detail .TwoCol { margin: 5px 0 10px; } #Products.Detail H1.TestH1 { margin-bottom: .5em; font-size: 26px; } #Products.Detail TD { padding: 15px 0 15px !important; margin: 0; vertical-align: middle; } #Products.Detail TD P IMG, #Products.Detail TD P { margin: 0 !important; padding: 0 !Important; } #Products.Detail TD P { display: inline-block; width: 100%; } #Products.Detail TD P IMG { vertical-align: middle !important; } #Products.Feature H1 { font-size: 36px; } #Products.Feature H3 { font-size: 24px; } #Products #FooterCTA .CTA-Title { padding: 0 0 35px 0; } #Products #FooterCTA .CTA-Image { margin: 10px auto 15px auto; } #Products #FooterCTA .CTA-Heading { font-size: 24px; margin: 0 auto 10px; } #Products #FooterCTA .CTA-Excerpt { padding: 0 0px; } #Products #Sensor { width: 648px; height: 554px; position: relative;} #Products #Sensor .BorderLeft { min-height: 130px; border-left: 1px solid #CCC; padding-left: 25px; padding-bottom: 5px; } #Products #Sensor .BorderRight { min-height: 130px; border-right: 1px solid #CCC; padding-right: 15px; padding-bottom: 5px; } #Products #Sensor .SensorBox { position: absolute; } #Products #Sensor .SensorBox SPAN { position: absolute; width: 150px; font-size: 24px; color: #ffd11b; } #Products #Sensor .SensorBox.Open SPAN { color: #478fcf; } #Products #Sensor .SensorPanel .SensorImage { margin: 10px 15px 0; } #Products #Sensor .SensorPanel { display: none; position: absolute; z-index: 100000; } #Products #Sensor .SensorPanel .SensorContent { vertical-align: middle; width: 500px; min-width: 300px; padding: 20px 20px 10px 20px; background: #f2f2f2 url(http://ram.raritanassets.com/images/global/why-power-bg_gray_grad.jpg) top repeat-x; } #Products #Sensor .SensorPanel .SensorContent P { color: #717171; line-height: 1.5em; margin-bottom: 0; } #Products #Sensor .SensorPanel .SensorContent H5 { color: #717171; } #Products #Sensor .Sensor { opacity: 0.1; } #Products #Sensor .Sensor:HOVER { opacity: 1; } #Products #Sensor .SensorBox.Temperature { left: 67px; top: 255px; } #Products #Sensor .SensorBox.Temperature SPAN { top: 45px; left: -10px; } #Products #Sensor .SensorBox.Temperature .SensorPanel { padding-top: 20px; background: url(http://ram.raritanassets.com/images/global/why-power-sensor_arrow_left.png) left top no-repeat; top: 75px; left: -5px; } #Products #Sensor .SensorBox.Temperature .SensorPanel .SensorContent { border-right: 1px solid #CCC; border-bottom: 1px solid #CCC; } #Products #Sensor .SensorBox.Humidity { left: 434px; top: 211px; } #Products #Sensor .SensorBox.Humidity SPAN { left: 50px; top: 4px; } #Products #Sensor .SensorBox.Humidity .SensorPanel { border-right: 1px solid #CCC; padding-top: 20px; background: url(http://ram.raritanassets.com/images/global/why-power-sensor_arrow_right.png) right top no-repeat; top: 36px; right: -117px; } #Products #Sensor .SensorBox.Humidity .SensorPanel .SensorContent { width: 470px; border-bottom: 1px solid #CCC; } #Products #Sensor .SensorBox.Humidity .SensorPanel .SensorImage { margin-top: 0; } #Products #Sensor .SensorBox.AirPressure { left: 584px; top: 264px; } #Products #Sensor .SensorBox.AirPressure SPAN { right: -20px; top: 44px; } #Products #Sensor .SensorBox.AirPressure .SensorPanel { border-right: 1px solid #CCC; padding-top: 20px; background: url(http://ram.raritanassets.com/images/global/why-power-sensor_arrow_right.png) right top no-repeat; top: 75px; right: 0px; } #Products #Sensor .SensorBox.AirPressure .SensorPanel .SensorContent { width: 470px; border-bottom: 1px solid #CCC; } #Products #Sensor .SensorBox.AirPressure .SensorPanel .SensorImage { margin-top: 0; } #Products #Sensor .SensorBox.Moisture { left: 97px; top: 382px; } #Products #Sensor .SensorBox.Moisture SPAN { left: -10px; top: 44px; } #Products #Sensor .SensorBox.Moisture .SensorPanel { padding-bottom: 21px; background: url(http://ram.raritanassets.com/images/global/why-power-sensor_arrow_bottomleft.png) left bottom no-repeat; bottom: 55px; left: -5px; } #Products #Sensor .SensorBox.Moisture .SensorPanel .SensorContent { width: 470px; border-right: 1px solid #CCC; } #Products #Sensor .SensorBox.Moisture .SensorPanel .SensorImage { margin-top: 0; } #Products #Sensor .SensorBox.AirFlow { left: 411px; top: 388px; } #Products #Sensor .SensorBox.AirFlow SPAN { top: 45px; left: -10px; } #Products #Sensor .SensorBox.AirFlow .SensorPanel { border-right: 1px solid #CCC; padding-bottom: 20px; background: url(http://ram.raritanassets.com/images/global/why-power-sensor_arrow_bottomright.png) right bottom no-repeat; bottom: 55px; right: -5px; } #Products #Sensor .SensorBox.AirFlow .SensorPanel .SensorContent { width: 470px; padding-bottom: 0; } #Products #Sensor .SensorBox.AirFlow .SensorPanel .SensorImage { margin-top: 0; } #Products #Sensor .SensorBox.ContactClosure { left: 255px; top: 469px; } #Products #Sensor .SensorBox.ContactClosure SPAN { top: 45px; left: -10px; width: 260px; } #Products #Sensor .SensorBox.ContactClosure SPAN { top: 45px; left: -10px; } #Products #Sensor .SensorBox.ContactClosure .SensorPanel { border-right: 1px solid #CCC; padding-bottom: 20px; background: url(http://ram.raritanassets.com/images/global/why-power-sensor_arrow_bottomright.png) right bottom no-repeat; bottom: 55px; right: -5px; } #Products #Sensor .SensorBox.ContactClosure .SensorPanel .SensorContent { width: 470px; padding-bottom: 0; } #Products #Sensor .SensorBox.ContactClosure .SensorPanel .SensorImage { margin-top: 0; } #Products.WhyKVM .Virtual .TopText { float: left; margin: 60px 0 0 430px; } #Products.WhyKVM .Virtual .BottomText { display: block; clear: both; float: left; margin: 200px 0 0 0; width: 550px; } #ProductCatalog #Intro { height: 210px; background: #333333 no-repeat; } #ProductCatalog .ProductCatalog TH { font-size: 11px; } #ProductCatalog .ProductCatalog TD { font-size: 11px; } /* Screenshot Slideshow */ #SlidesContent { position: relative; width: 100%; min-height: 600px; float: left; overflow: hidden; display: block; } #SlidesContent .LaptopPager { position: absolute; bottom: 30px; width: 100%; display: block; text-align: center; z-index: 1000; } #SlidesContent .LaptopPager A { background-color: #CECECE; height: 1px; width: 1px; display: inline-block; padding: 12px 12px 0 0; margin: 0 4px; overflow: hidden; border-radius: 20px; } #SlidesContent .LaptopPager A:HOVER { background-color: #5eace3; } #SlidesContent .LaptopPager .selected,.SlidesContent .LaptopPager .selected:HOVER { background-color: #666; } #SlidesContent .LaptopPrevNext { display: none; position: absolute; top: 30%; width: 100%; z-index: 1001; } #SlidesContent .LaptopPrevNext A { opacity: 0.6; } #SlidesContent .LaptopPrevNext A:HOVER { opacity: 0.9; } #SlidesContent .LaptopPrevNext .Next { float: right; margin-right: 8%; } #SlidesContent .LaptopPrevNext .Prev { float: left; margin-left: 8%; } #SlidesContent .LaptopCover .LaptopOverlay { position: absolute; top: 0; z-index: 100; } #SlidesContent .LaptopSlideContainer { margin: 0px auto; width: 62%; top: 34px; position: relative; } #SlidesContent .LaptopSlide { background-color: #000; margin: 0px auto; top: 0px; text-align: center; overflow: hidden; } #SlidesContent .LaptopSlide IMG { float: left; display: block; width: 100%; height: auto !important; } .LatptopCaptionContainer { width: 100%; position: relative; bottom: 0px; min-height: 170px; } .LaptopCaption { width: 65%; margin: 0 auto; } /* * Blog Specific Styles */ #Blog #Intro { height: 210px; background: #0a1117 url(http://ram.raritanassets.com/images/global/bg-intro_blog.jpg) center top no-repeat; } #Blog #Column1 .Spacer { padding-right: 20px; } #Blog #Column1 UL { list-style: disc; font-size: 14px; color: #000; margin: 15px 15px 10px 25px; } #Blog #Column1 UL OL, #Blog #Column1 UL UL { margin: 10px 0 0px; } #Blog #Column1 LI { font-size: 14px; color: #000; line-height: 1.35em; margin: 0 0 5px 0; } #Blog #Column1 LI LI { margin: 3px 0 0 25px; } #Blog H1 { font-size: 36px; } #Blog H1 A { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } #Blog H2 { font-size: 36px; } #Blog .BlogSocialNetworks A { float: right; } #Blog .BlogSocialNetworks .addthis_button_linkedin_counter, #Blog .BlogSocialNetworks .addthis_button_facebook_like { overflow:hidden; width: 55px !important; } #Blog .Comments .Author { margin: 30px 0 10px 0; } #Blog .Comments.odd .CommentText { padding: 20px; background-color: #E1E1E1; border: 1px solid #CCC; } #Blog .Comments.even .CommentText { padding: 20px; background-color: #F8F8F8;border: 1px solid #E1E1E1; } #Blog .Comments .CommentText P { margin: 0; padding: 0; } /* * How to Buy Specific Styles */ #HowtoBuy #Intro { height: 210px; background: #000 url(http://ram.raritanassets.com/images/global/bg-intro_how_to_buy.jpg) center top no-repeat; } #HowtoBuy .ThreeCol .Col1 .Spacer { padding-right: 30px; } #HowtoBuy .ThreeCol .Col2 .Spacer { padding: 0 30px; } #HowtoBuy .ThreeCol .Col3 .Spacer { padding: 0 0px 0 30px; } /* * Resources Specific Styles */ #Resources.Detail #Intro { height: 355px; } #Resources.TestDrives #Intro, #Resources #Intro { height: 210px; background: #e4e8f3 url(http://ram.raritanassets.com/images/global/bg-intro_case_studies.jpg) center top no-repeat; } #Resources .ListItem DL { margin: 0 0 0 15px; } #Resources.Detail .CaseSummary H5 { border-bottom: 1px solid #000; padding-bottom: 10px; margin-bottom: 10px; } #Resources.Detail .CaseDetail UL, #Resources.Detail .CaseSummary UL { list-style: disc; margin: 5px 0 15px 20px; color: #000; } #Resources.Detail .CaseSummary P { margin: 0 0 15px 0; } #Resources.Detail .CaseDetail LI, #Resources.Detail .CaseSummary LI { font-size: 14px; line-height: 1.25em; margin: 0 0 8px 0; } #Resources.CaseStudies.Detail #Intro { background-color: #4590d3; } #Resources.Detail H1 { font-size: 34px !important; } #Resources.Detail H2 { font-size: 28px !important; } #Resources.Detail H3 { font-size: 16px !important; } #Resources .CaseStudyPager A.TextLarge { text-transform: none; padding: 5px 10px; } #Resources.Videos .ListItem { margin: 0 0 25px 0; } #Resources.Videos .ListItem DL { } #Resources.Videos .ListItem DT { margin: 5px 0 5px 0; padding: 0; } #Resources .DataSheetSelector INPUT { padding: 10px; border: 1px solid #CCC; width: 100%; } #Resources .DataSheetSelector INPUT.Go { padding: 9px; width: auto !important; cursor: pointer; -webkit-padding-before:10px; -webkit-padding-end:10px; -webkit-padding-after:10px; -webkit-padding-start: 10px; background-color: #CCC; color: #FFF; border: 1px solid #CCC; } #Resources .DataSheetSelector INPUT.Go.Active { background-color: #4ea3e2; } #Resources .DataSheetSelector INPUT.Go:HOVER{ background-color: #FFF; color: #999; } #Resources .DataSheetSelector INPUT.Go.Active:HOVER { background-color: #000; color: #FFF; } #Resources .DataSheetSelector SELECT { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; font-size: 12px; width: 100%; margin-right: 3px; -webkit-appearance: none; -moz-appearance: none !important; appearance: none; padding: 9px; -webkit-padding-before:10px;-webkit-padding-end:10px; -webkit-padding-after:10px; -webkit-padding-start: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #e0e0e0; border-radius: 0; background: #e0e0e0 url(/assets/ram/images/global/btn-select_arrow_down.png) right no-repeat; } /* * Search Specific Styles */ #Search #Intro { height: 210px; background: #333333 no-repeat; } #Search .gcsc-branding { display: none !important; } #Search .gsc-control-cse,#Search .gsc-result,#Search .gsc-result-info { padding: 0 !important; } #Search .gsc-result-info-container, #Search TD { line-height: 1.35em !important; border: 1px solid #FFF !important; padding: 0 !Important; font-family: 'DIN Next W01 Light', Helvetica, Arial, sans-serif; font-size: 13px !important; } #Search .gs-title { font-size: 16px !Important; font-family: 'DIN Next W01 Light', Helvetica, Arial, sans-serif; text-decoration: none !important; color: #3d85c6 !important; font-style: normal; } #Search .gs-title:HOVER { color: #000 !important; } #Search .gs-image-box, .gsc-thumbnail { min-width: 200px !Important; } #Search .gs-image-box IMG { padding: 0 10px 10px 0; float: left; width: 180px !important; border: none !important; min-width: 180px !important; } #Search .gs-image, .gs-image IMG, .gsc-thumbnail IMG { float: left; border: none; width: 100% !important; height: auto !important; max-width: 180px; } #Search .gsc-branding { display: none !important; } /* Search Mobile and Desktop */ .SearchBox { display: block; right: 0px; top: 10px; border: 0px solid #FFF !important; padding: 0 !important; margin: 0; float: right; } .SearchInput { float: right; top: 58px; right: 0; border: 1px solid #FFF; position: absolute; } .SearchInput SPAN { display: none; } .SearchButton, .NavSearchButton { float: right; width: 1px; height: 1px; background: #FFF url(/assets/ram/images/global/icon-magnifying_glass.png) center top no-repeat; background-size: contain; padding: 25px 25px 0 0; } .SearchKeyword { width: 80%; float: left; padding: 5px; border: 1px solid #CCC; margin: 0 0px 0 0; } .NavSearchButton { float: right; width: 19%; padding: 30px 30px 0 0; } .LogoBrand { border: none !important; position: absolute; top: 35px; right: 15px; } /* * About Us Specific Styles */ #AboutUs H1 { font-size: 36px; } #AboutUs #Intro { background: #333; } #AboutUs #Intro H2 { text-shadow: 3px 3px 4px rgba(60, 60, 60, 0.75); } #AboutUs H3 { font-size: 24px; line-height: 1.30em; } #AboutUs.Page.Detail .News-Title {} #AboutUs.Page.Detail .News-Detail UL { list-style: disc; font-size: 14px; color: #000; margin: 15px 15px 15px 20px; } #AboutUs.Page.Detail .News-Detail LI { font-size: 14px; color: #000; line-height: 1.35em; margin: 0 0 10px 0; } #AboutUs .ListItem { margin: 0 0 15px 0; } #AboutUs .ListItem DL { margin: 5px 0 0 15px; } #AboutUs .ListItem DT { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; font-size: 14px; } #AboutUs .PressDetail TABLE { width: 100% !important; } #AboutUs .PressDetail TH, .PressDetail TD { width: 33.333%; } #AboutUs .PressDetail TH { text-align: center; border:1px solid #CCC; } #AboutUs .PressDetail TD { border: 1px solid #CCC; padding: 15px; } #AboutUs .PressDetail TD, .PressDetail TD P { font-size: 13px; line-height: 1.35em; margin: 0 0 15px 0; } #AboutUs .PressCategory { margin: 15px 0 0 0; padding: 0; } #AboutUs .PressTitle { margin: -10px 0 30px 0; padding: 0; line-height: 1.25em; } #AboutUs.Testimonials DL { padding: 15px 0 10px 20px; margin: 0; border: none; } #AboutUs.Testimonials .Quote-Logo { width: 100%; height: auto !important; margin: 10px auto; max-width: 200px; display: block; } #AboutUs.Testimonials DD H3 { font-size: 18px; } #AboutUs .Listing H3 { font-size: 14px !important; margin-bottom: 15px; } #AboutUs.Login #Intro { background: #333; } #AccountLogin { padding: 10px 15px; } #AccountLogin .Username, #AccountLogin .Password { padding: 6px; border: 1px solid #CCC; width: 100%; margin: 5px 0 5px 0; } #AccountCreate { padding: 10px 15px; } #AccountCreate UL { list-style: disc; margin: 0 0 20px 20px; padding: 0; } #AccountCreate LI { line-height: 1.2em; margin: 0 0 5px 0; } #Account #Intro { height: 210px; background: #333; } #Account .Photo { width: 100%; height: auto !important; margin: 0 0 15px 0; border: 0px solid #FFF; } #Account .Spacer { padding: 0 30px 0 0; } #Account.Videos .ListItem { margin: 0 0 25px 0; } #Account.Videos .ListItem DL { } #Account.Videos .ListItem DT { margin: 5px 0 5px 0; padding: 0; } #Account.Partners UL.Listing { color: #549eda; margin: 5px 0 20px 20px; } #Account.Partners UL.Listing LI { line-height: 1.25em; margin: 0 0 8px 0; } .EventTitle { color: #26618b; } .EventTitle:HOVER { color: #000; } .EventTitle A, .NewsTitle A{ color: #26618b; } .EventTitle A:HOVER, .NewsTitle A:HOVER { color: #000; } .JobListing UL { margin: 0 0 30px 0; } .JobListing A { color: #007bba; } .JobListing A:HOVER { color: #000; } .JobTitle { margin: 10px 0 0px; padding: 0; } .JobMeta { margin: 0 0 5px; padding: 0; } /* * Support Specific Styles */ #Support #Intro { height: 210px; background: #333333; } #Support .SupportButtonList LI { padding: 3px 10px 2px; display: block; font-size: 12px; margin: 0 0 6px 0; } #Support .SupportButtonList LI A { color: #10619f; } #Support .SupportButtonList LI A:HOVER { color: #000; } #Support .SupportButtonList LI .Remove { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; float: right; font-size: 10px; } #Support .ProductSelector { margin: 10px 0; } #Support .ProductSelector INPUT { padding: 10px; border: 1px solid #CCC; width: 30%; } #Support .ProductSelector INPUT.Go { padding: 9px; width: auto !important; cursor: pointer; -webkit-padding-before:10px; -webkit-padding-end:10px; -webkit-padding-after:10px; -webkit-padding-start: 10px; background-color: #CCC; color: #FFF; border: 1px solid #CCC; } #Support .ProductSelector INPUT.Go.Active { background-color: #4ea3e2; } #Support .ProductSelector INPUT.Go:HOVER{ background-color: #FFF; color: #999; } #Support .ProductSelector INPUT.Go.Active:HOVER { background-color: #000; color: #FFF; } #Support .ProductSelector SELECT { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; font-size: 12px; width: 25%; margin-right: 3px; -webkit-appearance: none; -moz-appearance: none !important; appearance: none; padding: 9px; -webkit-padding-before:10px;-webkit-padding-end:10px; -webkit-padding-after:10px; -webkit-padding-start: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #e0e0e0; border-radius: 0; background: #e0e0e0 url(/assets/ram/images/global/btn-select_arrow_down.png) right no-repeat; } #Support.Product .ProductSelector { margin: 0; } #Support.Product .ProductSelector INPUT { width: 83%; } #Support.Product .ProductSelector INPUT.Go { width: 20%; float: right; } #Support.Product .ProductSelector SELECT { width: 100%; margin: 0 0 8px 0; } #Support.Product .SupportDocument { margin: 0 0 15px 0; } #Support.Product .SupportDocument DT { font-size: 18px; margin: 0 0 3px 0; padding: 0; } #Support.Product .SupportDocument .Meta { font-style: italic; font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } #Support.Product .SupportDocument P { font-size: 12px; } #Support.Product .SupportDocument A { color: #10619f; font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } #Support.Product .SupportDocument A:HOVER { color: #000; } #Support.Product .SupportAssets LI { padding: 5px 0; border-top: 1px dotted #CCC; } #Support.Product .SupportAssets { margin-top: 5px; border-bottom: 1px dotted #CCC; } #Support .SelfService .Button { min-width: 50%; float: left; text-align: center; margin: 5px; } #Support .NotesFlag { display: inline; float: right; } #Support IMG.LanguageFlag { display: inline; float: right; height: 40%; width: 40%; max-width: 40% !important; } /* Why KVM Specific Style */ #KVMVideoArray .FourCols .Col1, #KVMVideoArray .FourCols .Col2, #KVMVideoArray .FourCols .Col3, #KVMVideoArray .FourCols .Col4 { display: inline-block; text-align: center; vertical-align: top; margin: 0 18px; } #KVMVideoArray .FourCols H5 { margin: 30px 0 15px 0; } .BgColorPick { background-color: #519048; } .ColorChooser LI { list-style: none; float: left; height: 43px; width: 43px; margin: 10px 10px 0 0; } .ColorChooser LI A { border: 2px solid #000; float: left; padding: 0; margin: 0px; height: 43px; width: 43px; } .ColorChooser LI.Active A { border: 5px solid #FFF; } .ColorChooser LI.Light.Active A { border: 5px solid #000; } .ColorChooser LI.BgRed { background-color: #ee1c25; } .ColorChooser LI.BgDrkBlue { background-color: #16115f; } .ColorChooser LI.BgGreen { background-color: #085238; } .ColorChooser LI.BgMagenta { background-color: #b86d9d; } .ColorChooser LI.BgOrange { background-color: #ee592b; } .ColorChooser LI.BgYellow { background-color: #fff56c; } .ColorChooser LI.BgBrown { background-color: #5a2900; } .ColorChooser LI.BgGray { background-color: #818284; } .ColorChooser LI.BgBlue { background-color: #0095da; } .BuyPromo { float: left; padding: 23px 0; background-color: #404040; } /* Partner Portal */ #Partners #Intro { height: 210px; background: #333333; } #Partners #Intro H2 { color: #FFF; } #Partners .Box { width: 50%; } .PartnerButtons LI { width: 48%; float: left; margin-bottom: 8px !important; padding: 0; } .PartnerButtons LI A { font-size: 14px !important; background-color: #61b0e6; color: #FFF; padding: 15px 0px 15px 62px !important; margin: 0 !important; float: left; width: 100%; } .PartnerButtons LI A:HOVER { background-color: #CCC !important; color: #000 !important; } .PartnerButtons li:nth-child(even) { float: left; } .PartnerButtons li:nth-child(odd) { float: right; margin-right: 10px; } .PartnerButtons .PartnerHome { display: none; } .PartnerButtons .Pricelist A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-pricelist.png) 10px 7px no-repeat; } .PartnerButtons .Toolkit A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-sales_toolkit.png) 10px 7px no-repeat; } .PartnerButtons .Registration A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-deal_registration.png) 10px 7px no-repeat; } .PartnerButtons .ProductSelector A, .PartnerButtons .Selector A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-product_selector.png) 10px 7px no-repeat; } .PartnerButtons .ImageLibrary A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-image_library.png) 10px 7px no-repeat; } .PartnerButtons .Training A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-training.png) 10px 7px no-repeat; } .PartnerButtons .Competitive A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-competitive_info.png) 10px 7px no-repeat; } .PartnerButtons .Logos A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-logos.png) 10px 7px no-repeat; } .PartnerButtons .MDF A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-mdf.png) 10px 7px no-repeat; } .PartnerButtons .Videos A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-videos.png) 10px 7px no-repeat; } .PartnerButtons .Resources A { background: #61b0e6 url(http://ram.raritanassets.com/images/global/btn-resources.png) 10px 7px no-repeat; } .Partners.Portal #LogoItems H6 { text-transform: uppercase; margin: 20px auto 10px auto; padding: 30px 0 0 0; } .Partners.Portal #LogoItems .TextSmall { font-size: 11px; margin-top: -45px; margin-right: 10px; text-align: right; float: right; } .Partners.Portal #LogoItems .TextSmall A { float: left; display: block; margin: 5px 3px 0 3px; color: #FFF; background-color: #e1e1e1; padding: 4px 7px; color: #666; border-radius: 5px; } .Partners.Portal #LogoItems .TextSmall A:HOVER { background-color: #5eace3; color: #FFF; } .Partners.Portal #LogoItems .LogoItem IMG { max-width: 300px; width: 70%; height: auto !important; } .Partners.Portal #LogoItems .LogoItem { display: table-cell !important; text-align: center; vertical-align: middle; height: 250px; width: 800px; } /* * Contact Us Specific Styles */ #Contact #Intro { height: 210px; background: #333333 no-repeat; } #Contact .Location-Map { display: block; clear: both; } #Contact .Location-Info { margin: 14px 0 25px 0; } /* * Popup Specific Styles */ .Overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(/assets/ram/images/global/bg-trans_black75.png); z-index: 9999999; } .PopUpContent {display: none; width: 90%; max-width: 800px; background-color: #FFF; -moz-box-shadow: 0 0 5px #000; -webkit-box-shadow: 0 0 5px#000; box-shadow: 0 0 5px #000; margin: 12% auto 0; border-radius: 4px;} .PopUp .Close { float: right; margin: 30px; opacity: 0.8; } .PopUp .Close:HOVER { opacity: 1; } /* * EE Composer Forms */ .ff_composer * { -webkit-box-sizing : border-box; -moz-box-sizing : border-box; box-sizing: border-box; } .ff_composer LABEL { font-weight: normal; } .ff_composer .line, .ff_composer .line:last-child, .ff_composer .last_unit{overflow:hidden;} .ff_composer .unit{float:left; padding: 0px 10px;} .ff_composer .unit_right{float:right;} .ff_composer .size1of1{float:none;} .ff_composer .size1of2{width:50%;} .ff_composer .size1of3{width:33.33333%;} .ff_composer .size2of3{width:66.66666%;} .ff_composer .size1of4{width:25%;} .ff_composer .size3of4{width:75%;} .ff_composer .line:last-child, .ff_composer .last_unit{float:none;width:auto;} .ff_composer p, .ff_composer h1, .ff_composer h2, .ff_composer h3, .ff_composer h4, .ff_composer h5, .ff_composer h6 {margin-top: 0;} .ff_composer .required_item {margin-left: 0px; color:red;} .ff_composer textarea, .ff_composer input[type="text"], .ff_composer input[type="email"], .ff_composer input[type="url"], .ff_composer input[type="number"], .ff_composer input[type="password"], .ff_composer input[type="search"] {width: 100%; padding: 10px; } .ff_composer ul.dynamic_recipients {list-style: none; padding:0;} .ff_composer input[type="submit"] { padding: 10px 30px; background-color: #999; color: #FFF; border: none; font-size: 18px; cursor: pointer; } .ff_composer input[type="submit"]:HOVER { background-color: #3d85c6; } .ff_composer .field_label { } .Form { margin: 10px 0 20px 0; } .Form LI { list-style: none; margin-left: 0; } .Form .field INPUT { width: 100%; padding: 0 10px; border: 1px solid #CCC; border-radius: 3px; } .Form .checkbox INPUT { border: 1px solid #CCC; border-radius: 3px; } .Form .textarea TEXTAREA { width: 100%; padding: 10px; border: 1px solid #CCC; border-radius: 3px; } .Form .field { padding: 5px 0 10px; } .Form .Button { margin: 15px 20px 15px 0; font-size: 14px; padding: 10px 30px; color: #FFF; cursor: pointer; border: none; } .Form .Button:HOVER { background-color: #000; color: #FFF; } .Form .ReadOnly { opacity: 0.8; color: #666; } .FormSelect { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; font-size: 12px; width: 100%; margin-right: 3px; -webkit-appearance: none; -moz-appearance: none !important; appearance: none; padding: 9px; -webkit-padding-before:10px;-webkit-padding-end:10px; -webkit-padding-after:10px; -webkit-padding-start: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #e0e0e0; border-radius: 0; background: #e0e0e0 url(http://ram.raritanassets.com/images/global/btn-select_arrow_down.png) right no-repeat; } .Captcha IMG { width: 100%; height: auto !important; margin-top: 4px; } INPUT.error { border: 1px solid #FF0000 !important; } INPUT.Go, INPUT.Button { padding: 5px 10px; width: auto !important; cursor: pointer; -webkit-padding-before:5px; -webkit-padding-end:10px; -webkit-padding-after:5px; -webkit-padding-start: 10px; color: #FFF; border: 1px solid #CCC; } INPUT.Go:HOVER,INPUT.Button:HOVER { } LABEL.error { display: none; } #SubmitSignup .field INPUT[type=text] { padding: 10px; font-size: 13px; } #SubmitSignup LI { padding: 0; margin: 0; } #SubmitSignup LI LABEL { margin: 10px 0 5px 0; } #SubmitSignup UL { margin: 0; padding: 0; } #SubmitSignup .Error { font-size: 12px; color: #FF0000; padding-left: 2px; } /* * Misc Styles */ .Meta { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } .Map { margin: 0 0 15px 0; } .BorderBottom { border-bottom: 1px solid #000; padding-bottom: 30px; margin-bottom: 30px; } .Box { padding: 15px; width: 24%; float: left; border: 1px solid #000; height: 100px; margin: 0 15px 15px 0; } .ProviderBoxes .Box { float: left; width: 33.33%; height: 200px; margin: 0; padding: 0; border: 5px solid #FFF; } .ProviderBoxes .Box .Card { min-height: 180px; margin: 5px; padding: 20px; display: block; -moz-box-shadow: 0 0 5px #CCC; -webkit-box-shadow: 0 0 5px#CCC; box-shadow: 0 0 5px #CCC; } .PartnerLogo { background-size: contain !Important; width: 100%; height: 85px; margin: 0 0 11px; } .PartnerLogo A { float: left; width: 100%; height: 100%; } .PartnerName { margin: 0; } .PartnerContact { margin-bottom: 0;padding-bottom: 0; } .Quote { border-top: 3px solid #e3f4fd; border-bottom: 3px solid #e3f4fd; padding-top: 15px; padding-bottom: 25px; margin-top: 5px; margin-bottom: 15px; } .Quote.Left { float: left; width: 49%; margin-right: 20px; } .Quote.Right{ float: right; text-align: right; width: 49%; margin-left: 20px; } .Quote DT { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; font-size: 18px; line-height: 1.5em; color: #007bba; } .Quote DD { font-size: 14px; line-height: 1.35em; color: #666; } .SocialNetworks { padding: 0 0 0px 0; margin: 0 0 0px 0; } .SocialNetworks LI { list-style: none; display: inline; margin-left: 0; } .SocialNetworks A { float: left; overflow: hidden; height: 1px; width: 1px; padding: 33px 31px 0 0 !important; margin-right: 6px !important; } .SocialNetworks A IMG { opacity: 1; } .SocialNetworks A:HOVER IMG { opacity: 1; } .SocialNetworks .LinkedIn A { background: url(/assets/ram/images/global/social-linkedin.png) top no-repeat; } .SocialNetworks .Youtube A { background: url(/assets/ram/images/global/social-youtube.png) top no-repeat; } .SocialNetworks .Twitter A { background: url(/assets/ram/images/global/social-twitter.png) top no-repeat; } .SocialNetworks .Facebook A { background: url(/assets/ram/images/global/social-facebook.png) top no-repeat; } .SocialNetworks .GooglePlus A { background: url(/assets/ram/images/global/social-googleplus.png) top no-repeat; } .SocialNetworks A:HOVER { background-position: bottom; } .SocialNetworks .addthis_toolbox A { width: 90px !Important; } .Bio { margin: 5px 0 20px 0; padding: 0 0 15px 0; } .Bio-Name {} .Bio-Position { display: block; clear: both; font-weight: normal; font-size: 15px; font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; margin: 5px 0 15px; } .Bio-Detail { font-size: 14px; line-height: 1.45em; margin: 0 0 30px 0; } .Image.Mobile { display: none; } .Image.Desktop { display: block; } .FAQ-Subnav LI { list-style: none; font-size: 23px; margin: 8px 0 0 0; padding: 0; } .FAQ-Listing { list-style: none; padding: 0px 0; margin: 30px 0; border-top: 1px dotted #ccc; } .FAQ-Listing LI { list-style: none; padding: 8px 0 8px; margin: 0; border-bottom: 1px dotted #ccc; } DL.Accordion { margin: 15px 0 0 0; padding: 0; } .Accordion DT A { color: #000; background: url(/assets/global/icon-arrow-right.gif) left no-repeat; padding: 0 0 3px 24px; } .Accordion DD { display: none; } .Accordion.Open DT A { background: url(/assets/global/icon-arrow-down.gif) left no-repeat; } .Accordion.Open DD { display: block; } .Accordion DT, .Accordion DD { font-size: 14px; } .Selector-Accordion UL { padding-left: 5px; } /* * H Tag Adjustments 8/17/2016 */ p.CTA-Title { font-size: 46px !important; } #OrderTracking #Intro { height: auto !important; background-image: none; padding: 5px 0; } #OrderTracking #Intro H2 { padding: 20px 0 0; margin: 0; } #OrderTracking #Intro P { font-size: 16px; } #OrderTracking .BorderBottom { padding-bottom: 10px; border-bottom: 1px solid #CCC; } #OrderTracking .Captcha { text-align: center; width: 100%; border-top: 1px solid #CCC; padding: 25px 0 0 0; margin-top: 1px; } #OrderTracking .Captcha * { display: inline; } #OrderTracking .OrderOption { overflow: hidden; display: inline-block; margin: 0px 5px -2px 0; padding: 2px; width: 20px; height: 20px; border-radius: 200px; border: 1px solid #BBB; } #OrderTracking .OrderOption SPAN { border-radius: 200px; background-color: #FFF; display: inline-block; width: 14px; height: 14px; float: left; } #OrderTracking .OrderOption:hover SPAN { background-color: #CCC; } #OrderTracking .OrderBox { padding: 20px 17px 1px 17px; margin: 0 0 5px 0; background-color: #eff5fa; border: 1px solid #eff5fa; } #OrderTracking .OrderBox.Disabled { opacity: 0.7; background-color: #CCC; } #OrderTracking .OrderBox.Disabled * { color: #888; } #OrderTracking .OrderBox.Disabled INPUT { background-color: #EEE; } #OrderTracking .OrderBox.Disabled .OrderOption:hover { background-color: #FFF; } #OrderTracking .OrderBox.Disabled .OrderOption:hover SPAN { background-color: #000; } #OrderTracking .OrderBox.Active { border: 1px solid #87b8e0; } #OrderTracking .OrderBox.Active .OrderOption SPAN { background-color: #87b8e0; } #OrderTracking .OrderBox .Form { margin-left: 31px; } #OrderTracking .OrderBox H4 { margin: 0px; padding: 0; } #OrderTracking .LookupOrder { display: none; text-transform: uppercase; padding: 18px 30px 13px; font-size: 24px; } #OrderTracking TABLE { } #OrderTracking THEAD { background-color: #EFEFEF; } #OrderTracking THEAD TH, #OrderTracking TBODY TD { color: #000; border: 1px solid #CCC; font-size: 13px; line-height: 1.25em; } #OrderTracking TBODY TR.even TD { background-color: #eff5fa; } #OrderTracking .Status { text-decoration: underline; z-index: 1; } #OrderTracking .Status .StatusPopup { display: none; } #OrderTracking .Status:hover { position: relative; } #OrderTracking .Status:hover .StatusPopup { -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black; z-index: 99999; display: block; position: absolute; top: 15px; margin-left: -10%; width: 300px; border: 1px solid #CCC; background-color: #EEE; color: #000; line-height: 1.25em; padding: 10px; } .TrackingNumbers P { padding: 0 0 10px 0; margin: 0; } .TrackingNumbers H4 { margin: 0; padding: 0; } #OrderTracking .NewOrderButton { font-weight: 600; padding: 10px 20px; float: right; margin-top: -50px; color: #5b96c2; text-transform: uppercase; background-color: #e5e5e5; } #OrderTracking .NewOrder { top: -10px; max-width: 960px; width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; display: none; position: absolute; background-color: #e5e5e5; } #OrderTracking .NewOrderContent { padding: 15px 15px 0 15px; } #OrderTracking .NewOrderButton .Button-Open { display: none; } #OrderTracking .NewOrderButton.Open .Button-Open { display: block; } #OrderTracking .NewOrderButton.Open .Button-Close { display: none; } #OrderTracking .NewOrderButton.Open .Button-Open EM { font-size: 28px; float: right; margin: 0 0 -2px 5px; } #OrderTracking .TrackingNumberList { margin: 0; padding: 0; list-style: none; } #OrderTracking .TrackingNumberList LI { list-style: none; padding: 0 0 5px 0; margin: 0; } #OrderTracking .TrackingNumberList A { text-decoration: underline; } #OrderTracking .OrderFlow { background-color: #2275b4; } #OrderTracking .OrderFlow * { color: #FFF; text-align: center; } #OrderTracking .OrderFlow SPAN { width: 100%; float: left; padding: 5px 3px 2px 3px; } #OrderTracking .OrderFlow .OrderLinks { font-size: 14px; margin: 0 0 0px 0; padding: 0 0 6px 0; } @media only screen and (max-width: 1090px) { .FourColButtons LI A { font-size: 16px; line-height: 1.3em; } #PDUPanel .row { width: 90%; margin: 0 auto; } #PDUPanel .PDUContainer { right: 20px; } #OrderTracking .Status:hover .StatusPopup { right: 0px; } } @media only screen and (max-width: 935px) { .MainNavigation LI { margin: 0 10px 0 0; padding-left: 0; } .MainNavigation LI A { font-size: 16px; margin: 0 0px 0 0 !Important; padding-right: 17px; } .MainNavigation LI.Dropdown A { padding-right: 18px !important; } #AwardsPanel .row { background-image: none !important; } .ThreeCol.Borders { background-image: none; } } @media only screen and (max-width: 903px) { #Masthead #NavRow .columns.nine { clear: none; overflow: hidden; width: 50%; float: left; } #PDUPanel .PDUContainer { max-width: 60%; right: 0; top: 10%; } .PartnerButtons LI A { font-size: 13px !important; } } @media only screen and (max-width: 875px) { .FourColButtons LI { width: 50%; font-size: 16px; } .MainNavigation LI A { font-size: 14px; margin: 0 0px 0 0 !Important; padding-right: 10px; } .NavCols A, .NavThreeCols .NavCols, .NavTwoCols .NavCols, .NavFourCols .NavCols { font-size: 11px; } } @media only screen and (max-width: 767px) { H1 { font-size: 35px; } H2 { font-size: 29px; } H3 { font-size: 21px; } H4 { font-size: 19px; } H5 { font-size: 15px; } H6 { font-size: 13px; } P { font-size: 12px; } #Column1 UL LI { font-size: 12px !important; } OL LI, UL LI { font-size: 12px !important; } .TextLarge { font-size: 14px !important; } .Pad10, .Pad15, .Pad20, .Pad30, .Pad40, .Pad50, .NoPad { padding: 0px; } #Resources .CaseStudyPager { display: none; } #SiteWrapper { overflow: hidden; width: 100%; } #SiteWrapper { padding-top: 0; } #SiteWrapper #Masthead { height: 100px; position: relative; float: left; width: 100%; padding: 0; margin: 0; } #SiteWrapper #Masthead #NavRow { margin-top: 0px; } #SiteWrapper #Masthead H1 { float: left; margin: 24px 0 0 0; padding: 0; } #PDUPanel .clearfix { display: block !important; height: 1px; } #PDUPanel .PDUContainer { position: relative; margin: 0 auto; max-width: 600px; width: 100%; float: none; } #Homepage .PDUFloat { position: relative; float: none; max-width: 600px; width: 100%; margin: -190px auto 90px auto; } #Homepage #FeatureKVM .KVMImage { margin: -130px auto 0; } #Products #Panel01 .RightImage { display: block; margin: 20px auto !important; float: none !important; position: relative; } #Products #Panel01 .TextCenter { display: none; } #Products #Sensor { border-top: 10px solid #fed23c; margin-top: 50px; } #Products #Sensor .columns { float: left !important; } #Products #Sensor .eight.columns { width: 75%; max-width: 80%; clear: none; float: left; } #Products #Sensor .four.columns .SensorImage { float: none; margin: 0 15px 0 15px !important; display: block; width: 80% !important; height: auto !important; } #Products #Sensor .four.columns { text-align: center !important; width: 25%; max-width: 20%; clear: none; float: left; } #Products #Sensor .BorderLeft { min-height: 0; border-left: 1px solid #CCC; padding-left: 25px; padding-bottom: 5px; } #Products #Sensor .BorderRight { min-height: 0; border-right: 1px solid #CCC; padding-right: 15px; padding-bottom: 5px; } #Products #Sensor .SensorBox.ContactClosure SPAN { top: 45px; left: -5px; width: 260px; } #Products #Sensor .SensorBox.ContactClosure SPAN { top: 45px; left: -5px; } #Products #Sensor .SensorBox.ContactClosure .SensorPanel { float: left; width: 100%; border: none; padding-bottom: 20px; background: url(http://ram.raritanassets.com/images/global/why-power-sensor_arrow_bottomleft.png) left bottom no-repeat; bottom: 55px; left: 0px; } #Products #Sensor .SensorBox.ContactClosure .SensorPanel .SensorContent { width: 470px; padding-bottom: 15px; } #Products #Sensor .SensorBox.ContactClosure .SensorPanel .SensorImage { margin-top: 0; } #Products #Sensor .SensorBox.AirFlow .SensorPanel .SensorContent { padding-bottom: 25px; } #Products.WhyKVM .ArrowDown { display: none; } #Products.WhyKVM .Wrapper * { text-align: center !important; } #Products.WhyKVM .Virtual .TopText { float: left; display: block; margin: 20% auto 0 !important; width: 100%; } #Products.WhyKVM .Virtual .BottomText { display: block; clear: both; float: none; margin: 0 auto; width: 100%; position: absolute; bottom: 10%; } #Products.WhyKVM .MoreInfo .Button { margin: 7px auto !important; } /* All Intros */ #Intro { height: auto !important; padding: 0px 0 0px; } #Intro H2, #Intro .PushDown110 { margin-top: 20px !important; font-size: 25px !important; padding: 30px 0 15px; } /* Homepage */ #Homepage .HeroSlider .PushDown { margin-top: 100px; } #Homepage .HeroSlider * { min-height: auto !important; height: auto !important; overflow: visible; background-image: none !important; } #Homepage .Hero H4 { margin-bottom: 20px; } #FeatureDCIM { float: left; width: 100%; clear: both; position: relative; display: block; } #FeatureDCIM .DCIMIpad { background-image: none !important; } #FeatureDCIM .DCIMLaptop { display: none; } #AwardsPanel .Image { margin: 0 0 20px 0; max-width: 240px; } #AwardsPanel .columns { text-align: center; margin: 0 auto 30px auto; } #AwardsPanel SPAN { float: none; clear: both; margin: 0 auto 15px !important; display: block; text-align: center; width: 100%; } #AwardsPanel P { margin: 0px auto; max-width: 500px; float: none; clear: both; } #AboutUs.Page .Shadow { float: none !important; display: inline-block; width: auto !important; } #AboutUs.Page .Shadow IMG { max-width: 200px; } /* SignUp */ #SignUpPromo *, #SignUpPromo .TextRight { text-align: center; } #SignUpPromo INPUT, #SignUpPromo A { position: relative; display: inline-block; float: none !important; height: 30px !important; display: inline-block; } .ProviderBoxes .Box { width: 50%; } /* Padding/Spacer Adjustments */ .TwoCol .columns { width: 100% !important; } .ThreeCol .Spacer { padding: 0 !important; } .ThreeCol { background-image: none !important; } .FiveCols { width: 100%; float: left; } .FiveCols .Spacer { padding: 10px 20px; } .FiveCols .Col1, .FiveCols .Col2, .FiveCols .Col3, .FiveCols .Col4, .FiveCols .Col5 { float: left; width: 100%; } .FourColButtons LI { width: 100%; } .FourColButtons LI A { padding: 10px 15px; min-height: auto !important; height: auto; } .Quote.Left, .Quote.Right { margin-left: 0; margin-right: 0; width: 100%; } .ListItem .Logo.Image.Shadow { text-align: center !important; } .ListItem .Logo.Image.Shadow IMG, .ListItem .Logo.Image.Shadow SPAN { display: inline-block; float: none; margin: 0 auto; } .ListItem .Logo.Image.Shadow SPAN { width: 100%; background-position: center; } .ListItem DL { margin: 0 !Important; } .Listing .ListingPhoto { margin: 0 20px 15px 0; } .Image.right, .Image.left { width: 100%; float: none; margin: 0px; padding: 0; } #Blog #Column1 .Spacer { padding-right: 0px; } #HowToBuy .ThreeCol IMG { display: block; clear: both; width: 100%; } #HowtoBuy .ThreeCol .Spacer { padding-left: 0px; } #Products .ProductImage { float: none; width: 100%; max-width: 100%; margin: 10px auto 0 !important; display: inline-block; clear: both; } #Products .ProductListingText { display: block; float: none; clear: both; width: 100%; font-size: 16px; margin: 0 auto 30px auto; } #Products .CTA-Excerpt { text-align: center; } #Products #ProductCalltoAction { clear: both; display: block; margin: 0 auto; float: left; width: 100% !important; } #Support .ProductSelector { margin: 0; } #Support.Product .ProductSelector INPUT, #Support .ProductSelector INPUT { width: 80%; } #Support.Product .ProductSelector INPUT.Go, #Support .ProductSelector INPUT.Go { width: 18% !important; float: right; } #Support .ProductSelector SELECT { width: 100%; margin: 0 0 8px 0; } #SubNav { padding: 0 0 0px 0; margin: 0 0 60px 0; clear: both; width: 100%; display: block; position: relative; } #SubNav .ButtonList { margin: 0 0px 0px 0; padding: 0 0 50px 0; float: left; width: 100%; } #SubNav .ButtonList A { display: none; float: left; width: 100%; } #SubNav .ButtonList A.Open { display: block; } #SubNav .ButtonList A.Selected { display: block; background: url(http://ram.raritanassets.com/images/global/btn-mobile_subnav.png) right center no-repeat; } #SubNav .Spacer { margin: 0 0 0 0px; } .mobile-hide { display:none; } .NavSearchButton { float: right; top: 0; position: absolute; top: 0px; margin: 0; } #FooterNav .two.columns { width: 25% !important; float: left !important; clear: none; } /* Mobile Navigation */ .NavProducts .NavTwoCols .NavCols { padding: 0px; } .NavProducts .NavOneCols .NavCols { padding: 0px; } .BuyPromo { display: none; } #MobileNav { display: block; float: right; position: absolute; right: 12px; top: 35px; width: 80px; } #MobileNav A.Pancake IMG { border: 1px solid #CCC; margin-right: 10px; } #MobileNavContent.Open H5 { float: left; width: 100%; padding: 0px !important; margin: 0 !important; } #MobileNavContent.Open H5 A { float: left; width: 100%; color: #000 !important; margin: 0 !important; font-size: 20px; padding: 12px 8px !important; width: 100%; line-height: 1; } #MobileNavContent.Open H5 A:HOVER { color: #000 !Important; background-color: #F1f1f1; } #MobileNavContent.Open { float: left; width: 100%; display: block; background-color: #FFF; padding-bottom: 25px; } #MobileNavContent.Open .NavPanels { background-color: #FFF; } #MobileNavContent.Open .NavPanel { display: none; padding-bottom: 15px; } #MobileNavContent.Open .NavPanel.Open { display: block !important; } #MobileNavContent.Open A { color: #FFF; } #MobileNavContent.Open .NavCols { border-bottom: 1px solid #EFEFEF; color: #666; } #MobileNavContent.Open .NavCols A { color: #000 !important; padding: 13px 8px 13px; width: 100%; } #MobileNavContent.Open .NavCols A:HOVER { background-color: #EFEFEF !important; color: #000; } #MobileNavContent.Open .clearfix { display: none !important; } #MobileNavContent.Open .NavItem { float: left; width: 100%; display: block; color: #000; font-size: 20px; line-height: 1; padding: 12px 8px !important; margin: 0;} #MobileNavContent.Open .NavItem:HOVER { color: #000; background-color: #F1f1f1; } #MobileNavSearch { position: relative; display: none; width: 100%; left: 0; background-color: #FFF; } #MobileNavSearch.Open { display: block; } #MobileNavSearch .SearchInput { position: relative; width: 100%; top: 0; background-color: #FFF; padding: 10px 20px 20px 20px; text-align: center; } #MobileNavSearch .SearchButton { background-position: left; float: left; margin: 0 0 0 10px; } #MobileNavSearch INPUT { float: left; width: 92%; padding: 6px !important; margin: 0 0 0 8px; } .NavCols A, .NavThreeCols .NavCols, .NavTwoCols .NavCols, .NavFourCols .NavCols { font-size: 14px; } /* Hide on Mobile */ #SiteWrapper #Masthead { background-image: none; } .UtilityNavigation, .MainNavigation, #Panels, #PanelSlide { display: none !important; } .Image.Mobile { display: block !important; margin: 20px auto 0; text-align: center; width: 100%; float: left; } .Image.Mobile A { width: 100%; float: left; } .Image.Mobile IMG { float: none; display: inline; width: 70%; margin: 0 auto; } .Image.Desktop { display: none; } .Mobile.PushDown { margin: 0; padding: 0; } #Homepage .HeroSlider #HeroPowerofColor .PushDown { margin-top: 8%; padding: 0; } #Homepage .HeroSlider #HeroPowerofColor .Image.Mobile { height: 140px !important; overflow: hidden; float: left; } #Homepage .HeroSlider #HeroPowerofColor .HeroContent { display: block; width: 100%; max-width: 350px; margin: 20px auto !important; padding: 170px 0 0; float: none; position: relative; } #Homepage .HeroSlider #HeroEbay .clearfix { height: 20px !important; } #Homepage .HeroSlider #HeroDCIM .Image.Mobile { margin-top: -20px; margin-bottom: -25px; } #Homepage .HeroSlider #HeroDCIM H3 { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } #Homepage .HeroSlider #HeroDCIM .PushDown { margin-top: 8% !important; padding: 0 !important; } #Homepage .HeroSlider #HeroDCIM .HeroContent { display: block; width: 100%; max-width: 350px; margin: 20px auto !important; padding: 170px 0 0; float: none; position: relative; } #Homepage .HeroSlider #HeroPassion .PushDown { margin-top: 6% !important; padding: 0 !important; } #Homepage .HeroSlider #HeroPassion A.Image.Mobile { float: left; width: 100%; position: relative; z-index: 1000; } #Homepage .HeroSlider #HeroPassion .Image.Mobile IMG { display: block; } #Homepage .HeroSlider #HeroPassion H3 { font-family:'DIN Next W01 Light', Helvetica, Arial, sans-serif; } #Homepage .HeroSlider #HeroPassion .HeroContent { display: block; width: 100%; max-width: 350px; margin: 20px auto !important; padding: 170px 0 0; float: none; position: relative; } #CaseStudyPanel .Image.Mobile IMG { margin-top: 30px; float: left; } #CaseStudyPanel { display: block; height: auto !important; max-height: auto !important; background-size: cover; } #CaseStudyPanel .Slide { height: 590px !important; max-height: auto !important; background-size: cover !important; display: block; } #CaseStudyPanel .CaseLogo.PushDown { margin-top: 1% !important; } #OrderTracking .OrderFlow { border-top: 10px solid #2275b4; } #OrderTracking .OrderFlow .OrderHeaders { display: none; } } @media only screen and (max-width: 600px) { .Overlay { position: absolute !important; width: 100%; top: 0px; float: left; height: 100%; } #MobileNavSearch INPUT { float: left; width: 87%; padding: 6px !important; } #FooterNav .two.columns{ width: 50% !important; } .Button { display: inline-block; margin: 0 auto; } #Homepage .HeroSlider #HeroDCIM .Image.Mobile { margin-top: 8%; margin-bottom: -25px; } #Homepage #PDUPanel .PDUContainer { right: 0; top: 40px; margin-top: 40px; max-height: 330px; float: left; } #Homepage .PDUFloat { margin-top: 10px !important; float: left; width: 100%; clear: both; } #Homepage #FeatureKVM, #Homepage #FeatureDCIM { display: block; position: relative !important; min-height: 480px !important; max-height: auto; height: auto !important; float: left; clear: both; margin: 0 auto; width: 100%; } #Homepage #FeatureDCIM .row, #Homepage #FeatureDCIM .columns { position: relative !important; float: left !important; margin: 0 !important; padding: 20px 10px !Important; width: 100%; clear: both; position: relative !Important; } #Homepage #AwardsPanel P { padding: 20px 0; } #Homepage #SignUpPromo { padding: 15px 30px; } #Homepage #SignUpPromo P { max-width: 300px; margin: 0 auto 15px; } #Homepage .Slide .six.columns.end .Popup { display: none !Important; opacity: 0; height: 1px; float: left; } /* Raritan Passion Slide */ #CaseStudyPanel .PushDown110 { margin: 0; padding: 50px 0 0 0; } .PartnerButtons LI { width: 100%; } .PartnerButtons li:nth-child(even) { float: left; } .PartnerButtons li:nth-child(odd) { float: left; margin-right: 0px; } .PartnerButtons LI A { font-size: 13px !important; } #Footer { position: relative; padding: 60px 0 20px 0; float: left; width: 100%; } #Footer * { text-align: center; } #FooterNav { display: none; } .SocialNetworks { float: none; width: 192px; display: inline-block; margin: 0 auto; } } @media only screen and (max-width: 480px) { #Homepage .HeroSlider #HeroDCIM .Image.Mobile { margin-top: 20%; margin-bottom: -25px; } #Homepage .HeroSlider #HeroPassion .Image.Mobile { margin-top: 20%; margin-bottom: 5px; } #FooterNav .two.columns{ width: 100% !important; } #MobileNavSearch INPUT { float: left; width: 83%; padding: 6px !important; } .ProviderBoxes .Box { width: 100%; } } /* Tooltips */ .ttip { position: relative; cursor: pointer; } .ttip:after { display: block; background: #3085d6; border: 1px solid #3085d6; border-bottom: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; padding: 0.5em 0.75em; width: auto; min-width: 130px; max-width: 500px; position: absolute; left: 0; bottom: 101%; margin-bottom: 8px; text-align: left; color: #fff; content: attr(data-tooltip); line-height: 1.5; font-size: 16px; font-weight: normal; font-style: normal; -webkit-transition: opacity 0.1s ease; -moz-transition: opacity 0.1s ease; -o-transition: opacity 0.1s ease; transition: opacity 0.1s ease; filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; pointer-events: none; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #65a4e1), color-stop(100%, #3085d6)); background-image: -webkit-linear-gradient(top, #65a4e1, #3085d6); background-image: -moz-linear-gradient(top, #65a4e1, #3085d6); background-image: -o-linear-gradient(top, #65a4e1, #3085d6); background-image: linear-gradient(top, #65a4e1, #3085d6); -webkit-box-shadow: 0 0 5px 0 rgba(48, 133, 214, 0.25); -moz-box-shadow: 0 0 5px 0 rgba(48, 133, 214, 0.25); box-shadow: 0 0 5px 0 rgba(48, 133, 214, 0.25); } .ttip:before { content: " "; width: 0; height: 0; position: absolute; bottom: 101%; left: 8px; border-top: 9px solid #3085d6 !important; border-left: 9px solid transparent; border-right: 9px solid transparent; -webkit-transition: opacity 0.1s ease; -moz-transition: opacity 0.1s ease; -o-transition: opacity 0.1s ease; transition: opacity 0.1s ease; filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; pointer-events: none; } .ttip:hover:after, .ttip:hover:before { -webkit-transition: opacity 0.1s ease; -moz-transition: opacity 0.1s ease; -o-transition: opacity 0.1s ease; transition: opacity 0.1s ease; filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; } @media only screen and (max-width: 768px) { .ttip:after, .ttip:before { display: none; } }