.snapapp{
    /*position: fixed;*/
    display: flex;
    flex-direction: row;
    padding: 0;
    height: calc(100vh - 6em);
    width: 100%;
    justify-content: space-between;
    flex-wrap: nowrap;
    overflow: hidden;
    flex-grow: 10;

}

.mapToolbarResp {
    position: absolute;    
    z-index: 30000; 
    right: 2%;
    top: 1%;
}
#mapToolbarButton  li {
    margin-right: 0.2em;
    margin-left: 0.2em;
}
#mapToolbarToggled  li {
    margin-right: 0.2em;
    margin-left: 0.2em;
}

.smallmapResp {
    position: relative;
    flex: 1 50%;

}
.results{
    flex-grow: 0.5;
    /*flex-basis: 40%;*/
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* solo per Safari*/
    height: 100%;
    /*width:100%;*/
    padding-left: 1%;
    padding-right: 1%;

}

.header {
    /*background: #f0f0f0 url("/cache/custom/IMAGES/padding.png") repeat scroll 0 0;*/
    height: 72px;
    /*left: 0px;*/
    /*margin: 0;*/
    /*padding: 0px 0 0;*/
    /*position: fixed;*/
    /*top: 0;*/
    width: 100%;
    z-index: 10;
    background: darkseagreen none repeat scroll 0 0;
    background-origin: content-box;
    background-position: 0px 0;
    background-repeat: no-repeat;
    display: flex;
}



.header_content {
    align-self: center;
}
.header_generic {
    background: white;
    background-origin: content-box;
    background-position: 120px 0;
    background-repeat: no-repeat;
    background-size: calc(100% - 140px) 84px;
}

.central {
    /*float: left;*/
    /*height: 90%;*/
    /*top: 72px;*/
    /*    margin-top: 116px;*/
    width: 100%;
    /*margin-left:0;*/
    margin-top:1em;
    /*position: absolute;*/
    /*left: 0px;*/
    flex-grow: 10;
}
.workflowCentral {
    /*float: left;*/
    height: 100%;
    top: 72px;
    /*    margin-top: 116px;*/
    width: 100%;
    margin-left:0;
    margin-top:1em;
    position: absolute;
    left: 0px;
    display: none;
}
.workflowContent {
    /*float: left;*/
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    width: 80%;
}
.main {
    margin: 0px;
    height: 100%;
    width: 98%;
    margin-left: 1%;
    margin-right: 1%;
    position: relative;
    display: flex;
    flex-direction: row;
}

.login {
    /*                background-image: url("custom/IMAGES/historical_map.gif");
                    background-repeat: no-repeat;*/

}

.footer {
    /*width: 100%;*/
    height: 1em;
    border-top: 1px solid darkseagreen;
    /*position: fixed;*/
    /*background: darkseagreen none repeat scroll 0 0;*/
    /*top: calc(100% - 1em);*/
    /*left: 0;*/
}
.content {
    width:70%;
    float: left;
    overflow: scroll;
}
.rightSidebar {
   /* margin-left: 1em; 
    margin-top: 0px;
    /* position: fixed; */
    width: 0%;
    font-size: 0.9em;*/
}

.rightSidebar .rsItem {
   /* margin-bottom: 1em;*/
}
.rightSidebar .rsItem span {
    /*vertical-align: top;*/
}
/*
    calcolo esatto della larghezza del box
*/
.sectionLabelsPanel {
    margin-top: 0px;
    padding: 0px;
    list-style-type: none;

}
.sectionLabel
{
    /*font-size: 0.9em;*/
    height: 100%;
    margin-bottom: 1em;
    /*font-variant-caps: small-caps;*/
}
.selectedLabel{
    /*text-decoration: underline double red !important;*/
    /*border-bottom: 1px double currentcolor;*/
    font-weight: bold;
    font-size: 1.1em;
    /*line-height: 0.9;*/
}

.evidence
{
    /*    font-size: 0.9em;*/
    font-style: normal;
    /*font-weight: bolder;*/
    height: 100%;
    margin-bottom: 1em;
}

.leftSidebar {
    width: 0%;
    /*float: left;*/
    margin-top: 0px;
    padding: 0px;
    /*position: fixed;*/
    list-style-type: none;
}

.sectionContent {
   /* height: calc(100vh - 72px - 40px);*/
}



