@import url("../view/global.css");
@import url("../../css/libs/comagno/common.css");

@-webkit-keyframes loader-color
{
	0%   { color : #43afb9; text-shadow : 1px 1px 1px #000; }
	50%  { color : #265e99; text-shadow : 1px 1px 1px #fff; }
	100% { color : #43afb9; text-shadow : 1px 1px 1px #000; }
}

@keyframes loader-color
{
	0%   { color : #43afb9; text-shadow : 1px 1px 1px #000; }
	50%  { color : #265e99; text-shadow : 1px 1px 1px #fff; }
	100% { color : #43afb9; text-shadow : 1px 1px 1px #000; }
}

::-webkit-scrollbar-button { display : none; }
::-webkit-scrollbar-thumb{ background-color: #288894; }
::-webkit-scrollbar-thumb:hover{ background-color: #2e6998; border-radius: 0px; }
::-webkit-scrollbar-thumb:horizontal{ cursor : ew-resize; }
::-webkit-scrollbar-thumb:vertical{ cursor : ns-resize; }
::-webkit-scrollbar-track{ background-color: #eee; border-radius: 0px; }
::-webkit-scrollbar-track:hover{ background-color: #ddd; box-shadow: 2px 7px 2px #999; }
::-webkit-scrollbar { height: 5px; width: 5px; cursor : pointer; }


body { padding-top : 85px; font-family : "Helvetica", sans-serif; background : #f5f5f5; }
a { color : #1f8390; }

.daterangepicker { box-shadow : 2px 2px 10px rgba(0,0,0,.75); }

.input-group-addon, .form-control { border-radius : 4px; }

.panel.panel-default                { border-radius : 0px; border-top : 5px solid #2d6899; border-radius: 4px; box-shadow : 0 0 8px 0 #ccc !important; }
.panel.panel-default .panel-heading { background : #fff; color : #000; font-weight: 100; font-size: 16px; border-bottom : none; }
.panel.panel-default .panel-footer  { background : #eee; }

.modal                                        { z-index : 10000; }
.modal .modal-full                            { width : calc(100% - 40px); height : calc(100% - 60px); }
.modal .modal-full .modal-content             { height: 100%; }
.modal .modal-full .modal-content .modal-body { height: calc(100% - 55px); }

.popover                { box-shadow: 1px 4px 9px #4f5152; border-radius : 4px; border : none !important; }
.popover .popover-title { color : #000; font-weight: 100; font-size: 16px; border-top-left-radius : 4px; border-top-right-radius : 4px; background: #eee; }

.popover.bottom>.arrow         { top: -10px }
.popover.bottom > .arrow:after { border-bottom-color: #eee; }

.tooltip { transform: scale(.6); z-index: 10001; cursor : info; }
.tooltip.in {  opacity: 1 !important; transform: scale(1); }
.tooltip.right .tooltip-arrow { border-right-color: #245f96 !important; }
.tooltip.left .tooltip-arrow { border-left-color: #245f96 !important; }
.tooltip.top .tooltip-arrow { border-top-color: #245f96 !important; }
.tooltip.bottom .tooltip-arrow { border-bottom-color: #245f96 !important; }
.tooltip .tooltip-inner { background-color: #245f96; color : #fff; border-color: #245f96 !important; text-align: left; max-width: 300px; font-size: 14px; border-radius: 0; word-break: break-word; word-wrap: break-word; white-space: normal; }

.btn                   { border-radius : 4px !important; }
.btn.btn-primary,
.btn.btn-primary:focus { background : #FFAB40; color : #FFF; border-color : #da9393 !important; outline : none; }
.btn.btn-primary:hover { color : #000; }
.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }
.btn-group > .btn:first-child:not(:last-child),
.btn-group > .dropdown-toggle:not(:last-child) { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.btn-group.bootstrap-select.form-control > .btn:first-child:not(:last-child) { border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important; }

.pagination                     { border : 1px solid #ccc; box-shadow : 0 0 8px 0 #ddd; }
.pagination li a                { border : none; color : #000; background : #fff; }
.pagination li a,
.pagination li.disabled a       { background : #fff;                  }
.pagination li.disabled a       { opacity : .75;                      }
.pagination li:hover a          { background : #ddd;                  }
.pagination li.disabled:hover a { background : #eee;                  }
.pagination li.active a         { background : #ffab40; color : #fff; }

.pagination > li:first-child > a,
.pagination > li:last-child  > a { background: #fff; }

.pagination > li:first-child:hover > a,
.pagination > li:last-child:hover  > a { background : #ddd; }
#panel-pagination button { box-shadow : 0 0 8px 0 #ddd; }

.panel-group .panel                                                { margin-top: 15px; border: none; border-radius: 0px; }
.panel-group .panel.panel-default                                  { box-shadow: none !important; border: none; border-bottom: none; }
.panel-group .panel+.panel                                         { margin-top: 15px; }
.panel-group .panel .panel-heading                                 { background: #FFF; border-bottom: 1px solid #DDD; }
.panel-group .panel .panel-body                                    { border-top: none !important; }
.panel-group .panel .panel-heading .panel-title                    { font-size : 13px; }
.panel-group .panel .panel-heading .collapse-opener                { margin-top: -3px; }
.panel-group .panel+.panel .panel-heading .collapse-opener i,
.panel-group .panel .panel-heading .collapse-opener i              { font-size: 16px; }
.panel-group .panel .panel-collapse                                { background: #F5F5F5; box-shadow: inset 0px 1px 3px #CCC; }
.panel-group .panel .panel-collapse .table-responsive .table thead { background: #FFF; }

table.table.data-table tbody tr.selected td { background : rgba(255, 171, 64, .2); }

/* menu */
nav#main-menu
{
	background: #218f97;
	background: -moz-linear-gradient(45deg,rgba(33, 143, 151, 0.95) 0,rgba(31, 131, 144, 0.95) 0,rgba(31, 131, 144, 0.96) 3%,rgba(27, 103, 135, 0.85) 20%,#265e99 85%,#1f8390 100%);
	background: -webkit-linear-gradient(45deg,rgba(33, 143, 151, 0.95) 0,rgba(31, 131, 144, 0.95) 0,rgba(31, 131, 144, 0.96) 3%,rgba(27, 103, 135, 0.85) 20%,#265e99 85%,#1f8390 100%);
	background: linear-gradient(45deg,rgba(33, 143, 151, 0.95) 0,rgba(31, 131, 144, 0.95) 0,rgba(31, 131, 144, 0.96) 3%,rgba(27, 103, 135, 0.85) 20%,#265e99 85%,#1f8390 100%);

	width: 100vw;
	height: 64px;
	border-radius: 0px;

	position: fixed;
	top: 0;
   
	z-index: 9999;
}

nav#main-menu ul           { margin-top: 22px; display : inline-block; }
nav#main-menu ul li        { float: left;                              }
nav#main-menu ul li+li     { margin-left : 25px;                       }
nav#main-menu ul li a      { color: #fff; font-size: 15px; height: 51px; font-weight: 600; text-transform: uppercase; line-height: 24px; padding-top: 15px; padding-bottom: 17px; }
nav#main-menu li.sprache a { border-bottom: none; margin-right: -60px; margin-left: 60px; background: #0394a9; font-size: 13px !important; height: 20px !important; padding: 15px 10px 25px 10px; }

nav#main-menu div#main-menu-menu ul.navigation>li.active>a,
nav#main-menu div#main-menu-menu ul.navigation>li.open>a,
nav#main-menu div#main-menu-menu ul.navigation>li:hover>a,
nav#main-menu div#main-menu-menu ul.navigation>li>a:focus { background-color: initial; text-decoration: none; border-bottom: 4px solid #FFAB40; }

nav#main-menu div#main-menu-menu > li.sprache:hover>a { border-bottom: none!important; }
nav#main-menu div#main-menu-menu > li.sprache:hover>a { border-bottom: none!important; }

nav#main-menu .logo     { margin-left: 10px; margin-top: 18px; padding-left: 0; display: inline-block; }
nav#main-menu .logo img { width: 110px; }

nav#main-menu #main-menu-menu li { list-style : none; }

nav#main-menu #logout   { margin-left: 50px; }
nav#main-menu #logout a { color: #fff; font-size: 15px; height: 51px; font-weight: 600; text-transform: uppercase; line-height: 23px; padding-top: 15px; padding-bottom: 17px; }
nav#main-menu #logout.active>a,
nav#main-menu #logout.open>a,
nav#main-menu #logout:hover>a,
nav#main-menu #logout>a:focus { background-color: initial; text-decoration: none; border-bottom: 4px solid #FFAB40; }

div#form-login                    { margin-top : 100px; }
div#form-login label              { display : none;     }
div#form-login .panel .panel-body { padding-top : 20px; }

#panel-lead-filter       { margin-bottom : 12px; border : 1px solid #ccc; border-top : 5px solid #ffab40; border-radius : 4px; background : #fff; box-shadow : 0 0 8px 0 #ddd; }
#panel-leads             { margin-bottom : 12px; border-top : 5px solid #2d6899; border-radius : 4px; background : #fff; box-shadow : 0 0 8px 0 #ddd; }
#panel-advertiser-filter { margin-bottom : 12px; border : 1px solid #ccc; border-top : 5px solid #ffab40; border-radius : 4px; background : #fff; box-shadow : 0 0 8px 0 #ddd; }
#panel-advertisers       { margin-bottom : 12px; border-top : 5px solid #2d6899; border-radius : 4px; background : #fff; box-shadow : 0 0 8px 0 #ddd; }
#panel-pagination        {  }

.media-container .item.image { background-size: contain !important; }


.loader
{
	background-color: rgba(255,255,255,0.8);
	
	width  : 100%;
	height : 100%;
    
    padding  : 20px;
    
	position : absolute;
	top      : 0px;
	z-index  : 1000;
	
	padding-top : 10%;
	font-weight : bold;
	font-size   : 30px;
	
	display : none;
}
.loader .spin-loader { margin-top : 50px; }
.loader .spin-loader .circle
{
    background-color: rgba(0,0,0,0);
    border: 5px solid #ffab40;
    opacity: .9;
    border-top: 5px solid rgba(0,0,0,0);
    border-left: 5px solid rgba(0,0,0,0);
    border-radius: 50px;
    box-shadow: 0 0 35px #999;
    width: 50px;
    height: 50px;
    margin: 0px auto;
    -moz-animation: spin .5s infinite linear;
    -webkit-animation: spin .5s infinite linear;
}
.loader .spin-loader .circle2
{
    background-color: rgba(0,0,0,0);
    border: 5px solid #288894;
    opacity: .9;
    border-top: 5px solid rgba(0,0,0,0);
    border-left: 5px solid rgba(0,0,0,0);
    border-radius: 50px;
    box-shadow: 0 0 15px #999;
    width: 30px;
    height: 30px;
    margin: 0 auto;
    position: relative;
    top: -40px;
    -moz-animation: spinoff .5s infinite linear;
    -webkit-animation: spinoff .5s infinite linear;
}

@media(min-width : 768px)
{
	#main-menu svg { display : none; }
}

@media(max-width : 767px)
{
	#main-menu #logout { margin-left : 0px !important; border-top-width: 5px; }
	
	#main-menu .navigation
	{
		display: block;
	    padding: 0;
	    margin: 0;
	    position: absolute;
	    top: 63px;
	    left: 100vw;
	    right: -6px;
	    z-index: -100;
	    opacity: 0;
	    transition: 0.3s ease-in-out;
		height: 100%;
		background: rgba(0,0,0,.5);
	}
	#main-menu.sidebar-open .navigation
	{
		opacity: 1;
		transition: 0.3s ease-in-out;
		left: -1px;
		position: fixed;
		overflow: scroll;
		bottom: 0;
	}
	#main-menu.sidebar-open .navigation li
	{
		float : none;
		display: block;
		background-color: #265e99;
		border-color: #f5f5f5;
		border-left: 0px;
		border-right: 0px;
		text-transform: uppercase;
		border-radius: 0px;
		position: relative;
		margin-bottom: -1px;
		border: 1px solid #ddd;
	}
	#main-menu.sidebar-open .navigation li a
	{
		color: #fff !important;
		font-weight: 600;
		font-size: 14px;
		padding: 21px 15px;
		text-decoration: none !important;
		display: block;
	}
	
	nav#main-menu ul li+li { margin-left : 0px; }
	
	nav#main-menu div#main-menu-menu ul.navigation > li > a { border-left : 10px solid transparent; line-height : 15px; }
	nav#main-menu div#main-menu-menu ul.navigation > li.active > a,
	nav#main-menu div#main-menu-menu ul.navigation>li.open>a,
	nav#main-menu div#main-menu-menu ul.navigation>li:hover>a,
	nav#main-menu div#main-menu-menu ul.navigation>li>a:focus
	{
		border-bottom : none;
		border-left : 10px solid #FFAB40;
	}
	
	#main-menu svg { right : -5px !important; transition : 0.2s ease-in-out; }
	#main-menu svg:not(:root) { overflow: hidden; }
	#main-menu svg
	{
		position: absolute;
		top : 0px;
		right: 0;
	    width: 80px;
	    cursor: pointer;
	    -webkit-transform: translate3d(0, 0, 0);
	    -moz-transform: translate3d(0, 0, 0);
	    -o-transform: translate3d(0, 0, 0);
	    -ms-transform: translate3d(0, 0, 0);
	    transform: translate3d(0, 0, 0);
	    display: inline-block !important;
	    transition : 0.2s ease-in-out;
	}
		
	#main-menu svg path#top, #main-menu svg path#bottom
	{
	    stroke-dashoffset: 0px;
	    stroke-dashoffset: 0px;
	}
	
	#main-menu svg path#top, #main-menu svg path#bottom { stroke-dasharray: 240px 950px; }
	
	#main-menu svg path
	{
	    fill: none;
	    -webkit-transition: stroke-dashoffset 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25), stroke-dasharray 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25);
	    -moz-transition: stroke-dashoffset 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25), stroke-dasharray 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25);
	    -o-transition: stroke-dashoffset 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25), stroke-dasharray 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25);
	    -ms-transition: stroke-dashoffset 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25), stroke-dasharray 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25);
	    transition: stroke-dashoffset 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25), stroke-dasharray 0.5s cubic-bezier(0.25, -0.25, 0.75, 1.25);
	    stroke-width: 40px;
	    stroke-linecap: round;
	    stroke: #fff;
	    stroke-dashoffset: 0px;
	}
		
	#main-menu.sidebar-open svg path#top,
	#main-menu.sidebar-open svg path#bottom
	{
	    stroke-dashoffset: -650px;
	    stroke-dashoffset: -650px;
	}
	#main-menu.sidebar-open svg path#middle
	{
	    stroke-dashoffset: -115px;
	    stroke-dasharray: 1px 220px;
	}
}