@import url('https://fonts.googleapis.com/css?family=Oswald:400,500,700'); /*font-family: 'Oswald', sans-serif;*/
@font-face {
    font-family: 'Arial';
    src: url('../fonts/ArialMT.woff2') format('woff2'),
        url('../fonts/ArialMT.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Arial';
    src: url('../fonts/Arial-Black.woff2') format('woff2'),
        url('../fonts/Arial-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Mangal';
    src: url('../fonts/Mangal.woff2') format('woff2'),
        url('../fonts/Mangal.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Mangal';
    src: url('../fonts/Mangal-Bold.woff2') format('woff2'),
        url('../fonts/Mangal-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
body{
    font-family: 'Arial';
    font-weight:normal;
    font-style:normal;
}
.landing-cover{
float: left;
width: 100%;
position: relative;
background: url('../img/landing-background.jpg') no-repeat;
background-position: 50% 50%;
background-size: cover;
width: 100%;
height: 100vh;
}
.landing-header{
    margin: 0 auto;
    width: 70%;
}
.header-top-logo{
    float: left;
    width: 50%;
}
.header-top-logo img{
    float: left;
   margin-top: 10px;
}
.website-enter{
    margin: 0 auto;
    width: 96%;
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
}

.website-login-btn{
    float: right;
    position: relative;
    min-width: 250px;
    background: url('../img/website-btn.png')repeat-x;
    padding: 14px 5px;
    border:medium none;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.website-login-btn span{
    float: left;
    width: auto;
    padding: 0px 10px;
    font-size: 23px;
    color: #ffffff;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}
.website-login-btn img{
    position: absolute;
    right: 12px;
    top: 0px;
    width: 50px;
}
.custom-footer{
    width: 100%;
    background: rgba(0,0,0,0.8);
    padding: 5px 0px;
    position: absolute;
    bottom: 0px;
}
.copyright{
    float: left;
    width: 70%;
    font-size: 13px;
    color: #ffffff;
}
.more-detail{
    float: right;
    width: 30%;
    text-align: right;
    font-size: 12px;
    color: #ffffff;
}
.more-detail a{
   text-decoration: underline;
   color: #ffffff;
}
.choose-language{
    margin: 0 auto;
    width: 98%;
}
.language-right{
    float: right;
    width: 200px;
    margin-top: 15px;
}
.chose-language{
    float: left;
    text-align: left;
    font-size: 13px;
    color:#000000;
    margin: 0px 0px 5px 10%;
}
.btn-lan-custom{
    min-width:180px;
    background: rgba(195,165,70,0.7);
    color:#ffffff;
    text-align: left;
    float: right;
    border:1px solid #ffffff;
}





.custom-select-landing{
    float:right;
    height: 36px;
    width: 180px;
    overflow: hidden;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.custom-select-landing select{
    background:rgba(200,185,118,0.8) url('../img/dropdown-arrow.png')no-repeat;
    border:medium none;
    width:100%;
    height: 36px;
    outline:none;
    color:#ffffff;
    position: relative;
    background-position: 90% 50%;
    padding: 0px 0px 0px 5px;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

select {
  /* for Firefox */
  -moz-appearance: none;
  /* for Chrome */
  -webkit-appearance: none;
}

/* For IE10 */
select::-ms-expand {
  display: none;
}

.custom-select{
    float: right;
    height: 36px;
    min-width: 180px;   
    overflow: hidden;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.custom-select select{
    background:#9b6353 url('../img/dropdown-arrow.png')no-repeat;
    border:medium none;
    width:100%;
    height: 36px;
    outline:none;
    font-size: 15px;
    color:#ffffff;
    position: relative;
    background-position: 90% 50%;
    padding: 0px 10px;
}
.header-top-logo-inner{
    float: left;
    padding-top: 15px;
}
.page-title-cover{
    float: left;
    width: 100%;
    text-align: center;
    margin: 50px 0px 30px;
}
.page-title{
    font-size: 40px;
    color: #792f19;
    font-family: 'Mangal';
    font-weight:bold;
    font-style:normal;
}
.page-title:after{
    content: "";
    float: none;
    display: inline-block;
    vertical-align: middle;
    height: 2px;
    width:92px;
    background-color: #000;
    margin-left: 22px;
}
.page-title:before{
    content: "";
    float: none;
    display: inline-block;
    vertical-align: middle;
    height: 2px;
    width:92px;
    background-color: #000;
    margin-right: 22px;
}
.border-box{
    float: left;
    width: 100%;
    margin-bottom:20px;
    border:1px solid #d2d2d2;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    padding: 25px;
}

.custom-select-small{
    float:left;
    height: 36px;
    min-width: 75px;   
    overflow: hidden;
    margin-right: 10px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;

}
.custom-select-small select{
    background:#9b6353 url('../img/dropdown-arrow.png')no-repeat;
    border:medium none;
    width:100%;
    height: 36px;
    outline:none;
    color:#ffffff;
    position: relative;
    background-position: 85% 50%;
    padding: 0px 10px;
}
.mulsloktitle{
    float:left;
    width:100%;
    font-size: 30px;
    color:#792f19;
    font-weight: bold;
    font-style: normal;
}
.mulsloktitle:after{
    content: "";
    float: none;
    display: inline-block;
    vertical-align: middle;
    height: 2px;
    width:50px;
    background-color: #000;
    margin-left: 22px;
}
.mulsloktext{
    float: left;
    width: 100%;
    margin-top: 20px;
}
.mulslok-text{
    margin: 0 auto;
    width: 550px; 
    text-align: center;
    font-size: 30px;
    color:#792f19;
}
.introtext{
    float: left;
    width: 100%;
    font-size: 24px;
    margin-bottom: 10px;
    color:#792f19;
}
.innerpages{
    float: left;
    width: 100%;
    position: relative;
}
.custom-footer-inner {
    float: left;
    width: 100%;
    background: rgba(0,0,0,0.8);
    /*min-height: 50px;*/
    padding: 15px 0px;
    margin-top: 30px;
}
audio{
    margin-left: 25px;
    float: left;
    margin-top: 10px;
}
.shortselect{
    float: left;
    width: 100px;
    margin-right: 15px;
}
.shortselect .chose-language{
    width:100%;
    font-weight: bold;
    margin: 0px 0px 5px 0px;
}
.custom-select-small{
    width:100%;
}

.custom-audio{
    float: left;    
    margin-top: 10px;
}

.verse-form{
    float: left;
}

.verse-pagination{
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.verse-pagination .btn-group .btn-default{
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
    min-width: 106px;
}

.verse-pagination .btn-group .btn-default.disabled{
    color: #777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}

.verse-pagination .btn-group .btn-default:hover{
    background-color: #ddd; 
}

.custom-footer-mob{
    position: absolute;
    float: none;
    background: rgba(0,0,0,0.8);
    padding: 5px 0px;
    width: 100%;
    bottom: 0;
}

@media (min-width : 1025px) and (max-width : 1366px){
    .website-login-btn{
        min-width: 320px;
    }
    .landing-cover{
        background-position: 60% 0%;
    }
}

@media (min-width : 1024px) and (max-width : 1200px){
    .copyright{
        width: 50%;
    }
    .more-detail{
        width: 50%;
    }
    .landing-cover{
        background-position: 66% 0%;
    }
    .website-enter{
        bottom: 80px;
    }
    .website-login-btn span{
        font-size: 16px;
    }
}

@media  (min-width : 768px) and (max-width : 1023px){
    .header-top-logo-inner {
        float: left;
        width: 50%;
        padding: 15px;
    }
    .mulslok-text{
        width: 100%;
    }
    .language-right{
        width: 250px;
        padding: 10px;
        margin-top: 0px;
    }
    .chose-language{
        width: 100%;
        font-size: 15px;
        margin: 0px 0px 5px 0px;
    }
    .custom-select{
        min-width: 100%;
    }
    .copyright{
        width: 100%;
        font-size: 12px;
        text-align: center;
    }
    .more-detail{
        width: 100%;
        text-align: center;
    }
    .website-enter{
        bottom: 100px;
    }
    .landing-cover{
        background-position: 35% 0%;
    }
    .website-login-btn span{
        font-size: 16px;
    }
    .custom-select-landing{
        width: 100%;
    }
}

@media only screen and (max-width : 767px) {
    .container{
        width: 100%;
    }

    .innerpages .container .row.inner-top-row
    {
        margin-right: 0;
        margin-left: 0;
    }
    .header-top-logo-inner {
        float: left;
        width: 55%;
        padding: 21px 0px 10px 8px;
    }
    .mulslok-text{
        width: 100%;
    }
    .language-right{
        width: 142px;
        padding: 12px 6px;
        margin-top: 0px;
    }
    .chose-language{
        margin-left: 0px;
    }
    .custom-select{
        min-width: 100%;
    }
    .custom-select-small{
        min-width: 46%;
    }
    audio{
        margin-left: 0px;
        float: left;
        margin-top: 20px;
        width: 100%;
    }

    .custom-audio{
        width: 100%;
        margin-top: 20px;        
    }
    .mulslok-text{
        font-size: 20px;
    }
    .introtext{
        font-size: 15px;
    }
    .copyright{
        width: 100%;
        font-size: 11px;
        margin-bottom: 2px; 
        text-align: center;
    }
    .more-detail{
        width: 100%;
       text-align: center;
    }
    .custom-footer-inner{
        margin-top: 0px;
    }
    .landing-header {
        margin: 0 auto;
        width: auto;
        padding: 0px 15px;
    }
    .page-title{
        font-size: 20px;
    }
    .page-title:before{
        width: 35px;
        margin-right: 12px;
    }
    .page-title:after{
        width: 35px;
        margin-left:12px;
    }
    .custom-select select{
        font-size: 12px;
    }
    .page-title-cover{
        margin: 25px 0px;
    }
    .custom-select-small select{
        width: 112%;
        background-position: 84% 50%;
    }
    .border-box{
        padding: 15px;
    }
    .shortselect{
        width: 48%;
        margin-right: 0px;
    }
    .border-box .shortselect:nth-child(1){
        float: left;
    }
    .border-box .shortselect:nth-child(2){
        float: right;
    }
    .custom-select-landing{
        width: 100%;
    }
    .custom-select-landing select{
        font-size: 13px;
    }
    .header-top-logo {
        float: left;
        width: 50%;
        margin-top: 15px;
    }
    .website-login-btn span{
        font-size: 16px;
    }
    .website-enter{
        bottom: 87px;
    }
    .landing-cover{
        background-position: 35% 0%;
        text-align: center;
    }
    .website-login-btn{
        top: 10px;
    }

    .custom-footer-mob{
        display: block;
        float: left;
        min-height: 50px;
        padding: 5px 0px;
        position: relative;
        bottom: 0px;
    }

    .simpleAudioPlayer{
        width: 100% !important;
    }
    
}

@media (max-device-width : 900px)  and (orientation : landscape){
    .language-right{
        width: 110px;
        /* margin-right: -5px; */
        padding-right: 0;
    }

    .landing-cover{
        background-position: 100% 0%;
    }  

    .chose-language {
        font-size: 11px;
    }   

    .website-enter{
        right: -16px;
        bottom: 35px;    
    }   

    .website-login-btn{
        min-width: 182px;
        padding: 10px 5px;   
    }

    .website-login-btn img {
        right: 10px;
        width: 42px;
    }   

}


body{
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}