.sectionContent {
    border-left: 1px solid #f3f3f3;
    border-right: 1px solid #f3f3f3;
    font-size: 0.9em;
    /* margin-left: 20%; */
    margin-left: 10%;
    margin-right: 10%;
 /*  overflow: scroll;*/
    padding-right: 1px;
    padding-left: 1px;
    /* float: left; */
    width: 80%;
    /* position: fixed; */


}

a {
    text-decoration: none;
    background-color: transparent;
    /*color: #436976;*/
}

.licence {

}

.paraTitle {
    font-weight: bolder;
    font-size: 1.4em;
    margin-bottom: 2%;
    text-align: center;
}

.paraSubTitle {
    font-weight: bold;
    margin-bottom: 2%;
    list-style-type: none;
}

#map,#map_track {
    height: 100%;
    width: 100%;
}


.olControlAttribution {
    font-size: 10px;
    bottom: 5px;
    right: 5px;
}



#title, #tags, #shortdesc {
    display: none;
}

.showProjectsContent .edge div{
    right: 0;
}

.text-input
{
    height: 21px;
    width: 150px;
}
.register-table
{
    width: 100%;
    padding: 10px;
}
.register-table td, 
.register-table tr
{
    margin: 0px;
    padding: 2px;
    border-spacing: 0px;
    border-collapse: collapse;
    font-size: 12px;
}
#disableApplicationGUI {
    background-color: white;
    opacity: 0.4;
    /*    border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        box-shadow: 0 0 20px 0 #222;
        -webkit-box-shadow: 0 0 20px 0 #222;
        -moz-box-shadow: 0 0 20px 0 #222;*/
    display: block;
    height: 100%;
    left: 0;
    /*padding: 10px;*/
    position: fixed;
    top: 0;
    width: 100%;
}



#application {
    /*border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;*/
    /*            box-shadow: 0 0 20px 0 #222;
                -webkit-box-shadow: 0 0 20px 0 #222;
                -moz-box-shadow: 0 0 20px 0 #222;*/
    display: block;
    height: 100%;
    padding: 0;
    top: 0;
}

.application {
    /*border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;*/
    /*            box-shadow: 0 0 20px 0 #222;
                -webkit-box-shadow: 0 0 20px 0 #222;
                -moz-box-shadow: 0 0 20px 0 #222;*/
    display: block;
    height: 100vh;
    padding: 0;
    top: 0;
}

.applicationContent {
    /*border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;*/
    /*            box-shadow: 0 0 20px 0 #222;
                -webkit-box-shadow: 0 0 20px 0 #222;
                -moz-box-shadow: 0 0 20px 0 #222;*/
    display: flex;
    height: 100%;
    width: 100%;
    flex-direction: column;
}



.feedback_org {
    background-color: #ffffff;
    border: 1px solid #a0a0a0;
    float: left;
    font-size: 18px;
    left: 18px;
    margin-left: 8px;
    margin-top: 0;
    padding-top: 0;
    top: 60%;
    transform: rotate(90deg);
    transform-origin: left top 0;
    cursor: pointer;
} 

.label {
    left: 18px;
    margin-right: 1%;
    margin-bottom: 1%;
    font-weight: bold;
} 



.LINoStyle {    
    list-style: outside none none;
}

.HButtonBar {
    display: inline-flex;
    list-style: outside none none;
    vertical-align: middle;
}
.toolbar {
    height: 32px;
}

.reply {
    display: block;
}

.collaborationPanel{
    overflow: scroll;
}

.collaborationBody{
    height:100px;
    margin-bottom: 32px;
    overflow: scroll;
}   


.message{
    border: 1px  dashed black;
    margin-top: 10px;
    margin-bottom: 10px;
    width:  auto;
}

.searchGraph{
    height: 200px;
}
.divFloatLeft{
    float: left;

}
.splitter .rightPanel{
    overflow: auto;
}
.searchTriples {
    display: flex;
}

.windowApp{
    z-index: 239003;
}


#jqxResultsTabsPanel, .jqx-grid-table {
    font-size: 0.9em;
}


.downloadApp{
    height: 32px;
    padding-bottom: 10px;
    position: fixed;
    top: calc(100% - 4em);
}

.headerOptions {
    align-self: center;
    font-size: 0.6em;
    margin-left: auto;
    margin-right: 4%;
}

