/*
########################### anthrazit ag ############################
### +-----------------------------------------------------------+ ###
### |      Project Name: moPage, CSS for new moPage Design      | ###
### |      Author: Stalder, Lukas                               | ###
### |      Datum: 29.05.2012                                    | ###
### |      (c) anthrazit ag, Zuerich                            | ###
### +-----------------------------------------------------------+ ###
#####################################################################
*/




/* forms
******** */


/*input line / areas */
form .elementEditBox      { background-color: #f6f6f6; }
input[type='text'],
form textarea,
form input[type='tel'],
form input[type='file'],
form input[type='url'],
form input[type='password'],
form input[type='email'],
form input[type='search'],
form input[type='number'],
.elementForm .inputLine,
.elementForm .inputField { font-family: monospace; color:#555; letter-spacing:-0.02em; border-radius:6px; font-size:13px; -webkit-appearance: none; width:100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  background: #fcfcfc none!important; border:1px solid #ddd!important; padding:3px 0.5em 3px 0.5em!important; }
input[type='text'], form input[type='tel'], form input[type='file'], form input[type='password'], form input[type='email'], form input[type='search'], form input[type='number'], .elementForm .inputLine  { width:100%;  line-height: 28px; height:28px; }
form input[disabled='disabled'], form textarea[disabled='disabled'] { opacity:0.5;}

.opacityfull { opacity: 1!important;}

.inputSelect {  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  width:100%; max-width:282px; }
.elementFormNew { max-width: 577px; }
.elementFormNewFull { max-width:none!important; }

.mopagecms .elementFormNew { max-width: 100%; }


form input[type="checkbox"], form input[type="radio"] { padding:0; margin:0 0.5em 0 0;}

/* mopage frontend forms overrides*/
.mmw input[type='text'],
.mmw textarea,
.mmw input[type='tel'],
.mmw input[type='url'],
.mmw input[type='password'],
.mmw input[type='email'],
.mmw input[type='search'],
.mmw input[type='number'],
.mmw .elementForm .inputLine { border-radius:4px; height:31px; line-height: 31px; background-color: white!important; font-family: inherit;}

.mmw textarea { height: 5em; line-height:130%;}

form input[type='file'] { border:none!important; padding:0 0 0 40px!important; background-color: inherit!important; font-size:11px; line-height:20px; font-family: inherit; color:#888; font-style:italic; border-radius:0!important;
	background-image: url(/appl/grfx/mopage/browse2x.png)!important;
	background-size: 25px 25px!important;
	background-position:left 2px!important;
	background-repeat: no-repeat!important;
}
form input.blankfile { background-image: url(/appl/grfx/mopage/attachment.png)!important;  padding:0 0 0 30px!important;}

.fakefile .button, .fakefile .fileUploadPreview, .fakefile .fileUploadPreview img { vertical-align: middle;}
.fileUploadPreview     { display: none;  }
.fileUploadPreview img { max-width:70px; height:40px; margin-left:1em; }


/* input verif code */
.inputVerifCodeBG { background-image: url(/appl/grfx/bginputnumbers.png); width:188px; border:1px solid #ddd; margin-top:0.5em; border-radius: 3px; background-color: white;  }
form input[type='number'].inputVerifCode {  margin:0 0 0 8px!important; padding:0!important; border:none!important; font-size:30px; line-height:50px; height:50px; width:190px; -moz-appearance:textfield; letter-spacing: 20px; background: transparent!important;}
.inputVerifCode::-webkit-inner-spin-button,
.inputVerifCode::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.inputVerifCode:focus{ outline: none; }

/* button */
input[type='submit']:not(.go), input[type='button'], .button, .buttonBlue, .online form input.button, .online form input.buttonBlue, .buttonAuto, .buttonSmall, .buttonChars, .buttonMini
					{ -webkit-appearance: none; font-size:13px; display:inline-block;  min-width:105px; margin:0.2em 0 0.2em 0; padding:0 1em 0 1em; height:40px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; line-height:40px; color:#fff!important;  background: url(/appl/grfx/mopage/bg_button.png) top left repeat-x #323232;  border:none; border-radius:6px; text-align: center; cursor:pointer;}
.buttonBlue, .online form input.buttonBlue, .buttonChars
					{ background: url(/appl/grfx/mopage/bg_button_blue.png) top left repeat-x #067DA8!important; }
.buttonAuto         { width:auto; height:auto; line-height:23px; min-width:2em; padding:0.2em 0.8em 0.2em 0.6em;}
input[type='submit'].buttonSmall, .mopage .buttonSmall, .mmw .buttonSmall, input.buttonSmall         { height:25px; font-size:11px; font-family: Zurich, Arial; letter-spacing: 0;  border-radius: 4px; line-height:23px }
.buttonChars         { min-width:inherit; width: 3em; }
.mmw .button, .mmw .buttonSmall, .mmw input[type='submit']:not(.go), .mmw input[type='button'] { background: none #858585; }
.mmw input + .buttonSmall { margin-top:4px; }
.buttonMini         { font-size:9px; padding:2px 6px 2px 6px; line-height:130%;height:auto; min-width:0; border-radius: 3px; }
.buttonRound        { min-width:0; min-height:0; width:40px; height:40px;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; border-radius:20px;  padding:0 0 0 0; }
.buttonRound img    { margin:0 0 0 0!important; padding:0;}
.buttonSmall img.icon { height:14px; width:auto; margin:0 0.3em 0 0; vertical-align:-0.2em; }

/* button override alerts */
.infobox .button { height:30px; line-height:30px; font-weight:normal; min-width:0;  padding:0 0.7em 0 0.7em; border-radius:3px; margin-top:0.5em;  }

/* drag/drop*/
.elementDropzone .drop-files-container { border:5px dashed #ddd; width:100%; height:200px; color:#d0d0d0; border-radius:10px; display: table-cell; vertical-align: middle; text-align: center; background: url(/appl/grfx/modules/usercontent/placeholderimgtrnsp.svg) center center no-repeat #f8f8f8; background-size: contain}
.elementDropzone .dropzone.dz-drag-hover { border-style:dashed; border-color: #87c6f9; background-color: #e9f5fe; color: #53718e; }
.elementDropzone .dropzone .dz-message {  margin: 10em 0 0 0; }
@media screen and ( max-width: 600px ) {
	.elementDropzone .dropzone .dz-message {  margin: 4em 0 0 0; }
	.elementDropzone .drop-files-container { background-position: center top ; background-size: auto;}
}
.objEdit .block .elementDropzone .drop-files-container { height:100px; background-position: center -10px}
.objEdit .block .elementDropzone .dropzone .dz-message {  margin: 4.5em 0 0 0; font-size:90%; }

	/* new forms */
.elementFormNew .row { padding:1em 0 1em 0; }
.elementFormNew label { display:block; padding:0; margin:0 0 0.3em 0; }
.elementFormNew label.before { display:inline-block; width:6em; font-weight:normal;}
.elementFormNew input + label { display:inline; }
.elementFormNew .zipLeft { width:30%; float:left }
.elementFormNew .cityRight { width:69%; float:right }
.elementFormNew input[type='file'], .elementFormNew input[type='file'] + input[type='submit'] { width:auto; }
.elementFormNew .someChars { width:4.5em;}
.elementFormNew .fewChars { width:6.5em;}
.elementFormNew .date { width:7.3em;}
.elementFormNew .half { width:50%;}
.elementFormNew .almosthalf { width:45%;}
.elementFormNew .time { width:5em;}
.elementFormNew .time::placeholder, .elementFormNew .date::placeholder { font-size:90%;}
.elementFormNew .dateInfo { color: #3493ff;}
.elementFormNew textarea { min-height:6em;}
.elementFormNew button { border:none; background: none; padding:0; margin:0; vertical-align: middle;;}
.elementFormNew select.lines option { border-bottom: dotted 1px #ccc; }
.sortable              { list-style-type: none; margin: 0; padding: 0; }
.sortable .row            {  }
.elementFormNew h2.caption { margin:1em 0 0.5em 0;}
.elementFormNew fieldset   { border:1px solid #ddd; padding:0.8em; display:block; margin-top:0.5em; border-radius:3px;}
.elementFormNew  .selectedRow input { animation-name: borderpulse; animation-duration: 3s; animation-iteration-count: infinite; -webkit-animation-name: borderpulse; -webkit-animation-duration: 3s; -webkit-animation-iteration-count: infinite; }
@keyframes borderpulse {
	0% { box-shadow: 0 0 6px -2px #f00;}
	50% { box-shadow: 0 0 6px -4px #f00;}
	100% { box-shadow: 0 0 6px -2px #f00;}
}
.elementFormNew .formBlock { background-color: #f6f6f6; padding:0px 0 0px 0; }
.elementFormNew .formBlock .row { padding-left:8px; padding-right:8px;}
.elementFormNew .colorinputs input, .colorinputs .minicolors-swatch { margin-bottom:0.2em!important;}
.elementFormNew div.dangerzone { background-color: #f8f8f8; padding:1em!important; border:3px dashed #ddd !important; border-width: 5px!important; border-radius:15px; }
.elementFormNew div.dangerzoneactive { background-color: #f1f1f1; border-color: #dd0000!important; }

.elementFormNewFull { width:100%;}

.objEdit select { max-width:100%;}

/* wizards overrides */
.wizard label             { font-weight:bold; }
.wizard label.indent, .prelabel      { width: 20%!important; display:inline-block; font-weight: normal; margin-left:0; }
.wizard input + label     { font-weight:normal; }
.wizard .block label     { font-weight:normal; }
.wizard .cols4 label      { font-size:80%;}
.wizard .indent           { margin-left:23px;}
.wizard .indentMore           { margin-left:27px;}

.wizard .row              { padding:0.8em 0 0.8em 0; border-bottom:1px solid #999;  }
.noborders .row              { padding:0.5em 0 0.5em 0; border-bottom:none;  }
.online .wizard .row      {  border-color:#bbb; }
.wizard .altRow           { padding:0.3em 0 0.3em 0; border-bottom:1px dotted #ccc; }
.wizard .altRow:last-of-type   { padding:0.3em 0 0 0; border:none }
.wizard .altRow:only-child   { padding:0 0 0 0; border:none; }
.cmslist .row:first-of-type    {  border-top:1px solid #999;  }
.online .cmslist .row:first-of-type    {  border-top:1px solid #bbb;  }
.compact .row              { padding:0.5em 0 0.5em 0;   }
.compacter .row              { padding:0.2em 0 0.3em 0;   }
.mmw .wizard .row, .noBorderForm .row         {padding:4px 0 4px 0; border:none;   }
.wizard .row .desc        { margin-bottom:0.5em; }
.wizard .smallPadding     { padding:0.5em 0 0.5em 0; }
.wizard .rowInner, .wizard .topBorder .rowInner:first-of-type         { padding:0.3em 0 0.3em 0; border-top:1px dotted #ccc; line-height:27px;  }
.wizard .rowInner div        { padding:0; line-height: 130%;  }
.wizard .smallrows .rowInner         { padding:0em 0 0em 0; }
.wizard .rowInner:first-of-type   { border:none;  }

.wizard .borderTop        { border-color:#999;  }
.online .wizard .borderTop        { border-color:#bbb;  }
.wizard .row:last-child   { border-bottom:none; }
.wizard .right            { text-align: left;}
.wizard .right img        { max-width:120px; max-height:50px; }
.wizard .logo img        { max-width:200px; margin-top:0.5em;  }
.wizard .logobanner .logo img        { max-width:none; width:100%; margin-top:0.5em;  }
.wizard .rightAuto        { margin-left:1em;}
.wizard .descRight        { font-size:85%; }
.wizard .smallButtons, .wizard .alignRight     { text-align: right;}
.wizard .smallButtons .button, .wizard .smallButtons .buttonSmall{ margin-bottom:2px; }
.wizard .autoButtons .button, .wizard .autoButtons .buttonSmall { min-width:70px; }
.wizard .descBelow        { margin-top:0.5em; font-size:85%;}

.blockDisabled	          { opacity:0.6;  alpha(opacity = 60);}
form .blockDisabled input[disabled='disabled'], form .blockDisabled textarea[disabled='disabled'] { opacity:1; alpha(opacity = 100);}

.elementSitemap .blockDisabled { opacity:0.6;  alpha(opacity = 60);}
.wizard .bgAdmin          { padding:1em 0 1em 0;}
.wizard .bgAdminInner     { padding:0.4em 0 0.4em 0;}
.wizard .bgAdminHalf      { margin:-0.8em 0 -0.8em 0;}
.wizard .bgAdminInline     { padding:0.1em 0.2em 0.1em 0.2em; display: inline-block;}
.wizard .negMarginBottom, .negMarginBottom  { margin-bottom:-1em;}
.wizard .negMarginTop     { margin-top:-0.6em!important;}
.wizard .error, .wizard .success { font-weight:normal;}
.wizard .error             { color:#c00;}
.wizard .col              { float:left; width:50%; }
.wizard .cols3            { float:left; width:32%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  }
.wizard .cols4            { float:left; width:25%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  }
.wizard .cols3:nth-of-type(2)   { margin:0 2% 0 2%;  }
.wizard .col input        { max-width:98%;}
.wizard .inline input     { max-width:60%;}
.wizard .left30           { width:30%; }
.wizard .left75           { width:75%; }
.wizard .left80           { width:82%; }
.wizard .left70           { width:70%; }
.wizard .left60           { width:60%; }
.wizard .left65           { width:65%; }
.wizard .left50           { width:50%; }
.wizard .right            { width:50%; }
.wizard .right25          { width:25%; }
.wizard .right30          { width:30%; }
.wizard .right65          { width:65%; }
.wizard .twoRows              { height:4em; min-height: 0; }
.pre                      { white-space:pre-wrap;}
.wizard .buttonBar        { margin-top:1em;}
.wizard .buttonBar input[type='button'], .wizard .buttonBar input[type='submit']  { float:left; width:30%!important; margin:0 5% 0 5%; text-align: center; }
.wizard .buttonBar input:first-of-type  { margin:0;}
.wizard .buttonBar input:last-of-type  { margin:0; float:right;}
.wizard .buttonsRight  { text-align: right; margin-top:-0.6em;}
.wizard .buttonsRight input { width:auto!important; min-width:100px;  }
.wizard .inline           { display:inline;}
.wizard .selectdropdown              { height:35px;  }
@media screen and ( max-width: 600px ) {
	.wizard .selectdropdown              { height:35px; width:100%;  }
}
.wizard select.inline           { vertical-align: top; }
/*.withBlocks .block    { padding:10px 10px 10px 10px; background-color: #eee; margin:0 0 5px 0; border-radius:5px;}*/
.withBlocks .block    { padding:0; margin:0 0 5px 0; }
.withBlocks .block .rowInner:first-of-type  {border-top:1px dotted #ccc; }
.withBlocks .block .rowInner  { padding:0.5em; margin-top:5px; border:none; border-bottom:1px dotted #ccc; position:relative }
.withBlocks .block .rowInner .clearRow { position:absolute; right: 10px; top:20px;}
.size123 .withBlocks .block    { padding:0; margin:0 0 10px 0; border-radius:5px;}
.size123 .withBlocks .block .cols3 { width: 50%; float: left; padding: 0; margin:0; }
.anchorFront               { position:absolute; margin-top:-80px;}
.wizard .radioIcons img    { height:35px; width:auto; vertical-align: middle; }

.wizard dl dt, .wizard dl dd { vertical-align: middle; border:none; padding:0; display:block; float:left; font-size:90%;}
.wizard dl dt               { width:40%; }
.wizard dl dd               { width:60%;  }
.wizard input::placeholder, .wizard textarea::placeholder {  font-size:0.9em;}
.placeholderCaptions input::placeholder, .placeholderCaptions textarea::placeholder { font-style:italic; letter-spacing: 0.03em; opacity: 0.5; }

/* form table*/
.formTable td { padding:0.3em 0 0.3em 0;}
.formTable td:first-child { padding-right:0.8em;}


/* password strengt checker */
.formPwd .button_strength { color:#aaa; font-size: 90%;}
.formPwd .strength_meter { display: inline-block; float:right; font-size: 90%;}
.formPwd .strength_meter { }
.formPwd .strength_meter div {}
.formPwd .veryweak {	color: #ff5e1f; }
.formPwd .weak {	color: #ffb46c; }
.formPwd .medium {	color: #dcc355; }
.formPwd .good {	color: #7793b3; }
.formPwd .verygood {	color: #15b31e; }


/* de-robot form*/
.elementDeRobot         { max-width: 600px; }
.elementDeRobot img     { max-width:100%;}
.elementDeRobot input[type='text'] { width:75%; float:left; }
.elementDeRobot input[type='submit'] { min-width:0; width:23%; height:30px; float:right; margin-top:1px; }



/* ios like checkboxes */
input.fancycb {
	max-height: 0;
	max-width: 0;
	opacity: 0;
	display:none;
}
input.fancycb + label {
	display: inline-block;
	position: relative;
	box-shadow: inset 0 0 0 1px #d5d5d5;
	text-indent: -5000px;
	height: 26px;
	width: 46px;
	border-radius: 13px;
	vertical-align: middle;
}

input.fancycb + label:before {
	content: "";
	position: absolute;
	display: block;
	height: 26px;
	width: 26px;
	top: 0;
	left: 0;
	border-radius: 13px;
	background: rgba(19,191,17,0);
	-moz-transition: .15s ease-in-out;
	-webkit-transition: .15s ease-in-out;
	transition: .15s ease-in-out;
}

input.fancycb + label:after {
	content: "";
	position: absolute;
	display: block;
	height: 26px;
	width: 26px;
	top: 0;
	left: 0px;
	border-radius: 13px;
	background: white;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.2);
	-moz-transition: .15s ease-in-out;
	-webkit-transition: .15s ease-in-out;
	transition: .15s ease-in-out;
}
input.fancycb:checked + label:before {
	width: 46px;
	background: rgba(19,191,17,1);
}

input.fancycb:checked + label:after {
	left: 20px;
	box-shadow: inset 0 0 0 1px rgba(19,191,17,1), 0 2px 4px rgba(0,0,0,.2);
}

/* small checkboxes*/
input.fancycbsmall + label {
	height: 18px;
	width: 28px;
	border-radius: 9px;
}

input.fancycbsmall + label:before, input.fancycbsmall + label:after {
	height: 18px;
	width: 18px;
	border-radius: 9px;
}

input.fancycbsmall:checked + label:before {
	width: 28px;
}

input.fancycbsmall:checked + label:after {
	left: 12px;
}