/* 
    Document   : megaapp
    Created on : Oct 6, 2013, 1:04:33 AM
    Author     : Hazem Saleh <hazems@apache.org>
    Description:
        Custom styles for MegaApp application.
*/

.form-center {
    background-color: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    margin: 0 auto 20px;
    max-width: 300px;
    padding: 19px 29px 29px;
}

.bigErrorMessage {
    color: red;
    font-size: 35px;
}

.errorMessage {
    color: red;
    font-size: 15px;
}

.informationMessage {
    color: green;
    font-size: 15px;
}

.p-gridsetup {
    /* background-color: rgba(0,0,0,.2);*/
    padding: 20px;
    margin-bottom: 5px;
    height: 600px;
}


/*
.p-grid div {
    background-color: rgba(0,0,0,.4);
    border-radius: 10px;
    padding: 10px;
    width: 250px;
    margin-bottom: 20px;
    margin-right: 20px;
}
*/

.style-1 {
    color: white;
}
.style-1:hover {
    color: white;
} 
.style-1:focus {
    color: white;
    font-weight: bold;
    text-decoration: none;
}
.right-j {
    float: right;
}

.box {
    /*
    background-color: #cce4f7;
    */
    background-color: rgba(0,0,0,.4);
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
    border-radius: 4px;

}

.f-container {
    display: flex;
    flex-flow: row wrap;
    background-color: rgba(0,0,0,.2);
    padding: 20px;
    margin-bottom: 20px;
    /* height: 600px;*/
}
.f-container div {
    background-color: rgba(0,0,0,.4);
    text-align: center;
    border-radius: 10px;
    padding: 10px;
    width: 250px;
    margin-bottom: 20px;
    margin-right: 20px;
}

.f-stretch {
    align-content: stretch;
}

.content-1{  
    padding: 25px;
    margin: 50px;
}


td.right {
    text-align: right;
}

.hide-column-names table thead tr
{
    display: none !important;
}

.owl-next:focus, .owl-prev:focus {outline: none;}

.ui-carousel-nav {
    visibility: hidden;
}

.sidebar-width{
    width: 440px;
}

.sidebar-width-max{
    width: 1200px;
}

.darksidebar-width{
    width: 440px;
    background-color: #222;    
}

.sidebar-width-wider{
    width: 500px;
}

.sidebar-width-wider2{
    width: 600px;
}

.sidebar-width-wider4{
    width: 780px;
}


.darksidebar-width-wider{
    width: 500px;
    background-color: #222;
}

.sidebar-width-t{
    width: 420px;
    background: rgba(250, 250, 250, 0.20); 
}

.sidebar-heigh-t{    
    height: 860px;       
    background: rgba(250, 250, 250, 0.36); 
}

.sidebar-heigh-tw{    
    height: 800px;       
    background: rgba(250, 250, 250, 0.36); 
}

.ui-darkpanelgridnb.ui-panelgrid>*>tr,
.ui-darkpanelgridnb.ui-panelgrid .ui-panelgrid-cell {
    background-color: #222; 
    border: none;          
}  

.ui-darkpanelgrid, .ui-darkpanelgrid td { 
    background-color: #222; 
    border: #222 solid 1px !important;

}   


.ui-tdarkpanelgrid, .ui-tdarkpanelgrid td { 
    background-color: transparent !important; 
    border: none;}



.ui-text {
    color: #777; 
}

.ui-text-light {
    color: #222; 
} 

.ui-text-dark {
    color: #E5E5E5; 
} 

.ui-dark-row {
    background-color: #222 !important;
    background-image: none !important;
    color: #E5E5E5 !important;
}

.ui-dark-row2 {
    background-color: #17141d! important;
    background-image: none !important;
    color: #E5E5E5 !important;
}

.outerpanelgrid>tbody>tr{
    border: none !important;
    background-color: white !important;
}
.outerpanelgrid>tbody>tr>td{
    border: none !important;
    background-color: white !important;
}


.ui-darkheader .ui-datatable-header, 
.ui-darkheader .ui-paginator-page, 
.ui-darkheader .ui-paginator,                                     
.ui-darkheader thead th,
.ui-darkheader thead tr,                                                                                    
.ui-darkheader tbody,
.ui-darkheader tbody tr,                                    
.ui-darkheader tbody td                                     
{
    background-image: none !important;
    background-color: #222 !important;
    color: #E5E5E5 !important;
    border: hidden !important;    
    border-style: none !important;
}

.ui-darkheader2 .ui-datatable-header, 
.ui-darkheader2 .ui-paginator-page, 
.ui-darkheader2 .ui-paginator,                                     
.ui-darkheader2 thead th,
.ui-darkheader2 thead tr,                                                                                    
.ui-darkheader2 tbody,
.ui-darkheader2 tbody tr,                                    
.ui-darkheader2 tbody td                                     
{
    background-image: none !important;
    background-color: #17141d!important;
    color: #E5E5E5 !important;
    border: hidden !important;    
    border-style: none !important;

}

.ui-darkheader3 .ui-datatable-header, 
.ui-darkheader3 .ui-paginator-page, 
.ui-darkheader3 .ui-paginator,                                     
.ui-darkheader3 thead th,
.ui-darkheader3 thead tr,                                                                                    
.ui-darkheader3 tbody,
.ui-darkheader3 tbody tr,                                    
.ui-darkheader3 tbody td ,
.ui-darkheader3 table thead tr
{
    background-image: none !important;
    background-color: #17141d!important;
    color: #E5E5E5 !important;
    border: hidden !important;    
    border-style: none !important;

}

.ui-tableplan-dark{
    background-color: #2F3538 !important;
    background-image: none !important;
    color: #E5E5E5 !important;
} 

.ui-dlgheader-dark{
    background-color: #535353 !important;
    background-image: none !important;
    color: #E5E5E5 !important;
} 




.foo>tbody>tr>td {
    vertical-align: top;
}

.foonoborder>tbody>tr>td {
    border: none !important;
    vertical-align: top;
}



/*
@-webkit-keyframes logo {
  from {
    -webkit-transform: rotate(0) scale(.5);
    left: 120%;
  }
  50% {
    -webkit-transform: rotate(-720deg) scale(.5);
    left: 0;
  }

  to {
    -webkit-transform: rotate(0) scale(1);
  }
}

@keyframes logo {
  from {
    transform: rotate(0) scale(.5);
    left: 120%
  }

  50% {
    transform: rotate(-720deg) scale(.5);
    left: 0;
  }

  to {
    transform: rotate(0) scale(1);
  }
}

.logo {
    -webkit-animation: logo 3s;
    animation: logo 3s;
}
*/