@CHARSET "UTF-8";

body {
	background:#f6f6f6;	
}

p {margin:0 0 1em 0;}
a {color:#35BBD7;}

.float-left {float:left;}
.float-right {float:right;}

.container {
    width:960px;
    margin:0 auto;
    position:relative;
}

.container.narrow {
    width:630px;
}

.animated {
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    -ms-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}

.placeholder {
  color: #aaa !important;
}

/**** NAV ****/

nav {line-height:4em;margin-top:2em;height:4em;}

nav #language {float:right;line-height:4em;}
nav #language span {opacity:0;}
nav #language:hover span {opacity:1;}
nav #language a {
    background-repeat:no-repeat;
    background-position:50%;
    text-indent:-999em;
    display:inline-block;
    cursor:pointer;
    width:20px;

}

nav #user {float:right;margin-left:20px;}
nav #user a {color:#444;text-decoration:none;font-weight:bold;display:block;float:left;}
nav #user span a {color:#000;opacity:0.6;font-style:italic;margin-right:10px;font-weight:normal;background:url(/images/settings.png) 100% 50% no-repeat;padding-right:25px;}
nav #user span a:hover {opacity:1;}

/**** HEADER ****/
header .container {}

header .container #header-content {background:#fff;padding:0px;}
header .container #header-content p {margin:0;}

/**** MAIN ****/

#main .container {
     margin:2em auto;
}

#main .container #content {
    float:left;
    width:688px;
}

#main .container #content #tabs {
    list-style:none;
    margin:0 0 0 0;
    padding:0;
    height:2.5em;
}

#main .container #content #tabs li {
    margin:0 2px 0 0;
    background:#fdfdfd;
    float:left;    
    line-height:2.5em;  
}

#main .container #content #tabs li a {
    min-width:120px;
    padding:0 20px;
    line-height:2.3em;
    text-align:center;
    display:block;
    border:1px solid #b3b3b3;
    border-width:1px 1px 0 1px;
    -moz-border-radius:5px 5px 0 0;
    -webkit-border-radius:5px 5px 0 0;
    border-radius:5px 5px 0 0;
    background:#4c4c4c;
    color:#fff;
    text-decoration:none;
    font-size:110%;
    outline:0;
    text-shadow:1px 1px 0 #000;
}

#main .container #content #tabs li a:hover {background:#222;}


#main .container #content #tabs li.selected a {
    background:#fdfdfd;
    color:#000;
    text-shadow:1px 1px 0 #fff;
}

#main .container #content #tabs li.selected a:hover {background:#fff;}


#main .container #content #tabs li a[rel='back'] {
    background-image:url(/images/back.png);
    background-repeat:no-repeat;
    background-position:5px 50%;
    padding-left:40px;
}

#main .container #content .tab-panel {
    display:none;
    background:#fff;
    border:1px solid #b3b3b3;
    -moz-border-radius:0 5px 5px 5px;
    -webkit-border-radius:0 5px 5px 5px;
    border-radius:0 5px 5px 5px;
}

#main .container #content .tab-panel.selected {
    display:block;
}

#main .container #content .tab-panel ul {
    list-style:none;
    margin:0;
    padding:0 1em;
}

#main .container #content .tab-panel ul li {
    border-bottom:1px solid #cccccc;
    padding:2em 0;
    font-size:90%;
}

#main .container #content .tab-panel ul li.purchased {

    padding-bottom:0 !important;
}

#main .container #content .tab-panel ul li:last-child {
    border-width:0px;
}


#main .container #content .tab-panel ul li.package-header {
    border-width:0px;
    padding:3em 0 0 0;
}
#main .container #content .tab-panel ul li.package-header h2 {
    color:#333;
    font-size:1.5em;
    font-weight:600;
    margin:0;
    padding:0;
    text-transform:uppercase;
}

#main .container #content .tab-panel ul li h3 a {
    font-size:140%;
    color:#000;
    text-decoration:none;
    margin-bottom:0.25em;
    display:block;
    font-weight:400;
}

#main .container #content .tab-panel ul li h3 a span {
    font-weight:100;
}


#main .container #content .tab-panel ul li .info {
    float:right;
    margin-left:0px;
    width:185px;
}