.loginWidget{
    /*font-size: 0.7em;*/
    align-self: center;
    margin: 2px;
}

.loginButton{
    cursor: pointer;
    font-size: 2em;
    margin-right: 0.2em;
    margin-left: 0.2em;
}
/*.loginButton{
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
    padding: 4px;
    font-size-adjust: 0.7;
    padding: 2px;
    margin: 2px;

}*/

.genericButton{
    background: #f0f0f0 none repeat scroll 0 0;
    border: 1px solid;
    border-radius: 5px;
    cursor: pointer;
    /*font-size: 1.2em;*/
    /*font-weight: bolder;*/
    /*margin: 4px;*/
    padding: 4px;
    vertical-align: middle;
}

.loginForgotPassword{
    cursor: pointer;
    font-size: 1em;
}

.notificationMessagePanel{
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 2%;

}

.notificationMessageClose{
    font-size:2em;
    float:left;
}
.notificationMessage{
    align-self: left;
    cursor: pointer;
    font-size: 1.2em;
    background: white;
    margin-top: 5%;
    /*white-space: nowrap;*/
}

.userInteractionPanel{
    position: fixed;
    width: 100%;
    visibility: hidden;
    z-index: 1000;
    height: 100%;
    margin: 0px;
    padding: 0px;
    border: 1px solid;
    top: 0;
    left: 0;

}

.snapCaption{
    cursor: pointer;
    position: relative;
    display: table-row;
    margin: 0px;
    padding: 0px;
    float: right;
}
.snapCaption span {
    font-size: 1.4em;
}
.snapContent{
    display: table-row;
}
.snapPanel{
    cursor: default;
    background: white;
    border-radius: 5px;
    left: 50%;
    top: 20%;
    height: auto;
    transform: translateX(-50%);
    border: 2px solid;
    z-index: 1;
    padding: 1%;
    position: absolute;
    width: 60%;
    display: table;
}
.snapDialog{
    position: fixed;
    width: 100%;
    visibility: hidden;
    z-index: 1000;
    height: 100%;
    margin: 0px;
    padding: 0px;
    top: 0;
    left: 0;
    background: transparent;
    left: 0;


}
.info {
    background: white none repeat scroll 0 0;
    border-color: green;
}

.warning{
    background: white none repeat scroll 0 0;
    border-color: red;
}

.loginForm{
    display: flex;

}
.loginWelcome{
    display: flex;
    flex-direction: row;

}

.welcomeCaption {
    align-self: center;
    display: flex;

}
.welcomeOptions {
    align-self: center;
}

.hidden {
    display: none !important;
}



.loginFormInput, .loginFormCommand{
    display: flex;
    flex-direction: row;
    margin: 0;
    padding: 0;
}

.leftSidebarCollapsed{
    display: none;
}

.welcome ,.welcomeName{
    font-size: 1.4em;

}

.welcomeName {
    font-weight: bold;
    margin-right: 1%;
}

.welcome {
    margin-right: 0.5em;
}
.snapQR{
    position: fixed;
    top: calc(100% - 4em - 6em);
}

.windowContent {
    margin: 2%;
}

.octopusSearch {
    margin: auto;
    overflow: hidden;
    padding: 0;
    width: 80%;
}


.app {
    width: 100%;
    margin-top: 0px;
    height: calc(100vh - 10%)

}
.appContent {
    height: 100%;
    width: 100%;
}


.appToolbar{
    margin: 1%;
    align-self: center;


}


.central.mini{
    top: 3em;
}

.header.mini {
    height: 3em;
}



.logoOGS {
    margin-right: 1%;   
}

.logoOGSImg  {
    height: 60px;
}
.logoSNAPImg  {
    height: 78px;
}

.logoOGSImg.mini  {
    height: 22px;
}

.logoSNAPImg.mini  {
    height: 4em;
}

.actionsPanel{
    /*display: flex;*/
    /*height: 1em;*/
}

.contentActions{
}



@media only screen and (min-width: 640px) {

    body { font-size: 1em;
           /*font-family: "Courier New", Courier, monospace;*/
	  overflow-x: hidden !important;
    }

}


