/*
    DEMO STYLE
*/
@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";


body {
    font-family: 'Poppins', sans-serif;
    background: #fafafa;
    text-decoration: none!important;
}

p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #999;
}

a, a:hover, a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}



.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */
.wrapper {
    display: flex;
    align-items: stretch;
}

#sidebar {
    min-width: 250px;
    max-width: 250px;
    background-color:transparent;
    color: #fff;
    transition: all 0.3s;
}

#sidebar.active {
    margin-left: -250px;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: #6d7fcc;
}

#sidebar ul.components {
    padding: 20px 0;
    border-bottom: 1px solid #47748b;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px 30px 8px 8px;
    font-size: 16px;
    display: block;
    color:#000;
}
#sidebar ul li a:hover {
    color: #fff!important;
    background: #0c3281;
}

#sidebar ul li.active > a, a[aria-expanded="true"] {
    color: #fff!important;
    background: #0c3281;
}
.list-unstyled {
    background-color: transparent;
}

a[data-toggle="collapse"] {
    position: relative;
}

a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
    content: '\e259';
    display: block;
    position: absolute;
    right: 20px;
    font-family: 'Glyphicons Halflings';
    font-size: 1em;
    margin-top: 0!important;
}
a[aria-expanded="true"]::before {
    content: '\e260';
}


ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
}

ul.CTAs {
    padding: 20px;
}

ul.CTAs a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 5px;
    margin-bottom: 5px;
}

a.download {
    background: #fff;
    color: #7386D5;
}

a.article, a.article:hover {
    background: #6d7fcc !important;
    color: #fff !important;
}


