/*@import url('https://fonts.googleapis.com/css?Lobster');*/

body {font-family: Arial, Helvetica, sans-serif;background-color:#313538;}
form {border: 3px solid #313538;}

/****************************  INPUT *****/
input[type=text], input[type=password] {
    width: 60%;
    padding: 12px 20px;
    margin: 10px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-size: 16px;
}

input[type=submit] {
	background-color: #088A08;
    width: 90%;
    padding: 12px 20px;
    margin: 10px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-size: 16px;
}


input[type=submit]:hover {
    opacity: 0.7;
}

input.kliento_kodas {
    width: 40%;
}

/****************************  BUTTON *****/
button {
    /* background-color: #4CAF50; */
    background-color: #f44336;
    color: white;
    padding: 12px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 90%;
    font-size: 16px;
}


button:hover {
    opacity: 0.7;
}

button.btn_login {
    width: auto;
    padding: 12px 50px;
    background-color:#088A08;
    width: 40%;
    font-size: 16px;
	}

button.btn_cancel {
    width: 40%;
    padding: 12px 50px;
    background-color: #f44336;
    font-size: 16px;
    }

div.imglogotip {
    text-align: center;
    margin: 24px 0 12px 0;
}

img.logotip {
    width: 40%;
    border-radius: 5%;
}

.container {
    padding: 16px 5px;
    text-align: center;
}

/***************************** PHARAGRAF Text caption | Text value */
p.caption{	
    width: 90%;
    padding: 12px 1px;
	color: #EFFBFB;
	font-size: 16px;
}

p.user{	
    width: 90%;
    padding: 12px 50px;
	color: #EFFBFB;
	font-size: 16px;
    text-align: center;
}

.cradio{	
    width: 90%;
	/* width: 300px; */
    padding: 1px 10px;
	/* background-color: white; */
	color: #EFFBFB;
	font-size: 22px;
	/* border: 2px solid #0040FF; */
}

.value{	
    width: 90%;
    padding: 12px 1px;
    background-color: #EFFBFB;
	font-size: 20px;
	}

.value-date{	
    width: 90%;
    padding: 12px 10px;
    background-color: #EFFBFB;
    font-family: Courier;
    font-size: 20px;
}
	
.TPvnr{
    padding: 1px 12px;
    width: 100px;
    background-color: white;
    font-size: 22px;
    border: 2px solid #0040FF;
}

.TPpav{
    width: 100px;
    background-color: white;
    font-size: 20px;
    border: 2px solid #0040FF;
}


/*hr.inner{
/*********** Change styles on small and extra small screens *******/
@media screen and (max-width: 680px) {
    button.btn_cancel     {width: 60%;}
    button.btn_login       {width: 60%;}
    input.kliento_kodas {width: 60%;}  
    img.logotip               {width:60%;}
}

@media screen and (max-width: 400px) {
    button.btn_cancel     {width: 100%;}
    button.btn_login       {width: 100%;}
    input.kliento_kodas {width: 100%;}  
    img.logotip               {width:80%;}
}