/* * Theme Name: iPhorm Light * Uniform Theme: default * Description: A light design. * Version: 1.0 * Author: ThemeCatcher.net * Author URI: http://www.themecatcher.net/ */ /******************************************************************************************************************************************* IMPORTANT: If you update the iPhorm plugin this file will also be updated. Thus if you make changes in here you will lose them! We strongly recommend you make your own theme by duplicating one of our theme folders and renaming it. This way you will not lose anything. ********************************************************************************************************************************************/ /*Select an optimum background colour for preview page*/.ip-form-wrap .iphorm-theme-light-light .iphorm-inner { background: #FDFDFD; } /***************************************************** 1: Form heading and description ******************************************************/ /*Set global fonts*/ .iphorm-theme-light-light { color: #000; } /*Form Heading*/ .iphorm-theme-light-light h3.iphorm-title { color: #000; } /*Form description*/ .iphorm-theme-light-light p.iphorm-description { color: #666; } /***************************************************** 2: Elements and labels ******************************************************/ /*Required - this is the text that is used to indicate a required field*/ .iphorm-theme-light-light .iphorm-element-wrap label span.iphorm-required { color: #cc0101; } /*Element description*/ .iphorm-theme-light-light .iphorm-element-wrap p.iphorm-description { color: #000; } /*Default state input, selects and textareas*/ .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-text input, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-captcha input, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-password input, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap select, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap textarea { color: #999; border: solid 1px #b9b9b9; padding: 4px; background: #fff url(images/input-bg-rep.png) repeat-x bottom left; -webkit-box-shadow: 1px 1px 1px #eee; -moz-box-shadow: 1px 1px 1px #eee; box-shadow: 1px 1px 1px #eee; } /*Hover element*/ .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-text input:hover, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-captcha input:hover, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-password input:hover, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap select:hover, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap textarea:hover { color: #000; border: solid 1px #CACACA; } /*Active element*/ .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-text input:active, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-captcha input:active, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-password input:active, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap select:active, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap textarea:active { color: #000; } /*Focused element*/ .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-text input:focus, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-captcha input:focus, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap-password input:focus, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap select:focus, .iphorm-theme-light-light .iphorm-elements .iphorm-element-wrap textarea:focus { color: #000; background: #fff url(images/input-active-bg-rep.png) repeat-x top left; border: solid 1px #CACACA; -webkit-box-shadow: 1px 1px 0 #fff; -moz-box-shadow: 1px 1px 0 #fff; box-shadow: 1px 1px 0 #fff; } /* Default Label*/ .iphorm-theme-light-light .iphorm-element-wrap > .iphorm-element-spacer > label { font-weight: bold; color: #000; text-shadow: 1px 1px 0 #fff; } /* Displaying the element label inside? If your input or textarea padding, height, or margin has changed, you will need to adjust the margin here to align*/ .iphorm-theme-light-light .iphorm-element-wrap-text.iphorm-labels-inside > .iphorm-element-spacer > label, .iphorm-theme-light-light .iphorm-element-wrap-textarea.iphorm-labels-inside > .iphorm-element-spacer > label, .iphorm-theme-light-light .iphorm-element-wrap-password.iphorm-labels-inside > .iphorm-element-spacer > label, .iphorm-theme-light-light .iphorm-element-wrap-captcha.iphorm-labels-inside > .iphorm-element-spacer > label { margin-left: 5px; margin-top: 4px; color: #999; } /*Tooltip icon*/ .iphorm-theme-light-light .iphorm-tooltip-icon { background: url(images/help-icon.png) no-repeat right bottom; } /***************************************************** 3: File uploads ******************************************************/ /*File uploading wrap*/ .iphorm-theme-light-light .iphom-upload-progress-wrap { background: #fff url(images/file-upload-progress-area.png) repeat-x bottom left; border: 1px solid #b9b9b9; } /*Animated progress bar wrapper*/ .iphorm-theme-light-light .iphorm-upload-progress-bar-wrap { background: transparent; border: none transparent; padding: 0; } /*Animated progress bar*/ .iphorm-theme-light-light .iphorm-upload-progress-bar { height: 12px; background: #e2ab00 url(images/file-progress-bar-bg.png) repeat-x top left; border: 1px solid #e1ae00; } /*Info displayed under progress bar*/ .iphorm-theme-light-light .iphorm-upload-info {} .iphorm-theme-light-light .iphorm-upload-info > div { color: #000; font-size: 11px; text-shadow: 1px 1px 0 #fff; } /*Box around a chosen file*/ .iphorm-theme-light-light .iphorm-upload-queue-file { background: #fff url(images/input-active-bg-rep.png) repeat-x top left; border: 1px solid #b9b9b9; } /*File name*/ .iphorm-theme-light-light .iphorm-upload-queue-filename { color: #000; font-size: 11px; } /*Remove the file icon or text*/ .iphorm-theme-light-light .iphorm-upload-queue-remove { background: url(images/file-close.png) no-repeat center center; text-indent: -99999px; } /*Once the file has been uploaded - success tick replaces the X*/ .iphorm-theme-light-light .iphorm-upload-queue-success { } /*add styles to your button here. NB; Fixed width and height must be used if you require to adjust the size. The overlaying flash button will inherit these only. No padding please! */ .iphorm-theme-light-light .iphorm-swfupload-browse { background: #fdfdfd url(images/button-bg-rep.png) repeat-x bottom left; border: solid 1px #b9b9b9; text-shadow: 1px 1px 0 #fff; -webkit-box-shadow: 1px 1px 1px #eee; -moz-box-shadow: 1px 1px 1px #eee; box-shadow: 1px 1px 1px #eee; color: #363636; } .iphorm-theme-light-light .iphorm-swfupload-browse:hover { color: #000; } /*This is the "add another" button*/ .iphorm-theme-light-light .iphorm-add-another-upload span.iphorm-add-another-upload-button { background: #fdfdfd url(images/button-bg-rep.png) repeat-x bottom left; border: solid 1px #b9b9b9; text-shadow: 1px 1px 0 #fff; -webkit-box-shadow: 1px 1px 1px #eee; -moz-box-shadow: 1px 1px 1px #eee; box-shadow: 1px 1px 1px #eee; } .iphorm-theme-light-light .iphorm-add-another-upload span.iphorm-add-another-upload-button:hover { background: #fdfdfd url(images/button-active-bg-rep.png) repeat-x top left; } /***************************************************** 4: Captcha ******************************************************/ /*Refresh captcha icon background*/ .iphorm-theme-light-light .ifb-captcha-image-inner { margin-top: 3px; border: 1px solid #F0F0F0; } /***************************************************** 5: Element groups ******************************************************/ /*Group title & description wrap plain*/ .iphorm-theme-light-light .iphorm-group-style-plain > .iphorm-group-elements .iphorm-group-title-description-wrap { margin-bottom: 15px; padding-bottom: 5px; border-bottom: solid 1px #eee; border-top: solid 1px #eee; } /*Group title plain*/ .iphorm-theme-light-light .iphorm-group-style-plain > .iphorm-group-elements .iphorm-group-title { color: #363636; padding: 5px 0 0; font-weight: normal; text-shadow: 1px 1px 0 #fff; } /*Group description plain*/ .iphorm-theme-light-light .iphorm-group-style-plain > .iphorm-group-elements p.iphorm-group-description { color: #666; padding: 0; font-size: 11px; } /*IE fix for negative margins used below*/ .iphorm-theme-light-light .iphorm-group-style-bordered > .iphorm-group-elements {min-width: 1px;} /*Group title & description wrap bordered*/ .iphorm-theme-light-light .iphorm-group-style-bordered > .iphorm-group-elements .iphorm-group-title-description-wrap { margin: -10px -10px 10px -10px; border-bottom: solid 1px #eee; background: #fff url(images/boxed-group-title-bg.png) repeat-x left top; padding-bottom: 5px; } /*Group title bordered*/ .iphorm-theme-light-light .iphorm-group-style-bordered > .iphorm-group-elements .iphorm-group-title { color: #363636; padding: 5px 10px 0; font-weight: normal; text-shadow: 1px 1px 0 #fff; margin: 0; } /*Group description bordered*/ .iphorm-theme-light-light .iphorm-group-style-bordered > .iphorm-group-elements p.iphorm-group-description { color: #666; font-size: 11px; padding: 5px 10px 0; margin: 0; } /*Bordered style group*/ .iphorm-theme-light-light .iphorm-group-style-bordered > .iphorm-group-elements { border: solid 1px #CCC; background: #fefefe url(images/boxed-group-bg.png) repeat-x bottom left; -webkit-box-shadow: 1px 1px 1px #eee; -moz-box-shadow: 1px 1px 1px #eee; box-shadow: 1px 1px 1px #eee; } .iphorm-theme-light-light .iphorm-group-style-bordered > .iphorm-group-row { } /*One row inside a group*/ .iphorm-theme-light-light .iphorm-group-style-bordered > .iphorm-group-elements .iphorm-group-row { background: url(images/boxed-group-break-line.png) repeat-x bottom left; margin-bottom: 10px; } .iphorm-theme-light-light .iphorm-group-style-plain > .iphorm-group-elements .iphorm-group-row { background: none; margin: 0; } .iphorm-theme-light-light .iphorm-group-style-bordered .iphorm-group-row.last-child { background: none; margin-bottom: 0; } /***************************************************** 6: Submit button and related ******************************************************/ /*Note: Submit button is designed so you can use rounded cornered image backgrounds that can be fluid size*/ /*Submit button wrap*/ .iphorm-theme-light-light .iphorm-submit-input-wrap { float: left; /*You might want this right. Change loading icon wrap below too*/ } /*Submit button default state*/ .iphorm-theme-light-light .iphorm-submit-wrap button span, .iphorm-theme-light-light .iphorm-submit-wrap button em { color: #363636; text-shadow: 1px 1px 0 #fff; } /*Default*/ .iphorm-theme-light-light .iphorm-submit-wrap button span { background: #fdfdfd url(images/button-bg-rep.png) repeat-x bottom left; /*Left image*/ border: solid 1px #b9b9b9; -webkit-box-shadow: 1px 1px 1px #eee; -moz-box-shadow: 1px 1px 1px #eee; box-shadow: 1px 1px 1px #eee; } /*Hover*/ .iphorm-theme-light-light .iphorm-submit-wrap button:hover { background: none; /*Fix conflicting styles with Twenty Thirteen theme*/ } .iphorm-theme-light-light .iphorm-submit-wrap button:hover span { background: #fdfdfd url(images/button-bg-rep.png) repeat-x bottom left; /*Left image*/ border: solid 1px #b9b9b9; } /*Active*/ .iphorm-theme-light-light .iphorm-submit-wrap button:active span { background: #fdfdfd url(images/button-active-bg-rep.png) repeat-x top left; /*Left image*/ border: solid 1px #CACACA; -webkit-box-shadow: 1px 1px 0 #fff; -moz-box-shadow: 1px 1px 0 #fff; box-shadow: 1px 1px 0 #fff; } /*Default*/ .iphorm-theme-light-light .iphorm-submit-wrap button em { background: transparent; /*right image*/ } /*Hover*/ .iphorm-theme-light-light .iphorm-submit-wrap button:hover em { background: transparent; /*right image*/ color: #000; } /*Active*/ .iphorm-theme-light-light .iphorm-submit-wrap button:active em { background: transparent; /*right image*/ color: #000; } /*Loading the submit*/ .iphorm-theme-light-light .iphorm-loading-wrap { float: left; /*You will want this right if the button is right*/ } /*Loading gif image*/ .iphorm-theme-light-light .iphorm-loading-wrap .iphorm-loading {} /***************************************************** 7: Messages for user ******************************************************/ /*Errors*/ .iphorm-theme-light-light .iphorm-errors-list > .iphorm-error { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-shadow: 1px 1px 0 #f3d6d4; } /*File upload errors*/ .iphorm-theme-light-light .iphorm-queue-errors-list > .iphorm-queue-error { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-shadow: 1px 1px 0 #f3d6d4; } /*Success message*/ .iphorm-theme-light-light .iphorm-success-message { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-shadow: 1px 1px 0 #e0fdc3; } /*iPhorm referal link*/ .iphorm-theme-light-light .iphorm-referral-link a { color: #0F83CA; } .iphorm-theme-light-light .iphorm-referral-link a:hover { color: #292929; }