/* 14px fonts, responsive, stylised checkboxes and radio buttons */ /* Version 11.00 */ /* Colours */ .fcp_wrapper {background:transparent;color:#545454;} div.fcp_line label.fcp_focus {color:#BC0000;} #fcp_captcha_code {background-color:#fff;} div.fcp_captcha_inner {background-color:#f9f9f9;border-color:#d3d3d3;} fieldset.fcp_fieldset {background-color:#f9f9f9;border-color:#d3d3d3;} fieldset.fcp_fieldset legend {background-color:#fefefe;border-color:#d3d3d3;} .fcp_active {border-color:#BC0000 !important;box-shadow:0 0 5px #aaa;} div.fcp_line input, div.fcp_line textarea, div.fcp_line select {background-color:transparent;border-bottom-color:#aaa;} div.fcp_line input:hover, div.fcp_line textarea:hover, div.fcp_line select:hover {border-bottom-color:#BC0000;} div.fcp_line input:focus, div.fcp_line textarea:focus, div.fcp_line select:focus {border-bottom-color:#BC0000;border-color:#52A8EC;box-shadow:none;} span.fcp_radio_h input + label:before {background-color:#fff;border-color:#aaa;} span.fcp_radio_h input:checked + label:before {border-color:#BC0000;} span.fcp_radio_h input:focus + label:before {box-shadow:0 0 5px #aaa;} span.fcp_radio_h input + label:after {background-color:#BC0000;} span.fcp_radio_v input + label:before {background-color:#fff;border-color:#aaa;} span.fcp_radio_v input:checked + label:before {border-color:#BC0000;} span.fcp_radio_v input:focus + label:before {box-shadow:0 0 5px #aaa;} span.fcp_radio_v input + label:after {background-color:#BC0000;} div.fcp_checkbox_l label:after {background-color:#fff; border-color:#aaa;color:#fff;} div.fcp_checkbox_l label.fcp_checked:after {background-color:#BC0000 !important;border-color:#BC0000 !important;color:#fff !important;} div.fcp_checkbox_l label.fcp_focus:after {box-shadow:0 0 5px #aaa;} span.fcp_checkbox_m label:after {background-color:#fff;border-color:#aaa; color:#fff;} span.fcp_checkbox_m label.fcp_checked:after {background-color:#BC0000 !important;border-color:#BC0000 !important;color:#fff !important;} span.fcp_checkbox_m label.fcp_focus:after {box-shadow:0 0 5px #aaa;} div.fcp_checkbox_r label:after {background-color:#fff;border-color:#aaa;color:#fff;} div.fcp_checkbox_r label.fcp_checked:after {background-color:#BC0000 !important;border-color:#BC0000 !important;color:#fff !important;} div.fcp_checkbox_r label.fcp_focus:after {box-shadow:0 0 5px #aaa;} .fcp_form input.button {background-color:#BC0000;color:#fff;box-shadow:0 0 5px #aaa;} .fcp_form input.button:hover, .fcp_form input.button:focus {box-shadow:0 0 10px #545454;color:#fff;} .fcp_info:hover {box-shadow:0 0 5px #aaa;} .tooltip {color:#fff;} .fcp_error_field {background-color:#FFCDD2 !important;border-bottom-color:#F44336 !important;} .fcp_error_field:focus {box-shadow:0 1px 0 #F44336 !important;} .fcp_error_text {color:#F44336;} .popover-title {color:#F44336 !important;background-color:#fff !important;} .popover {background-color:#fff;border-color:#f9f9f9;box-shadow:0 5px 10px #aaa;} .popover-title {background-color:#f7f7f7;border-bottom-color:#ebebeb;} /* Font */ .fcp_wrapper {font-family:'Arial', sans;} /* layout */ .fcp_wrapper { border:0; padding:0; display:inline-block; width:100%; font-size:14px; line-height:14px; } .fcp_wrapper *, .fcp_wrapper *:after, .fcp_wrapper *:before { box-sizing:content-box !important; } /* line layout */ div.fcp_line { clear:left; width:100%; padding-top:5px; padding-bottom:10px; position:relative; } div.fcp_line label { display:block; vertical-align:top; text-align:left; max-width:100%; font-weight:normal; font-size:12px; line-height:14px; position:relative; transition:all 0.2s ease; margin:0; } /* secure-image captcha */ div.fcp_captcha input { /* aligns it properly for IE */ vertical-align:top; } #fcp_captcha_code { padding:5px; margin:0; } .g-recaptcha { display:inline-block; } div.fcp_captcha_inner { display:inline-block; padding:10px; background-image:url('css_images/securimage.png'); background-repeat:no-repeat; background-position:10px 90%; border-width:1px; border-style:solid; border-radius:2px; } img.fcp_captcha_img { vertical-align:middle; margin:0 5px 0 5px; border-radius:0px; } span.fcp_captcha_reload { display:inline-block; height:24px; width:24px; vertical-align:middle; background:transparent url('css_images/reload_blue_flat.png') no-repeat center center; cursor:pointer; transform:rotate(-90deg); transition:transform 0.2s ease; } span.fcp_captcha_reload:hover { transform:rotate(0deg); } span.fcp_captcha_reload:active { transform:rotate(20deg); } /* image captcha */ .fcp_image_inner { display:inline-block; } .fcp_image_inner img { cursor:pointer; transition:none; } .fcp_inactive { padding:0 !important; border:3px solid transparent !important; width:100px !important; height:75px !important; } .fcp_inactive:hover { width:106px !important; height:81px !important; border:0 !important; } .fcp_active { border-width:3px !important; border-style:solid !important; border-radius:3px; } /* recaptcha */ #recaptcha_widget_div { display:inline-block; } #fcp_err_recap { margin-top:10px; } /* fieldsets */ fieldset.fcp_fieldset { display:inline-block; margin:0; padding:15px; padding-top:0; border-width:1px; border-style:solid; border-radius:2px; vertical-align:top; width:calc(100% - 30px); } fieldset.fcp_fieldset legend { width:auto; max-width:90%; font-size:14px; line-height:16px; margin:0; border-width:1px; border-style:solid; padding:5px; } /* input fields */ div.fcp_line input, div.fcp_line textarea, div.fcp_line select { max-width:90%; width:calc(100% - 20px); border:1px solid #ECECEC; border-radius:0; outline:none; box-shadow:none; transition:all 0.2s ease; padding:10px; position:relative; line-height:inherit; font-size:inherit; } div.fcp_line input { height:18px; } div.fcp_line select { height:38px; width:auto; } div.fcp_line textarea { height:auto; } div.fcp_date input {max-width: 150px;} div.fcp_inline {display:inline;} div.fcp_inline label {width:auto;} div.fcp_line input:hover, div.fcp_line textarea:hover, div.fcp_line select:hover { border-bottom-style:solid; border-bottom-width:1px; } div.fcp_line input:focus, div.fcp_line textarea:focus, div.fcp_line select:focus { outline:none; border-bottom-style:solid; border-bottom-width:1px; } div.fcp_radio input, div.fcp_checkbox input { border:none; } div.fcp_radio input:hover, div.fcp_checkbox input:hover { border:none; } div.fcp_line input[type="checkbox"] { margin-top:0; vertical-align:middle; } /* radio buttons */ div.fcp_radio_h_inner { display:inline-block; max-width:100%; vertical-align:top; padding-top:10px; } span.fcp_radio_h { display:inline-block; text-align:center; max-width:50%; vertical-align:top; padding:0 5px; } span.fcp_radio_h input { position:absolute; left:-99999px; right:99999px; } span.fcp_radio_h label { display:inline-block; width:auto; cursor:pointer; text-align:center; position:relative; margin-top:24px; max-width:100%; } span.fcp_radio_h input + label:before { content:""; border-width:2px; border-style:solid; height:16px; width:16px; border-radius:16px; transition:all 0.2s ease; margin:0 auto; position:absolute; margin-left:-8px; left:50%; margin-top:-24px; } span.fcp_radio_h input:checked + label:before { border-width:2px; border-style:solid; } span.fcp_radio_h input + label:after { content:""; border:0; height:0px; width:0px; border-radius:16px; transition:all .2s ease; position:absolute; left:50%; margin-left:2px; top:0; margin-top:-14px; } span.fcp_radio_h input:checked + label:after { height:12px; width:12px; margin-left:-4px; margin-top:-20px; } div.fcp_radio_v_inner { display:inline-block; max-width:100%; padding-top:10px; } span.fcp_radio_v { display:block; min-height:16px; margin-bottom:10px; } span.fcp_radio_v label { width:auto; cursor:pointer; line-height:16px; margin:0; vertical-align:middle; position:relative; margin-left:25px; min-height:20px; } span.fcp_radio_v input { position:absolute; left:-99999px; right:99999px; } span.fcp_radio_v input + label:before { content:""; border-width:2px; border-style:solid; height:16px; width:16px; border-radius:16px; transition:all 0.2s ease; position:absolute; margin-left:-25px; top:50%; margin-top:-12px; } span.fcp_radio_v input:checked + label:before { border-width:2px; border-style:solid; } span.fcp_radio_v input + label:after { content:""; border:0; height:0px; width:0px; border-radius:16px; transition:all 0.2s ease; position:absolute; margin-left:-15px; top:50%; margin-top:-2px; left:0; } span.fcp_radio_v input:checked + label:after { height:12px; width:12px; margin-top:-8px; margin-left:-21px; } /* Spinning check-boxes */ div.fcp_checkbox { width:auto !important; min-height:16px; margin:10px 0; } div.fcp_checkbox input { position:absolute; left:-99999px; right:99999px; top:0; } div.fcp_checkbox label { line-height:14px; margin:5px; vertical-align:middle; } div.fcp_checkbox label:before { content:none !important; } div.fcp_checkbox_l label { width:auto; max-width:calc(100% - 25px); cursor:pointer; margin-left:25px; } div.fcp_checkbox_l label:after { content:""; font-size:18px; line-height:16px; border-width:2px; border-style:solid; height:16px; width:16px; display:inline-block; text-align:center; border-radius:3px; transition:all 0.2s ease; transform:rotate(-270deg); top:0; left:0; margin-left:-25px; margin-top:-2px; position:absolute; } div.fcp_checkbox_l label.fcp_checked:after { content:"✔"; border-width:2px !important; border-style:solid !important; transform:rotate(0) !important; font-weight:bold !important; } div.fcp_checkbox_inner { display:inline-block; max-width:100%; } span.fcp_checkbox_m { display:inline-block; margin:5px 10px 5px 0; width:auto; max-width:50%; text-align:center; vertical-align:top; } span.fcp_checkbox_m label { width:auto; max-width:none; text-align:center; display:block; cursor:pointer; margin-top:25px; position:relative; } span.fcp_checkbox_m label:after { content:""; font-size:18px; line-height:16px; border-width:2px; border-style:solid; height:16px; width:16px; display:inline-block; text-align:center; border-radius:3px; transition:all 0.2s ease; transform:rotate(-270deg); top:0; left:50%; margin-top:-25px; margin-left:-10px; position:absolute; } span.fcp_checkbox_m label.fcp_checked:after { content:"✔"; border-width:2px !important; border-style:solid !important; transform:rotate(0) !important; font-weight:bold !important; } div.fcp_checkbox_r label { width:auto; max-width:calc(100% - 25px); cursor:pointer; margin-right:25px; } div.fcp_checkbox_r label:after { content:""; font-size:18px; line-height:16px; border-width:2px; border-style:solid; height:16px; width:16px; display:inline-block; text-align:center; border-radius:3px; transition:all 0.2s ease; transform:rotate(-270deg); top:0; left:100%; margin-left:5px; margin-top:-2px; position:absolute; } div.fcp_checkbox_r label.fcp_checked:after { content:"✔"; border-width:2px !important; border-style:solid !important; transform:rotate(0) !important; font-weight:bold !important; } /* fixed texts */ div.fcp_fixed_text { width:auto; line-height:16px; } div.fcp_fixed_text label { text-align:left; font-size:18px; line-height:18px; padding:5px 0; } div.fcp_fixed_text span { display:block; font-size:14px; } /* the send button */ .fcp_sendrow { margin-left:0; } .fcp_form input.button { border:0; border-radius:2px; width:auto !important; min-width:65px; padding:8px; text-align:center; font-weight:normal; font-size:14px; cursor:pointer; transition:all 0.2s ease; text-shadow:none; } .fcp_form input.button:hover, .fcp_form input.button:focus { border:0; text-shadow:none; } .fcp_form input.button:disabled { opacity:0.5; border:0; cursor:default; } #fcp_spinner { margin-top:8px; } .fcp_spinner { background:url('css_images/spinner.gif') no-repeat left center !important; height:16px; width:16px; } /* info buttons */ .fcp_info { background:url('css_images/info-16_flat.png') no-repeat center !important; display:inline-block; height:12px; width:12px; margin-bottom:-2px; position:relative; transition:none; z-index:999; border-radius:6px; } /* Tooltips */ .tooltip { position:absolute; z-index:9999999; border:none; padding:5px; border-radius:2px; text-align:center; margin-top:-50px !important; display:block; visibility:visible; font-size:14px; line-height:16px; transition:none; transition:opacity 0.2s ease; opacity:1 !important; } .tooltip.in { opacity:1; } .tooltip-inner { color:white !important; background-color: #BC0000 !important; font: normal normal bold 14px arial !important; } .tooltip.top .tooltip-arrow { bottom: 0; left: 50%; margin-left: -5px; border-width: 5px 5px 0; border-top-color: #BC0000 !important; } /* mandatory and errors */ .fcp_mandatory:after { content:"*"; margin-left:2px; font-size:larger; } .fcp_error_msg { display:inline; position:relative; transition:none; z-index:999; } #fcp_err_image, #fcp_err_captcha, #fcp_err_nocap { height:100%; position:absolute; } #fcp_err_image .fcp_error_icon1, #fcp_err_captcha .fcp_error_icon1, #fcp_err_nocap .fcp_error_icon1 { height:100%; } div.fcp_text .fcp_error_msg, div.fcp_textarea .fcp_error_msg, div.fcp_password .fcp_error_msg, div.fcp_list .fcp_error_msg, div.fcp_date .fcp_error_msg, div.fcp_attachment .fcp_error_msg, div.fcp_magic .fcp_error_msg { width:100%; height:calc(100% + 1em); left:0; top:0; position:relative; vertical-align:top; } .fcp_error_msg span { display:inline-block; } span.fcp_err { display:none; } .fcp_error_field { border-bottom-width:1px !important; border-bottom-style:solid !important; } /* Text error messages */ .fcp_error_text { vertical-align:middle; font-size:12px; line-height:14px; display:block; margin-left:0; margin-bottom:0 !important; font-style:italic; } #fcp_spinner.fcp_error_msg span.fcp_error_text {margin-left:0;} /* Icon error messages */ .fcp_error_msg .fcp_error_icon1 { display:inline-block; background:url('css_images/val_err1_flat.png') no-repeat left center; margin-left:-24px; left:100%; margin-left:-30px; height:36px; width:30px; cursor:pointer; position:absolute; } div.fcp_list span.fcp_error_icon1, div.fcp_captcha span.fcp_error_icon1, div.fcp_recaptcha span.fcp_error_icon1, div.fcp_nocaptcha span.fcp_error_icon1, div.fcp_image_outer span.fcp_error_icon1 { margin-left:2px; } .fcp_error_msg .fcp_error_icon2 { display:inline-block; background:url('css_images/val_err2_flat.png') no-repeat left center; margin-left:-24px; left:100%; margin-left:-30px; height:36px; width:30px; cursor:pointer; position:absolute; } div.fcp_list span.fcp_error_icon2, div.fcp_captcha span.fcp_error_icon2, div.fcp_recaptcha span.fcp_error_icon2, div.fcp_nocaptcha span.fcp_error_icon2, div.fcp_image_outer span.fcp_error_icon2 { margin-left:2px; } /* Popover error messages */ .fcp_error_over { display:inline-block; vertical-align:top; margin-top:6px; left:calc(100% - 15px); top:0; position :absolute; } #fcp_err_image .fcp_error_over, #fcp_err_captcha .fcp_error_over, #fcp_err_nocap .fcp_error_over{ left:50% !important; top:50%; } .popover-content { display:none !important; } .popover-title { padding:0 !important; border-radius:3px !important; line-height:1 !important; border-bottom:none !important; background-image:none !important; } /* basic Bootstrap Popover support */ .popover { border-width:1px; border-style:solid; position:absolute; left:0; z-index:1010; display:none; max-width:276px; padding:10px; text-align:left; background-clip:padding-box; border-radius:2px; white-space:normal; } .popover.top { margin-top:-10px; } .popover.right { margin-left:10px; } .popover.bottom { margin-top:10px; } .popover.left { margin-left:-10px; } .popover-title { border-bottom-width:1px; border-bottom-style:solid; margin:0; padding:8px 14px; font-size:14px; font-weight:bold; line-height:18px; border-radius:5px 5px 0 0; text-align:center; } .popover-title:empty { display:none; } .popover-content { padding:9px 14px; } .popover .arrow, .popover .arrow:after { position:absolute; display:block; width:0; height:0; border-color:transparent; border-style:solid; } .popover .arrow { border-width:11px; } .popover .arrow:after { border-width:10px; content:""; } .popover.top .arrow { left:50%; margin-left:-11px; border-bottom-width:0; border-top-color:#999; border-top-color:rgba(0,0,0,0.25); bottom:-11px; } .popover.top .arrow:after { bottom:1px; margin-left:-10px; border-bottom-width:0; border-top-color:#fff; } .popover.right .arrow { top:50%; left:-11px; margin-top:-11px; border-left-width:0; border-right-color:#999; border-right-color:rgba(0,0,0,0.25); } .popover.right .arrow:after { left:1px; bottom:-10px; border-left-width:0; border-right-color:#fff; } .popover.bottom .arrow { left:50%; margin-left:-11px; border-top-width:0; border-bottom-color:#999; border-bottom-color:rgba(0,0,0,0.25); top:-11px; } .popover.bottom .arrow:after { top:1px; margin-left:-10px; border-top-width:0; border-bottom-color:#fff; } .popover.left .arrow { top:50%; right:-11px; margin-top:-11px; border-right-width:0; border-left-color:#999; border-left-color:rgba(0,0,0,0.25); } .popover.left .arrow:after { right:1px; border-right-width:0; border-left-color:#fff; bottom:-10px; }