/*****************************************************
 * Large desktop 
 ****************************************************/
@media (min-width: 1200px) { 


}
 
/*****************************************************
 * Portrait tablet to landscape and desktop 
 ****************************************************/
@media (min-width: 768px) and (max-width: 979px) { 

  
}

@media (min-width: 768px) {
  #header ul.menu {
    display: block !important;  
  }
}

/*****************************************************
 * Landscape phone to portrait tablet 
 ****************************************************/
@media (max-width: 767px) {
  
  .hideDesktop {
    display: initial;
  }

  #wrapper1 {
    width: 100%;
  }
  
  .container {
    width: 100%;
  }
  .row {
    width: 100%;
    padding: 0;
    *zoom: 1;
  }
    .row:before,
    .row:after {
      display: table;
      line-height: 0;
      content: "";
    }
    .row:after {
      clear: both;
    }
    .row [class*="span"] {
      display: block;
      float: left;
      width: 100%;
      min-height: 30px;
      margin: 0;
      -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
              box-sizing: border-box;
    }
    .row [class*="span"]:first-child {
      margin-left: 0;
    }

  /* HEADER */
  #header {
    height: auto;
    position: static;
    margin-right: -1em;
    margin-left: -1em;
  }
      
    #header h1 {
      width: 250px;
      margin-top: 2.7624309392265194%;
      margin-left: 2.7624309392265194%;    
    }
      #header h1.logo a {
        background-size: 100%;
      }
        #header h1.logo a span#slogan {
          display: none;
        } 
      
    #header #mobileMenuBtn {
      position: absolute; 
      display: inherit;
      right: 2.7624309392265194%;
      top: 12px;;
    }
  
    #header ul.menu {
      display: none;
      float: left;
      position: relative;
      height: auto;
      width: 100%;
      margin-top: 0;
    }
    #header ul.menu li{
      float: none;
      height: auto;
      font-size: initial;
      font-weight: normal;
      line-height: initial;
      margin-right: 0;
      outline: none;
    }
    #header ul.menu li:last-child {
      display: none;
    }
    #header ul.menu li#searchLinkMobile {
      display: block;
    }
    #header ul.menu li a {
      display: block;
      padding: 2.7624309392265194%;
      border-bottom: 1px solid #dedede;
    }
    #header #logged-in {
      position: inherit;
      top: 0;
      left: 1em;
    }
    #header #logged-in a {
      display: inline-block;
    }      
    
  /* MAIN ELEMENTS */
        
  body { 
    padding: 0 1em 0 1em;
  }


  #main_container {
    width: 100%;
  }

  h1, 
  h2, 
  h3, 
  h4, 
  h5, 
  h6 {
    font-size: 100% !important;
    margin: 0 0 1em 0;
    padding: 0;
    vertical-align: baseline;
  }

  p {
    font-size: 100% !important;
    font: inherit;
    margin: 0 0 1em 0;
    padding: 0;
    vertical-align: baseline;
  }
  
  .button {
    width: 98%;
    margin-bottom: 1em;
    text-align: center;
    padding: 1em 0 !important;
    margin: 0 auto .75em auto !important;
    display: block;
    font-size: 1em !important;
  }
  
  .ui-dialog-buttonset .button {
    width: inherit;
    padding: 3px 6px !important;
    display: inline-block;
    margin-right: 1em !important;
  }
  
  #ads-right {
    display:none;
  }
  
  #ads-bottom {
    width:100%;
    height: initial;
  } 
  
  #content-top,
  #leftColumn,
  #rightColumn,
  #middle,
  #content {
    width: 100%;
    margin: 0;
    padding: 0;
  }
  
  #rightColumn {
    margin-top: 1em;
    padding-top: 0 !important;
  }
  
  #rightColumn .box {
    width: 100%;
  }
  
  #breadcrumbs {
    margin-top: 1em;
    margin-bottom: 1em;
  }
  
    #breadcrumbs li a {
      padding-left: 1em;
      padding-right: 1em;
      float: none;
      position: inherit;
    }
      #breadcrumbs li a:after {
        display: none;
      }
      #breadcrumbs li:first-child a {
        padding-left: 6px;
      }
  
  #donateBoxHoriz .left {
    width: 100%;
    float: none;
    text-align: center;
  }
  
  #donateBoxHoriz .right {
    text-align: center;
  }
  
  .hideMobile {
    display: none;
  }
  
  #sitesearch input[type=text] {
    width: 96%;
    padding-left: 1em;
  }
  
  #sitesearch input[type=submit] {
    margin-right: 4px;
  }
  
  #cse-search-results {
    width: 100%;
  
  }
    #cse-search-results iframe {
      width: 100%;
      position: relative;
    }
      .gs-webResult {
        width: 100% !important;
      }
  
  /* HOME PAGE */
  
  .arrow_box_down:after, .arrow_box_down:before,
  .arrow_box_down_grey:after, .arrow_box_down_grey:before,
  .arrow_box_down_green:after, .arrow_box_down_green:before {
    left: 50%;
  }
  
  #slider #cards {
    width: 100%;
    position: relative;
    float: none;
    margin: 0 auto;
  }
    #slider #cards ul li {
      width: 250px;
    }
      #slider #cards ul li img {
        width: 98%;
      }
  #users .span4:nth-child(1), 
  #users .span4:nth-child(2),
  #mobile .span4:nth-child(1), 
  #mobile .span4:nth-child(2){
    border-right: 0;
    border-left: 0;
    border-top: 0;
  }
  
  #mobile {
    margin-left: -1em;
    margin-right: -1em;
  }
  
  #features .row .span4 {
    border-left: 0;
    border-right: 0;
    border-top: 1px solid #dedede;
  }
    #features .row .span4:first-child {
      border-top: 0;
    }
    #features .row .span4 .cover h3 {
      margin-top: 18%;
    }
    #features .row .span4 .content {
      height: 91%;
    }   
  
  #whats_new {
    padding: 1em;
    margin-left: -1em;
    margin-right: -1em;
  }
    #whats_new .container {
      padding: 0;
      margin: 0;
    }  
    #whats_new ul {
      font-size: 1em;
      margin: 0 1em 0 .5em;
    }

  #lists h2 {
    margin-bottom: 1em;
  }
  #lists .span4 {
    border-right: 0;
    border-bottom: 1px solid #dedede;
    margin-bottom: 1em;
    padding-bottom: 1em;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
    #lists .span4.last_child {
      border-bottom: 0;
    }
  #lists ul {
    margin-bottom: 0;
  }
  
  #users #user_student::after {
    background-position: 50% -175px;
  }
    #users #user_student:hover:after {
      background-position: 50% 0px;
    }
  #users #user_teacher::after  {
    background-position: 61% -153px;
  }
    #users #user_teacher:hover:after {
      background-position: 61% 0px;
    }
  #users #user_professional::after {
    background-position: 50% -153px;
  }
    #users #user_professional:hover:after {
      background-position: 50% 0px;
    }
    
  #slider .row,
  #users .row,
  #mobile .row,
  #features .row,
  #whats_new .row,
  #ad_free .row,
  #lists .row {
    padding-top: 1em;
    padding-bottom: 1em;
  }
  
  #ad_free .row {
    padding-top: 2em;
  }
  
  /* FOOTER */
  #footer {
    border-top: 0;
    margin-left: -1em;
    margin-right: -1em;
  }
    #footer .row {
      padding-top: 0;
    }
    #footer .span2.last_child {
      margin-top: 1em;
      text-align: center;  
    }
      #footer .span2.last_child a.button {
        width: 98%;
      }
    #footer h4 {
      border-bottom: 1px solid #dedede;
      margin-bottom: 0;
    }
      #footer .span2:first-child h4 {
        border-top: 1px solid #dedede;
      }
      #footer h4 a {
        display: block;
        padding: 1em;
      }
        #footer h4 a:active {
          background-color: #dedede;
          color: #fff;
        }
    #footer ul {
      display: none;
    }
    #footer #footer_sharing {
      text-align: center;
    }
    #footer #footer_copyright {
      text-align: center;
    }
    
  /* Forms */
  
  .form_item {
    width: 100% !important;
    display: block;
    padding: 0  !important;
    margin: 0 0 1em 0 !important;
  }
    .form_item label {
      width: 100% !important;
      float: none;
      padding: 0 !important;
      margin: 0 !important;
    }
    .form_item .field {
      width: 100% !important;
      display: block;
      padding: 0 !important;
      margin: 0 !important;
    }
      .form_item .field input[type=text],
      .form_item .field input[type=password]] {
        width: 100% !important;
        display: block;
        padding: .75em !important;
      }
  input[type=text], 
  input[type=password] {
    padding: 4px 0;
    width: 100%;
  }
      
  #frmSearch label {
   width: 100%;
   display: block;
   float: none;
   margin: 1em 0 0 0;
  }
  
  #frmSearch label[for=level] {
    margin: 1em 0 0 0;
    width: 100%;
    display: block;
  }
  
  #frmSearch input,
  #frmSearch input[name=full_text_search],
  #frmSearch select {
   width: 100%;
   display: block;
   float: none;
  }
  
  #frmSearch input[type=submit] {
    margin-top: 1em;
  }
  
  #frmRegister {
    width: 93% !important;
    padding: 8px !important;
  }
  
  #frmRegister label[for=register-type-Student] {
    width: auto;
  }
  
  .set_details_new input[type="submit"], 
  .set_details_new input[type="button"], 
  .set_details_new .button {
    width: 100%;
    margin-bottom: 1em;
    padding: 1em;
    font-size: 1em;
  }
  
  .set_details_new {
    color: #fff;
    line-height: 0;
  }
  
  #dataSetDescription dt,
  #dataSetDescription dd {
    margin: 1em 0 0 0;
    width: 100%;
  }
  
  .set_details_new #stars,
  .set_details_new #frmShare {
    display: block;
    margin: .5em 0;
  }
  
  #tblSupportRequest td {
    display: block;
  }
  
    #tblSupportRequest td input[type=text] {
      width: 100%;
    }
  
  /* FLASHCARD LIBRARY */
  .search_result .set_info {  
    margin-top: 1em;  
  }
    .search_result .set_info span {
      display: block;
      line-height: .5em;
    }
    
  .searchResultsShowing {
    float: none !important;
  }
  
  .narrow_search {
    float: none !important;
  }
  
  .linkBrowseBySubject {
    float: none !important;
   }
   
  p.boxedHeading {
    width: 100%;
    color: #fff;
  }
  
    p.boxedHeading a {
      display: block;
      width: 100%;
      clear: both;
    }

  /* STATIC PAGES */
  
  .fcStaticSubject ul {
    width: 100%;
    float: none;
  }
    .fcStaticSubject li {
      font-size: 1em;
    }    
    .fcStaticSubject li a {
      font-size: 1em;
    }
    
  #staticPageContent table {
    width: 100%; 
  }
    #staticPageContent table td {
      width: 98.76% !important;
      display: block;
      overflow: hidden;
    }
  .pubStaticAdTop {
    width:100%;
    height:initial;
  }
  
  /* GETTING STARTED GUIDE */
  #content-middle #faq_nav .arrow {
    width: 20px;
    display: none;
  }
  .arrow img {
    width: 20px;
    position: relative;
    top: 42px;
  }
  
  #content-middle li img {
    width: 98%;
  }
  
  #content-middle #faq_nav {
      width:62%;
  }
  
  #content-middle #faq_nav a {
    display: block;
    width: 135px;
    height: 120px;
    float: left;
  }
  
  #content-middle #faq_nav a[href=guide.cgi?page=create_set] {
    clear: right;
  }
  
 
}
 
/*****************************************************
 * Landscape phones and down 
 ****************************************************/
@media (max-width: 480px) { 
   #header h1 {
      width: 255px;
    }
    
  #content-middle #faq_nav {
      width:94%;
  }

  #users #user_teacher::after  {
    background-position: 90% -153px;
  }
  #users #user_teacher:hover:after {
    background-position: 90% 0px;
  }
}

@media (max-width: 803px) {
  #chAd {
    display: none;  
  }
}

@media (max-width: 969px) {
  
  #whats_new .row:first-child.homeAd, 
  #whats_new .row.homeAd {
    width:100%;
    margin:0;
    padding: 20px 0;
  }
}