/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
}


/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */
}

/* Até 900px */
@media only screen and (max-width: 900px){

	.mobile{
	    display: block;
	    
	}

    .navbar-nav .btn-group, .navbar-nav .btn-group-vertical, .navbar-nav .a-menu{
        width: 100%;
        margin-bottom: 0.3rem;
    }

    .navbar-nav .dropdown-menu{
        top: 100%;
        left: 0;
    }

    .navbar-nav .dropdown-submenu>.dropdown-menu{
        left: 50%;
    }



	.menu-main {
	    width: 100%;
	    margin: 0 0 2px;
	}

	.menu-main-sub {
    	width: 80%;
    	margin-left: 20%;
    	display: none;
	}

	.menu-sub {
    	background-color: rgba(36,173,152,0.9);
	}

	.main{
		padding: 10px 10px;
	}

	.navbar-nav form button{
		font-size: 0.8rem;
	}

	.form-logout-desktop{
		display: none;
		
	}

	.section-centro{
		padding: 0;
	}

	.article-login{
		width: 100%;
	}

	.section-default form {
    	width: 90%;	
	}

	.article-reset{
		width: 100%;
	}

	.article-reset h1 {
	    font-size: 1.5rem;
	}

	.article-reset p {
	    font-size: 0.9rem;
	}

	.section-default .article-reset form{
		width: 100%;
	}

	.erros-div, .erros{
		width: 95%;
	}

	.actualizacao .actualizado, .actualizacao .actualizar form button{
		font-size: 0.6rem;
	}

	.erro-data{
		width: 100%;
	}

	.entre-datas{
		margin: 10px;
	}

	.entre-datas input, .entre-datas label{
		font-size: 0.6rem;
	}

	#filtro{
	    width: 25%;
	    float: right;
	    font-size: 0.8rem;
	}

	.dataTables_wrapper {
    	overflow-x: scroll;
	}

	.dataTables_length select, .dataTables_length label{
		font-size: 0.6rem;
	}

	div.dt-buttons{
		float: right!important;
	}

	#moloni_wrapper .dt-buttons .buttons-colvis{
		width: 25px;
    	height: 25px;
    	background-size: cover;
	}

	#moloni_wrapper .dt-buttons .buttons-pdf{
		font-size: 0.5rem;
	}

	.moloni th, .moloni td {
    	font-size: .7rem;
	}

	.section-utilizadores{
		width: 90%;
	}

	.section-utilizadores form{
		overflow-x: scroll;
	}

	.dataTables_wrapper .dataTables_length{
		text-align: left;
	}

	#moloni_wrapper .dt-buttons .buttons-pdf{
		display: none;
	}

}


/* Até 400px */
@media only screen and (max-width: 601px){

	.section-main {
	    padding: 1.5rem .5rem;
	}

	.h3, h3 {
    	font-size: 1.25rem;
	}

	.estatistica h3 {
    	margin: 0.5rem 0 1.5rem;
	}

	.entre-datas-content{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		    flex-wrap: wrap;
	}

	.datas-escolha{
		width: 100%;
	}

	.botao-escolha{
		width: 100%;
	}

	#filtro{
	    width: 25%;
	    float: none;
	    margin: 1rem;
	    padding: 0.2rem;
	}


	#jp-datatable-buttons_wrapper .dt-buttons .buttons-pdf, 
	#jp-datatable-buttons_wrapper .dt-buttons .buttons-excel{
		line-height: 1;
	}
	
	#jp-datatable-buttons_wrapper .dt-buttons .buttons-colvis{
		height: 29.3px;
	}

	.filtro-pull {
	    width: 30px;
	    height: 30px;
	    padding: 0.2rem;
	}

	#jp-datatable-buttons{
		width: 150%!important;
	}

	.dataTables_wrapper .dataTables_info, 
	.dataTables_wrapper .dataTables_paginate{
		font-size: 0.7rem;

	}

	.dataTables_wrapper .dataTables_info{
		text-align:left;
	}

	.dataTables_wrapper .dataTables_paginate{
		text-align:right;
	}

	#sidebar-filtro.active {
    	width: 70%;
    	z-index: 9;
	}

	.filtro-pull.active {
    	left: 70%;
    	top: 3.45rem;
	}

	.filtro-pull .tooltiptext {
		display: none;
		
	}

	#result-pagamentos{
		overflow-x: scroll; 
	}

	#result-pagamentos td a{
		font-size: 0.7rem;
		padding: 0.075rem 0.15rem;
	}

	/* Lançameto de documentos */

	.main-top aside,
	.main-bottom .bottom-left,
	.main-bottom .bottom-right {
    	width: 100%;
	}

	.entradas legend {
    	font-size: 1rem;
	}

	.entradas fieldset {
    	padding: 1rem 1.5rem;
	}

	.entradas .middle fieldset {
    	padding: 1rem 0.5rem;
	}

	.inserir-comentario {
    	width: 20px;
	}

	.apagar-linha{
		width: 20px;
	}

	.botoes-tabela {
    	margin-top: 2rem;
	}
	
	.entradas .top-right label,
	.entradas .top-left label,
	.entradas .bottom-left label, 
	.entradas .bottom-right label{
		text-align: left;
		padding-left: 0.3rem;
	}

	.col-form-label {
    	padding-bottom: calc(0.075rem + 1px);
	}

	.main-top aside,
	.main-bottom .bottom-right {
    	margin-bottom: 1rem;
	}

	.main-bottom {
    	flex-direction: column-reverse;
	}

	.form-control,
	#file-label {
    	height: 34px;
    	font-size: 0.9rem;
	}

	.btn-bottom{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 100%;
	}

	.btn-bottom .mx-5,
	.btn-bottom .mx-5{
		margin-left:0!important;
		margin-right:0!important;
	}


	/* Novas entidades*/
	.entidades-form {
    	width: 100%;
    	padding: 0 1rem;
	}

	#apagar-ficheiro {
	    right: -8px;
	}





/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
/* viewport size <= 320px ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}


/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */

	
}



/*************** Specific to device if required **********************/
/* stolen from http://nmsdvid.com/snippets/ **************************/

/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

/* iPhone5 ------------- */
@media screen and (device-aspect-ratio: 40/71) {
	/* Styles */
}
or
@media screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* Blackberry Torch ---------- */
@media screen and (max-device-width: 480px) { 
}

/* Samsung S3 ---------------- */
@media only screen and (-webkit-device-pixel-ratio: 2) {
}

/* Google Nexus 7 ------------- */
@media screen and (device-width: 600px) and (device-height: 905px) and (-webkit-min-device-pixel-ratio: 1.331) and (-webkit-max-device-pixel-ratio: 1.332) {
}

/* iPad Mini ------------------ */
@media screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) {
}

/* iPad 3 (Landscape)-------------------- */
@media (max-device-width: 1024px) and (orientation: landscape) { 
}

/* iPad 3 (portrait)-------------------- */
@media (max-device-width: 768px) and (orientation: portrait) { 
}

/* Galaxy Tab 10.1 (Landscape) -------- */
@media (max-device-width: 1280px) and (orientation: landscape) { 
}

/* Galaxy Tab 10.1 (Portrait) -------- */
@media (max-device-width: 800px) and (orientation: portrait) { 
}

/* Retina images ---------------------- */
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {
 
  /* Retina replacement CSS here */
 
}