.kerdes, form.kerdesekForm {
	width: 90vw;
	max-width: 100%;
	box-sizing: border-box;
        padding-bottom: 5px;
}

.kerdes {
    max-width: 600px;
}

.valasz {
	display: flex;
    margin-left: 35px;
    padding-top: 5px;
}
.valasz span {
    display: inline-flex; 
    max-width: 500px;
}

#feladatokDiv {
	width: 600px;
	max-width: 100%;
	margin: auto;
	box-sizing: border-box;

}

.feladat {
	float:left;
	width: calc( 100vw - 8px );
	padding: 5px;	
}


.tanfolyam-list {
    display: inline-table;
    width: 100%;
}

.tanfolyam-list .name {
    display: table-cell;
    width: 300px;
}
.tanfolyam-list .download {
    display: table-cell;
    width: 150px;
}
.tanfolyam-list .result {
    display: table-cell;
    width: 200px;
}

.tanfolyam-list .resultPercent {
    display: table-cell;width: 300px;
}

.kek-gomb, .lila-gomb{
    height: 28px;
    padding: 2px 15px 4px;
    color: #ffffff;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    line-height: 28px;
    margin-bottom: 10px;
}
.kek-gomb, .kek-gomb:visited, .kek-gomb:link, .kek-gomb:hover{
    background: linear-gradient(to bottom, #5DBEFE 0%, #377096 100%);
    text-decoration: none;
    color:#ffffff;
}

.lila-gomb, .lila-gomb:visited, .lila-gomb:link{
	background: linear-gradient(to bottom, #7e3585 0%, #3e0d45 100%);
    text-decoration: none;
    color:#ffffff;
}

.zold-gomb, .narancs-gomb, .szurke-gomb, .szurke-gomb:hover{
    font-weight: bold;
    height: 28px;
    padding: 2px 15px 4px;
	color:#ffffff;
	cursor:pointer;
	white-space: nowrap;
	display: inline-block;
	line-height: 28px;
	margin-bottom: 10px;
}

.szurke-gomb, .szurke-gomb:visited, .szurke-gomb:link, .szurke-gomb:hover{
    background: linear-gradient(to bottom, #898989 0%, #787878 100%);
    text-decoration: none;
    color:#ffffff;
}

.zold-gomb, .zold-gomb:visited, .zold-gomb:link{
	background: linear-gradient(to bottom, #55b145 0%, #0ea904 100%);
    color:#ffffff;
}

.narancs-gomb, .narancs-gomb:visited, .narancs-gomb:link{
	background: linear-gradient(to bottom, #febc44 0%, #fd7505 100%);
    color:#ffffff;
}


/************************
     rounded
*************************/

.rounded-5 {
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.rounded-8 {
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
}

.rounded-top-8 {
	border-radius: 8px 8px 0 0;
	-moz-border-radius: 8px 8px 0 0;
	-webkit-border-radius: 8px 8px 0 0;
}

.rounded-bottom-8 {
	border-radius: 0 0 8px 8px;
	-moz-border-radius: 0 0 8px 8px;
	-webkit-border-radius: 0 0 8px 8px;
}

.rounded-12-0{
	border-radius: 12px 0 0 12px;
	-moz-border-radius: 12px 0 0 12px;
	-webkit-border-radius: 12px 0 0 12px;
}


/**
 * Removing the checkbox and radio appearance
 */

.radio,
.checkbox {
   -webkit-appearance: none;
   -moz-appearance:    none;
   appearance:         none;
}

/**
 * Giving Checkbox & Radio not checked a new appearance
 */

.radio,
.checkbox {
  margin-top: 2px;  
  width: 15px;
  height: 15px;
  border: solid 1px #cccccc;
  margin-right: 8px;
  position: relative;
}

/**
 * Giving Checkbox & Radio checked state a new appearance
 */

.radio:checked::before,
.checkbox:checked::before {
  content: "";
  width: 9px;
  height: 9px;
  background-color: #ffa500;
  position: absolute;
  top: 2px;
  left: 2px;
}

/**
 * Rounding Radio inputs new appearance
 */

.radio,
.radio:checked::before{
  border-radius: 100%;
}