/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Sep 12, 2014, 12:59:34 PM
    Author     : Venky
*/
@media screen and (min-width: 1920px) {
    body, html{
        font-size: 0.9em;
    }
    .allDeatils{
        float: left !important;
    }
}
@media (min-width:1600px){
	#content > .content-body{
		width:80%;
	}



}
@media screen and (min-width:1024px) and (max-width:1400px){
    .sidebar .sidebar-menu {
        max-height:540px;
        overflow: auto;
    }
    
}
@media (min-width:1030px){
    .closeButtonLveave{ display: none;}
}
@media (min-width:1024px){
    .advanceButtons {
        position: absolute;
        right: -3px;
        width: 30px;
        height: 39px;
        padding-left: 5px;
    }
    .dealExpanded .extraIcons .fa, .dealExpanded .inneredit .fa, .dealExpanded .leftIcons .fa{
        font-size: 1.3em;
    }
    .addSystemDeatils{
        width:100% !important;
    }
    .addSystemDeatils label{
        min-width: 11em;
    }
    
}
@media (max-width:1024px){
    html, body {
        background: #fff;
        font-family: OpenSansRegular;
        font-size: .85em;
    }
    #DealsTabs{
        width: 70%;
        margin-top: -11px;
    }
    .right-side.strech #DealsTabs{
        width:90%;
    }
    .dealCurrencyPosition{
        right: 11%;
    }
    .clickable-area{
        width: 100%;
    }
    .left-side{
        width: 200px;
    }
    body > .header .logo{
        width: 200px;
    }
    body > .header .navbar{
        margin-left: 200px;
    }
    #content > .content-header{
        width: 80.5%;
       // left: 19.5%;
    }
    .modeuleMenu .nav li a{
        padding: 0px 8px;
    }
    .modeuleMenu .navbar-nav{
        margin-right: -86px;
        
    }
    .topCountBox, .bottomCountBox{
        padding: 0px 8px;
    }
    .mainStausRow{
        padding: 10px 12px;
    }
    .closeStausRow{
        padding: 0px 12px;
    }
    .addDeal .sticky-placeholder-wrapper{
        width:9%;
    }
    .addDeal .sticky-placeholder-wrapper:nth-child(1){
        width: 22%;
    }
    .addDeal .sticky-placeholder-wrapper:nth-child(2){
    }
    .AddDealTable td .calcvalueDiv .sticky-placeholder-wrapper {
        width: 78% !important;
    }
    .calcvalueDiv .sticky-placeholder-wrapper{
        width: 100% !important;
    }
    #deal_source {
        width: 14%;
    }
    #dropen
    {
        width: 100px !important;
    } 
    #dropen p {
    }
    .price span {
        font-size: 1.3em !important;
    }
    .price .cno {
        font-size: 1.4em !important;
    }
    .dealCost{
        font-size: 1.3em !important;
    }
    .small-box h3 {
        font-size: 22px;
    }
    .dealsByTable{
        width:98% !important;
    }
    .right-side{
        margin-left: 200px;
    }
    .dealsStatus li.subStatus{
        margin-left: 358px;
    }
    .headerDetails label{
        min-width: 130px;
        padding-right: 5px;
    }
    .dealEdit input, .dealEdit select{
        width: 110px;
    }
    .strech .dealEdit input, .strech .dealEdit select{
        width: 165px;
    }
    #deal_name{
        width: 135px;
    }
    #deal_contact{
        width: 115px;
    }

    .strech #deal_name{
        width: 200px;
    }
    .strech #deal_contact{
        width: 160px;
    }
    #deal_formula_calculator_block{
        right: 324px;
        padding: 0px;
    }
    .strech #deal_formula_calculator_block{
        right: 430px;
        padding: 0px;
    }
    .strech .dealsStatus li.subStatus{
        margin-left: 430px;
    }
    .contactsEditBlock input[type="text"]{
        width: 39.6%;
    }
    .contactsEditBlock textarea{
        width: 80%;
    }
    .strech .contactsEditBlock input[type="text"]{
        width: 41.5%;
    }
    .strech .contactsEditBlock textarea{
        width: 83%;
    }
    .addPersonInputs input[type="text"], .addPersonInputs #contact_address{
        width: 250px;
    }
    .strech .addPersonInputs input[type="text"]{
        width: 167px;
    }
    .strech .addPersonInputs #contact_address{
        width: 200px;
    }
    
    /*================  elog ================*/
    .clock_container {
        width:67px  !important;
    }
    .clock_container .lbl{
        width: 59px !important;
    }
    
    /*============   leave management =============================*/
    .LeavePolicyMain{ display: none;}
    .leaveApplyBlock p label{ width: 11.9em;}
}