.collapse li {
    color:white!important;
    font-size:16px;
}
.font-16{
    font-size:16px;
}
/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */
#content {
    padding: 20px;
    min-height: 100vh;
    transition: all 0.3s;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
    #sidebar {
        margin-left: -250px;
    }
    #sidebar.active {
        margin-left: 0;
    }
    #sidebarCollapse span {
        display: none;
    }
}
  .graphic-map {
            width:100%;
            height:500px;
        }
        
        .respon-content-contactus-hide {
                display:none;
        }
        .respon-content-contactus-show {
                display:inline;
        }
        
        .working-time {
            padding:10px;
            color:white;
            padding-left:10px;
            background-color: #0c3281;
            
            
            
        }
        @media (max-width: 768px) {
            .graphic-map {
                width:100%;
                height:auto;
            }
            .respon-content-contactus-hide {
                display:inline;
        }
            .respon-content-contactus-show {
                display:none;
        }
        }
        .frame-contact{
            border:2px solid #0c3281;
        }
        .cl-b {
            color:#0c3281;
        }
        .cl-r {
            color:firebrick;
        }
        .text-line-bottom {
            position: relative;
            margin-bottom: 20px;
            padding-bottom: 1px;
        }
        .cl-bold-text{
            color:#5b5b5b;
        }
        
        .text-line-bottom::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: 0;
            width: 40px;
            height: 3px;
            background-color: #0c3281;
        }
        
              @media (min-width: 830px){
           
                
                  .position-listing:after {
                    left: 0;
                }
            }
        
            .tier a {
                font-weight: 400;
                color: #39c;
            }
                .position-listings ul li {
                    line-height: 1;
                    width:100%;

                }
            .position-listing:after {
                content: '';
                display: block;
                position: absolute;
                left: -24px;
                right: 0;
                top: 0;
                bottom: -1px;
                background-color: #f9fcfd;
                z-index: -1;
                border: solid 1px #39c;
                opacity: 0;
                transform: scale(.98);
                transform-origin: right;
                transition: transform .25s ease,opacity .25s ease;
            }
        
                .position-category {
                    box-sizing: border-box;
                    position: relative;
                    width: 100%;
                    padding: 32px 24px 32px 24px;
                    border: solid 1px #e4e4e4;
                    border-left-width: 2px;
                }
                h4+.position-category {
                    margin-top: 16px;
                }
                .position-listings ul{
                        list-style: none;
                }
                .position-listings ul, .position-listings ul li{
                        margin: 0;
                     padding: 0;
                }
                .position-listing, .position-empty {
                    box-sizing: border-box;
                    position: relative;
                    display: flex;
                    padding: 18px 0;
                    align-items: center;
                    text-decoration: none;
                }
                .position-listing:before, .position-empty:before {
                    content: '';
                    display: block;
                    position: absolute;
                    left: 0;
                    right: 0;
                    bottom: -1px;
                    height: 1px;
                    z-index: -1;
                    background-color: #e4e4e4;
                }
        @media (min-width: 446px){
            .position-listing-info {
                display: flex;
                align-items: center;
                justify-content: space-between;
            }
            .position-listing-modifiers {
                max-width: 190px;
                margin-top: 0;
                text-align: right;
            }
        }
        .position-listing-info {
            box-sizing: border-box;
            flex: 1;
        }
        .position-listing-title {
            box-sizing: border-box;
            flex: 1;
            padding-right: 16px;
            font-size: 24px;
            line-height: 24px;
            color: #222;
            padding-left: 10px;
        }
                  
          .position-listing-modifiers {
                box-sizing: border-box;
                padding-right: 24px;
                margin-top: 4px;
                font-size: 14px;
                line-height: 18px;
                color: #666;
            }
            .position-listing-action {
                box-sizing: border-box;
                padding-right: 15px;
                font-size: 20px;
                color: #39c;
            }
            .position-listing-action:after {
                display: inline-block;
                margin-left: 8px;
                transition: transform .2s ease;
            }
            .position-listings-list:hover {
                border: 1px solid;
                border-image-slice: 4;
                border-width: 1px;
                background-color: rgba(245, 245, 245 , 0.5);
                border-image-source: linear-gradient(to right, #031f48, #004372, #006b9a, #0095be, #00c1de);
                color:#0c3281;
            }
               .contact-social{
            background-image: url(images/spwires/social.jpg);
            height: 150px;
        }
        
        .jobad-buttons{
            margin-top: .5rem;
        }
        .interesting {
            display: block;
            background-color: #0c3281 !important;
            color: #FFFFFF !important;
            border-style: none !important;
            padding: .8rem;
            width: 100%;
            min-width: 0; 
            border-radius: 40px;
            font-size: 18px;
            padding-top:15px;
        }
        
        .a-color{
            color:black;
        }
        .area-form-join-us{
            padding-top:40px;
        }
        .form-group{
            margin-bottom: .5rem;
        }
        .important-label:after{
            content: "*";
            color: #da0830;
            font-size: 2rem;
            margin-left: .5rem;
        }
        .label-text {
            font-size: 20px;
            font-weight: 500;
        }
        .add{
            background: none;
            color: #0c3281;
            border: 2px solid #0c3281;
            border-radius: 5rem;
            min-width: 10rem;
            min-height: 2rem;
            font-size: 18px;
            font-weight: 500;
        }
        .form-add{
            padding: 1.5rem 2rem;
            border-radius: .8rem;
            background: #fbfbfb;
            border: 1px solid #e0e0e0;
        }
        .form-control {
        font-size: 18px;
        }
        
        .add:hover{
           -webkit-box-shadow: 2px 4px 10px -1px rgba(0,0,0,0.2);
            -moz-box-shadow: 2px 4px 10px -1px rgba(0,0,0,0.2);
            box-shadow: 2px 4px 10px -1px rgba(0,0,0,0.2);
        }
        
         .save{ 
            background: #0c3281;
            color: #fff;
            border: 2px solid #0c3281;
            min-width: 9rem;
            min-height: 2rem;
            font-size: 18px;
            font-weight: 
        }
        
        .cancel{
            background: none;
            color: #0c3281;
            border: 2px solid #0c3281;
            min-width: 9rem;
            min-height: 2rem;
            font-size: 18px;
            font-weight: 500;
        }
        
        .h1, .h2, .h3, h1, h2, h3 {
            margin-top: 0px;
            margin-bottom: 0px;
        }
        .experience-top-area {
            padding-top:20px;
        }
        #drop-region {
            background-color: #fff;
            border: 2px dashed #0c3281;
            border-radius:20px;
            box-shadow:0 0 35px rgba(0,0,0,0.05);
            width:400px;
            padding:60px 40px;
            text-align: center;
            cursor:pointer;
            transition:.3s;
        }
        #drop-region:hover {
            box-shadow:0 0 45px rgba(0,0,0,0.1);
        }

        #image-preview {
            margin-top:20px;
        }
        #image-preview .image-view {
            display: inline-block;
            position:relative;
            margin-right: 13px;
            margin-bottom: 13px;
        }
        #image-preview .image-view img {
            max-width: 100px;
            max-height: 100px;
        }
        #image-preview .overlay {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            right: 0;
            z-index: 2;
            background: rgba(255,255,255,0.5);
        }
        
        
        @media (max-width: 768px) { 
            #drop-region {
                background-color: #fff;
                border-radius: 20px;
                border: 2px dashed #0c3281;
                box-shadow: 0 0 35px rgba(0,0,0,0.05);
                width: 100%;
                padding: 60px 10px;
                text-align: center;
                cursor: pointer;
                transition: .3s;
            }
        }
        /* Popup box BEGIN */
