﻿
@charset "utf-8";
/* ----------------------------------
	1. Reset default browser styles
	2. Basic classes and elements 
	3. Color Scheme
	4. Typography
	5. Header
	6. Sliders
	7. Tabs
	8. Carousels
	9. Twitter Feed
	10. Lists and navigations
	11. Buttons
	12. Tables
	13. Icons
	14. Main content elements
	15. Forms
	16. Footer
	17. Animations
	18. Responsive changes
	19. Retina ready
-------------------------------------*/
1. Reset default browser styles ------------------------------------- */ * {
    margin: 0;
    padding: 0;
    border: none;
}

article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video, main {
    display: block;
}

mark, rp, rt, ruby, summary, time {
    display: inline;
}

a, abbr, acronym, address, applet, article, aside, audio, b, blockquote, big, body, center, canvas, caption, cite, code, command, datalist, dd, del, details, dfn, dl, div, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, keygen, label, legend, li, meter, nav, object, ol, output, p, pre, progress, q, s, samp, section, small, span, source, strike, strong, sub, sup, table, tbody, tfoot, thead, th, tr, tdvideo, tt, u, ul, var {
    background: transparent;
    border: 0 none;
    font-weight: inherit;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: top;
}

a {
    text-decoration: none;
    outline: none !important;
}

b, strong {
    font-weight: bold !important;
}

ul, ol {
    list-style: none;
}

q {
    quotes: none;
}

table, table td {
    padding: 0;
    border: none;
    border-collapse: collapse;
}

img {
    vertical-align: top;
    max-width: 100%;
}

embed {
    vertical-align: top;
}

input, button {
    /*	-webkit-appearance:none;*/
    outline: none;
}

    button::-moz-focus-inner {
        border: 0;
    }

html, body {
    height: 100%;
}


/* -----------------------------------

	2. Basic classes and elements 

------------------------------------- */
body {
    font: 500 14px/21px "Open Sans",Arial,sans-serif;
    color: #58595b;
    background: #fff;
    letter-spacing: 0.1px;
}

.clear {
    clear: both;
    overflow: hidden;
}
/*Margin*/
.pad-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.m_left_0 {
    margin-left: 0 !important;
}

.m_right_0 {
    margin-right: 0 !important;
}

.m_left_5 {
    margin-left: 5px;
}

.m_left_10 {
    margin-left: 10px;
}

.m_left_15 {
    margin-left: 15px;
}

.m_left_20 {
    margin-left: 20px;
}

.m_left_40 {
    margin-left: 40px;
}

.m_right_5 {
    margin-right: 5px;
}

.m_right_6 {
    margin-right: 6px;
}

.m_right_8 {
    margin-right: 8px;
}

.m_right_10 {
    margin-right: 10px;
}

.m_right_15 {
    margin-right: 15px;
}

.m_right_20 {
    margin-right: 20px;
}

.m_right_25 {
    margin-right: 25px;
}

.m_right_29 {
    margin-right: 29px;
}

.m_right_30 {
    margin-right: 30px;
}

.m_right_35 {
    margin-right: 35px;
}

.p_bottom_0 {
    padding-bottom: 0 !important;
}

.m_bottom_0 {
    margin-bottom: 0 !important;
}

.m_bottom_3 {
    margin-bottom: 3px;
}

.m_bottom_5 {
    margin-bottom: 5px;
}

.m_bottom_10 {
    margin-bottom: 10px;
}

.m_bottom_12 {
    margin-bottom: 12px;
}

.m_bottom_15 {
    margin-bottom: 15px;
}

.m_bottom_20 {
    margin-bottom: 20px;
}

.m_bottom_25 {
    margin-bottom: 25px;
}

.m_bottom_30 {
    margin-bottom: 30px;
}

.m_bottom_35 {
    margin-bottom: 35px;
}

.m_bottom_40 {
    margin-bottom: 40px;
}

.m_bottom_45 {
    margin-bottom: 45px;
}

.m_bottom_50 {
    margin-bottom: 50px;
}