@media screen and (min-width: 992px) and (max-width:1024px){
    .col-md-105 {
        width: 87% !important;
    }
    .strech .col-md-105 {
        width: 89.5% !important;
    }
    .col-md-13 {
        width: 11% !important;
        padding: 0px;
    }
    .strech .col-md-13 {
        width:9% !important;
    }
    .subDroppable.ui-droppable{
        font-size: 1em;
    }
}
@media screen and (max-width: 767px){
.table-responsive {
    border: 0px solid #ddd;
}    
}

@media (max-width:768px){
    html, body {
        font-size: .815em;
    }
    body > .header .logo{
        width:130px;
    }
    body > .header .navbar{
        margin-left: 130px;
    }
    .sidebar .sidebar-menu > li > a{
        padding: 12px 5px 12px 3px;
    }
    .clickable-area{
        width:100%;
    }
    .dealCurrencyPosition {
        right: 15% !important;
    }
    .modeuleMenu{
        display: none;
    }
    .sidebar .sidebar-menu .treeview-menu > li > a{
        margin-left: 2px !important;
        font-size: .85em;
    }
    .mainStausRow {
        padding: 5px 18px 0px;
    }
    #content > .content-header{
        width: 80%;
       // left:20%;
    }
    .left-side {
        width: 130px !important;
    }
    .addDeal .sticky-placeholder-wrapper:nth-child(1){
        width: 40%;
    }
    .addDeal .sticky-placeholder-wrapper:nth-child(2){
        width: 25%;
    }
    .AddDealTable td .calcvalueDiv .sticky-placeholder-wrapper {
        width: 64% !important;
    }

    .addDeal .sticky-placeholder-wrapper:nth-child(5) {
        width: 11% !important;
    }
    .addDeal .sticky-placeholder-wrapper {
        width: 20%;
    }
    #deal_source {
        width: 29%;
    }
    .closeStausRow{
        padding: 0px 18px;
    }
    .topCountBox, .bottomCountBox {
        padding: 0px 2px;
    }
    .left-side.collapse-left {
        left: -130px !important;
    }
    .right-side{
        margin-left: 125px;
    }
    .clickable-area{
        padding: 0px 0px 9px 0px;   
    }   
    .dealCurrencyPosition .fs16{
        font-size: 1em;
    }
    #content > .content-header {
        width: 83%;
       // left: 17%;
    }
    .right-side #content{
    }
    .features{
        padding: 30px 2px;
    }
    .dealCost {
        font-size: 1.2em !important;
    }
    .price span {
        font-size: 1.2em !important;
    }
    .sidebar .sidebar-menu .treeview-menu > li > a{
        padding: 5px 5px 5px 0px;
    }
    .sidebar .sidebar-menu .treeview-menu > li > a > .fa, .sidebar .sidebar-menu .treeview-menu > li > a > .glyphicon, .sidebar .sidebar-menu .treeview-menu > li > a > .ion{
        width: 10px;
    }
    .small-box h3{
        text-align: left;
    }
    .headerDetails{
        width: 75%;
    }
    .headerDetails label{
        min-width: 40px; 
    }
    .dealEdit input, .dealEdit select{
        width: 160px;
    }
    .strech .dealEdit input, .strech .dealEdit select{
        width: 98px;
    }
    .dealsEditBlock .pull-right{
        position: absolute;
        bottom: 0px;
        right: 0px;
        
    }
    .boxAddButton .blueColor{
        height: 25px;
        
    }
    .dealsStatus li{
        padding: 2px 2%;
    }
    
}
@media screen and (min-width:700px) and (max-width:768px){
    .strech .dashbordleft {
        width: 86% !important;
        padding-left: 10px !important; 
    }
}
@media (max-width:600px){
    .clickable-area{
        width: 100%;
    }
    #DealsTabs{
        width: 77%;
        margin-top: -13px;
    }
    .right-side.strech #DealsTabs {
        width: 99%;
    }
    #dropen{
        width: 100% !important;
        bottom: 0px !important;
        height: 10%;
        top: 90%;
        z-index: 200;
    }
    #dropen p{ 
        font-size:1.3em !important;
        top: 29%;
    }
    #content > .content-header {
        width: 78%;
     //   left: 22%;
    }
    .skin-blue .sidebar{
        margin-top: 1px;
    }
    .topCountBox, .bottomCountBox{
        margin-top: 10px;
    }
    .strech .dashbordleft {
        padding-left: 10px !important; 
    }
    .dealsStatus li{
        padding: 2px 1.2%;
    }
    .searchInput, .searchInput:focus{
        width: 180px;
    }
    #contact_email{
        width: 117px;

    }
    .contactsEditBlock input[type="text"] {
        width: 37%;
    }
    .contactsEditBlock textarea {
        width: 75%;
    }
    .contactsEditBlock label{
        min-width: 95px;
    }
    .strech .contactsEditBlock input[type="text"]{
        width: 40%;
    }
    .strech .contactsEditBlock textarea {
        width: 81%;
    }
    .addPersonInputs input[type="text"] {
        width: 127px;
    }
    #contact_address{
        width: 247px;
    }
    .strech .contactsEditBlock textarea {
        width: 80%;
    }
    .strech .dashbordleft{
        width: 99%;
    }
    
    
}


