#form {
    max-width:              600px;
    padding:                24px;
}
.mdform input,
.mdform select,
.mdform textarea {
    font-family:            'Roboto', sans-serif;
    box-sizing:             border-box;
}

.mdform input::after,
.mdform input::before,
.mdform select::after,
.mdform select::before,
.mdform textarea::after,
.mdform textarea::before {
    box-sizing:             border-box;
}

.mdform .button-container {
    text-align:             center;
}

.mdform fieldset {
    margin:                 0 0 3rem;
    padding:                0;
    border:                 none;
}

.mdform .form-radio,
.mdform .form-group {
    position:               relative;
    margin-top:             3rem;
    margin-bottom:          3rem;
}

.mdform .form-inline > .form-group,
.mdform .form-inline > .btn {
  display:                  inline-block;
  margin-bottom:            0;
}

.mdform .form-help {
  margin-top:               0.125rem;
  margin-left:              0.125rem;
  color:                    #b3b3b3;
  font-size:                0.8rem;
}

.mdform .checkbox .form-help,
.mdform .form-radio .form-help,
.mdform .form-group .form-help {
  position:                 absolute;
  width:                    100%;
}

.mdform .checkbox .form-help {
  position:                 relative;
  margin-bottom:            1rem;
}

.mdform .form-radio .form-help {
  padding-top:              0.25rem;
  margin-top:               -1rem;
}

.mdform .form-group input {
  height:                   1.9rem;
}

.mdform .form-group textarea {
  resize:                   none;
}

.mdform .form-group select {
  width:                    100%;
  font-size:                1rem;
  height:                   1.6rem;
  padding:                  0.125rem 0.125rem 0.0625rem;
  background:               none;
  border:                   none;
  line-height:              1.6;
  box-shadow:               none;
}

.mdform .form-group .control-label {
    left:                   0;
    position:               absolute;
    top:                    -1rem;
    padding-left:           0.125rem;
    z-index:                1;
    color:                  gray;
    font-size:              0.8rem;
    font-weight:            normal;
    transition:             all 0.28s ease;
}

.mdform .form-group .bar {
    position:               relative;
    border-bottom:          0.0625rem solid #999;
    display:                block;
}

.mdform .form-group .radio .bar,
.mdform .form-group.form-radio .bar {
    display:                none;
}

.mdform .form-group .radio label {
    display:                inline-block;
    height:                 3em;
    line-height:            3em;
    margin-right:           20px;
}

.mdform .form-group .radio label.multiline {
    width:                  100%;
    height:                 2em;
    line-height:            2em;
}

.mdform .radio label.multiline .helper {
    top:                    2px;
}

.mdform .form-group .visited:invalid ~.bar::before {
    background:             red;    
}

.mdform .form-group .bar::before {
    content:                '';
    height:                 0.125rem;
    width:                  0;
    left:                   50%;
    bottom:                 -0.0625rem;
    position:               absolute;
    background:             #337ab7;
    transition:             left 0.28s ease, width 0.28s ease;
    z-index:                2;
}

.mdform .form-group input,
.mdform .form-group textarea {
    display:                block;
    background:             none;
    padding:                0.125rem 0.125rem 0.0625rem;
    font-size:              1rem;
    border-width:           0;
    border-color:           transparent;
    line-height:            1.9;
    width:                  100%;
    color:                  transparent;
    transition:             all 0.28s ease;
    box-shadow:             none;
}

.mdform .form-group input[type="file"] {
    line-height:            1;
}

.mdform .form-group input[type="file"] ~ .bar {
    display:                none;
}

.mdform .form-group select,
.mdform .form-group input:focus,
.mdform .form-group input,
.mdform .form-group input.form-file,
.mdform .form-group input.has-value,
.mdform .form-group textarea:focus,
.mdform .form-group textarea,
.mdform .form-group textarea.form-file,
.mdform .form-group textarea.has-value {
    color:                  #333;
}

.mdform .form-group .visited:invalid ~ .bar {
    border-bottom-color:    red;
}

.mdform .requiredmark {
    margin-left:            4px;
}

