/* lg */

@media (min-width: 1084px) {
 .small-col{
    padding: 4px;
    font-size: 14px;
}

 #header-tekst{
     padding-left: 20px;
       font-size:3.0em;
  }

 .navbar-nav{

   margin-right: 80px;

 }

  .navbar-inverse .navbar-nav .dropdown-menu {

       left: 0;

       right: auto;

    }

 .navbar-inverse .navbar-nav > li > a {

  padding: 5px 5px;

  margin: 0;

  line-height: 24px;

  }



  .submenu{

   font-size: 16px;

  }

}

@media (min-width: 768px) {

    body {
     width: 100%;
     position: absolute;
     top: 0px;
     margin-left: auto;
     margin-right: auto;
     font-size: 16px;
     padding: 2em;
     padding-top: 1em;
   }
    #home-welkom{
      padding: 6px;
      margin-bottom: 1vh;
      overflow: auto;
      min-height:  35vh;
    }

    #rightPanel{
      color: #fbecd0;
     min-height:  35vh;
    }
}



@media (min-width: 992px) {
   #beheer{
     display: block;
    }
    #login{
     display: block;
    }
    .modal-dialog{
       margin-top: 100px;
    }
    #home-header{
      font-size: 32px;
      padding-top: 15px;

    }
    .pasfoto{
        max-width: 60px;
        max-height:60px;
     }

}



@media (max-width: 991px) {
  #inlogform{
        width:100%  !important;
    }

   #home-header{
   padding-bottom: 10px;
   }
  .ui-pageheader{
   //  font-size:1.6em;
   /* padding-bottom: 10px;    */
 }


 .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }

  .navbar-nav > li {
    margin-left: 0;
    margin-right: 3px;
  }
   #repertoirdiv{
     width: 90%;
  }
}

/* xs */


@media (max-width: 768px) {

  small-col{
    padding: 2px;
    font-size: 10px;
   }

   .ui-pageheader{
     font-size:1.4em;
    padding-bottom: 10px;
 }

  #header-tekst{
       font-size:1.4em;
        padding-left: 10px;
  }


 #home-agenda-content {
   overflow: hidden;
   height: auto;
 }
  #home-contact-content {
  height: auto;
  }

 .foto-col {
   margin-bottom: 4px;
   width: 40px;
 }

 .foto-col >div{
  display: none;
 }

 .navbar-nav{
     margin: 0;
     margin-right: 4px;
  }
   .side-collapse-container{
              width:100%;
              position:relative;
              left:0;
              transition:left .4s;
   }

   .side-collapse-container.out{
              left:200px;
   }

   .side-collapse {
              top:50px;
              bottom:0;
              left:0px;
              width: 180px;
              position:fixed;
              overflow:hidden;
              transition:width .4s;
   }

   .side-collapse.in {
              width:0px;
   }

  .container > .navbar-header, .container > .navbar-collapse{
    margin-left: 0;
  }

  .top-number{
    font-size: 14px;
  }



  input.search-form:hover {
    width: 120px;
  }

  .navbar-nav > li {
    padding-top: 10px;
    padding-left: 20px;
    padding-bottom: 0;
  }

  .navbar-inverse .navbar-nav .dropdown-menu {
   padding-left: 25px;
  }





   #footer .pull-right{
      float: none !important;
  }
}



/* XS Portrait */

@media (max-width: 640px) {
    .container {
         padding: 0;
     }
     .small-col{
     padding: 2px;
     font-size: 10px;
   }

   #home-header{
       padding-top: 0px;
        padding-bottom: 0px;
  }
  .ui-pageheader{
     font-size:1.2em;
     padding-top: 0px;
     padding-bottom: 0px;
 }



  #header-logo{
     height: 84px;
     padding-top: 10px;
  }



  #header-tekst{
       font-size:1.2em;
       line-height: 30px;
       vertical-align: middle;
       padding-left: 10px;
        padding-top: 10px;
      }

/*

 .navbar-toggle {

   width: 40px;

   height: 40px;

   padding: 2px;

    margin: 5px;

    margin-top: 10px;

 }

*/



 #header-table{
    width: 85%;
 }



   #maincontent{
        font-size: 0.9em;
      }

   #maincontent h1{
         font-size: 1.1em;
      }

   #maincontent h2{
        // font-size: 1em;
   }

 #home-contact-content{
  padding: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
    height: auto;
 }



@media (max-width: 360px) {
   .small-col{
     padding: 1px;
     font-size: 8px;
   }

  #footer{
        font-size:  0.7em;
  }



  #header.col-xs-10{
     padding-left: 0;
     padding-right: 0;
  }

  #footer_1.col-xs-10{
     padding-left: 3px;
     padding-right: 3px;
  }
}