#main .container #content .tab-panel ul li .info p.license-code {
    margin-bottom:0.35em;
    color:#aaa;
}

#main .container #content .tab-panel ul li .info a {
    color:#35BBD7;
    text-decoration:none;
    margin:0.25em 0 0 0;
    display:block;
}

#main .container #content .tab-panel ul li .info button {
    width:100%;
    margin:0 0 1.5em 0;
    font-size:160%;
}

#main .container #content .tab-panel ul li .content {
    width:455px;
    padding:0 0 20px 0;
}

#main .container #content .tab-panel ul li .content img,
#main .container #content .tab-panel.articles ul li img {
    float:left;
    margin:0 15px 15px 0;
    max-width:110px;
}

#main .container #content .tab-panel a.read-more {
     text-transform:uppercase;
     color:#fb9139;
     font-weight:bold;
     text-decoration:none;
     display:block;   
     margin-top:0.5em;
}


#main .container #content .tab-panel.courses #packages-select-container {
    clear:both;
    padding:10px;
    border:1px solid #e4e4e4;
    background:#f1f1f1;
    margin:12px;
}

#main .container #content .tab-panel.course,
#main .container #content .tab-panel.courseGroup {
    padding:10px;
}

#main .container #content .tab-panel.course img,
#main .container #content .tab-panel.courseGroup img {
    max-width:660px;
}

#main .container #content .tab-panel.course h1,
#main .container #content .tab-panel.courseGroup h1 {
    font-size:140%;
    margin:1em 0;
    font-weight:400;
}

#main .container #content .tab-panel.course h2 {
    font-size:100%;
    margin:0.5em 0;
    font-weight:600;
}

#main .container #content .tab-panel .references {
    float:right;
    width:200px;
    padding:0 0 0 10px;
    border-left:1px solid #ccc;
}

#main .container #content .tab-panel .references a {
    color:#35BBD7;
    text-decoration:none;
}

#main .container #content .tab-panel.article {
    padding:0px 10px 10px 10px;
}

#main .container #content .tab-panel.article h1 {
    font-size:140%;
    margin:1em 0;
    font-weight:400;
}

#main .container #content .tab-panel .including-course-list {
    list-style:none;margin:0.5em 0 1.5em 0;padding:0;
    border:1px solid #e4e4e4;
}

#main .container #content .tab-panel .including-course-list li {
    margin:0 !important;padding:0 !important;
        border:0;
}

#main .container #content .tab-panel .including-course-list li:nth-child(2n) a {
    background:#f1f1f1;
}

#main .container #content .tab-panel .including-course-list li a {
    margin:0 !important;padding:0.5em !important;
    font-weight:bold;
    display:block !important;
    color:#000;text-decoration:none;
    font-size:110%;
}

#main .container #content .tab-panel .including-course-list li a:hover {text-decoration:underline;}

#main .container #content .tab-panel.course-legal,
#main .container #content .tab-panel.courseGroup-legal {
    padding:10px 5px;
    border:0;
    background:transparent;
    color:#666;
    font-weight:100;
}

#main .container #sidebar {
    float:right;
    width:260px;
    margin-top:2.5em;
}

#main .container #sidebar a {
    color:#000 !important;
}


#main .container #sidebar .element {
    background:#B7D1D7;
    padding:10px;
    width:238px;
    border:1px solid #808080;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    margin-bottom:2em;
}

#main .container #sidebar .element.language {
    background:#e4e4e4;
}


#main .container #sidebar .element.course,
#main .container #sidebar .element.packages {
    background:#fff;
}

#main .container #sidebar .element.packages label {
   font-size:120%;
}

#main .container #sidebar .element.packages select {
   font-size:120%;
   margin:0.45em 0 0 0;
   width:100%;
}

#main .container #sidebar .element.course table {
    margin-bottom:1em;
    font-size:85%;
    font-weight:500;
    border-collapse:collapse;
    padding:0;
    color:#000;
}

#main .container #sidebar .element.course table td {
    padding-top:2px;
    padding-bottom:2px;
}

#main .container #sidebar .element.course table td.label {
    padding-right:20px;
}


#main .container #sidebar .element .including-course-list {
    list-style:none;margin:0.5em 0 0 0;padding:0;
    border:1px solid #e4e4e4;
}

