/* CV.TRIPLE-C
 * (COMPUTER CARE CENTER) Banjarmasin
 * Perusahaan Pengembang Aplikasi Berbasis Web
 * Order Contact: +62 82155717976
 */

/* ======================================================================================================================================= CV.TRIPLE-C ==============
 * STYLE WARNA
 */

/* GENERAL COLOR
 * Class = Warna Standar
 */
body {
	background-color: #fff;
	/* background-image: linear-gradient(270deg, #aefffb, white, #aefffb); */
	background-attachment: fixed;
	background-position: center;
	background-size: 100% 100%; 
	color: #000;
	text-shadow: 1px 1px 2px #fff;
}
a:link, a:visited {
	color: #000;
	text-shadow: 1px 1px 2px #fff;
}
a:hover {
	color: #fff;
	text-shadow: 1px 1px 2px #000;
}
hr {
	border-color: #c0c0c0;
}
fieldset {
	border-color: #000;
}
legend {
	color: #000;
}
.note {
	border-left-color: #00ff00;
	background: rgba(168, 255, 168, 1);
	color: #224822;
/*	text-shadow: 0px 0px 1px #56b756; */
}
.error {
	border-left-color: #ff0000;
	background: #ffaeae;
	color: #000;
/*	text-shadow: 1px 1px 1px #fff; */
}
/* INPUT COLOR
 * Class = Warna Input
 */
