/* 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: #dafffd;*/
	background-color: #FFFFFF;
/*	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-color: #0085772e;
	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 {
	color: #000;
	border-color: #00574b;
	box-shadow: 0px 0px 5px #00574b;
}
input[type="submit"], input[type="button"], input[type="reset"], button{
	background: linear-gradient(180deg, #008577, #00574b);
    border-color: #00574b;
	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(0deg, #008577, #00574b);
	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, #00b19e,#02ffe4);
    border-color: #008577;
	color: #000;
}
select.onhead {
	background: rgba(255,255,255,0);
	border-color: #808080;
	color: #000;
	text-shadow: 2px 2px 4px #fff;
}
option:checked; option:hover{
	color: #FFF;
	background: #000;
}
::-moz-selection { /* Code for Firefox */
  color: #FFFFFF;
  background: #008577;
}

::selection {
  color: #FFFFFF;
  background: #008577;
}
/* TABLE COLOR
 * Class = Warna Tabel
 */
.table thead {
	background-color: #008577;
    background-image: linear-gradient(to right, #008577,#02e5cd,#008577);
    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: rgb(0 87 75 / 16%);
}
.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: #008577;
	background-image: linear-gradient(to right, #00574b,#008577,#00574b);
	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, #008577, #00574b);
}
.hal-ini{
	color: #fff;
	border-color: #fff;
	background: linear-gradient(to right bottom, #ff0000, #6e0000);
}
#paging:hover, .hal-pertama:hover, .hal-sebelumnya:hover, .hal-ini:hover, .hal-selanjutnya:hover, .hal-akhir:hover, .hal-angka:hover{
	border-color: #00574b;
	box-shadow: 1px 1px 1px #000;
	color: #00574b;
	text-shadow: 1px 1px 3px #fff;
	background: #FFFFFF;
}
.hal-ini:hover{
	color: #dafffd;
	border-color: #dafffd;
	background: #000;
}
#pagingbox a:hover{
	color: #31AFDE;
}
#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: #008577;
}
::-webkit-scrollbar-thumb {
	background: #00574B;
	-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: #31AFDE;
	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: #31AFDE;
}
.warna1{
	color: #008577;
	text-shadow: 1px 1px 2px #fff;
}
.warna2{
	color: #00574b;
	text-shadow: 1px 1px 2px #fff;
}
.warna3{
	color: #affffb;
	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;
}

/* =================================================== 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: #008577;
	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: #00574B;
	background-image: linear-gradient(to right, #00574B,#008577,#00574B);
	color: #fff;
	text-shadow: 1px 1px 3px #000;
}
#side_isi{
	background-color: rgba(53, 161, 201,0.3);
	background-image: linear-gradient(to right bottom, rgb(151 212 209),rgba(255, 255, 255,1));
}
#side_isi:hover{
	background-color: rgba(53, 161, 201,0);
	background-image: linear-gradient(to right bottom, rgb(0 228 218 / 29%),rgba(255, 255, 255,0.2));
}
#side_footer{
	background-color: #008577;
	color: #fff;
	text-shadow: 1px 1px 3px #000;
}
/* ================================================== 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);
}