/* ----------- mobile ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width
	: 480px) {
	html {
		padding: 0;
		margin: 0;
	}
	body {
		font-family: 'Open Sans', sans-serif;
		background-color: #cccccc;
	}
}

/* ----------- Non-Retina Screens ----------- */
@media only screen and (min-device-width: 768px) {
	html {
		position: relative;
		left: 15%;
		margin: 10px;
		padding: 0;
		width: 1280px;
	}
	body {
		display: block;
		font-family: 'Open Sans', sans-serif;
		text-align: center;
		background-color: #cccccc;
	}
	.div-wrapper {
		display: block;
		width: 100%;
		height: 231px;
	}

	/*-------------- MENU BAR ---------------------*/
	.menu-container {
		display: inline-block;
		background-image: url("../img/cabeceraGris.png");
		background-position: top center;
		width: 100%;
		height: 149px;
		padding: 0;
		margin: 0;
	}
	.logo {
		width: 70%;
		padding: 0;
		margin: 0;
	}
	.menu-container .logo img {
		float: left;
		width: 35%;
		height: 100%;
		margin: 20px 0 0 50px;
	}
	.menu-bar {
		float: left;
		width: 70%;
		height: 100%;
		padding: 0;
		margin: 10px 0 0 0;
	}
	.menu-list {
		display: inline-block;
		position: relative;
		left: 50px;
		width: 100%;
		height: 100%;
		padding: 0;
		margin: 0 0 0 0;
	}
	ul li {
		list-style-type: none;
	}
	.menu-item {
		float: left;
		cursor: pointer;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		font-weight: 300;
		color: #1f1e20;
		background-color: none;
		width: 120px;
		height: 25px;
		text-align: center;
		margin: 10px 20px 0 20px;
		padding: 5px 0 0 0;
	}

	/*--------------- LINKS STYLES ---------*/
	.menu-item a:link {
		color: #1f1e20;
		text-decoration: none;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		font-weight: 300;
	}
	.menu-item a:visited {
		color: #1f1e20;
		text-decoration: none;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		font-weight: 300;
	}
	.menu-item a:hover {
		color: #cccccc;
		text-decoration: none;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		font-weight: 300;
	}
	.menu-item a:active {
		color: #1f1e20;
		text-decoration: none;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		font-weight: 300;
	}

	/*--------------- Drop down languages ---------*/
	.dropdown {
		position: relative;
		display: inline-block;
		float: left;
		cursor: pointer;
		width: 20%;
		margin: 12px 5px 0 5px;
		padding: 5px 0 0 0;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		color: #1f1e20;
	}
	.dropdown img {
		height: 13px;
		margin: 0 5px 0 0;
	}
	.dropdown .drop_arrow {
		height: 8px;
		margin: 0;
	}
	.dropdown-content {
		display: none;
		text-align: left;
		float: left;
		position: relative;
		left: 10px;
		background-color: rgba(123, 52, 84, 1);
		width: 100%;
		height: 240px;
		padding: 10px 0 10px 10px;
		margin: 0;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		color: #ffffff;
		z-index: 1;
	}
	.dropdown:hover .dropdown-content {
		display: block;
		float: left;
	}
	.dropdown .dropdown-content li {
		width: 100%;
		height: 20px;
	}
	.dropdown .dropdown-content li:hover {
		width: 100%;
		height: 20px;
		background-color: rgba(242, 122, 32, 0.5);
	}

	/* ---------- SERVICES SECTION -----------*/
	.services-wrap {
		display: inline-block;
		position: absolute;
		top: 170px;
		left:0;
		width: 100%;
		height: 60px;
		margin: 0;
		padding: 0;
	}
	.service-button {
		float: left;
		cursor: pointer;
		background: #1f1e20;
		width: 25%;
		height: 35px;
		margin: 0;
		padding: 0;
	}
	.service-button-text {
		position: relative;
		top: 5px;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		color: #FFFFFF;
		width: 100%;
		height: 18px;
		text-align: center;
		margin: 0;
	}

	/*-------------- SERVICE TEXT ---------------------------*/
	.service-text-wrap {
		width: 100%;
		height: 60px;
	}
	.service-text {
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		text-align: left;
		color: #1f1e20;
	}
	.service-account-wrap {
		display: none;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		text-align: left;
		color: #1f1e20;
		width: 90%;
		height: 20px;
		margin: 0 50px 0 50px;
		padding: 10px;
	}
	.service-credit-wrap {
		display: none;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		text-align: left;
		color: #1f1e20;
		width: 90%;
		height: 20px;
		margin: 0 50px 0 50px;
		padding: 10px;
	}
	.service-world-wrap {
		display: none;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		text-align: left;
		color: #1f1e20;
		width: 90%;
		height: 20px;
		margin: 0 50px 0 50px;
		padding: 10px;
	}
	.service-exchange-wrap {
		display: none;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		text-align: left;
		color: #1f1e20;
		width: 90%;
		height: 20px;
		margin: 0 50px 0 50px;
		padding: 10px;
	}

	/* -------------- CALCULATOR ------------*/
	.first-section {
		display: inline-block;
		width: 100%;
		height: 245px;
		margin: 10px 0 0 0;
	}

	/*------------------- CHART COLUMN ---------------------*/
	.left-col {
		position: relative;
		bottom: 15px;
		float: left;
		width: 50%;
		height: 100%;
		margin: 0 0 0 0;
		padding: 0 0;
	}
	#chart-time-table {
		display: inline-block;
		width: 100%;
		height: 20px;
		padding: 0;
	}
	.time-select-wrap {
		float: left;
		cursor: pointer;
		width: 12%;
		height: 100%;
		color: #1f1e20;
		padding: 0;
	}
	.time-select {
		position: relative;
		bottom: 2px;
		font-family: 'Open Sans', sans-serif;
		font-weight: 400;
		font-size: 10px;
		
	}
	.chart-rate-wrap {
		display: inline-block;
		width: 100%;
		height: 100%;
	}
	.chart-canvas {
		width: 100%;
		height: 90%;
		margin: 10px 0 0 0;
	}
	.chart-canvas img {
		
	}

	/*--------------------------CALCULATOR COLUMN ----------------------*/
	.center-col {
		display: block;
		float: left;
		position: relative;
		bottom: 20px;
		width: 25%;
		height: 20%;
		margin: 0;
		padding: 0;
	}
	.calculator_wrap {
		display: block;
		width: 100%;
		height: 100%;
		padding: 0;
		margin: 0 0 0 0;
	}

	/*---------- SEND ROW ---------------*/
	.send-text {
		text-align: left;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		width: 100%;
		font-size: 12px;
		color: #1f1e20;
		margin: 0 0 5px 0;
	}
	.send-row {
		display: inline-block;
		width: 90%;
		height: 50px;
		margin: 0 0 0 0;
	}
	.send-input-wrap {
		display: inline-block;
		float: left;
		width: 90%;
		height: 44px;
		background-color: #1f1e20;
		
	}
	.send_arrow {
		float: left;
	}
	.send-input-div {
		float: left;
		width: 66%;
		height: 100%;
	}
	.send-input-field {
		font-family: 'Open Sans', sans-serif;
		font-size: 18px;
		color: #ffffff;
		text-align: right;
		width: 100%;
		height: 70%;
		border: none;
		background-color: rgba(0, 0, 0, 0);
		margin: 5px 0 0 0;
	}
	.currency-wrap {
		position: relative;
		bottom: 8px;
		display: inline-block;
		float: left;
		cursor: pointer;
		width: 100%;
		margin: 12px 5px 0 5px;
		padding: 5px 0 0 0;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 18px;
		color: #ffffff;
	}
	.arrowDiv {
		float:right;
		position:relative;
		bottom:5px;
		right:10px;
		margin: 0;
	}
	.currency-dropdown-content {
		display: none;
		float: left;
		position: relative; width : 220px;
		height: 220px;
		overflow-x: hidden;
		overflow-y: scroll;
		background-color: rgba(31, 30, 32, 1);
		margin: 0;
		padding: 0 10px;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 14px;
		color: #ffffff;
		text-align: left;
		z-index: 1;
		width: 220px;
	}
	.currency-wrap:hover .currency-dropdown-content {
		display: block;
		float: left;
	}
	.currency-dropdown-content li{
		
	}
	
	.currency-dropdown-content li:HOVER {
		background-color: #7b294e;
	
	}
	
	.currency-selector-wrap {
		float: left;
		display: inline-block;
		width: 30%;
		height: 100%;
		margin: 0;
	}
	.currency-initial {
		float: left;
		font-family: 'Open Sans', sans-serif;
		font-size: 16pt;
		font-weight: 700;
		color: #ffffff;
	}

	/*------------- RECEIVE ROW --------------*/
	.receive-row {
		display: inline-block;
		position: relative;
		right: 25px;
		width: 90%;
		height: 50px;
		margin: 20px 0 0 0;
	}
	.receive-input-wrap {
		display: inline-block;
		float: left;
		width: 90%;
		height: 43px;
		background-color: #333333;
	}
	.receive-text {
		position: relative;
		left: 15px;
		width: 80%;
		font-family: 'Open Snas', sans-serif;
		font-weight: 300;
		font-size: 12px;
		color: #1f1e20;
		text-align: left;
	}

	/*------------------- TRANSFER NOW BUTTON ------------*/
	.transfer-button-row {
		display: inline-block;
		width: 100%;
		height: 45px;
		margin: 10px 0 0 0;
		padding: 0;
	}
	.transfer-button {
		position: relative;
		right: 20px;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 18px;
		color: #ffffff;
		background: #f27a20;
		cursor: pointer;
		width: 253px;
		height: 40px;
		border: none;
		margin: 0;
	}
	.guarantee-container {
		display: block;
		position: relative;
		left: 10px;
		color: #1f1e20;
		font-family: 'Open Snas', sans-serif;
		font-weight: 300;
		font-size: 12px;
		width: 80%;
		height: 40px;
		padding: 0;
		margin: 10px 0 0 0;
	}
	.guarantee-text {
		position: relative;
		right: 30px;
		text-align: left;
		width: 100%;
		margin: 0;
		padding: 0;
	}
	.input-rate {
		font-family: 'Open Sans', sans-serif;
		font-size: 12px;
		font-weight: 700;
		color: #f27a20;
		padding: 0 0 0 0;
	}
	.fee-text {
		float: left;
		position: relative;
		left: 3px;
		text-align: left;
		width: 100%;
		padding: 0;
	}
	.input-fee {
		border: none;
		font-family: 'Open Sans', sans-serif;
		font-size: 12px;
		font-weight: 700;
		color: #f27a20;
		width: 30%;
	}

	/*-------- RATES COLUMN -----------*/
	.right_col {
		display: block;
		float: left;
		width: 25%;
		height: 100%;
		padding: 0;
		margin: 0;
	}

	/*------------------------------ rate reference table---------------------------- */
	.rates-table-wrap {
		display: block;
		float: right;
		height: 240px;
		width: 100%;
		margin: 0;
		padding: 0;
	}
	.rate-table-title-wrap {
		width: 100%;
		height: 50px;
		padding: 5px 0;
	}
	.rate-table-title {
		display: inline-block;
		width: 100%;
		height: 50px;
		padding: 5px 30px 0 30px;
	}
	.table-rate-send-initials {
		float: left;
		color: #1f1e20;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 16px;
		background-color: rgba(0, 0, 0, 0);
		border: none;
		width: 40px;
		margin: 0;
	}
	.table-arrow-logo {
		float: left;
		height: 30px;
		margin: 0 10px 0 0;
	}
	.table-rate-receive-initials {
		float: left;
		color: #1f1e20;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 16px;
		background-color: rgba(0, 0, 0, 0);
		border: none;
		width: 50px;
	}
	.table-title-text {
		float: left;
		color: #1f1e20;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 16px;
	}
	.rates-row {
		display: block;
	}
	.rates-col {
		display: inline-block;
		width: 80%;
		height: 25px;
		padding: 0;
		margin: 5px 0;
	}
	.rate-cell {
		float: left;
		position: relative;
		right: 20px;
		text-align: center;
		color: #1f1e20;
		border: none;
		background-color: rgba(0, 0, 0, 0);
		font-size: 16px;
		width: 40%;
		height: 20px;
		margin: 0;
	}
	.div-logo-reference {
		float: left;
		width: 40%;
		height: 100%;
		margin: 0 0 0 30px;
	}
	#logo_xe {
		float: left;
		height: 28px;
	}
	#logo_google {
		float: left;
		height: 25px;
	}
	#logo_yahoo {
		float: left;
		height: 17px;
	}
	.rates-table-info-text {
		display: block;
		float: left;
		width: 100%;
		height: 50px;
		margin: 10px 0 0 0;
	}
	.info-text-rowA {
		width: 100%;
		height: 20px;
		padding: 0;
		margin: 0 10px 0 15px;
		padding: 0;
	}
	.info-text-rowB {
		color: #1f1e20;
		width: 100%;
		height: 20px;
		text-align: center;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 12px;
		padding: 0;
		margin: 10px 0 0 0;
	}
	#yesterday-date {
		float: left;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 12px;
		width: 45%;
		height: 20px;
		color: #1f1e20;
		padding: 0;
	}
	.elguion {
		float: left;
		color: #1f1e20;
		width: 2%;
		height: 100%;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 16px;
	}
	#today-date {
		float: left;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		font-size: 12px;
		width: 45%;
		height: 20px;
		color: #1f1e20;
		padding: 0;
	}
}

