﻿/* --------------------------------------------------------
--- B2 Yazilim A.S.
--- +90 (212) 320 7356
--- www.b2yazilim.com
--- info@b2yazilim.com
--------------------------------------------------------*/





/* VALIDATION CONTROL
--------------------------------------------------------*/
.control-warning { border-color: #c8b438 !important; }
.control-warning:focus,
.control-warning .dropdown:hover { border-color: rgba(187, 175, 34, 0.6) !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.085), 0 0 8px rgba(187, 175, 34, 0.6) !important;
       -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.085), 0 0 8px rgba(187, 175, 34, 0.6) !important;
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.085), 0 0 8px rgba(187, 175, 34, 0.6) !important;
}




/* MESSAGE
--------------------------------------------------------*/
.message { width: auto; }
.messageAbsolute { position: fixed; z-index: 10000; margin: 5px auto; top:60px; left: 0px; right: 0px; bottom: auto; min-width: 300px; max-width: 300px; }
.message .messageBox { cursor: pointer; padding: 5px; margin-bottom: 5px; 
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
       -webkit-box-shadow: 2px 2px 1px rgba(50, 50, 50, 0.25);
          -moz-box-shadow: 2px 2px 1px rgba(50, 50, 50, 0.25);
               box-shadow: 2px 2px 1px rgba(50, 50, 50, 0.25);
}
.message .messageBox i { display: inline-block; margin-right: 10px;
    font: normal normal normal 14px/1 FontAwesome; font-size: 22px; text-rendering: auto; 
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.message .messageBox ul { list-style: none; margin: 0px; padding: 0px; }
.message .messageBox ul > li { padding: 2px 0px; }

.message .info, .message .info div { color: #3091AD; }
.message .info { border: 1px solid #BCE2ED;
    background-color: #BCE2ED;
    background-image: -ms-linear-gradient(top, #EDF9FC 0%, #BCE2ED 100%);
    background-image: -moz-linear-gradient(top, #EDF9FC 0%, #BCE2ED 100%);
    background-image: -o-linear-gradient(top, #EDF9FC 0%, #BCE2ED 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #EDF9FC), color-stop(1, #BCE2ED));
    background-image: -webkit-linear-gradient(top, #EDF9FC 0%, #BCE2ED 100%);
    background-image: linear-gradient(to bottom, #EDF9FC 0%, #BCE2ED 100%);
}
.message .info i:before { content: "\f05a"; }

.message .error, .message .error div { color: #FFFFFF; }
.message .error { border: 1px solid #CC0000;
    background-color: #CC0000;
    background-image: -ms-linear-gradient(top, #FF0000 0%, #CC0000 100%);
    background-image: -moz-linear-gradient(top, #FF0000 0%, #CC0000 100%);
    background-image: -o-linear-gradient(top, #FF0000 0%, #CC0000 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FF0000), color-stop(1, #CC0000));
    background-image: -webkit-linear-gradient(top, #FF0000 0%, #CC0000 100%);
    background-image: linear-gradient(to bottom, #FF0000 0%, #CC0000 100%);
}
.message .error i:before { content: "\f057"; }

.message .warning, .message .warning div { color: #B25900; }
.message .warning { border: 1px solid #FFE682; 
    background-color: #FFE682;
    background-image: -ms-linear-gradient(top, #FFFFC4 0%, #FFE682 100%);
    background-image: -moz-linear-gradient(top, #FFFFC4 0%, #FFE682 100%);
    background-image: -o-linear-gradient(top, #FFFFC4 0%, #FFE682 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFC4), color-stop(1, #FFE682));
    background-image: -webkit-linear-gradient(top, #FFFFC4 0%, #FFE682 100%);
    background-image: linear-gradient(to bottom, #FFFFC4 0%, #FFE682 100%);
}
.message .warning i:before { content: "\f059"; }

.message .success, .message .success div { color: #468C00; }
.message .success { border: 1px solid #82FFA2;
    background-color: #82FFA2;
    background-image: -ms-linear-gradient(top, #DFFFE8 0%, #82FFA2 100%);
    background-image: -moz-linear-gradient(top, #DFFFE8 0%, #82FFA2 100%);
    background-image: -o-linear-gradient(top, #DFFFE8 0%, #82FFA2 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #DFFFE8), color-stop(1, #82FFA2));
    background-image: -webkit-linear-gradient(top, #DFFFE8 0%, #82FFA2 100%);
    background-image: linear-gradient(to bottom, #DFFFE8 0%, #82FFA2 100%);
}
.message .success i:before { content: "\f058"; }

@media (max-width: 350px) {
    .message { min-width: inherit; max-width: inherit; }
}




/* TABS
--------------------------------------------------------*/
.tab {  }
.tab > ul { list-style-type: none; margin:0px; padding:0px; }
.tab .tabMenu > li { display: inline-block; vertical-align: bottom; }
.tab .tabMenu li > a, .tab .tabMenu li > input {
    white-space: nowrap;
    display: inline-block;
    font-size: 13px;
    padding: 5px 14px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    text-shadow: none;
    background-repeat: repeat-x;
    border: 1px solid #C9C9C9;
    border-bottom: 0px;
    color: #999;
    background-color: #F0F0F0;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-topright: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    -webkit-border-bottom-left-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomleft: 0px;
    -moz-border-radius-bottomright: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}
.tab .tabMenu li > input { padding: 3px 14px; }
.tab .tabMenu li > a:hover, .tab .tabMenu li > input:hover { color: #555; background-color: #E5E5E5 !important; background-position: 0 -10px; }
.tab .tabMenu .active > a, .tab .tabMenu .active > input {
    color: #ffffff;
    background-color: #49afcd;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));
    background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
    background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
    background-image: linear-gradient(to bottom, #5bc0de, #2f96b4);
    background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
    background-repeat: repeat-x;
    border-color: #2f96b4 #2f96b4 #1f6377;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
    filter: progid:dximagetransform.microsoft.gradient(enabled=false);
    cursor: default;
}
.tab .tabMenu .active > a:hover, .tab .tabMenu .active > input:hover { color: #ffffff; background-color: #49afcd !important; background-position: 0 0px; }
.tab .tabMenu .active > input { padding: 4px 14px; }

.tab .tabContent { background-color: #FFF;
    border-bottom: 1px solid #C9C9C9; border-right: 1px solid #C9C9C9; border-top: 2px solid #369dbb; border-left: 1px solid #E5E5E5;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}
.tab .tabContent > li { display: none; width: inherit; height: inherit; }
.tab .tabContent > .active { display: block; }

.tabVertical { display: table; }
.tabVertical > ul { display: table-cell; }
.tabVertical .tabMenu > li { display: block; margin-bottom: 3px; white-space:nowrap; }
.tabVertical .tabMenu > li > a, .tabVertical .tabMenu li > input {
    border-bottom: 1px solid #C9C9C9;
    border-right: 0px;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-topright: 0px;
    border-top-left-radius: 3px;
    border-top-right-radius: 0px;
    -webkit-border-bottom-left-radius: 3px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomleft: 3px;
    -moz-border-radius-bottomright: 0px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 0px;
}
.tabVertical .tabContent { vertical-align: top; border-top: 1px solid #C9C9C9; border-left: 2px solid #369dbb; width: 100%;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
}


/* WATERMARK
--------------------------------------------------------*/
.watermark { color: #B0B0B0; }
::-webkit-input-placeholder { color: #B0B0B0; } /* WebKit browsers */
:-moz-placeholder { color: #B0B0B0; opacity: 1; } /* Mozilla Firefox 4 to 18 */
::-moz-placeholder { color: #B0B0B0; opacity: 1; } /* Mozilla Firefox 19+ */
:-ms-input-placeholder { color: #B0B0B0; } /* Internet Explorer 10+ */


/* TREEVIEW
--------------------------------------------------------*/
.treeview { overflow: auto; }
.treeview .twSelected a { background-color: #2F96B4; color: #FFF; }
.treeview .twNode { padding: 2px 4px 2px 4px;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
}


/* MENU 
--------------------------------------------------------*/
/* # MENU (DETAIL)
----------------------------------------------------------*/
.menuRoot { list-style: none; margin: 0px; padding: 0px; display: inline-block; }
.menuRoot > li { position: relative; text-align: left; float: left; }
.menuRoot > li > i { margin-right: 7px; }
.menuRoot > li > a { padding: 7px 14px; display: block; position: relative; background-color: #2f96b4; color: #acd9e6;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    transition-duration: 0.5s;
}
.menuRoot > .active > a, 
.menuRoot > li:hover > a { background-color: #5ba9bf; color: #FFF; }
.menuRoot > li > a > i { margin-right: 7px; } 
.menuRoot > li > a > .menuSubIcon { font-size: smaller; margin: 0px 0px 0px 7px; }
.menuRoot > .menuSplit { width: 1px; background-color: #FFF; }


/* # SUB MENU (DETAIL)
----------------------------------------------------------*/
.subMenu { position: absolute; top: 0px; left: 100%; margin: 0px; padding: 0px; visibility: hidden; list-style: none; opacity: 0; z-index: 2;
    -webkit-transition: opacity 0.5s ease;
    -moz-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
}
.subMenu > li { position: relative; }
.subMenu > li > a { padding: 5px; background-color: #E0E0E0; color: #777; display: block; position: relative; white-space: nowrap; min-width: 150px;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    transition-duration: 0.5s;
}
.subMenu > .active > a, 
.subMenu > li:hover > a { background-color: #9ddaeb; color: #03566f; }
.subMenu > li > a > i { margin-right: 7px; display: inline-block; width: 16px; height: 16px; text-align: center; } 
.subMenu > li > a > .menuSubIcon { position: absolute; top: 27%; right: 0px; font-size: smaller; margin-right: 2px; }
.menuRoot > li > .subMenu { top: 100%; left: 0px; }
.menuHover .menuRoot > li:hover > .subMenu,
.menuHover .menuRoot .subMenu > li:hover > .subMenu { visibility: visible; opacity: 1; }


/* # MENU CONTENT
----------------------------------------------------------*/
.menuContent { position: absolute; left: 0%; visibility: hidden; opacity: 0; background-color: #E0E0E0; 
    padding: 10px; overflow: auto; z-index: 2;
    -webkit-transition: opacity 0.5s ease;
    -moz-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
}
.menuHover .menuRoot > li:hover > .menuContent,
.menuHover .menuRoot .menuContent > li:hover > .menuContent { visibility: visible; opacity: 1; }


/* # MENU RTL
----------------------------------------------------------*/
/* Menu */
.menuRTL .menuRoot > li > .subMenu { left: auto; right: 0px; }
.menuRTL .menuRoot > li > a > i { margin-right: auto; margin-left: 7px; } 
.menuRTL .menuRoot > li > a > .menuSubIcon { font-size: smaller; margin: 0px 7px 0px 0px; }

/* Sub Menu */
.menuRTL .menuRoot .subMenu { left: auto; right: 100%; }
.menuRTL .menuRoot .subMenu > li > a > i { margin-right: auto; margin-left: 2px; } 
.menuRTL .menuRoot .subMenu > li > a > .menuSubIcon { right: auto; left: 0px; }
.menuRTL .menuRoot .subMenu > li > a { text-align: right; }

/* Menu Content */
.menuRTL .menuRoot .menuContent { left: auto; right: 0%; }


/* # MENU VERTICAL
----------------------------------------------------------*/
.menuVertical .menuRoot > li { float: none; display: block; }
.menuVertical .menuRoot > .menuSplit { height: 1px; }
.menuVertical .menuRoot > li > a { padding: 7px 7px; min-width: 132px; }
.menuVertical .menuRoot > li > a > .menuSubIcon { position: absolute; top: 27%; right: 0px; font-size: smaller; margin-right: 5px; }
.menuVertical .menuContent, 
.menuVertical .subMenu { top: 0px !important; left: 100% !important; visibility: visible; opacity: 1; display: none; }


/* # MENU MOBILE
----------------------------------------------------------*/
.menuMobileButton { padding: 7px 14px; background-color: #2f96b4; color: #acd9e6; cursor: pointer; display: none;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    transition-duration: 0.5s;
}
.menuMobileButton:hover { background-color: #5ba9bf; color: #FFF; }
.menuMobile .menuContent, 
.menuMobile .subMenu { visibility: visible; opacity: 1; display: none; }
@media (max-width: 780px) {
    .menuMobileButton { display: inline-flex; }
    .menuMobile .menuRoot { display: none; }
    .menuMobile .menuRoot > li { float: none; display: block; }
    .menuMobile .menuRoot > .menuSplit { height: 1px; }
    .menuMobile .menuRoot > li > a { padding: 7px 7px; min-width: 132px; }
    .menuMobile .menuRoot > li > a > .menuSubIcon { position: absolute; top: 27%; right: 0px; font-size: smaller; margin-right: 10px; }
    .menuMobile .menuContent, 
    .menuMobile .subMenu { position: static; margin: 0px; padding: 0px; visibility: visible; list-style: none; opacity: 1; display: none; 
        margin-left: 15px; margin-top: 1px; }
    .menuMobile .subMenu > li > a { border-left: 2px solid #2f96b4; }
    .menuMobile .menuRoot > li > .subMenu { visibility: visible; display: none; background-color: #F0F0F0; }
    .menuMobile .menuRoot .subMenu > li > .subMenu:last-child { margin-bottom: 1px; }
    .menuMobile .menuContent { width: 100% !important; margin-left: 0px; margin-right: 0px; padding: 10px 10px;
        -webkit-box-sizing: border-box;
	       -moz-box-sizing: border-box;
	            box-sizing: border-box;
    }
}



/* SLIDER
--------------------------------------------------------*/
.slider { position: relative; display: inline-block; }

.sliderBody { position: relative; overflow: hidden; }
.sliderBody > ul { position: relative; margin: 0px; padding: 0px; width: inherit; height: inherit; list-style: none; }
.sliderBody > ul > li { position: relative; display: block; float: left; }

.slider .sliderButtonPrev, .slider .sliderButtonNext { position: absolute; top: 0px; bottom: 0px; z-index: 99; display: block;
    width: 25px; height: 25px; background: #5ba9bf; color: #FFFFFF; font-size: medium; opacity: 0.8; cursor: pointer; margin: auto; }
.slider .sliderButtonPrev:hover, .slider .sliderButtonNext:hover { opacity: 1; }
.slider .sliderButtonPrev i, .slider .sliderButtonNext i { position: absolute; margin: auto; width: 10px; height: 22px; font-size: 22px;
    left: 0px; right: 0px; top: 0px; bottom: 0px; display: block; }
.slider .sliderButtonNext { right: 0; }

.slider .slideBar { display: inline-block; z-index: 97; margin: auto; position: absolute; left: 2%; right: 0px; bottom: 3%; }
.slider .slideBar .sliderItem { display: inline-block; cursor: pointer; margin-right: 5px; }
.slider .slideBar .sliderItem:hover { opacity: 0.5; }
.slider .slideBar .active { opacity: 0.3; }
.slider .slideBar .sliderItem > div { display: inline-block; }
.slider .slideBar .sliderItem > div img { width: 60px; }

.slider .sliderTimeBarBody { position: absolute; top: 0px; z-index: 97; width: 100%; }
.slider .sliderTimeBarBody .sliderTimeBar { width: 0%; height: 3px; background-color: #FFF; opacity: 0.7; }



/* IMAGEBOX
--------------------------------------------------------*/
.imageboxMain { position: fixed; z-index: 901; width: 100%; height: 100%; top: 0px; left: 0px; display: none; }
.imageboxMain .imageboxBackground { position: absolute; width: 100%; height: 100%; background-color: #000; 
    top: 0px; left: 0px; opacity: 0.8; z-index: -1; }
.imageboxMain .imageboxWindow { margin: auto; position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; 
    display: table; border: 10px solid #555; background-color: #FFF;
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
       -webkit-box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.3);
          -moz-box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.3);
               box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.3);
}
.imageboxMain .imageboxContent { display: table-cell; position: relative; }
.imageboxMain .imageboxWindow .imageboxContent > .imageboxFix { display: block; }
.imageboxMain .imageboxWindow .imageboxContent > .imageBig { float: left; display: none; }
.imageboxMain .imageboxWindow .imageboxContent .imageboxButton { display: inline-block; position: absolute; color: #FFF;
    padding: 3px 7px; text-align: center; cursor: pointer; border: 1px solid #BBBBBB; background-color: #B0B0B0;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); opacity: 0.5;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
       -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    border-color: #C0C0C0 #C0C0C0 #999999; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.10) rgba(0, 0, 0, 0.25);
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
}
.imageboxMain .imageboxWindow .imageboxContent .imageboxButton:hover { border: 1px solid #B0B0B0; background-color: #C0C0C0;
    border-color: #C9C9C9 #C9C9C9 #999999; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.05) rgba(0, 0, 0, 0.15); opacity: 1;
}
.imageboxMain .imageboxWindow .imageboxContent .imageboxClose { top: 6px; right: 6px; }
.imageboxMain .imageboxWindow .imageboxContent .imageboxPrev { top: 6px; left: 6px; display: none; }
.imageboxMain .imageboxWindow .imageboxContent .imageboxNext { top: 6px; left: 38px; display: none; }
.imageboxMain .imageboxWindow .imageboxContent .imageboxTitle { position: absolute; bottom: 0px; width: 100%; cursor: default; display: none; }
.imageboxMain .imageboxWindow .imageboxContent .imageboxTitle .imageboxTitleBg { position: absolute; background-color: #000; width: 100%; 
    height: 100%; opacity: 0.5; padding: 10px;
    -webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.imageboxMain .imageboxWindow .imageboxContent .imageboxTitle span { display: block; position: relative; width: 100%; height: 100%; 
    padding: 10px; color: #F0F0F0; text-align: center;
    -webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}


/* TOOLTIP
--------------------------------------------------------*/
.tooltip { position: absolute; background-color: #2f96b4; color: #FFF; padding: 6px 8px; max-width: 500px;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
    -webkit-box-shadow: 0px 2px 1px 0px rgba(48,48,48,0.3);
    -moz-box-shadow: 0px 2px 1px 0px rgba(48,48,48,0.3);
    box-shadow: 1px 2px 2px 0px rgba(48,48,48,0.3);
}
.tooltip:after { content: ''; position: absolute; margin: auto; left: 0px; right: 0px; top: -10px; bottom: auto; border-style: solid; margin: auto; width: 0px;
    border-bottom-width: 10px; border-right-width: 10px; border-left-width: 10px; 
    border-top-color: transparent; border-right-color: transparent; border-bottom-color: #2f96b4; border-left-color:  transparent;
}


/* SCROLL TOP
--------------------------------------------------------*/
.scrollTop { padding: 8px 10px; background-color: #2f96b4; color: #FFF; cursor: pointer; text-align: center; font-size: 20px;
    position: fixed; right: 20px; bottom: -50px;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
    -webkit-box-shadow: 0px 2px 1px 0px rgba(48,48,48,0.3);
    -moz-box-shadow: 0px 2px 1px 0px rgba(48,48,48,0.3);
    box-shadow: 1px 2px 2px 0px rgba(48,48,48,0.3);
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    transition-duration: 0.5s;
}
.scrollTop:hover { opacity: 0.5; }


/* ACCORDION
--------------------------------------------------------*/
.accordion {  }