/* COMMON FORM ELEMENTS */
.info-block{
   font-size: 12px;
}

.btn-plain{
   -webkit-appearance: none !important;
   outline: none !important;
   border: 0 !important;
   background: transparent !important;
}

/* RIBBONS */
.ribbon-wrapper {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: -3px;
  right: 12px;
}

.ribbon-green {
  font: bold 15px Sans-Serif;
  color: #333;
  text-align: center;
  text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
  position: relative;
  padding: 7px 0;
  left: -5px;
  top: 15px;
  width: 120px;
  background-color: #BFDC7A;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45)); 
  background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45); 
  background-image:    -moz-linear-gradient(top, #BFDC7A, #8EBF45); 
  background-image:     -ms-linear-gradient(top, #BFDC7A, #8EBF45); 
  background-image:      -o-linear-gradient(top, #BFDC7A, #8EBF45); 
  color: #6a6340;
  -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}

.ribbon-green:before, .ribbon-green:after {
  content: "";
  border-top:   3px solid #6e8900;   
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}

.ribbon-green:before {
  left: 0;
}
.ribbon-green:after {
  right: 0;
}​

/* BOX OPTIONS*/
.box-option{
   padding: 15px;
   border: 1px solid #cccccc;
   clear: both;
   display: flex;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   cursor: pointer;
   margin-bottom: 10px;
}  

.box-option-controll-wrapper{

}

.box-option-text-wrapper{
   margin-left: 10px;
}

.box-option-text-wrapper .option-label{
   font-weight: bold;
}

.box-option-text-wrapper .option-html{
   font-size: 10px;
}

.box-option:hover{
   background-color: #dddddd;
}

.box-option.selected{
   background-color: #aaaaaa;
}

.box-option.selected .option-label{
   color: #FFFFFF;
}

.box-option.selected .option-html{
   color: #FFFFFF;
}

/* SELECTPICKER */
.bootstrap-select .dropdown-menu {
  max-width: 200px;
}
.bootstrap-select .dropdown-menu span.text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* CHECKBOX AND RADIO BUTTON */
.fancy-checkbox, .fancy-radio{
   width:20px;
   height:20px;
   display:inline-block;
   cursor:pointer;
   float: left;
/*   vertical-align: middle;*/
}
.fancy-checkbox{
   background: url(../img/controls/fancy-checkbox-black.png) 0px 0px no-repeat;
}
.fancy-radio{
   background:url(../img/controls/fancy-radio-black.png) 0px 0px no-repeat;
}

/* HOVER DOESNT WORK ON MOBILE DEVICE */
/* Issue on mobile device. When clicked to uncheck stays as hover state */
/*
.fancy-checkbox:hover, .radio:hover{
   background-position:0px -20px;
}
.checked:hover{
   background-position:0px -60px;
}
*/

.checked{
   background-position:0px -20px;
}
.fancy-checkbox.disabled, .fancy-radio.disabled{
   filter:alpha(opacity=50);
   -moz-opacity:.50;
   opacity:.50;
}
.disabled.checked{
   background-position:0px -20px;
}
input[type='checkbox'].fancy-checkbox-element, input[type='radio'].fancy-radio-element{
   display:none;
}
.fancy-control-label{
   display: table-cell;
   padding-left: 10px !important;
}

/* FILE INPUT */
.btn-file {
    position: relative;
    overflow: hidden;
}
.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}
input[readonly] {
  background-color: white !important;
  cursor: text !important;
}

/* TABS */
/* Tabs */
.tab_div{
	margin:10px 0px 0px 0px;
	/*border:#FF0000 1px solid;*/
}
.tab_content{
	display:none;
	/*position:relative;
	overflow:hidden;
	height:0px;*/
}
.tab_ul{
	list-style:none;
	border-bottom:#DFDFDF 1px solid;
	/*border:#000000 1px solid;*/
	padding:0px;
	height:40px;
	margin-left:0px;
	position:relative;
}
.tab_ul li{
	position:relative;
	background:#F3F3F3;
	list-style:none;
	float:left;
	/*display:inline;*/
	border-top:#DFDFDF 1px solid;
	border-left:#DFDFDF 1px solid;
	border-right:#DFDFDF 1px solid;
	border-bottom:#DFDFDF 1px solid;
	padding:0px 10px;
	height:40px;
	line-height:40px;
	margin:0px 0px 0px 2px;
	-moz-border-radius: 3px 3px 0px 0px;
	-webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
	border-radius:3px 3px 0px 0px;
	cursor:pointer;
}
.tab_ul li.tab_selected{
	background:#FFFFFF;
	/*height:36px;*/
	/*line-height:36px;*/
   border-bottom:#FFFFFF 1px solid;
}
.tab_ul li.tab_selected a{
	/*color:#939393;*/
   color: #666666;
}
.tab_ul li a, .tab_ul li a:visited, .tab_ul li a:active {
	color:#666666;
	text-decoration:none;
	display:block;
}

/* Drop-down menu */
.dropdown-menu {
   padding:10px;   
   z-index: 3;
}
.dropdown-backdrop{
    position: static;
}

/* Inital dropdown menu full width */
.dropdown-menu.full-width{
    width: 1140px;
}

/* Adjust offset per each top menu item */
.dropdown-menu.printing-services{  
   left: -86px;
}

.dropdown-menu .multi-column-header{
   border-bottom: 1px #CCCCCC solid;
   padding: 5px 0px;
   font-weight: bold;
}

.dropdown-menu .multi-column-link{
   display: block;
   margin-top: 5px;
}

/* MODALS */
.rb-modal-overlay{ /* Overlay for modal window */
   position:fixed;
   top:0px;
   left:0px;
   overflow:hidden;
   background-color:#666666;
   filter:alpha(opacity=60);
   -moz-opacity:.60;
   opacity:.60;
}
.rb-modal-overlay.warning-win{
   background-color:#990000;
}

/* Main Style for Modals */
.rb-modal-container{
   width:970px;
   padding: 15px;
}

.rb-modal-container.w300{
   width: 300px;
}

.rb-modal-wrapper{
   top:-9999px;
   left:-9999px;
   position: absolute;
   display:block; /* before was at none. Set to block for jquery ui position. it has problem detecting position of hiddent elements */
   background:#FFFFFF;
}
/*
.btn_med.rb-modal-button-bar-btn{ /* Setting up buttons in the modal 
   margin:0px 5px;
}
*/

.rb-modal-button-bar{
   border-top:#CCCCCC 1px solid;
   padding:10px 10px;
}
.rb-modal-button-bar .btn{
   margin-right: 10px;
}
.rb-modal-button-bar .btn:last-child{
   margin-right: 0px;
}

.rb-modal-content{
   color:#666666;
   padding:0px;
}
.rb-modal-title-bar{
   height:50px;
   line-height:50px;
   /*background:url(../img/modal/titlebar_normal_bg.png) repeat-x;*/
   background-color: #31b0d5;
   color:#FFFFFF;
   /*font-family:Tahoma;*/
   /* font-weight:bold;*/
   /*font-size:24px; */
   padding:0px 15px;
}
.rb-modal-titlebar-button-containter{
   float:right;
   /*width:16px;*/
   /*height:16px;*/
   line-height: 18px;
   -moz-border-radius: 5px;
   -webkit-border-radius:5px;
   border-radius:5px;
   border:transparent 1px solid;
   /*padding-top:6px;*/
   /*padding-left:6px;*/
   margin-top:15px;
   margin-left:10px;
   cursor:pointer;
}
.rb-modal-titlebar-button-containter:hover{
   /* border:#FFF 1px solid; */
}
.rb-modal-titlebar-button{
   font-size: 18px;
   /*width:10px;*/
   /*height:10px;*/
   /*background-repeat:no-repeat;*/
   /*background-image:url(../img/modal/modal_win_toolbar.png);*/
}
.rb-modal-pointer{
   background-image:url(../img/modal/modal_grey_arrows_20x23.png);
   background-repeat:no-repeat;
}

/* Tooltip style for grey */
.rb-modal-wrapper.grey{
   border:#CCCCCC 1px solid;
   background:#333333;
   -moz-border-radius: 3px;
   -webkit-border-radius:3px;
   border-radius:3px;
   -moz-box-shadow: 0px 0px 2px 1px #999999;
   -webkit-box-shadow: 0px 0px 2px 1px #999999;
   box-shadow: 0px 0px 2px 1px #999999;
}
.rb-modal-content.grey{
   color:#FFFFFF;
   padding:10px;
   font-size: 12px;
}
.grey-pointer{
   background-image:url(../img/modal/modal_grey_arrows_20x23.png);
   background-repeat:no-repeat;
}
/* Research on class below wheather we use it or not */
.rb-modal-title-bar.grey{
   height:24px;
   line-height:24px;
   background:#000000;
   color:#FFFFFF;
   font-family:Tahoma;
   font-weight:bold;
   font-size:12px;
   padding:0px 5px;
   -moz-border-radius: 3px;
   -webkit-border-radius:3px;
   border-radius:3px;
}
/* Research on class below wheather we use it or not */
.rb-modal-close-btn.grey{
   background:url(../img/general/tooltip_grey_close_btn.png) no-repeat;
   width:10px;
   height:10px;
   float:right;
   vertical-align:middle;
   margin-top:7px;
   margin-right:5px;
   cursor:pointer;
}
/* End of the grey style */

/* Tooltip style for required */
.rb-modal-wrapper.required{
   border:#FFFFFF 2px solid;
   background:#FF0000;
   -moz-border-radius: 3px;
   -webkit-border-radius:3px;
   border-radius:3px;
   -moz-box-shadow: 0px 0px 2px 1px #999999;
   -webkit-box-shadow: 0px 0px 2px 1px #999999;
   box-shadow: 0px 0px 2px 1px #999999;
}
.rb-modal-content.required{
   color:#FFFFFF;
   padding:5px 5px 5px 5px;
   font-size: 12px;
}
.required-pointer{
   background-image:url(../img/modal/modal_red_arrows_20x23.png);
   background-repeat:no-repeat;
}
/* Research on class below wheather we use it or not */
.rb-modal-title-bar.required{
   height:24px;
   line-height:24px;
   background:#FF0000;
   color:#FFFFFF;
   font-family:Tahoma;
   font-weight:bold;
   font-size:12px;
   padding:0px 5px;
   -moz-border-radius: 3px;
   -webkit-border-radius:3px;
   border-radius:3px;
}
/* Research on class below wheather we use it or not */
.rb-modal-close-btn.required{
   background:url(../img/modal/tooltip_grey_close_btn.png) no-repeat;
   width:10px;
   height:10px;
   float:right;
   vertical-align:middle;
   margin-top:7px;
   margin-right:5px;
   cursor:pointer;
}

/* End of the grey style */
/* Style for normal */
.rb-modal-wrapper.normal-win{
   -moz-box-shadow: 0px 0px 2px 1px #222222;
   -webkit-box-shadow: 0px 0px 2px 1px #222222;
   box-shadow: 0px 0px 2px 1px #222222;
}

/* End Style popup-win-normal */
/* Style for warning-win */
.rb-modal-wrapper.warning-win{
   -moz-box-shadow: 0px 0px 2px 1px #222222;
   -webkit-box-shadow: 0px 0px 2px 1px #222222;
   box-shadow: 0px 0px 2px 1px #222222;
}
.rb-modal-title-bar.warning-win{
   //background:url(../img/modal/titlebar_warning_bg.png) repeat-x;
   background-color: #ac2925;
}

/* End Style warning-win */
/* End tooltip style */
.rb-modal-pointer-bbl,.rb-modal-pointer-bc,.rb-modal-pointer-bbr,.rb-modal-pointer-tc,.rb-modal-pointer-ttl,.rb-modal-pointer-ttr,.rb-modal-pointer-cl,.rb-modal-pointer-tll,.rb-modal-pointer-bll,.rb-modal-pointer-cr,.rb-modal-pointer-trr,.rb-modal-pointer-brr{
   position: absolute; 
   width:18px;
   height:23px;
}
.rb-modal-pointer-bbl,.rb-modal-pointer-bc,.rb-modal-pointer-bbr{
   top:100%;
}
.rb-modal-pointer-tc,.rb-modal-pointer-ttl,.rb-modal-pointer-ttr{
   top:-23px;
}
.rb-modal-pointer-cl,.rb-modal-pointer-tll,.rb-modal-pointer-bll{
   left:-18px;
}
.rb-modal-pointer-cr,.rb-modal-pointer-trr,.rb-modal-pointer-brr{
   left:100%;
}
.rb-modal-pointer-bl,.rb-modal-pointer-tl,.rb-modal-pointer-tr,.rb-modal-pointer-br{
   position: absolute; 
   width:23px;
   height:23px;
}
.rb-modal-pointer-bl,.rb-modal-pointer-tl{
   left:-16px;
}
.rb-modal-pointer-tr,.rb-modal-pointer-br{
   left:100%;
   margin-left:-7px;
}
.rb-modal-pointer-bbl,.rb-modal-pointer-bc,.rb-modal-pointer-bbr{
   background-position: -61px -4px;
}
.rb-modal-pointer-tc,.rb-modal-pointer-ttl,.rb-modal-pointer-ttr{
   background-position: -41px 3px;
}
.rb-modal-pointer-cl,.rb-modal-pointer-tll,.rb-modal-pointer-bll{
   background-position: 2px 0px;
}
.rb-modal-pointer-cr,.rb-modal-pointer-trr,.rb-modal-pointer-brr{
   background-position: -22px 0px;
}
.rb-modal-pointer-bbl{
   left:0px;
   margin-left:2px;
}
.rb-modal-pointer-bc{
   left:50%;
   margin-left:-8px;
}
.rb-modal-pointer-bbr{
   left:100%;
   margin-left:-22px;
}
.rb-modal-pointer-tc{
   left:50%;
   margin-left:-8px;
}
.rb-modal-pointer-ttl{
   left:0px;
   margin-left:2px;
}
.rb-modal-pointer-ttr{
   left:100%;
   margin-left:-22px;
}
.rb-modal-pointer-cl{
   top:50%;
   margin-top:-12px;
}
.rb-modal-pointer-tll{
   top:0px;
   margin-top:0px;
}
.rb-modal-pointer-bll{
   top:100%;
   margin-top:-24px;
}
.rb-modal-pointer-cr{
   top:50%;
   margin-top:-12px;
}
.rb-modal-pointer-trr{
   top:0px;
   margin-top:0px;
}
.rb-modal-pointer-brr{
   top:100%;
   margin-top:-24px;
}
.rb-modal-pointer-bl{
   top:100%;
   margin-top:-8px;
   background-position: -75px -35px;
}
.rb-modal-pointer-tl{
   top:0px;
   margin-top:-15px;
   background-position: -75px -10px;
}
.rb-modal-pointer-tr{
   top:0px;
   margin-top:-15px;
   background-position: -99px -10px;
}
.rb-modal-pointer-br{
   top:100%;
   margin-top:-8px;
   background-position: -99px -35px;
}


/* Responsive Styles */
@media(max-width:991px) {
   .rb-modal-container{
      width: 750px;
   }
   .rb-modal-container.w300{
      width: 300px;
   }
}

@media(max-width:767px) {  
  
  .rb-modal-container,.rb-modal-container.w300{
      width:95vw;
   }
}

@media only screen and (max-width : 480px) {   
   .rb-modal-container,.rb-modal-container.w300{
      width:95vw;
   }
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
   .rb-modal-container,.rb-modal-container.w300{
      width:95vw;
   }
}