/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Smaller than mobile */
@media (min-width: 320px) {
	.header {
		display: none; }
	.header-rsp {
    	border-bottom: 1px dotted #ccc;
    	text-align: center; }

	#pie {
		display: none; }
	#footer-rsp {
   		background-color: #0061aa;
    	color: #fff;
    	text-align: center;
    	clear: both; }

    .content {
    	width: 100%; }
    .wizard>.steps>ul>li {
    	width: 100%; }
    .wizard > .steps a, .wizard > .steps a:hover, .wizard > .steps a:active {
    	margin: .5em; }
    .wizard > .content > .body {
        width: 96%; }
    .wizard > .content {
        height: auto; }
    .form-bib td {
        float: left; }
    #telefono_sol {
        width: 230px; }
    #telefono_resp {
        width: 230px; }
    #descripcion {
        width: 250px; }
    #No_personas {
        width: 40px; }
    #observaciones {
       width: 250px; }
    #valid_user {
        margin-top: 20px; }

    .menu {
      position: absolute;
      top: 0;
      left: 0;
      background: #fff;
      width: 240px;
      height: 73px;
      -ms-transform:      translate3d(-240px, 0, 0);
      -webkit-transform:  translate3d(-240px, 0, 0);
      transform:          translate3d(-240px, 0, 0);
      transition: transform 0.35s ; }
    label.menu-toggle  {
      position: absolute  ;
      right: -60px;
      width: 60px;
      height: 73px;
      line-height: 0px  ;
      display: block;
      padding: 0;
      text-indent: -9999px;
      background: #fff url(https://cdn4.iconfinder.com/data/icons/wirecons-free-vector-icons/32/menu-alt-512.png) 50% 50% / 25px 25px no-repeat;  }
    .menu ul li{
      list-style: none; }
    .menu ul li a {
      text-decoration: none;
      font-family: 'Montserrat', sans-serif;
      color: #000;
      font-size: 18px;
      line-height: 50px; }
    /* hide inputs */
    .menu-checkbox {
      display: none ; }
    /* hide navigation icon for sublabels */
    .menu .menu label.menu-toggle {
      background: none ; }
    /* fade in checked menu */
    .menu-checkbox:checked + .menu {
      -ms-transform:      translate3d(0, 0, 0) ;
      -webkit-transform:  translate3d(0, 0, 0) ;
      transform:          translate3d(0, 0, 0) ; }

    #leftbar {
        display: none; }
    .profile-image {
        float: left;
        margin-left: 10px; }
    .profile-image img {
        border-radius: 50%;
        border: solid 3px #ccc;
        max-width: 75%; }
    #profile-info {
        position: absolute;
        left: 120px;
        top: 100px; }
    .profile-info {
        color: #666;
        font-family: 'Montserrat', sans-serif;
        font-size: 10px;
        font-weight: 300; }
    .profile-info.small {
       font-size: 11px; }
}

/* Larger than mobile */
@media (min-width: 400px) {
	.header {
		display: none; }
	.header-rsp {
    	border-bottom: 1px dotted #ccc;
    	text-align: center; }

	#pie {
		display: none; }
	#footer-rsp {
   		background-color: #0061aa;
    	color: #fff;
    	text-align: center;
    	clear: both; }

    .content {
    	width: 100%; }
    .wizard>.steps>ul>li {
    	width: 100%; }
    .wizard > .steps a, .wizard > .steps a:hover, .wizard > .steps a:active {
    	margin: .5em; }

    #leftbar {
        display: none; }
    .profile-image {
        float: left;
        margin-left: 20px; }
    .profile-image img {
        border-radius: 50%;
        border: solid 3px #ccc;
        max-width: 100%; }
    #profile-info {
        position: absolute;
        left: 170px;
        top: 90px; }
    .profile-info {
        color: #666;
        font-family: 'Montserrat', sans-serif;
        font-size: 12px;
        padding-top: 15px;
        padding-left: 5px;
        padding-right: 15px; }
    .profile-info.small {
       font-size: 14px; }

  .form-bib td{
    float: none; }
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
	.header-rsp {
    	border-bottom: 1px dotted #ccc;
    	text-align: center; }

    .content {
    	width: 100%; }
    .wizard>.steps>ul>li {
    	width: 100%; }
    .wizard > .steps a, .wizard > .steps a:hover, .wizard > .steps a:active {
    	margin: .5em; }
}

/* Larger than tablet */
@media (min-width: 750px) {
	.header-rsp {
    	border-bottom: 1px dotted #ccc;
    	text-align: center; }

    .content {
    	width: 100%; }
    .wizard>.steps>ul>li {
    	width: 100%; }
    .wizard > .steps a, .wizard > .steps a:hover, .wizard > .steps a:active {
    	margin: .5em; }
  #observaciones {
    width: auto; }
}

/* Larger than desktop */
@media (min-width: 960px) {
	.header {
		display: block; }
	.header-rsp {
    	display: none;
      border: none; }

  #pie {
		display: block; }
	#footer-rsp {
		display: none; }

	.content {
		width: 70%; }
	.wizard > .steps > ul > li {
    	width: 25%; }

    #leftbar {
        display: block; }
    #leftbar-rsp {
        display: none; }
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}