/*
<!-- -------------------------------------------------------------------------------------------------	-->
<!--  PROGRAM: PROGRAMA DE REGISTRO DE RECIBO Y ENTREGA                                             	-->
<!--  FILE DESCRIPTION: CSS FILE                                                                       	-->
<!--  FILE NAME: CUSTOM_SETTINGS.CSS	           	                                                  	-->
<!--  PURPOSE : DEFINE CSS SETTINGS FOR ALL PAGES IN APPLICATION                                       	-->
<!--  USED BY : ALL PHP PAGES                      	                                                  	-->
<!--                                                                                                    -->
<!--  Created       : October 15, 2016                                                                  -->
<!--  Last modified : May 10, 2018                                                                    -->
<!--                                                                                                    -->
<!--  Developed by  : Wilmer Batista Morales                                                           	-->
<!--  Copyright     : Universidad de Puerto Rico, Recinto de Rio Piedras                               	--> 
<!--                                                                                                    -->
<!--  Modifications log :                                                                               -->
                                                                                                    
                                                                                                    
                                                                                                    
                                                                                                    
                                                                                                    
<!-- -------------------------------------------------------------------------------------------------	-->
*/


/* CSS Document */
	

/* Body background color and font*/
html, body { background: #F2D4A4; font-family: Arial, Verdana, sans-serif }


/* main title in each page in bold */
.TitleText1 { font-weight: bold }	


/* Primary background color (red-like); font color white */
.backg_primary_color { background : #E70034; color : #FFFFFF }
					 
.backg_primary_color_footer { background : #333333; color : #FFFFFF }


/* Secondary background color (gray-like) */
.backg_secondary_color { background : #D9D9D9; color : #000000 }


/* Complementary background color (yellow-like); font color black */
.backg_body_color { background : #FFCD00; color : #000000 }
				   
				   
/* Change border color to bootstrap buttons */
.btn-danger, .btn-primary, .btn-success, .btn-info, .btn-warning
{
  border-color: #000;
  border-width: 1px;
}
			    				   

/* Change padding of clock button in time fields to adjust button to field if resolution changes  */
/* By default the button doesnt adjust to field size. */
.input-group-addon { padding: 0vw 0.5vw; }


/* Used to reduce row height between data rows to aprox half height */
.half-height {
	            font-size: 0.60em
             }


/* Used to reduce row height between data rows to aprox. quarter height */
.quarter-height {
	            font-size: 0.30em
             }


/* Fields size  */
.form-group .form-control {
	                        font-size: 1.2em;
                            height: 2.3em;
                          }
 

/* Apply no padding to left or right side of object */
.nopaddingleft {
	             padding-left: 0px;
               }

.nopaddingright {
	              padding-right: 0px;
                }


/* Apply half padding to right or left side of object */
.halfpaddingright {
	                padding-right: 6px;
                  }

.halfpaddingleft {
	               padding-left: 6px;
                 }


/* Strech a little more the search fields in tables */
#IntDeliveryTable.dataTable tfoot th
{
	padding-right: 12px;
	padding-left: 12px;
}

#intDeliveriesTable.dataTable tfoot th
{
	padding-right: 12px;
	padding-left: 12px;
}

#ReceiptsTable.dataTable tfoot th
{
	padding-right: 12px;
	padding-left: 12px;
}

#UsersTable.dataTable tfoot th
{
	padding-right: 12px;
	padding-left: 12px;
}

#TransactionsTable.dataTable tfoot th
{
	padding-right: 12px;
	padding-left: 12px;
}

/* Settings for screens 1686px or larger*/
@media screen and (min-width: 1686px){
	
/* Header text position */ 	
.header-text-position { position: absolute; margin-top: 0.8vw; left: 55%; }

/* Header text fonts */	
.HeaderText1 { font-size:1.3vw; color:white }
.HeaderText2 { font-size:0.8vw; color:white }
	
/* Main title font size */
.TitleText1 { font-size: 90% }	
	
	
	
/* Datatables button font-size */
.dt-buttons { font-size: 80% }	
	
	
/* Settings on unauthorized access try message (unauth_acc_try_mess.php) */	
.TitleUnauthorizedAccessMessage {font-size:1.1vw}		
.unauthorized_access_try_screen {padding-top: 15% }
	
/* Font for all input labels and input fields */
.InputLabel   {font-size:0.7vw}
.InputField	  {font-size:0.7vw}
select {font-size:0.7vw}

/* Font for tables */	
th { font-size: 0.8vw; }
td { font-size: 0.8vw; }

/* Datatables search input font and height*/	
.dataTables_filter input 
{
  font-size : 0.8vw; height : 1.7vw  		
}

/* Datatables search input label */	
.dataTables_filter label 
{
  font-size : 0.8vw;		
}		
	
/* Clear search buttons */		
.clearsearchbtn { font-size : 0.8vw; height : 1.7vw; padding: 0% 2% }	
	
/* Footer text of login and menu pages */	
.FooterText {font-size:0.7vw; padding: 1em}   /* Footer text (only for index and menu pages)  */

.btn {font-size:0.8vw}

/* To show user and time data into a bubble */
.bubble {
		  /* bubble's height */
		  height: 28px;
		  /* bubble's width */
		  width: 90%;
		  /* altura del texto con referencia a la burbuja */
		  line-height: 28px;  

		  font-size: 1vw;
        }


	
}



/* Settings for LARGE screens (Between 1201px and 1685px) */
@media screen and (min-width: 1200px) and (max-width: 1685px) {

/* Header text position */ 		
.header-text-position { position: absolute; margin-top: 1.6vw; left: 45%; }	

/* Header text fonts */	
.HeaderText1 { font-size:1.1vw; color:white }
.HeaderText2 { font-size:0.8vw; color:white }
	
/* Main title font size */
.TitleText1 { font-size: 1.40vw }	
.TitleText2 { font-size: 1.10vw }		
	
	
/* Datatables button font-size */
.dt-buttons {
  font-size: 83%;
}		
	
/* Settings on unauthorized access try message (unauth_acc_try_mess.php) */	
.TitleUnauthorizedAccessMessage {font-size:1.1vw}	
.unauthorized_access_try_screen {padding-top: 15% }
	
/* Font for all input labels and input fields */
.InputLabel   {font-size:0.8vw}
.InputField	  {font-size:0.8vw}
select {font-size:0.8vw}


/* Font for tables */	
th { font-size: 0.8vw; }
td { font-size: 0.8vw; }

/* Datatables search input font and height*/	
.dataTables_filter input 
{
  font-size : 0.8vw; height : 1.7vw  		
}

/* Datatables search input label */	
.dataTables_filter label 
{
  font-size : 0.8vw;		
}		

.ZebraDialogMensaje .ZebraDialog_Title { background: #330066; }
	
/* Clear search buttons */	
.clearsearchbtn { font-size : 0.8vw; height : 1.7vw; padding: 0% 2% }		
	

.btn {font-size:0.9vw}


/* Footer font-size */	
.FooterText {font-size:0.9vw; padding: 1em}  /* Footer text (only for index and menu pages)  */
	
	
	
/* To show user and time data into a bubble */
.bubble {
		  /* bubble's height */
		  height: 28px;
		  /* bubble's width */
		  width: 90%;
		  /* altura del texto con referencia a la burbuja */
		  line-height: 28px;  

		  font-size: 1.1vw;
        }

	
}



/* Settings for MEDIUM screens (Between 992px and 1200px) Example: Desktops */
@media screen and (min-width: 992px) and (max-width: 1199px) {

/* Header text position */ 		
.header-text-position { position: absolute; margin-top: 1.6vw; left: 45% }	
	
/* Header text fonts */	
.HeaderText1 { font-size:1vw; color:white }
.HeaderText2 { font-size:0.8vw; color:white }
	
	
/* Main title font size */
.TitleText1 { font-size: 1.65vw }	
.TitleText2 { font-size: 1.20vw }		
	
/* Subtitles used in menu options, sub titles of pages, etc. */
.TitleText3 { font-size: 1.20vw }	
	
	
/* Datatables button font-size */
.dt-buttons {
  font-size: 70%;
}	
	
	
/* Settings on unauthorized access try message (unauth_acc_try_mess.php) */	
.TitleUnauthorizedAccessMessage {font-size:1.3vw}		
.unauthorized_access_try_screen {padding-top: 15% }
	
/* Font for all input labels and input fields */
.InputLabel   {font-size: 0.9vw}
.InputField	  {font-size: 1vw}
select {font-size:1vw}

/* Font for tables */	
th { font-size: 0.8vw; }
td { font-size: 0.8vw; }


.btn {font-size: 1vw}	
	
	
/* Footer font-size */	
.FooterText {font-size: 1vw; padding: 1em }   /* Footer text (only for index and menu pages)  */



/* To show user and time data into a bubble */
.bubble {
		  /* bubble's height */
		  height: 28px;
		  /* bubble's width */
		  width: 90%;
		  /* altura del texto con referencia a la burbuja */
		  line-height: 28px;  

		  font-size: 1.2vw;
        }
	

}



/* Settings for SMALL screens (Between 768px and 992px) Example: tablets */
@media screen and (min-width: 769px) and (max-width: 991px) {

	
/* Header text position */ 		
.header-text-position { position: absolute; margin-top: 1.5vw; left: 45% }	
	
/* Header text fonts */	
.HeaderText1 { font-size:1vw; color:white }
.HeaderText2 { font-size:0.8vw; color:white }
	
	
/* Main title font size */
.TitleText1 { font-size: 1.65vw }	
.TitleText2 { font-size: 1.20vw }		
		
	
/* Datatables button font-size */
.dt-buttons {
  font-size: 70%;
}		
	

input[type=text], select {
	
    font-size:90%
    
}

	
.btn {font-size:1.4vw}
	
	
/* Related to unauthorized access try message  */	
.TitleUnauthorizedAccessMessage {font-size:1.8vw}	
.unauthorized_access_try_screen {padding-top: 15% }
	
/* Font for all input labels and input fields */
.InputLabel   {font-size:1.2vw}
.InputField	  {font-size:1.2vw}
select {font-size:1.2vw}

/* Font for tables */	
th { font-size: 0.8vw; }
td { font-size: 0.8vw; }
		
	
	
/* Footer text of login and menu pages */	
.FooterText {font-size:1.2vw; padding: 1em}  /* Footer text (only for index and menu pages)  */



/* To show user and time data into a bubble */
.bubble {
		  /* bubble's height */
		  height: 28px;
		  /* bubble's width */
		  width: 90%;
		  /* altura del texto con referencia a la burbuja */
		  line-height: 28px;  

		  font-size: 1.5vw;
        }
	  


}



/* Settings for EXTRA SMALL screens (Less than 768px) Example: smartphones */
@media screen and (max-width: 768px) {

	
/* Header text position */ 		
.header-text-position { position: absolute; margin-top: 2vw; left: 45% }	
	
/* Header text fonts */	
.HeaderText1 { font-size:1.2vw; color:white }
.HeaderText2 { font-size:0.9vw; color:white }
	
	
/* Main title font size */
.TitleText1 { font-size: 2vw }	
.TitleText2 { font-size: 1.70vw }	
.TitleText3 { font-size: 0.75em }		
		
	
/* Datatables button font-size */
.dt-buttons {
  font-size: 80%;
}			
	
	
/* Footer text */	
.FooterText {font-size:1.2vw; padding: 0.5em} 
	
	
/* Related to unauthorized access try message  */	
.TitleUnauthorizedAccessMessage {font-size:2vw}		
	
/* Font for all input labels and input fields */
.InputLabel   {font-size:1.2vw}
.InputField	  {font-size:1.2vw}
select {font-size:1.2vw}
	
.btn {font-size:1.5vw}

/* To show user and time data into a bubble */
.bubble {
		  /* bubble's height */
		  height: 28px;
		  /* bubble's width */
		  width: 90%;
		  /* altura del texto con referencia a la burbuja */
		  line-height: 28px;  

		  font-size: 2vw;
        }

}



/* Common settings on all resolutions  */




input
{
  font-size  : 1vw;    
}


.HeaderTitle1 {
  z-index     : 100;
  position    : relative;
  bottom      : 0%;
  top         : 1.5vw; 	
  right       : 0%; 
  left        : -20%;
  font-size   : 1.1vw;
  font-weight : bold;
  color       : #FFF
}

.HeaderTitle2 {
  z-index: 100;
  position: relative;
  bottom : 0%;
  top    : 1.7vw; 	
  right  : 0%; 
  left   : -20%;
  font-size:0.9vw;
  font-weight:bold;
  color: #FFF
}

.bubble
{
	  
	  margin-top: 2px;
	  margin-bottom:0px; 
	  background: #fff5cc;
	  color: #000;
	  font-weight: bold;
	  text-align: center;
	  border-radius: 1vw;
	  box-shadow: 0 0 5px #222;
	  
}


.footerline {
	/*font-size:12px; */
	text-align:center;
	padding:10px;
	margin:0 auto
}

.navbar-fixed-top
{
  padding     : 0 0px 0 0px;
  margin-top  : 0px;
  min-height  : 0px;
  height      : 0%
}


.navbar-fixed-bottom 
{
  padding        : 0 0px 0 0px;
  margin-bottom  : 0px;
  min-height     : 0px;
}





.bordes-paneles-grises {

	border-style  : solid;
	border-radius : 7px;
	border-color  : #b3b3b3;
	border-width  : 2px;
	
}

/* Remove borders to tables */
.table-borderless tbody tr td, .table-borderless tbody tr th, .table-borderless thead tr th {
	border: none;
}

/* Custom color for panels */
.panel-default > .panel-body-custom 
{
  background: #d9d9d9; 
  
}


/* Custom color for sub-panels */
.panel-default > .panel-body-custom2 
{
  background: #e6e6e6; 
}


.disabled_label {

   color: #908D8D;
   cursor: not-allowed;
	
}


/* Centering for Goto Main Menu and Goto Login buttons on navbars */	
#GotoLoginDiv, #GotoMenuDiv
{
  position : absolute;
  width    : 100%;
  left     : -15px;
  text-align: center	
}


/* UPR copyright text format on footer nav */ 
.uprcopyrighttext
{
  width        :100%;
  min-height   :15px;
  height       :15px;
  padding-top  :-5px;
  text-align   :center  	
}


/* Image on background */
#background{
	
	position : absolute;
	width    : 40%;
	height   : 40%;
	display  :inline-block;
	z-index  : 0;
	opacity  : 0.8;
	left     : 30%;
	top      : 19%
}


/* Image on background */
#content{
	position:absolute;
	z-index:1;
}


.row
	{
	  min-height : 0;
	  height     : 100% 
	}


/* Used to vertical-align divs */

.display-table{
    display: table;
    table-layout: fixed;
}

.display-cell{
    display: table-cell;
    vertical-align: middle;
    float: none;
}



/* Changing colors to rows in tables /*
/* Even rows */
#OrdersTable tbody tr:nth-child(even) td {
  background: #ffe680;
  color: #000;
}


/* Changing colors to rows in tables /*
/* odd rows */
#OrdersTable tbody tr:nth-child(odd) td {
  background: #fff5cc;
  color: #000;
}


/* Row color when hovered */
#OrdersTable tbody tr:hover td {
  background: #ff6666;
  color: #000;
}


/* Selected row color */
#OrdersTable.dataTable tbody tr.selected td {
    color: #fff;
    background-color: #ff0000;
}