.mdform .form-group select ~ .control-label,
.mdform .form-group input ~ .control-label,
.mdform .form-group input.form-file ~ .control-label,
.mdform .form-group input.has-value ~ .control-label,
.mdform .form-group textarea:focus ~ .control-label,
.mdform .form-group textarea:valid ~ .control-label,
.mdform .form-group textarea.form-file ~ .control-label,
.mdform .form-group textarea.has-value ~ .control-label,
.mdform form .file_input_div > label.control-label {
    font-size:              0.8rem;
    color:                  gray;
    top:                    -1rem;
    left:                   0;
}

.mdform .form-group select:focus,
.mdform .form-group input:focus,
.mdform .form-group textarea:focus {
    outline:                none;
}.mdl-button--fab .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle,#fff,#000);
}

..mdl-button--fab .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle,#fff,#000);
}bel,
..mdl-button--fab .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle,#fff,#000);
}el,
..mdl-button--fab .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle,#fff,#000);
}label {
 .mdl-button--fab .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle,#fff,#000);
}
}

.mdform .form-group select:focus ~ .bar::before,
.mdform .form-group input:focus ~ .bar::before,
.mdform .form-group textarea:focus ~ .bar::before {
    width:                  100%;
    left:                   0;
}

.mdform .checkbox label,
.mdform .form-radio label {
    position:               relative;
    cursor:                 pointer;
    padding-left:           2rem;
    text-align:             left;
    color:                  #333;
    display:                block;
}
.mdform .checkbox input,
.mdform .form-radio input {
    width:                  auto;
    opacity:                0.00000001;
    position:               absolute;
    left:                   0;
}

.mdform .checkbox label.toggle input {
    height: 0;
	width: 0;
	visibility: hidden;
}

.mdform .checkbox label.toggle i.helper {
    cursor: pointer;
	text-indent: -9999px;
	width: 45px;
	height: 25px;
	background: grey;
	display: inline-block;
	border-radius: 100px;
    position: relative;
    border: none;
    vertical-align: middle;
    margin-right: 10px;
}

.mdform .checkbox label.toggle {
    padding-left:           0;
}

.mdform .checkbox label.toggle i.helper:after {
	content: '';
	position: absolute;
	top: 3px;
	left: 3px;
	width: 19px;
	height: 19px;
	background: #fff;
	border-radius: 90px;
    transition: 0.3s;
    opacity: 1;
    transform: none;
}

.mdform .checkbox label.toggle input:checked + i.helper:after {
	left: calc(100% - 3px);
	transform: translateX(-100%);
}

.mdform .checkbox label.toggle i.helper:before {
    opacity: 0;
}

.mdform .checkbox label.toggle input:checked + i.helper {
	background: #bada55;
}


.mdform .radio {
    margin-bottom:          1rem;
}
.mdform .radio .helper {
    position:               absolute;
    top:                    10px;
    left:                   -0.25rem;
    cursor:                 pointer;
    display:                block;
    font-size:              1rem;
    -webkit-user-select:    none;
    -moz-user-select:       none;
    -ms-user-select:        none;
    user-select:            none;
    color:                  #999;
}

.mdform .radio .helper::before, .radio .helper::after {
    content:                '';
    position:               absolute;
    left:                   0;
    top:                    0;
    margin:                 0.25rem;
    width:                  1rem;
    height:                 1rem;
    transition:             transform 0.28s ease;
    border-radius:          50%;
    border:                 0.125rem solid currentColor;
}

.mdform .radio .helper::after {
    transform:              scale(0);
    background-color:       #337ab7;
    border-color:           #337ab7;
}

.mdform .radio label:hover .helper {
    color:                  #337ab7;
}

.mdform .radio input:checked ~ .helper::after {
    transform:              scale(0.5);
}

.mdform .radio input:checked ~ .helper::before {
    color:                  #337ab7;
}

.mdform .checkbox {
    margin-top:             2rem;
    margin-bottom:          1rem;
}

