/**   Styles for "Screen" Media
*     File: styles.css
*     Author: Nate Hanna
*     Auth Web: http://www.mediasation.com
*     modified: 2009-07-10
* --------------------------------------------------------------
**/

/** Element/Global Styles (including Typography)
-------------------------- **/
html { 
   font-size: 62.5%; /* about 10px if browser size is set at default (16px) */
   font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
}
body {}
a { text-decoration: underline; }
   a:hover { text-decoration: none; }
   a img { border: 0; }

   .content h1, .content h2, .content h3, .content h4, .content h5, .content h6 {
      line-height: 1.25em;
      font-weight: normal;
      margin: 0 0 0.3em 0;
   }
      .content h1 { font-size: 1.8em; }
      .content h2 { font-size: 1.5em; }
      .content h3 { font-size: 1.4em; }
      .content h4 { font-size: 1.2em; }
      .content h5 { font-size: 1.0em; }
      .content h6 { font-size: 0.9em; }
      
   #mainContent h3 { clear: both; }

div.hr {
   height: 1px;
   margin: 0.8em 0;
   background: transparent no-repeat scroll center;
}
   div.hr hr {
      display: none;
   }

#wrapper {
   position: relative;
   width: 950px;
   margin: 20px auto;
   background-color: #FFF;
   border: 5px solid #FFF;
}

pre { color: #000; }


/** Header
-------------------------- **/
/** @group header */
#header { position: relative; }
#header #banner { height: 103px; }
#header #pagetitle {
   position: absolute;
   top: 35px;
   left: 20px;
   font-size: 2.8em;
}
#header #masthead a#logoLink, 
#header #masthead a#logoLink:visited
{
   position: absolute;
   display: block;
   background: url('../img/logo_quarterbackOfLife.png') 0 0 no-repeat;
   text-indent: -10000px;
   width: 220px;
   height: 53px;
   text-decoration: none;
   overflow: hidden;
   z-index: 5;
   top: 18px;
   right: 5px;
}
#header div#logouthead 
{
   position: absolute;
   display: block;
   background: none; 
   text-indent: 0px;
   width: 250px;
   height: 30px;
   text-decoration: none;
   overflow: hidden;
   z-index: 5;
   top: 115px;
   right: 8px;
    font-size: 1.1em;
    color: #69563A;
    text-align: right;
}
#header div#logouthead a {
   color: #69563A;
   text-decoration: underline;
}
/** @group optionsBar */
#optionsBar {
   background: #FFF url('../img/bg_nav_gradient.gif') left top repeat-y;
   /** height: 32px; */
   border-bottom: 1px solid #D3D3D1;
   font-size: 1.2em;
}
/** @group date */
#date {
   display: none;
   width: 105px;
   float: left;
   padding: 8px 3px;
   font-weight: bold;
   text-align: center;
}
/* @end date **/

/** @group topNavigation */
#topNavigation {
   /** height: 31px; */
   overflow: hidden;
   border-top: 1px solid #FFF;
}
   #topNavigation ul {}
   #topNavigation ul li { display: inline; }
      #topNavigation ul li a {
         display: block;
         float: left;
/*         color: #695639;*/
         text-decoration: none;
         padding: 8px 10px 9px;
         font-size: 1.2em;
         border-right: 1px solid #CCC;
      }
         #topNavigation ul li a:hover { text-decoration: underline; }
         #topNavigation ul li.selected a {
            background: url('../img/bg_nav-arrow.png') center bottom no-repeat;
            font-weight: bold;
            color: #FFF;
         }
         
   #topNavigation ul.subnav { 
      clear: left;
      border-top: 1px solid #CCC;
   }
      ul.page_menu {
         list-style: none;
         border-bottom: 1px solid #CCC;
         margin: -5px -5px 0;
         padding: 0;
      }
   #topNavigation ul.subnav li, ul.page_menu li  { display: inline; }
      #topNavigation ul.subnav li a,
      ul.page_menu li a {
         display: block;
         float: left;
         text-decoration: none;
         padding: 4px 5px;
         font-size: 1em;
      }
      ul.page_menu li a { border-right:1px solid #CCC; padding: 6px 8px; }
         #topNavigation ul.subnav li a:hover,
         ul.page_menu li a:hover { text-decoration: underline; }
         #topNavigation ul.subnav li.selected a {
               background: none;
               font-weight: bold;
               text-decoration: underline;
            }
          
   #topNavigation ul.tier3 { 
      clear: left;
      border-top: 1px solid #CCC;
      }      
   #topNavigation ul.tier3 li { display: inline; font-size: 11px;}
      #topNavigation ul.tier3 li a {
         display: block;
         float: left;
         text-decoration: none;
         padding: 4px 5px;
         font-size: 1em;
      }
         #topNavigation ul.tier3 li a:hover { text-decoration: underline; }
         #topNavigation ul.tier3 li.selected a {
               background: none;
               font-weight: bold;
               text-decoration: underline;
         } 
                          
