@import 'partials/base'

#form_options_container, #live_preview_container, #custom_export_container
  background: #fff
  margin-top: 20px
  padding: 10px 20px
  +rect-radius()

#custom_export_container
  display: none

p#general_slider + p
  display: none

#form_options_container
  position: relative
  margin-top: 15px

#form_options_container > fieldset
  float: left
  width: 100%
  &:first-child
    visibility: visible
  &:not(:first-child)
    position: absolute
    visibility: hidden

label.label-radio + label.label-radio
  margin-left: 20px

label + input, label + select
  margin-left: 10px

p.hint_text
  float: left
  @media screen and (max-width: 900px)
    float: none  
  & + p.hint_text
    margin-left: 10px
    @media screen and (max-width: 900px)
      margin-left: 0

h3 + p.hint_text, h3 + p.hint_text + p.hint_text
  margin-top: 0px

fieldset
  p + h3
    margin-top: 30px


fieldset.slider_styles_container
  & > h3
    margin-bottom: 0
  & > fieldset.column_presentation
    float: left
    width: 50%
    @media screen and (max-width: 900px)
      float: none
      width: 100%

h2 + h3
  margin-top: 20px  

.number_input
  width: 65px

.color_input
  width: 80px

#slidercaptcha
  margin-top: 30px

.units
  color: #888

label + div.wp-picker-container, label + div.select2-container
  vertical-align: middle
  margin-left: 5px

#custom_export_container
  
  a
    text-decoration: none
    outline: 0

  span
    padding: 5px 10px
    +rect-radius()

    &.active
      background: #ccc
      & > a:hover
        cursor: default

#code_generator
  display: block
  width: auto
  min-width: 70%
  height: 100px
  margin-bottom: 10px

@media screen and (max-width: 782px)
  input, textarea
    font-size: 13px
  #code_generator
    min-width: 100%