.after {
	clear: both;
}

/* ---------------------------- MAP ------------ */
.map-wrap {
	background-color: #cccccc;
	width: 100%;
	height: 330px;
	margin: 20px 0 0 0;
}

.map {
	background-image: url(../img/mapaGris.png);
	/*background-size: 100%;*/
	background-position: center center;
	background-repeat: no-repeat;
	height: 300px;
}

/*---------------- SUPPORT SECTION ----------------*/
.support-wrap {
	display: inline-block;
	color: #1f1e20;
	width: 100%;
	height: 100px;
	padding: 0 0;
}

.support-title {
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 16px;
	width: 16%;
	margin: 15px 0 0 50px;
}

.support-logos-wrap {
	display: inline-block;
	width: 80%;
	height: 100%;
	margin: 0;
}

.support-logo {
	float: left;
	width: 90px;
	height: 40px;
	border: 1pt solid #999999;
	padding: 0 0 0 0;
	margin: 20px 80px;
}

.support-logo img {
	position: relative;
	top: 5px;
	height: 30px;
}

/*------------------- FOOTER ---------------*/
.foot-wrap {
	display: block;
	background-color: #cccccc;
	background-image: url("../img/footerBK.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 100%;
	height: 310px;
	margin: 10px 0 0 0;
}

.footer-list-wrap {
	display: inline-block;
	width: 100%;
	margin: 20px 0 5px 0;
}

.footer-map-links {
	display: inline-block;
	width: 100%;
	height: 175px;
}

.footer_list_wrap {
	float: left;
	width: 33%;
	height: 100%;
}

#footer_map_right_col {
	margin: 0 0 0 114px ;
	width:100%;
	height: 100%;
}