.hover_bkgr_fricc{
    background:rgba(0,0,0,.4);
    cursor:pointer;
    display:none;
    height:100%;
    position:fixed;
    text-align:center;
    top:0;
    width:100%;
    z-index:10000;
}
.hover_bkgr_fricc .helper{
    display:inline-block;
    height:100%;
    vertical-align:middle;
}
.hover_bkgr_fricc > div {
    background-color: #fff;
    box-shadow: 10px 10px 60px #555;
    display: inline-block;
    height: auto;
    max-width: 551px;
    min-height: 100px;
    vertical-align: middle;
    width: 60%;
    position: relative;
    border-radius: 8px;
    padding: 15px 5%;
}
.popupCloseButton {
    background-color: #fff;
    border: 3px solid #999;
    border-radius: 50px;
    cursor: pointer;
    display: inline-block;
    font-family: arial;
    font-weight: bold;
    position: absolute;
    top: -20px;
    right: -20px;
    font-size: 25px;
    line-height: 30px;
    width: 30px;
    height: 30px;
    text-align: center;
}
.popupCloseButton:hover {
    background-color: #ccc;
}

        .tick {
  animation: correct 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transform-origin: center;
}

@keyframes correct {
  0% {
    transform: scale(0);
  }
  90% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
        .success-area{
            padding-top:30px;
        }
/* Popup box BEGIN */
        .center-btn {
            position: relative;
            background-color: transparent;
            border:1px solid #0c3281;
            padding: 10px;
            color: #0c3281;
            width: 150px;
            border-radius: 30px;
            font-size: 18px;
        }
        
        .center-btn:hover {
            position: relative;
            background-color: #0c3281;
            border:1px solid #0c3281;
            padding: 10px;
            color: #fff;
            width: 150px;
            border-radius: 30px;
            font-size: 18px;
        }
         
        .section-bg-news{
            background: #eee;
        }
        .section-news {
            padding: 30px;
            background: #fff;
            border-radius:13px;
        }
        .fw-600 {
            font-weight: 600;
        }
        .body_card_update-bottom{
            padding-bottom: 20px;
            padding-right: 10px;
        }
        .cl-yellow{
            color:yellow;
        }
        a {
            color:#000;
        }
        #view-code{
  color:#48cfad; 
  font-size:14px;
  text-transform:uppercase;
  font-weight:700;
  text-decoration:none;
  position:absolute;top:640px; left:50%;margin-left:-35px;
}
#view-code:hover{color:#34c29e;}

