.btn {

    display: inline-block;

    margin-bottom: 0;

    font-weight: 400;

    text-align: center;

    vertical-align: middle;

    cursor: pointer;

    background-image: none;

    border: 1px solid transparent;

    white-space: nowrap;

    padding: 6px 12px;

    font-size: 14px;

    line-height: 1.428571429;

    border-radius: 4px;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    -o-user-select: none;

    user-select: none; font-family: "droid Arabic Kufi" , Tahoma, Geneva, sans-serif;

}

.btn:focus {

    outline: thin dotted;

    outline: 5px auto -webkit-focus-ring-color;

    outline-offset: -2px

}

.btn:hover,

.btn:focus {

    color: #333;

    text-decoration: none

}

.btn:active,

.btn.active {

    outline: 0;

    background-image: none;

    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);

    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125)

}



.btn-default {

    color: #333;

    background-color: #fff;

    border-color: #ccc

}







.btn-group>.btn,

.btn-group-vertical>.btn {

    position: relative;

    float: right

}





.btn-group{ margin:8px 0 0 0; float:right;}



.prev-pg{ float:left;}





/* @media only screen and (max-width: 500px) {
  .prev-pg{ float:none;}
} */

/************/







/* Breadcrumbs from http://bootsnipp.com/snippets/featured/triangle-breadcrumbs-arrows */

.btn-breadcrumb .btn:not(:last-child):after {

  content: " ";

  display: block;

  width: 0;

  height: 0;

  border-top: 17px solid transparent;

  border-bottom: 17px solid transparent;

  border-right: 10px solid white;

  position: absolute;

  top: 50%;

  margin-top: -17px;

  right: 100%;

  z-index: 3;

}

.btn-breadcrumb .btn:not(:last-child):before {

  content: " ";

  display: block;

  width: 0;

  height: 0;

  border-top: 17px solid transparent;

  border-bottom: 17px solid transparent;

  border-right: 10px solid rgb(173, 173, 173);

  position: absolute;

  top: 50%;

  margin-top: -17px;

  margin-right: 1px;

  right: 100%;

  z-index: 3;

}



.btn-breadcrumb .btn {

  padding:6px 12px 6px 24px;

}

.btn-breadcrumb .btn:first-child {

  padding:5px 10px 6px 6px; float:right;

}

.btn-breadcrumb .btn:last-child {

  padding:6px 18px 6px 24px;

}



/** Default button **/

.btn-breadcrumb .btn.btn-default:not(:last-child):after {

  border-right: 10px solid #fff;

}

.btn-breadcrumb .btn.btn-default:not(:last-child):before {

  border-right: 10px solid #ccc;

}

.btn-breadcrumb .btn.btn-default:hover:not(:last-child):after {

  border-right: 10px solid #ebebeb;

}

.btn-breadcrumb .btn.btn-default:hover:not(:last-child):before {

  border-right: 10px solid #adadad;

}



/* The responsive part */



.btn-breadcrumb > * > div {

    /* With less: .text-overflow(); */

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

}



.btn-breadcrumb > *:nth-child(n+2) {

  display:none;

}



/* === For phones =================================== */

@media (max-width: 767px) {

    .btn-breadcrumb > *:nth-last-child(-n+2) {

        display:block;

    }

    .btn-breadcrumb > * div {

        max-width: 60px;

    }

}



/* === For tablets ================================== */

@media (min-width: 768px) and (max-width:991px) {

    .btn-breadcrumb > *:nth-last-child(-n+4) {

        display:block;

    }

    .btn-breadcrumb > * div {

        max-width: 100px;

    }

}



/* === For desktops ================================== */

@media (min-width: 992px) {

    .btn-breadcrumb > *:nth-last-child(-n+6) {

        display:block;

    }

    .btn-breadcrumb > * div { font-family: "droid Arabic Kufi" , Tahoma, Geneva, sans-serif;

/*        max-width: 170px;*/
          max-width: 400px;

    }

}