@charset "UTF-8";
@import "css/reset.css";
@import "css/forms.css";
/*
Theme Name: ICE Dental
Theme URI: http://ww2.icedentalsystems.com
Description: ICE Dental Systems Complete Dental Software
Version: 3
Author: Kevin Wick
*/

body { font: 100% "Myriad Pro", Helvetica, Arial, Verdana, sans-serif; background: #f7f7f7; text-align: center; color: #50565f; }
#container { width: 1007px; margin: 0 auto; text-align: left; }
#header { position: relative; height: 120px; width: 1007px; background:url(images/flashTopper.gif) bottom left no-repeat; z-index: 1; }
.logo { position: absolute; top: 5px; left: 10px;  }
.Welcome #mainContent { padding: 0 20px; background: #FFFFFF; }
#footer { padding: 0 20px 0 20px; font-size: 11px; background: url(images/contentMainPagesBG.gif) top left repeat-y;}
ul.footerLinks {list-style-image:none; list-style-position:outside; list-style-type:none; margin: 0; padding: 0;}
#footer ul.footerLinks li ul li {font-size:12px; line-height:18px; margin: 0; float: none;}
#footer ul.footerLinks li {margin: 5px 0 5px 40px; float: left;}
#footer ul li a{padding:4px 0 8px 0;}
/*#colorFooter {background: url(images/footercolor.jpg) top center no-repeat;}*/
#footer #footerInformation {float: right; text-align: right; margin: 0 20px 0 0;}
#footer h2 {padding: 0; }
#footer p { padding: 10px 0; }
a { color:#67bcf2; text-decoration: none; }
.Welcome #flashArea { background:url(images/flashArea.gif) top left no-repeat; position: relative; width: 1007px; height: 405px;  }
.Welcome #flashAbsPosition {position: absolute; top: 0; left: 26px;  }
.Welcome #mainContentArea { width: 1007px; height: 214px; position: relative; }
.Welcome #mainContentArea h1 { color: #7386a0; font-weight: normal; letter-spacing: 0px; font-size: 17px; line-height: 22px; padding: 3px 0px 3px 0px; border:none; }
.Welcome .one ul {list-style-position: outside; padding: 0px 0px 0px 15px; font-size: 13px; color: #838383; list-style-type: circle;}
.Welcome .one li {padding: 2px 0px;}
.Welcome #mainContentArea p { font-size: 14px; line-height: 19px; padding-bottom: 10px; margin: 0 10px; color: #838383; }
.Welcome .contentBlock { position: absolute; background: url(images/whiteContentBox.gif) top left no-repeat; height: 214px; width: 319px; }
.Welcome .one { top: 0px; left: 0px; padding: 21px 0 0 21px; height: 193px; width: 298px; }
.Welcome .two { top: 0px; left: 345px; padding: 21px 0 0 21px; height: 193px; width: 298px; }
.Welcome .three { top: 0px; right: 0px; }
.phoneNumber {padding: 10px 0;}
.borderBottom { border-bottom: 1px solid #CCC; }
#ContentMainTopper {background: url(images/headerForFooter.gif) top left no-repeat; width:1007px; height:22px;}
#ContentMainFooter {background: url(images/footerForFooter.gif) top left no-repeat; width:1007px; height:25px;}
#ContentMainSection {background: url(images/contentMainPagesBG.gif) top left repeat-y; padding: 0 30px;}
#ContentMainSection p {margin-top: 10px; color: #838383; line-height: 19px; font-size: 14px; }
#ContentMainSection ul,ol {list-style-position: outside; padding: 0px 0px 0px 30px; font-size: 14px; color: #838383;}
#ContentMainSection ul {list-style-type: circle;}
#ContentMainSection ol {list-style-type: upper-roman;}
#ContentMainSection li {padding: 3px 0px;}
#ContentMainSection .testimonials ul {list-style-type: none; padding: 0; margin: 15px 15px 0 15px;}
.testimonials ul li{cursor:pointer; padding:20px 10px 20px 20px;  background: #ECF3F6; border-bottom:  1px dotted #67bcf2;}
.testimonials ul li.even {background:#FFFFFF;}
.testimonials .testimonial-image {-moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px; background-color:#FFFFFF; border:1px solid #E0E4EA; float:left; height:160px; margin:10px 8px; overflow:hidden; position:relative; width:228px; display: block;}
.testimonials .testimonial-text {float:right; width:625px; padding: 20px 20px 0 0;}
.content_block {width: 90%; margin-bottom: 8px; padding: 10px; border-bottom: 1px solid #ccc; min-height: 160px;}
.content_block img {margin-right: 10px; margin-bottom: 5px; text-align: left; float: left; padding: 0;}
.cont-blck-title {font-size: 20px; font-weight: bold; color:#465f75; margin: 0; padding: 0;}
.fltrt { float: right; margin-left: 8px; }
.fltlft { float: left; margin-right: 8px; }
.clearfloat {clear:both; height:0; font-size: 1px; line-height: 0px; }
.pageFeature {background: #f7f7f7; border: 1px dotted #67bcf2; padding: 0 0 10px 15px; }
#ContentMainSectionFooter {background: url(images/contentMainFooterBG.gif) top left no-repeat; width:1007px; height:37px;}
h1 {padding: 10px 0px 6px 0px; font-size: 24px; line-height: 22px; letter-spacing: 1px; font-weight: bold; color: #8abbd7; width: 100%; border-bottom: 1px solid #e0e4ea;}
h2 {font-size: 18px; color: #e686aa; padding: 20px 0px 0px 0px;}
h3 {font-size: 16px; color: #e686aa;}
h4 {font-size: 16px; color: #838383; margin: 10px 0 0 0; padding: 10px 0px 10px 0px; background-color:#f7f7f7;}
.portfolio {width: 600px; margin: 0px auto;}
.portfolio img{padding: 1px; border: 1px solid #666666; float: left; margin: 0 6px 6px 0;}
.portfolio p {margin: 5px 0 0 0;}
.IphonePortfolio {width: 800px; margin: 0px auto; }
.IphonePortfolio img{padding: 1px; border: 1px solid #666666; float: left; margin: 0 6px 6px 0;}
.IphonePortfolio p {margin: 5px 0 0 0;}
.newPortfolio {background-color:#FFFFFF; height:190px; margin:10px 18px 8px 0; overflow:hidden; width:228px; position: relative; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px; border:1px solid #e0e4ea; float: left;}
.noMargin {margin: 10px 0 8px 0;}
.siteLink {top: 170px; left: 10px; position: absolute;}
.newPortfolio img, .testimonials img {top: 10px; left:10px; position: absolute; border:1px solid #E8E8E8; padding:3px;}
.newPortfolio h3 {font-size: 12px; top: 155px; left: 10px; position: absolute; font-weight: normal;}
#galleryContainer {margin: 0 0 0 90px;}
#Blog .content_body {float: left; width: 613px;}
#Blog .content_body .postInformation {font-size: 12px; border-bottom: 1px dotted #E8E8E8; width: 100%; margin: 10px 0;}
#Blog .content_body p {line-height: 19px; margin: 10px 0 0 0;}
#Blog p {margin-right: 360px;}
#Blog .content_body h2 {font-size: 21px;}
#Blog .content_body .meta {margin-bottom: 15px;}
#Blog .post-image {border: 1px solid #E8E8E8; background: #f7f7f7; padding: 5px; }
#Blog .more, .browse_entries .p a, .browse_entries .m a {background: url(images/iceBlogBtn.gif) top left repeat-x; display:block; height:25px; line-height:25px; text-align:center; text-decoration:none; width:120px; color: #ffffff; border: 1px solid #E8E8E8; overflow: hidden;}
#sidebar {float: right;  width: 220px; margin: 65px 0 0 0; padding: 0 40px 0 40px; background: url(images/sidebar.jpg) top left no-repeat; min-height: 547px;}
#sidebar ul{list-style-image:none; list-style-position:outside; list-style-type:none; margin: 15px 0 0 0; padding: 0; }
#sidebar ul li {border-bottom: 1px solid #e0e4ea;}
#sidebar ul li a{padding:4px 0 8px 20px; background: url(images/arrowlist.jpg) left 3px no-repeat;}
#sidebar ul #categories-3, #sidebar ul #archives-3 {border-bottom: none;}
#sidebar ul .cat-item-3, #sidebar #archives-3 li {border-top: 1px solid #e0e4ea; }
.clearleft {clear: left;}
.one h2 {padding: 0;}
#copyright {text-align: center; width: 100%; font-size: 11px;}

.browse_entries .m a, .browse_entries .p a {width: 170px;}
.browse_entries .m a {margin: 10px 0 0 440px; }
.tweet .tweet_list, .query .tweet_list { -webkit-border-radius: .5em; list-style-position: outside; padding: 15px 20px 0px 20px; font-size: 12px; color: #838383; }
.tweet .tweet_list .awesome, .tweet .tweet_list .epic, .query .tweet_list .awesome, .query .tweet_list .epic { text-transform: uppercase; }
.tweet .tweet_list li, .query .tweet_list li { overflow-y: auto; overflow-x: hidden; margin: 5px 0px; border-bottom: 1px solid #e0e4ea; }
.tweet .tweet_list .tweet_avatar, .query .tweet_list .tweet_avatar { padding-right: .5em; float: left; }
.tweet .tweet_list .tweet_avatar img, .query .tweet_list .tweet_avatar img { vertical-align: middle; }
img.tweetBird   {position: absolute; top: 155px; right: 20px;}
.Welcome .three h2 {position: absolute; top: 155px; left: 20px;}
/****************jQuery Menu*****************/
.jqueryslidemenu { position: absolute; top:7px; right:0px; z-index: 3; }

.jqueryslidemenu ul { list-style-type: none; height: 43px; }
/*Top level list items*/
.jqueryslidemenu ul li { position: relative; display: inline; float: left; }
/*Top level menu link items style*/

.jqueryslidemenu ul li a {font-size:14px;  border-left: 1px solid #e0e4ea; display: block; color: white; padding: 2px 10px 2px 10px; color: #2d2b2b; text-decoration: none;}
* html .jqueryslidemenu ul li a { /*IE6 hack to get sub menu links to behave correctly*/ display: inline-block; }
.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited { color: #7386a0; }
.jqueryslidemenu ul li a:hover { color: #7386a0; background-color:#FFF; }
/*1st sub level menu*/
.jqueryslidemenu ul li ul { position: absolute; right: 0; display: block; visibility: hidden; }
/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li { display: list-item; float: none; }
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul { top: 0; }
/* Sub level menu links style */
.jqueryslidemenu ul li ul li a { width: 160px; /*width of sub menus*/ padding: 4px; margin: 0; background-color:#FFF; }
.jqueryslidemenu .login-ul li a { width: 160px; /*width of sub menus*/ padding: 4px; margin: 0; }
.jqueryslidemenu ul li ul li a:hover { /*sub menus hover style*/ background: #eff9ff; color: black; }
/* ######### CSS classes applied to down and right arrow images  ######### */
.downarrowclass { position: absolute; top: 6px; right: 5px; }
.jqueryslidemenu  a.support{border: none;}
.rightarrowclass { position: absolute; top: 6px; right: 5px; }


/****************** BLOG SECTION ******************/

.blog_entry {border-bottom: 1px solid #e0e4ea; }




/****************** TABBED MAIN MENU (NOT WHY ICE TABBED PANELS) *******************/

/*-----------------------------------------------------------------------------

Define the width of the nav div

-----------------------------------------------------------------------------*/

#nav { width:581px; height: 36px; position: absolute; bottom:16px; right:0px; z-index: 2;  }
#nav ul { list-style:none; width: 581px; height: 36px; }
#nav li { list-style: none; display: inline; text-align: center; }
#nav li a { text-decoration: none; display:block; float:left; background: url(images/tabsAdjust.png) no-repeat; text-indent:-9999px; }

/*-----------------------------------------------------------------------------

Define the width of each li item. This is used as a letter box to show the 
correct part of the background image

-----------------------------------------------------------------------------*/	
	
	
li#home a { width:132px; height:36px; }
li#about a { width:112px; height:36px; }
li#why-ice a { width:111px; height:36px; }
li#features a { width:111px; height:36px; }
li#move-to-ice a { width:115px; height:36px; }
/*-----------------------------------------------------------------------------

Position the background image within the left boxes we have created. Use hover states
to show the correct background position for hover states.

A negative margin is used to show the whole tab. As this doesn't work in IE a 
separate stylesheet is used for IE6 and below.

New Full width in PSD file : Then figure out 

-----------------------------------------------------------------------------*/	


li#home a:link, li#home a:visited { background-position: -0px -0px; }
li#home a:hover, li#home a:focus { background-position: 0px -36px; }
li#about a:link, li#about a:visited { background-position: -132px 0px; }
li#about a:hover, li#about a:focus { background-position: -117px -108px; width: 127px; margin-left: -15px; }
li#why-ice a:link, li#why-ice a:visited { background-position: -244px 0px; }
li#why-ice a:hover, li#why-ice a:focus { background-position: -229px -216px; width: 126px; margin-left: -15px; }
li#features a:link, li#features a:visited { background-position: -355px 0px; }
li#features a:hover, li#features a:focus { background-position: -338px -324px; width: 128px; margin-left: -17px; }
li#move-to-ice a:link, li#move-to-ice a:visited { background-position: -466px 0px; }
li#move-to-ice a:hover, li#move-to-ice a:focus { background-position: -446px -432px; width: 135px; margin-left: -20px; }
/*-----------------------------------------------------------------------------

Set the on states using the body id.

-----------------------------------------------------------------------------*/	

body.Welcome li#home a:link, body.Welcome li#home a:visited { background-position: -1px -36px; }
body.Welcome li#about a:hover, body.Welcome li#about a:focus { background-position: -117px -72px; width: 127px; margin-left: -15px; }
body.About_Us li#about a:link, body.About_Us li#about a:visited { background-position: -117px -108px; width: 127px; margin-left: -15px; }
body.About_Us li#home a:hover, body.About_Us li#home a:focus { background-position: -0px -144px; overflow: auto; position: relative; }
body.About_Us li#why-ice a:hover, body#About_Us li#why-ice a:focus { background-position: -225px -180px; width: 130px; margin-left: -19px; }
body.Why_ICE li#why-ice a:link, body.Why_ICE li#why-ice a:visited { background-position: -225px -216px; width: 130px; margin-left: -19px; }
body.Why_ICE li#about a:hover, body.Why_ICE li#about a:focus { background-position: -117px -252px; width: 127px; margin-left: -15px; overflow: auto; position: relative; }
body.Why_ICE li#features a:hover, body.Why_ICE li#features a:focus { background-position: -334px -288px; width: 132px; margin-left: -21px; position: relative; }
body.Features li#features a:link, body.Features li#features a:visited { background-position: -334px -324px; width: 132px; margin-left: -21px; }
body.Features li#why-ice a:hover, body.Features li#why-ice a:focus { background-position: -225px -360px; width: 130px; margin-left: -19px; overflow: auto; position: relative; }
body.Features li#move-to-ice a:hover, body.Features li#move-to-ice a:focus { background-position: -444px -396px; width: 137px; margin-left: -22px; overflow: auto; position: relative; }
body.Blog li#move-to-ice a:link, body.Blog li#move-to-ice a:visited { background-position: -444px -432px; width: 137px; margin-left: -22px; }
body.Blog li#features a:hover, body.Blog li#features a:focus { background-position: -334px -468px; width: 132px; margin-left: -21px; overflow: auto; position: relative; }


/*-----------------SLIDER FOR FEATURES IDEA FROM Chris Coyier: http://css-tricks.com-------------------*/

#anythingSlider                         { width: 860px; height: 460px; position: relative; margin: 20px auto 15px; }
#anythingSlider .wrapper                { width: 780px; overflow: auto; height: 441px; margin: 0 40px; position: absolute; top: 0; left: 0; }
#anythingSlider .wrapper ul             { width: 99999px; list-style: none; position: absolute; top: 0; left: 0; background: #eee;   margin: 0; padding: 0; border-top: 2px solid #bce1ec; border-bottom: 2px solid #bce1ec; }
#anythingSlider ul li                   { display: block; float: left; padding: 0; height: 417px; width: 780px; margin: 0; }
#anythingSlider .arrow                  { display: block; height: 200px; width: 67px; background: url(images/arrows.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 115px; cursor: pointer; }
#anythingSlider .forward                { background-position: 0 0; right: -20px; }
#anythingSlider .back                   { background-position: -67px 0; left: -20px; }
#anythingSlider .forward:hover          { background-position: 0 -200px; }
#anythingSlider .back:hover             { background-position: -67px -200px; }

#thumbNav                               { position: relative; top: 417px; text-align: center; }
#thumbNav a                             { color: black; font: 11px/18px Georgia, Serif; display: inline-block; padding: 2px 8px; height: 18px; margin: 0 5px 0 0; background: #bce2ee url(images/cellshade.png) repeat-x; text-align: center; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; }
#thumbNav a:hover                       { background-image: none; }
#thumbNav a.cur                         { background: #728eb8; }

#start-stop                             { background: #bce1ec; background-image: url(images/cellshade.png); background-repeat: repeat-x; color: white; padding: 2px 5px; width: 130px; text-align: center; position: absolute; right: 45px; top: 421px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; }
#start-stop.playing                     { background-color: #bce1ec; }
#start-stop:hover                       { background-image: none; }

/*
  Prevents
*/
#anythingSlider .wrapper ul ul          { position: static; margin: 0; background: none; overflow: visible; width: auto; border: 0; }
#anythingSlider .wrapper ul ul li       { float: none; height: auto; width: auto; background: none; }


/*------------------ TABBED CONTENT FOR WHY ICE---------------*/
#tabSection {display: block; float: left;}
#tabSection ul.tabs { margin: 20px 0 0 0; padding: 0; float: left; list-style: none; height: 32px; /*--Set height of tabs--*/ border-bottom: 1px solid #e0e4ea; border-left: 1px solid #e0e4ea; width: 100%; }
#tabSection ul.tabs li { float: left; margin: 0; padding: 0; height: 31px; /*--Subtract 1px from the height of the unordered list--*/ line-height: 31px; /*--Vertically aligns the text within the tab--*/ border: 1px solid #e0e4ea; border-left: none; margin-bottom: -1px; /*--Pull the list item down 1px--*/ overflow: hidden; position: relative; background: #e0e0e0; }
#tabSection ul.tabs li a { text-decoration: none; color: #7386a0; display: block; font-size: 1em; padding: 0 10px; border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/ outline: none; }
#tabSection ul.tabs li a:hover { background: #ccc; }
html #tabSection ul.tabs li.active, html #tabSection ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/ background: #fff; border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/ }
#tabSection .tab_container { border: 1px solid #e0e4ea; border-top: none; overflow: hidden; clear: both; float: left; width: 100%; background: #fff; }
#tabSection .tab_content { padding: 20px; font-size: 1.2em; width: 900px; }
