@import url('https://fonts.googleapis.com/css?family=Poppins:400,600,700,800');

body{
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    background-color: white;
    background-attachment: fixed;
    background-position: center;
    font-size : 14px;
}



.login-box{
    padding: 3em;
    width : 500px !important;
    margin-left : -250px !important;
    height : auto !important;
    background-color:   #63318B; /*rgba(241, 194, 46, 0.6); */
    box-shadow: 0 1px 5px rgba(0,0,0,.1);
    border-radius: 2px;


}

.text-white{color:#212121;}

/*.navbar-fixed-top{background:transparent;background-color: rgba(0,0,0,.3);}*/
.navbar-fixed-top{background:#63318B;}
.breadcrumb{color:#212121;background: transparent;}

.footer{background:transparent;border:0;text-align:center;}

.gray-bg{
    background-color: white;
   /* background-image: url(../img/back5.png);*/
    background-size: 100% 100%;
    background-attachment: fixed;
    background-position: center;
}

.top-navigation .navbar-brand{background-color: #63318B !important;}

.top-navigation .nav > li > a{color:white !important;font-weight: 400;}

.top-navigation .nav > li a:hover, 
.top-navigation .nav > li a:focus, 
.nav .open > a, .nav .open > a:hover, 
.nav .open > a:focus{
    background-color: #eee;
    color:#e02e7f !important;
    color:inherit;
}


.dropdown-menu{font-size:inherit;min-width:250px;}

.dropdown-menu li{border-bottom:1px solid whitesmoke;}

.my-content{
    color : #212121;
    /*box-shadow: 0 1px 5px rgba(0,0,0,.1);*/
    background-color: #ffffff;
    border-radius: 2px;
    padding: 2.2rem;
    margin-bottom: 2.3rem;
}

.my-content-search{
    color : white;
    box-shadow: 0 1px 5px rgba(0,0,0,.1);
    background-color: #ffffff;
    border-radius: 2px;
    padding: 2.2rem;
    padding-bottom : 1rem;
    margin-bottom: 2.3rem;
}

.table tbody tr td, .table thead tr th{padding : 12px 8px;}



.form-control{background-color: rgba(255,255,255,.7);border:1px solid #999999;;color:#212121;}

.form-control option, .form-control optgroup{color:black;}

.btn-link:hover{color:orange;}

.form-horizontal .control-label {color:#212121;}

.mylink, .mylink:hover{color:#FD4D40;text-decoration: underline;}

.input-group-addon{color:black;}

.mynotes{padding-bottom:10px;}

#page-wrapper{min-height:700px;}

.checkbox-custom{padding-left:30px;}

.my-content table thead tr th{ text-align: left !important;}    

.my-content table thead tr th a{ color: #212121;}

.summary{text-align: end;}

.pagination > .disabled > span {background-color: transparent; color:white;}

.pagination > .active > a, .pagination > .active > a:hover { color:black }

.pagination > li > a, .pagination > li > span { background-color: transparent; }

@media (max-width: 767px) {

    .navbar-fixed-top{
        background-color: #63318B; 
    }
    .login-box {
        width: 440px !important;
        margin-left: -220px !important;
    }
    .top-navigation .navbar-nav .open .dropdown-menu > li > a, .top-navigation .navbar-nav .open .dropdown-menu .dropdown-header {
        padding: 10px 15px 10px 20px;
        color: white;
    }
    .table {
        margin-bottom: 20px;
        margin-left: -20px;
        font-size: 12px;
    }
    .table tbody tr td, .table thead tr th {
        padding: 12px 5px;
    }
    .form-control {
        margin: 10px;
        margin-left:0 !important;
    }
    .kv-align-center, .kv-align-middle{
        padding-left: 30px !important;
    }
    .on-mobile{
        display: fixed;
    }
    .on-phone{
        display: fixed;
    }
}
@media (min-width: 768px) {
    .nav > .on-mobile {
        position: relative;
        display: none;
    }
    .on-phone{
        display: none;
    }
}

.btn-red-o {
    background-color: #FD4D40;
    border-color: #FD4D40;
    color: #FFFFFF;
}

.btn-red-o:hover, .btn-red-o:active{
    background-color: #f77e75;
    border-color: #f77e75;
}
.pagination > .disabled > span {
    background-color: transparent;
    color: #999 !important;
}
.pagination > .active > a{
    background-color: #777777  !important;
    border-color: #777777  !important;
    color: #f4f4f4  !important;
}

#tabbing>.tabs-container>.nav-tabs>li>a {
		color: #999999 !important;
	}

	#tabbing>.tabs-container>.nav-tabs>li.active>a {
		border-color: #777777 #777777 rgba(0, 0, 0, 0);
		border-bottom: white;
		border-top: 4px solid #ed5565;
		font-weight: 600;
		color: #777777 !important;
	}

	#tabbing>.tabs-container>.nav-tabs {
		border-bottom: 1px solid #777777;
    }
    
    .table-listing .table thead tr th{
        
        background-color: #63318b;
        border: 1px solid#63318b;
        font-weight: 600 !important;
        color:white;
    }

    .table-listing .table thead tr th a{
        
        color:white;
    }

    .table-listing .table thead tr th a:hover{
        color:#9DAAF2;
    }

    .table-listing .table tbody > tr > td {
        border: 1px solid#8f8d8e;
    }

    .table>tbody>tr>td,
	.table>tfoot>tr>td,
	.table-bordered>tbody>tr>td {
		border: 1px solid #8f8d8e;
		font-size: 15px;
		font-weight: 500;
	}

    @media (max-width:360px) {
        .my-content {
            padding: 0 !important;
        }  

        .table {
            margin-left: 0px!important;
        }

        .container {
            padding-left: 0px!important;
        }

        .loginscreen.middle-box {
            width: 300px!important;
            margin-left: -150px!important;
           
        }

        .navbar-toggle {
            background-color: #e02e7f!important;
        }

        .top-navigation .wrapper.wrapper-content {
            padding: 5px!important;
        }

        .table-listing{
            overflow-x: auto!important;
        }
    }

    .ibox-content {
		background-color: white;
		color: #676a6c;
	}

	.ibox-content2 {
		background-color: white;
		color: #777;
		border: 1px solid #ccc;
	}

	.size-icon {
		font-size: 4em !important;
	}

	.info-user {
		color: #f1ede2;
	}

	.info-surat {
		color: #777777;
	}

	.status-apply>li {
		margin: 20px 0px;

	}

	.status-notes>li {
		margin: 10px 0px;
		display: block;

	}

	hr {
		border: 1px solid #ccc !important;
		/* border-top: 1px solid #ccc; */
	}



	.atas-bawah {
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.title-maklumat {
		background-color: #ddd;
		color: #63318b !important;
		font-weight: 600 !important;
	}

	.title-details {
		background-color: #ddd;
		color: #e02e7f !important;
		font-weight: 600 !important;
	}

	.lable-coloumn {
		width: 30%;
		background-color: #ddd;
		color: #e02e7f !important;
		font-weight: 600 !important;
	}

    .table>tbody>tr>td,
	.table>tfoot>tr>td,
	.table-bordered>tbody>tr>td,
	.table>thead>tr>th,
	.table>thead:first-child>tr:first-child>th {
		border: 1px solid #8f8d8e !important;
	}

	.table-bordered>thead>tr>th {
		background-color: #63318b !important;
		color: white;
	}

	.table-bordered>thead>tr>th>a {
		color: white;
		font-weight: 600;

	}