/* @end topNavigation **/
/** @group search */
#search {
   position: absolute;
   right: 8px;
   bottom: 6px;
}
   #search label { padding-right: 5px;}
   #search input {
      background-color: #FFF;
      border: 1px solid #D3D3D1;
      padding: 3px;
      width: 100px;
   }
   #search button {
      background-color: #695639;
      text-indent: -10000px;
      overflow: hidden;
      width: 20px;
      height: 21px;
      border: 0;
      margin-left: 3px;
      cursor: pointer;
      cursor: hand;
   }
/* @end search **/
/* @end optionsBar **/
/* @end header **/

/** @group flashMessage */
#flashMessage {
   margin-top: 15px;
   font-size: 1.2em;
   font-weight: bold;
   padding: 0.5em 0.8em;
   border: 2px solid #000;
}
#flashMessage.message {
   background-color: #8aab47;
   color: #fdfcf8;
   border-color: #64821e;
}
   #flashMessage.error {
      border-color: #8D1C1C;
      background-color: #8D1C1C;
      color: #FFF;
   }
/* @end flashMessage **/


/** ContentWrapper
-------------------------- **/
/** @group contentWrapper */
#contentWrapper { 
   font-size: 1.2em; 
   margin-top: 15px;
   min-height: 200px; 
}
   .content h1.slogan {
      font-size: 3.4em;
      line-height: 0.85em;
      text-transform: uppercase;
      font-weight: bold;
      padding-bottom: 0.2em;
      margin-bottom: 0.2em;
      border-bottom-width: 14px;
      border-bottom-style: solid;
   }
/** @group leftCol */
#leftCol {
   width: 263px;
   float: left;
   padding: 0 7px 0 5px;
}
      /*#leftCol h1 {
               font-size: 3.4em;
               line-height: 0.85em;
               text-transform: uppercase;
               font-weight: bold;
               padding-bottom: 0.2em;
               border-bottom-width: 14px;
               border-bottom-style: solid;
            }*/
/* @end leftCol **/
/** @group midCol */
#midCol {
   width: 479px;
   float: left;
}
/* @end midCol **/

/** @group rightCol */
#rightCol {
   width: 675px;
   float: right;
}
   .qbol #rightCol { width: 188px; }
      .qbol #video_list { height: 435px; overflow: auto; padding-bottom: 8px; }
      .qbol .video { float: left; margin-left: 8px; margin-bottom: 4px; }
