html, body { height:100%}
html {
    text-size-adjust: 100%;     /* modern browsers */

}
.nav { }
.ui-dform-a { color:#333}

.panel-default > .panel-heading { }

.row { margin:0; margin-left:0!important; position:relative}

.ui-dform-div form { padding:0}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
	-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #eee;
    border-color: #DDDDDD #DDDDDD rgba(0, 0, 0, 0);
    border-image: none;
    border-style: solid;
    border-width: 0px;
    color: #555555;
    cursor: default;
}

.nav-tabs > li > a {
	border: 0px solid rgba(0, 0, 0, 0);
    border-radius: 0px 0px 0 0;
    line-height: 1.42857;
    margin-right: 2px;
}

.btn-remove {
	display:none;
    position: absolute;
    right: 10px;
    top: 10px;
	z-index:9;
}

.panel-block, .panel-add  { margin:0px 10px 20px!important; padding:20px 0; background:#f7f7f7;}

.login-form { border:0px!important}


/*SKILL*/
.row-skills {
    width: 500px;
    margin:0 auto;
    border-bottom: 1px solid #fff;
}
.col-skills {
    width: 200px;
    float: left;
}

.glyphicon-refresh { background:url(../images/refresh-icon.png) no-repeat !important; content:none!important; width:15px!important; height:15px}
.glyphicon-refresh:before {content:none!important;}
.glyphicon-remove-circle { background:url(../images/close-icon.png) no-repeat !important; content:none!important; width:15px!important; height:15px}
.glyphicon-remove-circle:before {content:none!important;}
.glyphicon-remove{ background:url(../images/close-icon2.png) no-repeat !important; content:none!important; width:15px!important; height:15px}
.glyphicon-remove:before{content:none!important;}
.glyphicon-ok { background:url(../images/check-icon.png) no-repeat !important; content:none!important; width:15px!important; height:15px}
.glyphicon-ok:before {content:none!important;}



#container { padding-bottom:90px; }

/* =========================================================
   BODY BACKGROUND
   ========================================================= */
body { 
    background-image: url('/images/bg.jpg'); 
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    background-position: center top; 
    background-size: cover;
    margin: 0;
}

/* =========================================================
   HEADER BANNER
   ========================================================= */
#header {
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 0;
}

#header img {
    max-width: 1200px;
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* =========================================================
   MENU / TAB NAVIGATION
   ========================================================= */
#access {
    max-width: 1200px;
    margin: 0 auto;
    padding: 15px 30px !important;
    background: #333;
    border-radius: 0px;
    float: none !important;
    width: 100% !important;
    box-sizing: border-box;
}

#access a {
    color: white !important;
    font-weight: bold;
}

/* =========================================================
   CONTENT WRAPPER
   ========================================================= */
.content-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    background: #ffffff;
    padding: 20px 30px;
    border-radius: 0px;
}

/* =========================================================
   FOOTER
   ========================================================= */
#footer {
    max-width: 1200px;
    margin: 0 auto;
    background: #333333;
    padding: 20px 30px;
    border-radius: 0px;
}

#footer .credits {
    text-align: center;
    color: #ffffff;
}

/* =========================================================
   RESPONSIVE FOR MOBILE (= 768px)
   ========================================================= */
@media (max-width: 768px) {

    body {
        background-size: cover;
        background-attachment: scroll;
    }

    #header img {
        width: 100%;
        padding: 0 10px;
    }

    /* MENU MOBILE */
    #access {
        padding: 10px 15px !important;
    }

    #access .menu ul {
        display: flex;
        flex-direction: column;
        gap: 5px;
        margin: 0;
        padding: 0;
    }

    #access .menu ul li {
        list-style: none;
        width: 100%;
        text-align: center;
    }

    #access a {
        display: block;
        padding: 10px;
        background: #444;
        border-radius: 0px;
    }

    /* CONTENT MOBILE */
    .content-wrapper {
        padding: 15px 15px;
        margin: 10px;
        border-radius: 0px;
    }

    /* FOOTER MOBILE */
    #footer {
        padding: 15px 15px;
        margin: 10px;
        border-radius: 0px;
    }

    #footer .credits {
        font-size: 13px;
        line-height: 1.5;
    }
	/* Ensure Bootstrap 3.4.1 grid wins */
		[class^="col-"], [class*=" col-"] {
		box-sizing: border-box !important;
}

	/* Ensure form controls match 3.4.1 */
		.form-control {
		border-radius: 4px !important;
		border: 1px solid #ccc !important;
}