@media only screen and (max-width: 500px) {
    body { font-size: 0.5em;
           height           : 100%;
           margin           : 0;
           padding          : 0;
           width            : 100%;
	   overflow-x: hidden !important;
    }

    .snapapp{
        flex-direction: column;
    }
    /*tocca fare perche' safari senza heigh non funzia, e con non funzia chrome'*/
    #map,#map_track {
        height: 50%;
        width: 100%;
    }
    .loginForm{
        flex-direction: column;
    }

    .loginFormCommand{
        flex-direction: row;
    }

    /*    .loginWelcome{
            flex-direction: column;
        }*/

    .loginWelcome {
        flex-direction: column;
    }

    .welcomeCaption {
        margin-bottom: 1em;
        align-self: left;
    }

    .welcomeOptions {
        align-self: left;
    }

    .loginWidget {
        align-self: left;
    }

    .loginWelcome .loginWidget {
        align-self: center;
    }
    .loginFormInput {
        flex-direction: column !important;
    }

    .appContent{

    }
    .logoOGSImg {
        width: 32px;
        height: auto;
    }

    .header.mini {
        height: 4em;
    }
    .central.mini {
        top: 4em;
    }
}




@media only screen and (min-width: 500px) and (max-width: 720px) {

    body { font-size: 0.8em;
           height           : 100%;
           margin           : 0;
           padding          : 0;
           width            : 100%;
	   overflow-x: hidden !important;
    }



    .loginWelcome {
        flex-direction: row;
    }
    .welcomeCaption {
        /*margin-bottom: 2em;*/
        align-self: center;
    }

    .welcomeOptions {
        align-self: center;
    }
    .loginWidget {
        align-self: left;
    }

    .loginWelcome .loginWidget {
        align-self: center;
    }



    .loginFormInput {
        flex-direction: column !important;
    }


    .loginFormCommand{
        flex-direction: column;
    }
}

@media only screen and (max-height: 640px) {

    body { font-size: 0.8em;
           height           : 100%;
           margin           : 0;
           padding          : 0;
           width            : 100%;
	   overflow-x: hidden !important;
    }

    /*    .central{
            top: 2%;
        }
        
        .header {
            height: 5%;
        }*/

    /*    .header_content{
            display: none;
        }*/
}




/*.applicationContent{
    height: 100%;
}*/


.feedbackPanel {
    padding: 1%;
}
.feedbackTitle {
    font-size: 1.2em;
    font-weight: bold;
    border-bottom: 1px dotted;
    margin-bottom: 4%;
}
.feedbackForm > div {
    margin-top: 1%;
    margin-bottom: 2%;
}

.basketPanel {
    padding: 1%;
}
.basketTitle {
    font-size: 1.2em;
    font-weight: bold;
    border-bottom: 1px dotted;
    margin-bottom: 4%;

}
.basketForm > div {
    margin-top: 1%;
    margin-bottom: 2%;
}

.basketSummary{
    height: 400px;
    overflow: auto;
}

.basketSummarySectionLabel{
    font-weight: bold;
    font-size: 1.1em    ;
    text-decoration-line: underline;
    margin-bottom: 1.1em;
    margin-top: 1.1em;
}

a.wizardButton{
    cursor: pointer;
}


a.button {
    /*font-size: 1.5em;*/
    cursor: pointer;    
    padding: 1px;
    background: transparent;
    border-radius: 4px;
    border: 1px solid transparent;
    margin-right: 0.2em;

}
a.toolbarButton {
    font-size: 1.5em;
}

a.button.off, a.wizardButton.off{
    color: lightgray;
}

a.button.on {
    color: #33271c;
}

a.button.select  {
    background: yellow;
    border: 1px solid black;
}

.contentActions >span {
    width: 1.4em;
    text-align: center;
    display: inline-block;
    font-size: 1.2em;
}

.snapTable {
    display: table;
    width: 100%;
}
.snapTable > div:hover {
    background: lightgray;
}

.basketFilled {
    color: #DC0000;
}

.basketItems > div:nth-child(2):hover {
    background: lightgray;
}
.basketItems .tableRow {
    display: table-row;
    height: 2em;
    vertical-align: middle;
}

.tableRow  span{
    display: table-cell;
    vertical-align: middle;
}
.tableRow  span:first-child{
    width: 60%;
}


div.toolbar .wizardButton {
    font-size: 2em;
}

.wizardPanelTab .toolbar{
    margin-bottom: 1em;
}