/** @group hightlight */
#hightlight {}
.home #lead_img {
   width: 406px;
   float: left;
}
.home #qbl_stories {
   width: 260px;
   float: right;
   margin-bottom: 7px;
}
/* @end hightlight **/
/** @group mainContent */
#mainContent { min-height: 200px; }
/** @group think_tool */
.home .think_tool {
   width: 193px;
   float: left;
   position: relative;
}
/*   .think_tool div#think_hover div { 
      background: #FFF;
      border-color: #D3D3D1;
      color:#695639; 
   }
.think_tool div#think_hover {
   float: right;
}
.think_tool div#think_hover div {
   /*position: absolute;
      top: 0;
      z-index: 2;
      left: 200px;/
   width: 464px;
   min-height: 120px;
   height: 90%;
   border-width: 1px;
   border-style: solid;
   font-size:1.1em;
   padding:8px 5px;
}
.think_tool div#think_hover div#stones {
   height: 180px;
}*/
   .home .think_tool  h4 {
      font-weight: bold;
      font-size: 1.2em;
      padding: 8px 5px;
   }
      #student.home .think_tool ul { 
         background: transparent url("/img/bg_stop_base.jpg") left top no-repeat;
         list-style: none;
         margin: 0;
         padding: 6px 0 2px 0;
      }
         #student.home .think_tool ul li {
            margin: 0;
            padding-bottom: 2px; 
         }
            #student.home .think_tool ul li a {
               display: block;
               padding: 14px 10px;
               padding-left: 67px;
               height: 17px;
               overflow: hidden;
               text-transform: uppercase;
               text-decoration: none;
               font-weight: bold;
               background-color: transparent;
               background-position: 0 0;
               background-repeat: no-repeat;
            }
               .home #think_tool_teacher.think_tool ul li a { display: block; }
            #student.home .think_tool ul li.selected a { 
               background-position: 0 -45px;
               padding-left: 34px;
               padding-right: 43px;
               text-align: right;
            }
               #student.home .think_tool ul li.stop a { background-image: url("/img/bg_stop-icon_red.jpg"); }
               #student.home .think_tool ul li.think a { background-image: url("/img/bg_stop-icon_yellow.jpg"); }
               #student.home .think_tool ul li.go a { background-image: url("/img/bg_stop-icon_green.jpg"); }

   ul#nav { border: 1px solid #D3D3D1; }
      ul#nav li { border-bottom: 1px solid #D3D3D1; }
         ul#nav li ul { border-top: 1px solid #D3D3D1; }
         ul#nav li li { border-bottom: 0; }
   ul#nav li,
   ul#nav,
   #leftCol ul#nav.vertical li ul,
   ul.back_to_home,
   ul.back_to_home li,
   #subscribe ul li,
   #subscribe ul { 
      list-style: none;
      padding: 0;
      margin: 0;
   }
      ul#nav li a,
      #leftCol ul#nav.vertical li a,
      ul.back_to_home li a,
      #subscribe ul li a {
         display: block;
         background: transparent url('../img/bg_nav.gif') right top no-repeat;/*think_tool*/
         height: 16px;
/*         border-bottom: 1px solid #D3D3D1;*/
         text-transform: uppercase;
         text-decoration: none;
         font-weight: bold;
         padding: 14px 10px;
      }
         ul.back_to_home li a {
            border: 0;
            padding: 13px 10px;
            padding-right: 45px;
         }
         ul#nav li.selected a,
         #leftCol ul#nav.vertical li ul li a { background: #DCDCCF url('../img/bg_nav_selected.gif') right top no-repeat; }
         ul#nav li a:hover { text-decoration: underline; }
.home ul#nav li { margin-bottom: 5px; }
.mystudents ul#nav li a,
.curriculum ul#nav li a,
#leftCol ul#nav.vertical li ul li a { 
   border-top: 0;
   padding: 9px 10px;
   background-position: right -4px;
}
   #leftCol ul#nav.vertical li ul li a { 
      border-left: 40px solid #DCDCCF;
      border-bottom: 0;
   }
/* @end think_tool **/
/** @group story */
.home #story {
   width: 462px;
   float: right;
   margin-top: 0;
}
   #student.home #story { float: left; margin-left: 7px; margin-bottom: 0; }
   .qbol #qbol_story { line-height: 1.5em; }
/* @end story **/
/** @group qbol_stories */
#qbol_stories h4 { padding-top: 15px; }
#qbol_stories .qbol { 
   padding: 0.4em 0;
   border-bottom: 1px solid #D3D3D1;
}
   #qbol_stories .qbol:last-child { border-bottom: 0; }
   .qbol_square_thumb {
      width: 140px;
      height: 145px;
      overflow: hidden;
      margin: 0.4em;
   }
      #mainContent .qbol_square_thumb img { padding: 0; margin: 0; }
/* @end qbol_stories **/
#student.home #mainContent {
   width: 675px;
   float: left;
}
#student.home #milestones {
   width: 243px;
   float: right;
}
   #student.home #milestones big { display: block; padding: 3px 8px; }
   #student.home #latest_milestone { padding: 3px 8px; }
   #student.home #go_to_full_pg { padding: 3px 8px; float: right; clear: right; }
/* @end mainContent **/
/* @end rightCol **/

/** @group mystudents */
#mainContent h1 { font-weight: normal; font-size: 2.8em; padding-left: 5px; }
   .milestones #mainContent h1 { padding-left: 12px; padding-top: 8px; }
   .curriculum #mainContent h1 { padding-left: 0; }