#footer_map_center_col {
	margin: 0 0 0 114px ;
	width:100%;
	height: 100%;
}

#footer_map_left_col {
	margin: 0;
	width:100%;
	height: 100%;
}

.ulTitle {
	text-align: left; font-family : 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 14px;
	color: #1f1e20;
	font-family: 'Open Sans', sans-serif;
}



.followTitle {
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 14px;
	color: #1f1e20;
}

.footer_map_item {
	text-align: left; font-family : 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #666666;
	font-family: 'Open Sans', sans-serif;
	margin: 5px 0 0 0;
}

.footer_map_item a:link {
	color: #666666;
	text-decoration: none;
}

.footer_map_item a:visited {
	
	color: #666666;
	text-decoration: none;
}

.footer_map_item a:hover {
	color: #de5305;
	text-decoration: none;
}

.footer_map_item a:active {
	color: #666666;
	text-decoration: none;
}

.social_links {
	margin: 10px 0 0 0;
}

.footer-links-list {
	width: 50%;
	height: 20px;
	margin: 20px 0 0 20%;
}

.footer-list-item {
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 10px;
	width: 20%;
	padding: 0;
	margin: 0 2%;
}

.footer-list-item a:link {
	color: #1f1e20;
	text-decoration: none;
}

.footer-list-item a:visited {
	color: #1f1e20;
	text-decoration: none;
}

.footer-list-item a:hover {
	color: #de5305;
	text-decoration: none;
}

.footer-list-item a:active {
	color: #1f1e20;
	text-decoration: none;
}

.register-wrap {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 10px;
	color: #1f1e20;
	width: 100%;
	height: 10%;
	margin: 5px 0 20px 0;
}
}