html {
	font-family: 'Roboto', sans-serif !important;
    background: url("../images/bg-routing.jpg") no-repeat scroll center center / cover rgba(0, 0, 0, 0);
    min-height: 100%;
}
* {
    margin: 0;
    padding: 0;
}

body{
	height:100%;
	font-size:13px;	
	font-family: 'Open Sans', sans-serif !important;
	 margin: 0;
}
input {font-family: 'Open Sans', sans-serif !important;}

.button {
    color: #FFFFFF;
    font-size: 14px;
    padding: 13px 0;
    display: inline-block;
    position: relative;
    text-decoration: none;
    text-align: center;
    -webkit-font-smoothing: subpixel-antialiased;
	-webkit-transition: 0.25s linear;
	transition: 0.25s linear;
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0) inset;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0) inset;
	-webkit-transition: background-color 300ms ease-out;
	-moz-transition: background-color 300ms ease-out;
	transition: background-color 300ms ease-out;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
.button-blue {
    background-color: #3498DB;
    border-left: 6px solid #33597F;
}

.button-blue:hover,
.button-blue:focus,
.button-blue:active,
.button-blue.active{
    color: #ffffff;
    background-color: #5dade2;
    border-left: 6px solid #406B96;
}

.button-red {
    background-color: #f26c4f;
    border-left: 6px solid #ce4e32;
}

.button-red:hover,
.button-red:focus,
.button-red:active,
.button-red.active{
    color: #ffffff;
    background-color: #f58971;
    border-left: 6px solid #de6a50;
}

.button-gray {
	color:#474747;
    background-color: #fff;
    border-left: 6px solid #cacaca;
}

.button-gray:hover,
.button-gray:focus,
.button-gray:active,
.button-gray.active{
    background-color: #f5f5f5;
    border-left: 6px solid #d2d2d2;
}


.user .access {width: 200px;margin-top: 20px;}
.userApk .access {width: 200px;margin-top: 20px;}
.button .access {background: url("../images/btn-icons.png") 0 0; width: 46px; height: 46px; position: absolute; left: 0;top: 0;margin-top: 0px;}

.selectorApp .plan-icon {width: 255px;margin-top: 20px;}
.button .plan-icon {background: url("../images/btn-icons.png") -46px 0; width: 46px; height: 46px; position: absolute; left: 0;top: 0;margin-top: 0px;}

.selectorApp .track-icon {width: 255px;margin-top: 20px;}
.button .track-icon {background: url("../images/btn-icons.png") -92px 0; width: 46px; height: 46px; position: absolute; left: 0;top: 0;margin-top: 0px;}

.selectorApp .user-icon {width: 255px;margin-top: 20px;}
.button .user-icon {background: url("../images/btn-icons.png") -138px 0; width: 46px; height: 46px; position: absolute; left: 0;top: 0;margin-top: 0px;}

/*** LOGGIN ***/
.nav-opt {margin:0 auto;width:500px;height:70px;background: url("../images/bg-login-wrap.png");-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding:10px 20px 20px;}
.nav-opt .chrome-icon {width:32px;height:32px;background: url("../images/chrome-icon.png");display: inline-block;margin: 0 5px;position: relative;top: 10px;}
.nav-opt .ff-icon {width:32px;height:32px;background: url("../images/ff-icon.png");display: inline-block;margin: 0 5px;position: relative;top: 10px;}
.user {margin:0 auto;width:500px;height:450px;background: url("../images/bg-login-wrap.png");}
.selectorApp {margin:0 auto;width:500px;height:450px;background: url("../images/bg-login-wrap.png");}
.selectorApp .button {display: block; margin: 0 auto 20px;}
.login-logo {margin:50px auto 40px;width:224px;height:105px;background: url("../images/RR-login.png");}
.dades {margin: 20px auto 0; width:200px;}
.login-title {color: #666;font-size: 18px;left: 40px;position: relative;top: 40px;width: 160px;}
.user {color:#666}
.dades input {display:block;width:194px;padding: 10px 3px;text-align:center;border:0;-webkit-box-shadow: 0 0 2px 1px rgba(150,150,150,0.3);box-shadow: 0 0 2px 1px rgba(150,150,150,0.3);margin-bottom: 20px;}
.enter {display:block; margin-top:15px}
/*** END LOGGIN ***/

/****LOGIN APK****/

.userApk {margin:0 auto;width:500px;height:450px;background: url("../images/bg-login-wrap.png");}
.userApk {color:#666}
@media (max-width: 500px) {
  .userApk {
  	margin:0;
  	padding:10px;
    width:100%;
    height:100%;
  }
}
/****END LOGIN APK****/

#header{
	height:67px;
	background:#343434;
}

#header .logo{
	float: left;
    height: 67px;    
    width: 300px;
    cursor:pointer;
}

#header .logo .descLogo{
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 600;
    left: 101px;
    position: relative;
    top: 19px;
}
#header .logo.rr{background: url("../images/planificacion-logo.png") no-repeat;}
#header .logo.ow{background: url("../images/seguimiento-logo.png") no-repeat;}