#main .container #sidebar .element .including-course-list li {
    margin:0;padding:0;
}

#main .container #sidebar .element .including-course-list li:nth-child(2n) a {
    background:#f1f1f1;
}

#main .container #sidebar .element .including-course-list li a {
    margin:0;padding:0.5em;
    font-weight:bold;    
}

#main .container #sidebar .element .including-course-list li a:hover {text-decoration:underline;}













#main .container #sidebar #support p {
    background:#fff;
    margin:1em 0; 
    padding:0.25em;
    text-align:center;
    font-size:155%;
    font-weight:500;
    text-shadow:1px 1px 0 rgba(0,0,0,0.15);
    line-height:1em;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}


#main .container #sidebar #support p span {
    font-size:50%;
}


#main .container #sidebar .element h3 {font-size:130%;text-shadow:1px 1px 0 #ddd;}
#main .container #sidebar .element p {font-size:100%;text-shadow:1px 1px 0 #fff;}

#main .container #sidebar .element form {
    margin:0.5em 0 0 0;
}

#main .container #sidebar .element input {
    display:block;
    width:226px;
    padding:5px;
    margin:2px 0 3px 0;;
    background:#f2f2f2;
    border:1px solid #808080;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    color:#333
}

#main .container #sidebar .element button {
    width:238px;
    padding:5px;
    margin-top:0.25em;
    font-weight:bold;
    
}

#main .container #sidebar .element a {
    color:#444;
    text-decoration:none;
    margin:0.5em 0;
    display:block;
}

#main .container #authenticate,
#main .container #profile,
#main .container #forgot-password {
     display:none;
}

.modals {display:none;}

.modal {
     padding:20px;
}

#authenticate a {
    float:right;
    margin-left:5px !important;
}

.modal h1 {
    font-size:170%;
    font-weight:400;
    margin:0 0 0.5em 0;
}

#profile form table {
    font-size:120%;
    width:95%;
}

#profile form table td {
    padding:5px 0;
}

#profile form table td.label {
    font-weight:400;
    color:#000;
    padding:15px 0 5px 0;
    width:140px;
}


#profile form table td input {
    display:block;   
    width:100%;
    padding:5px; 
}

#profile form table td input.checkbox {
    margin:11px 0 0 5px;
}

#profile form table td p {
    padding:5px; 
    color:#aaa;
    margin:0;
    font-size:90%;
}

#profile form table td.checkbox {vertical-align:middle !important;line-height:2em;padding-top:15px;} 
#profile form table td.checkbox .label {
  margin-left:10px;
  font-weight:bold;
  font-size:14px;
  line-height:2.4em;
}

#profile form table td input.checkbox {
  width:inherit !important;  
  float:left;
} 

/*** BOX ***/
.box a {color:#6fc6df;}


/*** REGISTRATION ***/

#main .container .box {
    background:#fff;
    padding:40px;
    border:1px solid #aaa;
    border-radius:10px;
    margin-top:2em;
}

#main .container #welcome-message {
    text-align:center;
}

#main .container #welcome-message h1 {
    font-size:180%;
    font-weight:400;
    margin:0 0 1em 0;
}

#main #register form input[readonly='readonly'] {
    background-color:rgba(200,200,200,.2);
    border:1px solid #e4e4e4;
    color:rgba(0,0,0,.45);
    cursor:not-allowed;
}

#main #register form table.well {
    border:1px solid #e7e7e7;
    background:#fafafa;
    padding:20px;
    margin:0 -10px;
    width:100%;
}



/*** FOOTER ***/
footer {
    margin-bottom:1em;
}

footer #footer-content  {
    border-top:1px solid #ccc;
    padding:10px 0 20px 0;
}

/*** AUTHENTICATION ***/
#authentication .google-link {
    text-align:right;
    padding:0 !important;
    margin:0 0 -2em 0 !important;
    line-height:1em !important;
    font-style:italic;
    font-size:11px;
}

#authentication .google-link button {
    display:inline;
    font-size:11px !important;
    margin:0;
    padding:2px 5px !important;
}

#authentication .presentation {
    white-space:inherit !important;
    font-weight:normal;
    border-bottom:1px solid #ccc;
    margin-bottom:1em;
}

#authentication h2 {
    font-size:170%;
    font-weight:400;
    margin:0 0 1em 0;
}

