/*
 * Default Theme v1.0
 * 
 * Date Created 5/12/2012
 * Last Update 5/12/2012
 *
 * This theme is part of themeforest.net
 * ====================================================================================================================== */

/* --- 1. LARGE DESKTOP ---
 *
 * ====================================================================================================================== */
@media (min-width: 980px) {
	/* ========== SIDEBAR ========== */
	#sidebar .nav-mainmenu {
		height: auto;
	}
	
	/* ========== LOGIN PAGE ========== */
	#login-content {
		padding: 9% 0px;
	}
	#login-content .login-area,
	#login-content .register-area  {
		display: inline-block;
	}
}

/* --- 2. POTRAIT TABLET TO LANDSCAPE AND DESKTOP ---
 *
 * ====================================================================================================================== */
@media (min-width: 768px) and (max-width: 979px) {
	/* ========== LOGIN PAGE ========== */
	#login-content .login-area,
	#login-content .register-area  {
		width: 100%;
	}
	body {
		padding: 0;
	}
	#wrapper.fixed  #wrapper-inner {
		padding-top: 110px;
	}
	/* ========== LOGIN PAGE ========== */
	#login-content .login-area,
	#login-content .register-area  {
		width: 100%;
	}
	/* ========== MAIN HEADER ========== */
    #main-header .title h1 {
		position: relative;
		top: 0;
		font-size:  24px;
		color: #f5f5f5;
		text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
		margin-left: 20px;
	}
	#main-header .header-panel #menu-phone {
		display: inline-block;
	}
	/* ========== SIDEBAR ========== */
	#sidebar {
		width: 100%;
		top: 56px;
	}
	/* ========== PROFILE ========== */
	#sidebar .profile {
		width: 100%;
		height: 62px;
	}
	#sidebar .profile .profile-pic {
		float: left;
		margin-left: 20px;
	}
	#sidebar .profile .profile-info {
		float: left;
	}
	#sidebar .profile .profile-panel {
		display: inline-block;
		float: right;
		margin-right: 20px;
		margin-top: 14px;
		border: none;
		vertical-align: top;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
	}
	#sidebar .profile .profile-panel .profile-panel-menu a.menu {
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		padding: 7px 0;
		width: 140px;
		background: #f9f9f9;
		border: 1px solid rgba(0, 0, 0, 0.15);
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZWVlZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
		background: -moz-linear-gradient(top,  #f9f9f9 0%, #eeeeee 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(100%,#eeeeee));
		background: -webkit-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: -o-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: -ms-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: linear-gradient(to bottom,  #f9f9f9 0%,#eeeeee 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#eeeeee',GradientType=0 );
	}
	#sidebar .profile .profile-panel .profile-panel-menu:first-child a.menu {
		border-right: none;
		border: 1px solid rgba(0, 0, 0, 0.15);
		-moz-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
		-webkit-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
		box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
	}
	#sidebar .profile .profile-panel .profile-panel-menu:last-child a.menu {
		margin: 0;
		border: 1px solid rgba(0, 0, 0, 0.15);
	}
	#sidebar .profile .profile-panel .dropdown-menu:before {
		left: 247px;
	}
	#sidebar .profile .profile-panel .dropdown-menu:after {
		left: 248px;
	}
	#sidebar .profile .profile-panel .profile-panel-menu a.menu .text {
		display: inline-block;
	}
	#sidebar .profile .profile-panel .dropdown-menu {
		width: 285px;
		left: -145px;
	}
	/* ========== MAIN MENU ========== */
	#sidebar .nav-mainmenu {
		display: none;
		position: absolute;
		width: 80%;
		right: 10%;
		top: 56px;
		z-index: 999;
		background: url('../../img-design/img/sidebar-bg-phone.png');
		border: 1px solid #444;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		-moz-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
		-webkit-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
        box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
	}	
	#sidebar .nav-mainmenu.show {
		display: block;
	}
	#wrapper.fixed #sidebar .nav-mainmenu {
		top: 0px;
	}
	#wrapper.boxed #sidebar .nav-mainmenu {
		top: 72px;
	}
	#sidebar .nav-mainmenu li a {
		display: block;
		width: 100%;
		padding: 7px 0;
		text-align: left;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	}
	#sidebar .nav-mainmenu li:first-child a {
		border-top: none;
	}
	#sidebar .nav-mainmenu li:last-child .nav-submenu li:last-child a {
		-moz-border-radius: 0 0 3px 3px;
		-webkit-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
		border-bottom: none;
	}
	#sidebar .nav-mainmenu li a.active {
		border-bottom: 1px solid rgba(0, 0, 0, 0.5);
	}
	#sidebar .nav-mainmenu li a .icon,
	#sidebar .nav-mainmenu li a .text {
		display: inline-block;
	}
	#sidebar .nav-mainmenu li a .icon,
	#sidebar.simple .nav-mainmenu li a .icon	{
		margin: 2px 0;
		width: 50px;
		font-size: 20px;
	}
	#sidebar.simple .nav-mainmenu {
		background: #fefefe;
		-moz-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
		-webkit-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
        box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
	}
	#sidebar.simple .nav-mainmenu li a {
		width: 100%;
		padding-top: 5px;
		padding-bottom: 5px;
		vertical-align: top;
	}
	
	/* ========== SUB MENU ========== */
	#sidebar .nav-submenu {
		position: static;
		top: 20px;
		width: 100%;
	}
	#sidebar .nav-submenu li a {
		padding: 5px 17px 5px 40px;
		font-size: 11px;
		line-height: 22px;
		border-top: 1px solid rgba(255, 255, 255, 0.9);
		border-bottom: 1px solid rgba(0, 0, 0, 0.15);
	}
	#sidebar .nav-submenu li a .icon,
	#sidebar.simple .nav-submenu li a .icon {
		width: 16px;
		margin-right: 20px;
		margin-top: -2px;
	}
	#sidebar .nav-submenu li a .caret {
		margin-top: 9px;
	}
	#sidebar.simple .nav-submenu {
		top: 0;
		width: 100%;
	}
	#sidebar.simple .nav-submenu li a {
		padding-left: 30px;
	}
	
	/* ========== SUB ITEM ========== */
	#sidebar .nav-subitem li a.active {
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	}
	#sidebar .nav-subitem li a {
		padding-left: 50px;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	#sidebar.simple .nav-subitem li a {
		padding-left: 50px;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	
	/* ========== MAIN CONTENT ========== */
	#main-content.simple {
		background: #fff;
	}
	
	#main-content h1 small,
	#main-content h2 small,
	#main-content h3 small,
	#main-content h4 small,
	#main-content h5 small,
	#main-content h6 small {
		line-height: 15px;
		display: block;
	}
	#main-content {
		padding-right: 20px;
		padding-left: 20px;
		background: transparent;
	}
}