#mainContent img { margin: 8px; }

.mystudents #student_profile { margin: 0; }

#enlarged_img {
   width: 83px;
   margin: 4px;
   float: left;;
}
   .home #enlarged_img { width: 78px; margin: 3px 10px 3px 0; }

.mystudents #enlarged_bio,
.home #teacher_bio {
   width: 128px;
   padding: 5px 10px;
   padding-bottom: 12px;
   padding-left: 11px;
   float: left;
   overflow: hidden;
}
   .home #teacher_bio { float: none; width: auto; }
   .home #student_profile { height: 169px; }
.mystudents #student_progress {
   padding: 20px 8px;
   padding-right: 20px;
}
.mystudents #mainContent,
.curriculum #mainContent { 
   padding: 15px;
   padding-top: 30px;
}
   .mystudents .student,
   .milestones .milestone,
   .home .milestone {
      float: left;
      text-align: center;
      margin: 0 5px;
      margin-bottom: 12px;
   }
      .mystudents .student { margin: 0 7px; }
      .milestones .milestone { margin: 0 11px; margin-bottom: 12px; }
      .home .milestone { margin: 0 3px; margin-bottom: 0; }
         .home .milestone_list { padding-left: 3px; }
   .mystudents .active .photo_border,
   .milestones .active .photo_border,
   .home .active .photo_border { background-color: #85FF1F; }
      .mystudents .student .photo_border { 
         width: 84px; 
         margin: 0 auto; 
         margin-bottom: 4px;
         height: 144px;
         overflow: hidden;
      }
         .mystudents .student table {
            padding: 0;
            margin: 0 0 0.3em;
         }
         .mystudents .student .img_contain {
            padding: 0;
            width: 84px;
            height: 114px;
            vertical-align: middle;
            background-color: #FFF;
         }
         .mystudents .active .img_contain { background-color: #85FF1F; }
            .mystudents .student .img_contain .img_wrapper { overflow: hidden; }
            .mystudents .student .img_contain a {
               padding: 0;
               position: static;
               display: block;
            }

#inspirational_quote {
   font-weight: bold;
   font-size: 1.3em;
   text-transform: uppercase;
   text-align: right;
   padding: 6px 8px;
}
   .home #inspirational_quote { text-align: left; margin: 0; }

.milestone #student_news { 
   margin-top: 5px;
   line-height: 1.5em;
}
/* @end mystudent **/
/** @group curriculum */
.curriculum #curriculum_stats {
   padding: 20px 10px 10px 10px;
   margin-bottom: 0;
}
/* @end curriculum **/
/* @end **/
/* @end contentWrapper **/

/** @group admin_index */
td, th { padding: 3px; }
form { margin: 0; }
/* @end admin_index **/

/** @group login */
#login form,
#login fieldset {
   margin: 0;
   padding: 0;
}
#login fieldset { border: 0; padding: 0 12px; padding-bottom: 8px; }
#login legend { display: none; }
#login label {
   display: block;
   text-transform: uppercase;
   letter-spacing: 0.1em;
   font-size: 1.1em;
}
   #login div.input input { width: 215px; }
   #login div.forgot { padding-top: 3px; }
#login button {
   float: right;
   clear: right;
   border-width: 1px;
   border-style: solid;
   font-size: 1.1em;
   padding: 3px 6px;
   cursor: pointer;
   cursor: hand;
}
#welcome_content #mainContent { border-top: 1px solid #695639; }
#welcome_content h1 { font-size: 1.8em; font-weight: bold; padding-left: 13px; }
#welcome_content #mainContent p { padding: 0 5px; }
#welcome_content #video_messages { height: 260px; }
   #welcome_content h1.toggle,
   #welcome_content h1.toggle:active,
   #welcome_content h1.toggle:focus {
      border-bottom: 1px solid #695639;
      cursor: pointer;
      cursor: hand;
      padding: 2px 5px;
      padding-left: 30px;
      margin: 0;
   }
      #welcome_content h1.up, #welcome_content h1.down { background: transparent url("/img/bg_toggle_down.gif") 5px 7px no-repeat; }
         #welcome_content h1.up {
            color: #FFF;
            background-color: #695639;
            background-image: url("/img/bg_toggle_up.gif"); 
         }
      #welcome_content blockquote.toggle_content {
         margin: 0;
         padding: 5px 25px;
         padding-left: 30px;
      }
      
