body {
    padding-top: 0 !important;
    padding-bottom: 20px;
    font-family: 'IRANSans' !important;
    width: 100% !important
}

/* Set padding to keep content from hitting the edges */
.body-content {
    /*  padding-left: 15px;
    padding-right: 15px;*/
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.icon {
    margin-left: 10px;
    color: #8cc7fa;
    font-size: 15px;
}

.page-sidebar-menu > li {
    padding: 10px 0 !important
}

.row {
    margin: 0
}

.boxLogin {
    border: 1px solid gray;
    padding: 20px;
    background-color: whitesmoke
}



/* Raven CSS  */


.boxRaven {
    border: 1px solid lightgray;
    margin-top: 10%;
    padding: 20px;
    font-size: 20px
}

.guidbox {
    border: 1px solid lightgray;
    margin-top: 10%;
    padding: 30px;
    font-size: 20px;
    background-color: #88fac8;
    text-align: center;
    cursor: pointer;
}

    .guidbox:hover {
        background-color: #6fe2b0
    }

.next {
    padding: 10px;
    width: 100px
}

.next-main {
    padding: 10px;
    width: 100px
}

.guid {
    padding: 10px;
    width: 100px
}

#logoimg {
    position: fixed;
    margin: auto;
    left: 0;
    right: 0;
    bottom: 5px;
    text-align: center;
    width: 100px;
    height: auto
}

.qHolder {
    text-align: center;
    width: 100%;
    height: 250px;
    
}

    .qHolder div {
        width: 50%;
        /*width:100%;*/
        margin: 0 auto;
        height: auto
    }

    .qHolder img {
        width: 60%;
        margin: 0 auto;
        height: auto
    }

.answer {
    text-align: center;
    font-weight: bold
}

    .answer img:hover {
        cursor: pointer;
        border: 10px solid #bebdbd;
    }

    .answer img {
        border: 10px solid transparent;
        width: 90%;
        height: auto
    }

.answer-main {
    text-align: center;
    font-weight: bold
}

    .answer-main div:hover {
        cursor: pointer;
        border: 10px solid #bebdbd !important;
    }

    .answer-main div {
        border: 10px solid transparent;
        width: 100%;
        height: auto
    }

.imgTransparent {
    border: 10px solid transparent;
}

#guidvideoHolder {
    text-align: center;
    width: 100%
}

    #guidvideoHolder video {
        width: 100%;
        margin: 0 auto;
        height: auto
    }

.guidHolderEar {
    text-align: center;
    width: 100%;
    margin-top: 10%
}

    .guidHolderEar img {
        width: 100%;
        margin: 0 auto;
        height: auto
    }

#loader {
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 1;
    width: 60%
}

.numberBox {
    background-color: greenyellow;
    padding: 2px 10px;
    border-radius: 10px !important;
    color: black
}

#message {
    text-align: center;
    display: none
}

    #message p {
        font-size: 30px;
        margin-top: 25%
    }

.greenBox {
    background-color: #6fe2b0;
    color: black;
    text-align: center;
    padding: 10px
}

.redBox {
    background-color: #f76666;
    color: black;
    text-align: center;
    padding: 10px
}

.purpleBox {
    background-color: #e56bff;
    color: black;
    text-align: center;
    padding: 10px
}

.selectDisable {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}