html{


}


body {

    background:  #55949C;

    font-family: 'lato', sans-serif;
    font-size: 16px;
    color: #3f3f3f;
}

/* general structure of page */

.h1 {
    padding-bottom: 40px;
    color: #ffffff;
}

.h3 {
    text-align: center;
    padding: 10px 10px 10px 25px;
    color: #ffffff;
}



A:link { color: #ffffff}
A:visited {color: #ffffff }
A:active { color: #ffffff }
A:hover {color: #ffffff }

.link {
    text-align: center;
    color: #ffffff;
    width: 100%;
    max-width: 330px;
    padding: 10px;
    margin: auto;
}

th, td {
    padding: 8px;
    vertical-align: top;

}

th { border-bottom: 1px solid rgb(255, 255, 255); }

.tableright {
    text-align: right;


}


.center{
    text-align: center;
}

.box {

    top: 50px;
    bottom: -50px;
    background:  #f9fbff;
    position: relative;
    left: 5%;
    padding-bottom: 50px;
    width: 90%;
    border-radius: 10px;
    box-shadow: 5px 5px 15px rgba(119, 119, 119, 0.5);
}
.spacebox {
    position: relative;
    height: 70px;
    width: 90%;

}

.spacebox3 {
    padding-top: 50px;
    text-align: center

}

.btn-primary{  text-align: center; }




.textbox {

    position: relative;
    padding: 10px 10px 10px 25px;
    height: 70px;
    left: 5%;
    width: 90%;

}

.glyphicon {
    font-size: 25px;
}

.box2 {
    background:  #55949C;
    position: relative;
    color: #ffffff;
    top: 30px;
    bottom: 30px;
    left: 5%;
    width: 90%;
    border-radius: 10px;
    box-shadow: 5px 5px 15px rgba(119, 119, 119, 0.5);
}

div.pre-space{
    display: none;

}

.box3 {


    background:  #ffffff;
    position: relative;
    top: 30px;
    bottom: 30px;
    left: 5%;

    width: 90%;
    border-radius: 10px;
    box-shadow: 5px 5px 15px rgba(119, 119, 119, 0.5);
}


/* Style for the dialog field */

.bubble {
    position: relative;
    display: inline-flex;
    margin-bottom: 5px;
    color: #f9fbff;
    /*font-size: 1.0em;*/
    padding: 10px 10px 10px 25px;
    border-radius: 15px;
}
.incoming {
    padding: 10px;
    padding-right: 20%;
    text-align: left
}
.incoming .bubble {
    background: #b2b2b2;
}

.outgoing {
    padding: 20px;
    padding-left: 20%;
    text-align: right
}
.test {
    padding-left: 30px;
}

.outgoing .bubble {
    background: #00bcd1;
}

/* Style for the login field */

.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 10px;
    margin: auto;
}
.form-signin .checkbox {
    font-weight: 600;
}
.form-signin .form-control {
    position: relative;
    box-sizing: border-box;
    height: auto;
    padding: 10px;
    font-size: 16px;
}
.form-signin .form-control:focus {
    z-index: 2;
}
.form-signin input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* Collaps css for dialog details */
.collapsible {
    margin-top: 50px;
    text-align: center;

}

.collapsible:hover {
    background-color: #555;
}

.content {
    padding: 0 18px;
    max-height: 0;
    overflow: hidden;

    background-color: #f1f1f1;
}

/* configuration side */

.form-style-2{
    color: #ffffff;
    max-width: 900px;
    padding: 20px 20px 20px 20px;
}
.form-style-2-heading{
    margin-bottom: 20px;
    padding-bottom: 30px;
    font-family: 'lato', sans-serif;
    font-size: 29px;
}
.form-style-2 label{
    display: block;
    margin: 0px 0px 15px 0px;

}
.form-style-2 label > span{
    width: 100px;
    display: block;
    float: left;
    padding-top: 8px;
    padding-right: 30px;


}
.form-style-2 span.required{
    color:red;
}
.form-style-2 .tel-number-field{
    width: 40px;
    text-align: center;
}
.form-style-2 input.input-field, .form-style-2 .select-field{
    color: #313131;
    width: 70%;
}
.form-style-2 input.input-field,
.form-style-2 .tel-number-field,
.form-style-2 .textarea-field,
.form-style-2 .select-field{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border: 1px solid #C2C2C2;
    box-shadow: 1px 1px 4px #EBEBEB;
    -moz-box-shadow: 1px 1px 4px #EBEBEB;
    -webkit-box-shadow: 1px 1px 4px #EBEBEB;
    border-radius: 4px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    padding: 7px;
    outline: none;
}
.form-style-2 .input-field:focus,
.form-style-2 .tel-number-field:focus,
.form-style-2 .textarea-field:focus,
.form-style-2 .select-field:focus{
    border: 1px solid #0C0;
}
.form-style-2 .textarea-field{
    height:100px;
    width: 80%;
}

.form-style-2 .btn{

    color: #3f3f3f;
    width: 35%;

}

/* config side */

.form-style-3{
    color: #ffffff;
    max-width: 900px;
    padding: 20px 20px 20px 20px;
}
.form-style-3-heading{
    margin-bottom: 20px;
    padding-bottom: 30px;
    font-family: 'lato', sans-serif;
    font-size: 29px;
}
.form-style-3 label{
    display: block;
    margin: 0px 0px 15px 0px;

}
.form-style-3 label > span{
    width: 100px;
    display: block;
    float: left;
    padding-top: 8px;
    padding-right: 30px;


}
.form-style-3 span.required{
    color:red;
}
.form-style-3 .tel-number-field{
    width: 40px;
    text-align: center;
}
.form-style-3 input.input-field, .form-style-2 .select-field{
    color: #313131;
    width: 90%;
}
.form-style-3 input.input-field,
.form-style-3 .tel-number-field,
.form-style-3 .textarea-field,
.form-style-3 .select-field{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border: 1px solid #C2C2C2;
    box-shadow: 1px 1px 4px #EBEBEB;
    -moz-box-shadow: 1px 1px 4px #EBEBEB;
    -webkit-box-shadow: 1px 1px 4px #EBEBEB;
    border-radius: 4px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    padding: 7px;
    outline: none;
}
.form-style-3-heading .input-field:focus,
.form-style-3 .tel-number-field:focus,
.form-style-3 .textarea-field:focus,
.form-style-3.select-field:focus{
    border: 1px solid #0C0;
}
.form-style-3 .textarea-field{
    height:100px;
    width: 55%;
}

.form-style-3 .btn{

    color: #3f3f3f;
    width: 35%;

}