/* --- 3. LANDSCAPE PHONE TO PORTRAIT TABLET ---
 *
 * ====================================================================================================================== */
@media (max-width: 767px) {
	body {
		padding: 0;
	}
	#wrapper.fixed  #wrapper-inner {
		padding-top: 110px;
	}
	/* ========== LOGIN PAGE ========== */
	#login-content .login-area,
	#login-content .register-area  {
		width: 100%;
	}
	/* ========== MAIN HEADER ========== */
    #main-header .title h1 {
		position: relative;
		top: 0;
		font-size:  24px;
		color: #f5f5f5;
		text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
		margin-left: 20px;
	}
	#main-header .header-panel #menu-phone {
		display: inline-block;
	}
	/* ========== SIDEBAR ========== */
	#sidebar {
		width: 100%;
		top: 56px;
	}
	/* ========== PROFILE ========== */
	#sidebar .profile {
		width: 100%;
		height: 62px;
	}
	#sidebar .profile .profile-pic {
		float: left;
		margin-left: 20px;
	}
	#sidebar .profile .profile-info {
		float: left;
	}
	#sidebar .profile .profile-panel {
		display: inline-block;
		float: right;
		margin-right: 20px;
		margin-top: 14px;
		border: none;
		vertical-align: top;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
	}
	#sidebar .profile .profile-panel .profile-panel-menu a.menu {
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		padding: 7px 0;
		width: 140px;
		background: #f9f9f9;
		border: 1px solid rgba(0, 0, 0, 0.15);
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZWVlZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
		background: -moz-linear-gradient(top,  #f9f9f9 0%, #eeeeee 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(100%,#eeeeee));
		background: -webkit-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: -o-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: -ms-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: linear-gradient(to bottom,  #f9f9f9 0%,#eeeeee 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#eeeeee',GradientType=0 );
	}
	#sidebar .profile .profile-panel .profile-panel-menu:first-child a.menu {
		border-right: none;
		border: 1px solid rgba(0, 0, 0, 0.15);
		-moz-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
		-webkit-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
		box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
	}
	#sidebar .profile .profile-panel .profile-panel-menu:last-child a.menu {
		margin: 0;
		border: 1px solid rgba(0, 0, 0, 0.15);
	}
	#sidebar .profile .profile-panel .dropdown-menu:before {
		left: 247px;
	}
	#sidebar .profile .profile-panel .dropdown-menu:after {
		left: 248px;
	}
	#sidebar .profile .profile-panel .profile-panel-menu a.menu .text {
		display: inline-block;
	}
	#sidebar .profile .profile-panel .dropdown-menu {
		width: 285px;
		left: -145px;
	}
	/* ========== MAIN MENU ========== */
	#sidebar .nav-mainmenu {
		display: none;
		position: absolute;
		width: 80%;
		right: 10%;
		top: 56px;
		z-index: 999;
		background: url('../../img-design/img/sidebar-bg-phone.png');
		border: 1px solid #444;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		-moz-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
		-webkit-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
        box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
	}	
	#sidebar .nav-mainmenu.show {
		display: block;
	}
	#wrapper.fixed #sidebar .nav-mainmenu {
		top: 0px;
	}
	#wrapper.boxed #sidebar .nav-mainmenu {
		top: 72px;
	}
	#sidebar .nav-mainmenu li a {
		display: block;
		width: 100%;
		padding: 7px 0;
		text-align: left;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	}
	#sidebar .nav-mainmenu li:first-child a {
		border-top: none;
	}
	#sidebar .nav-mainmenu li:last-child .nav-submenu li:last-child a {
		-moz-border-radius: 0 0 3px 3px;
		-webkit-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
		border-bottom: none;
	}
	#sidebar .nav-mainmenu li a.active {
		border-bottom: 1px solid rgba(0, 0, 0, 0.5);
	}
	#sidebar .nav-mainmenu li a .icon,
	#sidebar .nav-mainmenu li a .text {
		display: inline-block;
	}
	#sidebar .nav-mainmenu li a .icon,
	#sidebar.simple .nav-mainmenu li a .icon	{
		margin: 2px 0;
		width: 50px;
		font-size: 20px;
	}
	#sidebar.simple .nav-mainmenu {
		background: #fefefe;
		-moz-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
		-webkit-box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
        box-shadow:  0px 5px 10px -2px rgba(0, 0, 0, 0.5);
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
	}
	#sidebar.simple .nav-mainmenu li a {
		width: 100%;
		padding-top: 5px;
		padding-bottom: 5px;
		vertical-align: top;
	}
	
	/* ========== SUB MENU ========== */
	#sidebar .nav-submenu {
		position: static;
		top: 20px;
		width: 100%;
	}
	#sidebar .nav-submenu li a {
		padding: 5px 17px 5px 40px;
		font-size: 11px;
		line-height: 22px;
		border-top: 1px solid rgba(255, 255, 255, 0.9);
		border-bottom: 1px solid rgba(0, 0, 0, 0.15);
	}
	#sidebar .nav-submenu li a .icon,
	#sidebar.simple .nav-submenu li a .icon {
		width: 16px;
		margin-right: 20px;
		margin-top: -2px;
	}
	#sidebar .nav-submenu li a .caret {
		margin-top: 9px;
	}
	#sidebar.simple .nav-submenu {
		top: 0;
		width: 100%;
	}
	#sidebar.simple .nav-submenu li a {
		padding-left: 30px;
	}
	
	/* ========== SUB ITEM ========== */
	#sidebar .nav-subitem li a.active {
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	}
	#sidebar .nav-subitem li a {
		padding-left: 50px;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	#sidebar.simple .nav-subitem li a {
		padding-left: 50px;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	
	/* ========== MAIN CONTENT ========== */
	#main-content.simple {
		background: #fff;
	}
	
	#main-content h1 small,
	#main-content h2 small,
	#main-content h3 small,
	#main-content h4 small,
	#main-content h5 small,
	#main-content h6 small {
		line-height: 15px;
		display: block;
	}
	#main-content {
		padding-right: 20px;
		padding-left: 20px;
		background: transparent;
	}
}


