@charset "UTF-8";

/*
font-family: "fira-sans-n4", "fira-sans", sans-serif;   font-weight: 400; REGULAR
font-family: "fira-sans-n5", "fira-sans", sans-serif;   font-weight: 500; MEDIUM
font-family: "fira-sans-n6", "fira-sans", sans-serif;   font-weight: 600; SEMIBOLD
font-family: "fira-sans-n7", "fira-sans", sans-serif;   font-weight: 700; BOLD
*/

html {height: 101%; margin: 0; padding: 0;}
body {font-family: Arial, sans-serif; font-weight: 400; font-size: 100%; font-style: normal; margin: 0; padding: 0; height: 100%; position: relative;}
img {display: block; margin: 0; outline: 0; padding: 0;}
hr {width: 100%; height: 1px; background: #ccc; border: none; margin: 10px auto;}
img.seecmsimagedefault {display: inline-block; margin: 0 12px 12px 0!important;}
img.seecmsimageleft {float: left; margin: 0 12px 5px 0!important;}
img.seecmsimageright {float: right; margin: 0 0 12px 12px!important;}
h1,
.header p,
nav li a,
h2,
.thumbs a span,
.content article aside p,
nav .button a,
nav.snav .sectiontitle p,
header p {font-style: normal; font-weight: 400;}
p,
h1,
h2,
h3,
h4,
li { margin: 0; padding: 0; line-height: 1.4em;}
h1,
h2 {margin: 0 0 15px 0;}
p {color: #000; padding: 0 0 10px 0;}
ul {margin: 0; padding: 0;}
.col1,
.col2,
.col3,
.col4 {display: block; float: left;}
div:after,
form:after,
ul:after,
input:after,
section:after,
article:after,
header:after,
footer:after,
nav:after,
aside:after,
hgroup:after {clear: both; content: ""; display: block; height: 0; visibility: hidden;}
section,
article,
header,
footer,
nav,
aside,
hgroup {display: block;}
a {text-decoration: none; color: #6b2c8a;}
a:hover {text-decoration: underline;}
select {background: #cacaca; width: 100%; height: 33px;}
/* input[type="text"], input[type="password"], textarea, select, button {padding: 0 10px; box-sizing: border-box; height: 33px; background: #fff; border: 0; outline: 0;	resize: none;	font-family: Arial, sans-serif;	font-weight: normal; font-size: 100%;} */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"], textarea, select, button {border: 0; outline: 0; font-family: Arial, sans-serif; font-size: 70%;}

.hidden {display: none;}
.nopadding {padding: 0;}
.clear {clear: both;}
.workinghours-options-hidable {display: none;}
.lengthofservice-options-hidable {display: none;}
.age-options-hidable {display: none;}
.option-hidable {display: none; padding: 10px 0 0 0;}
.custom-hidden {display: none;}
.button-link {background: #6c2b88; color: #fff!important; text-decoration: none!important; font-weight: 500; padding: 5px; margin-top: 8px;}

.pageheader {width: 100%; height: 140px; background: #6b2c8a; position: relative;}
.pageheader .flower {position: absolute; background: url(../images/pageheader.png)no-repeat 0 0; background-size: contain; height: 100%; width: 500px;}
.pageheader .logo {position: absolute; background: url(../images/logo.png)no-repeat 0 0; background-size: contain; height: 100%; width: 371px; right: 0; top: 0;}
.pageheader .logo-container {position: relative; z-index: 10; padding: 30px 0; height: 100%; box-sizing: border-box;}
.pageheader .logo-container .clogo {padding: 15px; background: #fff; display: inline-block;}
.pageheader .logo-container .welcome-container {color: #eee; margin: 35px 20px 0 0; float: right; font-weight: 500; height: 100%; padding-right: 5%;}
.pageheader .logo-container .welcome-container a {text-decoration: none; background: #d7c5dd; color: #000; padding: 5px 10px; margin: 0 0 0 10px;}

.container {max-width: 1200px; height: auto; margin: 0 auto; width: 100%;}
.container.main {min-height: 50%; margin-bottom: 10px; padding-top: 39px; box-sizing: border-box;}
.pageheader .container {height: 100%;}

.login br {display: none!important;}
.container .login {width: 562px; height: auto; margin: 106px auto 10px;}
.container .login .heading {color: #6b2c8a; font-size: 150%; margin-bottom: 25px; font-weight: 600;}
.container .login .input {width: 100%; height: auto; margin-bottom: 12px;}
.container .login .input label {font-size: 100%; font-weight: 600; vertical-align: middle; line-height: 26px; float: left; margin-right: 1%; width: 33%; box-sizing: border-box; padding: 12px; background: #6b2c8a; color: #fff;}
.container .login .input input {line-height: 26px; float: left; width: 65%; box-sizing: border-box; padding: 12px; background: #e8e8e8!important; height: 49px;}
.container .login input[type="submit"] {font-size: 100%; font-weight: 600; float: right; outline: 0; border: 0; background: url(../images/loginbutton.png)no-repeat center center; box-sizing: border-box; padding: 10px; color: #fff; width: 93px; height: 42px; margin-right: 8px; cursor: pointer;}
.container .login .secondarybutton {margin-top: 4px; font-size: 100%; float: left; box-sizing: border-box; outline: 0; border: 0; background: transparent; color: #6b2c8a; padding: 10px;}

.survey-container .survey h1 {font-size: 150%; font-weight: 600; color: #6b2c8a;}
.survey-container .survey p {font-size: 100%; font-weight: 500;}
.survey-container {width: 100%; height: auto; margin-bottom: 40px; position: relative}

.pagefooter {width: 100%; height: auto; position: relative; margin-top: 150px;}
.pagefooter .container .bottom-bar {width: 100%; height: 2px; background: #6b2c8a; margin-bottom: 20px;}
.pagefooter .container .pagefooter-text p {margin-bottom: 40px; color: #cacaca; font-size: 100%; font-weight: 600;}

.navigation {width: 100%; height: auto; margin-bottom: 15px; border-bottom: 2px solid #ccc;}
.navigation ul {width: 100%; list-style: inline-block; margin-bottom: 10px;}
.navigation ul li {display: inline-block;}
.navigation ul li .number-container {float: left; width: 25px; height: 25px; background: #d3bddd; color: #fff; font-size: 89%; font-weight: 500; margin-right: 5px; text-align: center; vertical-align: middle; line-height: 179%; box-sizing: border-box;}
.navigation ul li a {float: left; text-decoration: none; color: #bbb; font-size: 100%; font-weight: 500; margin-right: 10px; vertical-align: middle; line-height: 24px;}
.navigation ul li.currentnav .number-container {background: #6b2c8a; color: #fff;}
.navigation ul li.currentnav a {color: #222;}
.navigation ul li.incompletesection a {color: #fb8a7f;}
.navigation ul li.incompletesection .number-container {background: #c73022;}

.adminnav {width: 100%; height: auto; margin-bottom: 15px; border-bottom: 2px solid #ccc;}
.adminnav ul {width: 100%; list-style: inline-block;}
.adminnav ul li {display: inline-block;}
.adminnav ul li a {float: left; text-decoration: none; background: #d7c5dd; color: #000; padding: 3px 8px; font-size: 100%; font-weight: 500; margin-right: 5px; vertical-align: middle; line-height: 24px;}
.adminnav ul li.selected a {background: #6b2c8a; color: #fff;}

.modal {position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); }
.modal .modal-content {background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #58c3bb; width: 80%; position: relative;}
.modal .modal-content .close {color: #aaa; position: absolute; font-size: 28px; font-weight: bold; top: -5px; right: 3px;}
.modal .modal-content .close:hover, .modal .modal-content .close:focus {color: black; text-decoration: none; cursor: pointer;}
.modal.manualeventpopup .modal-content {background-color: #58c3bb; margin: 15% auto; padding: 20px; border: 1px solid #58c3bb; width: 50%; position: relative; max-width: 600px;}
.modal .modal-content .closemanualevent {color: #fff; position: absolute; font-size: 28px; font-weight: bold; top: -5px; right: 3px;}
.modal .modal-content .closemanualevent:hover, .modal .modal-content .closemanualevent:focus {color: black; text-decoration: none; cursor: pointer;}

.blockbutton a {padding: 10px 15px; display: inline-block; background: #2a9c94; color: #ffffff; font-weight: 700; text-decoration: none; text-align: center; box-sizing: border-box; border-radius: 5px; margin: 0 5px 0 0; line-height: 100%; cursor: pointer;}
.blockbutton a.red {background: #E11F26;}
.blockbutton a.green {background: #85c73b;}
.blockbutton a.orange {background: #e49e00;}
.blockbutton a.grey {background: #8d9091;}

.customerstable {width: 100%; height: auto; margin-bottom: 10px;}
.customerstable .addCustomer {font-size: 100%; font-weight: 600; display: block; box-sizing: border-box; padding: 5px 10px; color: #fff; background: #6b2c8a; float: left; margin-top: 20px;}
.customerstable h1 {font-size: 150%; font-weight: 600; color: #6b2c8a; margin-bottom: 10px;}
.customerstable table tr th {font-size: 100%;}
.customerstable table tr td {vertical-align: middle;}
.customerstable table tr td ul {list-style: block;}
.customerstable table tr td ul li {font-size: 100%; font-weight: 500;}
.customerstable table tr td a {text-decoration: underline; color: #222;}
.customerstable table tr td strong {color: #222; font-weight: 600; font-size: 100%;}

/*
NOTE 'form .customerform' is used for the customer form and the
survey section form ('driver'), because they're the only places where
.customerform-container is inside form and not the other way around
*/
form .customerform-container {width: 100%; height: auto; box-sizing: border-box;}
form .customerform-container h1 {font-size: 100%; color: #6c2b88; font-weight: 600; margin-bottom: 20px;}
form .customerform-container .input {width: 100%; margin-bottom: 20px; box-sizing: border-box;}
form .customerform-container .input .left {float: left; box-sizing: border-box; width: 240px; height: auto; margin-right: 10px;}
form .customerform-container .input .left label {display: block; box-sizing: border-box; padding: 8px; background: #6c2b88; color: #fff; margin-right: 10px; width: 100%;}
form .customerform-container .input .right input {display: block; background: #cacaca; height: 34px; box-sizing: border-box; margin-top: 0; width: 100%; padding: 5px;}
form .customerform-container .input .right textarea {resize: vertical; background: #cacaca; box-sizing: border-box; padding: 5px; width: 100%; height: 100px;}
form .customerform-container .input .right {float: left; box-sizing: border-box; width: 340px;}
form .customerform-container .input .right input[type="submit"] {float: left; box-sizing: border-box; padding: 5px 10px; margin-right: 10px; background: #6c2b88; color: #fff; width: auto;cursor: pointer;}
form .customerform-container .input .right .file-input {background: #cacaca;}
form .customerform-container .input .right .file-input input[type="file"] {line-height: 24px; background: transparent!important; border: 0; background: 0; outline: 0;}

.customerform-container .input .right table th {background: #6c2b88; box-sizing: border-box; text-align: left; color: #fff; font-weight: 600; font-size: 600;}
.customerform-container .input .right table tr {margin-bottom: 3px;}
.customerform-container .input .right table tr td {height: 33px;}
.customerform-container .input .right table.userprofilefields tr td {height: 33px; vertical-align: top;}
.gu-mirror table tr td input {float: left; display: block; height: 12px; margin-top: 8px}
.customerform-container .input .right table tr td input {float: left; display: block; height: 12px; margin-top: 8px}
.customerform-container .input .right table tr td a {float: left; display: block;}
.gu-mirror a {float: left; display: block;}
.customerform-container .input .right table tr td a.pd-delete-profilefield {background: none; color: #6c2b88; padding: 5px;margin: 15px 0 0 0;}
.customerform-container .input .right table tr td a[data-addprofilefield] {color: #6c2b88; margin: 15px 0 0 0;}
.customerform-container .input .right table tr td a.pd-remove-option, .customerform-container .input .right table tr td a.pd-move-option {line-height: 23px; text-decoration: none!important;}
.gu-mirror a.pd-remove-option {background: none; line-height: 23px; text-decoration: none!important;}
.customerform-container .input .right table tr td a.pd-remove-reminder {float: right;}

.customerform-container .input .right table tr td.udlabel {width: 260px;}
.customerform-container .input .right table tr td.udlabel input {width: 100%;}
.customerform-container .input .right table tr td.udcheckbox {width: 70px; padding: 0;}
.customerform-container .input .right table tr td.udcheckbox label {display: block; padding: 18px 10px 10px 10px; text-align: center; height: 100%; line-height: 30px;}
.customerform-container .input .right table tr td.udcheckbox input {float: none; margin: 0;}

.customerform-container.surveyform {width: 100%; height: auto; box-sizing: border-box; margin-top: 10px;}
.customerform-container.surveyform .input {height: auto; margin-bottom: 10px;}
.customerform-container.surveyform .input .left {float: left; width: 35%; margin-right: 2%; min-height: 33px;}
.customerform-container.surveyform .input .left .add-field {float: right; display: block; background: #6c2b88; color: #fff; font-size: 95%; font-weight: 500; box-sizing: border-box; padding: 10px; margin-top: 2px;}
.customerform-container.surveyform .input .left label {display: block; height: auto; box-sizing: border-box; padding: 5px; color: #fff; font-size: 125%; font-weight: 500; background: #6c2b88; width: 100%;}
.customerform-container.surveyform .input .right {float: left; height: auto; width: 61%; min-height: 33px;}
.customerform-container.surveyform .input .right input {width: 103%; height: 33px; box-sizing: border-box; padding: 5px; background: #cacaca;}
.customerform-container.surveyform .input .right input[type="file"] {padding: 0 10px; line-height: 33px;}
.customerform-container.surveyform .input .right select {width: 103%; box-sizing: border-box; padding: 5px;}
.customerform-container.surveyform .input .right textarea {display: block; width: 103%; height: 100px; box-sizing: border-box; background: #cacaca; resize: vertical; padding: 5px;}

.customerform-container.surveyform .input .pd-options-container input {margin-right: 8px!important; margin-left: 8px; width: 76%;}
.customerform-container.surveyform .input .pd-options-container a {margin-top: 9px!important; padding: 0!important;}
.customerform-container.surveyform .input .pd-options-container a i.fas {color: #666; display: block; line-height: 33px;}


.gu-mirror input {float: left; min-height: 33px; height: 33px; box-sizing: border-box; padding: 5px; background: #cacaca; margin-right: 8px!important; width: 78%;}
.gu-mirror.pd-options-container a {margin-top: 9px!important; padding: 0!important;}
.gu-mirror.pd-options-container a i.fas {color: #666; display: block; line-height: 33px;}

.customerform-container.surveyform .submit-container {position: fixed; right: 1%; top: 278px; width: 285px;}
.customerform-container.surveyform .submit-container .pd-spinner-container {display: inline-block; width: 17%; text-align: left;}
.customerform-container.surveyform .submit-container .pd-spinner-container .fas {color: #6b2c8a; vertical-align: -16%;}
.customerform-container.surveyform .submit-container input {display: inline-block; width: 83%; font-size: 115%; font-weight: 500; margin: 0; border-radius: 3px; padding: 10px 0; -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.75); -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.75); box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.75);}

/* START New MH */

.customerform-container .pd-halves > .pd-input {width: 48%; float: left;}
.customerform-container .pd-halves > .pd-input:nth-child(2n+1) {margin-left: 0%; margin-right: 2%; clear: left;}
.customerform-container .pd-halves > .pd-input:nth-child(2n+2) {margin-left: 2%; margin-right: 0%;}

label.pd-file {width: 103%; display: block; position: relative; padding: 0 10px 0 12px; height: 33px; line-height: 33px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background: #cacaca; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all 0.25s ease; -webkit-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -o-transition: all 0.25s ease;}
label.pd-file .fas {color: #6c2b88; transition: all 0.25s ease; -webkit-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -o-transition: all 0.25s ease;}
label.pd-file .fa-times-circle {float: right; line-height: 33px; margin-left: 10px; display: none;}
label.pd-file .fa-times-circle:hover {text-decoration: none;}
label.pd-file:hover {background: #6c2b88; color: #fff;}
label.pd-file:hover .fas {color: #fff;}
label.pd-file input[type="file"] {position: absolute; opacity: 0; width: 0.1px!important; height: 0.1px!important; z-index: -1;}
.pd-file-uploaddate {padding: 10px 0 10px 12px;}
.pd-file-uploaddate .fas {color: #6c2b88;}

/* Toggles */
.pd-toggle {position: relative; display: inline-block; width: 60px; height: 33px;}
.pd-toggle.pd-toggle-input {display: block; margin: 8px 0 0 0;}
.pd-toggle .pd-slider {position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #cacaca; -webkit-transition: .4s; transition: .4s; border-radius: 33px;}
.pd-toggle .pd-slider:before {position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: #fff; -webkit-transition: .4s; transition: .4s; border-radius: 50%;}
label.pd-toggle input[type="checkbox"]:checked + .pd-slider {background-color: #6c2b88;}
label.pd-toggle input[type="checkbox"]:checked + .pd-slider:before {-webkit-transform: translateX(26px); transform: translateX(26px);}
label.pd-toggle input[type="checkbox"] {position: absolute; opacity: 0;}

/* Toggle - show / hide */
.pd-toggle.pd-toggle-showhide {width: 84px;}
label.pd-toggle.pd-toggle-showhide input[type="checkbox"]:checked + .pd-slider:before {-webkit-transform: translateX(50px); transform: translateX(50px);}
label.pd-toggle.pd-toggle-showhide input[type="checkbox"] + .pd-slider:after {position: absolute; content: "Hide"; height: 26px; line-height: 26px; right: 12px; bottom: 4px; color: #fff; font-size: .9em; font-weight: 600; -webkit-transition: .4s; transition: .4s; }
label.pd-toggle.pd-toggle-showhide input[type="checkbox"]:checked + .pd-slider:after {content: "Show"; right: unset; left: 11px;}
/* END New MH */

p.seeformerrors, p.pd-successmessage, p.pd-warningmessage, p.pd-infomessage {font-size: 100%; font-weight: 600; color: #fff; padding: 10px; margin-bottom: 20px;}
p.seeformerrors {background: #ce3e3a;}
p.pd-successmessage {background: #4cb853;}
p.pd-warningmessage {background: #ec6c3b;}
p.pd-infomessage {background: #ccc; color: #444;}

table {width: 100%;}
table tr {min-height: 10px;}
table tr th {background: #6c2b88; padding: 15px 10px; font-size: 95%; font-weight: 600; color: #fff; text-align: left;}
table tr td {background: #faecff; color: #222; padding: 10px;}

.section-container table tr th {width: 100px; text-align: center;}
.section-container table.questions tr td {padding: 0}
.section-container table.questions tr td label {display: block; width: 100%; text-align: center; padding: 15px 0;}
.section-container table.questions td.question {padding: 10px; text-align: left;}
.section-container table.comments {margin-top: 30px;}
.section-container table.comments th {text-align: left;}
.section-container table.comments tr td {height: 200px; padding: 20px;}
.section-container table.comments tr td textarea {resize: vertical; width: 100%; height: 100%; background: transparent; font-size: 100%;}

.survey form input[type="button"] {cursor: pointer; background: #6c2b88; outline: 0; border: 0; font-size: 120%; color: #fff; width: 100%; height: 100%;}
.survey form .submit-button-wrapper, .survey form .back-button-wrapper {width: 138px; margin: 20px 0 10px 0;}
.survey form .submit-button-wrapper {float: right;}
.survey form .back-button-wrapper {float: left;}
.survey form .submit-button-wrapper .submit-wrap, .survey form .back-button-wrapper .back-wrap {height: 33px; width: 123px;}
.survey form .submit-button-wrapper .submit-wrap {float: left;}
.survey form .back-button-wrapper .back-wrap {float: right;}
.survey form .submit-button-wrapper .arrow, .survey form .back-button-wrapper .back-arrow {width: 15px; height: 33px; float: left;}
.survey form .submit-button-wrapper .arrow {background: url(../images/arrowend.png)no-repeat center center;}
.survey form .back-button-wrapper .back-arrow {background: url(../images/arrowback.png)no-repeat 0 0;}

.container.main h1 {font-size: 150%; color: #6c2b88; font-weight: 600;}
.container.main .completiondate {float: right; margin-bottom: 10px;}
.container.main .completiondate h1 {text-align: right; font-size: 125%; font-weight: 600;}
.container.main .completiondate p {text-align: right; font-size: 125%; font-weight: 500; color: #6c2b88!important;}
.container.main form .landingpage-form-container {width: 100%; height: auto; margin-top: 10px;}
.container.main form .landingpage-form-container .input {width: 100%; height: auto; margin-bottom: 20px;}
.container.main form .landingpage-form-container .input .left-column {float: left; margin-right: 20px;}
.container.main form .landingpage-form-container .input .left-column label {float: left; padding: 5px; box-sizing: border-box; display: block; width: 240px; height: 34px;background: #6c2b88; color: #fff; font-size: 125%; font-weight: 600; margin-right: 3px;}
.container.main form .landingpage-form-container .input .left-column input {background: #e8e8e8; color: #222; height: 34px; float: left; box-sizing: border-box; padding: 5px; width: 345px;}
.container.main form .landingpage-form-container .input .right-column {float: left;}
.container.main form .landingpage-form-container .input .right-column label {float: left; padding: 5px; box-sizing: border-box; display: block; width: 240px; height: 34px; background: #6c2b88; color: #fff; font-size: 125%; font-weight: 600; margin-right: 3px;}
.container.main form .landingpage-form-container .input .right-column input {background: #e8e8e8; color: #222; height: 34px; float: left; box-sizing: border-box; padding: 5px; width: 345px;}
.container.main form .landingpage-form-container .input > label {height: 33px; float: left; width: 255px; background: #6c2b88; box-sizing: border-box; padding: 5px; color: #fff; font-size: 125%; font-weight: 600; margin-right: 5px;}
.container.main form .landingpage-form-container .input > input {height: 33px; float: left; width: 190px; box-sizing: border-box; background: #e8e8e8; color: #222; margin-right: 22px;}
.container.main form .landingpage-form-container .input > select {height: 33px; float: left; width: 190px; margin-right: 22px; background: #e8e8e8;}

.surveyform .questions .checkbox-select {width: 30%; height: 33px; margin-bottom: 10px; line-height: 33px; background: #faecff;}
.surveyform .questions {padding-top: 10px;}
.surveyform .questions ul {list-style-type: none;}
.surveyform .questions ul li {background: #cacaca url( ../images/sortable.png ) top right no-repeat; padding: 5px; margin-bottom: 10px;}
.surveyform .questions ul li input[type="text"] {font-size: 120%; padding: 4px 8px; width: 80%;}
.surveyform .questions .section ul li {background: #fff url( ../images/sortable.png ) top right no-repeat; padding: 5px; margin: 10px; font-size: 90%;}
.surveyform .reminders-container .addareminder {background: #6c2b88; margin: 10px 0 0 2px; padding: 4px 8px; display: inline-block;}
.surveyform .reminders-container .addareminder a {color: #fff; text-decoration: none;}
/*.surveyform .questions*/ .addaquestion {background: #6c2b88; margin: 0 10px; padding: 4px 8px; display: inline-block;}
/*.surveyform .questions*/ .addaquestion a {color: #fff; text-decoration: none;}
/*.surveyform .questions*/ .addaquestion-sectionpage {background: #6c2b88; margin: 0 10px; padding: 4px 8px; display: inline-block;}
/*.surveyform .questions*/ .addaquestion-sectionpage a {color: #fff; text-decoration: none;}
/*.surveyform .questions*/ .descriptionbox {margin: 5px 0 20px 0;}
.surveyform .rightmulti {padding: 10px; background: #cacaca;}
.surveyform .questions .commentsplaceholder {margin: 0 10px;}
.surveyform .questions .commentsplaceholder textarea {width: 99%; padding: 5px; font-size: 100%;}
.surveyform input[type="checkbox"], .surveyform input[type="radio"] {width: auto!important; height: auto!important; display: inline!important;  }

.deletequestion {display: inline-block; vertical-align: bottom; margin: 0 10px;}

.pro-dev-button {display: block; box-sizing: border-box; background: #6b2c8a; color: #fff; float: left; margin: 0 5px 20px 0; padding: 5px 10px; font-size: 100%; font-weight: 500;}
.pro-dev-button:hover {text-decoration: none;}

/* Invite Form */
#invite-form {width: 100%; box-sizing: border-box;}
#invite-form .input {width: 100%; height: auto; margin-bottom: 10px;}
#invite-form .input .left {float: left; width: 35%; margin-right: 2%; min-height: 33px;}
#invite-form .input .left label {display: block; height: auto; box-sizing: border-box; padding: 5px; color: #fff; font-size: 125%; font-weight: 500; background: #6c2b88; width: 100%;}
#invite-form .input .right {float: left; height: auto; width: 61%; min-height: 33px;}
#invite-form .input .right input {width: 85%; height: 33px; box-sizing: border-box; padding: 5px; background: #cacaca;}
#invite-form .input .right select {display: block; float: left; width: 20%; padding: 5px; margin-left: 10px;}
#invite-form .input .right input[type="text"] {display: block; float: left; width: 50%; padding: 5px; margin-right: 5px;}
#invite-form .input .right input[type="file"] {background: #e8e8e8; padding: 0}
#invite-form p strong {font-weight: 500; font-size: 125%; color: #6b2c8a;}

.submit-container input[type="submit"] {background: #6b2c8a; border: 0; outline: 0; font-size: 125%; color: #fff; box-sizing: border-box; padding: 5px 10px; cursor: pointer; transition: all 0.4s ease; -webkit-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease;}

.submit-container input[type="submit"].pd-disabled {background: #d7c5dd; color: #000; font-weight: normal;}
.submit-container a {margin-left: 20px;}

.filter {width: auto; margin-bottom: 20px; height: 25px;}
.filter label {display: block; background: #6b2c8a; color: #fff; font-size: 89%; font-weight: 500; box-sizing: border-box; padding: 5px; height: 25px; float: left; margin-right: 5px;}
.filter input {width: 150px; background: #e8e8e8; color: #222; height: 25px; display: block; box-sizing: border-box; padding: 5px;}

/* SAVING */
.save-container {float: right; position: relative; width: 150px; background: #ccc; color: #444; padding: 8px; text-align: center; display: none;}
.saveandexit-container {float: right; position: relative; width: 150px; background: #6B2C8A; color: #fff; padding: 8px; text-align: center; cursor: pointer;}
.save-icon {position: relative; height: 20px; width: 25px; display: block; padding-top: 10px; -moz-border-radius: 3px; border-radius: 3px;}

/* XXX not sure .loader is used - remove? */
.loader {
  background: #e2e2e2;
  width: 80%;
  height: 3px;
  display: block;
  margin: 2px auto;

  position: relative;
  overflow: hidden;

  -webkit-animation: fade-loaders 0.2s 3s forwards;
     -moz-animation: fade-loaders 0.2s 3s forwards;
          animation: fade-loaders 0.2s 3s forwards;
}

.loader:after {
  content: "";
  background: #2c3033;
  width: 0;
  height: 5px;
  position: absolute;
  top: 0; left: 0;
}

.loader:first-child:after {
  -webkit-animation: loader 0.4s 1s forwards;
     -moz-animation: loader 0.4s 1s forwards;
          animation: loader 0.4s 1s forwards;
}

.loader:nth-child(2n):after {
  -webkit-animation: loader 0.4s 1.5s forwards;
     -moz-animation: loader 0.4s 1.5s forwards;
          animation: loader 0.4s 1.5s forwards;
}

.loader:nth-child(3n):after {
  -webkit-animation: loader 0.4s 2s forwards;
     -moz-animation: loader 0.4s 2s forwards;
          animation: loader 0.4s 2s forwards;
}

@-webkit-keyframes loader {0% {width: 0%;}100% {width: 100%;}}
   @-moz-keyframes loader {0% {width: 0%;}100% {width: 100%;}}
        @keyframes loader {0% {width: 0%;}100% {width: 100%;}}

@-webkit-keyframes pop {
  0%   {-webkit-transform: scale(0);}
  100% {-webkit-transform: scale(1);}
}
@-moz-keyframes pop {
  0%   {-moz-transform: scale(0);}
  100% {-moz-transform: scale(1);}
}
@keyframes pop {
  0%   {transform: scale(0);}
  100% {transform: scale(1);}
}

@-webkit-keyframes fade-loaders {
  0%   {opactity: 1;}
  100% {opacity: 0;}
}
@-moz-keyframes fade-loaders {
  0%   {opactity: 1;}
  100% {opacity: 0;}
}
@keyframes fade-loaders {
  0%   {opactity: 1;}
  100% {opacity: 0;}
}

input.questioncheckbox {float: left;}
textarea.comments-survey {width: 1080px; height: 80px; resize: vertical;}

#reminders input[type="checkbox"] {margin: 5px 10px 5px 5px; float: none;}
#reminders input[type="radio"] {margin: 5px 10px 5px 5px; float: none;}
#reminders input[type="text"] {width: 85%; float: none; margin-bottom: 15px;}
#reminders textarea {margin-top: 8px;}
#reminders .reminder-container .sendto-container {margin: 8px 0 15px 0;}
#reminders .reminder-container > .reminder-left {float: left; width: 50%; padding-right: 1%;}
#reminders .reminder-container > .reminder-right {float: left; width: 46%; padding-left: 1%;}

@media screen and (max-width: 1700px){
  .pageheader .logo-container .welcome-container {padding-right: 10%;}
}

@media screen and (max-width: 1600px){
  .pageheader .logo-container .welcome-container {padding-right: 20%;}
}

@media screen and (max-width: 1350px){
  .pageheader .logo-container .welcome-container {padding-right: 331px;}
}