Move CSS rules "hardcoded" in main.css to the proper LESS module file

[JuanMenendezBuitrago]

At some point, there has been a bunch of rules added to the main.css file

#tgd-interest .row section{margin-top: 2rem;margin-bottom: 2rem;}#tgd-interest #notice{margin: 0;}#tgd-interest section li{font-family: ProximaNovaSoft-Regular,Arial,sans-serif;}#tgd-interest section h2 {font-family: ProximaNovaSoft-Regular;font-size: 1.142em;font-weight: bold;color: #fff;margin: 0;padding: 1.5rem 1rem 1.2rem 1rem;-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.3);-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.3);box-shadow: inset 0 1px 1px rgba(0,0,0,0.3);background-color: #8ac6ea;}#tgd-interest section .interest-border {border: 1px solid #eee;padding: 0 10px 0 10px;}#tgd-interest section h2 i {float: right;cursor: pointer;}#tgd-interest .buttons {margin-bottom: 3rem;}#tgd-interest section li{margin-top: 1rem;}#tgd-interest .borderless tbody tr td, #tgd-interest .borderless tbody tr th, #tgd-interest .borderless thead tr th {border: none;}#tgd-interest .interest-bar{height: 20px;-webkit-transition: width 1.0s;transition: width 1.0s;}#tgd-interest .interest-category-link{cursor: pointer;}#tgd-interest .interest-bar-number{padding: 0 5px 0 5px;}#tgd-interest .border-right{border-right: 3px solid black!important;}#tgd-interest .breadcrumb{overflow: hidden;}#tgd-interest #interest-chart{min-height: 500px;}#tgd-interest .nowidth{width: 0!important;}
#our_people .our_people {height: 200px;background: url(/themes/tgd/img/our_way.png) no-repeat center center #ea6654;margin-top: 0;}#our_people .our_people_desc {height: 200px;padding:40px 30px;border:1px solid #e3e3e3;font-size:15px;}#our_people {margin-top: 20px;}#our_people h2 {background-color: #1c8ccf;}#our_people .our_people_more {cursor: pointer;margin: 0 auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;display: table;color: #fff;font-family: ProximaNovaSoft-Bold,Arial,sans-serif;font-size: 1.142em;text-transform: uppercase;text-align: center;border-radius: 25px;background-clip: padding-box;background-color: #6fbd7f;box-shadow: 0 2px 0 #4eab61,0 3px 3px #b8ccd8;padding: 5px 32px 5px;}#our_people .our_people_border {border: 1px solid #e3e3e3;margin-top: 0;padding: 10px 30px;}#our_people .our_people_border_avatars {border: 1px solid #e3e3e3;padding: 10px 0;}#our_people ul {list-style-type: none;}#our_people ul li{display: inline;font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;font-size: 20px;margin-right: 30px;}#our_people .thumbnail{border-radius: 0;min-height: 100%;width: 100%;}#our_people legend{position: relative;border-bottom: none;top: -53px;text-align: center;color: white;margin-bottom: -30px;}#our_people .our_people_margin{margin-left: 25px;}  @media (max-width: 350px) {#our_people .our_people_desc {height: auto;}.our_people_margin{margin-left: 0;}}@media(max-width: 550px){#our_people ul li{font-size: 14px;}#our_people .our_people_margin{margin-left: 0;}}
#profile_image{width: 150px;height: 150px;}.jcrop-holder{margin-top: 30px;}#User_image{visibility: hidden;width: 10px;float: left;}.profile_preview_block{height: 160px;}.profile_preview_block > div{width: 150px;height: 150px;overflow: hidden;}#notification_preferences_label{text-transform: none;}.notification_preferences{margin-top: -5px;}

But the main.css file is generated from main.less which in turn uses a set of other module files. This means that the next time someone edits any module file, the main.css will be rewritten and these rules will be overwritten.