/*      #default #contentSlot h2.up, #default #contentSlot h2.down {
               margin: -1px 0 0 0;
               padding: 0.5em 1.5em;
               padding-right: 0;
               cursor: pointer;
               cursor: hand;
               font-size: 1.3em;
               background: transparent url("../images/bg_toggle_down.gif") 3px 9px no-repeat;
               border: 1px solid #2F3196;
            }
               #default #contentSlot h2.up {
                  margin: -1px 0 0 0;
                  color: #FFF;
                  background-color: #2F3196;
                  background-image: url("../images/bg_toggle_up.gif");
               }*/
/* @end login **/

/***************************************
   =cluetipClass: 'default' 
-------------------------------------- */
.cluetip-default #cluetip-outer {
   position: relative;
   margin: 0;
   font-size: 1.3em;
}
.cluetip-default h3#cluetip-title {
   margin: 0;
   padding: 8px 10px 4px;
   font-weight: normal;
   font-weight: bold;
}
.cluetip-default #cluetip-inner { 
   padding: 10px;
   border-width: 1px;
   border-style: solid;
}
   .cluetip-default #cluetip-inner ol {
      list-style: decimal;
      padding-left: 20px;
      margin: 0;
      margin-bottom: 0;
   }
      .cluetip-default #cluetip-inner ol li { 
         margin-bottom: 0.6em;
         line-height: 1.0em;
      }
.cluetip-default div#cluetip-close {
   position: absolute;
   left: -5px;
   bottom: -5px;
   display: none;
}
   .cluetip-default div#cluetip-close a {
      text-decoration: none;
      display: block;
      padding: 4px 5px;
   }
      .cluetip-default div#cluetip-close a:hover { text-decoration: underline; }


/** Footer
-------------------------- **/
/** @group footer */
#footer {
   padding: 10px;
   text-align: left;
}
   #site_prefs {
      float: right;
      clear: right;
   }
   #footer a { text-decoration: none; }
      #footer a:hover { text-decoration: underline; }
/* @end footer **/


/** @group formContent
#formContent td.content label { font-weight: normal; }
#formContent input.input, #formContent textarea.textarea { border-color: 1px solid #83833C; }
#rightCol div.input.textarea textarea { 
   width: 500px; 
   min-height: 200px;
   max-height: 500px;
}
#formContent input.submit {
   background-color: #796043;
   border: 1px solid #5B4732;
   border-left-color: #A5825B;
   border-top-color: #A5825B;
   color: #FFF;
}
/* @end formContent **/


/** Class Styles
-------------------------- **/
#wrapper #contentWrapper.content #rightCol table,
#wrapper #contentWrapper.content #singleCol table {
   width: 100%;
   clear: both;
}

#wrapper #contentWrapper.content #rightCol table th,
#wrapper #contentWrapper.content #singleCol table th,
#wrapper #contentWrapper.content #singleCol form,
#wrapper #contentWrapper.content #rightCol form div.input.checkbox label { text-align: left; }

#wrapper #contentWrapper.content #rightCol form div.input label,
#wrapper #contentWrapper.content #singleCol form div.input label { 
   display: block; 
   width: 100px; 
   float: left; 
   padding: 3px;
   text-align: right;
}

#wrapper #contentWrapper.content #rightCol form div.input.required label { font-weight: bold; }
#wrapper #contentWrapper.content #singleCol { text-align: center; }
#wrapper #contentWrapper.content #singleCol #mainContent { text-align: left; }

#wrapper #contentWrapper.content #rightCol form div.input.error label,
#wrapper #contentWrapper.content #singleCol form div.input.error label,
#wrapper #contentWrapper.content #rightCol form div.input div.error-message,
#wrapper #contentWrapper.content #singleCol form div.input div.error-message { color: red; }

#wrapper #contentWrapper.content #rightCol form div.input.checkbox input[type="checkbox"],
#wrapper #contentWrapper.content #rightCol form#UserPreferencesForm div.input.checkbox input[type="checkbox"],
#wrapper #contentWrapper.content #rightCol form div.input.select div.checkbox input[type="checkbox"] { 
   float: left;
   margin-top: 4px;
   margin-left: 20px;
}

