header{display:block}
body{font-family:Verdana,sans-serif;font-size:15px;margin:0;width:720px;padding:5px;}
footer{}
input[type="radio"]:focus,input[type="checkbox"]:focus{-moz-focus-inner{border-color:red!important}}
textarea{height:50px;width:99%;resize:vertical;}
hr {border:none;border-top:5px solid darkgray;}
.logo{height:40px;}
.photo{width:100px;height:150px;}
.photo-list{width:50px;height:75px;}
.graph{width:250px;}
.pict-container{position:relative;}
.del-img{position:absolute;left:5px;top:5px;z-index:1;opacity:0.5;
    background-color:#aaa;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
}
.del-img:hover{background-color:#666;opacity:0.8}

.hdr{width:100%;height:15px;background-color:cyan;}
.hdr-left  {color:black;display:inline-block;font-size:12px;height:100%;position:relative;z-index:99;float:left;text-align:left;}
.hdr-center{color:black;display:inline-block;font-size:12px;height:100%;position:relative;z-index:99;text-align:center;}
.hdr-right {color:black;display:inline-block;font-size:12px;height:100%;position:relative;z-index:99;float:right;text-align:right;}

.footer{background-color:blue;display:flex;color:rgb(255, 255, 255);font-size:12px;font-weight:bold;height:20px;letter-spacing:3px;overflow:hidden;}
.footer-item{color:white;}
.footer-item a{color:white; text-decoration:none;}
.footer-item a:hover{color:yellow;transition-duration:0.8s;-webkit-transition-duration:0.8s;}

.txtbox{padding:5px;}
.txtbox-title{}
.txtbox-input{}
.txtbox-icon{width:14px;height:14px;}

.action-bar{}
.action-button{width:25px;padding-right:5px;}

.smart-bar{height:20px;padding:5px;}
.smart-bar-left{display:block;float:left;}
.smart-bar-right{display:block;float:right;}
.smart-button{width:18px;padding:2px;}
.smart-filter{padding-left:10px;display:none;}

.smart_search {position: relative;display: inline-block;}
.smart_search input {padding-right: 25px;}
.smart_search button {position: absolute;top: 0;right: 0;border: none;background-color: transparent;background-size: contain;cursor: pointer;}
.smart_search img {position: absolute;top: 0;right: 0;border: none;padding:2px;width:18px;background-color: transparent;background-size: contain;cursor: pointer;}

.smart_icon{width:18px;}
.bkgreen{background-color:#008000;}
.bkyellow{background-color:#FFFF00;}
.bkred{background-color:#FF0000;}


.page{width:100%;overflow-x:auto;padding-right:10px;}
.pg{font-size:12px;margin:auto;}
.pgrow{width:100%;}
.pglbl{width:20px;text-align:center;}
.pgcol{width:20px;text-align:center;border:1px solid #202020;background-color:#512b81;color:#ffffff;}
.pgcol:hover{background-color:#8cabff;color:#000;}
.pgsel{width:20px;text-align:center;border:1px solid #202020;background-color:#4477ce;color:#ffffff;}
.pgnext{width:20px;text-align:center;border:1px solid #202020;background-color:#512b81;color:#ffffff;}
.pgnext:hover{background-color:#8cabff;color:#000;}

.ccy{color:blue;}
.hidden{display:none;}
.top{vertical-align:top;}
.pict{width:300px;height:300px;}

@keyframes blinker {50% {opacity:.25;}}
.blink{animation:blinker 2s linear infinite;}

@keyframes slidedown{from{translate:0 -100vw;}to{translate:0 0;}}
.slidedown{animation:slidedown 3s forwards;}

@keyframes slideup{from{translate:0 0;}to{translate:0 -100vw;}}
.slideup{animation:slideup 3s forwards;}


/* Dropdown Menu */
.dropbutton{background-color:white;border:none;color:rgb(64,64,64);padding:0px;}
.dropdown{display:inline-block;position:relative;}
.dropdown:hover .dropbutton{background-color:lightblue;color:rgb(255,255,255);transition-duration:0.6s;-webkit-transition-duration:0.6s;} 
.dropdown-content{background-color:rgb(128,128,128);box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);display:none;min-width:75px;position:absolute;top:30px;z-index:1;}
.dropdown-content a{color:black;display:block;padding:5px 5px;text-decoration:none;}
.dropdown-content a:hover{background-color:rgb(192,192,192);color:rgb(255,255,255);}
.dropdown:hover .dropdown-content{display:block;}
.dropbutton1{height:30px;}

.mainbody{background-color:white;color:black;display:block;font-size:12px;height:650px;}
.welcome{height:400px;padding-top:80px;text-align:center;width:100%;}
.welcome-logo{display:block;margin-left:auto;margin-right:auto;width:300px;}
.userbutton{border-radius:6px;display:inline-block;font-size:14px;margin-left:auto;margin-right:auto;margin-top:20px;padding:5px 10px;}
.userbutton1{background-color:rgb(254,217,102);border:2px solid black;color:black;}
.userbutton1 a{font-weight:bold;text-decoration:none;}
.userbutton1:hover{background-color:gray;border:2px solid rgb(254,217,102);color:rgb(254,217,102);transition-duration:0.8s;-webkit-transition-duration:0.8s;}
.userbutton2{}

.signin{height:400px;padding-top:80px;text-align:center;width:100%;}
.signin-item{}
.signin-title{}
.signin-input{}
.signin-text{}

.signup{background-color:lightgray;font-size:12px;height:400px;padding-top:10px;text-align:left;width:100%;}
.signup-row{display:flex;}
.signup-item{flex:50%;}
.signup-title{height:20px;padding-top:0px;padding-left:10px;}
.signup-input{height:20px;padding-top:0px;padding-left:15px;padding-bottom:10px;}
.signup-text{}

.search{background-color:lightgray;font-size:12px;text-align:left;width:100%;display:flow-root;}
.search-item{background-color:lightgray;float:left;margin:auto;padding-left:5px;padding-right:5px;padding-bottom:5px;position:relative;}
.search-title{}
.search-input{}

.signout{height:400px;padding-top:80px;text-align:center;width:100%;}
.signout-item{}
.signout-title{}
.signout-input{}
.signout-text{}

.avk{background-color:rgb(128,128,128);color:white;}
.input-text{background-color:rgb(128,128,128);color:white;}

.beta-container{display:inline-block;float:left;margin:auto;position:relative;text-align:center;width:38px;}
.beta-most{background-color:rgb(128,128,128);border:1px solid black;color:rgb(255,255,255);}
.beta-leas{background-color:rgb(160,160,160);border:1px solid black;color:rgb(64,64,64);}
.beta-radio{margin-bottom:5px;}
.beta-item{color:black;}

.avk-title{display:inline-block;float:left;margin:auto;position:relative;width:100px;}
.avk-input{margin-bottom:5px;}
.avk-item{color:black;}

.mi-title{display:inline-block;float:left;margin:auto;position:relative;width:100px;}
.mi-input{margin-bottom:5px;}
.mi-item{color:black;}

.iq-container{display:inline-block;float:left;margin:auto;position:relative;text-align:center;width:175px;}
.iq-no{display:inline-block;float:left;margin:auto;position:relative;text-align:center;width:20px;}
.iq-item{color:black;}
.iq-input{margin-bottom:5px;}
.iq-line{}
.iq-text{width:50px;}

.warning{color:#ff8000;font-size:14px;font-weight:bold;animation: blinker 1.5s step-end infinite;}
.info{color:#0040ff;font-size:14px;font-weight:bold;animation: blinker 1.5s step-end infinite;}

.home{height:400px;padding-top:60px;width:100%;}
.home-item{display:inline-grid;width:24%;font-size:16px;text-align:center;}
.home-title{}
.home-input{}
.home-text{}

.stockin{background-color:lightgray;font-size:12px;text-align:left;width:100%;display:flow-root;}
.stockin-item{background-color:lightgray;float:left;margin:auto;padding-left:5px;padding-right:5px;padding-bottom:5px;position:relative;}
.stockin-title{}
.stockin-input{}
.stockin-text{}

.stockout{background-color:lightgray;font-size:12px;text-align:left;width:100%;display:flow-root;}
.stockout-item{background-color:lightgray;float:left;margin:auto;padding-left:5px;padding-right:5px;padding-bottom:5px;position:relative;}
.stockout-title{}
.stockout-input{}
.stockout-text{}

.cart{background-color:lightgray;font-size:12px;text-align:left;width:100%;display:flow-root;}
.cart-item{background-color:lightgray;float:left;margin:auto;padding-left:5px;padding-right:5px;padding-bottom:5px;position:relative;}
.cart-title{}
.cart-input{}
.cart-text{}

.testee{background-color:lightgray;font-size:12px;text-align:left;width:100%;display:flow-root;}
.testee-item{background-color:lightgray;float:left;margin:auto;padding-left:5px;padding-right:5px;padding-bottom:5px;position:relative;}
.testee-title{}
.testee-input{}
.testee-text{}

.institution{background-color:lightgray;font-size:12px;height:400px;padding-top:10px;text-align:left;width:100%;}
.institution-item{}
.institution-title{height:20px;padding-top:0px;padding-left:10px;}
.institution-input{height:20px;padding-top:0px;padding-left:15px;padding-bottom:10px;}
.institution-text{}

.master{background-color:lightgray;font-size:12px;text-align:left;width:100%;}
.master-item{background-color:lightgray;float:left;margin:auto;padding-left:5px;padding-right:5px;padding-bottom:5px;position:relative;}
.master-title{}
.master-input{}
.master-text{}

.tabel-tes{border-collapse:collapse;font-size:12px;width:100%;}
.tabel-tes-header{background-color:#4CAF50;border:1px solid #ddd;color:white;font-weight:bold;text-align:left;}
.tabel-tes-header a{font-size:14px;text-decoration:none;}
.tabel-tes-baris{font-size:11px;text-decoration:none;}
.tabel-tes-baris:nth-child(even){background-color:#f2f2f2;}
.tabel-tes-hkolom{border:1px solid #ddd;padding:5px;width:50%;}
.tabel-tes-kolom{border:1px solid #ddd;padding:5px;vertical-align:top;width:50%;}
.tabel-tes-kolom:hover {background-color:#ddd;}
.tabel-tes-kolom a{font-size:14px;text-decoration:none;}

.report{padding-top:60px;text-align:left;width:100%;}
.report-item{}
.report-title{}
.report-input{}
.report-text{}
.report-canvas{border:4px solid gray;height:550px;overflow:auto;width:710px;}
.report-canvas-invalid{background-color:lightgray;border:4px solid gray;height:550px;overflow:auto;width:710px;}

#ship_address {width:300px;}