.m_bottom_60 {
    margin-bottom: 60px;
}

.m_bottom_65 {
    margin-bottom: 65px;
}

.m_bottom_100 {
    margin-bottom: 100px;
}

.m_top_0 {
    margin-top: 0px !important;
}

.m_top_5 {
    margin-top: 5px;
}

.m_top_10 {
    margin-top: 10px;
}

.m_top_20 {
    margin-top: 20px;
}

.m_top_30 {
    margin-top: 30px;
}

.m_top_40 {
    margin-top: 40px;
}

.m_top_50 {
    margin-top: 50px;
}

.m_top_100 {
    margin-top: 100px;
}

.fl_right {
    float: right;
}

.fl_left {
    float: left;
}
.pad-50{
padding:50px 0;
}


/************************** index starts**************************/

.admin_rope img {
    width: 56px;
    height: 265px;
}

.rope {
    margin-left: 40px;
}

.rope2 {
    float: right;
    margin-right: 30px;
    position: relative;
    z-index: 100;
}

.admin-panel {
    width: 650px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.form_area {
    height: auto;
    background-color: rgba(255,255,255,0.8);
    background-repeat: no-repeat;
    position: relative;
    border-radius: 7px;
    box-shadow: 0 0 10px #000e1b;
    padding: 20px;
    transform: translateY(50%);
}

.form_area div {
    padding: 25px;
    text-align: center;
}

.form_area input.text-box {
    height: 44px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #8F8A8A;
}

.form_area_button {
    width: 213px;
    height: 58px;
    background-color: #0fda0c;
    border:1px solid #0db90d;
    text-align: center;
    border-radius: 10px;
    font-weight: bold;
    font-size: 24px;
    color: #FFFFFF;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 25px;
}

.forget-button {
    text-decoration: none;
    color: #000000;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    background: none;
    border: none;
}

.point2 {
    width: 671px;
    height: 338px;
    background-color: #FFFFFF;
    -ms-transform: rotate(-7deg);
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
    background-repeat: no-repeat;
    position: absolute;
    box-shadow: 2px 2px 4px #000000;
}

.base3 {
    width: 671px;
    height: 338px;
    background-color: #FFFFFF;
    background-repeat: no-repeat;
    -ms-transform: rotate(-4deg);
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
    background-repeat: no-repeat;
    position: absolute;
    box-shadow: 2px 2px 4px #000000;
}

.modal-dialog {
    width: 400px;
    margin: 20% auto;
}

.pad-lft-none {
    padding-left: 0 !important;
}

/************************** index ends**************************/
/************************** header ends**************************/
.header {
    position: relative;
    margin: 0px;
    padding: 0px;
    background: #4b6c9e;
    width: 100%;
}

.admin_header {
    /*position: relative;*/
    margin: 0px;
    padding: 0px;
    background: #00468d;
    width: 100%;
    height: 60px;
}
.ad_log_sec {
    padding:12px 15px 0 0;
}

.ad_log_sec a {
    color: #fff;
    padding: 8px 20px;
    border-radius: 24px;
}

.admin_header h1, .header h1 {
    font-weight: 700;
    margin: 0px;
    padding: 0px 0px 0px 20px;
    color: #f9f9f9;
    border: none;
    line-height: 2em;
    font-size: 2em;
}

.custom-menu {
    list-style: none;
    /* margin: 30px auto 0px auto; */
    height: 43px;
    margin: 0px auto;
    /* padding: 0px 20px 0px 20px; */
   background: #014464;
    background: -moz-linear-gradient(top, #0272a7, #013953);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0272a7), to(#013953));
    border: 1px solid #002232;
    -moz-box-shadow: inset 0px 0px 1px #edf9ff;
    -webkit-box-shadow: inset 0px 0px 1px #edf9ff;
    box-shadow: inset 0px 0px 1px #edf9ff;
}

.navbar-default .navbar-nav > li > a {
    color: #fff;
    padding: 10px 25px;
}

    .navbar-default .navbar-nav > li > a:hover {
        color: #eee;
    }
/************************** header ends**************************/
/************************** mobileno starts**************************/
.mobile-box {
    background: #fff;
    width: 100%;
    padding: 20px;
    box-shadow: 0 0 7px #222;
    color: #222;
    border-radius: 4px;
}

    .mobile-box p {
        font-weight: bold;
        text-align: center;
        font-size: 16px;
        margin-bottom: 15px;
    }

    .mobile-box label {
        margin-bottom: 15px;
    }

.m-top10 {
    margin-top: 10%;
}

.m-top7 {
    margin-top: 7%;
}

.margin-top-20 {
margin-top:20px;

}

.margin-top-home {
top:100px;
color:white;
font-weight:bold;
text-shadow:5px 1px 1px #000;
}

.date-picker {
    display: inline-block;
    width: 60%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.excutive-table, .excutive-table tr > th, .excutive-table tr > td {
    border: 1px solid #999 !important;
}
.excutive-table tr > td a {
        border-radius: 4px;
        margin: 0 10px;
        color: #fff;
    }

.chat-image-box {
    display: inline-block;
    width: 60px;
    height: 60px;
    margin-left: 15px;
}

.age-txt-box {
    width: 80%;
    display: inline-block;
    margin-right: 5px;
}

.radio-table td {
    padding: 0 20px;
}

    .radio-table td label {
        margin-left: 10px;
    }

.PagerStyle table td {
    padding: 0 5px;
}

.PagerStyle table td a {
        padding: 3px 9px;
        background: #00aeff;
        border-radius: 4px;
        color:#fff !important;
        box-shadow:2px 2px 3px #666;
        border-right:3px solid #045aa3;
        border-bottom:3px solid #045aa3; 
}
.PagerStyle table td a:hover {
     background: #008fd2;
     text-decoration:none;
}
.PagerStyle table td span {
    padding: 3px 9px;
    background: #024787;
    border-radius: 4px;
    color: rgb(255, 255, 255) !important;
    box-shadow: rgb(102, 102, 102) 2px 2px 3px;
    border-bottom: 3px solid #01325f;
    border-right: 3px solid #01325f;
}

.today-headlines {
    font-size: 22px;
    margin: 20px 0;
    color: #222;
    text-transform: uppercase;
}

.m-top-0 {
    margin-top: 0;
}

.table_retailer tr {
    background-color: transparent !important;
}

.table_retailer td {
    color: #222;
}

.table_retailer th {
    background-color: #00468D;
}

.p_bottom_50 {
    padding-bottom: 50px;
}

.purchase_box a {
    height: 21px !important;
}

.purchase_box table {
    margin-left: auto;
    margin-right: auto;
    margin-top: 35px;
}

.purchase_box tr {
    height: 50px;
}

.purchase_box_input {
    margin-left: 20px;
}

.admin_pro_input {
    width: 250px;
    display: inline-block;
}

.admin_pro_button {
    margin: -5px 0 0 10px;
}

.female_pro_area h1 {
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    margin-bottom: 15px;
}

.female_pro_area table {
    margin-left: auto;
    margin-right: auto;
}

.female_pro_area tr {
    height: 50px;
}

.female_pro_input {
    margin-left: 20px;
}

.height_scroll {
    height: 150px;
    overflow-y: scroll;
}

.mobile_valid {
    position: absolute;
    top: 8px;
    right: 0px;
}

.popupcross {
    position: absolute;
    top: 10px;
    right: 0px;
}

.vr_line {
    border-right: 1px solid #ccc;
}

.hr {
    background: #ccc;
    width: 1px;
    height: 110vh;
    float: left;
    margin: 0;
}

.giftshow_area {
    padding: 20px;
    border: 1px solid #58595b;
    background-color: #eee;
}

.giftshow td {
    padding: 20px 10px;
}

.giftshow {
    margin-left: auto;
    margin-right: auto;
}

.giftimg_area {
    height: 100px;
    width: 100px;
    overflow: hidden;
}

    .giftimg_area img {
        width: 100%;
        height: auto;
    }

.setbalance tr td {
    border: none !important;
}

.setbalance input {
    width: 200px;
}

.setbalance select {
    width: 200px;
}
.otp-alter{
    display: block;
    position: relative;
    color: red;
    font-weight: 600;
    font-size: 16px;
}
.admin-login {
    color: red;
    display: block !important;
    margin: -15px 0 5px;
}


/************************** mobileno ends**************************/


/************************** Customer Care Panel (Soubhik Nandi) starts **************************/

.cust_back {
    background: url('../phonafriendimage/Admin/back.png') no-repeat 0 0;
    height: 100vh;
    background-size:cover;
}
.form_btn {
    width: 140px;
    margin: 20px auto 0;
    display: block;
    font-weight: bold;
    font-size: 16px;
}
.form_area img {
    display: block;
    margin: 0 auto 20px;
}
.form_area h1{
    font-weight:bold;
    font-size:28px;
    color:#000;
    margin-bottom:20px;
}
.otp_input {
    height: 44px;
    text-align: center;
    font-size: 20px;
    border: 1px solid #8F8A8A;
}
.black_sec{
    padding:15px;
    border:1px solid #ccc;
}
.approval_area td{
    border-top:none !important;
}
.approval_area b{
    margin-top:20px;
}
.m_top_20{
    margin-top:20px;
}
.black_sec .top_sec span{
    font-size:18px;
    font-weight:bold;
    text-align:center;
    display:block;
}
.user_icon{
    text-align:center;
    display:block;
    font-size:18px;
    color:#00468d;
}
.mob_input input{
    margin-bottom:0px;
}
.mob_input h5 {
    margin-bottom: 10px;
}
/************************** Customer Care Panel (Soubhik Nandi) ends **************************/
/*============================== media quaries starts==============================*/
@media only screen and (max-width: 1200px) {
}

@media only screen and (max-width: 1280px) {
}

@media only screen and (min-width: 981px) and ( max-width: 1024px) {
}


@media only screen and (min-width: 768px) and ( max-width: 980px) {
    .admin_pro_button {
        width: 250px;
        margin-left: 0;
        margin-top: 10px;
        margin-bottom: 20px;
    }
}


@media only screen and (max-width: 767px) {
    .rope2 {
        margin-right: 40px;
    }

    .form_area {
        width: 100%;
    }

        .form_area input.text-box {
            width: 100%;
        }

    .admin-panel {
        width: 100%;
        margin-top: -20%;
    }

    .modal-dialog {
        width: 100%;
    }

    .navbar-collapse {
        background: #eee !important;
        background: -moz-linear-gradient(top, #eee, #fff) !important;
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eee), to(#fff)) !important;
        position: absolute;
        width: 100%;
        z-index: 30;
    }

    .navbar-default .navbar-nav > li > a {
        color: #333;
    }

        .navbar-default .navbar-nav > li > a:hover {
            color: #111;
        }

    .radio-table td {
        padding: 0 10px;
    }

    .border-none {
        border: none !important;
    }

    .purchase_box tr {
        display: grid;
        margin-top: 15px;
    }

    .purchase_box table {
        margin-left: unset;
        margin-right: unset;
        margin-top: 35px;
        width: 100%;
    }

    .admin_pro_button {
        width: 250px;
        margin-left: 0;
        margin-top: 10px;
        margin-bottom: 20px;
    }

    .female_pro_input {
        margin-left: 0;
    }


    .purchase_box_input {
        margin-left: 0;
    }

    .female_pro_area tr {
        display: grid;
        margin-top: 15px;
    }

    .vr_line {
        border-right: none;
    }
.admin_header {
width: 100%;
height: 121px;

}
}

@media only screen and (max-width: 480px) {
    .date-picker {
    width: 55%;
    }
    .get-request-btn {
    padding:6px;
    }
}

@media only screen and (max-width: 360px) {
    .get-request-btn {
    display:block;
    margin:5px auto 0;
    }
    .date-picker {
    width: 60%;
    }

}

@media only screen and (max-width: 320px) {
}

/*============================== media quaries ends==============================*/
