@import "http://fonts.googleapis.com/css?family=Droid+Serif";
/* Above line is used for online google font */

h2 { text-align:center; font-size:24px }
hr { margin-bottom:30px; }
p { color:#000; font-size:16px; font-weight:700; }


#button { border:1px solid #0c799e; width:250px; padding:10px; font-size:16px; font-weight:700; color:#fff; border-radius:3px; background:linear-gradient(to bottom,#59d0f8 5%,#49c0e8 100%); cursor:pointer; }
#button:hover { background:linear-gradient(to bottom,#49c0e8 5%,#59d0f8 100%); }

input[type=text] { margin-top:5px; margin-bottom:20px; width:96%; border-radius:5px; border:0; padding:5px 0; }
#name, #email { padding-left:10px; }
input[type=submit] { width:30%; border:1px solid #59b4d4; background:#0078a3; color:#eee; padding:3px 0; border-radius:5px; margin-left:33%; cursor:pointer; }
input[type=submit]:hover { border:1px solid #666; background:#555; color:#fff; }

.ui-dialog .ui-dialog-content { padding:2em; }




input[type=text] { margin-top:5px; margin-bottom:20px; width:100%; border-radius:5px; border:0; padding:5px 0; }
input[type=email] { margin-top:5px; margin-bottom:20px; width:100%; border-radius:5px; border:0; padding:5px 0; }
input[type=number] { margin-top:5px; margin-bottom:20px; width:100%; border-radius:5px; border:0; padding:5px 0; }
input[type=tel] { margin-top:5px; margin-bottom:20px; width:100%; border-radius:5px; border:0; padding:5px 0; }

input[type=checkbox] { width:10%; border:1px solid #59b4d4; color:#eee; padding:10px 0; border-radius:5px; margin-left:5%; cursor:pointer; }

input[type=submit] { width:33%; border:1px solid #59b4d4; background:#0078a3; color:#eee; padding:3px 0; border-radius:5px; margin-left:10%; cursor:pointer; }
input[type=submit]:hover { border:1px solid #666; background:#555; color:#fff; }

input[type=reset] { width:33%; border:1px solid #59b4d4; background:#0078a3; color:#eee; padding:3px 0; border-radius:5px; margin-left:5%; cursor:pointer; }

.ui-dialog .ui-dialog-content { padding:2em; }

div.container { /*background-color:blue;*/ width:960px; height:610px; margin:50px auto; font-family:'Droid Serif',serif; position:relative; }
div.main { width:320px; margin-top:35px; float:left; padding:10px 55px 25px; background-color:rgba(204,204,191,0.51); border:15px solid #fff; box-shadow:0 0 10px; border-radius:2px; font-size:13px; text-align:center; }


html, 
body,
#mapViewDiv { height: 100%; width: 100%; margin: 0; padding: 0; font-family: sans-serif; }
.panel-container { position: relative; width: 100%; height: 100%; }

.panel-side { padding: 2px; box-sizing: border-box; width: 300px; height: 100%; position: absolute; top: 0; right: 0; color: #fff; background-color: rgba(0, 0, 0, 0.6); overflow: auto; z-index: 60; }
.sidenav, .sidenav2 { height: 100%; width: 0; position: fixed; z-index: 1; top: 0; left: 0; /*background-color: #f2f2f2;*/ background-color: #f2f2f2; overflow-x: hidden; transition: 0.5s; padding-top: 0; }
.sidenav a, .sidenav2 a { color: #f1f1f1; display: block; background-color: #005ce6; width: auto; }
.sidenav .form-header, .sidenav2 .form-header { background-color: #005ce6; display: flex; flex-direction: row; }
.sidenav h3, .sidenav2 h3 { font-size: 25px; color: #f1f1f1; display: inline-block; height: 60px; margin: 0 0 0 18px; padding: 15px 0; }
.sidenav .closebtn { margin: 0; padding: 0; height: 60px; width: 50px; text-decoration: none; background-image: url('../../images/close.png'); background-size: 30px 30px; background-position: center; background-repeat: no-repeat; margin-left: 10px; /*margin-left: 28px;*/ }
.sidenav2 .closebtn { margin: 0; padding: 0; height: 60px; width: 50px; text-decoration: none; background-image: url('../../images/close.png'); background-size: 30px 30px; background-position: center; background-repeat: no-repeat; margin-left: 10px; /*margin-left: 85px;*/ }










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


.sidenav {
    padding-top: 15px;
}

    .sidenav a {
        font-size: 20px;
    }
}

        /*side 2*/

/*
        .sidenav2 {
            height: 100%;
            width: 0;
            position: fixed;
            z-index: 1;
            top: 0;
            left: 0;
      background-color: #f2f2f2;
            background-color: #f2f2f2;
            overflow-x: hidden;
            transition: 0.5s;
            padding-top: 00px;
        }

            .sidenav2 a {
                padding: 8px 8px 8px 8px;
                text-decoration: none;
                font-size: 25px;
                color: whitesmoke;
                display: block;
                transition: 0.1s;
                background-color: #005ce6;
                width: auto;
                height: 40px;
            }

*/
                

        @media screen and (max-height: 450px) {
            .sidenav2 {
                padding-top: 15px;
            }

                .sidenav2 a {
                    font-size: 20px;
                }
        }