.mdform .checkbox .helper {
    color:                  #999;
    position:               absolute;
    top:                    0;
    left:                   0;
    width:                  1rem;
    height:                 1rem;
    z-index:                0;
    border:                 0.125rem solid currentColor;
    border-radius:          0.0625rem;
    transition:             border-color 0.28s ease;
}

.mdform .checkbox .helper::before, .checkbox .helper::after {
    position:               absolute;
    height:                 0;
    width:                  0.2rem;
    background-color:       #337ab7;
    display:                block;
    transform-origin:       left top;
    border-radius:          0.25rem;
    content:                '';
    transition:             opacity 0.28s ease, height 0s linear 0.28s;
    opacity:                0;
}

.mdform .checkbox .helper::before {
    top:                    0.8rem;
    left:                   0.5rem;
    transform:              rotate(-135deg);
    box-shadow:             0 0 0 0.0625rem #fff;
}

.mdform .checkbox .helper::after {
    top:                    0.4em;
    left:                   0.1em;
    transform:              rotate(-45deg);
}

.mdform .checkbox label:hover .helper {
    color:                  #337ab7;
}

.mdform .checkbox i.mdl-button--fab .material-icons {
    position:               absolute;
    top:                    50%;
    left:                   50%;
    -webkit-transform:      translate(-12px,-12px);
    -ms-transform:          translate(-12px,-12px);
    transform:              translate(-12px,-12px);
    line-height:            24px;
    width:                  24px;
}
    
.mdl-button--fab .material-icons {
    position:               absolute;
    top:                    50%;
    left:                   50%;
    -webkit-transform:      translate(-12px,-12px);
    -ms-transform:          translate(-12px,-12px);
    transform:              translate(-12px,-12px);
    line-height:            24px;
    width:                  24px;
}

.mdl-button--fab .material-icons {
    position:               absolute;
    top:                    50%;
    left:                   50%;
    -webkit-transform:      translate(-12px,-12px);
    -ms-transform:          translate(-12px,-12px);
    transform:              translate(-12px,-12px);
    line-height:            24px;
    width:                  24px;
}

.mdl-button--fab .material-icons {
    position:               absolute;
    top:                    50%;
    left:                   50%;
    -webkit-transform:      translate(-12px,-12px);
    -ms-transform:          translate(-12px,-12px);
    transform:              translate(-12px,-12px);
    line-height:            24px;
    width:                  24px;
}

.mdl-button--fab .material-icons {
    position:               absolute;
    top:                    50%;
    left:                   50%;
    -webkit-transform:      translate(-12px,-12px);
    -ms-transform:          translate(-12px,-12px);
    transform:              translate(-12px,-12px);
    line-height:            24px;
    width:                  24px;
}

.mdform .checkbox input:checked ~ .helper::after, .checkbox input:checked ~ .helper::before {
    opacity:                1;
    transition:             height 0.28s ease;
}

.mdform .checkbox input:checked ~ .helper::after {
    height:                 0.5rem;
}

.checkbox input:checked ~ .helper::before {
    height:                 1.2rem;
    transition-delay:       0.28s;
}

.mdform .radio + .radio,
.mdform .checkbox + .checkbox {
    margin-top:             1rem;
}

.mdform .has-error .legend.legend,
.mdform .has-error.form-group .control-label.control-label {
    color:                  #d9534f;
}
.mdform .has-error.form-group .form-help,
.mdform .has-error.form-group .helper,
.mdform .has-error.checkbox .form-help,
.mdform .has-error.checkbox .helper,
.mdform .has-error.radio .form-help,
.mdform .has-error.radio .helper,
.mdform .has-error.form-radio .form-help,
.mdform .has-error.form-radio .helper {
    color:                  #d9534f;
}
.mdform .has-error .bar::before {
    background:             #d9534f;
    left:                   0;
    width:                  100%;
}