/* Changing colors to rows in tables /*
/* Even rows */
#ReceiptsTable tbody tr:nth-child(even) td {
  background: #ffe680;
  color: #000;
}


/* Changing colors to rows in tables /*
/* odd rows */
#ReceiptsTable tbody tr:nth-child(odd) td {
  background: #fff5cc;
  color: #000;
}


/* Row color when hovered */
#ReceiptsTable tbody tr:hover td {
  background: #ff6666;
  color: #000;
}


/* Selected row color */
#ReceiptsTable.dataTable tbody tr.selected td {
    color: #fff;
    background-color: #ff0000;
}




/* Changing colors to rows in tables /*
/* Even rows */
#intDeliveriesTable tbody tr:nth-child(even) td {
  background: #ffe680;
  color: #000;
}


/* Changing colors to rows in tables /*
/* odd rows */
#intDeliveriesTable tbody tr:nth-child(odd) td {
  background: #fff5cc;
  color: #000;
}


/* Row color when hovered */
#intDeliveriesTable tbody tr:hover td {
  background: #ff6666;
  color: #000;
}


/* Selected row color */
#intDeliveriesTable.dataTable tbody tr.selected td {
    color: #fff;
    background-color: #ff0000;
}


/* Changing colors to rows in tables /*
/* Even rows */
#IntDeliveryTable tbody tr:nth-child(even) td {
  background: #ffe680;
  color: #000;
}