#authentication table {
    width:95%;
}

#authentication table td {
    vertical-align:middle;
    padding:5px 0;
}

#authentication .label {
    font-size:120%;
    width:30%;
    font-weight:bold;;
}

#authentication input.text {
    font-size:140%;
    padding:5px;
    width:100%;
}

#authentication hr {
    margin:3em 0 !important;
    display:block;
}

#authentication #forgot-password-toggler {
    float:right;
}

/*** SIGNED OUT ***/

#signed-out button {display:inline;margin-left:10px !important;float:right;}

/*** SIGNED IN ***/

#signed-in button {display:inline;margin-left:10px !important;float:right;}


/*** SIGN UP ***/
#sign-up {margin-top:100px !important;}
#sign-up .sign-up #radio-group {border:1px solid #888;border-width:1px 0;padding:5px 0;margin:1em 0;border-collapse:collapse;width:100%;}
#sign-up .sign-up #radio-group td {vertical-align:middle !important;line-height:30px;padding:5px 5px}
#sign-up .sign-up #radio-group tr:hover {background:#f1f1f1;}
#sign-up .sign-up #radio-group td label {font-size:1.15em;}
#sign-up .sign-up .with-icon,
#sign-up .sign-up #radio-group td label.with-icon {background-repeat:no-repeat !important;bakground-position:0 0;padding-left:25px;}
#sign-up .sign-up #radio-group td label strong {margin-right:0.25em;}
#sign-up .sign-up button {float:right;}
#sign-up .button-container button {float:right;margin:10px 0 0 10px !important;}

/*** PURCHASE ***/

#purchase header .container {
    border-bottom:1px solid #ccc;
}

#purchase #license .button {
    color:#fff;
    text-decoration:none;
    padding:10px;
    font-weight:bold;
    -moz-border-radius:5px;
}


#order .box {
    padding:40px 20px !important;
    display:none;
}

#order table {
    text-align:left;
    width:100%;
}

#order table tbody {
    background:#e4e4e4;
}

#order table th,
#order table td {
    vertical-align:middle;
    padding:5px 10px;
    font-weight:400 !important;
}

#order table td#course-title span {
    font-weight:100;
}

#order table tbody input {
    background:#fff;
    border:0;
    width:75px;
    text-align:center;
    padding:5px 0;
    font-weight:bold;
}

#order h1 {
    font-size:180%;
    font-weight:400;
    margin:0 0 1em 0;
    text-align:center;
}


#order .element {padding:10px 0;}
#order .element label {font-size:115%;line-height:1.5em;}
#order .element label input {margin-right:10px;}
#order .element label a,
#order .element .content a {font-size:85%;}
#order .element .content {margin:0.5em 0 0.5em 50px;font-size:115%;}
#order .element .content input {width:100%;padding:5px 0;background:#f1f1f1;border:0;}

.information {
    background:#f1f1f1;
    border:1px solid #e4e4e4;
    padding:10px;
}

.information p {
    font-size:85%;
    line-height:140%;
    margin:0.25em 0 0 0;
}


.information table, .information table tbody {background:transparent !important;padding:0 !important;vertical-align:middle !important;}
.information table tr {background:transparent !important;padding:0 !important;margin:0 !important;}
.information table td {padding:5px 0 !important;margin:0 !important;text-align:right;font-size:85%;vertical-align:middle !important;}
.information table td.cb {width:20px;}
.information input {margin-bottom:3px;}