.mdform .button {
    position:               relative;
    background:             currentColor;
    border:                 1px solid currentColor;
    font-size:              1.1rem;
    color:                  #4f93ce;
    margin:                 1rem 0;
    padding:                0.75rem 3rem;
    cursor:                 pointer;
    -webkit-transition:     background-color 0.28s ease, color 0.28s ease, box-shadow 0.28s ease;
    transition:             background-color 0.28s ease, color 0.28s ease, box-shadow 0.28s ease;
    overflow:               hidden;
    box-shadow:             0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.mdform .button span {
    color:                  #fff;
    position:               relative;
    z-index:                1;
}

.mdform .button::before {
    content:                '';
    position:               absolute;
    background:             #071017;
    border:                 50vh solid #1d4567;
    width:                  30vh;
    height:                 30vh;
    border-radius:          50%;.mdl-button--fab .mdl-button__ripple-container {
        border-radius: 50%;
        -webkit-mask-image: -webkit-radial-gradient(circle,#fff,#000);
    }
    display:                block;
    top:                    50%;
    left:                   50%;
    z-index:                0;
    opacity:                1;
    transform:              translate(-50%, -50%) scale(0);
}

.mdform .button:hover {
    color:                  #337ab7;
    box-shadow:             0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
}

.mdform .button:active::before, .button:focus::before {
    transition:             opacity 0.28s ease 0.364s, -webkit-transform 1.12s ease;
    transition:             transform 1.12s ease, opacity 0.28s ease 0.364s;
    transition:             transform 1.12s ease, opacity 0.28s ease 0.364s, -webkit-transform 1.12s ease;
    transform:              translate(-50%, -50%) scale(1);
    opacity:                0;
}

.mdform .button:focus {
    outline:                none;
}

.mdform .mdl-button--fab .mdl-button__ripple-container {
    border-radius:          50%;
    -webkit-mask-image:     -webkit-radial-gradient(circle,#fff,#000);
}

.mdform .mdl-button__ripple-container {
    display:                block;
    height:                 100%;
    left:                   0;
    position:               absolute;
    top:                    0;
    width:                  100%;
    z-index:                0;
    overflow:               hidden;
}

.mdform .mdl-button--fab.mdl-button--colored {
    background:             #337ab7;
    color:                  rgb(255,255,255);
}

.mdform .mdl-button--fab {
    border-radius:          50%;
    font-size:              24px;
    height:                 56px;
    margin:                 auto;
    min-width:              56px;
    width:                  56px;
    padding:                0;
    overflow:               hidden;
    background:             rgba(158,158,158,.2);
    box-shadow:             0 1px 1.5px 0 rgba(0,0,0,.12), 0 1px 1px 0 rgba(0,0,0,.24);
    position:               relative;
    line-height:            normal;
}

.mdform .mdl-button {
    background:             0 0;
    border:                 none;
    border-radius:          2px;
    color:                  #000;
    display:                block;
    position:               relative;
    height:                 36px;
    min-width:              64px;
    padding:                0 8px;
    display:                inline-block;
    font-family:            "Roboto","Helvetica","Arial",sans-serif;
    font-size:              14px;
    font-weight:            500;
    text-transform:         uppercase;
    letter-spacing:         0;
    overflow:               hidden;
    will-change:            box-shadow,transform;
    -webkit-transition:     box-shadow .2s cubic-bezier(.4,0,1,1),background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1);
    transition:             box-shadow .2s cubic-bezier(.4,0,1,1),background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1);
    outline:                none;
    cursor:                 pointer;
    text-decoration:        none;
    text-align:             center;
    line-height:            36px;
    vertical-align:         middle;
}

.mdform .file_input_div .mdl-button span {
    width:                  115.137px;
    height:                 115.137px;
    transform:              translate(-50%, -50%) translate(22px, 27px);
}

.mdform .mdl-button--fab.mdl-button--mini-fab {
    height:                 40px;
    min-width:              40px;
    width:                  40px;
}

.mdform .mdl-button--fab {
    border-radius:          50%;
    font-size:              24px;
    height:                 56px;
    margin:                 auto;
    min-width:              56px;
    width:                  56px;
    padding:                0;
    overflow:               hidden;
    background:             rgba(158,158,158,.2);
    box-shadow:             0 1px 1.5px 0 rgba(0,0,0,.12), 0 1px 1px 0 rgba(0,0,0,.24);
    position:               relative;
    line-height:            normal;
}

.mdform .form-group select {
	height:					30px;
}

.mdform .mdl-button--fab .material-icons {
    position:               absolute;
    top:                    50%;
    left:                   50%;
    -webkit-transform:      translate(-12px,-12px);
    -ms-transform:          translate(-12px,-12px);
    transform:              translate(-12px,-12px);
    line-height:            24px;
    width:                  24px;
}

.mdform .form-group.file_input_div input.none {
    display:                none;
}

.mdform .form-group.file_input_div i.bar {
    margin-left:            60px;
}

.mdform form .file_input_div > label.control-label {
    left:                   60px;
}

.mdform .form-group.file_input_div input.file_input_text {
    width:                  calc(100% - 60px);
    position:               absolute;
    right:                  0;
    bottom:                 0;
    color:                  #222;
}

p.formintro {
    background-color:       #f8f8f8;
    padding:                24px;
    border-radius:          5px;
    color:                  #444;
}

.mdform .form-group.error .bar {
    border-color:           #C62828;
}

.mdform .error_message {
    margin:                 0.2em;
    font-size:              0.8rem;
    color:                  #C62828;
}

.mdform .tinymcewrapper,
.mdform .quillwrapper,
.mdform .ckeditorwrapper,
.mdform .codemirrorwrapper {
	padding-top:			6px;
}

.mdform .recaptcha i.bar {
	display:				none;
}

.mdform .codemirrorarea {
	border: 				1px solid #ccc;
    padding: 				12px;
}

.date-selects {
	display:				flex;
}

.mdform .form-group .date-selects ~ i.bar {
	display:				none;
}

.mdform .form-group .date-selects select {
	border-bottom:			1px solid #999;
	flex:					1;
}

.date-selects .date-dayselect, .date-selects .date-monthselect {
	margin-right:			20px;
}

.datetime-selects {
	display:				flex;
}

.mdform .form-group .datetime-selects ~ i.bar {
	display:				none;
}

.mdform .form-group .datetime-selects select {
	border-bottom:			1px solid #999;
	flex:					1;
}

.datetime-selects .date-dayselect, .datetime-selects .date-monthselect {
	margin-right:			20px;
}
.datetime-selects .date-hourselect {
	margin-left:			40px;
}


.mdform .form-group .datetime-selects select.date-monthselect {
	flex:					3;
}

.mdform .form-radio-icons input:checked + img {
	border-color:			#337ab7;
}

.mdform .form-radio-icons img {
	border:					2px solid transparent;
	padding:				2px;
	vertical-align:			middle;
	margin-right:			10px;
}

.mdform .form-radio-icons .radio .helper,
.mdform .form-radio-icons .radio .helper:before,
.mdform .form-radio-icons .radio .helper:after {
	display:				none;
}

.mdform .form-radio.form-radio-icons label {
	display:				inline-block;
}

.mdform .form-radio.form-radio-icons .radio {
	padding-top:			10px;
}

.mdform .form-radio.form-radio-icons .bar {
	display:				none;
}

.mdform .dadfile label,
.mdform .dadfile .daduploading,
.mdform .dadfile .daddone,
.mdform .dadfile .daderror {
    display:                none;
}

.mdform .dadfile.fullsupport > div {
    background-color:       white;
    outline:                2px dashed #888;
    outline-offset:         -10px;
    min-height:             100px;
    padding-top:            43px;
    box-sizing:             border-box;
    text-align:             center;
    color:                  #888;
}

.mdform .dadfile.fullsupport label {
    display:                inline;
    cursor:                 pointer;
}

.mdform .dadfile.fullsupport label:hover {
    color:                  #4f93ce;
}

.mdform .dadfile .dragover {
    background-color:       #eee;
}

.mdform .dadfile input {
    width:                  0.1px;
    height:                 0.1px;
    opacity:                0;
    overflow:               hidden;
    position:               absolute;
    z-index:                -1;
}

.mdform .dadfilefield i.bar {
    display:                none;
}

.mdform .form-group.dadfilefield .control-label {
    top:                    -1.5rem;
}