/*
* === MAIN AFF STYLES ===
*/
body{
    background: #F9F9F9;
    margin: 0;
}

#header{
    border-bottom: 1px solid #ddd;
    margin: 0px;
    background: white;
    padding: 20px 0;
}

#header .container.has-menu{
    padding-bottom: 40px;
}

#header .logo img {
    width: 100%;
}

#header .logo a{
    margin-bottom: 5px;
}

#header .title{
    margin-left: 10px;
}

#header .title h2{
    margin-top: 0;
    font-size: 24px;
    font-weight: bold;
    color: #005aab;
}

#header .title h3{
    margin: 0;
    padding: 0;
    font-size: 14px;
    color: dimgray;
}

#header .title h4{
    font-weight: bold;
    font-size: 14px;
    color: #005aab;
}

#header #main-nav{
    position: relative;
    bottom: -21px;
}


#header #main-nav li a{
    padding: 10px 5px;
    text-align: center;
}

#header #main-nav > ul.nav > li > a{
    font-weight: bold;
}

#header #main-nav > ul.nav > li.active a{
    background: #F9F9F9;
}

@media (max-width: 1000px) {
    #header .title {
        margin-top: 2em;
    }
}


@media (min-width: 768px) {
    #header #main-nav > ul.nav > li.active a{
        border-bottom-color: #F9F9F9;
    }

    #header #main-nav{
        position: absolute;
        bottom: -21px;
    }
}

#header #main-nav > ul.nav > li.active .dropdown-menu a{
    background: white;
    color: black;
}

#header #main-nav > ul.nav > li .dropdown-menu a{
    padding: 5px;
}

#header .nav .open > a, .nav .open > a:hover, .nav .open > a:focus{
    border-color: white;
}

#header .nav .dropdown-menu li.active a{
    font-weight: bold;
}

#outpage{
    background: #FAFAFA;;
    min-height: 470px;
}

#outpage{
    padding-top: 25px;
    padding-bottom: 25px;
}

#footer{
    padding: 15px 0;
    background: none;
    text-align: right;
    font-size: 12px;
    color: gray;
    border-top: 1px solid #eee;
    text-shadow: 2px 2px #eee;
}

.input-group .glyphicon{
    color: #005aab;
}

.input-group-addon{
    background: #fbfbfb;
}
.aff-panel{
    border: 1px solid #eee;
    box-shadow: 1px 1px 1px #cccccc;
    border-radius: 3px;
    background: white;
    padding: 15px;
}

.aff-panel h1 {
    padding: 0px;
    margin: 15px 0;
    font-size: 22px;
    color: #ed1a37;
}

fieldset {
    margin-top: 20px;
    padding: 0 15px;
}

fieldset legend{
    color: #005aab;
}

fieldset legend .glyphicon{
    font-size: 60%;
    margin-right: 10px;
}

label .req {
    margin-right: 5px;
    color: #ed1a37;
    font-weight: bold;
}

#content .full-width{
    width: 1004px;
}

.clear {
    clear: both;
}

.relative {
    position: relative;
}

.blue-line{
    background: #337ab7;
    padding: 10px;
    color: white;
    border-bottom: 1px solid #ddd;
}

.breadcrumb {
    background: none;
    padding: 0px 15px;
}

.stats{
    margin-top: 30px;
}

h3{
    font-size: 18px;
}


/*
* === GRID STYLE ===
*/

.aff-export-button-csv {margin: 15px 0 0 5px;}

