/* Fixes a bug affecting both twitter bootstrap 2.1 and Joomla Protostar 1.0 template which is derived from bootstrap */ .control-group.error .checkbox, .control-group.error .radio, .control-group.success .checkbox, .control-group.success .radio { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } /* Alert boxes */ div#foxcontainer_m210 div.alert ul { list-style-type: none; } div#foxcontainer_m210 div.alert li { background: none; /* Fixes issues with some templates */ } /* Mandatory field marker, Invalid value in field */ div#foxcontainer_m210 .required, div#foxcontainer_m210 .asterisk { color: #b94a48; font-weight: bold; } div#foxcontainer_m210 .required:after, div#foxcontainer_m210 .asterisk:after { content: "*"; } /* Input boxes and textareas */ div#foxcontainer_m210 input[type="text"], div#foxcontainer_m210 textarea { padding: 4px 5px; } /* Captcha reload button */ div#foxcontainer_m210 div.fcaptcha-reload-container img { cursor: pointer; } /* Upload button */ div#foxcontainer_m210 .qq-upload-button-caption { vertical-align: top; /* Fixes an issue with ie7 */ } div#foxcontainer_m210 .qq-upload-button-hover { } div#foxcontainer_m210 .qq-upload-button-focus { outline: 1px dotted black; } /* Upload list */ div#foxcontainer_m210 ul.qq-upload-list { padding: 0; margin: 0; list-style: none; } div#foxcontainer_m210 ul.qq-upload-list > li { list-style: none; /* Fox { */ background: none; /* Some templates use background as list style */ padding: 0; /* In those cases they usually set a left/right padding */ /* } */ } div#foxcontainer_m210 .qq-upload-list span { display: inline-block; white-space: nowrap; padding: 0 20px; background-repeat: no-repeat; background-position: left center; /* Redundant defaults background-color: transparent; background-attachment:scroll; */ } /* Hide Successful and failure messages while uploading */ div#foxcontainer_m210 li span.qq-upload-failed-text, div#foxcontainer_m210 li span.qq-upload-success-text { display: none; } /* Display again Success message when upload is successful and vice versa */ div#foxcontainer_m210 li.qq-upload-fail span.qq-upload-failed-text, div#foxcontainer_m210 li.qq-upload-success span.qq-upload-success-text { display: inline-block; } /* Spinner while uploading */ div#foxcontainer_m210 span.qq-upload-spinner { background: url("/media/com_foxcontact/images/loading.gif"); width: 15px; height: 15px; vertical-align: text-bottom; padding: 0; margin: 0; } /* Help text under some fields */ div#foxcontainer_m210 span.help-block { display: block; } /* Built-in captcha */ div#foxcontainer_m210 .fcaptchafieldcontainer img { max-width: none; /* Fixes a IE 8 issue related to some templates where img have max-width:100% */ } /* Built-in captcha input box */ div#foxcontainer_m210 .fcaptchainputcontainer { float: left; } /* Chosen select box customizations */ /* Moves the arrow on the left side */ html[dir="rtl"] div#foxcontainer_m210 .chzn-container-single .chzn-single div { right: auto; /* Restores the default for right property */ left: 0; /* Left align */ } /* Downward arrow */ div#foxcontainer_m210 .chzn-container-single .chzn-single div b { background: url("/media/com_foxcontact/images/ui.png") no-repeat 0 0; } html[dir="rtl"] div#foxcontainer_m210 .chzn-container-single .chzn-single div b { background-position: -2px 1px; } div#foxcontainer_m210 .chzn-container-single .chzn-single div { width: 26px; } /* Upward arrow */ div#foxcontainer_m210 .chzn-container-active .chzn-single-with-drop div b { background-position: -28px 1px; } html[dir="rtl"] div#foxcontainer_m210 .chzn-container-active .chzn-single-with-drop div b { background-position: -30px 1px; } div#foxcontainer_m210 .chzn-container-single .chzn-single { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#eeeeee', GradientType = 0); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #ffffff), color-stop(100%, #eeeeee)); background-image: -webkit-linear-gradient(top, #ffffff 20%, #eeeeee 100%); background-image: -moz-linear-gradient(top, #ffffff 20%, #eeeeee 100%); background-image: -o-linear-gradient(top, #ffffff 20%, #eeeeee 100%); background-image: -ms-linear-gradient(top, #ffffff 20%, #eeeeee 100%); background-image: linear-gradient(top, #ffffff 20%, #eeeeee 100%); /* Set the same width than the inputs */ width: 85%; padding: 0 5px; } /* Restores the default value of width to the container assigned by chosen during the construction */ div#foxcontainer_m210 div.chzn-container { /* We need this div to be 100% when inner elements are measures in % auto in other cases */ width: 100% !important; } /* Sets the same width to the drop-down window */ div#foxcontainer_m210 .chzn-container-single .chzn-drop { width: 85% !important; padding: 0 5px; } div#foxcontainer_m210 .chzn-container-active .chzn-single-with-drop { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#eeeeee', endColorstr = '#ffffff', GradientType = 0); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff)); background-image: -webkit-linear-gradient(top, #eeeeee 20%, #ffffff 80%); background-image: -moz-linear-gradient(top, #eeeeee 20%, #ffffff 80%); background-image: -o-linear-gradient(top, #eeeeee 20%, #ffffff 80%); background-image: -ms-linear-gradient(top, #eeeeee 20%, #ffffff 80%); background-image: linear-gradient(top, #eeeeee 20%, #ffffff 80%); } /* Search input */ div#foxcontainer_m210 .chzn-container-single .chzn-search input { background: #fff url("/media/com_foxcontact/images/ui.png") no-repeat 100% -26px; background: url("/media/com_foxcontact/images/ui.png") no-repeat 100% -26px, -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff)); background: url("/media/com_foxcontact/images/ui.png") no-repeat 100% -26px, -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%); background: url("/media/com_foxcontact/images/ui.png") no-repeat 100% -26px, -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%); background: url("/media/com_foxcontact/images/ui.png") no-repeat 100% -26px, -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%); background: url("/media/com_foxcontact/images/ui.png") no-repeat 100% -26px, -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%); background: url("/media/com_foxcontact/images/ui.png") no-repeat 100% -26px, linear-gradient(top, #eeeeee 1%, #ffffff 15%); padding: 4px 20px 4px 5px; } html[dir="rtl"] div#foxcontainer_m210 .chzn-container-single .chzn-search input { background-position: -45px -26px; padding: 4px 5px 4px 20px; } /* Close button (X) */ div#foxcontainer_m210 .chzn-container-single .chzn-single abbr { right: 30px; background: url("/media/com_foxcontact/images/ui.png") right top no-repeat; } /* Close button (X) hover */ div#foxcontainer_m210 .chzn-container-single .chzn-single abbr:hover { background-position: right -11px; } /* Close button (X) rtl */ html[dir="rtl"] div#foxcontainer_m210 .chzn-container-single .chzn-single abbr { right: auto; /* Restores the right default */ left: 30px; /* Left align */ } /* Close button (X) in Multiple Select layout */ .chzn-container-multi .chzn-choices .search-choice .search-choice-close { background: url("/media/com_foxcontact/images/ui.png") right top no-repeat; } /* Moves the arrow on the left side */ html[dir="rtl"] div#foxcontainer_m210 .chzn-container-single .chzn-single div { right: auto; /* Restores the right default */ left: 0; /* Left align */ } /* Asterisks (*name:value) and backslash 9 (name:value\9) are IE hacks made by twitter bootstrap. */ /* Twitter bootstrap buttons */ div#foxcontainer_m210 .btn { display: inline-block; *display: inline; margin-bottom: 0; *margin-left: .3em; text-align: center; vertical-align: middle; cursor: pointer; background-color: #f5f5f5; *background-color: #e6e6e6; background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6)); background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6); background-image: -o-linear-gradient(top, #ffffff, #e6e6e6); background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); background-repeat: repeat-x; border: 1px solid #bbbbbb; *border: 0; border-color: #c5c5c5; border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25); border-bottom-color: #a2a2a2; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffffff', endColorstr = '#ffe6e6e6', GradientType = 0); filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); *zoom: 1; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); } /* button when mouse hover */ div#foxcontainer_m210 .btn:hover { color: #333333; text-decoration: none; background-color: #e6e6e6; *background-color: #d9d9d9; /* Buttons in IE7 don't get borders, so darken on hover */ background-position: 0 -15px; -webkit-transition: background-position 0.1s linear; -moz-transition: background-position 0.1s linear; -o-transition: background-position 0.1s linear; transition: background-position 0.1s linear; } div#foxcontainer_m210 .btn:first-child { *margin-left: 0; } div#foxcontainer_m210 button.btn, div#foxcontainer_m210 input[type="submit"].btn { *padding-top: 3px; *padding-bottom: 3px; } div#foxcontainer_m210 button.btn::-moz-focus-inner, div#foxcontainer_m210 input[type="submit"].btn::-moz-focus-inner { padding: 0; border: 0; } div#foxcontainer_m210 label { display: block; } div#foxcontainer_m210 .foxform-inline .control-group label { display: inline-block; } div#foxcontainer_m210 input[type="radio"], div#foxcontainer_m210 input[type="checkbox"] { margin: 4px 0 0; margin-top: 1px \9; *margin-top: 0; line-height: normal; cursor: pointer; } div#foxcontainer_m210 input[type="file"], div#foxcontainer_m210 input[type="image"], div#foxcontainer_m210 input[type="submit"], div#foxcontainer_m210 input[type="reset"], div#foxcontainer_m210 input[type="button"], div#foxcontainer_m210 input[type="radio"], div#foxcontainer_m210 input[type="checkbox"] { width: auto; } div#foxcontainer_m210 select, div#foxcontainer_m210 textarea, div#foxcontainer_m210 input[type="text"], div#foxcontainer_m210 input[type="password"], div#foxcontainer_m210 input[type="datetime"], div#foxcontainer_m210 input[type="datetime-local"], div#foxcontainer_m210 input[type="date"], div#foxcontainer_m210 input[type="month"], div#foxcontainer_m210 input[type="time"], div#foxcontainer_m210 input[type="week"], div#foxcontainer_m210 input[type="number"], div#foxcontainer_m210 input[type="email"], div#foxcontainer_m210 input[type="url"], div#foxcontainer_m210 input[type="search"], div#foxcontainer_m210 input[type="tel"], div#foxcontainer_m210 input[type="color"] { display: inline-block; vertical-align: middle; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } div#foxcontainer_m210 input, div#foxcontainer_m210 label.checkbox { width: 85%; } div#foxcontainer_m210 textarea { width: 85%; height: 180px; } /* form elements based on form type */ div#foxcontainer_m210 .foxform-compact .control-group, div#foxcontainer_m210 .foxform-extended .control-group { /* can't use overflow:hidden; due to "Chosen" dropdown select boxes. Fallback to float:left alternative, but it needs width:100% */ float: left; width:100%; *zoom: 1; } div#foxcontainer_m210 .foxform-inline .control-group { display: inline-block; } /* Field labels */ div#foxcontainer_m210 .foxform-compact .control-label, div#foxcontainer_m210 .foxform-extended .control-label { float: left; width: 230px; } div#foxcontainer_m210 .foxform-extended .control-label { text-align: left; margin-right: 16px; } div#foxcontainer_m210 .foxform-compact .control-label { text-align: right; margin-right: 16px; } /* Fields container */ div#foxcontainer_m210 .foxform-compact .controls, div#foxcontainer_m210 .foxform-extended .controls { float: left; } div#foxcontainer_m210 .foxform-centered input, div#foxcontainer_m210 .foxform-centered textarea, div#foxcontainer_m210 .foxform-centered .chzn-container { display: block; margin: 0 auto; } /* Checkbox and radio center alignment and text indentation */ div#foxcontainer_m210 .radio, div#foxcontainer_m210 .checkbox { min-height: 20px; padding-left: 20px; } div#foxcontainer_m210 .radio input[type="radio"], div#foxcontainer_m210 .checkbox input[type="checkbox"] { float: left; margin-left: -20px; } div#foxcontainer_m210 .controls { /* Removes the 180px left margin set by bootstrap */ margin: 0; /* Fixes dropdown collapse with layout extended in the module, but hurts the view of the component */ /*width: 100%;*/ /**/ } div#foxcontainer_m210 .foxform-inline .controls { display: inline-block; }