#wrapper #contentWrapper.content #rightCol form#UserPreferencesForm div.input.checkbox input[type="checkbox"],
#wrapper #contentWrapper.content #rightCol form div.input.select div.checkbox input[type="checkbox"] { margin-left: 105px; }
#wrapper #contentWrapper.content #rightCol form div.input.select div.checkbox input[type="text"] { 
   margin: 0px 5px 2px 105px; 
   width: 30px; 
   text-align: right;
   float: left; 
   
}

#wrapper #contentWrapper.content #rightCol form div.input.select div.checkbox { 
   width: 100%;
   display: block;
   margin-top: 4px;
   min-height: 14px;
   top: -22px;
   clear: left;
   position: relative;
}


#wrapper #contentWrapper.content #rightCol form div.input.select div.checkbox label { 
   position: relative;
   top: 1px;
   text-align: left;
   width: 300px;
   font-weight: normal;
}

#wrapper #contentWrapper.content #singleCol form div.input.select div.checkbox { 
   width: 100%;
   display: block;
   margin-top: 4px;
   min-height: 14px;
   top: -22px;
   clear: left;
   position: relative;
}

#wrapper #contentWrapper.content #singleCol form div.input.select div.checkbox input {
   float: left;
   position: relative;
   left: 270px;
   top: 3px;
}

#wrapper #contentWrapper.content #singleCol form div.input.select div.checkbox label {
   width: 220px;
}

#wrapper #contentWrapper.content #singleCol form div.checkbox {
   float: left;
   clear: left;
}

#wrapper #contentWrapper.content #singleCol form div.submit {
   clear: left;
}
#wrapper #contentWrapper.content #singleCol form div.input.file {
   clear: left;
}

#wrapper #contentWrapper.content #singleCol form div.checkbox input {
   float: left;
   position: relative;
   left: 105px;
   top: 3px;
}

#wrapper #contentWrapper.content #singleCol form div.checkbox label {
   float: left;
   margin-left: 15px;
   width: 220px;
}

#teacher #wrapper #contentWrapper.content #singleCol form div.checkbox label {
   margin-left: 40px;
}


#wrapper #contentWrapper.content #rightCol form div.input.checkbox input[type="checkbox"] { margin-left: 105px; }
#wrapper #contentWrapper.content #rightCol form table td div.input.checkbox label { width: 270px; }

#wrapper #contentWrapper.content #singleCol form table#ColList td div { float: left; clear: left; }
#wrapper #contentWrapper.content #singleCol form table#ColList td div.input.checkbox { height: 12px; }
#wrapper #contentWrapper.content #singleCol form table#ColList td div.input.checkbox input[type="checkbox"] { margin-left: auto; left: 0; }
#wrapper #contentWrapper.content #singleCol form table#ColList td div.input.checkbox label { width: auto; }

#wrapper #contentWrapper.content #rightCol form .input { clear: left; }

/*form .required input[type="text"],
form .required input[type="password"],
form .required textarea {
   border-color: #659017;
}*/
form .required label {
   /*color: #659017;*/
   font-weight: bold;
}

.hidden, .printOnly {
   display: none;
}

.clear {
  clear:both;
  height:1px;
  overflow:hidden;
  margin-bottom:-1px;
}

.clearafter:after {
   content: "";
   display: block; 
   height: 100%;
   clear: both;
   visibility: hidden;
}

.block,
#rightCol #mainContent.block .block { 
   padding: 5px;
   border: 1px solid #D3D3D1;
   margin: 7px 0;
}
   #rightCol #mainContent.block { margin-top: 0; }

.back_to_home {
   position: relative;
   float: right;
   clear: right;
   top: -5px;
   right: -5px;
}

.admin_badge {
   width: 100px;
   border: 1px solid #D3D3D1;
   float: left;
   margin: 10px 5px 0;
   padding: 5px;
   text-align: center;
}
.admin_badge.active {
   border: 1px solid #474647;
}
/*img.portrait {
   float: left;
   clear: left;
   margin: 0 5px 5px 0;
   border: 5px solid #FFF;
   border-bottom-width: 10px;
}*/

