﻿/*omar 14-9-2015*/
/*general-width*/
@media screen and (min-width:320px) and (max-width:970px) 
{
.wrap-text {
    width: 92%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.welcome-msg {
    font-size: 19px;
    width: 98%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.login-container-box {
    background-size: cover;
    padding: 20px 12px;
    width: 98%;
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    background-repeat: round;
    display: table;
}
.box-title {
    font-size: 28px;
    width: 100%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.filed-holder label {
    width: 76%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.filed-holder {
    float: none;
}
.input-filed-style {
    margin: 0 0 15px;
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    width: 100%;
}
.login-form-submit {
    margin: 10px 0 0;
    width: 100%;
}
.form-footer-service {
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    width: 100%;
    max-width: 261px;
    margin: 0 auto;
    margin-top: 27px;
}
.checkbox-holder {
    float: none;
}
.forget-password {
    float: none;
    margin-left: 0;
    margin-top: 20px;
}
.not-register {
    float: none;
    margin: 20px 0 0 30px;
}
	.not-register > a {
    padding: 6px;
	font-size: 13px;
	}
	.user-info::before 
	{
	background-image: url("../images/agent-area-seprate.png");
    background-repeat: no-repeat;
    background-size: 400px auto;
    content: "";
    height: 21px;
    left: -15px;
    position: absolute;
    top: 4px;
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    width: 30px;
	}
	.user-info {
     font-size: 12px;
    padding: 6px 10px;
    width: 100%;
	}
	.user-info:last-child {
    width: 100%;
	}
	.account-info-field {
    border-radius: 0;
    display: table;
    margin: 0 !important;
    padding: 5px 19px;
    text-align: left;
    width: 100%;
	}
	.menu-item-wrapper {
    display: table;
    margin: 0 auto;
    max-width: 300px;
    width: 100%;
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
	}
	.menu-item-wrapper li {
    font-size: 10px !important;
    margin: 2px !important;
    width: 31.9% !important;
	max-width: 94px;
	}
	.menu-item-wrapper ul li a {
    height: 80px;
    min-height: inherit;
	}
	.menu-item-wrapper ul li a span:first-child {
    background-size: 300px auto;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.menu-item-wrapper ul li a span.menu-icon1 {
    background-position: 7px -46px;
    height: 40px;
    width: 49px;
	}
	.menu-item-wrapper ul li a span.menu-icon2 {
    background-position: -42px -47px;
    height: 40px;
    width: 49px;
	}
	.menu-item-wrapper ul li a span.menu-icon3 {
    background-position: -88px -46px;
    height: 40px;
    width: 49px;
	}
	.menu-item-wrapper ul li a span.menu-icon4 {
    background-position: -133px -48px;
    height: 40px;
    width: 49px;
	}
	.menu-item-wrapper ul li a span.menu-icon5 {
    background-position: -184px -49px;
    height: 40px;
    width: 49px;
	}
	.menu-item-wrapper ul li a span.menu-icon6 {
    background-position: -233px -44px;
    height: 40px;
    width: 49px;
	}
	.header-container .left {
    float: left;
    width: 54%;
	}
	
	.header-container .logo {
    float: left;
    margin-right: 13px;
    margin-top: 5px;
	}
	.header-container .logo img {
    display: block;
    max-width: 191px;
    width: 100%;
	}
	.header-container  .edit-profile {
    margin-top: 8px;
	}
	.edit-profile > a {
	font-size:12px;
	}
	.edit-profile > a::before {
		top: -6px;
	}
		.form-dimension {
		width:100%;
	}
	.marketing-materials-tabs li {
    width: 33%;
	max-width:97px;
	}
	.marketing-materials-tabs li a {
		font-size: 13.84px;
		padding: 8px 10px;
	}
	.marketing-materials-tabs li a .text {
    padding-top: 6px;
	}
	.marketing-materials-tabs li a .marketing-icon1::before {
    left: 6px;
	}
		.banners-holder-wrapper {
    padding: 0;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.banner-image img {
    max-height: 256px;
    max-width: 220px;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.banner-share {
    float: none;
    width: 100%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.view-banner {
    float: none;
    width: 100%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.login-error 
	{
		margin-top:0px;
	}
	.error-title {
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    font-size: 150px;

	}

}

@media screen and (min-width:320px) and (max-width:567px) 
{
	.chart-box-wrapper {
    display: table;
    margin: 0 auto;
    max-width: 300px;
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    width: 100%;
	}
	.charts-holder
	{
	width:100%;
	max-width:290px;
	}
	.chart {
    height: 100%;
    width: 100%;
	
	}
	.charts-button-show {
    width: 85.6%;
	}
	.charts-button-show ul li {
    font-size: 11px;
    padding: 6px !important;
    text-align: center;
    width: 31.5%;
	}
	.chart-bottom-button
	{
		width: 84.8%;
	}
	.chart-bottom-button .period-change li {
    font-size: 11px;
    padding: 6px;
    text-align: center;
    width: 32%;
	}
	.charts-button-show .button {
    padding-left: 4px;
	}
	.edit-profile-tabs li {
    font-size: 12px !important;
    width: 31.3%;
	}
	.form-field-holder {
		width:100%;
	}
	.field-seprater {
		width:100%;
	}
	.form-sub-title {
		font-size: 19.28px;
	}
	.form-note {
		font-size: 16px;
	}
	.form-submit-button {
	margin-right:0px;
	margin-top: 10px;
	width: 44%;
	}
	.form-field-style {
		margin-right:0px;
	}
	.commission-table-wrapper table th {
		font-size: 10px;
		 padding: 8px;
	}
	.commission-table-wrapper table tr td {
		font-size: 10.22px;
		 padding: 8px;
	}
		.form-field-holder label {
		font-size:12px;
	}
	.filter-wrapper.commission .form-submit-button {
		margin-right:12px;
	}
	.table-pagination > ul li.arrow a {
		font-size: 13px;
	}
	.commission-tabs {
    width: 100%;
    text-align: center;
	}
	.commission-tabs ul li {
		 margin: 0;
		width: 18.9%;
		max-width:69.7188px;
	}
	.commission-tabs ul li a {
		padding: 6px 7px;
		font-size: 11px;
		max-width: 70px;
	}
	.filter-wrapper.commission .form-field-holder {
    float: left;
    margin: 2%;
    width: 45%;
	}

	.banner-box {
    text-align: center;
    width: 100%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.banners-filter .form-field-holder {
    float: left;
    width: 48%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.banners-filter .form-submit-button {
    margin-right: 1%;
    margin-top: 0;
    width: 99%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
	}
	.banners-filter .form-field-holder label {
    font-size: 11px;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;	
	}
}
@media screen and (min-width:568px) and (max-width:970px) 
{
.filed-holder {
    float: left;
    width: 48%;
    margin: 0% 1%;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.login-form-submit {
    margin: 10px 0 0;
    width: 48%;
    float: right;
    margin-right: 1%;
}
.form-footer-service {
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    width: 47.6%;
    margin: 0;
    margin-top: 11px;
    float: left;
    margin-right: 1%;
    margin-left: 1.4%;
}
.checkbox-holder {
    float: none;
    font-size: 13px;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.forget-password {
    float: none;
    margin-left: 0;
    margin-top: 20px;
    font-size: 13px;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.not-register {
    float: none;
    margin: 20px 0 0 22px;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.not-register .question {
    color: #d7d6d8;
    float: left;
    position: relative;
    text-transform: uppercase;
    margin-right: 12px;
    font-size: 13px;
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
}
.charts-button-show {
    width: 85.6%;
	}
	.charts-button-show ul li {
    font-size: 11px;
    padding: 6px!important;
    text-align: center;
    width: 31.5%;
	}
	.chart-bottom-button
	{
		width: 84.8%;
	}
	.chart-bottom-button .period-change li {
    font-size: 11px;
    padding: 6px;
    text-align: center;
    width: 31.2%;
	}
	.charts-button-show .button {
    padding-left: 4px;
	}
	.commission-tabs ul li {
		margin: 0 0.2%;
		 width: 17.5%;
		  max-width: 91px;
	}
	.commission-tabs ul li a {
		 font-size: 13px;
		 max-width: 83px;
	}
	.commission-tabs {
    text-align: center;
    width: 100%;
	}
	.banner-box {
    margin-bottom: 30px;
    text-align: center;
    width: 48%;
	}
	#forget_form .login-form-submit {
    float: left;
    margin-left: 10px;
    margin-top: 37px;
    max-width: 184px;
    width: 37%;
	}
	#forget_form .filed-holder {
    max-width: 300px;
    width: 57%;
	}
}

/*end-general-width*/
/*custom-width*/
@media screen and (min-width:320px) and (max-width:639px) 
{
	.menu-item-wrapper ul li.active::after {
		border:none;
	}
}
@media screen and (min-width:568px) and (max-width:680px) 
{
	.charts-button-show {
    margin: 0;
    width: 100%;
	}
	.chart-bottom-button {
    margin: 0;
	width: 100%;
	}
}
@media screen and (min-width:640px) and (max-width:970px) 
{
	.menu-item-wrapper {
	clear: both;
    display: table;
    max-width: 589px;
	}
	.user-account-info {
	float: right;
    margin: 0;
    width: 46%;
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    margin-bottom: 15px;
	}
	.user-info-box {
    float: left;
    width: 52%;
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    margin-bottom: 15px;
	}
	.account-info-field {
	-webkit-transition: all 300ms linear 0s;
	transition: all 300ms linear 0s;
    padding: 5.7px 19px;
	}
	.menu-item-wrapper ul li.active::after {
		bottom:-12px;
	}
}

@media screen and (min-width:320px) and (max-width:499px) 
{	
	.commission-table-wrapper table .mobile-hide
	{
    display: none;
	}
}
@media screen and (min-width:320px) and (max-width:400px) 
{	
		.commission-tabs ul li a {
		font-size: 8px;
		padding: 6px 6px;
		}
		.commission-tabs ul li {
		 margin: 0;
		width: 18.7%;
		max-width:55px;
		}
		.commission-tabs {
		width: 100%;
		text-align: center;
		}
}
@media screen and (min-width:568px) and (max-width:759px) 
{
	.banners-filter .form-submit-button {
    margin-right: 2%;
    width: 48%;
	margin-top: 0;
	}
	.banners-filter .form-field-holder {
    float: left;
    width: 48%;
	}
	.banner-box {
	margin-right: 2%;
	}
}
/*end-custom-width*/

/*omar 21-9-2015*/

/*omar 17-2-2016*/
@media screen and (min-width:328px) and (max-width:883px) 
{
    .commission-table-wrapper .client-history-table table .tablet-hide
    {
        display: none;
    }
   
    
}
@media screen and (min-width:328px) and (max-width:567px) 
{
    .commission-table-wrapper .client-history-table table .mobile-hide-new
    {
       display: none;  
    }
    .commission-table-wrapper .client-history-table table thead tr:nth-child(2n+1) td:first-child {
    display: block;
    }
    .commission-table-wrapper .client-history-table table thead tr:nth-child(2n+1) td {
    border-top: 1px solid #a9a9a9;
    color: #424241;
    padding: 7px;
    }
    .edit-profile-tabs li {
    border: medium none !important;
    border-radius: 0 !important;
    font-size: 12px !important;
    margin-right: 0 !important;
    padding: 7px !important;
    width: 49.3%;
    }
    .edit-profile-tabs li:first-child {
    margin-bottom: 7px;
    }
}
@media screen and (min-width:568px) and (max-width:883px) 
{
       .edit-profile-tabs ul li {
      font-size: 14px;
       padding: 7px 12px;
       }
    .edit-profile-tabs ul li:last-child {
    margin-right: 0;
    }       
   
    
}
/*omar 17-2-2016*/