#affiliate-admin .table-responsive{ margin-left: 5px; margin-right: 5px;}
tr.user-filters{ background: #337ab7 !important; }
.table-responsive .table{margin-bottom: 0; margin-bottom: 0; color: #000;}
.table-responsive .table-bordered > tbody > tr > td{border: 1px solid #ddd; color: #000; white-space: nowrap; vertical-align: middle;}
#defaultGrid_footer{background: #dadada;margin-right: 5px; margin-left: 5px; color: #000; padding-top: 5px; padding-bottom: 5px;}
#affiliate-admin th#surname, #affiliate-admin th#orig_country, #affiliate-admin th#camid { width: 6% !important; }
td[data-columnuniqueid="name_ban"], td[data-columnuniqueid="name_cam"] { white-space: nowrap; text-overflow:ellipsis; overflow: hidden; max-width: 120px;}
#affiliate-admin .table-bordered > thead > tr > th{border-bottom-width: 0;}
#affiliate-admin  table{ margin: 0 auto; }

.table-responsive table {	
    border-collapse: collapse;
    margin:50px auto;
}

/* Zebra striping */
.table-responsive tr:nth-of-type(odd) {
    background: #eee;
}

.table-responsive th {
    background: #337AB7;
    color: white;
    font-weight: bold;
}

.table-responsive th a{
    color: #fff;
}

.table-responsive td, .table-responsive th {
    padding: 10px; 
    border: 1px solid #ccc;
}

/*
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	.table-responsive table {
	  	width: 100%;
	}

	/* Force table to not be like tables anymore */
	.table-responsive table, .table-responsive thead, .table-responsive tbody, .table-responsive th, .table-responsive td, .table-responsive tr {
		display: block;
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	.table-responsive thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	.table-responsive tr { border: 1px solid #ccc; }

	.table-responsive td {
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee;
		position: relative;
		padding-left: 50%;
	}

	.table-responsive td:before {
		/* Now like a table header */
		/*position: absolute;*/
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
		/* Label the data */
		content: attr(data-columnContent);

		color: #000;
		font-weight: bold;
	}

}
/*
* === AUTOTERM CSS ===
*/
.autoterm-hotel{
    width: 220px;
    height: 90px;
    display: block;
    background-color: rgba(255, 255, 255, 0.8);
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
    font-family: Arial;
    font-size: 11px;
}

.autoterm-hotel a{
    text-decoration: none;
    display: block;
    color: #005baa;
}

.autoterm-hotel div {
    display: block;
}

.autoterm-hotel img {
    width: 70px;
    height: 60px;
    float: left;
    margin: 10px;
}

.autoterm-hotel .title{
    margin-top: 10px;
    font-weight: bold;
    font-size: 12px;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.autoterm-hotel .price{
    color: red;
    float: right;
    font-weight: bold;
    margin-right: 10px;
    margin-bottom: 5px;
    font-size: 12px;
}

.autoterm-hotel .destination{
    color: red;
    font-weight: bold;
}

#preview-panel{
    border: 1px dashed silver;
    padding: 15px;
}

/*
* === DYNAMIC BANNERS ===
*/
#banner-panel .autoterm[data-width="750"] .autoterm-hotel {
    margin-top: 0;
    float: right;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

#banner-panel .leaderboard750x100 .autoterm-hotel{
    max-width: 150px;
    height: auto;
}

#banner-panel .wideSkyscraper160x600 .autoterm-hotel:first-child {
    float: left;
    margin-top: 125px;    
}

#banner-panel .wideSkyscraper160x600 .autoterm-hotel{
    height: auto;
    max-width: 150px !important;
    padding-left: 10px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
#banner-panel .wideSkyscraper160x600 .autoterm-hotel img{
    width: 130px !important;
    height: auto;
    margin-left: 0;
}

#banner-panel .wideSkyscraper160x600 .autoterm-hotel .title{
    clear: both;
}

#banner-panel .square250x250 .autoterm-hotel:first-child {
    margin-top: 90px;
    margin-bottom: 5px;
}

#banner-panel .square250x250 .autoterm-hotel{
    height: 73px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
#banner-panel .square250x250 .autoterm-hotel .title{
    margin-top: 5px;
    line-height: 1;
}

#banner-panel .square250x250 .autoterm-hotel img{
    margin: 5px;
}

#banner-panel .extraWideSkyscraper300x600 .autoterm-hotel:first-child {
    margin-top: 125px;
    margin-bottom: 5px;
}

#banner-panel .extraWideSkyscraper300x600 .autoterm-hotel{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#banner-panel .skyscraper120x600 .autoterm-hotel:first-child {
    margin-top: 120px;
    margin-bottom: 5px;
}

#banner-panel .skyscraper120x600 .autoterm-hotel{
    height: auto;
    width: 115px !important;
}

