body {background: url('../image/body-bg.png');}

.topBar {display: flex; justify-content: center; align-items: center; flex-direction: column; margin-top: 70px;}
.topBar img {width: 180px;}
.topBar .btns {text-align: center;}
.topBar .btns h3 {-webkit-background-clip: text; color: transparent; background-image: linear-gradient(to right, #ff9702, blue); padding-bottom: 10px;}

.form-group label {padding-right: 5px;}
button[type="submit"] {margin: 10px 0 20px;}

footer {background: #1d1d1d; font-size: 10px; color: #fff; padding: 10px 0; height: 35px; box-shadow: rgba(32, 28, 28, 0.4) 0 -3px 4px;}
footer a {color: #fff;}

.header-top {background: #1d1d1d; position: fixed; z-index: 99; width: 100%; top: 0; box-shadow: rgba(0, 0, 0, 0.4) 0 3px 4px; padding: 20px 0;}
.header-top img {width: 160px;}
.header-top .twoBtns {text-align: right; white-space: nowrap;}

.main-title {border-top: 4px solid orangered; text-align: center; margin-top: 80px; margin-bottom: 40px;}
.main-title h2 {text-transform: uppercase; font-size: 24px; background: orangered; color: #fff; display: inline-block; border-radius: 0 0 5px 5px; padding: 5px 20px 10px;}

.apiBox {text-align: center; float: left; padding: 20px; box-sizing: border-box;}
.apiBox .api {border-radius: 5px; border: 3px solid orangered; height: 140px; position: relative; padding: 10px; box-sizing: border-box; text-align: center; transform: skewX(-7deg); box-shadow: rgba(32, 28, 28, 0.8) 2px 4px 8px;}
.apiBox .api .status {width: 100%; position: absolute; bottom: 0; left: 0; text-align: center; color: #fff; background: rgba(0, 0, 0, 0.7); padding: 10px 0;}
.apiBox .api  h3 {font-size: 24px; color: orangered;}

.apiBox .api.success {border-color: green;}
.apiBox .api.success  h3 {color: green;}

@media only screen and (max-width: 767px) {
    .main-title {margin-top: 140px;}
    .main-title h2 {font-size: 16px;}

    section .container .apiBox:last-of-type,.topBar {margin-bottom: 60px;}

    .header-top .twoBtns {text-align: center;}

    footer {height: 45px;}
}
p.err-msg {
    display: none;
}
.error {
    color: #c40000;
    font-weight: bold;
}
.error p.err-msg {
    font-size: 80%;
    margin: 0;
    display: inherit;
}
.crx-wl-submit-result {
    color: red !important;
    font-size: 20px;
}
.clear{
    clear:both;
}
.errorMsg{
    color: red;
    display: none;  
    width:100%; 
    font-weight: 700;
 }
 
 .error div.errorMsg{
     display: inherit;
 }
 div.errorMsg {
    display: none;
}
.grpnotextbox{
    margin-left: -50px;
}
.grpnotextboxwidth{
    width:150%;
}