input[type="text"], input[type="password"], input[type="number"], input[type="email"], input[type="tel"], input[type="search"], input[type="date"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="url"], textarea {
	border-bottom-color: hwb(71 0% 6%);
	background: rgba(255, 255, 255, 0.3);
	color: #000;
}
input[type="text"]:disabled, input[type="password"]:disabled, input[type="number"]:disabled, input[type="email"]:disabled, input[type="tel"]:disabled, input[type="search"]:disabled, input[type="date"]:disabled, input[type="datetime"]:disabled, input[type="time"]:disabled, input[type="datetime-local"]:disabled, input[type="url"]:disabled {
	border-bottom-color: #FFCC00;
	background: rgba(255, 255, 255, 0.7);
	color: #c0c0c0;
	text-shadow: 0px 0px 3px #fff;
}
input[type="text"]:hover, input[type="password"]:hover, input[type="number"]:hover, input[type="email"]:hover, input[type="tel"]:hover, input[type="search"]:hover, input[type="date"]:hover, input[type="time"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="url"]:hover, textarea:hover {
	border-bottom-color: #f00;
	color: #000;
}
input[type="submit"], input[type="button"], input[type="reset"], button {
	background: linear-gradient(to right bottom, #d5e9ef, #2275b3);
	border-color: #000;
	box-shadow: 3px 3px 9px #000;
	color: #fff;
	text-shadow: 1px 1px 3px #000;
}
input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover, button:hover {
	background: linear-gradient(to right bottom, #2275b3,#d5e9ef);
	color: #fff;
	text-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}
input[type="submit"]:disabled, input[type="button"]:disabled, input[type="reset"]:disabled, button:disabled {
	linear-gradient(to right bottom, #ffffff, #8e8e8e)
	color: #fff;
	text-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}

select {
	background: linear-gradient(to right bottom, #c4f000,#f4ffe7);
	border-color: #c4f000;
	color: #000;
}
select.onhead {
	background: rgba(255,255,255,0);
	border-color: #808080;
	color: #000;
	text-shadow: 2px 2px 4px #fff;
}

/* TABLE COLOR
 * Class = Warna Tabel
 */
.table thead {
	background-color: #c4f000;
	background-image: linear-gradient(to right, #c4f000,#f4ffe7,#c4f000);
	color: #000;
	text-shadow: 2px 2px 3px #fff;
}
.table_bw thead {
	background-color: #dbdbdb;
	color: #000;
	text-shadow: 2px 2px 5px #fff;
}
.table thead tr td {
	border-color: #fff;
}
.table_bw thead tr td {
	border-color: #000;
}
.table tbody tr td {
	background: rgba(0, 0, 0, 0.2);
	border-color: #fff;
}
.table tbody tr:nth-child(even) {
	background: rgba(255, 255, 255, 0.5);
}
.table tbody tr:hover {
	background: rgba(0, 0, 0, 0.5);
	color: #fff;
	text-shadow: 2px 2px 6px #000;
}
.table tbody tr:hover a:link, .table tbody tr:hover a:visited {
	color: #fff;
	text-shadow: 2px 2px 5px #000;
}
.table tfoot tr {
	background-color: #c4f000;
	background-image: linear-gradient(to right, #c4f000,#f4ffe7,#c4f000);
	color: #000;
	text-shadow: 2px 2px 3px #fff;
}
.table tfoot tr td{
	border-color: #fff;
}
.table_bw tfoot tr {
	background: #dbdbdb;
	border-color: #000;
}
.table-pop-up:hover span{
	border-color: #c0c0c0;
	box-shadow: 5px 5px 12px #000;
	background: rgba(0,0,0,0.7);
	color: #fff;
	text-shadow: 1px 1px 2px #000;
}

/* PAGING COLOR
 * Class = Warna Paging, Paging Box
 */
#paging, .hal-pertama, .hal-sebelumnya, .hal-ini, .hal-selanjutnya, .hal-akhir, .hal-angka{
	border-color: #fff;
	box-shadow: 2px 2px 4px #000;
	color: #fff;
	text-shadow: 1px 1px 3px #000;
	background: linear-gradient(to right bottom, #c4f000, #005fa5);
}
.hal-ini{
	color: #fff;
	border-color: #fff;
	background: linear-gradient(to right bottom, #00ff00, #00a500);
}
#paging:hover, .hal-pertama:hover, .hal-sebelumnya:hover, .hal-ini:hover, .hal-selanjutnya:hover, .hal-akhir:hover, .hal-angka:hover{
	border-color: #c4f000;
	box-shadow: 1px 1px 1px #000;
	color: #c4f000;
	text-shadow: 1px 1px 3px #fff;
	background: #FFFFFF;
}
.hal-ini:hover{
	color: #c4f000;
	border-color: #c4f000;
	background: #000;
}
#pagingbox a:hover{
	color: #c4f000;
}
#paging-selected{
	border-color: #f00;
	box-shadow: 2px 2px 4px #000;
}

/* CROLLER COLOR
 * Class = Warna Scroller Browser
 */
::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0px 0px 0px rgba(0,0,0,0); 
	background: #42ad00;
}
::-webkit-scrollbar-thumb {
	background: #2f7a00;
	-webkit-box-shadow: inset 0px 0px 0px rgba(0,0,0,0); 
}
::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(0,0,0,0); 
}

/* POP-UP COLOR
 * Class = Warna Pop Up Dialog
 */
#pop-up input[type="checkbox"]:checked ~ #pop-up-login{
	background: rgba(0,0,0,0.5);
}
#pop-up-form{
	border-color: #c4f000;
	background-color: #1a9bcc;
	background-image: linear-gradient(to right bottom, #1a9bcc,#ffffff);
	box-shadow: 10px 10px 15px #000; 
}
#pop-up-info{
	border-color: #a1a1a1;
	background: #FFF;
	box-shadow: 10px 10px 15px #000;
}
#pop-up-form-header{
	background-color: #00ff00;
	background-image: linear-gradient(to right, #00c600,#d2ffd2,#00c600);
	color: #000;
	text-shadow: 1px 1px 2px #fff;
}
#pop-up-judul{
	color: #000;
}

/* FONT COLOR
 * Class = Warna Standar
 */
.red, .merah{
	color: #f00;
}
.yellow, .kuning{
	color: #ff0;
}
.green, .hijau{
	color: #0f0;
}
.blue, .biru{
	color: #00f;
}
.black, .hitam{
	color: #000;
	text-shadow: 1px 1px 3px #fff;
}
.white, .putih{
	color: #fff;
	text-shadow: 1px 1px 3px #000;
}
.orange, .jingga{
	color: #ff8040;
}
.brown, .coklat{
	color: #800000;
}
.grey, .abu-abu{
	color: #c0c0c0;
}
.pink, .merah-muda{
	color: #ff80c0;
}


/* FONT COLOR
 * Class = Warna Khusus
 */
.android{
	color: #c4f000;
}
.warna1{
	color: #00ea00;
	text-shadow: 1px 1px 2px #fff;
}
.warna2{
	color: #00ff00;
	text-shadow: 1px 1px 2px #000;
}
.warna3{
	color: #00c600;
	text-shadow: 1px 1px 2px #000;
}