img.progress_bar { vertical-align: middle; }
.progress_bar { vertical-align: middle; }
#student_progress .progress_bar { margin-right: 15px; margin-left: 0.8em; }

.photo_border {
   background-color: #FFF;
   border: 1px solid #474647;
   border-top-color: #969591;
   border-left-color: #969591;
   padding: 3px;
   text-align: center;
   margin-bottom: 3px;
}

.CAPS { text-transform: uppercase; }

.left {
   float: left;
   clear: left;
   margin: 0 15px 8px 0;
}

.nomargin { margin: 0; }

.bg_gradient_sm, .cluetip-default #cluetip-outer { background: #FFF url('../img/bg_gradient_small.jpg') left bottom repeat-x; }
.bg_gradient_lg { background: transparent url('../img/bg_gradient_lg.jpg') left bottom repeat-x; }

a.tool_tip {
   cursor: pointer;
   cursor: hand;
}

strong.title {
   text-transform: uppercase;
   font-weight: normal;
   letter-spacing: 0.1em;
   font-size: 0.9em;
}
   big strong.title { font-weight: bold; letter-spacing: normal; }
   
div.pagination { text-align: center; }
div.pagination .current { font-weight: bold; }
div.pagination .disabled { display: none; }
div.pagination div.counter { padding-top: 5px; }
.indent { padding-left: 20px; }
dl li { list-style-type: none; }

/* Cake Debug Styles */
table.cake-sql-log {
   clear: both;
   border: 2px solid #FF0000;
   background: #FFCCCC;
   width: 100%;
}
table.cake-sql-log th {
   background: #f2f2f2;
   border:1px solid #bbb;
   border-top: 1px solid #fff;
   border-left: 1px solid #fff;
   text-align: center;
   white-space: nowrap;
   
}
table.cake-sql-log table {
   background: #f4f4f4;
}
table.cake-sql-log td {
   border:1px solid white;
   padding: 4px 8px;
   text-align: left;
}
.ui-draggable {
   cursor: move;
   display: block;
   border: 1px solid #CCCCCC;
   text-align: center;
   padding: 5px 0;
   margin: 2px;
}

.hoverDrop {
   background: white;
}

.content form div.switchPassword {
   margin: 0;
}
.content form div.switchPassword input {
   font-size: 9pt;
   padding: 0;
   margin: 0;
   border: 1px dashed #695639;
   color: #695639;
   /*background-color: white;*/
   font-family: "Geneva,Arial,Helvetica,sans-serif";
   width: 70px;
}
.content form div.switchPassword button {
  font-size: 8pt;
  border: 1px solid #695639;
  color: #fff;
  background-color: #695639;
  height: 18px;
  padding: 0 0 3px;
  margin: 0 0 0 1px;
}
div#surveyList ul {
   float: left;
   list-style-image:none;
   list-style-position:outside;
   list-style-type:none;
   margin: 0;
}
div#surveyList ul li {
   float: left;
   width: 155px;
   margin: 2px;
   list-style-image:none;
   list-style-position:outside;
   list-style-type:none;
}
#contentWrapper table tr.alt {
   background-color: #F4F4EA;
}
#contentWrapper table tr.white {
   background-color: white;
}
#contentWrapper table tr td.indent {
   padding-left: 30px;
}
#contentWrapper table tr.small td {
   font-size: 10px;
}
.subnav a, .subnav a:link, .subnav a:visited {
   color: #FF0000;
   text-decoration: blink;
}
.content input { margin: 1px 2px; }

/*box styles for dashboard page*/

.box {
   width: 314px;
   padding: 8px;
   margin: 10px;
   background: #F6F6F6;
   border: 1px solid #E5E5E5;
/*   float: left;*/
}
.box div {
   padding: 8px;
   background: #FFF;
   border: 1px solid #E5E5E5;
}
.box h2 {
   color: #666;
   padding: 4px;
   border-bottom: 1px solid #E5E5E5;
}
.box h2.icon { padding-left: 30px; }

.box h2.user { background: url("../img/icon-user.jpg") top left no-repeat; }
.box h2.ring { background: url("../img/icon-ring.jpg") top left no-repeat; }
.box h2.stats { background: url("../img/icon-stats.jpg") top left no-repeat; }
.box h2.apple { background: url("../img/icon-apple.jpg") top left no-repeat; }

.box ul { list-style: square; }