/* --- Product Card ---- */
#make-3D-space{
    position: relative;
    perspective: 800px;
    width:340px;
    height:500px;
    transform-style: preserve-3d;
    transition: transform 5s;
    position:absolute;    
    top:80px;
    left:50%;   
    margin-left:-167px;
}
#product-front, #product-back{
    width:335px;
    height:500px;
    background:#fff;
    position:absolute;
    left:-5px;
    top:-5px;
    -webkit-transition: all 100ms ease-out; 
       -moz-transition: all 100ms ease-out; 
         -o-transition: all 100ms ease-out; 
            transition: all 100ms ease-out; 
}
#product-back{
    display:none;
    transform: rotateY( 180deg );
}
#product-card.animate #product-back, #product-card.animate #product-front{
    top:0px;
    left:0px;
    -webkit-transition: all 100ms ease-out; 
       -moz-transition: all 100ms ease-out; 
         -o-transition: all 100ms ease-out; 
            transition: all 100ms ease-out; 
}
#product-card{
    width:325px;
    height:490px;
    position:absolute;    
    top:10px;
    left:10px;  
    overflow:hidden;
    transform-style: preserve-3d;
    -webkit-transition:  100ms ease-out; 
       -moz-transition:  100ms ease-out; 
         -o-transition:  100ms ease-out; 
            transition:  100ms ease-out;
}
div#product-card.flip-10{
     -webkit-transform: rotateY( -10deg );
         -moz-transform: rotateY( -10deg );
           -o-transform: rotateY( -10deg );
              transform: rotateY( -10deg );
               transition:  50ms ease-out;          
}
div#product-card.flip90{
     -webkit-transform: rotateY( 90deg );
         -moz-transform: rotateY( 90deg );
           -o-transform: rotateY( 90deg );
              transform: rotateY( 90deg );
               transition:  100ms ease-in;          
}
div#product-card.flip190{
     -webkit-transform: rotateY( 190deg );
         -moz-transform: rotateY( 190deg );
           -o-transform: rotateY( 190deg );
              transform: rotateY( 190deg );
               transition:  100ms ease-out;             
}
div#product-card.flip180{
     -webkit-transform: rotateY( 180deg );
         -moz-transform: rotateY( 180deg );
           -o-transform: rotateY( 180deg );
              transform: rotateY( 180deg );
               transition:  150ms ease-out;             
}
#product-card.animate{
    top:5px;
    left:5px;
    width:335px;
    height:500px;
    box-shadow:0px 13px 21px -5px rgba(0, 0, 0, 0.3);
    -webkit-transition:  100ms ease-out; 
       -moz-transition:  100ms ease-out; 
         -o-transition:  100ms ease-out; 
            transition:  100ms ease-out; 
}
.stats-container{
    background:#fff;    
    position:absolute;
    top:386px;
    left:0;
    width:265px;
    height:300px;
    padding:27px 35px 35px; 
    -webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out;
}
#product-card.animate .stats-container{
    top:272px;
    -webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out; 
}
.stats-container .product_name{
    font-size:22px;
    color:#393c45;  
}
.stats-container p{
    font-size:16px;
    color:#b1b1b3;  
    padding:2px 0 20px 0;
}
.stats-container .product_price{
    float:right;
    color:#48cfad;
    font-size:22px;
    font-weight:600;
}
.image_overlay{
    position:absolute;
    top:0;
    left:0; 
    width:100%;
    height:100%;
    background:#48daa1;
    opacity:0;  
}
#product-card.animate .image_overlay{
    opacity:0.7;    
    -webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out; 
}
.product-options{
    padding:2px 0 0;
}
.product-options strong{
    font-weight:700;
    color:#393c45;
    font-size:14px;
}
.product-options span{  
    color:#969699;
    font-size:14px;
    display:block;
    margin-bottom:8px;
}
#view_details{  
    position:absolute;
    top:112px;
    left:50%;
    margin-left:-85px;  
    border:2px solid #fff;
    color:#fff;
    font-size:19px;
    text-align:center;
    text-transform:uppercase;
    font-weight:700;
    padding:10px 0;
    width:172px;    
    opacity:0;
    -webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out; 
}
#view_details:hover{    
    background:#fff;
    color:#48cfad;
    cursor:pointer;

}
#product-card.animate #view_details{
    opacity:1;
    width:152px;
    font-size:15px;
    margin-left:-75px;
    top:115px;
    -webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out;         
}
div.colors div{
    margin-top:3px;
    width:15px; 
    height:15px;    
    margin-right:5px;
    float:left;
}
div.colors div span{
    width:15px; 
    height:15px; 
    display:block;
    border-radius:50%;
}
div.colors div span:hover{
    width:17px;
    height:17px;
    margin:-1px 0 0 -1px;
}
div.c-blue span{background:#6e8cd5;}
div.c-red span{background:#f56060;}
div.c-green span{background:#44c28d;}
div.c-white span{
    background:#fff;
    width:14px;
    height:14px; 
    border:1px solid #e8e9eb;
}
div.shadow{
    width:335px;height:520px;
    opacity:0;
    position:absolute;
    top:0;
    left:0;
    z-index:3;
    display:none;
    background: -webkit-linear-gradient(left,rgba(0,0,0,0.1),rgba(0,0,0,0.2));
    background: -o-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2)); 
    background: -moz-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2)); 
    background: linear-gradient(to right, rgba(0,0,0,0.1), rgba(0,0,0,0.2)); 
}
#product-back div.shadow{
    z-index:10;
    opacity:1;
    background: -webkit-linear-gradient(left,rgba(0,0,0,0.2),rgba(0,0,0,0.1));
    background: -o-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); 
    background: -moz-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); 
    background: linear-gradient(to right, rgba(0,0,0,0.2), rgba(0,0,0,0.1)); 
}
#flip-back{
    position:absolute;
    top:20px;
    right:20px;
    width:30px;
    height:30px;
    cursor:pointer;
}
#cx, #cy{
    background:#d2d5dc;
    position:absolute;
    width:0px;
    top:15px;
    right:15px;
    height:3px;
    -webkit-transition: all 250ms ease-in-out;
       -moz-transition: all 250ms ease-in-out;
        -ms-transition: all 250ms ease-in-out;
         -o-transition: all 250ms ease-in-out;
            transition: all 250ms ease-in-out;
}
#flip-back:hover #cx, #flip-back:hover #cy{
    background:#979ca7;
    -webkit-transition: all 250ms ease-in-out;
       -moz-transition: all 250ms ease-in-out;
        -ms-transition: all 250ms ease-in-out;
         -o-transition: all 250ms ease-in-out;
            transition: all 250ms ease-in-out;
}
#cx.s1, #cy.s1{ 
    right:0;    
    width:30px; 
    -webkit-transition: all 100ms ease-out;
       -moz-transition: all 100ms ease-out;
        -ms-transition: all 100ms ease-out;
         -o-transition: all 100ms ease-out;
            transition: all 100ms ease-out;
}
#cy.s2{ 
    -ms-transform: rotate(50deg); 
    -webkit-transform: rotate(50deg); 
    transform: rotate(50deg);        
    -webkit-transition: all 100ms ease-out;
       -moz-transition: all 100ms ease-out;
        -ms-transition: all 100ms ease-out;
         -o-transition: all 100ms ease-out;
            transition: all 100ms ease-out;
}
#cy.s3{ 
    -ms-transform: rotate(45deg); 
    -webkit-transform: rotate(45deg); 
    transform: rotate(45deg);        
    -webkit-transition: all 100ms ease-out;
       -moz-transition: all 100ms ease-out;
        -ms-transition: all 100ms ease-out;
         -o-transition: all 100ms ease-out;
            transition: all 100ms ease-out;
}
#cx.s1{ 
    right:0;    
    width:30px; 
    -webkit-transition: all 100ms ease-out;
       -moz-transition: all 100ms ease-out;
        -ms-transition: all 100ms ease-out;
         -o-transition: all 100ms ease-out;
            transition: all 100ms ease-out;
}
#cx.s2{ 
    -ms-transform: rotate(140deg); 
    -webkit-transform: rotate(140deg); 
    transform: rotate(140deg);       
    -webkit-transition: all 100ms ease-out;
       -moz-transition: all 100ms ease-out;
        -ms-transition: all 100ease-out;
         -o-transition: all 100ms ease-out;
            transition: all 100ms ease-out;
}
#cx.s3{ 
    -ms-transform: rotate(135deg); 
    -webkit-transform: rotate(135deg); 
    transform: rotate(135deg);       
    -webkit-transition: all 100ease-out;
       -moz-transition: all 100ms ease-out;
        -ms-transition: all 100ms ease-out;
         -o-transition: all 100ms ease-out;
            transition: all 100ms ease-out;
}
#carousel{
    width:335px;
    height:500px;
    overflow:hidden;
    position:relative;

}
#carousel ul{
    position:absolute;
    top:0;
    left:0;
}
#carousel li{
    width:335px;
    height:500px;
    float:left;
    overflow:hidden;    
}
.arrows-perspective{
    width:335px;
    height:55px;
    position: absolute;
    top: 218px;
    transform-style: preserve-3d;
    transition: transform 5s;
    perspective: 335px;
}
.carouselPrev, .carouselNext{
    width: 50px;
    height: 55px;
    background: #ccc;
    position: absolute; 
    top:0;
    transition: all 200ms ease-out; 
    opacity:0.9;
    cursor:pointer;
}
.carouselNext{
    top:0;
    right: -26px;
    -webkit-transform: rotateY( -117deg );
         -moz-transform: rotateY( -117deg );
           -o-transform: rotateY( -117deg );
              transform: rotateY( -117deg );
              transition: all 200ms ease-out;           

}
.carouselNext.visible{
        right:0;
        opacity:0.8;
        background: #efefef;
        -webkit-transform: rotateY( 0deg );
         -moz-transform: rotateY( 0deg );
           -o-transform: rotateY( 0deg );
              transform: rotateY( 0deg );
              transition: all 200ms ease-out; 
}
.carouselPrev{      
    left:-26px;
    top:0;
    -webkit-transform: rotateY( 117deg );
         -moz-transform: rotateY( 117deg );
           -o-transform: rotateY( 117deg );
              transform: rotateY( 117deg );
              transition: all 200ms ease-out; 

}
.carouselPrev.visible{
        left:0;
        opacity:0.8;
        background: #eee;
        -webkit-transform: rotateY( 0deg );
         -moz-transform: rotateY( 0deg );
           -o-transform: rotateY( 0deg );
              transform: rotateY( 0deg );
              transition: all 200ms ease-out; 
}
#carousel .x, #carousel .y{
    height:2px;
    width:15px;
    background:#48cfad;
    position:absolute;
    top:31px;
    left:17px;
    -ms-transform: rotate(45deg); 
    -webkit-transform: rotate(45deg); 
    transform: rotate(45deg);   
}
#carousel .x{
    -ms-transform: rotate(135deg);  
    -webkit-transform: rotate(135deg); 
    transform: rotate(135deg);      
    top:21px;
}
#carousel .carouselNext .x{
    -ms-transform: rotate(45deg);   
    -webkit-transform: rotate(45deg); 
    transform: rotate(45deg);       
}
#carousel .carouselNext .y{
    -ms-transform: rotate(135deg);  
    -webkit-transform: rotate(135deg); 
    transform: rotate(135deg);      
}
        .product-grid{text-align:center;padding:0 0 72px;border:1px solid rgba(0,0,0,.1);overflow:hidden;position:relative;z-index:1}