@media screen and (min-width:700px) and (max-width:560px){
    .strech .dashbordleft {
        width: 86% !important;
    }
}

@media (max-width:568px){
    .left-side{
        top:50px; 
    }
    #content > .content-header {
        width: 77%;
    }
    .skin-blue .sidebar{
        height: 206px !important;
        overflow: auto;
    }
    .contactsEditBlock input[type="text"]{
        width: 36%;
    }
    .contactsEditBlock textarea{
        width: 74%;
    }
}
@media (max-width:480px){
    body > .header .logo{
        width: 100%;
    }
    body > .header .navbar{
        margin-left:0px;
    }
    .skin-blue .sidebar{
        height: 167px !important;
        overflow: auto;
    }
    .skin-blue .sidebar{
        margin-top: 50px;
    }
    .strech .dashbordleft {
        padding-left: 10px !important;
        width: 80%;
    }
    .dealsStatus li a{
        font-size: 1em;
    }
    .dealsStatus li {
        padding:2px 10px;
    }
    body > .header .logo{
        line-height: 40px;
        height: 40px;
    }
    .searchInput{
        width: 240px;
    }
    .addPersonInputs input[type="text"], #contact_email{
        width: 150px;
    }
    #contact_address {
        width: 300px;
    }
    .addPersonInputs .padding5_10{
        padding: 5px 0px;
    }
    .strech .contactsEditBlock input[type="text"]{
        width: 37%;
    }
    .strech .contactsEditBlock textarea {
        width: 76%;
    }
    .contactsEditBlock input[type="text"], .contactsEditBlock textarea{
        width: 100%;
    }
    .strech .addPersonInputs input[type="text"], .strech #contact_email{
       width: 210px;
    }
    .strech .dashbordleft{
        width: 100%;
    }
    #DealsTabs{
        width: 100%;
    }

                             
}
@media (max-width:384px){
    .skin-blue .sidebar{
        margin-top: 0px;
    }
    .skin-blue .sidebar{
        height: auto !important;
        overflow: auto;
    }
    .right-side #content{
        padding-left:0px !important;
    }
    .left-side{
        top:100px; 
    }
    .right-side.strech{
        margin-left: 0px ;
    }

    .left-side{
        width:35% !important;
    }
    .left-side.collapse-left{
        left: -100% !important;
    }
    .dealsStatus li {
        padding: 2px 5px;
    }
}
@media (max-width:320px){
    .nav>li>a{ padding: 3px 9px !important; }
    .navbar-nav > .tasks-menu > .dropdown-menu{
        right: -154px;
    }
    .atum-org,.atum-budgets,.atum-ta,.atum-deals,.atum-elog,.atum-resources,.atum-pm,.atum-am,.atum-tm {
        width: 30px;
        height: 30px;
        background-size: 100%;
    }
    .atum-apps-block li a h3{font-size: 0.6em;}
    .atum-apps-block{padding: 4px 4px !important;}
    .menu.atum-apps-block,.slimScrollDiv{ height: 140px !important; }
    .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a{ font-size: .8em;}
    .right-side {
        margin-left: 105px;
    }
    .right-side #content{
        padding-left: 5px !important;
    }
    .strech .dashbordleft{
    }
    #DealsTabs{
        
    }
    #search_range_form input[type="text"]{
        width: 120px;
    }
    .addComponentDiv, .addContactDiv, .addGraphDiv{
        width: 100%;
    }
    .dealsStatus li{
        padding: 2px 3px;
    }
    .dealsStatus li a {
        font-size: .9em;
    }
    .contactsEditBlock input[type="text"], .contactsEditBlock textarea{
        width: 100%;
    }
}