/* --- 4. LANDSCAPE PHONE AND DOWN ---
 *
 * ====================================================================================================================== */
@media (max-width: 480px) {
	#main-header .title h1 {
		font-size:  20px;
	}
	/* ========== MAIN HEADER ========== */
	#main-header .title h1 small {
		display: none;
	}
	#main-header .header-panel #menu-phone {
		display: inline-block;
	}
	#main-header .header-panel #dropdown-patterns .dropdown-menu,
	#main-header .header-panel #dropdown-search .dropdown-menu {
		right: -70%;
	}
	#main-header .header-panel #dropdown-patterns .dropdown-menu:before,
	#main-header .header-panel #dropdown-search .dropdown-menu:before {
		right: 60px;
	}
	#main-header .header-panel #dropdown-patterns .dropdown-menu:after,
	#main-header .header-panel #dropdown-search .dropdown-menu:after {
		right: 61px;
	}
	/* ========== SIDEBAR ========== */
	#sidebar {
		width: 100%;
	}
	/* ========== PROFILE ========== */
	#sidebar .profile .profile-panel .profile-panel-menu a.menu {
		width: 35px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		padding: 7px 0;
		background: #f9f9f9;
		border: 1px solid rgba(0, 0, 0, 0.15);
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZWVlZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
		background: -moz-linear-gradient(top,  #f9f9f9 0%, #eeeeee 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(100%,#eeeeee));
		background: -webkit-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: -o-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: -ms-linear-gradient(top,  #f9f9f9 0%,#eeeeee 100%);
		background: linear-gradient(to bottom,  #f9f9f9 0%,#eeeeee 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#eeeeee',GradientType=0 );
	}
	#sidebar .profile .profile-panel .profile-panel-menu a.menu .label,
	#sidebar .profile .profile-panel .profile-panel-menu a.menu .badge {
		position: absolute;
		z-index: 1;
		top: -10px;
		left: 5px;
	}
	#sidebar .profile .profile-panel .profile-panel-menu a.menu .text {
		display: none;
	}
	#sidebar .profile .profile-panel #panel-message .dropdown-menu {
		width: 285px;
		left: -203px;
	}
	#sidebar .profile .profile-panel #panel-notification .dropdown-menu {
		width: 285px;
		left: -241px;
	}
	#sidebar .profile .profile-panel #panel-message .dropdown-menu:before {
		left: 213px;
	}
	#sidebar .profile .profile-panel #panel-message .dropdown-menu:after {
		left: 214px;
	}
	#sidebar .profile .profile-panel #panel-notification .dropdown-menu:before {
		left: 251px;
	}
	#sidebar .profile .profile-panel #panel-notification .dropdown-menu:after {
		left: 252px;
	}
}