.product-grid .product-image{position:relative;transition:all .3s ease 0s}
.product-grid .product-image a{display:block}
.product-grid .product-image img{width:100%;height:aut  o}
.product-grid .pic-1{opacity:1;transition:all .3s ease-out 0s}
.product-grid:hover .pic-1{opacity:1}
.product-grid .pic-2{opacity:0;position:absolute;top:0;left:0;transition:all .3s ease-out 0s}
.product-grid:hover .pic-2{opacity:1}
.product-grid .social{width:150px;padding:0;margin:0;list-style:none;opacity:0;transform:translateY(-50%) translateX(-50%);position:absolute;top:60%;left:50%;z-index:1;transition:all .3s ease 0s}
.product-grid:hover .social{opacity:1;top:50%}
.product-grid .social li{display:inline-block}
.product-grid .social li a{color:#fff;background-color:#333;font-size:16px;line-height:40px;text-align:center;height:40px;width:40px;margin:0 2px;display:block;position:relative;transition:all .3s ease-in-out}
.product-grid .social li a:hover{color:#fff;background-color:#ef5777}
.product-grid .social li a:after,.product-grid .social li a:before{content:attr(data-tip);color:#fff;background-color:#000;font-size:12px;letter-spacing:1px;line-height:20px;padding:1px 5px;white-space:nowrap;opacity:0;transform:translateX(-50%);position:absolute;left:50%;top:-30px}
.product-grid .social li a:after{content:'';height:15px;width:15px;border-radius:0;transform:translateX(-50%) rotate(45deg);top:-20px;z-index:-1}
.product-grid .social li a:hover:after,.product-grid .social li a:hover:before{opacity:1}
.product-grid .product-discount-label,.product-grid .product-new-label{color:#fff;background-color:#ef5777;font-size:12px;text-transform:uppercase;padding:2px 7px;display:block;position:absolute;top:10px;left:0}
.product-grid .product-discount-label{background-color:#333;left:auto;right:0}
.product-grid .rating{color:#FFD200;font-size:12px;padding:12px 0 0;margin:0;list-style:none;position:relative;z-index:-1}
.product-grid .rating li.disable{color:rgba(0,0,0,.2)}
.product-grid .product-content{background-color:#fff;text-align:center;padding:12px 0;margin:0 auto;position:absolute;left:0;right:0;bottom:-27px;z-index:1;transition:all .3s}
.product-grid:hover .product-content{bottom:0}
.product-grid .title{font-size:13px;font-weight:400;letter-spacing:.5px;text-transform:capitalize;margin:0 0 10px;transition:all .3s ease 0s}
.product-grid .title a{color:#828282}
.product-grid .title a:hover,.product-grid:hover .title a{color:#ef5777}
.product-grid .price{color:#333;font-size:17px;font-family:Montserrat,sans-serif;font-weight:700;letter-spacing:.6px;margin-bottom:8px;text-align:center;transition:all .3s}
.product-grid .price span{color:#999;font-size:13px;font-weight:400;text-decoration:line-through;margin-left:3px;display:inline-block}
.product-grid .add-to-cart{color:#000;font-size:13px;font-weight:600}
@media only screen and (max-width:990px){.product-grid{margin-bottom:30px}
}


/********************* Shopping Demo-9 **********************/
.product-grid9,.product-grid9 .product-image9{position:relative}
.product-grid9{z-index:1}
.product-grid9 .product-image9 a{display:block}
.product-grid9 .product-image9 img{width:100%;height:auto}
.product-grid9 .pic-1{opacity:1;transition:all .5s ease-out 0s}
.product-grid9:hover .pic-1{opacity:0}
.product-grid9 .pic-2{position:absolute;top:0;left:0;opacity:0;transition:all .5s ease-out 0s}
.product-grid9:hover .pic-2{opacity:1}
.product-grid9 .product-full-view{color:#505050;background-color:#fff;font-size:16px;height:45px;width:45px;padding:18px;border-radius:100px 0 0;display:block;opacity:0;position:absolute;right:0;bottom:0;transition:all .3s ease 0s}
.product-grid9 .product-full-view:hover{color:#c0392b}
.product-grid9:hover .product-full-view{opacity:1}
.product-grid9 .product-content{padding:12px 12px 0;overflow:hidden;position:relative}
.product-content .rating{padding:0;margin:0 0 7px;list-style:none}
.product-grid9 .rating li{font-size:12px;color:#ffd200;transition:all .3s ease 0s}
.product-grid9 .rating li.disable{color:rgba(0,0,0,.2)}
.product-grid9 .title{font-size:16px;font-weight:400;text-transform:capitalize;margin:0 0 3px;transition:all .3s ease 0s}
.product-grid9 .title a{color:rgba(0,0,0,.5)}
.product-grid9 .title a:hover{color:#c0392b}
.product-grid9 .price{color:#000;font-size:17px;margin:0;display:block;transition:all .5s ease 0s}
.product-grid9:hover .price{opacity:0}
.product-grid9 .add-to-cart{display:block;color:#0c3281;font-weight:600;font-size:14px;opacity:0;position:absolute;left:10px;bottom:-20px;transition:all .5s ease 0s}
.product-grid9:hover .add-to-cart{opacity:1;bottom:0}
@media only screen and (max-width:990px){.product-grid9{margin-bottom:30px}
}
        #sidebar a, #sidebar a:hover, #sidebar a:focus {
    color: #1d2129;
    text-decoration: none;
    transition: all 0.3s;
}

        /*--side nav --*/
        
        .navbar-default {
            background-color: transparent;
            border-color: transparent;
        }
        
        .img-hover-zoom{
            border-radius: 0px!important;
        }
        
        .shadow-card-product:hover{
            -webkit-box-shadow: 10px 10px 11px -4px rgba(0,0,0,0.07);
            -moz-box-shadow: 10px 10px 11px -4px rgba(0,0,0,0.07);
            box-shadow: 10px 10px 11px -4px rgba(0,0,0,0.07);
        }
        .search-box-product{
            border:1px solid #e1e1e1;
            border-radius: 4px;
        }
        .search_container_button_product {
            position: absolute;
            top: 0;
            right: 0;
            width: 40px;
            height: 40px;
            border: none;
            outline: none;
            cursor: pointer;
            background-color: #0c3281;
            color: white;  
        }
        .img-fluid{
            min-width: 100%;
            height: auto;
        }
        .owl-dots{
            display: none;
        }
       /* @media (max-width: 575.98px) {
              .img-hover-zoom {
                height: auto!important;
            }   
        
        }

       
        @media (min-width: 576px) and (max-width: 767.98px) {
             .img-hover-zoom {
                height: 180px!important;
            }   
        
        }

       
        @media (min-width: 768px) and (max-width: 991.98px) {
            .img-hover-zoom {
                height: 150px!important;
            }
        }

     
        @media (min-width: 992px) and (max-width: 1199.98px) {
            .img-hover-zoom {
                height: 100px!important;
            }
        }

        
        @media (min-width: 1200px) { 
              .img-hover-zoom {
                height:130px!important;
            }
        
        }


         @media (min-width: 1600px) { 
              .img-hover-zoom {
                height:220px!important;
            }
        
        }    */
        .img-hover-zoom--slowmo img {
           transition: transform .5s ease;
        }

        /* The Transformation */
        .img-hover-zoom--slowmo:hover img {
         transform: scale(1.5);
        }

        	.panel-group .panel {
		border-radius: 0;
		box-shadow: none;
		border-color: #EEEEEE;
	}

	.panel-default > .panel-heading {
		padding: 0;
		border-radius: 0;
		color: #212121;
		background-color: #FAFAFA;
		border-color: #EEEEEE;
	}

	.panel-title {
		font-size: 14px;
	}

	.panel-title > a {
		display: block;
		padding: 15px;
		text-decoration: none;
        border: 1px solid #0c3281;
	}
    
    .panel-title:hover {
        
        background-color: #0c3281;
        color: white;
        transition-delay: 0.1s;
	}    
        
	.more-less {
		float: right;
		color: #212121;
	}

	.panel-default > .panel-heading + .panel-collapse > .panel-body {
		border-top-color: #EEEEEE;
	}


 @media (min-width: 992px) and (max-width: 1199.98px) {
            .margin-index {
                    padding-top: 20px!important;
                margin-top:0px;
            }
        }

/* ----- v CAN BE DELETED v ----- */


.demo {
	padding-top: 60px;
	padding-bottom: 110px;
}

.demo-footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	padding: 15px;
	background-color: #212121;
	text-align: center;
}

.demo-footer > a {
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
	color: #fff;
}
        

@media (max-width:576){

  .table-hide{
    display:inline!important;
  }
  .table-show{
     display:none!important;
  }
  .table-2cl-w50{
     width:100%!important;
  }
}



.table-hide{
  display:none;
}

.table-show{
  display:inline;
}

.table-2cl-w50{
  width:50%;
}        

.county-space {
    padding-right:20px;
}
.image-inside-zoom {
    min-width:100%; 
    height:100%; 
    border-radius: 5px;
}
 .header-top-head {
            padding:10px;
            background: #0c3281;
            width: 100%;
        }
a {
    color:#333;
}
  .header-product-title {
            font-size: 30px;;
            font-weight: 600;
          
        }
  .product-title-btw-dowload{
    padding-left:20px;
    padding-right:20px; 
  
    font-size: 4rem;
  }
.product-title-dowload{
  
    padding-top:18px;
    font-size: 18px;
    display: inline-block;
  }
.pd-20 {
    padding-top:20px;
}
.icon-right {
    padding-right: 10px;
}
.body-product {
    font-size:20px;
    line-height: 2;
}
.boder-content-product {
    border: 1px solid #ABABAB;
    padding:10px;
    font-size:20px;
    line-height: 1.5;
}
.table {
     font-size:20px;
    line-height: 1.5;
}
.btn-info {
    color: #fff;
    background-color: #0c3281!important;
    border-color: #0c3281!important;
}
.btn-info:hover {
    color: #fff;
    background-color: #0c3281!important;
    border-color: #0c3281!important;
}
.fancybox-navigation .fancybox-button--arrow_left {
    margin-top: 30%!important;
    
}
.fancybox-navigation .fancybox-button--arrow_right {
    margin-top: 30%!important;
    
}
.fancybox-navigation .fancybox-button div{
    background: rgba(23,0,255,.6)!important;
    border-radius: 100%;
}

  .sub-dropdown {
            color: #fff!important;
            background: #0045D3!important;
        }
        
        .text-dropdown {
            color:#000;
            background: #E9E9E9;
        }
      
        .sub-dropdown-side {
            background: #B2B2B2!important;
            color:#fff;
        }
        .sub-dropdown-side:hover {
            color:#424242!important;
        }
.catalog-header {
    
}