.Styletto {
    background-color : #FFF;
    width : 100%;
    height: 45px;
    display : block;
    padding-left : 10px;
    padding-right : 10px;
    overflow : hidden;
}
.Styletto.label {
  background-color: transparent;
  padding-left: 0px;
  padding-right: 0px;
  line-height: 45px;
}


.Styletto > input::-webkit-input-placeholder { color: inherit; opacity : 0.8 }
.Styletto > input:-ms-input-placeholder  { color: inherit; opacity : 0.8 }
.Styletto > input::-moz-placeholder  { color: inherit; opacity : 0.8 }
.Styletto > input:-moz-placeholder  { color: inherit; opacity : 0.8 }

.Styletto.topMargin {
    margin-top: 20px;
}

.Styletto.shadowed {
   -webkit-box-shadow : 0px 1px 1px rgba(0,0,0,0.2);
           box-shadow : 0px 1px 1px rgba(0,0,0,0.2)   
}

.Styletto.fullRounded {
   border-radius : 100px;
}

.Styletto.halfRounded {
   border-radius : 10px;
}

.Styletto.rounded {
   border-radius : 3px;
}

.Styletto.center {
  margin: 0 auto;
}

.Styletto.xsmall {
   height : 20px !important;
}

.Styletto.small {
   height : 30px !important;
}

.Styletto.medium {
   height : 45px !important;
}

.Styletto.large {
   height : 55px !important;
}

.Styletto.xlarge {
   height : 60px !important;
}
.Styletto.button.xsmall, .Styletto.label.xsmall  {
   line-height : 20px !important;
}

.Styletto.button.small, .Styletto.label.small {
   line-height : 30px !important;
}

.Styletto.button.medium, .Styletto.label.medium {
   line-height : 45px !important;
}

.Styletto.button.large, .Styletto.label.large {
   line-height : 55px !important;
}

.Styletto.button.xlarge, .Styletto.label.xlarge {
   line-height : 60px !important;
}


.Styletto.iconed {
   padding-left : 0px
}

.Styletto.iconed > i{
    width : 30px;
    margin-left : 10px;
    margin-right : 10px;
    text-align : center;
}

.Styletto.iconed > input{
   width : calc(100% - 50px);
}

.Styletto > input {
    margin: initial !important;
    padding: initial;
    background-color : none !important;
    -webkit-box-shadow : none !important;
            box-shadow : none !important;
    border : none !important;
    outline : none !important;
}

.Styletto.alpha25 {
    opacity : .25;
}
.Styletto.alpha50 {
    opacity : .50;
}
.Styletto.alpha75 {
    opacity : .75;
}

button.Styletto, .Styletto.button  {
    border : 0px;
    text-align: center;
}

.Styletto.dark {
    background-color : #000;
    color : white
}

.Styletto.bordered {
   border : 2px solid;
}

.Styletto.notBackground {
    background-color : rgba(0,0,0,0.0) !important;
}


.Styletto.textWhite {
    color : #ffffff !important;
}
.Styletto.textGrey {
    color : #CCC !important;
}
.Styletto.textDarkGrey {
    color : #5f5f5f !important;
}
.Styletto.textBlack {
    color : #000000 !important;
}

.Styletto > input {
    width : 100%;
    height : 100%;
    display : inline-block;
}

.Styletto.leftBorder {
    border-left : 0px solid;
}

.Styletto.rightBorder {
    border-right : 0px solid;
}
.Styletto.bottomBorder {
    border-bottom : 0px solid;
}
.Styletto.topBorder {
    border-top : 0px solid;
}

.Styletto.borderThin {
    border-width : 1px !important;
}

.Styletto.borderLight {
    border-width : 2px !important;
}

.Styletto.borderBold {
    border-width : 3px !important;
}

.Styletto.borderBolder {
    border-width : 4px !important;
}

.Styletto.borderAlphaDot1 {
  border-color: rgba(255, 255, 255, 0.1);
}

.Styletto.notRoundBottom {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.Styletto.notRoundTop {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.Styletto.notRoundLeft {
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
}

.Styletto.notRoundRight {
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
}

.Styletto > input  {
    font-size : 1em !important
}

.Styletto.xsmallText  {
    font-size : 0.4em !important
}

.Styletto.smallText {
    font-size : 0.6em !important
}

.Styletto.mediumText {
    font-size : 0.8em !important
}

.Styletto, .Styletto.largeText {
    font-size : 1em !important
}

.Styletto.xlargeText {
    font-size : 1.2em !important
}

.Styletto.bold {
    font-weight : bold;
}

.Styletto.light {
    font-weight : lighter;
}

.Styletto.toUpper {
    text-transform : uppercase;
}

.Styletto.toCap {
    text-transform : capitalize;
}

.Styletto.toLow {
    text-transform : lowercase;
}


.Styletto.bold > input {
    font-weight : bold;
}

.Styletto.light > input{
    font-weight : lighter;
}

.Styletto.toUpper > input{
    text-transform : uppercase;
}

.Styletto.toCap > input{
    text-transform : capitalize;
}

.Styletto.toLow > input{
    text-transform : lowercase;
}

.Styletto.separatedLetters-XSM {
    letter-spacing : 1px
}

.Styletto.separatedLetters-SM {
    letter-spacing : 2px
}

.Styletto.separatedLetters-MD {
    letter-spacing : 3px
}

.Styletto.separatedLetters-LG {
    letter-spacing : 4px
}

.Styletto.separatedLetters-XLG {
    letter-spacing : 5px
}

.Styletto.separatedLetters-XSM > input {
    letter-spacing : 1px
}

.Styletto.separatedLetters-SM > input {
    letter-spacing : 2px
}

.Styletto.separatedLetters-MD > input {
    letter-spacing : 3px
}

.Styletto.separatedLetters-LG > input {
    letter-spacing : 4px
}

.Styletto.separatedLetters-XLG > input {
    letter-spacing : 5px
}


.Styletto.textAlignRight {
   text-align : right
}

.Styletto.textAlignCenter {
   text-align : center;
}

.Styletto.textAlignLeft {
   text-align : left;
}

.Styletto.textAlignJustify {
   text-align : justify;
}


.Styletto.textAlignRight > input {
   text-align : right
}

.Styletto.textAlignCenter > input{
   text-align : center;
}

.Styletto.textAlignLeft > input{
   text-align : left;
}

.Styletto.textAlignJustify > input{
   text-align : justify;
}
