/* strict width */
/* headings */
body{margin: 0; padding: 0; left: 0; font-size: 13px;}
body *{font-family: Arial;}
h1,h2,h3,h4,h5,h6{ margin: 0px; color:inherit; line-height: 120%;}
h1,h2,h3{ font-family:'OpenSansLight'; font-weight: normal;}
h4,h5,h6{ font-family: Arial;}
h1.title{font-size: 40px; letter-spacing: -1px;}
h1{font-size: 30px;}h2{font-size: 20px;}h3{font-size: 15px;}
h4{font-size: 13px;}h5{font-size: 11px;}h6{font-size: 9px; line-height: 130%;}
a{text-decoration: none; cursor: pointer; font-family: inherit;}
a,p{color:inherit; font-weight: normal;} a:hover{ color:inherit; text-decoration: underline;}
a[role="link"]:hover,a[role="menuitem"]:hover{text-decoration: none;}
*[role="action"]:hover{cursor: pointer;}
*[role="drag"]:hover,.drag-true{cursor: move;}
.drag-false{cursor: pointer;}
a img{border: none;}
b,strong{font-weight: bold;}
i{font-style: italic;}
hr{border: none; border-top: 1px solid;}
.responsive{width:100%;}
.wordwrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}
/* form */
*:focus{outline-width: 0px}
input:not([type=button]),input:not([type=submit]),input:not([type=file]),select,textarea{
    box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
    border: 1px solid #666666;
}
input[type=checkbox]{bottom: -3px; position: relative;}
form input.ng-dirty.ng-invalid{border-color: #FF7F00; color: #FF7F00;}
form input.ng-dirty.ng-valid{border-color: #00B285; color: #00B285;}
form .icon.ng-valid{color: #00B285;}form .icon.ng-invalid{color: #FF7F00;}
.input-xs{padding: 1px; font-size: 9px;}
.input-s,.button-s{padding: 3px 5px; font-size: 11px;}
.input-m{padding: 5px 15px; font-size: 13px;}
button,input[type=button],input[type=submit]{border: 1px solid; padding: 5px 15px; cursor: pointer;}
.button-l,.input-l{border: 1px solid; padding: 10px 30px;}
.button-xl,.input-xl{border: 2px solid; padding: 15px 80px;}
*[disabled=disabled]{opacity: 0.5;}
/* input iconic */
.input-icon-right{position: relative;}
.input-icon-right>input{padding-right: 30px;}
.input-icon-right-m>.icon{position: absolute; right: 10px; top: 7px; font-size: 15px;}
.input-icon-right-l>.icon{position: absolute; right: 10px; top: 10px; font-size: 15px;}
/* table */
td,th{padding: 10px 5px; vertical-align: middle;}
th{font-size: 15px;}
thead{border-bottom: 1px solid #666666;border-top: 1px solid #666666; background: #F0F0E1;}
tbody tr{border-bottom: 1px dashed #666666;}
/* structure */
header{position: fixed; width: 100vw; top: 0px; z-index:999;}
/* custom structure */
.wrapper{position: relative;}
.top-left{position:absolute; top: 0px; left: 0px;}
.bottom-left{position:absolute; bottom: 0px; left: 0px;}
.top-right{position:absolute; top: 0px; right: 0px;}
.bottom-right{position:absolute; bottom: 0px; right: 0px;}
.fixed-bottom{position: fixed; bottom: 0px; left: 0px; z-index: 990}
.screen-auto{ height: auto;}
.screen-40{-webkit-height: 40vh;-moz-height: 40vh;-ms-height: 40vh;
    -o-height: 40vh;}
.screen-50{-webkit-height: 50vh;-moz-height: 50vh;-ms-height: 50vh;
    -o-height: 50vh;}
.screen-75{-webkit-height: 75vh;-moz-height: 75vh;-ms-height: 75vh;
    -o-height: 75vh;height: 500px;}
.screen-100{-webkit-height: 100vh;-moz-height: 100vh;-ms-height: 100vh;
    -o-height: 100vh;height: 100vh;}
.screen-20{-webkit-min-height: 20vh;-moz-min-height: 20vh;-ms-min-height: 20vh;
    -o-min-height: 20vh;min-height: 200px;}
.box-s{width: 80px; height: 80px; position: relative;}
.box-m{width:150px; height:150px; position: relative;}
.box-l{width:250px; height:250px; position: relative;}
.boxbar-s{height: 80px; width: 250px;  position: relative;}
.box-hor-s{height: 80px;  position: relative;}
.box-hor-m{height: 150px; position: relative;}
.circle-xs{ height: 10px; width: 10px; border-radius: 10px; position: relative;}
.circle-m{height: 100px; width: 100px; border-radius: 100px; position: relative;}
.box-icon-close{position: absolute; top: 5px; right: 5px;}
/* splitter */
.vert-line{width: 1px; background: #fff; height: 35px; position: relative; margin: 0 10px;}

/* object ratio */
.responsive-ratio-1-1,.responsive-ratio-1-2,.responsive-ratio-3-4{height: 0; position: relative;}
.responsive-ratio-1-1>div,.responsive-ratio-1-2>div,.responsive-ratio-3-4>div{width: 100%; position: absolute; top: 0; left: 0; height: 100%;}
.responsive-ratio-1-1{padding-bottom: 100%;  width: 100%;}
.responsive-ratio-1-2{padding-bottom: 200%;  width: 100%;}
.responsive-ratio-2-1{padding-bottom: 50%;  width: 100%;}
.responsive-ratio-3-4{padding-bottom: 133%;  width: 100%;}
.responsive-ratio-4-3{padding-bottom: 75%;  width: 100%;}
.responsive{width: 100%;}

/* add-on padding & margin */
.padded-0px{padding-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;}
.padded-15px{padding:15px;}
.padded-10px{padding:10px;}
.padded-5px{padding:5px;}
.padded-vert-120px{padding-top:120px; padding-bottom:120px;}
.padded-vert-60px{padding-top:60px; padding-bottom:60px;}
.padded-vert-40px{padding-top:40px; padding-bottom:40px;}
.padded-vert-30px{padding-top:30px; padding-bottom:30px;}
.padded-vert-15px{padding-top:15px; padding-bottom:15px;}
.padded-vert-10px{padding-top:10px; padding-bottom:10px;}
.padded-vert-5px{padding-top:5px; padding-bottom:5px;}
.padded-vert-0px{padding-top:0px; padding-bottom:0px;}
.padded-hor-60px{padding-left:60px; padding-right:60px;}
.padded-hor-30px{padding-left:30px; padding-right:30px;}
.padded-hor-15px{padding-left:15px; padding-right:15px;}
.padded-hor-10px{padding-left:10px; padding-right:10px;}
.padded-hor-5px{padding-left:5px; padding-right:5px;}
.padded-bottom-15px{padding-bottom:15px;}

.margin-0px{margin:0px;}
.margin-15px{margin:15px;}
.margin-10px{margin:10px;}
.margin-5px{margin:5px;}
.margin-vert-120px{margin-top:120px; margin-bottom:120px;}
.margin-vert-60px{margin-top:60px; margin-bottom:60px;}
.margin-vert-30px{margin-top:30px; margin-bottom:30px;}
.margin-vert-15px{margin-top:15px; margin-bottom:15px;}
.margin-vert-10px{margin-top:10px; margin-bottom:10px;}
.margin-vert-5px{margin-top:5px; margin-bottom:5px;}
.margin-hor-15px{margin-left:15px; margin-right:15px;}
.margin-hor-10px{margin-left:10px; margin-right:10px;}
.margin-hor-5px{margin-left:5px; margin-right:5px;}
.margin-left-15px{margin-left:15px;}
.margin-left-10px{margin-left:10px;}
.margin-left-5px{margin-left:5px;}
.margin-right-15px{margin-right:15px;}
.margin-right-10px{margin-right:10px;}
.margin-right-5px{margin-right:5px;}
.margin-top-15px{margin-top:15px;}
.margin-top-10px{margin-top:10px;}
.margin-top-5px{margin-top:5px;}
.margin-top-120px{margin-top:120px;}
.margin-top-60px{margin-top:60px;}
.margin-top-30px{margin-top:30px;}
.margin-bottom-15px{margin-bottom:15px;}
.margin-bottom-10px{margin-bottom:10px;}
.margin-bottom-5px{margin-bottom:5px;}
.margin-bottom-120px{margin-bottom:120px;}
.margin-bottom-60px{margin-bottom:60px;}
.margin-bottom-30px{margin-bottom:30px;}

/* positioning */
.hor-right>*,.com-hor-right{float: right !important;}
.text-center{text-align: center;}
.hor-center>*{margin: 0 auto;}
.vert-center>*{
    position: relative; top: 50%;
    transform-style: preserve-3d;
    -webkit-transform : translateY(-50%);
    -moz-transform : translateY(-50%);
    -ms-transform : translateY(-50%);
    -o-transform : translateY(-50%);
    transform: translateY(-50%);
}
.hor-inline>*{ display: inline; float: left;}
.com-inline{display: inline; float: left;}
/* fix icon lining */
.icon{position: relative; bottom: -3px;}
/* animations */
/*.box-fading{-webkit-transition:0.5s ease-out all;-moz-transition:0.5s ease-out all;
    -o-transition:0.5s ease-out all;transition:0.5s ease-out all;}
.box-fading.ng-enter.ng-enter-active,.box-fading.ng-move.ng-move-active,.box-fading.ng-leave,
.box-fading.ng-hide-remove.ng-hide-remove-active,.box-fading.ng-hide-add
    {opacity:1; position: relative; left: 0;}
.box-fading.ng-move,.box-fading.ng-leave.ng-leave-active,
.box-fading.ng-hide-remove,.box-fading.ng-hide-add.ng-hide-add-active
    {opacity:0; position: relative; left: 100%;}*/
/* modal box */
.modal-mask{
  position: fixed; top:0; left: 0; width: 100%; height: 100%;
  background: rgba(255,255,255,0.8); z-index: 9999999998;
}
.modal-box {
  position: fixed;top: 50%;left: 50%;width: 50%; overflow: auto;
  max-width: 550px;min-width: 330px;height: auto; z-index: 99999999999;
  -webkit-transform: translateX(-50%) translateY(-50%);-moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);
  box-shadow: 10px 10px 0 0 rgba(0,32,64,0.9);
}
.modal-alert{
  position: fixed; top: 100px; left: 50%; width: 50%; background: #FFFFFF;
  -webkit-transform: translateX(-50%) translateY(-50%);-moz-transform: translateX(-50%) translateY(-50%);
  box-shadow: 10px 10px 0 0 rgba(0,32,64,0.9); border: 1px solid #002040;
}
/* slider */
.ui-slider.ui-slider-vertical{width: 2px;height: 100px;position: relative;text-align: left; background: #002040;
  border-radius: 2px}
.ui-slider.ui-slider-horizontal{width: 100px;height: 2px;position: relative;text-align: left; background: #002040;
  border-radius: 2px}
.ui-slider-handle{position: absolute;z-index: 2;width: 10px;height: 10px;cursor: pointer;
  -ms-touch-action: none;touch-action: none; background: #FFF; border: 1px solid #002040; border-radius: 10px}
.ui-slider-handle.ui-state-hover,.ui-slider-handle.ui-state-active{border-color:#00B285;}
.ui-slider-vertical .ui-slider-handle{left: -5px;margin-left: 0;margin-bottom: -5px;}
.ui-slider-horizontal .ui-slider-handle{left: -5px;margin-left: -5px;margin-top: -5px;}
/* tooltip */
.ui-tooltip{background: rgba(240,240,225,0.9); border: 1px solid #999999; color: #666666;
  padding: 6px 10px; font-size: 11px; display: inline-block; z-index: 99999999999999; 
  position: absolute;}
.ui-helper-hidden {
  display: none;
}
.ui-helper-hidden-accessible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
@media screen and (max-width : 1000px) {
	@viewport { zoom: 0.5; }
	@-ms-viewport { zoom: 0.5; }
}