
@font-face {
    font-family: exo2;
    src: url('Exo2-Regular.ttf');
}


body{
    height:100%;
    background-image: url("../img/back22.png");
    background-attachment: fixed;
    background-size: cover;

    font-family: 'exo2';
    font-weight: bold;
    color:#000000c2;
}
#indexTabs{
    top: 1%;
    left: 65%;
    position: absolute;

}
#indexTabs li{
    border:none;
    border-radius: 5px;
    background: #5bc0de;
    margin:2px 5px;
    outline: 0;

}
#indexTabs li a{
    padding:3px 5px;
    background-color: transparent !important;
}
#indexTabs li.active{
    background-color: #28a745 !important;
}
#indexTabs li:focus{
    background-color: lightblue;
    outline: 0;
}


.transfer_table {
    margin-top: 2%;
    text-align: center;
}
.search-bar {
    margin-top: 1%;
    text-align:center;
}
table th{
    text-align: center;
    background: #63B7D1;}
/*========================= SCROLL BAR ===========================*/
body::-webkit-scrollbar ,.constructed_modal::-webkit-scrollbar {
    width: 6px;
    background-color: #ECECEC;
}
body::-webkit-scrollbar-track ,.constructed_modal::-webkit-scrollbar-track  {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
body::-webkit-scrollbar-thumb ,.constructed_modal::-webkit-scrollbar-thumb{
    background-color: #63b7d2;
    outline: 1px solid black;
}

/* --------------- LOGOUT BUTTONS -------------------*/


.log_wrapper button>a{
    color:#333 !important;
    font-weight: 700;
}
.log_wrapper{
    float:right;
    width:40%;
}
.log_wrapper button.log{
    margin-top: 1%;
    margin-right: 2%;
    float: right;
    color:#333;
    font-weight: bold;
}

/*========================== arrows =============================*/
.left_arrow{
    transform: rotate(90deg) !important;
    display:inline-block;
    float:left;
}
.right_arrow{
    transform : rotate(-90deg) !important;
    display: inline-block;
    float:right;
}

.ico {
    cursor: pointer;
    margin: 0 auto;
    text-align: center;
    width: 50px;
    height: 50px;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -ms-transform: none;
     -webkit-filter: url(#goo);
     filter: url(#goo);
}
.ico .circle {
    background: #63b7d2;
    border-radius: 50%;
    display: inline-block;
    height: 50px;
    width: 50px;
    position: absolute;
    filter: url("#goo");
    -webkit-filter: url(#goo);
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform-origin: 0%;
    transform-origin: 0%;
}


.ico.anim .circle.circle-bottom {
    height: 18px;
    width: 23px;
    /*background-color: red;*/
    -webkit-animation: blob-2-anim 0.5s cubic-bezier(0.77, 0, 0.175, 1);
    animation: blob-2-anim 0.5s cubic-bezier(0.77, 0, 0.175, 1);
    z-index: 9;
    bottom: 0px;
}

.ico.anim .st-arrow {
    fill: #292d2e;
    -webkit-animation: scrolly 0.5s cubic-bezier(0.77, 0, 0.175, 1)  ;
    animation: scrolly 0.5s cubic-bezier(0.77, 0, 0.175, 1)  ;
    -webkit-perspective: 9000px;
    perspective: 9000px;
    -ms-transform: none;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
}

.svg {
    z-index: 9;
    position: relative;
}
.arrows {

}
.arrows{
    width:19%;
    margin: 0 auto;
    height:auto;
    text-align:center;
    font-size: 115%;
}

.arrows span{
    font-size:23px;
    display: inline-block;
    line-height: 228%;
}
.left_m{
    float:left;
    margin-left:10%;
}
.right_m{
    float:right;
    margin-right:10%;
}
.left{
    float:left;
}
.right{
    float:right;
}
@keyframes animate_pen_keyframe {
    20%{ box-shadow: 0px 0px 9px #4CAF50; background-color: #63BA79}
    40%{ box-shadow: 0px 0px 9px white;  }

    60%{ box-shadow: 0px 0px 9px #4CAF50; }

    100%{ box-shadow: 0px 0px 9px white;}

}


@keyframes error_animation {
    20%{  transform: translateX(20px); border-color:red; }
    40%{  transform: translateX( -15px);border-color:red;  }

    60%{  transform: translateX(10px);border-color:red;  }

    80%{  transform: translateX(-5px); border-color:red; }

    100% {  transform: translateX(0px); border-color:red; }
}

@keyframes blob-2-anim {
    0% {
        -webkit-transform: scale(1) translate(-50%, 5px);
        transform: scale(1) translate(-50%, 5px);
        -ms-transform: none;
    }
    75% {
        -webkit-transform: scale(1) translate(-50%, 13px);
        transform: scale(1) translate(-50%, 13px);
        -ms-transform: none;
    }
    100% {
        -webkit-transform: scale(1) translate(-50%, 5px);
        transform: scale(1) translate(-50%, 5px);
        -ms-transform: none;
    }
}
@keyframes scrolly {
    0% {
        -webkit-transform: translate3d(0, 0, 0) rotateX(0deg) scale(1) skewX(0deg);
        transform: translate3d(0, 0, 0) rotateX(0deg) scale(1) skewX(0deg);
        -ms-transform: none;
    }
    65% {
        -webkit-transform: translate3d(0, 50%, 0) rotateX(-90deg) scale(0.5) skewX(-3deg);
        transform: translate3d(0, 30%, 0) rotateX(-45deg) scale(0.5) skewX(-3deg);
        -ms-transform: none;
    }


    100% {
        -webkit-transform: translate3d(0, 0, 0) rotateX(0deg) scale(1) skewX(0deg);
        transform: translate3d(0, 0, 0) rotateX(0deg) scale(1) skewX(0deg);
        -ms-transform: none;
    }
}



/*-------------------------------------------------------------------------*/
.err{
    box-shadow: inset 0px 0px 5px red;
}
input:disabled{
    background: white !important;
    cursor: text !important;
}
.modal-dialog{
    width:70%;
}
.constructed_modal{
    overflow-y: scroll;
}
.hebrew{
    direction: rtl !important;
}
#user_info td i{
    font-size: 20px;
}
#user_info td i[class*='remove']{
    color:#d43f3a;
}
#user_info td i[class*='ok']{
    color:#4cae4c;
}
.nav-tabs li.active
{
background-color: #fbfbfb;
}
.nav-tabs>li>a{
    margin-right:0 !important;
}
.nav-tabs>li>a{
    color:#333;
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{
    background-color: white !important;
    color:#333;

}
#transfer_info , #agent_bookings_info {
    width: 95%;
    margin: 0 auto;
}