.buttonGoToCourse {background-color: #008CBA;} .buttonGoToCourse {
    background-color: #a435f0;
    border: none;
    border-radius: 30px;
    color: #FFFFFF;
    padding: 15px 32px;
    text-align: center;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    margin: 16px 0 !important;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
  }
  
 .Simple-tooltip {  
   position: relative;
   display:inline-block;
 }
 .Simple-tooltip .tt-content {
   visibility: hidden;
   border:2px solid #A435F0;
   padding: 5px;
   position: absolute; /* IMPORTANT - absolute position relative to parent */
   left: 282px; /*tooltip(with arrow) will move 102px in x-axis towards right */
   width:100%; /*controls the width of the tooltip */
   top:20px; /*tooltip(with arrow) will move 7px in y-axis in upward side */       
 }
 
 .tt-content::before {
  /*Below codes helps to create an arrow size */
  content: " "; /* empty space before the tooltip */
  position: absolute; /* IMPORTANT - absolute position relative to parent */
  right: 100%; /* right edge is positioned at 100% to left
                  of the right edge of its nearest positioned ancestor.
                   Just change this value and see how arrow changes.*/
  border-width: 15px; 
               /* This controls the arrow size */
  border-style: solid; 
              /* change this to ridge, dotted etc to see how arrow looks */
  border-color: transparent #A435F0 transparent transparent; 
               /*right border is green while others are transparent. */	  
  /* border-color: red green blue yellow; */
               /* just uncomment the above border-color and see how the generated
			      content looks like */
 }
 
 .Simple-tooltip:hover .tt-content {
    visibility: visible;
 }
  
  #udemypostercoursetable {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse!important;
    width: 100%!important;
  }
  
  #udemypostercoursetable td, #udemypostercoursetable th {
    border: 1px solid #ddd!important;
    padding: 8px!important;
  }
  
  #udemypostercoursetable tr:nth-child(even){background-color: #f2f2f2!important;}
  
  #udemypostercoursetable tr:hover {background-color: #ddd!important;}
  
  #udemypostercoursetable th {
    padding-top: 12px!important;
    padding-bottom: 12px!important;
    text-align: left!important;
    background-color: #696969!important;
    color: white!important;
  }