#banner-panel .skyscraper120x600 .autoterm-hotel .title{
    margin-top: 5px;
    line-height: 1;
    clear: both; 
}

#banner-panel .skyscraper120x600 .autoterm-hotel{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding-left: 5px;
    padding-right: 5px;
}

#banner-panel .skyscraper120x600 .autoterm-hotel img{
    width: 105px !important;
    height: auto;
    margin-left: 0;
}

#banner-panel .skyscraper120x600 .autoterm-hotel .destination{
    margin-top: 10px;
}

/*
* === autodest CSS ===
*/
.autodest-hotel{
    width: 220px;
    height: 90px;
    display: block;
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
    font-family: Arial;
    font-size: 11px;
}

.autodest-hotel a{
    text-decoration: none;
    display: block;
    color: white;
}

.autodest-hotel div {
    display: block;
}

.autodest-hotel .title{
    margin-top: 10px;
    font-weight: bold;
    font-size: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.autodest-hotel .price{
    float: right;
    font-weight: bold;
    margin-right: 10px;
    margin-bottom: 5px;
    font-size: 24px;
}

.wholediv-link { 
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;

  z-index: 1;
}   

/*
* === DYNAMIC BANNERS AUTODEST ===
*/
#banner-panel .autodest[data-width="750"] .autodest-hotel {
    margin-top: 0;
    margin-left: 200px;
    width: 350px;
    height: auto;
}
#banner-panel .autodest[data-width="750"] .autodest-hotel .price{
    color: #005baa;
}

#banner-panel .autodest[data-width="160"] .autodest-hotel {
    float: left;
    margin-top: 220px;   
    height: auto;
    max-width: 150px !important;
    padding-left: 10px;
}
#banner-panel .autodest[data-width="160"] .autodest-hotel .price {
    font-size: 16px;
    margin-top: 15px;
}
#banner-panel .autodest[data-width="160"] .autodest-hotel .title {
    clear: both;
    font-size: 24px;
}

#banner-panel .autodest[data-width="250"] .autodest-hotel {
    margin-top: 60px;
    margin-bottom: 5px;
    margin-left: 15px;
    height: 73px;
}
#banner-panel .autodest[data-width="250"] .autodest-hotel .price {
    margin-top: 15px; 
}
#banner-panel .autodest[data-width="250"] .autodest-hotel .title {
    margin-top: 5px;
}

#banner-panel .autodest[data-width="300"] .autodest-hotel {
    margin-top: 150px;
    margin-bottom: 5px;
    margin-left: 15px;
}
#banner-panel .autodest[data-width="300"] .autodest-hotel .price {
    margin-top: 15px;
}

#banner-panel .autodest[data-width="120"] .autodest-hotel{
    margin-top: 200px;
    margin-bottom: 5px;
    height: auto;
    width: 115px !important;
    padding-left: 5px;
    padding-right: 5px;
}
#banner-panel .autodest[data-width="120"] .autodest-hotel .price {
    font-size: 12px;
    margin-top: 15px;
}
#banner-panel .autodest[data-width="120"] .autodest-hotel .title {
    margin-top: 5px;
    clear: both; 
    font-size: 20px;
}
/*
* === LOGIN FORM TO ADMIN ===
*/
#login-div, #password-div{
    width: 95%;
    max-width: 600px;
    margin: 0 auto;
    background: white;
    padding: 10px;    
}

#log-get-password, #login-email{
    padding: 5px;
}
#log-get-password{
    background: none;
}

button#login-email{
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 20px;
    text-align: center;
    float: right;
}

button#login-email .glyphicon{
    padding-left: 10px;
}

.register-get-password{
    clear: both; 
    margin-top: 20px;
}

#login-form .input-group{
    margin-top: 20px;
}

#login-field p {
    padding: 0px;
    margin: 0px;
}
#log-registration{
    text-transform: uppercase;
    font-weight: bold;
    padding: 5px;
    font-size: 12px;
}

#log-registration:first-child{
    border-right: 1px solid silver;
}

.message-container .message{
    display: none;
}

.message-container .message.active{
    display: block;
}

#password-submit {
    float: right;
}

