.mainButton, .headerButton {opacity: 0.6; background-repeat: no-repeat; background-size: contain} .mainButton:hover, .headerButton:hover, .selected {opacity: 1; cursor: pointer} .active {opacity: 1} /** FORMSHIFTER */ #gui-element-bottom-panel .formshifterButton {background-position: center; max-height: 50px; margin-bottom: 45px;} #gui-element-bottom-panel .formshifterButton .BtnText {padding-top: 60px!important;} #gui-element-bottom-panel #BtnFormshiftRingCylinder {background-image: url('../../../images/create/formshifter/torus.svg');} #gui-element-bottom-panel #BtnFormshiftRingCylinder.cylinder {background-image: url('../../../images/create/formshifter/cylinder.svg');} #gui-element-bottom-panel #BtnFormshiftSides {background-image: url('../../../images/create/formshifter/sides.png');} #gui-element-bottom-panel #BtnFormshiftHeight {background-image: url('../../../images/create/formshifter/height.png');} #gui-element-bottom-panel #BtnFormshiftBaseRadius {background-image: url('../../../images/create/formshifter/base_radius.png');} #gui-element-bottom-panel #BtnFormshiftTopRadius {background-image: url('../../../images/create/formshifter/top_radius.png');} #gui-element-bottom-panel #BtnFormshiftTwist {background-image: url('../../../images/create/formshifter/twist.png');} #gui-element-bottom-panel #BtnInnerRadius {background-image: url('../../../images/create/formshifter/inner_radius.png');} #gui-element-bottom-panel #BtnOuterRadius {background-image: url('../../../images/create/formshifter/outer_radius.png');} #gui-element-bottom-panel #BtnFormshiftAspectRatio {background-image: url('../../../images/create/formshifter/aspect_ratio.png');} #gui-element-bottom-panel #BtnFormshiftWaveX {background-image: url('../../../images/create/formshifter/wave_x.png');} #gui-element-bottom-panel #BtnFormshiftWaveY {background-image: url('../../../images/create/formshifter/wave_y.png');} #gui-element-bottom-panel #BtnFormshiftWaveZ {background-image: url('../../../images/create/formshifter/wave_z.png');} #gui-element-bottom-panel #BtnFormshiftWallThickness {background-image: url('../../../images/create/formshifter/wall_thickness.png');} #gui-element-bottom-panel #BtnFormshiftOpenClose.open {background-image: url('../../../images/create/formshifter/close-1.svg');} #gui-element-bottom-panel #BtnFormshiftOpenClose {background-image: url('../../../images/create/formshifter/open.svg');} #gui-element-bottom-panel #BtnFormshiftReset {background-image: url('../../../images/create/formshifter/reset.png');} #gui-element-bottom-panel .thirteen-element:first-child {margin-right: 4%} #gui-element-bottom-panel .thirteen-element .BtnText {padding-top: 110%} #gui-element-bottom-panel .formshift-panel .parametricSlider {width: 15%; margin-right: 2%} #gui-element-bottom-panel .formshift-panel #defaultSlider {display: flex; justify-content: center; margin-bottom: 5px} #gui-element-bottom-panel .formshift-panel .sliderContainer { height: 2em; border-radius: 1em; border: .1em solid #dddddd; margin-bottom: 5px; position: relative; text-align: center; line-height: 1.9em; background-color: rgba(255,255,255,0.5); text-shadow: -1px 0 rgba(255,255,255,0.5), 0 1px rgba(255,255,255,0.5), 1px 0 rgba(255,255,255,0.5), 0 -1px rgba(255,255,255,0.5); } #gui-element-bottom-panel .formshift-panel .defaultSliderScript { margin-top: 0; width: calc(100% - 1.7em); background: initial; top: 0 !important; border: 0 !important; position: absolute; } #gui-element-bottom-panel .formshift-panel .defaultSliderScript span { top: 0 !important; border-radius: .9em !important; opacity: 0.5; background: rgb(0, 0, 0) !important; height: 1.7em !important; width: 1.7em !important; margin: 0 !important; } #gui-element-bottom-panel .formshift-panel .defaultSliderScript span:hover { opacity: 0.8; background: rgb(0, 0, 0) !important; } #gui-element-bottom-panel .formshift-panel .default-silider section .slider-element {width: 200px} #gui-element-bottom-panel .formshift-panel .default-silider section .slider-element .slider-title div {padding-top: 0} #gui-element-bottom-panel .slider-element {margin-top: 1%} /** FORMSHIFTER vege */ #BtnRestore { position: relative; height: 40px; } #BtnRestore .BtnText { position: absolute; left: -18%; } /*#BtnMouseBoolean{background-image: url('../../../images/create/mouse_navigation_horizontal_boolean.svg');}*/ #BtnMousePan{background-image: url('../../../images/create/mouse_pan.svg');} #BtnMouseRotate{background-image: url('../../../images/create/mouse_rotate.svg');} #BtnMouseZoom{background-image: url('../../../images/create/mouse_zoom.svg');} #BtnHamburger{background-image: url('../../../images/create/hamburger.svg');} #BtnFloppy{background-image: url('../../../images/create/floppy.svg');} #BtnFullScreen{background-image: url('../../../images/create/zoom.svg');} #BtnStereo3D{background-image: url('../../../images/create/Stereo_3D.svg');} #BtnMark{background-image: url('../../../images/create/pipa2.svg');} #BtnRestart{background-image: url('../../../images/create/vivo/restore.svg');} #BtnResetScene{background-image: url('../../../images/create/reposition.svg');} #BtnUndo{background-image: url('../../../images/create/Undo.svg');} #BtnRedo{background-image: url('../../../images/create/Redo.svg');} #BtnMirror, .BtnMirror{background-image: url('/images/create/mirrorButtonOff.svg');} #BtnMirror.selected, .BtnMirror.selected{background-image: url('/images/create/mirrorButtonOn.svg');} #BtnSculptRotate{background-image: url('../../../images/create/rotateButton.svg');} #BtnExport {background-image: url('../../../images/create/Export.svg');} #BtnImport {background-image: url('../../../images/create/Import.svg'); transform: inherit !important;} #BtnSave {background-image: url('../../../images/create/Upload.svg');} #BtnPrint{background-image: url('../../../images/create/3dprint.svg');} #BtnShare{background-image: url('../../../images/create/share.svg');} #BtnEngraveTouch{background-image: url('../../../images/create/Stamp1.svg');} /*#BtnSculpt{background-image: url('../../../images/create/sculpt_main_tool_bw.svg');}*/ #BtnSculpt{background-image: url('../../../images/create/sculpt_square.svg');} /*#BtnPaint{background-image: url('../../../images/create/colorize_icon.svg');}*/ #BtnPaint{background-image: url('../../../images/create/paint_square.svg');} /*#BtnFullColor{background-image: url('../../../images/create/colorize_icon.svg');}*/ #BtnFullColor{background-image: url('../../../images/create/colorize_square.svg');} /*#BtnPattern{background-image: url('../../../images/create/Pattern.svg');}*/ #BtnPattern{background-image: url('../../../images/create/pattern_square.svg');} #BtnPatternEngraveEmboss{background-image: url('../../../images/create/pattern_square.svg');} #BtnPatternCutThrough{background-image: url('../../../images/create/pattern_square.svg');} #BtnPatternStamp{background-image: url('../../../images/create/pattern_square.svg');} /*#BtnPicturePattern{background-image: url('../../../images/create/Picture.svg');}*/ #BtnPicturePattern{background-image: url('../../../images/create/picture_square.svg');} /* IDE KELL A boolean MODE IKON - poz */ #BtnBoolean{background-image: url('../../../images/create/booleanModeButton.svg'); background-size: contain;} #BtnObjSphere{background-image: url('../../../images/create/booleanSphereButton.svg'); background-size: contain;} #BtnObjCube{background-image: url('../../../images/create/booleanCubeButton.svg'); background-size: contain;} #BtnObjCylinder{background-image: url('../../../images/create/booleanCylinderButton.svg'); background-size: contain;} #BtnObjCone{background-image: url('../../../images/create/booleanConeButton.svg'); background-size: contain;} #BtnObjFlatCube{background-image: url('../../../images/create/booleanFlatcubeButton.svg'); background-size: contain;} #BtnObjFlatCylinder{background-image: url('../../../images/create/booleanFlatcylinderButton.svg'); background-size: contain;} #BtnBooleanObjImport{background-image: url('../../../images/create/importButton.svg'); background-size: contain;} #BtnMerge{background-image: url('../../../images/create/acceptUnionButton.svg'); background-size: contain;} #BtnSubstract{background-image: url('../../../images/create/acceptDifferenceButton.svg'); background-size: contain;} #BtnIntersect{background-image: url('../../../images/create/acceptIntersectButton.svg'); background-size: contain;} #BtnBooleanColorPicker{background-image: url('../../../images/create/colorPickerButton.svg'); background-size: contain;} #BtnScaleObject{background-image: url('../../../images/create/scale_square.svg'); background-size: contain;} #BtnRotateObject{background-image: url('../../../images/create/rotate_square.svg'); background-size: contain;} #BtnMoveObject{background-image: url('../../../images/create/move_square.svg'); background-size: contain;} #BtnPicturePatternEngraveEmboss{background-image: url('../../../images/create/picture_square.svg');} #BtnPicturePatternStamp{background-image: url('../../../images/create/picture_square.svg');} /*#BtnText{background-image: url('../../../images/create/Text.svg');}*/ #BtnText{background-image: url('../../../images/create/text_square.svg');} #BtnTextEngraveEmboss{background-image: url('../../../images/create/text_square.svg');} #BtnTextCutThrough{background-image: url('../../../images/create/text_square.svg');} #BtnTextStamp{background-image: url('../../../images/create/text_square.svg');} /*#BtnFormShifter{background-image: url('../../../images/create/Formshifter.svg');}*/ #BtnFormShifter{background-image: url('../../../images/create/formshifter_square.svg');} #BtnAddObject{background-image: url('../../../images/create/formshifter_square.svg');} #BtnAddObject2To3{background-image: url('../../../images/create/formshifter_square.svg');} #BtnAddObjectText{background-image: url('../../../images/create/formshifter_square.svg');} #BtnAddObjectModels{background-image: url('../../../images/create/formshifter_square.svg');} #BtnMaterial{background-image: url('../../../images/create/material_square.svg'); background-size: contain;} #BtnScale{background-image: url('../../../images/create/scale_square.svg'); background-size: contain;} #BtnEscape{background-image: url('../../../images/create/escape.svg');} #BtnTextBoolean{background-image: url('../../../images/create/No_color.svg');} #BtnAddObject2To3 .BtnText, #BtnAddObjectText .BtnText, #BtnAddObjectModels .BtnText { width: 60px; text-align: left; } #BtnToggleBoundingBox{background-image: url('../../../images/create/scaleButton.svg');} #BtnToggleFixedPlaneRot{background-image: url('../../../images/create/net_icon.svg');} .sculptbutton, .BtnMirror, #BtnMirror{background-size: contain;} #BtnSculptPull{background-image: url('../../../images/create/pullButton.svg');} #BtnSculptPush{background-image: url('../../../images/create/pushButton.svg');} #BtnSculptErase{background-image: url('../../../images/create/eraseButton.svg');} #BtnSculptSmooth{background-image: url('../../../images/create/smoothButton.svg');} #BtnSculptFlatten{background-image: url('../../../images/create/flattenButton.svg');} #BtnSculptEdge{background-image: url('../../../images/create/edgeButton.svg');} #BtnSculptSculpt{background-image: url('../../../images/create/sculptButton.svg');} #BtnNetgen{background-image: url('../../../images/create/net_icon.svg');} /*#BtnNetgenDeform{background-image: url('../../../images/create/.svg');}*/ #BtnColorize{background-image: url('../../../images/create/colorize_icon.svg');} #BtnSurface{background-image: url('../../../images/create/surface_icon.svg');} #BtnSurface1{background-image: url('../../../images/create/surfacebuttons/nosurface_icon.png');} #BtnSurface2{background-image: url('../../../images/create/surfacebuttons/canvas_icon.png');} #BtnSurface3{background-image: url('../../../images/create/surfacebuttons/cast_icon.png');} #BtnSurface4{background-image: url('../../../images/create/surfacebuttons/grass_icon.png');} #BtnSurface5{background-image: url('../../../images/create/surfacebuttons/leather_icon.png');} #BtnSurface6{background-image: url('../../../images/create/surfacebuttons/pitted_icon.png');} .surfacebutton{background-size: contain;} #mat0{background-image: url('../../../images/create/1_icon.svg');background-size: contain;background-repeat: no-repeat;} #mat1{background-image: url('../../../images/create/2_icon.svg');background-size: contain;background-repeat: no-repeat;} .BtnText{ font-family: MuseoSans-100; text-align: center; padding-top: 100%; font-size: 16px; } .formshifterText, .deformText, .defaultSliderText{text-align: right;} .formshifterSlider, .deformSlider, .defaultSlider{width: 100%; border: 1px solid #9f9f9f !important; margin-top: 2%;} #hueSlider, #hueSliderHelper{ line-height: 25px; background: -webkit-linear-gradient(left, hsl(0, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(180, 100%, 50%), hsl(240, 100%, 50%), hsl(300, 100%, 50%), hsl(360, 100%, 50%)) !important; /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(left, hsl(0, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(180, 100%, 50%), hsl(240, 100%, 50%), hsl(300, 100%, 50%), hsl(360, 100%, 50%)) !important; /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(left, hsl(0, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(180, 100%, 50%), hsl(240, 100%, 50%), hsl(300, 100%, 50%), hsl(360, 100%, 50%)) !important; /* For Firefox 3.6 to 15 */ background: linear-gradient(left, hsl(0, 100%, 50%), hsl(60, 100%, 50%), hsl(120, 100%, 50%), hsl(180, 100%, 50%), hsl(240, 100%, 50%), hsl(300, 100%, 50%), hsl(360, 100%, 50%)) !important; /* Standard syntax */ } #saturationSlider, #saturationSliderHelper{ line-height: 25px; background: -webkit-linear-gradient(left, hsl(0, 0%, 100%), hsl(0, 100%, 50%)); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(left, hsl(0, 0%, 100%), hsl(0, 100%, 50%)); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(left, hsl(0, 0%, 100%), hsl(0, 100%, 50%)); /* For Firefox 3.6 to 15 */ background: linear-gradient(left, hsl(0, 0%, 100%), hsl(0, 100%, 50%)); /* Standard syntax */ } #brightnessSlider, #brightnessSliderHelper{ line-height: 25px; background: -webkit-linear-gradient(left, hsl(0, 100%, 0%), hsl(0, 100%, 50%)); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(left, hsl(0, 100%, 0%), hsl(0, 100%, 50%)); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(left, hsl(0, 100%, 0%), hsl(0, 100%, 50%)); /* For Firefox 3.6 to 15 */ background: linear-gradient(left, hsl(0, 100%, 0%), hsl(0, 100%, 50%)); /* Standard syntax */ } #BtnColorPicker {background-image: url("../../../images/create/colorPickerButton.svg");} #BtnNoColor{background-image: url("../../../images/create/No_color.svg");} #BtnBlackWhiteColor{background-image: url("../../../images/create/No_color.svg");} #BtnPictureColor{background-image: url("../../../images/create/Picture_color.svg");} .pictureSizeText{top: 41% !important} .pictureEngraveEmbossText{top: 46% !important} .pictureSizeSlider{top: 40% !important} .pictureEngraveEmbossSlider{top: 45% !important} .paintSizeText{top: 50% !important} .paintStrengthText{top: 55% !important} .paintSizeSlider{top: 49% !important} .paintStrengthSlider{top: 54% !important} .sculptSizeText{top: 48% !important} .sculptStrengthText{top: 53% !important} .sculptSizeSlider{top: 47% !important} .sculptStrengthSlider{top: 52% !important} .colorbutton { /*background-image: url("../../../images/create/Color_background.svg");*/ background-size: 100%; border-radius: 150%; border-style: solid; border-color: rgba(0,0,0,0); border-width: 3px; z-index: 2; } .fullcolorbutton{ /*background-image: url("../../../images/create/Color_background.svg");*/ background-size: 100%; border-radius: 50%; border-style: solid; border-color: rgba(0,0,0,0); border-width: 3px; z-index: 2; } .colorbutton.selected{ border-color: black; border-width:3px; } .colorbutton.disabled{ opacity: 0; display: none } .colorbutton.darkbutton.selected{ border: solid 3px black; padding: 2px; background-clip: content-box; background-color: white; } .patternbutton{ background-size: 100%; -webkit-filter: invert(100%); filter: invert(100%); border-radius: 50%; boredr-width: 0; background-position: 50%; background-color: white; } #BtnFacebook{background-image: url('../../../images/create/facebook.svg');} #BtnTwitter{background-image: url('../../../images/create/twitter.svg');} #BtnGooglePlus{background-image: url('../../../images/create/google_plus.svg');} #BtnPinterest{background-image: url('../../../images/create/pinterest.svg');} #TextInputFrame{ overflow: hidden; -moz-user-select: all; -webkit-user-select: all; -ms-user-select:all; user-select:all; -o-user-select:all; } #TextInputFrame .inner { background-color: rgb(159,212,250); border-radius: 50px; height: 50px; } #TextInputFrame.hidden{ width: 0%; opacity: 0; } #TextInputBox{ width: 95%; height: 100%; border:0; font-family: Anton; font-weight: bold; text-align: center; outline: 0; background-color: rgba(159,212,250,0); font-size: 2.2vw; line-height: 2.3vw; } #TextInputBox::-webkit-input-placeholder { /* WebKit browsers */ color: black; opacity: 0.3; font-size: 2.2vw; line-height: 2.3vw; } #TextInputBox:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: black; opacity: 0.3; font-size: 2.2vw; line-height: 2.3vw; } #TextInputBox::-moz-placeholder { /* Mozilla Firefox 19+ */ color: black; opacity: 0.3; font-size: 2.3vw; } #TextInputBox:-ms-input-placeholder { /* Internet Explorer 10+ */ color: black; opacity: 0.3; font-size: 2.2vw; line-height: 2.3vw; } .col-xs-1 { position: relative; min-height: 1px; padding-left: 1px; padding-right: 1px; } .col-xs-2 { position: relative; min-height: 1px; padding-left: 10px; padding-right: 10px; } /* vivo help text with arrow */ .vivo_help_arrow_box { text-align: center; padding: 5px; margin-bottom: 5%; background-color: #b7e0ff; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; margin-left: 5%; margin-right: 5%; margin-top: 2%; } .fontbutton, .patternButtonHolder { -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } #left-gui-elements {height: 100%; display: table;} #left-gui-elements .main {display: table-cell; vertical-align: middle;} #left-gui-elements .main #BtnToggleBoundingBox, #left-gui-elements .main #BtnToggleFixedPlaneRot, #left-gui-elements .main #BtnSculpt, #left-gui-elements .main #BtnFormShifter, #left-gui-elements .main #BtnPattern, #left-gui-elements .main #BtnPaint, #left-gui-elements .main #BtnFullColor, #left-gui-elements .main #BtnText, #left-gui-elements .main #BtnPicturePattern {height: 50px; margin: 10px;} #left-gui-elements .main #BtnToggleBoundingBox .BtnText, #left-gui-elements .main #BtnToggleFixedPlaneRot .BtnText, #left-gui-elements .main #BtnSculpt .BtnText, #left-gui-elements .main #BtnFormShifter .BtnText, #left-gui-elements .main #BtnPattern .BtnText, #left-gui-elements .main #BtnPaint .BtnText, #left-gui-elements .main #BtnFullColor .BtnText, #left-gui-elements .main #BtnText .BtnText, #left-gui-elements .main #BtnPicturePattern .BtnText {padding-top: 15px; padding-left: 54px; text-align: left;} #html-gui-right-elements .sliderContainer { height: 2em; border-radius: 1em; border: .1em solid #dddddd; margin-bottom: 5px; position: relative; text-align: center; line-height: 1.9em; } #html-gui-right-elements .defaultSliderScript { margin-top: 0; width: calc(100% - 1.7em); background: initial; top: 0 !important; border: 0 !important; position: absolute; } #html-gui-right-elements .defaultSliderScript span { top: 0 !important; border-radius: .9em !important; opacity: 0.5; background: rgb(0, 0, 0) !important; margin-left: 0px; height: 1.7em !important; width: 1.7em !important; margin: 0 !important; } #html-gui-right-elements .defaultSliderScript span:hover { opacity: 0.8; background: rgb(0, 0, 0) !important; } #html-gui-right-elements {height: 100%; display: table;} #html-gui-right-elements .default-silider {display: table-cell; vertical-align: middle;} #html-gui-right-elements .default-silider section .slider-element {width: 200px;} #html-gui-right-elements .default-silider section .slider-element .slider-title div {padding-top: 0} .ringCylinderButton img {opacity: .6; cursor: pointer;} .ringCylinderButton img:hover {opacity: 1;} .leo-highlight { color: black; }