@charset "utf-8";
/*------------------------------------------------------------------------------
    CSS Document (http://www.w3.org/Style/CSS/)

	project:    kappataz
    created:    2014-03-27
    author:     www.maquetadorweb.es
------------------------------------------------------------------------------*/

/* HTML RESET
------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {font-size:100%; font-weight:normal;}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, select{ margin:0; padding:0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}

ul, ol{list-style:none;}
a img, :link img, :visited img{border:0;}
:link, :visited{text-decoration:none;}
article,aside,canvas,details,div,figcaption,figure,footer,header,hgroup,menu,nav,section,summary { display:block; margin: 0; padding: 0; }

body 	{background:#FFF; font-family:'Roboto', Helvetica, Arial; color:#787878}
a 		{text-decoration:none}
img		{display:block}
.group:after {
	visibility: hidden;
	display: block;
	content: "";
	clear: both;
	height: 0;
	}
* html .group             { zoom: 1; } /* IE6 */
*:first-child+html .group { zoom: 1; } /* IE7 */
fieldset{ border:none}

.wrap{width:760px; margin:0 auto;}

/*kap-header*/
.kap-header{ background:url(img/kap-header2.png) repeat-x bottom left; height:237px; width:100%; margin-bottom:30px;  padding-top:30px;}
.kap-header .brand{ background:url(img/kap-brand2.png) no-repeat 0 0; width:640px; height:182px; margin:0 auto; display:block; text-indent:-1999em; overflow:hidden}
.kap-header .img{ width:70px; height:70px; margin:0 auto}
.kap-header .img img{width:100%; height:100%;}