button.disabled {background:#aaa;opacity:0.5;}

/***** SYSTEM *******/
#system-content {padding:0.25em 0 2em 0;text-align:right;}


.button, button {
    background: #fff;
    text-decoration:none;
    font-weight:bold;
   
    -moz-border-radius: 5px;
    border:1px solid #666;
    border-radius: 5px;
    padding: 7px 15px !important;
    display: block;
    text-align:center;
    margin:0 0 0.35em 0 !important;
    font-size:14px !important;
}

.orange-gradient {
  background:url(/images/orange-button-background.png) 0% 50%;
  color:#333333 !important;
  border:1px solid #B35E00;
  font-size:16px !important;
  text-shadow:1px 1px 0px #fff;
  box-shadow:0 0 5px rgba(0,0,0,0.15);
}

.orange-gradient:hover {
    opacity:0.9;
}

.gray-gradient {
  background:url(/images/black-button-background.png) 0% 50%;
  font-size:15px !important;
  text-shadow:1px 1px 2px #000;
  color:#E6E6E6 !important;
  border:1px solid #999;
}

.gray-gradient:hover {
    opacity:0.9;
}


.green-gradient {
  background:url(/images/green-button-background.png) 0% 50%;
  color:#333333 !important;
  border:1px solid #588500;
  font-size:15px !important;
  text-shadow:1px 1px 0px #fff;
  box-shadow:0 0 5px rgba(0,0,0,0.15);
}

.green-gradient:hover {
    opacity:0.9;
}

.hidden {display:none;}
.float-left {float:left;}
.float-right {flot:right;
}

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff;}
#colorbox{margin-top:-30px;}
    #cboxContent{margin-top:50px; overflow:visible;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#fff; padding:1px;}
        #cboxLoadingGraphic{background:url(/images/colorbox/loading.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#fff;}
        #cboxTitle{position:absolute; top:-50px; left:0; color:#444;font-size:200%;font-weight:200;width:100%;line-height:40px;border-bottom:1px solid #ccc;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:25px; height:25px; position:absolute; top:-40px; background:url(/images/colorbox/controls.png) no-repeat 0 0;}
        #cboxPrevious{background-position:0px 0px; right:44px;}
        #cboxPrevious:hover{background-position:0px -25px;}
        #cboxNext{background-position:-25px 0px; right:22px;}
        #cboxNext:hover{background-position:-25px -25px;}
        #cboxClose{background-position:-50px 0px; right:0;}
        #cboxClose:hover{background-position:-50px -25px;}
        .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
        .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
        .cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
        .cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;}


/*** PROOF VERSION CHOOSER ***/
#proof-chooser-box {width:400px;margin:200px auto;border:1px solid #e4e4e4;background:#fff;border-radius:10px;padding:20px;}
#proof-chooser-box h2 {font-size:140%;}
#proof-chooser-box ul {list-style:none;margin:0em 0;padding:0;}
#proof-chooser-box ul li a {padding:0px;margin:0.5em 0;display:block;text-decoration:none;color:#35BBD7;font-size:120%;}
#proof-chooser-box ul li a span {color:#333;font-size:120%;}

#proof-chooser-box ul li a:hover {color:#5ED5ED;}
#proof-chooser-box ul li a:hover span {color:#666;}







/** COMPETENCE MAPPING **/

#sidebar #competence-mapping {
    border:1px solid #e7e7e7 !important;
    border-radius:0 !important;
    background-color:#fff !important;
    text-align:center;
    height:100px;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

#sidebar #competence-mapping .loader {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

#sidebar #competence-mapping .loader i {
    font-size:60px;
    color:#B7D1D7;
    display:block;
    margin-bottom:10px;
}

#sidebar #competence-mapping .loader span {
    text-transform:uppercase;
    font-weight:100;
    font-size:12px;
    color:#aaa;
}



#competence-modal {
    background:rgba(255,255,255,0);
    width:100%;
    height:0;
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    overflow-x:hidden;
    overflow-y:scroll;
    transition:height 0.2s, background-color: 0.3s;    
}

#competence-modal.open {
    height:100%;
    background-color:rgba(255,155,155,.95);
}

#competence-modal .container {        
    background-color:rgba(200,200,200,0);
    padding:30px 0;        
    height:100%;   
    width:100%;
    max-width:960px;
    margin:0 auto;
}

#competence-modal .container .close-competence-mapping {
    float:right;
    border:0;
    background:rgba(255,255,255,.4);
    color:#fff;
    width:45px;
    height:45px;    
    line-height:1;
    padding:0;
    margin:0 10px 0 0 !important;
    border-radius:50%;
    font-size:18px;
}

#competence-modal .container .close-competence-mapping:hover {    
    background:rgba(255,255,255,1);
    color:rgba(0,0,0,1);
}

#competence-modal .container ul.tabs {
    list-style:none;
    margin:0 0 0 20px;
    padding:0;
}

#competence-modal .container ul.tabs li.tab {
    display:inline-block;
    padding:0;
    font-size:18px;    
    margin:0 5px 0 0;       
}