.right{ float: right; width: 390px; }

#iframeRR,#iframeOW,#Planificador,#Reparto{
	height:100%;
	width:100%;
	border:none;
}

#Planificador,#Reparto{
	float:left;
	height:100%;
}

#commonAppPanel{overflow:hidden;}

.goto-planificador, .goto-repartidor, .goto-userAdmin{
	height:60px;
	border:1px solid black;
	margin-top:10px;
	cursor:pointer;
}

.ui-dialog-titlebar{font-size:14px;}

.selectorIcon{
	background:url("../images/select-icons.png") no-repeat;
	height: 23px;
    width: 23px;
    float: left;
    padding-right: 7px;
}

.selectorIcon.plan{
	background-position: -2px -3px;
}
.selectorIcon.tracking{
	background-position: -2px -36px;
}
.selectorIcon.useradmin{
	background-position: -2px -68px;
}
.selectorIcon.suport{
	background-position: -2px -102px;
}
.selectorIcon.exit{
	background-position: -2px -135px;
}
.selectorIcon.contact{
	background-position: -2px -162px;
}

/*** DROPDOWN ***/
#link_manual { -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px; color: #666; float: right; margin-right: 25px; display: inline-block; margin-top: 18px; background-color: white; width: 100px; padding: 7px 0 2px 12px; font-style: none; text-decoration: none; }
#link_manual:hover {background-color: #F5F5F5; }
.dropdown {float: right; margin-right: 20px; margin-top: 18px; display: inline-block; }
.dropdown dd, .dropdown dt, .dropdown ul { margin:0px; padding:0px; }
.dropdown dd{ position:relative; }
.dropdown a, .dropdown a:visited { color:#666; text-decoration:none; outline:none;}
.dropdown a:hover { color:#555;}
.dropdown dt a:hover {background:#f5f5f5 url(./images/arrowd.png) no-repeat scroll 203px center;}
.dropdown dt a {background:#fff url(./images/arrowd.png) no-repeat scroll 203px center; display:block; padding:5px 18px 4px 3px; width:211px;-webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px;}
.dropdown dt a span {cursor:pointer; display:block; padding:1px 6px 2px 8px;}
.dropdown dd ul {z-index: 99999999;background:#fff none repeat scroll 0 0; border:1px solid #ccc; color:#C5C0B0; display:none; left:13px; width: 205px; padding:3px 0px; position:absolute; top:4px; list-style:none;}
.dropdown span.value { display:none;}
.dropdown dd ul li a { padding:8px 0 8px 5px; display:block;border-bottom: 1px solid #ebebeb;}
.dropdown dd ul li a:hover{ background-color:#f5f5f5;}
.dropdown dd ul li:last-child a {border-bottom: 0px}
.dropdown img.flag{ border:none; vertical-align:middle; margin-left: 5px; margin-right: 10px; }
.dropdown dd ul li{ }
/*#aplicacio-dropdown{width:100%;}*/
/*** END DROPDOWN ***/

.floatingInfoDiv{
	font-style: italic;
    padding: 8px;
    position: absolute;
    background: none repeat scroll 0 0 #fffeea;
    border: 1px solid #ddb846;
    color: #ddb846;
   }
 .floatingInfoDiv.f1{  right: 243px; top: 10px;  width: 275px;}
 .floatingInfoDiv.f2{  left: 30px; top: 55px;  }