/*kap-head*/
.kap-head, .kap-head-recordar-pass{ background:url(img/kap-head.png) repeat-x bottom left; height:120px; width:100%; margin-bottom:30px;}
.kap-head .p1, .kap-head-recordar-pass .p1{font-size:25px; line-height:25px; color:#8722d1;font-weight:600; margin:15px 0; text-align:left; width:600px}
.kap-head .p2, .kap-head-recordar-pass .p2{font-size:18px; line-height:18px; font-weight:300; color:#231F20;}
.kap-head .brand, .kap-head-recordar-pass .brand{ position:absolute; top:15px; right:0;}

/*kap-login*/
.kap-login{}
.kap-login .form{ width:270px; margin:0 auto}
.kap-login .form ul li{ height:70px; margin-bottom:30px}
.kap-login .form ul li label{ color:#8722d1; font-weight:600; padding:7px 5px; display:block}
.kap-login .form ul li input{ font-size:13px; line-height:13px; border:1px solid #b2b2b2; 
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius:5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px; 
display:block; padding:5px;		
background-color:#e9e9e9; 
color:#333; 
width:260px;}
.kap-login .form input::-webkit-input-placeholder {color:#333;font-size:13px; padding:3px; line-height:13px}
.kap-login .form input:-ms-input-placeholder {color:#333;font-size:13px; padding:3px; line-height:13px}
.kap-login .form input:-moz-placeholder {color:#333;font-size:13px; padding:3px; line-height:13px}
.kap-login .form input::-moz-placeholder {color:#333;font-size:13px; padding:3px; line-height:13px}
.kap-login .form input.button{ display:block; margin:0 auto; text-transform:uppercase; background:#8722d1; color:#FFF; font-size:13px; text-align:center; border:none; cursor:pointer; -webkit-border-radius: 5px 5px 5px 5px;width:270px; padding:5px 0;border:1px solid #b2b2b2; 
-moz-border-radius:5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;  }
.kap-login ul.enlace{ padding:100px 0 0; margin:0 auto; width:540px;}
.kap-login ul.enlace li{ display:block; padding:0; color:rgba(102,102,102,1); font-size:13px; line-height:13px; margin-bottom:15px; float:left; width:270px;}
.kap-login ul.enlace li a {background:url(img/kap-ico.png) no-repeat 0 0; height:30px; display:block; padding-left:60px; padding-top:20px; font-size:15px; font-weight:300; color:#231F20; }
.kap-login ul.enlace li a:hover{ text-decoration:underline}
.kap-login ul.enlace li a.a1{ background-position:0 0;}
.kap-login ul.enlace li a.a2{ background-position:0 -149px;}
.kap-login ul.enlace li a.a3{ background-position:0 -300px;}
.kap-login ul.enlace li a.a4{ background-position:0 -450px;}

/*kap-form*/
.kap-form{ margin-bottom:40px}
.kap-form .form{ width:740px}
.kap-form .titulo{ font-size:15px;  font-weight:600; text-transform:uppercase; margin:20px 0; color:#231F20;}
.kap-form .titulo span{ background-color:#8722d1; color:#FFF; margin-right:5px; padding:0 5px; -webkit-border-radius: 3px 3px 3px 3px;-moz-border-radius:3px 3px 3px 3px;border-radius: 3px 3px 3px 3px;}
.kap-form ul{}
.kap-form ul li{ clear: both; margin-bottom:15px; min-height:29px;}
.kap-form ul li label, .kap-form ul li p.label { float:left; width:190px; padding:3px 0; margin-right:10px; font-size:15px; font-weight:300 !important; color:#231F20; text-align:left}
.kap-form ul li label span, .kap-form ul li p.label span{ color:#8722d1; font-weight:600 }
.kap-form ul li input, .kap-form ul li select, .kap-form ul li textarea{ border:1px solid #b2b2b2; display:block; padding:7px 6px; font-size:12px; float:left; display:block; 
-webkit-border-radius: 3px 3px 3px 3px;-moz-border-radius:3px 3px 3px 3px;border-radius: 3px 3px 3px 3px;
background-color:rgba(102,102,102,.20); color:#333; width:258px;
-webkit-box-shadow: inset 0 0 8px rgba(51,51,51,.33);
	-moz-box-shadow: inset 0 0 8px rgba(51,51,51,.33);
	box-shadow: inset 0 0 8px rgba(51,51,51,.33);
	
}
.kap-form ul li input{width:258px;}
.kap-form ul li select{ width:271px; padding:7px 6px 7px 0}
.kap-form ul li textarea {resize: none; width:500px; font-family:'Roboto'; margin-bottom:15px}

.kap-form ul li.check{ margin-bottom:5px}
.kap-form ul li.check span.items{float:left; display:block; width:800px;}
.kap-form ul li.check span.items input{ display:block; width:20px; height:20px; float:left; margin-right:5px; border:solid 1px #ffffff;}
.kap-form ul li.check span.items label{  display:block; float:left; width:auto; padding:3px 0; margin-right:10px;width:158px; font-style:italic; border:solid 1px #ffffff;}
.kap-form ul li.check .left{float:left}


.kap-form .button{display:block; margin:20px auto; text-transform:uppercase; background:#8722d1; color:#FFF; font-size:13px; text-align:center; border:none; cursor:pointer; -webkit-border-radius: 5px 5px 5px 5px;width:270px; padding:5px 0;border:1px solid #b2b2b2; 
-moz-border-radius:5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;  }

.kap-form div.divbotones{display:block; margin:0px 30% !important;}

.kap-form ul li.fecha .sp1{ display:block; float:left; margin-right:10px;}
.kap-form ul li.fecha .sp1 input.dia{ width:30px; float:none;}
.kap-form ul li.fecha .sp1 input.mes{ width:30px; float:none;}
.kap-form ul li.fecha .sp1 input.ano{ width:70px; float:none;}
.kap-form ul li.fecha .sp1 label{ width:auto; font-style:italic; padding-top:0}

.kap-form ul li.w545 {min-height:19px; margin-bottom:0}
.kap-form ul li.w545 input{ width:545px; float:none;}
.kap-form ul li.w545 label{margin-left:200px; font-style:italic; padding-top:0}
.kap-form ul.n2{width:560px; display:block; margin-left:200px}
.kap-form ul.n2 li{ float:left; width:270px; height: auto; display:block; clear:none; margin-bottom:0}
.kap-form ul.n2 li.mr18{ margin-right:18px}
.kap-form ul.n2 li input {float:none; display:block; width:258px}
.kap-form ul.n2 li label {float:none; display:block; width:258px; font-style:italic; padding-top:0}

.kap-form ul.n4{ clear:both;}
.kap-form ul.n4 li{ float:left; width:190px; height: auto; display:block; clear:none; margin-bottom:0}
.kap-form ul.n4 li label{ width:135px}

.kap-form ul li.lopd{ margin-bottom:5px}
.kap-form ul li.lopd .label{ width:auto}
.kap-form ul li.lopd input{ display:block; width:20px; height:20px; float:left; margin-right:5px;}
.kap-form ul li.lopd label{ padding:3px 0; margin-right:10px; font-style:italic;}
.kap-form ul li.lopd .left{ margin-left:200px; float:left; width:500px;}
.kap-form ul li.foto input[type="file"]{ background-color:tranaparent; border:none; width:auto}
.kap-form ul li.foto .label{width:auto; margin-left:200px; font-style:italic; padding-top:0}
.bottom{ display:none;}
.ajax__calendar_container { z-index: 1000;}

/* Others */
.ResumError {color:#E20A17; padding-bottom:10px; font-weight:normal; font-size:14px;}
.ResumError ul, .ResumError ol {margin: 10px 20px; padding: 0 20px; font-weight:normal; font-size:14px;}
.itemError {font-size:14px; margin-left:5px; font-weight:normal; line-height:20px; display:block; color:Red;}

/*error*/
.error{
	position:absolute; top:50% !important; left:50% !important; margin-top:-72px; margin-left:-172px;
	padding:0 44px;
	width: 225px;
	height: 194px;
	background-color: rgba(131,33,200,.79);
	-webkit-box-shadow: 0 2px 4px rgba(0,0,0,.43), inset 0 0 8px rgba(51,51,51,.53);
	-moz-box-shadow: 0 2px 4px rgba(0,0,0,.43), inset 0 0 8px rgba(51,51,51,.53);
	box-shadow: 0 2px 4px rgba(0,0,0,.43), inset 0 0 8px rgba(51,51,51,.53);
}
.error h1{ font-size:60px; font-weight:100; color:rgba(255,255,255,1); margin-bottom:15px;}
.error p{font-size:13px; font-weight:300; color:rgba(255,255,255,1);}
.error a { position:absolute; bottom:20px; right:30px; color:#ffffff; text-decoration:underline;}
.error a.close{ position:absolute; top:0; right:5px; color:rgba(255,255,255,1);font-size:13px; font-weight:700; cursor:pointer; display:block; padding:5px; text-decoration:none;}

.firmaParte .TitolDades{float:left; margin-left:0px !important;}
.firmaParte canvas{border:1px solid #C1C1C1; float:left; margin-left:-50px !important; margin-top:10px !important;}
.firmaParte .BotoFormulari{float:left !important; margin-left:25px !important; width:100px;}
.firmaParte .BotoFormulari.first { margin-left:176px !important;}
.firmaParte2 .TitolDades {float:left; margin-left:390px !important;}
.firmaParte2 img{margin-right:20px !important; width:275px; height:120px;}

ul.apps li{width:50%; position:relative; float:left;}
ul.apps li a.android {background:url('img/android.png'); width:80px; height:80px; display:block; margin-left:72px; }
ul.apps li a.ios {background:url('img/ios.png'); width:80px; height:80px; display:block; margin-left:55px; }
ul.apps li a.ios span {color:Red; border:solid 1px #ff0000; position:absolute; top:70px; left:40px; }


/* Smartphones ----------- */
@media only screen and (max-width : 640px) {

.wrap{ width:280px; float:none; margin:0 auto 15px; overflow:hidden;}
.itemError {max-width:280px !important; float:left !important; margin-left:0px !important; line-height:16px !important; display:block;}
.left.itemError{ clear:left !important;}
.error{	margin-left:-150px;}
.kap-header{ margin-bottom:0; height:120px;}
.kap-header .brand{ background:url(img/kap-brand-mobile2.png) no-repeat 0 0; width:280px; height:80px}
.kap-header .img{ width:50px; height:50px; margin:0 auto}

.kap-head{ height:260px;}
.kap-head-recordar-pass{height:145px;}
.kap-head .p1, .kap-head-recordar-pass .p1{ width:auto; font-size:24px; text-align:center}
.kap-head .p2, .kap-head-recordar-pass .p2{ width:auto; font-size:15px}

.kap-form ul li label, .kap-form ul li p.label{ float:none; width:258px; display:block}
.kap-form ul li input{ float:none}
.kap-form ul li select{float:none;}
.kap-form ul li textarea{width:258px;}
.kap-form ul li.fecha label{ float:none; width:258px; display:block}

.kap-form ul li.check span.items{width:280px !important;}
.kap-form ul li.check span.items input{clear:left !important;}
.kap-form ul li.check span.items label{width:230px !important;}

.kap-form ul li.w545 input{ width:258px}
.kap-form ul li.w545 label{margin-left:0}
.kap-form ul.n2{margin-left:0; width:258px}
.kap-form ul.n4 li{ width:258px}
.kap-form ul li.foto .label{margin-left:0; width:258px}
.kap-form ul li.lopd .label{ width:258px; float:none}
.kap-form ul li.lopd .left{ float:none; margin-left:0; width:270px;}

.kap-login .form ul li{ margin-bottom:0; overflow:hidden}
.kap-login ul.enlace{ width:258px; padding-top:20px; margin:0 auto;}
.kap-login ul.enlace li{ width:258px; overflow:hidden}
.kap-login ul.enlace li a{ width:200px;}
.kap-login .form input.button{margin-top:15px;}
.kap-form .button{float:left !important;}
.kap-form div.divbotones{display:block; margin:0px !important;}

.bottom {  position:fixed; bottom:0; left:0; background-color:#777671; height:40px; width:100%; display:block}
.bottom a{ background:#9c9c94 url(img/kap-ico-bottom.png) no-repeat 190px 5px; padding:5px; display:block; color:#FFF; font-size:15px; width:220px; margin:5px auto}

.firmaParte .TitolDades{float:left; margin-left:0px !important;}
.firmaParte canvas{border:1px solid #C1C1C1; float:left; margin-left:0px !important; margin-top:10px !important;}
.firmaParte .BotoFormulari{float:left !important; margin-left:25px !important; width:100px;}
.firmaParte .BotoFormulari.first { margin-left:25px !important;}
.firmaParte2 .TitolDades {float:left; margin-left:390px !important;}
.firmaParte2 img{margin-right:20px !important; width:275px; height:120px;}

ul.apps li{width:100%; position:relative; float:left;margin-bottom:30px; text-align:center;}
ul.apps li a.android {background:url('img/android.png'); width:80px; height:80px; display:block; margin-left:95px; }
ul.apps li a.ios {background:url('img/ios.png'); width:80px; height:80px; display:block; margin-left:95px; }
ul.apps li a.ios span {color:Red; border:solid 1px #ff0000; position:absolute; top:70px; left:79px; }
}