.oembed.video,.oembed.codepen,.fr-video{display:block;width:100%;margin-bottom:0;height:0;overflow:hidden;padding-bottom:56.25%;position:relative}.oembed.video video,.oembed.codepen video,.fr-video video{width:100%}.oembed.video iframe,.oembed.codepen iframe,.fr-video iframe{border:none;height:100%;position:absolute;top:0;width:100%;left:0}img.fr-full-width{min-width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw !important;margin-right:-50vw !important} :root{--light-gray:rgba(230, 230, 230, 1.00);--medium-gray:rgba(202, 202, 202, 1.00);--dark-gray:rgba(138, 138, 138, 1.00);--black:rgba(11, 10, 22, 1.00);--black-color:var(--black);--white:rgba(252, 252, 255, 1.00);--white-color:var(--white);--primary:rgba(253, 128, 8, 1.00);--secondary:rgba(231, 231, 231, 1.00);--success:rgba(67, 172, 106, 1.00);--warning:rgba(240, 138, 36, 1.00);--alert:rgba(240, 65, 36, 1.00);--primary-contrast:rgba(255, 255, 255, 1.00);--secondary-contrast:rgba(51, 51, 51, 1.00);--success-contrast:rgba(254, 254, 254, 1.00);--warning-contrast:rgba(254, 254, 254, 1.00);--alert-contrast:rgba(254, 254, 254, 1.00);--primary-dark:rgba(223, 98, 0, 1.00);--secondary-dark:rgba(201, 201, 201, 1.00);--success-dark:rgba(37, 142, 76, 1.00);--warning-dark:rgba(210, 108, 6, 1.00);--alert-dark:rgba(210, 35, 6, 1.00);--header-color:rgba(34, 34, 34, 1.00);--subheader-color:rgba(138, 138, 138, 1.00);--small-color:rgba(202, 202, 202, 1.00);--text-color:rgba(34, 34, 34, 1.00);--link-color:rgba(48, 68, 155, 1.00);--link-color-hover:rgba(38, 54, 123, 1.00);--selection-background:var(--primary);--selection-text:var(--primary-contrast);--link-decoration:none;--link-decoration-hover:none;--overlay-color:rgba(253, 128, 8, 0.75);--radius:3px;--small-gutter:1.25rem;--medium-gutter:2rem;--large-gutter:2rem;--site-width:calc(1200rem/16);}::selection{background:var(--selection-background);color:var(--selection-text)}.alt{--header-color:rgba(255, 255, 255, 1.00);--subheader-color:rgba(230, 230, 230, 1.00);--small-color:rgba(202, 202, 202, 1.00);--text-color:rgba(255, 255, 255, 1.00);--link-color:rgba(250, 250, 250, 1.00);--link-color-hover:rgba(191, 191, 191, 1.00);--link-decoration:none;--link-decoration-hover:none}.grid-container{max-width:var(--site-width)}.radius{border-radius:var(--radius)}body{font-size:calc(16rem/16)}h1,.h1{font-size:calc(24rem/16)}h2,.h2{font-size:calc(20rem/16)}h3,.h3{font-size:calc(31rem/16)}h4,.h4{font-size:calc(18rem/16)}h5,.h5{font-size:calc(17rem/16)}h6,.h6{font-size:calc(16rem/16)}small{font-size:40%}.button{font-size:calc(16rem/16)}.button.tiny{font-size:calc(10rem/16)}.button.small{font-size:calc(12rem/16)}.button.large{font-size:calc(20rem/16)}@media only screen and (min-width:40em){body{font-size:calc(16rem/16)}h1,.h1{font-size:calc(48rem/16)}h2,.h2{font-size:calc(40rem/16)}h3,.h3{font-size:calc(31rem/16)}h4,.h4{font-size:calc(25rem/16)}h5,.h5{font-size:calc(20rem/16)}h6,.h6{font-size:calc(16rem/16)}small{font-size:30%}}@media only screen and (min-width:64em){body{font-size:calc(16rem/16)}h1,.h1{font-size:calc(48rem/16)}h2,.h2{font-size:calc(40rem/16)}h3,.h3{font-size:calc(62rem/16)}h4,.h4{font-size:calc(25rem/16)}h5,.h5{font-size:calc(20rem/16)}h6,.h6{font-size:calc(16rem/16)}small{font-size:30%}}a{color:var(--link-color);-webkit-text-decoration:var(--link-decoration);text-decoration:var(--link-decoration)}a:hover,a:focus{color:var(--link-color-hover);-webkit-text-decoration:var(--link-decoration-hover);text-decoration:var(--link-decoration-hover)}.menu a{color:var(--menu-link-color);background:var(--menu-bg-color)}.menu a:hover{color:var(--menu-link-color-hover)}h1,h2,h3,h4,h5,h6{color:var(--header-color)}small{color:var(--small-color)}.subheader{color:var(--subheader-color)}.text ul,.text ol{list-style-position:outside}.text>ul,.text>ol,.text .mez>div>ul,.text .mez>div>ol{margin-left:1.25rem}.text ul{list-style-type:disc}.text ul ul,.text ol ul{list-style-type:circle}.text ol{list-style-type:decimal}.text ol ol,.text ul ol{list-style-type:lower-alpha}.radius,.radius:before,.radius:after{border-radius:calc(3rem/16)}body{} .menu{font-size:calc(16rem/16) ;}@media only screen and (min-width:40em){ .menu{font-size:calc(16rem/16) }}@media only screen and (min-width:64em){ .menu{font-size:calc(18rem/16) }} @font-face{font-family:Oswald;font-style:normal;font-weight:normal;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Oswald-Regular.woff") format("woff")}@font-face{font-family:Oswald;font-style:normal;font-weight:bold;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Oswald-Bold.woff") format("woff")}@font-face{font-family:Oswald;font-style:italic;font-weight:normal;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Oswald-Regular.woff") format("woff")}@font-face{font-family:Oswald;font-style:italic;font-weight:bold;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Oswald-Bold.woff") format("woff")} h1,.font-family-h1,h1 a,.font-family-h1 a, h2,.font-family-h2,h2 a,.font-family-h2 a, h3,.font-family-h3,h3 a,.font-family-h3 a, h4,.font-family-h4,h4 a,.font-family-h4 a, h5,.font-family-h5,h5 a,.font-family-h5 a, h6,.font-family-h6,h6 a,.font-family-h6 a,.fontpro-stacks_in_115444{font-family:"Oswald",sans-serif } @font-face{font-family:Lato;font-style:normal;font-weight:normal;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Lato-Regular.woff") format("woff")}@font-face{font-family:Lato;font-style:normal;font-weight:bold;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Lato-Bold.woff") format("woff")}@font-face{font-family:Lato;font-style:italic;font-weight:normal;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Latoitalic.woff") format("woff")}@font-face{font-family:Lato;font-style:italic;font-weight:bold;src:url("https://www.therapage-apfelcomputer.de/resources/fonts/Lato-BoldItalic.woff") format("woff")} blockquote, a, ul,ul li,ol,ol li,dl,dl dd, fieldset,input,textarea,form label,input + label,fieldset label,input + datalist,legend, button,.button,.btn, p:not(.custom-font),.font-family-text,.text_stack:not(.custom-font),.fontpro-stacks_in_115448{font-family:"Lato",sans-serif }p:not(.custom-font),p.font-family-text:not(.custom-font),.text_stack:not(.custom-font){font-family:"Lato",sans-serif } h2,.h2, .headergroesse-h2{font-size:calc(30rem/16) ;font-weight:400 ;}@media only screen and (min-width:40em){ h2,.h2, .headergroesse-h2{font-size:calc(36rem/16) }}@media only screen and (min-width:64em){ h2,.h2, .headergroesse-h2{font-size:calc(48rem/16) }} h3,.h3, .headergroesse-h3{font-size:calc(30rem/16) ;font-weight:400 ;}@media only screen and (min-width:40em){ h3,.h3, .headergroesse-h3{font-size:calc(24rem/16) }}@media only screen and (min-width:64em){ h3,.h3, .headergroesse-h3{font-size:calc(24rem/16) }} .content-height{height:100vh ;} section{padding-top:3rem ;padding-right:0 ;padding-bottom:3rem ;padding-left:0 ;} .section-color{background-color:var(--light-gray) ;} .footer-color{background-color:var(--primary) ;background-color:rgba(253, 128, 8, 1.00) ;background-position:center center ;background-origin:padding-box ;background-blend-mode:normal ;background-attachment:scroll ;-webkit-background-clip:border-box ;background-clip:border-box ;}@media (hover:none) and (pointer:coarse){.footer-color{background-attachment:scroll!important}} .navigation>.menu a, .menu.navigation a{--menu-link-color:rgba(34, 34, 34, 1.00);--menu-link-color-hover:rgba(68, 68, 68, 1.00);--menu-bg-color:rgba(255, 255, 255, 0.00);--menu-caret-color:rgba(254, 204, 102, 1.00);--menu-border-accent:2px solid var(--menu-link-color)} .navigation>.menu .menu-text, .menu.navigation .menu-text{--menu-text-color:rgba(68, 68, 68, 1.00)} .navigation>.menu>li>a, .menu.navigation>li>a{padding-top:1rem;padding-bottom:1rem} .navigation>.menu .submenu>li>a, .menu.navigation .submenu>li>a{padding-top:0.75rem;padding-bottom:0.75rem} .navigation>.menu li.active>a, .navigation>.menu li.is-active>a, .navigation>.menu a.is-active, .menu.navigation li.active>a, .menu.navigation li.is-active>a, .menu.navigation a.is-active{--menu-bg-color:rgba(253, 128, 8, 1.00);--menu-link-color:rgba(254, 254, 254, 1.00);--menu-caret-color:rgba(255, 255, 255, 1.00);--menu-link-color-hover:rgba(254, 254, 254, 1.00)} .navigation>.menu .submenu li.active>a, .navigation>.menu .submenu li.is-active>a, .navigation>.menu .submenu a.is-active, .menu.navigation .submenu li.active>a, .menu.navigation .submenu li.is-active>a, .menu.navigation .submenu a.is-active{--menu-caret-color:rgba(255, 255, 255, 1.00)} .navigation>.menu .submenu a, .menu.navigation .submenu a{--menu-caret-color:rgba(97, 103, 173, 1.00)} .navigation>.menu .submenu, .menu.navigation .submenu{--submenu-bg-color:rgba(254, 254, 254, 1.00);--submenu-border:1px solid rgba(202, 202, 202, 1.00)} .navigation>.menu .submenu a, .menu.navigation .submenu a{--menu-bg-color:transparent;--menu-link-color:rgba(34, 34, 34, 1.00);--menu-link-color-hover:rgba(68, 68, 68, 1.00)} .navigation>.menu .submenu .menu-text, .menu.navigation .submenu .menu-text{--menu-text-color:rgba(68, 68, 68, 1.00)} .navigation>.menu .submenu li.active>a, .navigation>.menu .submenu li.is-active>a, .navigation>.menu .submenu a.is-active, .menu.navigation .submenu li.active>a, .menu.navigation .submenu li.is-active>a, .menu.navigation .submenu a.is-active{--menu-caret-color:rgba(255, 255, 255, 1.00);--menu-bg-color:rgba(97, 103, 173, 1.00);--menu-link-color:rgba(254, 254, 254, 1.00);--menu-link-color-hover:rgba(254, 254, 254, 1.00)} .divider{border-color:rgba(253, 128, 8, 1.00) ;border-width:3px ;} .card-divider{background-color:var(--black-color) ;background-color:rgba(253, 128, 8, 0.75) ;} .card{box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.20);} form.blog-filter-form input,form.blog-filter-form select,form.blog-filter-form textarea,form.datastore-form input,form.datastore-form select,form.datastore-form textarea{padding:0.50rem;border-width:1px;border-radius:0px;margin-bottom:1.00rem;font-size:0.90rem;background-color:rgba(255, 255, 255, 1.00);border-color:rgba(204, 204, 204, 1.00);color:rgba(34, 34, 34, 1.00)}form.blog-filter-form select,form.datastore-form select{padding-right:1.5rem}form.blog-filter-form input,form.blog-filter-form select,form.datastore-form input,form.datastore-form select{height:2.30rem}form.blog-filter-form::placeholder,form.datastore-form::placeholder{color:rgba(204, 204, 204, 1.00)}form.blog-filter-form:-ms-input-placeholder,form.datastore-form:-ms-input-placeholder{color:rgba(204, 204, 204, 1.00)}form.blog-filter-form::-ms-input-placeholder,form.datastore-form::-ms-input-placeholder{color:rgba(204, 204, 204, 1.00)} .background-menu{background-color:rgba(255, 255, 255, 0.88) ;} .menubar{background-color:rgba(11, 23, 57, 1.00) ;} .menubar{padding:1rem ;} .menupanel{padding:1rem ;} .navcolor>.menu a, .menu.navcolor a{--menu-link-color:rgba(34, 34, 34, 1.00);--menu-link-color-hover:rgba(68, 68, 68, 1.00);--menu-bg-color:rgba(255, 255, 255, 0.00);--menu-caret-color:rgba(97, 103, 173, 1.00);--menu-border-accent:2px solid var(--menu-link-color)} .navcolor>.menu .menu-text, .menu.navcolor .menu-text{--menu-text-color:rgba(68, 68, 68, 1.00)} .navcolor>.menu a:hover, .menu.navcolor a:hover{--menu-bg-color:rgba(250, 250, 250, 1.00)} .navcolor>.menu>li>a, .menu.navcolor>li>a{padding-top:1rem;padding-bottom:1rem} .navcolor>.menu .submenu>li>a, .menu.navcolor .submenu>li>a{padding-top:0.75rem;padding-bottom:0.75rem} .navcolor>.menu li.active>a, .navcolor>.menu li.is-active>a, .navcolor>.menu a.is-active, .menu.navcolor li.active>a, .menu.navcolor li.is-active>a, .menu.navcolor a.is-active{--menu-bg-color:rgba(253, 128, 8, 1.00);--menu-link-color:rgba(254, 254, 254, 1.00);--menu-caret-color:rgba(255, 255, 255, 1.00);--menu-link-color-hover:rgba(254, 254, 254, 1.00)} .navcolor>.menu .submenu li.active>a, .navcolor>.menu .submenu li.is-active>a, .navcolor>.menu .submenu a.is-active, .menu.navcolor .submenu li.active>a, .menu.navcolor .submenu li.is-active>a, .menu.navcolor .submenu a.is-active{--menu-caret-color:rgba(255, 255, 255, 1.00)} .navcolor>.menu .submenu a, .menu.navcolor .submenu a{--menu-caret-color:rgba(97, 103, 173, 1.00)} .navcolor>.menu .submenu, .menu.navcolor .submenu{--submenu-bg-color:rgba(254, 254, 254, 1.00);--submenu-border:1px solid rgba(202, 202, 202, 1.00)} .navcolor>.menu .submenu a, .menu.navcolor .submenu a{--menu-bg-color:transparent;--menu-link-color:rgba(34, 34, 34, 1.00);--menu-link-color-hover:rgba(68, 68, 68, 1.00)} .navcolor>.menu .submenu .menu-text, .menu.navcolor .submenu .menu-text{--menu-text-color:rgba(68, 68, 68, 1.00)} .navcolor>.menu .submenu li.active>a, .navcolor>.menu .submenu li.is-active>a, .navcolor>.menu .submenu a.is-active, .menu.navcolor .submenu li.active>a, .menu.navcolor .submenu li.is-active>a, .menu.navcolor .submenu a.is-active{--menu-caret-color:rgba(255, 255, 255, 1.00);--menu-bg-color:rgba(97, 103, 173, 1.00);--menu-link-color:rgba(254, 254, 254, 1.00);--menu-link-color-hover:rgba(254, 254, 254, 1.00)} .stacks_in_115435_139{--offcanvas-size-small:320px;--offcanvas-size-medium:512px;--offcanvas-size-large:512px;} .background-screen1{background-image:url('../upload_files/bgimage-114506.jpg') ;background-repeat: repeat-x ;background-size:auto ;background-position:center center ;background-origin:padding-box ;background-blend-mode:normal ;background-attachment:scroll ;-webkit-background-clip:border-box ;background-clip:border-box ;}@media (hover:none) and (pointer:coarse){.background-screen1{background-attachment:scroll!important}} .background-header{background-color:rgba(253, 128, 8, 0.90) ;background-position:center center ;background-origin:padding-box ;background-blend-mode:normal ;background-attachment:scroll ;-webkit-background-clip:border-box ;background-clip:border-box ;}@media (hover:none) and (pointer:coarse){.background-header{background-attachment:scroll!important}} .header-border{border-color:rgba(128, 0, 2, 0.80) ;border-width:0px 0px 20px 0px ;border-style:solid ;} .textfarbe{--header-color:rgba(255, 255, 255, 1.00);--subheader-color:rgba(204, 204, 204, 1.00);--small-color:rgba(202, 202, 202, 1.00);--text-color:rgba(102, 102, 102, 1.00);--link-color:rgba(0, 140, 186, 1.00);--link-color-hover:rgba(0, 102, 136, 1.00);--link-decoration:none;--link-decoration-hover:none} .textfarbe-h3{--header-color:rgba(102, 102, 102, 1.00);--subheader-color:rgba(204, 204, 204, 1.00);--small-color:rgba(202, 202, 202, 1.00);--text-color:rgba(102, 102, 102, 1.00);--link-color:rgba(0, 140, 186, 1.00);--link-color-hover:rgba(0, 102, 136, 1.00);--link-decoration:none;--link-decoration-hover:none} h1,.h1, .textgroesse-h1{font-size:calc(30rem/16) ;font-weight:400 ;}@media only screen and (min-width:40em){ h1,.h1, .textgroesse-h1{font-size:calc(36rem/16) }}@media only screen and (min-width:64em){ h1,.h1, .textgroesse-h1{font-size:calc(48rem/16) }} h2,.h2, .textgroesse-h2{font-size:calc(18rem/16) ;}@media only screen and (min-width:40em){ h2,.h2, .textgroesse-h2{font-size:calc(20rem/16) }}@media only screen and (min-width:64em){ h2,.h2, .textgroesse-h2{font-size:calc(30rem/16) }} h3,.h3, .textgroesse-h3{font-size:calc(18rem/16) ;}@media only screen and (min-width:40em){ h3,.h3, .textgroesse-h3{font-size:calc(20rem/16) }}@media only screen and (min-width:64em){ h3,.h3, .textgroesse-h3{font-size:calc(24rem/16) }} /* @group Resets */ /* Resets to stop themes messing with our styling */ #stacks_in_115505 *, #stacks_in_115505 *:after, #stacks_in_115505 *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #stacks_in_115505 form, #stacks_in_115505 fieldset { display: block; border: none; background: none; padding: 0; margin: 0; box-shadow: none; } #stacks_in_115505 select { -webkit-appearance: menulist !important; -moz-appearance: menulist !important; } #stacks_in_115505 select[multiple] { height: 100%; -webkit-appearance: none !important; -moz-appearance: none !important; } #stacks_in_115505 .fpNotAllowed *:hover { cursor: not-allowed; } /* @end */ /* @group Base Form Styling */ /* Styling borrowed from Twitter Bootstrap, scoped for exclusive use of FormSteps */ #stacks_in_115505 label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: 700; font-size: 14px; color: rgba(25, 25, 25, 1.00); } #stacks_in_115505 .form-group { padding: 15px 0px; margin: 0; } #stacks_in_115505 .form-control { display: block; width: 100%; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: rgba(85, 85, 85, 1.00); background-color: rgba(255, 255, 255, 1.00); background-image: none; border: 1px solid rgba(204, 204, 204, 1.00); border-radius: 4px; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: border-color ease-in-out .15s; -o-transition: border-color ease-in-out .15s; transition: border-color ease-in-out .15s; } #stacks_in_115505 .form-control input { height: 34px; } #stacks_in_115505 .radio label { padding-left: 0; } #stacks_in_115505 input[type="radio"], #stacks_in_115505 input[type="checkbox"] { margin-left: 0.1em; position: relative; } #stacks_in_115505 .form-control:focus { border-color: rgba(102, 175, 233, 1.00); background-color: rgba(255, 255, 255, 1.00); outline: 0; } #stacks_in_115505 textarea.form-control { height: auto; } #stacks_in_115505 .help-block { display: block; margin-top: 5px; margin-bottom: 10px; color: rgba(115, 115, 115, 1.00); } /* Input groups */ #stacks_in_115505 .input-group { position: relative; display: table; border-collapse: separate; width: 100%; } #stacks_in_115505 .input-group .form-control, #stacks_in_115505 .input-group-addon { display: table-cell; } #stacks_in_115505 .input-group-addon { width: 1%; white-space: nowrap; vertical-align: middle; } #stacks_in_115505 .input-group-addon { padding: 6px 12px; font-size: 14px; font-weight: 400; line-height: 1; color: rgba(85, 85, 85, 1.00); text-align: center; background-color: rgba(238, 238, 238, 1.00); border: 1px solid rgba(204, 204, 204, 1.00); border-radius: 4px; } #stacks_in_115505 .input-group .form-control:last-child, #stacks_in_115505 .input-group-addon:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; } #stacks_in_115505 .input-group-addon:first-child { border-right: none; } #stacks_in_115505 .input-group-addon:last-child { border-top-left-radius: 0; border-bottom-left-radius: 0; border-left: none; } #stacks_in_115505 .input-group .form-control { position: relative; z-index: 2; float: left; width: 100%; margin-bottom: 0; } /* Buttons */ .btn { display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px; } /* @end */ /* @group Form Input sizing */ /* */ /* */ /* @end */ /* @group Date Picker Styling */ div#ui-datepicker-div.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all { z-index: 9999 !important; } .ui-datepicker { background-color: #fff; border: 1px solid #66AFE9; border-radius: 4px; box-shadow: 0 0 8px rgba(102,175,233,.6); display: none; margin-top: 4px; padding: 10px; width: 240px; color: #212529; } .ui-datepicker a, .ui-datepicker a:hover { text-decoration: none; } .ui-datepicker a:hover, .ui-datepicker td:hover a { color: #2A6496; -webkit-transition: color 0.1s ease-in-out; -moz-transition: color 0.1s ease-in-out; -o-transition: color 0.1s ease-in-out; transition: color 0.1s ease-in-out; } .ui-datepicker .ui-datepicker-header { margin-bottom: 4px; text-align: center; } .ui-datepicker .ui-datepicker-title { font-weight: 700; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { cursor: default; font-family: 'FontAwesome'; -webkit-font-smoothing: antialiased; font-style: normal; font-weight: normal; height: 20px; font-size: 20px; line-height: 1; margin-top: 2px; width: 30px; } .ui-datepicker .ui-datepicker-prev { float: left; text-align: left; } .ui-datepicker .ui-datepicker-next { float: right; text-align: right; } .ui-datepicker .ui-datepicker-prev:before { content: "\f0a8"; } .ui-datepicker .ui-datepicker-next:before { content: "\f0a9"; } .ui-datepicker .ui-icon { display: none; } .ui-datepicker .ui-datepicker-calendar { table-layout: fixed; width: 100%; } .ui-datepicker .ui-datepicker-calendar th, .ui-datepicker .ui-datepicker-calendar td { text-align: center; padding: 4px 0; } .ui-datepicker .ui-datepicker-calendar td { border-radius: 4px; -webkit-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; -moz-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; -o-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; } .ui-datepicker .ui-datepicker-calendar td:hover { background-color: #eee; cursor: pointer; } .ui-datepicker .ui-datepicker-calendar td a { text-decoration: none; } .ui-datepicker .ui-datepicker-today, .ui-datepicker .ui-datepicker-current-day { background-color: #4289cc; } .ui-datepicker .ui-datepicker-today a, .ui-datepicker .ui-datepicker-current-day a { color: #fff } .ui-datepicker .ui-datepicker-calendar .ui-datepicker-unselectable:hover { background-color: #fff; cursor: default; } .ui-datepicker-unselectable.ui-state-disabled { opacity: 0.50; } /* Some extra CSS added by Will Woodgate on 28th Feb 2018 to help with styling the time picker */ .ui-datepicker table.ui-datepicker-calendar { margin-bottom: 10px; } .ui-datepicker .ui-timepicker-div dl { padding-top:15px; padding-bottom: 0px; border: 1px solid #dddddd; margin-top: 0px; margin-bottom: 10px; display: block; background: #f9f9f9; } .ui-datepicker .ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { border-bottom: none; border: 1px solid #dddddd; background: #ffffff; margin: 0px; padding: 6px 0 6px 6px; } .ui-datepicker .ui-timepicker-div dl dd { margin: 0 10px 10px 40%; min-height: 30px; } .ui-datepicker .ui-slider { border: 1px solid #c5c5c5; border-radius: 3px; height: .8em; position: relative; margin-top: 15px; } .ui-datepicker .ui-slider-handle { border: 1px solid #4289cc; border-radius: 3px; background: #4289cc; font-weight: normal; color: #454545; top: -.3em; margin-left: -.6em; position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; -ms-touch-action: none; touch-action: none; } .ui-datepicker div.ui-datepicker-buttonpane { display: block; } .ui-datepicker div.ui-datepicker-buttonpane button { float: left; background: #FFFFFF; border-radius: 4px; color: #333333; border: 1px solid #cccccc; outline: none; padding: 10px 15px; font-size: 15px; margin: 0px; } .ui-datepicker div.ui-datepicker-buttonpane button:hover { color: #333; background-color: #e6e6e6; border-color: #adadad; } .ui-datepicker div.ui-datepicker-buttonpane button.ui-datepicker-close { float: right; background: #4289cc; border: 1px solid #2e6da4; color: #ffffff; } .ui-datepicker div.ui-datepicker-buttonpane button.ui-datepicker-close:hover { background-color: #286090; border-color: #204d74; color: #ffffff; } /* @end */ /* Next, previous and finish button styling */ #stacks_in_115505 span.formsplus-next-btn-wrapper, #stacks_in_115505 span.formsplus-prev-btn-wrapper, #stacks_in_115505 span.formsplus-finish-btn-wrapper { font-size: 18px; } /* @group Step Button Styling */ #stacks_in_115505 ul#step-indicator-stacks_in_115505 *, #stacks_in_115505 ul#step-indicator-stacks_in_115505 *:after, #stacks_in_115505 ul#step-indicator-stacks_in_115505 *:before { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; vertical-align: baseline; font-size: 14px; line-height: 1.42857143; } #stacks_in_115505 ul#step-indicator-stacks_in_115505 a, #stacks_in_115505 ul#step-indicator-stacks_in_115505 a:visited, #stacks_in_115505 ul#step-indicator-stacks_in_115505 a:hover, #stacks_in_115505 ul#step-indicator-stacks_in_115505 a:active { text-decoration: none; outline: none; } /* */ /* */ /* Incomplete steps */ #stacks_in_115505 .gsi-step-no-available li.current ~ li>*, #stacks_in_115505 .gsi-step-no-available li.current ~ li>*:hover { background-color: rgba(193, 193, 193, 1.00) !important; border-color: rgba(193, 193, 193, 1.00) !important; color: rgba(44, 63, 76, 1.00) !important; } /* The active (current) steps */ #stacks_in_115505 .gsi-step-indicator.triangle li.current>* { color: rgba(255, 255, 255, 1.00); background-color: rgba(31, 113, 232, 1.00); border-color: rgba(31, 113, 232, 1.00); } /* Hovered steps */ #stacks_in_115505 .gsi-step-indicator.triangle li>*:hover { color: rgba(255, 255, 255, 1.00); background-color: rgba(109, 108, 108, 1.00); border-color: rgba(109, 108, 108, 1.00); } /* Completed steps */ #stacks_in_115505 .gsi-step-indicator.triangle li>* { color: rgba(51, 51, 51, 1.00); background-color: rgba(205, 205, 205, 1.00); border-color: rgba(205, 205, 205, 1.00); } @media screen and (max-width: 768px) { #stacks_in_115505 .gsi-step-indicator.triangle li::after, #stacks_in_115505 .gsi-step-indicator.triangle li>*::after { display: none !important; } #stacks_in_115505 .gsi-step-indicator li { display: block; float: none; margin: 4px; } #stacks_in_115505 .gsi-step-indicator.triangle li:first-of-type>* { border-radius: 0.25em; } #stacks_in_115505 .gsi-step-indicator.triangle li a { border-radius: 0.25em; } } /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* Submit text colors */ /* Button styling */ #stacks_in_115505 .center { text-align: center; } #stacks_in_115505 .btnPosition { position: relative; z-index: 20; } #stacks_in_115505 a.smartyBoxButton, #stacks_in_115505 button[type="reset"], #stacks_in_115505 .tsf-controls .tsf-wizard-btn { text-decoration: none; background-color: rgba(31, 113, 232, 1.00); color: rgba(255, 255, 255, 1.00); transition: all 300ms ease-in-out; } #stacks_in_115505 a.smartyBoxButton:hover, #stacks_in_115505 a.smartyBoxButton:active, #stacks_in_115505 button[type="reset"]:hover, #stacks_in_115505 button[type="reset"]:active, #stacks_in_115505 .tsf-controls .tsf-wizard-btn:hover, #stacks_in_115505 .tsf-controls .tsf-wizard-btn:active { text-decoration: none; background-color: rgba(109, 108, 108, 1.00); color: rgba(255, 255, 255, 1.00); } /* Fixes the font sizing */ #stacks_in_115505 ul#step-indicator-stacks_in_115505 .number { font-size: 28px; } #stacks_in_115505 ul#step-indicator-stacks_in_115505 .desc label { font-size: 14px; } #stacks_in_115505 ul#step-indicator-stacks_in_115505 .desc span { font-size: 13px; } /* Fixes circle number alignment in some themes */ #stacks_in_115505 ul#step-indicator-stacks_in_115505.gsi-style-3 .number, #stacks_in_115505 ul#step-indicator-stacks_in_115505.gsi-number-circle .number { line-height: 1.2em; } /* Fixes colour override issues in themes like Foundation */ #stacks_in_115505 .gsi-step-indicator.triangle a label, #stacks_in_115505 .gsi-step-indicator.triangle a:hover label { color: inherit; } /* @end */ /* @group Validation */ .form-group { position: relative; } .form-group.has-error { border: 2px solid #f44545; padding: 30px 10px 10px; border-radius: 4px; } ul.parsley-errors-list { position: absolute; top: -2px; right: -2px; text-align: left; padding: 0; margin: 0; list-style: none; clear: both; } ul.parsley-errors-list li { padding: 5px; margin: 0; font-weight: bold; font-size: 12px; line-height: 1.10em; text-transform: uppercase; z-index: 3; background: #f44545; color: #ffffff; display: none; border-top-right-radius: 4px; } ul.parsley-errors-list li:last-child { display: inline-block; } /* @end */ /* @group Edit Mode */ /* */ /* @end */ /* */ /* */ #stacks_in_115506 { font-size: 125%; } #stacks_in_115507 { font-size: 125%; } .form-group { -webkit-column-break-inside: avoid; break-inside: avoid; } @media screen and (min-width: 480px) { #inputWrapperstacks_in_115508 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; -webkit-column-gap: 2em; -moz-column-gap: 2em; column-gap: 2em; } } @media screen and (min-width: 768px) { #inputWrapperstacks_in_115508 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 992px) { #inputWrapperstacks_in_115508 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 1200px) { #inputWrapperstacks_in_115508 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } #formsplusHeaderContentstacks_in_115508 { margin-bottom: 20px; } #formsplusFooterContentstacks_in_115508 { margin-top: 20px; } /* */legend#formsplusLegendstacks_in_115512 { text-align: ; display: block; } /* */.form-group { -webkit-column-break-inside: avoid; break-inside: avoid; } @media screen and (min-width: 480px) { #inputWrapperstacks_in_115517 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; -webkit-column-gap: 2em; -moz-column-gap: 2em; column-gap: 2em; } } @media screen and (min-width: 768px) { #inputWrapperstacks_in_115517 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 992px) { #inputWrapperstacks_in_115517 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 1200px) { #inputWrapperstacks_in_115517 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } #formsplusHeaderContentstacks_in_115517 { margin-bottom: 20px; } #formsplusFooterContentstacks_in_115517 { margin-top: 20px; } /* *//* *//* *//* */.form-group { -webkit-column-break-inside: avoid; break-inside: avoid; } @media screen and (min-width: 480px) { #inputWrapperstacks_in_115528 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; -webkit-column-gap: 2em; -moz-column-gap: 2em; column-gap: 2em; } } @media screen and (min-width: 768px) { #inputWrapperstacks_in_115528 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 992px) { #inputWrapperstacks_in_115528 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 1200px) { #inputWrapperstacks_in_115528 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } #formsplusHeaderContentstacks_in_115528 { margin-bottom: 20px; } #formsplusFooterContentstacks_in_115528 { margin-top: 20px; } /* *//* */.form-group { -webkit-column-break-inside: avoid; break-inside: avoid; } @media screen and (min-width: 480px) { #inputWrapperstacks_in_115534 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; -webkit-column-gap: 2em; -moz-column-gap: 2em; column-gap: 2em; } } @media screen and (min-width: 768px) { #inputWrapperstacks_in_115534 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 992px) { #inputWrapperstacks_in_115534 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } @media screen and (min-width: 1200px) { #inputWrapperstacks_in_115534 { -webkit-column-count: 0; -moz-column-count: 0; column-count: 0; } } #formsplusHeaderContentstacks_in_115534 { margin-bottom: 20px; } #formsplusFooterContentstacks_in_115534 { margin-top: 20px; } /* *//** * Fileuploader * Copyright (c) 2019 Innostudio.de * Website: https://innostudio.de/fileuploader/ * Version: 2.2 (15-Apr-2019) * Requires: jQuery v1.7.1 or later * License: https://innostudio.de/fileuploader/documentation/#license */ @charset "UTF-8"; .fileuploader-input .fileuploader-input-button, .fileuploader-input .fileuploader-input-caption, .fileuploader-items .fileuploader-item .fileuploader-action, .fileuploader-items .fileuploader-item .fileuploader-progressbar .bar, .fileuploader-items .fileuploader-item .progress-bar2 .fileuploader-progressbar .bar, .fileuploader-items .fileuploader-item span.fileuploader-action-popup, .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-tools li [data-action], .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer button[data-action], .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success { -webkit-transition: .7s cubic-bezier(.17, .67, 0, 1.01); -o-transition: .7s cubic-bezier(.17, .67, 0, 1.01); transition: .7s cubic-bezier(.17, .67, 0, 1.01) } .fileuploader-items .fileuploader-item, .fileuploader-items .fileuploader-item .fileuploader-action, .fileuploader-items .fileuploader-item .fileuploader-item-icon, .fileuploader-items .fileuploader-item .fileuploader-item-image canvas, .fileuploader-items .fileuploader-item .fileuploader-item-image img, .fileuploader-popup, .fileuploader-popup .fileuploader-popup-node { -webkit-animation: fileuploaderFadeIn .2s ease; animation: fileuploaderFadeIn .2s ease } .fileuploader-input .fileuploader-input-button, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success { display: inline-block; margin: 0; padding: 14px 22px; border: none; border-radius: 30px; outline: 0; font-weight: 700; cursor: pointer; vertical-align: middle; text-decoration: none } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button { background: #e6ebf4; color: #90a0bc } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button:hover { background: #edf1f7; transform: translateY(-1px) } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button:active { background: #dfe5f1; transform: translateY(1px) } .fileuploader-input .fileuploader-input-button, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success { background: #9658fe; background: -moz-linear-gradient(-45deg, #3a8ffe 0, #9658fe 100%); background: -webkit-linear-gradient(-45deg, #3a8ffe 0, #9658fe 100%); background: linear-gradient(135deg, #3a8ffe 0, #9658fe 100%); background-size: 140% auto; background-position: center; color: #fff; box-shadow: 0 4px 18px rgba(0, 0, 0, .04) } .fileuploader-input .fileuploader-input-button:hover, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success:hover { background-position: left; box-shadow: 0 8px 25px rgba(0, 0, 0, .15); transform: translateY(-2px) } .fileuploader-input .fileuploader-input-button:active, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success:active { background-position: right; box-shadow: 0 4px 25px rgba(0, 0, 0, .15); transform: translateY(2px) } .fileuploader-input .fileuploader-input-caption .fileuploader-pending-loader, .fileuploader-items .fileuploader-item .fileuploader-item-image.fileuploader-loading:after, .fileuploader-items .fileuploader-item.upload-pending .fileuploader-action-remove:after, .fileuploader-popup.loading:after { content: ""; position: absolute; min-width: 24px; min-height: 24px; max-width: 48px; max-height: 48px; background: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJsb2FkZXItMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI0MHB4IiBoZWlnaHQ9IjQwcHgiIHZpZXdCb3g9IjAgMCA1MCA1MCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNTAgNTA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBmaWxsPSIjZGRlNGY2IiBkPSJNNDMuOTM1LDI1LjE0NWMwLTEwLjMxOC04LjM2NC0xOC42ODMtMTguNjgzLTE4LjY4M2MtMTAuMzE4LDAtMTguNjgzLDguMzY1LTE4LjY4MywxOC42ODNoNC4wNjhjMC04LjA3MSw2LjU0My0xNC42MTUsMTQuNjE1LTE0LjYxNWM4LjA3MiwwLDE0LjYxNSw2LjU0MywxNC42MTUsMTQuNjE1SDQzLjkzNXoiPjxhbmltYXRlVHJhbnNmb3JtIGF0dHJpYnV0ZVR5cGU9InhtbCIgYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgMjUgMjUiIHRvPSIzNjAgMjUgMjUiIGR1cj0iMC42cyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz4gPC9wYXRoPiA8L3N2Zz4=) no-repeat center; background-size: contain } .fileuploader-items .fileuploader-item .fileuploader-item-icon i, .fileuploader-items .fileuploader-item .fileuploader-item-image canvas, .fileuploader-items .fileuploader-item .fileuploader-item-image img, .fileuploader-items .fileuploader-item .fileuploader-item-image.fileuploader-loading:after, .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point:after, .fileuploader-popup .fileuploader-popup-move:after, .fileuploader-popup.loading:after { left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .fileuploader-items .fileuploader-item .fileuploader-action, .fileuploader-items .fileuploader-item .progress-bar2 span { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .fileuploader-input .fileuploader-input-button, .fileuploader-items .fileuploader-item .fileuploader-item-icon, .fileuploader-items .fileuploader-item .progress-bar2 .fileuploader-progressbar, .fileuploader-popup .fileuploader-cropper, .fileuploader-popup .fileuploader-cropper *, .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-tools li [data-action], .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success, .fileuploader-popup .fileuploader-popup-move, .fileuploader-popup .fileuploader-popup-node .fileuploader-popup-file-icon { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .fileuploader, .fileuploader *, .fileuploader :after, .fileuploader :before, .fileuploader-popup, .fileuploader-popup *, .fileuploader-popup :after, .fileuploader-popup :before { box-sizing: border-box } .fileuploader button, .fileuploader-popup button { display: inline-block; padding: 0; margin: 0; border: 0; font: inherit; background: 0 0; box-shadow: none } .fileuploader button:focus, .fileuploader-popup button:focus { outline: 0 } .fileuploader { display: block; width: 100%; padding: 16px; margin: 16px 0; background: #fafbfd; border-radius: 6px; line-height: normal } .fileuploader-icon-main { display: inline-block; font-size: 18px; color: #789bec } .fileuploader-input { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; border: 1px solid transparent; border-radius: 30px; cursor: pointer } .fileuploader-input .fileuploader-input-caption { position: relative; display: inline-block; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; -ms-flex-item-align: start; align-self: flex-start; padding: 13px 16px; margin-right: 16px; background: #fff; border: 1px solid #ebeef1; border-radius: 30px; color: #789bec; box-shadow: 0 4px 18px rgba(0, 0, 0, .01); font-weight: 700; white-space: nowrap; text-overflow: ellipsis; overflow: hidden } .fileuploader-focused .fileuploader-input .fileuploader-input-caption { border-color: #789bec } .fileuploader-input .fileuploader-input-caption .fileuploader-pending-loader { position: relative; display: inline-block; vertical-align: middle; min-height: 22px; margin-right: 6px } .fileuploader-input.fileuploader-dragging { background: #fff; border: 1px solid #ebeef1; border-style: dashed } .fileuploader-input.fileuploader-dragging .fileuploader-input-caption { border-color: transparent } .fileuploader-input.fileuploader-dragging .fileuploader-input-button { -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 0 } .fileuploader-disabled .fileuploader-input { opacity: .7; cursor: default; pointer-events: none !important } .fileuploader-items .fileuploader-items-list { display: block; margin: 0 -16px; padding: 0; list-style: none } .fileuploader-items .fileuploader-item { position: relative; margin: 0; padding: 20px 16px 20px 22px; border-bottom: 1px solid #ebeef1; animation-duration: .6s } .fileuploader-items .fileuploader-item:last-child { border-bottom: 0; margin-bottom: -16px } .fileuploader-items .fileuploader-item.upload-failed { background: rgba(254, 84, 111, .06) } .fileuploader-items .fileuploader-item.upload-pending .fileuploader-action-remove:after { position: absolute; left: -8px; top: -8px; width: 36px; height: 36px } .fileuploader-items .fileuploader-item .columns { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; z-index: 2 } .fileuploader-items .fileuploader-item .column-thumbnail { position: relative; width: 36px; height: 36px } .fileuploader-items .fileuploader-item .column-title { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding-left: 16px; padding-right: 16px; color: #74809d; overflow: hidden } .fileuploader-items .fileuploader-item .column-title a { display: inline-block; width: 100%; height: 100%; color: #74809d; text-decoration: none } .fileuploader-items .fileuploader-item .column-title div { width: 100%; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .fileuploader-items .fileuploader-item .column-title span { font-size: 12px; color: #979fb8 } .fileuploader-items .fileuploader-item .column-actions { margin: 0 16px } .fileuploader-items .fileuploader-item .fileuploader-item-image { position: relative; width: 100%; height: 100%; border-radius: 6px; background: #fff; overflow: hidden } .fileuploader-items .fileuploader-item .fileuploader-item-image.fileuploader-loading:after { content: ""; width: 50%; height: 50% } .fileuploader-items .fileuploader-item .fileuploader-item-image canvas, .fileuploader-items .fileuploader-item .fileuploader-item-image img { position: absolute; max-width: none; max-height: 100% } .fileuploader-items .fileuploader-item .fileuploader-item-icon { position: relative; width: 100%; height: 100%; text-align: center; color: #fff; font-size: 11px; background: #ddd; border-radius: 4px; cursor: default } .fileuploader-items .fileuploader-item .fileuploader-item-icon.is-bright-color { color: #888 } .fileuploader-items .fileuploader-item .fileuploader-item-icon i { position: absolute; display: block; width: 90%; font-style: normal; font-weight: 700; overflow: hidden; white-space: nowrap } .fileuploader-items .fileuploader-item span.fileuploader-action-popup { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(43, 56, 71, .2); border-radius: 6px; cursor: pointer; opacity: 0 } .fileuploader-items .fileuploader-item span.fileuploader-action-popup:hover { opacity: 1 } .fileuploader-items .fileuploader-item span.fileuploader-action-popup:active { background: rgba(43, 56, 71, .4) } .fileuploader-items .fileuploader-item .fileuploader-action { position: relative; display: inline-block; width: 20px; height: 20px; color: #c0c6d2; cursor: pointer; vertical-align: top; text-align: center } .fileuploader-items .fileuploader-item .fileuploader-action+.fileuploader-action { margin-left: 16px } .fileuploader-items .fileuploader-item .fileuploader-action:hover { color: #789bec } .fileuploader-items .fileuploader-item .fileuploader-action:active { color: #668ee9 } .fileuploader-items .fileuploader-item .fileuploader-action i { width: 100%; height: 100%; font-size: 20px; line-height: 20px } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove { color: #fff; background: #fe7676; border-radius: 50%; box-shadow: -1px 1px 6px rgba(254, 118, 118, .8) } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove i { font-size: 14px; text-shadow: none } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove:hover { background-color: #fe8a8a } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove:active { background-color: #fe6262 } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-success { color: #fff; background: #43d084; border-radius: 50%; box-shadow: -1px 1px 6px rgba(67, 208, 132, .8) } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-success i { font-size: 14px; text-shadow: none } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-success:hover { background-color: #53d48f } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-success:active { background-color: #33cc79 } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success i:before { content: "\e904" } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success:active, .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success:hover { background: #fe7676; box-shadow: -1px 1px 6px rgba(254, 118, 118, .8) } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success:active i:before, .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success:hover i:before { content: "\e923" } .fileuploader-items .fileuploader-item .fileuploader-action.fileuploader-action-remove.fileuploader-action-success:active { background-color: #fe6262 } .fileuploader-items .fileuploader-item.file-has-popup span.fileuploader-action-popup { display: block } .fileuploader-items .fileuploader-item .fileuploader-progressbar { position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; border-radius: 6px } .fileuploader-items .fileuploader-item .fileuploader-progressbar .bar { position: absolute; left: 0; top: 0; width: 0%; height: 100%; border-radius: 6px; background: #789bec; box-shadow: 0 4px 8px -1px rgba(120, 155, 236, 0.6) } .fileuploader-items .fileuploader-item .progress-bar2 .fileuploader-progressbar { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 1 } .fileuploader-items .fileuploader-item .progress-bar2 .fileuploader-progressbar .bar { position: absolute; left: 0; top: 0; width: 0%; height: 100%; border-radius: 0; background: rgba(104, 125, 219, .08); box-shadow: none } .fileuploader-items .fileuploader-item .progress-bar2 span { position: absolute; right: 16px; color: rgba(151, 159, 184, .16); font-size: 48px } .fileuploader-items .fileuploader-item.sorting { background: #fafbfd; border-radius: 6px; opacity: .8; box-shadow: 0 1px 4px rgba(0, 0, 0, .2); z-index: 799 } .fileuploader-items .fileuploader-item.sorting, .fileuploader-items .fileuploader-item.sorting .fileuploader-action, .fileuploader-items .fileuploader-item.sorting .fileuploader-item-icon, .fileuploader-items .fileuploader-item.sorting .fileuploader-item-image canvas, .fileuploader-items .fileuploader-item.sorting .fileuploader-item-image img { -webkit-animation: none; animation: none } .fileuploader-items .fileuploader-sorter-placeholder { background: rgba(0, 0, 0, .03); margin: 0; padding: 0; -webkit-animation: none; animation: none } .fileuploader-popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; background: #191d1e; z-index: 1090; animation-duration: .4s } .fileuploader-popup.loading:after { width: 48px; height: 48px; z-index: 8 } .fileuploader-popup .fileuploader-popup-preview { position: relative; width: 100%; height: 100%; overflow: auto; z-index: 2 } .fileuploader-popup .fileuploader-popup-node { position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; max-width: 100%; height: 100%; min-width: 20px; min-height: 20px; padding: 80px 56px 64px; overflow: hidden } .fileuploader-popup .fileuploader-popup-node.is-zoomed { display: block } .fileuploader-popup .fileuploader-popup-node .reader-node { position: relative; max-width: 100%; max-height: 100%; text-align: center; -webkit-transform: translateZ(0); transform: translateZ(0) } .fileuploader-popup .fileuploader-popup-node .reader-node.is-movable { cursor: grab } .fileuploader-popup .fileuploader-popup-node .reader-node.is-amoving:hover, .fileuploader-popup .fileuploader-popup-node .reader-node.is-moving { cursor: grabbing } .fileuploader-popup .fileuploader-popup-node .reader-node.is-amoving:hover .area-move, .fileuploader-popup .fileuploader-popup-node .reader-node.is-amoving:hover .point, .fileuploader-popup .fileuploader-popup-node .reader-node.is-moving .area-move, .fileuploader-popup .fileuploader-popup-node .reader-node.is-moving .point { cursor: grabbing !important } .fileuploader-popup .fileuploader-popup-node .reader-node.has-node-centered { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100% } .fileuploader-popup .fileuploader-popup-node.astext .reader-node>div, .fileuploader-popup .fileuploader-popup-node.audio .reader-node>audio, .fileuploader-popup .fileuploader-popup-node.image .reader-node>img, .fileuploader-popup .fileuploader-popup-node.video .reader-node>video { max-width: 100%; max-height: 100%; margin: 0; padding: 0; color: #47525d; background: #fafafa; box-shadow: 0 0 18px rgba(0, 0, 0, .4); -webkit-transform: translateZ(0); transform: translateZ(0); border-radius: 0 } .fileuploader-popup .fileuploader-popup-node.audio .reader-node audio { width: 450px } .fileuploader-popup .fileuploader-popup-node.application .reader-node iframe { width: 100%; height: 100%; border: 0; border-radius: 3px } .fileuploader-popup .fileuploader-popup-node.astext .reader-node div { max-width: 992px; padding: 20px; margin: 0 auto; font-size: 14px; line-height: 16px; text-align: left; overflow-y: auto; white-space: pre-wrap } .fileuploader-popup .fileuploader-popup-node .fileuploader-popup-file-icon { position: relative; display: inline-block; width: 80px; height: 80px; background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDkiIGhlaWdodD0iNjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQiPiA8Zz4gIDx0aXRsZT5iYWNrZ3JvdW5kPC90aXRsZT4gIDxyZWN0IGZpbGw9Im5vbmUiIGlkPSJjYW52YXNfYmFja2dyb3VuZCIgaGVpZ2h0PSI0MDIiIHdpZHRoPSI1ODIiIHk9Ii0xIiB4PSItMSIvPiA8L2c+IDxnPiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjYmJjYWNmIiBpZD0ic3ZnXzIiIGQ9Im00OSwxNi44NDJsMCw0Mi4xMDVjMCwyLjc5MSAtMi4yNyw1LjA1MyAtNS4wNjksNS4wNTNsLTM4Ljg2MiwwYy0yLjgsMCAtNS4wNjksLTIuMjYyIC01LjA2OSwtNS4wNTNsMCwtNTMuODk0YzAsLTIuNzkxIDIuMjY5LC01LjA1MyA1LjA2OSwtNS4wNTNsMjcuMDM0LDBsMTYuODk3LDE2Ljg0MnoiIGNsYXNzPSJjbHMtMSIvPiAgPHBhdGggZmlsbD0iI2RmZWFlZSIgZmlsbC1ydWxlPSJldmVub2RkIiBpZD0ic3ZnXzQiIGQ9Im00OSwxNS44OTlsMCwyLjA5NmwtMTMuODEzLDBjLTIuODYsMCAtNC4xNzksLTIuMzIgLTQuMTc5LC01LjE4MWwwLC0xMi44MTRsMi4wOTIsMGwxNS45LDE1Ljg5OXoiIGNsYXNzPSJjbHMtMyIvPiA8L2c+PC9zdmc+) no-repeat center; background-size: contain } .fileuploader-popup .fileuploader-popup-node .fileuploader-popup-file-icon div { position: absolute; bottom: 14px; left: 0; padding: 4px 6px; border-radius: 4px; color: #fff; max-width: 100%; word-wrap: break-word } .fileuploader-popup .fileuploader-popup-node .fileuploader-popup-file-icon div.is-bright-color { color: #888 } .fileuploader-popup .fileuploader-popup-node .fileuploader-popup-file-icon div i { text-transform: uppercase; font-style: normal; font-weight: 700; white-space: nowrap } .fileuploader-popup .fileuploader-popup-content { color: #fdfdfd; text-shadow: 1px 1px 1px rgba(0, 0, 0, .4) } .fileuploader-popup .fileuploader-popup-content ul { list-style: none; margin: 0; padding: 0 } .fileuploader-popup .fileuploader-popup-content ul li { display: inline-block; padding: 0; margin: 0 } .fileuploader-popup .fileuploader-popup-content ul li+li { margin-left: 16px } .fileuploader-popup .fileuploader-popup-header { position: absolute; top: 0; left: 0; display: flex; flex-direction: row; align-items: center; width: 100%; padding: 16px; background: rgba(0, 0, 0, .8); background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); background: linear-gradient(360deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); z-index: 2 } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-meta { display: flex; flex: 1; white-space: nowrap; overflow: hidden } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-meta li:first-child { overflow: hidden } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-meta span { display: block; color: #80868b; font-size: 14px } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-meta h5 { max-width: 100%; margin: 4px 0 0; font-size: 14px; font-weight: 700; text-overflow: ellipsis; overflow: hidden } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-info:not(:empty) { flex: 1; margin-left: 16px } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-buttons { margin-left: 16px } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button { padding: 14px 24px; text-shadow: none } .fileuploader-popup .fileuploader-popup-footer { position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; background: rgba(0, 0, 0, .8); background: -moz-linear-gradient(0deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); background: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); z-index: 2 } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-tools li [data-action] { display: inline-block; padding: 16px; padding-bottom: 13px; cursor: pointer; text-decoration: none; color: #fdfdfd; border-bottom: 3px solid transparent } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-tools li [data-action] i { display: inline-block; font-size: 18px; margin-top: -4px; margin-right: 6px; vertical-align: middle } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-tools li [data-action]:hover { border-bottom-color: #789bec; color: #fff } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer { font-size: 14px } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer button[data-action] { width: 24px; height: 24px; line-height: 24px; font-size: 16px; border: none; border-radius: 50%; padding: 0; vertical-align: middle; color: #fdfdfd; background: rgba(255, 255, 255, .1); text-shadow: none } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer button[data-action]:hover { background: rgba(255, 255, 255, .3) } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer input { display: inline-block; -webkit-appearance: none; width: 130px; padding: 0; margin: 0 16px; vertical-align: middle; background: 0 0 } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer input:focus { outline: 0 } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer input::-webkit-slider-runnable-track { width: 100%; height: 4px; cursor: pointer; animate: .2s; box-shadow: none; background: #789bec; border-radius: 6px } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer input::-webkit-slider-thumb { height: 14px; width: 14px; border-radius: 50%; border: 0; background: #fff; cursor: pointer; -webkit-appearance: none; margin-top: -5px; box-shadow: 2px 2px 8px rgba(0, 0, 0, .8) } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer input::-moz-range-track { width: 100%; height: 4px; cursor: pointer; animate: .2s; box-shadow: none; background: #789bec; border-radius: 6px } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer input::-moz-range-thumb { height: 14px; width: 14px; border-radius: 50%; border: 0; background: #fff; cursor: pointer; -webkit-appearance: none; margin-top: -5px; box-shadow: 2px 2px 8px rgba(0, 0, 0, .8) } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer span { display: inline-block; min-width: 40px; text-align: center; margin-left: 6px; color: #fff; vertical-align: middle } .fileuploader-popup .fileuploader-popup-move { position: absolute; display: none; width: 56px; height: 100%; font-size: 24px; bottom: 0; left: 0; color: #fff; opacity: .4; cursor: pointer; z-index: 1 } .fileuploader-popup .fileuploader-popup-move:hover { opacity: 1 } .fileuploader-popup .fileuploader-popup-move:after { position: absolute } .fileuploader-popup .fileuploader-popup-move[data-action=next] { left: auto; right: 0 } .fileuploader-popup .fileuploader-popup-has-arrows .fileuploader-popup-move { display: inline-block } .fileuploader-popup .fileuploader-cropper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(17, 20, 27, .65); z-index: 9 } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area { position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: 2; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0) } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area.has-grid:after, .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area.has-grid:before { content: ""; position: absolute; border: 1px solid rgba(250, 250, 250, .8); opacity: 0; -webkit-transition: all .4s ease; transition: all .4s ease; z-index: 1 } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area.has-grid:before { top: 0; left: 50%; height: 100%; width: 34%; border-top: 0; border-bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%) } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area.has-grid:after { top: 50%; left: 0; height: 34%; width: 100%; border-left: 0; border-right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area.has-grid.moving:after, .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area.has-grid.moving:before { opacity: 1 } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point { position: absolute; width: 24px; height: 24px; z-index: 3 } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point:after { content: ""; width: 12px; height: 12px; position: absolute; background: #fff; box-shadow: 0 0 6px rgba(0, 0, 0, .4); border-radius: 50% } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-a { top: -12px; left: -12px; cursor: nw-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-b { top: -12px; left: 50%; margin-left: -12px; cursor: n-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-c { top: -12px; right: -12px; cursor: ne-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-d { top: 50%; right: -12px; margin-top: -12px; cursor: w-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-e { bottom: -12px; right: -12px; cursor: nw-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-f { bottom: -12px; left: 50%; margin-left: -12px; cursor: s-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-g { bottom: -12px; left: -12px; cursor: sw-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .point.point-h { left: -12px; top: 50%; margin-top: -12px; cursor: w-resize } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .area-move { position: absolute; width: 100%; height: 100%; z-index: 2; cursor: move } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .area-move:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid rgba(255, 255, 255, .8) } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .area-image { position: relative; overflow: hidden; width: 100%; height: 100% } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .area-image img { width: auto; height: auto; max-width: none; max-height: none; position: absolute; left: 0; top: 0; background: #fff; -webkit-transform-origin: top left; transform-origin: top left } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area .area-info { position: absolute; bottom: -12px; left: 50%; color: #fff; font-family: sans-serif; line-height: 1; font-size: 12px; text-align: center; padding: 4px 8px; background: rgba(0, 0, 0, .6); border-radius: 14px; white-space: nowrap; opacity: 0; -webkit-transform: translateX(-50%) translateY(100%); transform: translateX(-50%) translateY(100%); -webkit-transition: all .4s ease; transition: all .4s ease; z-index: 2 } .fileuploader-popup .fileuploader-cropper .fileuploader-cropper-area.show-info .area-info { opacity: 0 } @media all and (max-width:768px) { .fileuploader-popup .fileuploader-popup-header { display: block; padding: 0 } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-meta { padding: 16px } .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-buttons { position: fixed; left: 0; bottom: 16px; width: 100%; margin: 0; text-align: center } .fileuploader-popup .fileuploader-popup-node { padding-left: 16px; padding-right: 16px; padding-bottom: 117px } .fileuploader-popup .fileuploader-popup-footer { bottom: 61px; background: 0 0 } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-zoomer { display: none } .fileuploader-popup .fileuploader-popup-footer .fileuploader-popup-tools li a:hover { border-color: transparent } .fileuploader-popup .fileuploader-popup-move { width: 30px } .fileuploader-popup .fileuploader-popup-has-arrows .fileuploader-popup-node { padding-left: 30px; padding-right: 30px } } @-webkit-keyframes fileuploaderFadeIn { from { opacity: 0 } to { opacity: 1 } } @keyframes fileuploaderFadeIn { from { opacity: 0 } to { opacity: 1 } } /* onebutton Theme */ .fileuploader-theme-onebutton .fileuploader-input { display: inline-block; } .fileuploader-theme-onebutton .fileuploader-input .fileuploader-input-caption { display: none; } /* drag and drop theme */ .fileuploader-theme-dragdrop .fileuploader-input { display: block; padding: 60px 0; background: #fff; border: 2px dashed #c2cdda; border-radius: 14px; text-align: center; } .fileuploader-theme-dragdrop .fileuploader-input .fileuploader-icon-main { display: block; font-size: 56px; margin: 0 auto; margin-bottom: 26px; } .fileuploader-theme-dragdrop .fileuploader-input h3 { margin: 0; margin-bottom: 8px; padding: 0; background: none; border: none; font-size: 18px; font-weight: bold; color: #5B5B7B; white-space: normal; box-shadow: none; } .fileuploader-theme-dragdrop .fileuploader-input p { margin: 0; padding: 0; color: #90a0bc; margin-bottom: 12px; } /* dragging state */ .fileuploader-theme-dragdrop .fileuploader-input .fileuploader-input-inner > * { -webkit-transition: 500ms cubic-bezier(0.17, 0.67, 0, 1.01); transition: 500ms cubic-bezier(0.17, 0.67, 0, 1.01); } .fileuploader-theme-dragdrop .fileuploader-input.fileuploader-dragging .fileuploader-input-inner > * { transform: translateY(18px); opacity: 0; } .fileuploader-theme-dragdrop .fileuploader-input.fileuploader-dragging .fileuploader-icon-main { transform: translateY(30px) scale(1.2); opacity: 0.6; } .fileuploader-theme-dragdrop .fileuploader-input.fileuploader-dragging .fileuploader-input-caption { transform: translateY(30px); opacity: 0.6; } /* drop in theme */ .fileuploader-theme-dropin .fileuploader-input { margin: -16px; padding: 16px; border: 0; } .fileuploader-theme-dropin .fileuploader-input.fileuploader-dragging { background: #f3f5fa; border-radius: 6px; } .fileuploader-theme-dropin .fileuploader-input-inner { width: 100%; text-align: center; padding: 16px; color: #5b5b7b; } .fileuploader-theme-dropin .fileuploader-input-inner span { display: inline-block; text-decoration: underline; } .fileuploader-theme-dropin .fileuploader-input-inner span:hover { color: #4a4a64; } /* box after theme */ .fileuploader-theme-boxafter { padding-top: 0.1px; } .fileuploader-theme-boxafter .fileuploader-input { display: block; margin-top: 48px; padding: 28px 0; background: rgba(120, 155, 236, 0.06); border: 2px dashed #d5dee8; border-radius: 14px; text-align: center; color: #bbc2d4; transition: all 0.2s ease; } .fileuploader-theme-boxafter .fileuploader-input h3 { margin: 0; font-size: 16px; font-weight: 400; } .fileuploader-theme-boxafter .fileuploader-input h3 a { color: #789bec; text-decoration: none; font-weight: 700; } .fileuploader-theme-boxafter .fileuploader-input-button { position: absolute; top: -24px; right: 12px; width: 48px; height: 48px; padding: 0; font-size: 22px; font-weight: 400; line-height: 48px; border-radius: 50%; box-shadow: 0 4px 12px rgba(0,0,0,.15); } .fileuploader-theme-boxafter .fileuploader-input.fileuploader-dragging { transform: scale(1.03); background: rgba(120, 155, 236, 0.1); } /* list */ .fileuploader-theme-boxafter .fileuploader-items { margin-top: -1px; } .fileuploader-theme-boxafter .fileuploader-items .fileuploader-item .fileuploader-progressbar { flex: 0; bottom: -6px; margin-left: 52px; width: calc(100% - 52px); background: rgba(0,0,0,0.06); } /* input & items size */ .fileuploader-theme-thumbnails .fileuploader-thumbnails-input, .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item { position: relative; display: inline-block; margin: 16px 0 0 16px; padding: 0; vertical-align: top; width: 25%; width: calc(25% - 16px); padding-top: 20%; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner, .fileuploader-theme-thumbnails .fileuploader-item-inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 6px; } /* input */ .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner { background: #e6ebf4; border: 2px dashed #92a7bf; text-align: center; font-size: 30px; color: #90a0bc; cursor: pointer; opacity: 0.5; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner:hover { opacity: 1; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner:active, .fileuploader-theme-thumbnails .fileuploader-dragging .fileuploader-thumbnails-input-inner { background: #f6f6fb; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner i { position: absolute; font-style: normal; left: 0; top: 0; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } /* thumbnails theme */ .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-items-list { margin: -16px 0 0 -16px; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item { border-bottom: 0; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item:last-child { margin-bottom: 0; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item-inner { background: rgba(0, 0, 0, 0.02); overflow: hidden; z-index: 1; } .fileuploader-theme-thumbnails .fileuploader-item-inner .thumbnail-holder, .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item-image { width: 100%; height: 100%; } .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item-image { position: relative; text-align: center; overflow: hidden; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item .fileuploader-item-icon i { display: none; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item .fileuploader-action-popup { border-radius: 6px; z-index: 1; } .fileuploader-theme-thumbnails .fileuploader-item .type-holder { position: absolute; top: 6px; left: 6px; padding: 4px 6px; background: rgba(0, 0, 0, 0.4); text-transform: uppercase; color: #fff; font-size: 12px; border-radius: 4px; z-index: 2; } .fileuploader-theme-thumbnails .fileuploader-item .actions-holder { position: absolute; top: 6px; right: 6px; z-index: 2; height: 20px; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item .fileuploader-action { color: #fff; text-shadow: 1px 1px 3px rgba(0,0,0,0.3); } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item .fileuploader-action + .fileuploader-action { margin-left: 8px; } .fileuploader-theme-thumbnails .fileuploader-item .content-holder { position: absolute; bottom: 0; left: 0; width: 100%; padding: 6px; text-shadow: 1px 1px 3px rgba(0,0,0,0.3); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); z-index: 2; } .fileuploader-theme-thumbnails .fileuploader-item .content-holder h5 { display: block; margin: 0; padding: 0; font-size: 14px; font-weight: normal; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .fileuploader-theme-thumbnails .fileuploader-item .content-holder span { display: block; font-size: 11px; color: rgba(255, 255, 255, 0.8); } /* uploading */ .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item.upload-failed .fileuploader-item-inner { background: #db6868; } .fileuploader-theme-thumbnails .fileuploader-item .progress-holder { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; display: none; z-index: 1; } .fileuploader-theme-thumbnails .fileuploader-item .progress-holder .fileuploader-progressbar { position: relative; top: 50%; width: 80%; height: 6px; margin: 0 auto; margin-top: -6px; background: #dde4f6; } /* sorter */ .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item.sorting { padding-top: 0; margin: 0; } .fileuploader-theme-thumbnails .fileuploader-sorter-placeholder { background: #f0f3f9; border-radius: 6px; } /* responsive */ @media all and (max-width: 768px) { .fileuploader-theme-thumbnails .fileuploader-thumbnails-input, .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item { width: 33.33333333%; width: calc(33.33333333% - 16px); padding-top: 30%; } } @media all and (max-width: 480px) { .fileuploader-theme-thumbnails .fileuploader-thumbnails-input, .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item { width: 50%; width: calc(50% - 16px); padding-top: 40%; } } /* Stack style settings, for all themes */ .fileuploader { background: rgba(248, 251, 253, 1.00); } .fileuploader-input .fileuploader-input-caption, .fileuploader-theme-dragdrop .fileuploader-input, .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner { border-color: rgba(76, 76, 76, 1.00); } .fileuploader-input .fileuploader-input-caption { overflow: visible; } .fileuploader-input h3, .fileuploader-input .fileuploader-input-caption { color: rgba(76, 76, 76, 1.00); } .fileuploader-input button.fileuploader-input-button { background: rgba(150, 192, 61, 1.00); color: rgba(255, 255, 255, 1.00); font-weight: normal; font-size: 14px; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; background-image: none; border: 1px solid transparent; border-radius: 4px; } .fileuploader-input button.fileuploader-input-button:hover { background: rgba(44, 63, 76, 1.00); color: rgba(255, 255, 255, 1.00); } /* */ /* */