﻿@font-face {font-family: 'DubaiRegular';src: url('fonts/DubaiW23-Regular.woff') format('woff');}
@font-face {font-family: 'DubaiBold';src: url('fonts/DubaiW23-Bold.woff') format('woff');}
@font-face {font-family: 'DubaiMedium';src: url('fonts/DubaiW23-Medium.woff') format('woff');}
@font-face {font-family: 'DubaiLight';src: url('fonts/DubaiW23-Light.woff') format('woff');}

body {margin: 0;font-family: 'DubaiRegular';font-size:16px;line-height:inherit;}
.banner-wrapper {background: #3a5b9a;margin: 10px 0;width: 100%;display: block;}
.loader {border: 10px solid #f3f3f3;border-top: 10px solid gray;border-radius: 50%;width: 50px;height: 50px;animation: spin 2s linear infinite;margin:10% auto;}
@keyframes spin {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}
.bgblue{background:#3a5b9a!important;}
.bgorange{background:orange!important;}

.header-wrapper{position:absolute;top:0;right:0;left:0;height:50px;background-color:#3a5b9a;}
.header-wrapper .menucontainer{width:80%;margin:0px auto;height:50px;line-height:50px;}
.header-wrapper .menucontainer a{color:#ffffff;text-decoration:none;} 
.header-wrapper .menucontainer .active{border-bottom:solid 2px #c91f2a;}
.header-wrapper .menucontainer .menusplitter{color:#ffffff;margin:0 20px;}
.body-wrapper{width:80%;margin:75px auto;}

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){width:250px;}


.magazineinfo{}
.magazineinfo .logo-wrapper{width:100%}
.magazineinfo .info-wrapper{width: 100%;display: inline-block;margin:20px 0;}
.magazineinfo .info-wrapper .item{background:#3a5b9a;display:inline-block;width:100%;}
.magazineinfo .info-wrapper .item .frambanner{float:left;height:385px;width:60%;}
.magazineinfo .info-wrapper .item .imgbanner{float:left;width:60%;}
.magazineinfo .info-wrapper .item .info{float: right;display: inline-block;width: 40%;color: #ffffff;}
.magazineinfo .info-wrapper .item .info h3{padding:0 20px 0 10px;}
.magazineinfo .info-wrapper .item .info p{padding:0 20px 0 10px;text-align:justify;}
.magazineinfo .info-wrapper .item .info .btn-wrapper{text-align:center;width:100%;display:inline-block;margin-bottom:10px;}
.magazineinfo .info-wrapper .item .info .button{background: #ffffff;border-radius: 5px;width: 40%;display: inline-block;text-align: center;margin: 0px auto;text-decoration:none;color:#c91f2a;}

.archiveinfo{margin:0;padding:0;list-style:none;}
.archiveinfo li{width: 100%;display: inline-block;position:relative;border-bottom: solid 1px lightgray;margin-bottom: 40px;min-height:250px;}
.archiveinfo li .covercontainer{float:right;width:20%;}
.archiveinfo li .covercontainer .cover {width: 200px;}
.archiveinfo li .infocontainer{float: right;display: inline-block;width: 70%;color: #000000;}
.archiveinfo li .infocontainer h3{padding:0 20px 0 10px;}
.archiveinfo li .infocontainer p{padding:0 20px 0 10px;text-align:justify;}
.archiveinfo li .logo-wrapper{position: absolute;left: 0;top: 0;}
.archiveinfo li .logo-wrapper img{width:100px;}
.archiveinfo li .btn-wrapper{position:absolute;left:20px;bottom:10px;}
.archiveinfo li .button{background: #c91f2a;color:#ffffff;border-radius: 5px;display: block;text-align: center;padding:5px 50px;text-decoration:none;margin-top:5px;}

.archive-filter{width:100%;margin:20px auto;display:inline-block;}
.archive-filter>ul{margin:0;padding:0;list-style:none;width:80%;}
.archive-filter>ul>li{float:right;width:48%;margin-bottom:10px;}
.archive-filter>ul>li.wide{width:100%;}
.archive-filter>ul>li .desp{width: 100px;display: inline-block;}
.archive-filter>ul>li input[type='text']{width: 250px;border: solid 1px lightgray;border-radius: 3px;height: 30px;}
.archive-filter>ul>li .search{background: #c91f2a;color:#ffffff;border-radius: 5px;text-decoration:none;padding:5px 30px;}

.detailsinfo{width: 100%;display: inline-block;margin:20px 0;}
.detailsinfo .logo-wrapper{width:100%;}
.detailsinfo .framebanner{height:260px;width:100%;}
.detailsinfo .upper-wrapper{margin-top:50px;display:inline-block;background:#fafafa;}
.detailsinfo .upper-wrapper .right{float: right;display: inline-block;width:20%;}
.detailsinfo .upper-wrapper .left{float: left;display: inline-block;width:80%;}
.detailsinfo .upper-wrapper .left .imgbanner{height:260px;}
.detailsinfo .upper-wrapper .left h3{padding:5px 20px; 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;margin-right:20px;}
.detailsinfo .upper-wrapper .left p{padding:0 20px 0 10px;text-align:justify;}
.detailsinfo .lower-wrapper{width:100%;}
.detailsinfo .lower-wrapper ul{margin:0;padding:0;list-style:none;}
.detailsinfo .lower-wrapper ul .item{width: 100%;display: inline-block;position:relative;margin-bottom: 40px;}
.detailsinfo .lower-wrapper ul .item .info{display: inline-block;width: 100%;color: #000000;}
.detailsinfo .lower-wrapper ul .item .info h3{padding:5px 20px; 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;margin-right:20px;}
.detailsinfo .lower-wrapper ul .item .info p{padding:0 20px 0 10px;text-align:justify;}
.detailsinfo .lower-wrapper ul .item .info table{width:98%;padding:0 20px 0 10px;margin-right:20px;border-collapse:collapse;}
.detailsinfo .lower-wrapper ul .item .info table tr td{border-bottom:dotted 1px gray;}
.detailsinfo .btn-wrapper{width:100%;display:inline-block;margin:20px 0;}
.detailsinfo .button{float:left;background: #c91f2a;color:#ffffff;border-radius: 5px;display: block;text-align: center;padding:5px 50px;text-decoration:none;margin-top:5px;}

.purchaseinfo{}
.purchaseinfo h3{padding:5px 20px; 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;}
.purchaseinfo ul{list-style:none;width:100%;margin:0;padding:0;margin-top:50px;}
.purchaseinfo ul>li{border-bottom:solid 1px lightgray;display:inline-block;width:100%;}
.purchaseinfo ul>li .cover-wrapper{width:15%;display:inline-block;float:right;padding-right:20px;}
.purchaseinfo ul>li .cover-wrapper img{width:60%;}
.purchaseinfo ul>li .info-wrapper{width:45%;display:inline-block;float:right;padding: 20px 0;}
.purchaseinfo ul>li .info-wrapper p{margin:0;}
.purchaseinfo ul>li .price-wrapper{width:20%;display:inline-block;text-align:left;margin:20px 0;}
.purchaseinfo ul>li .price-wrapper>span{font-size: 22px;color: #c91f2a;}
.purchaseinfo ul>li .delete-wrapper{width:19%;display:inline-block;text-align:center;margin:20px auto;}
.purchaseinfo ul>li.totalitem>div{padding:0;margin:0;}
.purchaseinfo ul>li.totalitem .lbltotal{color: #c91f2a;padding-right:20px;}

.paymentinfo h3{padding:5px 20px 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;}
.paymentinfo>span{display:block;margin:0 0 20px 0;}
.paymentinfo ul{list-style:none;width:100%;margin:0;padding:0;}
.paymentinfo ul .item{width:48%;display:inline-block;margin-bottom:15px;}
.paymentinfo ul .item span{display:block;}
.paymentinfo ul .item input[type='text']{width: 100%; max-width:430px;height: 35px;border-radius: 3px;border: solid 1px lightgray;padding: 5px 10px;}
.paymentinfo ul .item .miniinput{width:100px!important;}
.paymentinfo ul .item .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){width:430px;}
.paymentinfo ul .item.wide{width:100%;} 
.paymentinfo ul .item.wide .btnpay{background:#a21a23;color: #ffffff;width: 100%;display: inline-block;margin: 5px 0;padding: 10px 0;text-align: center;border-radius:3px;text-decoration:none;}

#receipt-wrapper{}
#receipt-wrapper h3{padding: 5px 20px 5px 10px;background-color: #3a5b9a;color: #ffffff;font-weight: normal;}
#receipt-wrapper .info{border-collapse:collapse;width:80%;}
#receipt-wrapper .mobileinfo{display:none;}
#receipt-wrapper .info tr td{padding:5px 10px;border:solid 1px lightgray;}
#receipt-wrapper .info tr .desp{font-weight:bold;}
#receipt-wrapper .items{border-collapse:collapse;width:100%;}
#receipt-wrapper .items tr td{border:none;}
#receipt-wrapper .btn-wrapper{margin-top:20px;}
#receipt-wrapper .btn-wrapper .button{padding:5px 20px;text-decoration:none;background-color:#c91f2a; color:#ffffff;}



@media screen and (max-device-width : 1024px) {
    h3{font-size:18px;}
    .body-wrapper{width:95%;margin:50px auto;}
    .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){width:90%;}
            
    .magazineinfo .logo-wrapper{width:100%;text-align:center;}
    .magazineinfo .info-wrapper{width: 100%;display: inline-block;margin:20px 0;}
    .magazineinfo .info-wrapper .item{background:#3a5b9a;display:inline-block;width:100%;}
    .magazineinfo .info-wrapper .item .frambanner{float:left;height:200px;width:100%;}
    .magazineinfo .info-wrapper .item .imgbanner{width:100%;}
    .magazineinfo .info-wrapper .item .info{display: inline-block;width: 100%;color: #ffffff;}
    .magazineinfo .info-wrapper .item .info h3{padding:0 10px 0 10px;}
    .magazineinfo .info-wrapper .item .info p{padding:0 10px 0 10px;text-align:justify;}
    .magazineinfo .info-wrapper .item .info .btn-wrapper{text-align:center;width:100%;display:inline-block;margin-bottom:10px;}
    .magazineinfo .info-wrapper .item .info .button{background: #ffffff;border-radius: 5px;width: 90%;display: inline-block;text-align: center;margin: 5px auto;text-decoration:none;color:#c91f2a;padding:5px 0;}

    .archiveinfo{margin:0;padding:0;list-style:none;}
    .archiveinfo li{width: 100%;display: inline-block;position:relative;border-bottom: solid 1px lightgray;margin-bottom: 40px;min-height:250px;}
    .archiveinfo li .covercontainer{width:100%;text-align:center;}
    .archiveinfo li .covercontainer .cover {width: 200px;}
    .archiveinfo li .infocontainer{display: inline-block;width:100%;color: #000000;}
    .archiveinfo li .infocontainer h3{padding:0 10px 0 10px;}
    .archiveinfo li .infocontainer p{padding:0 10px 0 10px;text-align:justify;}
    .archiveinfo li .logo-wrapper{display:none;}
    .archiveinfo li .btn-wrapper{position:initial;}
    .archiveinfo li .button{background: #c91f2a;color:#ffffff;border-radius: 5px;display: block;text-align: center;padding:5px 50px;text-decoration:none;margin-top:5px;font-size:14px;}

    .archive-filter>ul{margin:0;padding:0;list-style:none;width:100%;}
    .archive-filter>ul>li{width:100%;margin-bottom:10px;}    
    .archive-filter>ul>li .desp{width: 100px;display: inline-block;}
    .archive-filter>ul>li input[type='text']{width: 250px;border: solid 1px lightgray;border-radius: 3px;height: 30px;}
    .archive-filter>ul>li .search{background: #c91f2a;color:#ffffff;border-radius: 5px;text-decoration:none;padding:5px 30px;}

    .detailsinfo .framebanner{height:100%;width:100%;}
    .detailsinfo .logo-wrapper{width:100%;text-align:center;}
    .detailsinfo .upper-wrapper{margin-top:20px;display:inline-block;background:#fafafa;}
    .detailsinfo .upper-wrapper .right{display: inline-block;width:100%;text-align:center;}
    .detailsinfo .upper-wrapper .right img{width:90%;max-width:200px;}
    .detailsinfo .upper-wrapper .left{display: inline-block;width:100%;}
    .detailsinfo .upper-wrapper .left .imgbanner{height:260px;}
    .detailsinfo .upper-wrapper .left h3{padding:5px 20px; 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;margin-right:0px;}
    .detailsinfo .upper-wrapper .left p{padding:0 10px 0 10px;text-align:justify;}
    .detailsinfo .lower-wrapper{width:100%;}
    .detailsinfo .lower-wrapper ul{margin:0;padding:0;list-style:none;}
    .detailsinfo .lower-wrapper ul .item{width: 100%;display: inline-block;position:relative;margin-bottom: 40px;}
    .detailsinfo .lower-wrapper ul .item .info{display: inline-block;width: 100%;color: #000000;}
    .detailsinfo .lower-wrapper ul .item .info h3{padding:5px 10px; 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;margin-right:0;}
    .detailsinfo .lower-wrapper ul .item .info p{padding:0 20px 0 10px;text-align:justify;}
    .detailsinfo .lower-wrapper ul .item .info table{width:100%;padding:0 20px 0 10px;margin-right:0px;border-collapse:collapse;}    
    .detailsinfo .lower-wrapper ul .item .info table tr td{border-bottom:dotted 1px gray;}
    .detailsinfo .btn-wrapper{width:100%;display:inline-block;margin:20px 0;}
    .detailsinfo .button{float:left;background: #c91f2a;color:#ffffff;border-radius: 5px;display: block;text-align: center;padding:5px 0px;text-decoration:none;margin-top:5px;width:100%;}
 
    .purchaseinfo{margin-top:20px;display:inline-block;}
    .purchaseinfo h3{padding:5px 10px; 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;}
    .purchaseinfo ul{list-style:none;width:100%;margin:0;padding:0;margin-top:0px;}
    .purchaseinfo ul>li{border-bottom:solid 1px lightgray;display:inline-block;width:100%;}
    .purchaseinfo ul>li .cover-wrapper{display:none;}
    .purchaseinfo ul>li .cover-wrapper img{width:60%;}
    .purchaseinfo ul>li .info-wrapper{width:78%;display:inline-block;float:right;padding:0;}
    .purchaseinfo ul>li .info-wrapper p{margin:0;padding-right:10px;}
    .purchaseinfo ul>li .price-wrapper{width:20%;display:inline-block;text-align:left;margin:20px 0;}
    .purchaseinfo ul>li .price-wrapper>span{font-size: 22px;color: #c91f2a;}
    .purchaseinfo ul>li .delete-wrapper{width:100%;display:inline-block;text-align:center;margin:10px 0;}
    .purchaseinfo ul>li .delete-wrapper .delete{background: #a21a23;color: #ffffff;padding: 5px 0;width: 100%;display: inline-block;border-radius: 5px;}
    .purchaseinfo ul>li.totalitem>div{padding:0;margin:0;}
    .purchaseinfo ul>li.totalitem .lbltotal{color: #c91f2a;padding-right:10px;}
    .purchaseinfo ul>li.totalitem .cover-wrapper{display:inline-block;width:75%;}
    .purchaseinfo ul>li.totalitem .info-wrapper{display:none;}
    .purchaseinfo ul>li.totalitem .delete-wrapper{display:none;}
   
    .paymentinfo h3{padding:5px 10px; 5px 10px;background-color:#3a5b9a;color:#ffffff;font-weight:normal;}
    .paymentinfo>span{display:block;margin:0 0 20px 0;text-align:justify;}
    .paymentinfo ul{list-style:none;width:100%;margin:0;padding:0;}
    .paymentinfo ul .item{width:100%;display:inline-block;margin-bottom:15px;}
    .paymentinfo ul .item span{display:block;}
    .paymentinfo ul .item input[type='text']{width: 100%; max-width:430px;height: 35px;border-radius: 3px;border: solid 1px lightgray;padding: 5px 10px;}
    .paymentinfo ul .item .miniinput{width:100px!important;}
    .paymentinfo ul .item .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){width:430px;}
    .paymentinfo ul .item.wide{width:100%;} 
    .paymentinfo ul .item.wide .btnpay{background:#a21a23;color: #ffffff;width: 100%;display: inline-block;margin: 10px 0;padding: 5px 0;text-align: center;border-radius:3px;text-decoration:none;width:100%;}

    #receipt-wrapper{margin-top:20px;display:inline-block;}
    #receipt-wrapper h3{padding: 5px 10px 5px 10px;background-color: #3a5b9a;color: #ffffff;font-weight: normal;}
    #receipt-wrapper p{text-align:justify;padding-right:10px;}
    #receipt-wrapper .info{display:none;}
    #receipt-wrapper .mobileinfo{border-collapse:collapse;width:100%;display:inline-table;}
    #receipt-wrapper .mobileinfo tr td{padding:5px 10px;border:solid 1px lightgray;}
    #receipt-wrapper .mobileinfo tr .desp{font-weight:bold;}
    #receipt-wrapper .items{border-collapse:collapse;width:100%;}
    #receipt-wrapper .items tr td{border:none;padding:0px;}
    #receipt-wrapper .items tr td p{padding:0;}
    #receipt-wrapper .btn-wrapper{margin-top:20px;}
    #receipt-wrapper .btn-wrapper .button{padding:5px 0px;text-decoration:none;background-color:#c91f2a; color:#ffffff;width:100%;display:inline-block;border-radius:5px;text-align:center;}
}