/* cara-PanelWindow */
.cara-PanelWindow {
    display: none;
    position: fixed;
    margin: auto 10%;
    z-index: 1050;
    width: 80%; /* Could be more or less, depending on screen size */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    transition: all 0.5s ease-out;
    right:0;
    overflow:auto;
}
.cara-PanelWindow.cara-PanelWindow-dockRight {
    display: none;
    position: fixed;
    right: 0;
    top: 0;
    margin: 0;
    margin-top: 50px;
    z-index: 1050;
    width: 20%; /* Could be more or less, depending on screen size */
    transition: width 0.5s ease-out;
}

@media screen and (max-width: 640px) {
    .cara-PanelWindow {
    margin: auto;
    width:100%
    }
    .cara-PanelWindow.cara-PanelWindow-dockRight {
        width: 99%; /* Could be more or less, depending on screen size */
    }

}
.cara-PanelWindow.cara-PanelWindow-dockRight .panel-body {
overflow-y:auto;
overflow-x:hidden;
}
/*.cara-PanelWindow.cara-PanelWindow-dockRight .panel-heading button[data-action="close"] {
    display: none;
}*/
.cara-PanelWindow.cara-PanelWindow-withClose.cara-PanelWindow-dockRight button[data-action="close"] {
    display: inline-block;
}
.cara-PanelWindow.cara-PanelWindow-dockRight button[data-action="close"] {
    display: none;
}
.cara-PanelWindow.cara-PanelWindow-center button[data-action="cancel"] {
display:none;
}

.cara-PanelWindow .cara-PanelWindowContent {
    background-color: #fefefe;
    margin: auto; /* 15% from the top and centered */
    padding: 0px;
    border: 1px solid #888;
    width: 100%; /* Could be more or less, depending on screen size */
    transition: width 0.5s ease-out;
    right:0;
}
.cara-PanelWindow.cara-modal, .cara-PanelWindow.cara-modal.cara-PanelWindow-dockRight{
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1070; /* Sit on top */
    right: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow-y: auto; /* Enable scroll if needed */
    overflow-x: hidden; 
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    margin:0;
    transition: all 0.5s ease-out;
}
.cara-PanelWindow.cara-modal .cara-PanelWindowContent {
    background-color: #fefefe;
    /*margin: 15% auto; 15% from the top and centered */
    padding: 10px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
    transition: width 0.5s ease-out;
    margin-top:20px
}
/*.cara-PanelWindow.cara-modal.cara-PanelWindow-center .cara-PanelWindowContent {
    margin:5% auto;
}*/

.cara-PanelWindow.cara-modal.cara-PanelWindow-dockRight .cara-PanelWindowContent {
    background-color: #fefefe;
    margin: 0 0 0 auto; /* 15% from the top and centered */
    padding: 10px;
    border: 1px solid #888;
    width: 100%; /* Could be more or less, depending on screen size */
    transition: width 0.5s ease-out;
}
.cara-PanelWindow.cara-PanelWindow-dockRight .cara-PanelWindowContent {
    height:100%;
}


.cara-PanelWindow.cara-PanelWindow-reduce{
    /*transform-origin: right;
    transform: translate(0%,0%) rotate(-90deg) translate(17px,-18px);
    -ms-transform: translate(0%,0%) rotate(-90deg) translate(17px,-18px); 
    -webkit-transform: translate(0%,0%) rotate(-90deg) translate(17px,-18px); */
    float:right;
    right:0;
    margin-right:0;
    transition: width 0.5s ease-out;
    width:130px;
}
.cara-PanelWindow.cara-PanelWindow-reduce .cara-PanelWindow-reduce-Titre {
    display:block;
    text-align:right;
    width:100%;
    transition: all 0.5s ease-out;
    opacity: 1; 
    height: auto;
    overflow: hidden;

}
.cara-PanelWindow.cara-PanelWindow-reduce .cara-PanelWindowContent {
    /*display:none;*/
    /*opacity: 0; 
    height: 0;*/

}
.cara-PanelWindow .cara-PanelWindow-reduce-Titre {
    /*display:none;*/
    opacity: 0; 
    height: 0;
    transition: all 0.5s ease-out ;
}
.cara-PanelWindow.cara-modal .cara-PanelWindow-reduce-Titre {
    display:none;
    opacity: 0; 
    height: 0;
    transition: all 0.5s ease-out ;
}

.cara-PanelWindow .cara-PanelWindowContent {
    display:block;
    /*transition: opacity 2s ease-out;
    opacity: 1; 
    height: auto;*/
}
.cara-PanelWindow .loading {
    background-color: lightgray;
    font-family:Verdana;
    font-size:20px;
    color:red;
}


/*  cara-PanetWindow end  */