#competence-modal .container ul.tabs li.tab a {
    text-decoration:none;
    font-weight:100;
    text-transform:uppercase;
    color:rgba(0,0,0,0.5);
    padding:20px 20px 10px 20px;
    display:block;
    background:rgba(255,255,255,0.5);
    border-radius:5px 5px 0 0;
    transition: background 0.5s, color 0.5s;
}

#competence-modal .container ul.tabs li.tab a:hover {
    background-color:rgba(255,255,255,.75);
    color:rgba(0,0,0,0.75);
}

#competence-modal .container ul.tabs li.tab.active a {
	background-color:rgba(255,255,255,1);
    color:rgba(0,0,0,1);
}

#competence-modal .container div.panes {
    background:rgba(255,255,255,1);
    padding:40px 40px;    
}

#competence-modal .container div.panes div.pane {
	display:none;
}

#competence-modal .container div.panes div.pane.active {
	display:block;
}

#competence-modal .container div.panes div.pane#graph table {
    table-layout:fixed;
    width:100%;    
}

#competence-modal .container div.panes div.pane#graph table tr th {
    font-size:14px;
    font-weight:100;
    text-align:left;
    width:145px;
    padding:10px 10px 10px 0;
    line-height:30px;
}

#competence-modal .container div.panes div.pane#graph table tr td {
    background:rgba(0,0,0,0.025);
    
    outline:1px solid rgba(0,0,0,0.025);
    transition: background .3s, outline .1s;
    position:relative;
}

#competence-modal .container div.panes div.pane#graph table tr td span {
    height:40px;
    margin:0;
    background:rgba(0, 255, 220,1);
    outline:1px solid rgba(255,255,255,0);
    display:block;
    width:0;
    transition: background 1s;
    position:absolute;
    left:0;
    top:0;
}

#competence-modal .container div.panes div.pane#graph table tr:hover th {
	font-weight:400;
}

#competence-modal .container div.panes div.pane#graph table tr:hover td {
	/*outline:1px solid rgba(0,0,0,0.10);
	border-width:1px 0;
	background-color:rgba(255, 255, 255,1);
	*/
}

#competence-modal .container div.panes div.pane#graph table tr:hover td span {	
	background:rgb(0, 251, 255);
}

#competence-modal .container div.panes div.pane#graph table td table.thresholds {
    height:40px;
    border-collapse:collapse; 
    table-layout:fixed;
    width:100%;
}
#competence-modal .container div.panes div.pane#graph table td table.thresholds td {
    outline:1px solid #fff;
    width:20% !important;
}

#competence-modal .container div.panes div.pane#form form table {
    width:100%;
    table-layout:fixed;
}

#competence-modal .container div.panes div.pane#form form table thead th {
    text-align:left;
    font-size:20px;
}

#competence-modal .container div.panes div.pane#form form table thead td {
    font-size:18px;
    font-weight:100;
    line-height:1.3;
    padding:10px 0;
}
#competence-modal .container div.panes div.pane#form form table tbody th {
    text-align:left;
    padding:30px 0 10px 0;
    font-weight:100;
    font-size:15px;
}

#competence-modal .container div.panes div.pane#form form table tbody th h4 {
    border-bottom:1px solid #e7e7e7;
    padding:20px 0 5px 0;    
    font-size:18px;
    font-weight:600;
}

#competence-modal .container div.panes div.pane#form form table tbody td {
    text-align:center;
}

#competence-modal .container div.panes div.pane#form form table tbody td {
    background-color:#f7f7f7;
    padding:5px 0;
}

#competence-modal .container div.panes div.pane#form form table tbody td label span {
    display:block;
    margin-top:5px;
    font-weight:100;
    font-size:12px;
}

#competence-modal .container div.panes div.pane#form form table tfoot tr td {
    padding:20px 0 0 0;    
}

#competence-modal .container div.panes div.pane#form form table tfoot tr td button {
    float:right;
    background-color:rgba(255,100,100,1);
    border:0;
    border-radius:0;
    padding:15px 25px !important;
    color:#fff;
    font-size:16px !important;
}

#competence-modal .container div.panes div.pane#form form table tfoot tr td button:hover {
    background-color:rgba(255,100,100,.75);
}