/*AJUSTES GENERALES
================================================================ */
* { padding: 0; margin: 0; }
ul, li { list-style-type: none; }
a { text-decoration: none; color: inherit; }
a img { border: none; border-width: 0; display: block; }
body { font-family: 'Helvetica', Arial; color:#333; font-size: 13px; }
p { line-height: 18px; margin-bottom: 5px; }
div.clr { clear: both; }

.noneRightMargin { margin-right: 0 !important; }


/*FORMS*/
/*================================================================ */
form fieldset { border: none; margin: 0 0 10px 0; padding: 0; box-sizing: border-box; width: 100%; }
form input { border: 0px; padding: 5px; box-sizing: border-box; width: 100%; outline: 0; }

/*TABLES*/
/*================================================================ */
table.print-results { width: 100%; border-collapse: collapse; margin-bottom: 20px; border: 1px solid #EAEEF1; font-size: 13px; 
	background: #f7f7f7; border-radius: 3px; }
table.print-results tr { border-bottom: 1px solid #F3F3F3; -webkit-transition: all .3s linear;  -moz-transition: all .3s linear; transition: all .3s linear; }
table.print-results tr:hover { background: #ECF6FB; }
table.print-results tr:first-child,
table.print-results tr.head { font-weight: bold; color: #788288; font-size: 12px; }
table.print-results tr td:first-child a { color: #788288; }
table.print-results tr:first-child:hover,
table.print-results tr.head:hover { background: none; }
table.print-results tr td { padding: 8px 5px; }
table.print-results tr:first-child td,
table.print-results tr.head td { padding: 15px 10px; }
table.print-results tr td:first-child { width: 20px; text-align: center; }
table.print-results tr td a.linkIcon { color: #999; -webkit-transition: all .3s linear;  -moz-transition: all .3s linear; transition: all .3s linear; }
table.print-results tr td a.linkIcon:hover { color: #333; }
table.print-results tr.showTotalCommission td { font-size: 16px; text-align: right; color: rgba(253,170,45,1) }
table.print-results tr.showTotalCommission td:nth-child(2) { font-size: 18px; text-align: left; color: #333; }

table.view tr td { padding: 8px 10px; font-size: 14px; }
table.view tr.dateImportant td { padding: 15px 10px; text-align: center !important; border: 1px solid #EAEEF1; font-size: 14px; font-weight: bold; }
table.view tr.dateImportant td:nth-child(2) { background: #c35050; color: #fff; }
table.view tr.dateImportant td.completed,
table.view tr.dateImportant td.dispatched { background: #1AAE88; }
table.view tr.dateImportant td:last-child { color: #2181BD; font-size: 20px; }

/*LOGIN*/
/*================================================================ */
.bgLogin { background: url('../src/login-background.jpg') no-repeat top center; background-size: cover; }
.overlay-login { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(42,36,32,0.9); }

#login-affiliate { width: 400px; margin: 100px auto 0; }
#login-affiliate strong { color: #fff; font-size: 14px; letter-spacing: 2px; text-align: center; display: block; margin-bottom: 50px; }
#login-affiliate strong span { font-size: 22px; display: block; margin-top: 10px; }

#login-affiliate input { 
	border-bottom: 1px solid #ccc; background: none; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;
	font-size: 14px; padding: 7px 0; color: #ccc;
}
#login-affiliate input:focus { border-bottom: 1px solid #fff; color: #fff; }
#login-affiliate input:focus ~ i { color: #fff; }
#login-affiliate input[type="submit"] { 
	background: #FDAA2D; color: #fff; padding: 12px 0; font-size: 16px; letter-spacing: 2px; border-bottom: 0; border-radius: 3px; 
	transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; cursor: pointer;
}
#login-affiliate input[type="submit"]:hover {
	background: #da8e1c;
}
#login-affiliate fieldset { margin-bottom: 20px; position: relative; }
#login-affiliate fieldset:last-child { margin-top: 40px; }

#login-affiliate fieldset i { position: absolute; right: 10px; bottom: 7px; color: #ccc; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; }

.error-login { border-bottom: 1px solid #cc3333 !important;  }
.error-login ~ i { color: #cc3333 !important; }
.failedLogin { color: #cc3333; }


/*DASHBOARD*/
/*================================================================ */
.affiliate-header { position: relative; height: 141px; background: url('../src/login-background.jpg') no-repeat center center; background-size: cover; color: #fff; margin-bottom: 30px; }
.affiliate-header .overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding-top: 15px; background: rgba(37,59,78,0.9); }

header .first-row { text-align: right; margin-bottom: 15px; }
header .first-row a { margin-left: 15px; color: #FDAA2D; padding: 5px 10px; border-radius: 3px; }
header .second-row strong { font-weight: normal; font-size: 24px; letter-spacing: 2px; }
header .second-row p,
header .second-row p strong { font-size: 14px; letter-spacing: normal; color: #ccc; }

.menu li { display: inline; }
.menu li a { color: #ccc; padding: 0 20px 10px 0; margin-right: 15px; border-bottom: transparent; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; }
.menu li a:hover,
.menu li a.current { border-bottom: 3px solid #FDAA2D; color: #fff; }

.menu li a i { margin-right: 8px; color: #ccc; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; }
.menu li a:hover > i,
.menu li a.current > i { color: #fff; }

/*VIEW DETAILS*/
.voucher, .details-voucher { float: left; box-sizing: border-box; }
.voucher { width: 30%; margin-right: 3%; text-align: center; }
.details-voucher { width: 67%; background: #EBD280; padding: 30px 10px 10px 10px; position: relative; }
.details-voucher .effect { position: absolute; top: 8px; bottom: 8px; left: -9px; background: #d3b969; width: 10px; z-index: -1; }

.voucher img { margin-bottom: 20px; }
.voucher .invoice { display: block; font-size: 18px; color: #666; }
.voucher .amount { font-size: 24px; display: block; font-weight: bold; margin-bottom: 20px; }
.voucher .completed { color: #7eb756; }
.voucher .no-completed { color: #dd5858; }
.voucher small, .voucher span { display: block; font-size: 12px; color: #666; }

.details-voucher small { color: #a58935; font-size: 13px; display: block; }
.details-voucher span { color: #000; font-size: 14px; }
.details-voucher .gridFour { float: left; width: 25%; margin-bottom: 20px; }
.details-voucher .gridTwo { float: left; width: 50%; margin-bottom: 20px; }
.details-voucher .gridThird { float: left; width: 33.3%; margin-bottom: 20px; }


.box-card-boucher { box-sizing: border-box; }
.box-card-boucher div:first-of-type { background: #213546; padding: 15px; }
.box-card-boucher div:first-of-type .arrival,
.box-card-boucher div:first-of-type i,
.box-card-boucher div:first-of-type .departure { 
	padding: 0; text-align: center; float: left; width: 33.3%; text-align: center; color: #fff; }
.box-card-boucher div:first-of-type .arrival span,
.box-card-boucher div:first-of-type .departure span { color: #ccc; font-size: 12px; display: block; }
.box-card-boucher div:first-of-type i { font-size: 52px; }

.box-card-boucher .body { background: #f7f7f7; position: relative; padding-top: 15px; }
.box-card-boucher .body .pickup { position: absolute; top: 0; left: 20px; right: 20px; background: #4f6f89; padding: 5px 0; color: #fff; font-size: 12px; text-align: center; }
.box-card-boucher .body div { background: #f7f7f7; padding: 0; }
.box-card-boucher .body div.clr { float: none !important; }
.box-card-boucher .body .row-hotel { padding: 15px; border-bottom: 1px dashed #eae8e8; background: #f7f7f7; }
.box-card-boucher .body .row-hotel div { float: left; width: 70%; }
.box-card-boucher .body .row-hotel div:nth-child(2) { width: 25%; margin-left: 5%; }
.box-card-boucher .body .row-hotel div span { display: block; font-size: 12px; }

.box-card-boucher .body .row-airport { padding: 15px; border-bottom: 1px solid #eae8e8; }
.box-card-boucher .body .row-airport div { float: left; width: 32%; text-align: center; }
.box-card-boucher .body .row-airport div:nth-child(1),
.box-card-boucher .body .row-airport div:nth-child(2) { margin-right: 2%; text-align: left; }
.box-card-boucher .body .row-airport div span { display: block; font-size: 12px; }

.box-card-boucher .body .row-service { padding: 15px; border-bottom: 1px solid #eae8e8; }
.box-card-boucher .body .row-service div { float: left; width: 50%; }
.box-card-boucher .body .row-service div span { display: block; font-size: 12px; }

.box-card-boucher .body .completed,
.box-card-boucher .body .no-completed { 
	position: relative; background: #97d66b; color: #fff; font-size: 26px; padding: 15px 10px; }
.box-card-boucher .body .no-completed { background: #dd5858; }
.box-card-boucher .body .completed small,
.box-card-boucher .body .no-completed small { position: absolute; right: 10px; bottom: 10px; font-size: 12px; text-align: right; }

.row-name span, .row-comments { display: block; }
.row-name, .row-comments { margin-bottom: 20px; }
.row-data-contact div { float: left; width: 200px; }
.row-data-contact div span { display: block; }

/*FILTERS*/
.box-filters fieldset { float: left; width: 40%; }
.box-filters fieldset input, .box-filters fieldset label { display: inline-block; }
.box-filters fieldset input { width: 30%; border: 1px solid #EAEEF1; padding: 10px 5px; text-align: center; }
.box-filters fieldset input[type="submit"] { background: #2F3D4C; color: #fff; border: none; letter-spacing: 2px; }

.box-filters fieldset:last-of-type { margin-left: 5%; }
.box-filters .button-ios { 
	float: left; width: 33%; text-align: center; background: #EAEEF1; box-sizing: border-box; padding: 10px; border: 1px solid #ccc;
	letter-spacing: 1px; cursor: pointer; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;
}
.box-filters .button-ios:first-of-type { border-radius: 5px 0 0 5px; }
.box-filters .button-ios:last-of-type { border-radius: 0 5px 5px 0; }
.box-filters .button-ios:hover, .box-filters .current-button { background: #ccc; }
.ui-datepicker .ui-datepicker-title select { padding: 3px; border: 1px solid #f7f7f7; color: #333 !important; }

/*SALES*/
.box-table-sales i.loadSalesIcon,
.box-table-comissions i.loadSalesIcon { margin: 150px 0 0 48%; font-size: 22px; }

/*COMMISSIONS*/
.list-years li { 
	float: left; box-sizing: border-box; width: 15%; margin: 0 2% 15px 0; background: rgba(253,170,45,0.6); padding: 10px 0; text-align: center; 
	cursor: pointer; border-radius: 3px; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;
}
.list-years li span { display: block; font-size: 14px; letter-spacing: 1px; margin-bottom: 3px; }
.list-years li strong { font-size: 16px; letter-spacing: 2px; }
.list-years li.noSpace { margin-right: 0; }
.list-years li:hover, .list-years li.current { background: rgba(253,170,45,1); color: #fff; }

/*MY ACCOUNT*/
#account fieldset label { margin-bottom: 3px; display: block; color: #999; }
#account fieldset input { 
	background: none; border-bottom: 1px solid #cdcdcd; padding: 5px 0; font-size: 14px; color: #000; 
	transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;
}

.loginFields { background: #EBD280; float: left; width: 30%; box-sizing: border-box; margin-right: 2%; }
.loginFields span { display: block; font-size: 14px; }
.loginFields i { margin-bottom: 5px; font-size: 20px; }
.loginFields div:first-of-type { padding: 14px 0 10px 0; color: #a58935; text-transform: uppercase; text-align: center; margin-bottom: 10px; }
.loginFields fieldset { box-sizing: border-box; padding: 10px; }
.loginFields fieldset label { color: #a58935 !important; }
.loginFields fieldset input { border-bottom: 1px solid #d6b962 !important; }
.loginFields fieldset input[type="button"] { 
	background: #2F3D4C !important; border: 0px !important; padding: 15px !important; color: #fff !important; 
	letter-spacing: 2px; border-radius: 3px;
}
.loginFields fieldset input[type="button"]:hover { background: #445e7a !important; }
.loginFields fieldset:last-of-type { padding-bottom: 0px; }

.affiliateInformation { background: #F7F7F7; float: left; width: 68%; }
.affiliateInformation fieldset { box-sizing: border-box; float: left; padding: 10px; }
.affiliateInformation fieldset.full { float: none; width: 100%; }
.affiliateInformation fieldset.gridThird { width: 33.3%; }
.affiliateInformation fieldset:last-of-type { padding-bottom: 0px; margin-bottom: 5px; }
.affiliateInformation fieldset input[type="submit"] { 
	background: #2F3D4C !important; border: 0px !important; padding: 15px !important; color: #fff !important; 
	letter-spacing: 2px; border-radius: 3px;
}
.affiliateInformation fieldset input[type="submit"]:hover { background: #445e7a !important; }
.affiliateInformation #btnSaveAccount { width: 250px; margin-bottom: 5px; }

.box-joinAffiliate { padding: 20px; background: #edeaea; margin-top: 30px; font-size: 18px; color: #999; }
#account .accountError { border-bottom: 1px solid #CE3635 !important; }

.success-account { background: #a3d17b; color: #fff; padding: 10px; border-radius: 3px; margin-top: 20px; font-size: 16px; }
.error-account { background: #CE3635; color: #fff; padding: 10px; border-radius: 3px; margin-top: 20px; font-size: 16px; }


/*SETTINGS*/
.full-color { 
	box-sizing: border-box; text-align: center; color: #fff; margin-top: -30px;
	transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;
}
.full-color h2 { font-weight: normal; letter-spacing: 1px; margin: 15% 0 5px 0; }
.full-color small { font-size: 13px; }

#headerColorAffiliate { display: block; margin: 20px auto 0; width: 100px; background: #fff; border: none; padding: 5px; height: 50px; cursor: pointer; outline: 0; }
#saveHexadecimal { 
	width: 112px; padding: 10px 0; letter-spacing: 2px; background: #2F3D4C; color: #fff; border: none; outline: 0;
	transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;
}
#saveHexadecimal:hover { background: #445e7a; }


/*INTEGRATIONS*/
.integrationOption { 
	background: #E8E8E8; padding: 20px 0; text-align: center; min-height: 315px;
	transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;
}
.integrationOption i { color: #FDAA2D; font-size: 38px; margin-bottom: 20px; }
.integrationOption h3 { font-size: 20px; letter-spacing: 2px; margin-bottom: 10px; }
.integrationOption p { font-size: 14px; width: 90%; margin: 0 auto 25px; text-align: center; }
.integrationOption a { 
	color: #666; font-size: 16px; font-weight: bold; display: block; margin: 30px auto 0; width: 50%; border-radius: 25px; padding: 15px 0; letter-spacing: 1px;
	transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;	
}
.integrationOption a:hover { background: #FDAA2D; color: #FFF; }

.contentIntegration p { font-size: 14px; width: 80%; text-align: justify; margin-bottom: 15px; }
.contentIntegration .breadcrumb { margin-bottom: 20px; font-size: 14px; }
.contentIntegration .breadcrumb a { color: #9e6815; }
.contentIntegration .breadcrumb a:hover { text-decoration: underline; }

.contentIntegration .canvasCode { background: #c9cedb; box-sizing: border-box; padding: 10px; font-size: 14px; }
.contentIntegration .canvasCode .english,
.contentIntegration .canvasCode .spanish { float: left; width: 50%; box-sizing: border-box; padding: 5px;}