/*------------------------------------------------------------------------
# BASE Offline Web App - Dec 15, 2024 / Last Updated: 12/15/2024
# ------------------------------------------------------------------------
# Designed by SAVAGENERD/K-Rock for BASE
# Websites:  https://basepages.com -  Email: contact@basepages.com
--------------------------------------------------------------------------
*/
*{
    margin:0;
    padding:0;
    font-family: 'Open Sans',Helvetica, Arial, sans-serif;
    box-sizing: border-box;
	font-weight:300;
}
html {
	/*background: url(../images/bg.jpg) no-repeat center;
	background-color:#222;*/
/*	background-color:#009bfe;
	background:#009bfe;*/
	padding:0 !important;
	margin:0 !important;
	/*height:auto;*/
	width:100%;
	background-size: cover;
	overflow:auto;
	background-color:#000000;
	min-height: calc(100% + env(safe-area-inset-top)) !important;
	/*			padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);*/
	/*background-attachment: fixed;
	background-image: url('images/bgmount.jpg') !important;*/
	/*background: url('/images/bgmount.jpg') no-repeat;*/
	/*background-position: center;
	background-repeat: no-repeat;
	background-size: cover;*/
/*	min-height: calc(100% + env(safe-area-inset-top)) !important;
	padding-top: constant(safe-area-inset-top);
	margin-top: -constant(safe-area-inset-top);*/
}
body{
    font-size: 15px;
    min-height:100vh;
	padding:0 !important;
	margin:0 !important;
	/*background-color:#009bfe;*/
	background: linear-gradient(
		135deg,
		#009bfe,
		#8525ee,
		#35126a
	);
}
a, a:active, a:visited  { color:#0077ff; text-decoration:none; }
a:hover { color:#fff; text-decoration:none; }
#wrapper{
	/*background:#009bfe;*/
	/*position:absolute;
	top:-50px !important;
	min-height: calc(100% + env(safe-area-inset-top)) !important;
	/*			padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);*/
	/*background-attachment: fixed;
	background-image: url('../images/bgmount.jpg') !important;*/
	/*background: url('/images/bgmount.jpg') no-repeat;*/
	/*background-position: center;
	background-repeat: no-repeat;
	background-size: cover;*/
	padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    width:100%;
	margin-top:0px !important;
	min-height:100%;
	text-align:center;
	font-family:'Open Sans',sans-serif;
	color:#fff;
	font-weight:300;
	font-size:22px;
	line-height:32px;
}
#taskform{
    width: 100%;
    text-align: center;
}

#taskform input{
    font-size: 15px;
    height: 2em;
    font-weight: bold;
    border: 1px #808080 solid;
    border-radius: 5px;
}

#taskform #task{
    width:80%;
    padding:0 0 0 10px;
}
#taskform input[type='submit']{
    width:15%;
    background-color: #3ea637;
}

#tasklist{
    width:90%;
    margin: 2em auto;

    padding: 0 1em;
    list-style: none;
}


#tasklist li{
    position:relative;
    padding:3px;
    font-size: 1.2em;
    list-style: none;
}
#tasklist li div{
    display: inline;
}

#tasklist li span{
    float:right;
}
#reset, #learnmore{
    display: block;
    width:80%;
    margin: 20px auto;
    font-size: 15px;
    height: 2em;
    font-weight: bold;
    background-color: #3ea637;
    border: 1px #808080 solid;
    border-radius: 5px;
}

#taskform input[type='submit']:disabled, #reset:disabled{
    background-color: #a6282f;
    color:#808080;
}

p#status
{
	/*width: 6em;*/
	width:100%;
	font-weight: 300;
	font-size:14px;
	text-align: center;
	text-transform: uppercase;
	/*padding: 4px;*/
	color: #fff;
	background-color: #090;
	/*position:absolute;*/
	/*bottom:0;
	right:0;*/
	line-height:30px;
	height:30px;
	letter-spacing:2px
}

p#status.offline
{
	background-color: #900;
}
input[type="button"], .button {
	font-weight: 800 !important;
}
a.buttonblue { 
	/*background: rgba(255,255,255,.5); */
	color: white;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #006ccc;
	background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
	background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
	background-image: -o-linear-gradient(top, #0088cc, #0044cc);
	background-image: linear-gradient(to bottom, #0088cc, #0044cc);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0088CC', endColorstr='#FF0044CC', GradientType=0);
	border-color: #0044cc #0044cc #002a80;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	padding:15px 20px;
	text-decoration:none;
	-moz-transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;	
	border-radius: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px;
	max-width:250px;
	display:block;
}
a.buttonblue:hover, a.button:hover {
	background: #009bfe;
	-moz-transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;	
}

a.button {
	font-family:Montserrat,Montserrat-Light,Helvetica,Verdana,sans-serif;
	color: #ffffff;
	background-color: #000000;
	border: 0px solid #777;;
	font-weight:300 !important;
	font-size:19px !important;
	letter-spacing: 2px !important;
	padding: 15px 20px;
	text-decoration: none;
	-moz-transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	border-radius: 50px;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
	max-width: 250px;
	display: block;
}

a.refresh { position:absolute; left:5px; bottom:5px; }

ul li { margin-bottom:10px; }

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300;
	src: local('css/fonts/OpenSans-Light.ttf'), local('css/fonts/OpenSans-Light.ttf'), url(css/fonts/OpenSans-Light.ttf) format('ttf');
}

@font-face {
	font-family: Montserrat-Light;
	src: url('css/fonts/Montserrat-Light.eot');
	src: local('Montserrat-Light'), url('/css/fonts/Montserrat-Light.woff') format('woff'), url('/css/fonts/Montserrat-Light.ttf') format('truetype'), url('/css/fonts/Montserrat-Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: Montserrat;
	src: url('css/fonts/Montserrat-Regular.eot');
	src: local('Montserrat-Regular'), url('/css/fonts/Montserrat-Regular.woff') format('woff'), url('/css/fonts/Montserrat-Regular.ttf') format('truetype'), url('/css/fonts/Montserrat-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}