/*
* === REGISTRATION FORM ===
*/
.affiliate-form .btn{
    width: 100%;
}

/*
* === CAMPAIGN SELECT ===
*/
.campaign-select fieldset p{
    height: 80px;
    overflow: hidden;
}

.campaign-select fieldset{
    cursor: pointer;
}

.campaign-select fieldset legend{
    background: white;
    padding: 0 15px;
}

.campaign-select fieldset:hover{
    box-shadow:         0px 0px 3px 0px rgba(50, 50, 50, 0.60);
}

.campaign-select fieldset{
    transition: all 200ms;
    box-shadow:         0px 0px 1px 0px rgba(50, 50, 50, 0.30);
}

.campaign-select fieldset .btn{
    margin: 15px 0;
    width: 100%;
}

.campaign-select fieldset .img{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}


/*
* === NAPOVEDA ===
*/
#affhelp .panel-body ul {
    margin-left: 20px;
}
#affhelp .panel-title a {
    display: block;
    width: 100%;
}

#affhelp .panel-title a:after{
    content: '+';
    float: right;
    margin-right: 15px;
    font-weight: bold;
    background: #c3c3c3;
    padding: 0px 5px;
    border-radius: 10px;
    display: block;
    width: 18px;
    text-align: center;
}

#affhelp .panel-title a[aria-expanded="true"]:after {
    content: '-';
}
/*
* === LOADER ===
*/
.loader {
    margin: 30px auto;
    border: 5px solid #f3f3f3; /* Light grey */
    border-top: 5px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/*
* === CAMPAIGN FORM ===
*/
.affiliate-form-campaign .btn{
    width: 100%;
}

#allParamInputs label input[type="checkbox"]{
    display: inline;
}

.checkbox-description{
    font-weight: normal;
}

#old-filter-message{
    display: block;
}

.menu-collapsed-toggle{
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 10px 5px;
    text-align: center;
    color: #337ab7;
    background: white;
    width: 100%;
}

.xs-title .btn{
    width: 20%;
}

.homepage ul, .homepage ol {
    margin-left: 15px;
}

/* datepicker */
.ui-datepicker-year {
    color: black;
}

.affiliate-form .form-control[readonly] {
    background-color: white;
}

.dv-filter-group {
    border-radius: 3px;
    background: #eee;
    border: 2px solid #eee;
    padding: 10px;
}

.dv-filter-group.checked{
    background: #d9edf7;
    border: 2px solid #abc3cf;
}

.dv-filter-group .top-panel{
    margin-bottom: 10px;
}

.dv-filter-group .top-panel strong {
    font-size: 18px;
}

.dv-filter-group .top-panel .checkbox {
    float: right;
    width: 1.3em;
    height: 1.3em;
    margin: 0px;
}

.dv-filter-group .top-panel label.check {
    padding-right: 5px;
    line-height: 1.3em;
    float: right;
}

.dv-filter-group label{
    margin-bottom: 0px;
    font-weight: 300;
}

.dv-filter-group .form-group {
    margin-bottom: 0px;
}

.dv-filter-group .row.checkboxes {
    margin-bottom: 16px;
}

.dv-filter-type, .dv-filter-type h2{
    text-align: center;
}

.dv-filter-type .short-text{
    font-weight: 300;
}

.dv-filter-type label{
    width: 100%;
    font-weight: 300;
    border-radius: 3px;
    background: #eee;
    border: 2px solid #eee;
    padding: 10px;
}

.dv-filter-type label.checked{
    background: #d9edf7;
    border: 2px solid #abc3cf;
}

.dv-filter-type input{
    display: inline-block;
}

.search-container{
    top: 0px;
}

.css-filter-container.aff .extended-search{
    display: none;
}

.css-filter-container.aff .nav-tabs{
    display: none;
}

.css-filter-container.aff .non-extended .search-filters-row .filter-item-wrap:nth-child(n+9){
    display: block;
}

@media (max-width: 768px) {
    .css-filter-container.aff .non-extended .search-filters-row .filter-item-wrap:nth-child(n+5){
        display: block;
    }
}

.aff-login-button a {
    color: white;
}

.aff-registration-success .btn-wrapper{
    text-align: center;
}