/* BACKGROUND COLOR
 * Class = Warna Khusus
 */
.bg_putih{
	background: #fff;
	box-shadow: 3px 3px 9px #000;
}
.bg_merah{
	background: #f00;
	box-shadow: 3px 3px 9px #fff;
}
.whatsapp{
	background: #34cf34;
}


/* =================================================== APP COLOR ======================
 * ====================================================================================
 * ====================================================================================
 * ====================================================================================
 * ====================================================================================
 * WARNA APLIKASI
 * Warna Khusus Untuk Aplikasi ini
 * See = app.css or app-ame.css
 */
#body{
	border-left-color: #e5e5e5;
	border-right-color: #e5e5e5;
	border-bottom-color: #e5e5e5;
}

/* ================================================== HEADER ================================================ */
/*Original background: #008577;*/
header {
	background: #c4f000;
	color: #fff;
}
#top-option:hover {
	background: rgba(255,255,255,0.2);
}
.top-option div {
	border-bottom-color: #f00;
	background: #e5e5e5;
	color: #000;
	text-shadow: 3px 3px 5px #fff;
}
.top-option div:hover {
	background: #000;
	color: #fff;
	text-shadow: 3px 3px 5px #000;
}
#kop{
	background: #000;
	color: #fff;
}
#kop-judul{
	color: #fff;
}
.kepala a:link, .kepala a:visited{
	color: #ffffff;
	text-shadow: 1px 1px 2px #000000;
}
.kepala a:hover{
	color: #c0c0c0;
}

/* ================================================== MENU ================================================ */
#menu-item, #selected{
	border-bottom-color: #e5e5e5;
}
#selected{
	border-top-color: #e5e5e5;
	border-right-color: #e5e5e5;
	border-left-color: #e5e5e5;
}
#menu-item:hover{
	border-bottom-color: #e5e5e5;
	background: rgba(0,0,0,0.2);
}
#menu a:link, #menu a:visited{
	color: #000;
}
#menu a:link #selected, #menu a:visited #selected{
	border-top-color: #e5e5e5;
	border-right-color: #e5e5e5;
	border-left-color: #e5e5e5;
	color: #000;
}
#menu a:hover #menu-item{
	color: #0f0;
}
#menu a:hover #selected{
	color: #fff;
}

/* ================================================== SIDEBAR ================================================ */
#sidebar{
	background: rgba(0,0,0,0.1);
	border-color: #e5e5e5;
	box-shadow: 7px 12px 12px #000;
}
#side_box{
	border-color: #e5e5e5;
	box-shadow: 6px 6px 12px #000;
}
#side_judul{
	background-color: #42ad00;
	/* background-image: linear-gradient(to right, #059c95,#65f1ea,#059c95); */
	color: #fff;
	text-shadow: 1px 1px 3px #000;
}
#side_isi{
	background-color: #c4f0005e;
	/* background-image: linear-gradient(to right bottom, rgb(151 212 209),rgba(255, 255, 255,1)); */
}
#side_isi:hover{
	background-color: #c4f000b9;
	/* background-image: linear-gradient(to right bottom, rgb(0 228 218 / 29%),rgba(255, 255, 255,0.2)); */
}

/* ================================================== ISI ================================================ */
#isi{
	color: #000;
	text-shadow: 2px 2px 5px #fff;
	background: linear-gradient(to right bottom, rgba(227, 224, 224, 0.6),rgb(248, 248, 248));
	border-color: #e5e5e5;
	box-shadow: 7px 12px 12px #000;
}
/* ===== SETTING =======
 *
 */
#set_logo{
	border-color: #fff; 
}
#set_logo_img div{
	border-color: #fff;
	background: rgba(0,0,0,0.2);
}
#tembon{
	background: #1c8dff;
	border-color: #b0d8ff;
}
#temboff{
	background: #1c8dff;
	border-color: #b0d8ff;
}
#tembusan_check input[type='radio']:checked ~ label div{
	background: #0076ec;
	border-color: #b0d8ff;
}
#tembusan_check input[type='radio']:checked ~ label div{
	background: #0076ec;
	border-color: #b0d8ff;
}


/* ======================================= F O O T E R =======================================
 *
 */
footer {
	background: #000;
}
.footer img:hover {
	background: rgba(255,255,255,0.2);
}