/* Changing colors to rows in tables /*
/* odd rows */
#IntDeliveryTable tbody tr:nth-child(odd) td {
  background: #fff5cc;
  color: #000;
}


/* Row color when hovered */
#IntDeliveryTable tbody tr:hover td {
  background: #ff6666;
  color: #000;
}


/* Selected row color */
#IntDeliveryTable.dataTable tbody tr.selected td {
    color: #fff;
    background-color: #ff0000;
}

/* Changing colors to rows in tables /*
/* Even rows */
#UsersTable tbody tr:nth-child(even) td {
  background: #ffe680;
  color: #000;
}


/* Changing colors to rows in tables /*
/* odd rows */
#UsersTable tbody tr:nth-child(odd) td {
  background: #fff5cc;
  color: #000;
}


/* Row color when hovered */
#UsersTable tbody tr:hover td {
  background: #ff6666;
  color: #000;
}


/* Selected row color */
#UsersTable.dataTable tbody tr.selected td {
    color: #fff;
    background-color: #ff0000;
}


/* Changing colors to rows in tables /*
/* Even rows */
#TransactionsTable tbody tr:nth-child(even) td {
  background: #ffe680;
  color: #000;
}


/* Changing colors to rows in tables /*
/* odd rows */
#TransactionsTable tbody tr:nth-child(odd) td {
  background: #fff5cc;
  color: #000;
}


/* Row color when hovered */
#TransactionsTable tbody tr:hover td {
  background: #ff6666;
  color: #000;
}


/* Selected row color */
#TransactionsTable.dataTable tbody tr.selected td {
    color: #fff;
    background-color: #ff0000;
}





.borderfirstline
{
  border-style: solid;
  border-width: 2px;
  border-color : #585656;
  height:55px;
  max-height:55px;
  display: inline-block;		
}

.bordersexcepttop
{
  border-style: solid;
  border-width: 0px 2px 2px 2px;
  border-color : #585656;
  height:55px;
  max-height:55px;
  display: inline-block;		
}


.borderslastline
{
  border-style: solid;
  border-width: 0px 2px 2px 2px;
  border-color : #585656;
  
  display: inline-block;		
}

.bordered
{
  border-style: solid;
  border-width: 2px;
  border-color : #585656;
  height:70px;
  max-height:100px;
  display: inline-block;	
}


.ZebraDialog_body
{
  font-size: 16px;	
}

/* Background color and border of all datatable footers */
table.dataTable tfoot th, table.dataTable tfoot td 
{
    background-color: #d9d9d9	;
	border: 1px solid #000000;
}