@charset "UTF-8";
/* CSS Document */
/*
Theme Name: AJM
Theme URI: 
Description: Welcome to Agarpara Jute Mill Pvt. Ltd.
Version: 0.1
Author: Arnab Das
Author URI: http://smartworksoffice.com/
Color Base: Light Grey, Red. Blue
*/

/*

Index of Code
--------------------------------------------------
1.0 Custom Setting
2.0 Login Part

*/


@import url('https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i');


/*   1.0 Custome Settings Start  */

html, body{position: relative; width: 100%; height: 100%;}
body{font-family: 'Lato', sans-serif; margin: 0; padding: 0; background: #f4f6f9;height: 100%;}
ul, li{margin: 0; padding: 0; font-family: 'Lato', sans-serif; list-style-type: none;}
ul, li{margin: 0; padding: 0; font-family: 'Lato', sans-serif; list-style-type: none;}
p{margin: 0; padding: 0; font-family: 'Lato', sans-serif;}
a{margin: 0; padding: 0; font-family: 'Lato', sans-serif; outline: 0;}
a:hover {color: #cc2627;}

#rPane { min-height:100%; position:relative;}
input{outline: 0;}
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px white inset;}
.alert{color: #BF0003; font-size: 12px; padding: 0; display: none;}
i{font-family: 'Lato', sans-serif;}
/* . Form Srtyle . */
.genform{ width: 100%;}
.genform label{width: 100% !important; display: block; margin-bottom: 15px;}
.genform input[type="text"], input[type="tel"], input[type="email"], input[type="password"], input[type="time"],  input[type="date"], textarea, select{border-bottom: 1px solid #dcdcdc; background: none; border-top: 0; border-left: 0; border-right: 0; width: 100%; margin-bottom: 20px; line-height: 28px;}
.genform select{margin-top: 10px;}

/* . Form Srtyle . */


/* . All Button Style . */
.bluebtn{background: #000; text-align: center; line-height: 25px; font-size: 16px; color: #fff; text-transform: uppercase; border: 0; display: inline-block; padding: 2px 20px; -webkit-border-radius:0; border-radius: 0; transform: perspective(1px) translateZ(0); backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; transition-duration: 0.3s;
transition-property: transform; transition: all 0.8s}
.bluebtn:hover, .bluebtn:focus, .bluebtn:active{background: none; border: 1px solid #000; color: #000 ;  transform: scale(1.1);}
.small_btn{width: 100px;}
.big_btn{width: 180px;}

.black_small_link{font-size: 14px; color: #3e4042; display: block; text-align: center;}
/*   Custome Settings End  */

/*   2.0 Login Start  */
.loginarea{position: fixed; top: 49%; left: 50%; transform: translate(-50%, -50%); }
.loginbox{border: 1px solid #000; top: 30%; background: #fff; padding: 40px; width: 400px; }
.loginlogo{text-align: center; display: inline-block; width: 100%; margin-bottom: 20px;}
.loginlogo img{text-align: center; }
.logform{ width: 100%;}
.logform label{width: 100% !important; display: block; margin-bottom: 15px;}
.logform input[type="text"], input[type="tel"], input[type="email"], input[type="password"], input[type="time"],  input[type="date"], textarea, select{border-bottom: 1px solid #dcdcdc; background: none; border-top: 0; border-left: 0; border-right: 0; width: 100%; margin-bottom: 20px; line-height: 28px;}
.logform select{margin-top: 10px;}
/*   2.0 Login End  */

/*  3.0 Side Bar / Nav  */
.leftpane{width: 16%; background: #161f24; position: fixed; height: 100%; transition: all 0.8s}
.logo{text-align: center; display: block; margin-bottom: 90px; margin-top: 20px;}



.panel{background-color: transparent}
.leftnav{}
.leftnav li{font-size: 14px; text-transform: uppercase; border-bottom: 1px solid #4a4a4a; line-height: 38px; display: block;}
.leftnav li a{color: #fff; padding: 0;display:block;}
.leftnav li a i:first-child{margin: 0 10px 0 0;}
.leftnav li a:focus, .leftnav li a:hover{background-color: transparent; color: #ffd700;}
.leftnav li ul{padding-left: 30px;}
.leftnav li ul li a{color: #a8a8a8; display: block;}
.leftnav li ul li a:hover{ text-decoration: none;}
.tglside{margin-left: -100%; transition: all 0.8s;}


/*  4.0 Right Panel  */
.rightpane{position: relative; margin-left: 17%; width: 83%; transition: all 0.8s; padding: 15px;}
.rightheader{width: 100%;}
.full{width: 100% !important; margin-left: 0 !important; transition: all 0.8s}
.closebtn{font-size: 30px; display: inline-block; vertical-align: middle; cursor: pointer;}
#togglenav i{color: #ffd700;}
.user{width: auto; padding: 0px; position: relative;}
.user span{display: inline-block; width: auto;  font-size: 16px; margin-right: 12px;}
.user span:nth-child(n+1) img{border: 3px solid #164e8d; -webkit-border-radius:50%; border-radius: 50%;}
.user span a{color: #000;}
.user span:nth-child(n+3){border-left: 1px solid #ccc;}
.user span:nth-child(n+3) i{color: #222222; text-align: center; padding-left: 8px;}
.contentbox{padding: 25px; background: #fff;}
.settings{width: 200px; padding: 18px; background: #fff; margin-top: 12px; right: 8px; display: none; position: absolute;  z-index: 1; }
.settings ul {text-align: left;}
.settings ul li{text-align: left; border-bottom: 1px solid #e2e2e2; line-height: 29px; padding-bottom: 10px; margin-bottom: 10px;}
.settings ul li:last-child{border-bottom: 0; margin-bottom: 0;}
.settings ul li a, .settings ul li a i{color: #000; font-size: 15px;}
.corner{width: 0; height: 0; border-style: solid; border-width: 0 10px 10px 10px; border-color: transparent transparent #fff transparent; line-height: 0px; _border-color: #fff #fff #fff #fff;_filter: progid:DXImageTransform.Microsoft.Chroma(color='#fff'); position: absolute; top: -9px; right: -2px;}


.contentbox header{border-bottom: 1px solid #e2e2e2; padding-bottom: 12px; margin-bottom: 25px;}
.contentbox header h2{font-size: 24px; color: #000; padding: 0; margin: 0;}
.formstyle{}
.formstyle label{display: block; width: 100%; color: #a1a1a1; padding-bottom: 12px; padding-left: 5px;}
.formstyle input[type="text"], input[type="date"], input[type="email"], input[type="password"], textarea, select{border-top:0; border-right:0; border-left:0; border-bottom: 1px solid #e2e2e2; background: none; width: 100%; line-height: 28px; padding: 0; margin-bottom: 15px;  padding-left: 5px; outline: 0;}
.formstyle select{height: 30px;}
.space{margin: 20px 0px;}

/* Tabuler Data style . */
.actionbtn{width: auto; margin: 04px; font-size: 16px;}
.actionbtn i{font-weight: 100; text-decoration: none;}
.actionbtn:hover i{color: #cc2627;}
.adduser{font-size: 24px; color: #000; line-height: 24px; }
.adduser a{display: block;}
.darktbl > thead > tr> th{background: #1B1B1B; color: #fff; font-weight: normal;}
.imgholder{width: 100%;}
.imgholder span{display: inline-block; width: auto; vertical-align: middle; position: relative;}
.imgholder span:first-child{width: 150px; height: 150px; -webkit-border-radius:50%; border-radius: 50%; overflow: hidden;  background: #ccc; margin-bottom: 20px;}
.imgholder span:first-child img{width: 100%; height: auto; background-size: contain;}
.imgholder span input[type="file"]{width: 150px; height: 150px; cursor: pointer;}
.imgholder span.uploadbtn{position: absolute; left: 109px; top: 38px; opacity: 0; width: 150px; height: 150px; display: block; overflow: hidden; cursor: pointer;}
.imgholder span.up{margin-bottom: 30px;}

/* . Footer . */
footer{position: absolute; right: 0; bottom:0; left: 0; padding: 1rem; text-align: center;} 
footer p{color: #9b9b9b; font-size: 12px;}

.bluebox{background: #4cd2f3;}
.greenbox{background: #3ad389;}
.orngbox{background: #e6a749;}
.redbox{background: #cf3936;}


.graph{width: 600px !important; height: 500px !important;}
.v_list li{border-bottom: 1px solid #e2e2e2; padding-bottom: 10px; margin-bottom: 10px;}
.v_list li div{display: inline-block; vertical-align: middle; font-size: 16px; line-height: 63px; }
.v_list li div:last-child{border-left: 1px solid #e2e2e2;}
.v_list li div p{line-height: 20px;}
.v_list li div p span{display: block; width: 100%; font-size: 12px; color:#ccc; ;}
.out{border:1px solid #ffd700; padding:6px; text-align:center; font-size:14px; color:#000000; -webkit-border-radius:6px; border-radius:6px;}
.out:hover{text-decoration:none; background:#ffd700; color:#000000;}
.userimg{border-radius:50%; -webkit-border-radius:50%; overflow:hidden; width:80px; height:80px; display:block;}
.userimg img{width:100%; height:auto; background-size:cover;}


@media screen and (max-width: 480px) {
	.loginbox{width: 270px; padding: 10px;}
	.logform label{margin-bottom: 0;}
	.logform input[type="text"], input[type="tel"], input[type="email"], input[type="password"], input[type="time"], input[type="date"], textarea, select{margin-bottom: 10px;}
	.leftpane{width: 100%; z-index: 9; display: none;}
	.closebtn{position: absolute; top: 2px; left: 20px;}
	.user{width: 100%; text-align: center; float: none !important;}
	.user span{width: 100%;}
	.user span:nth-child(n+3){border-left: 0;}
	.sidenav {padding-top: 15px;}
  	.sidenav a {font-size: 18px;}
	.rightpane{margin-left: 0; width: 97%;}
	.closebtn{z-index: 20; position: relative;}
	.contentbox header h2{font-size: 20px;}
	footer{display: none;}
}

@media screen and (min-width: 1024px) and (max-width: 1366px) {
	.leftpane{width: 22%;}
	.rightpane{margin-left: 23%; width: 76%;}
}


.blackbtn{width: 100%; background: #000000; text-align: center; line-height: 42px; font-size: 18px; text-transform: uppercase; display: block; color: #fff; border: 0; margin-bottom: 22px;}
.lv{color: #D02E30;}
.boxlist{text-align: left; margin-bottom: 50px; border-bottom: 1px solid #e2e2e2; padding-bottom: 20px;}
.boxlist:last-child{border-bottom: 0;}
.list li{display: inline-block; vertical-align: middle;}
.list li div{width:100%; position: relative; padding: 10px;}
/*.list li div  div{display: inline-block; width: auto; vertical-align: middle;}*/
.boxicon{position:absolute; top:30px; left:20px; width:25px;}
.list li div  span i{font-size: 28px; color: #fff;}
.list li div  div{margin-left:40px;}
.list li div  div p{font-size: 15px; color: #fff; line-height: 26px;}
.list li div  div p span{font-size: 36px; display: block; width: 100%; font-weight: bold;}
.view{width: auto;  text-align: right; }
.list li div  div p a{color: #fff;}
.pf_photo{width:200px; height:200px; border-radius:50%; -webkit-border-radius:50%; overflow:hidden; margin:0 auto 25px;}
.pf_photo img{width:100%; height:100%; background-size:cover;}

.updateimg{width:50px; height:50px; -border-radius:50%; -webkit-border-radius:50%; overflow:hidden; position:absolute; top:-5px; right:25px;}