/*
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 : 5/11/2015, 6:59:04 PM
    Author     : Chalmenz
*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
@import url(https://fonts.googleapis.com/css?family=Federo);
.contentIdx{
    min-height:580px;background-color:#fff;opacity:1
}
@media all and (min-width: 980px) {
    .profile_box{
        margin-left: 0px;
        left: 0px;
    }
    
}

a {
    cursor:pointer
}
body{
    margin:auto;
    padding: 0px;
    background-repeat: no-repeat;

    font-family: sans-serif;
    font-size:12pt;
    min-height: 100%;
  
}
.black-bg{
    background-color:#000;
}
.body2 {
    position: relative; /* needed for the overlay to extend when you scroll */
    /* general styles */
    padding: 30px;
    font-family: 'Open Sans', sans-serif;
    background: #c0c0c0;
    color: #101010;
}
.top{
    height: 168px;
    width: 100%;  
    background-color: #000000;
        overflow:hidden;
}
.logo{
    position:absolute;
    top:0px;
    background-image: url(../images/fords.png)
    
}
.img_insert{
    position: absolute;
    top:10px;
    left:400px;
}

@font-face {
    font-family: handwritten;
    src: url(FREESCPT.TTF);
}
@font-face{
    font-family: searching;
    src: url(segmdl2.ttf);
}

.ford_logo{
    position:absolute; 
    top:-20px;
    left:20px;
}
.img_desc{
    position:absolute;
    top:0px;
    left:200px;
    color: #999999;
    font-family:handwritten;
    font-size: 20pt
}

.codeSml{
    font-size:0.8em;
}
.top_cart{
    position: absolute; 
    top:5px;
    right:50px;
    cursor:pointer
    
}
.top_menu{
    position:absolute;
    width:580px;
    height:50px;
    top:130px;
    right:-20px;
}
.profile_box{
    position:absolute;
    top:250px;
  
    margin-right: auto;
    margin-left:auto;
    width:100%;
    height: 400px;
    border-style:solid;
    border-color: black;
    background-color: black;
    border-radius: 5px;
}
.search_wrapper{
    margin-left:-525px;
    left:50%;
    position: relative;
    width:1053px;
    height:60px;
    background-color: #fc9835;
    border-radius: 5px;
 -webkit-transition: height 1s; /* Safari */
    transition: height 1s;
    }
    
.newSearch{
    position:absolute;
        border-radius: 30px;
        background-color:#808080;
        padding:7px;
        left:840px;
        top:15px;
        color:#f0f0f0;
        cursor: pointer;
        font-size:10pt;
        
    }  
.search_box{
    display:none;
    margin:auto;
    position:relative;
    width:344px;
    height:150px;
    background-color: #d3d3d3;
     -webkit-transition: opacity 2s; /* Safari */
    transition: opacity 2s;
}
.search_label{
            border-style:solid;
    border-width:thin;
    border-color:#fc9845;;
    height:20px;
    width:320px;
    padding: 12px;
    font-family: sans-serif;
    font-size: 12pt;  
    
}
.search_label:hover{
border-color:#303030;
}
.search_type{
    background-color: #fc9835;
    width:100px;
    position:relative;
    top:105px;
    left:-6px;
    padding-left: 10px;
    font-family: sans-serif;
    font-size: 12pt;
      display:none;
       -webkit-transition: width 2s; /* Safari */
    transition: width 2s;
}
.search_label2{
    border-style:solid;
    border-width:thin;
    border-color:#fc9845;;
    height:20px;
    width:320px;
    padding: 12px;
    font-family: sans-serif;
    font-size: 12pt;  

}


.button_top{
        filter: alpha(opacity=80);
    opacity: .8;
    width:120px;
}

.button_top:hover{
    opacity: 1;
    filter:alpha(opacity=100);
    width:120px;
}
     

table{
    margin:auto;
    padding:2px
}
td{
    padding:2px;
}
.search{
    position: absolute;
    /* size of bullet elment */
    top:30px;
    width: 100px;
    height: 100px;
    filter: alpha(opacity=70);
    opacity: .7;
    background-color: #462300;
    overflow: hidden;
    cursor: pointer;
    border: #fff 2px solid;
}
            
.search:hover{
    opacity: 1;
    filter:alpha(opacity=100);
}
 
.select{
    position:relative;
    left:120px;
    top:1px;
    display:none;
}
.side_imgs{
    position:absolute;
    top:190px;
    left:850px;
    width:100px;
    height:400px;
}

.results_box{
    width:250px;
    height:130px;
    padding: 10px;
    border-radius: 5px;
    -webkit-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.41);
    -moz-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.41);
    box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.41);
    border-radius: 5px;
    position:relative;
}
.logstat{
    float:left;
    background-color: #c0c0c0;
    border-radius: 10px;
    margin-top:10px;
    padding:5px;
    cursor: pointer;
    display:none;
}
.results_label{
    background-color: #0f850f;
    color:#fff;
    height:60px;
    width:200px;
    font-family: sans-serif;
    font-size: 9pt;
    top:10px;
    left:10px;
    padding-top: 3px;
    padding-left: 5px;
    padding-right:52px;
    position: absolute;
   
}
.results_txt{
    font-family: sans-serif;
    font-size:8pt;
    top:75px;
    position:absolute;
    left:10px;
    width:145px;
}
.result_pic{
    height:60px;
    z-index:1;
    left:160px;
    top:10px;
    position:absolute;
        cursor:pointer
}
.add_cart{
    opacity: 0.8;
    left:150px;
    top:98px;
    background-color: #0f850f;
    position:absolute;
    height:30px;
    width:100px;
    border-radius: 20px 0 0 20px;
    text-align: center;
    font-family: handwritten;
    font-size: 17pt;
    color:white;
    cursor:pointer;
}

.qty{
   position:absolute;
   top:72px;
   left:188px;
   font-size:8pt;
   
}

input[type=number]{
    font-family: sans-serif;
    font-size:12pt;
    width:2.0em;
    padding:3px;
    position: relative;
    top: 0px;
    border:2px solid #ddd;
    border-radius:5px;
    text-align:center;
}

.checkBoxStyle{
    display:none;
}
.results_content{
    font-family: sans-serif;
    font-size: 10pt;  
}
.outcontainer{
     min-height:100%;
   position:relative;  
}
.footer{
      position:absolute;
   bottom:0;
   width:100%;
   height:200px;   /* Height of the footer */
   
  
   min-width: 80px;
    background-color:#000000;
    margin:0;
    background-repeat: no-repeat;
   
    color:#999999;
    opacity: 0.8   
}
a.footerLnk{
    color:#9ab0c3
}
.middle{
     padding-bottom:200px;
}
.footer_text{
    margin: 0 auto;
    width:100%;
    color:#999999;
    font-family: sans-serif;
    border-radius:5px;
    padding-left: 20px
}
.footerCell{
    vertical-align:top;
    cell-padding:50px;
}
        
   

 #wrap { 
	width: 900px; 
	margin: 0 auto; 
}   

.login {
    position:absolute;top:40px;left:0px; width:100%; color:#09850f
}
.login:hover{
   

}
.logBox{
   border:solid 1px #09850f;padding:10px;cursor:pointer;
   
}
.logBox:hover{
     color:#00ff00;
     border:solid 1px #00ff00;}
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 1;
    position: fixed;
}
iframe{
    width:400px;
    height:50px;
    overflow: hidden;
}
input[type="number"] {
   width:100px;
}
div.btnStyle{
    vertical-align: middle;
    text-align: center;
color:#c0c0c0;
    height: 30px;
    width:150px;
    padding:5px;
    background-color: #990000;
    cursor:pointer;
}
div.btnStyleL{
    vertical-align: middle;
    text-align: center;
color:#c0c0c0;
    height: 30px;
    width:150px;
    padding:5px;
    background-color: #990000;
    cursor:pointer;
    border-radius:25px 0 0 25px;
}
div.btnStyleR{
    vertical-align: middle;
    text-align: center;
color:#c0c0c0;
    height: 30px;
    width:150px;
    padding:5px;
    background-color: #990000;
    cursor:pointer;
    border-radius: 0 25px 25px 0
}
.vcenter {
   
    margin-top:8px;
   }

.btnGreen{
    vertical-align: middle;
    text-align: center;
color:#f0f0f0;
    height: 30px;
    width:150px;
    padding:5px;
    background-color: #009900;
    border-radius:15px;
    cursor:pointer;
}
.btnBlue{
    background-color: #03a9fd;border-radius: 5px;margin-left:5px;margin-top:50px;cursor:pointer
}

.PopupPanel
{
    border: solid 1px black;
    position: fixed;
    left: 50%;
    top: 50%;
    background-color: white;
    z-index: 100;
padding:50px;
    height: 400px;
    margin-top: -200px;

    width: 600px;
    margin-left: -300px;
}

.mymodal {
    width: 90%;
    height: 80%;
    line-height: 20px;
    position: fixed;
    top: 0px; 
    left: 0;
    margin: 5%;
    overflow:auto;
    
    background-color: #fff;
    border-radius: 15px;
    text-align: center;
    z-index: 2; /* 1px higher than the overlay layer */
}

.picmodal {
    width: 600px;
    height: 600px;
    line-height: 20px;
    position: fixed;
    top: 0px; 
    left: 0;
    margin-top:5%;
    margin-left: 35%;
    overflow:auto;
    
    background-color: #fff;
    border-radius: 15px;
    text-align: center;
    z-index: 200; /* 1px higher than the overlay layer */
}

.modal2 {
    width: 20%;
    height: 90%;
    padding:10px;
    line-height: 20px;
    position: fixed;
    top: 100px; 
    margin: 10%;
    overflow:auto;
    opacity: .7;
    background-color: #ff5;
    border-radius: 15px;
    text-align: center;
    z-index: 11; /* 1px higher than the overlay layer */
}
.modal2:hover{
     width: 20%;
    height: 90%;
    padding:10px;
    line-height: 20px;
    position: fixed;
    top: 100px; 
    margin: 10%;
    overflow:auto;
    opacity:0;
    background-color: #ff5;
    border-radius: 15px;
    text-align: center;
    z-index: 11; /* 1px higher than the overlay layer */
}

.round {
    background-color: #990000;
    border-radius: 10px;
    padding-top: 2px;
    height:25px;
    width:180px;
    color:#c0c0c0
}
.round:hover{
    background-color:#bb0000;
    color:#fff;
}

.lightText{
    color:#d3d3d3;
    position: relative;
    top:0px;
    left:0px;
    font-size: 10px
}

table.whiteBG{
    background-color: #ffffff;
    font-size: 0.95em;
 
}
table.whiteBG.td {
    padding: 13px;
}
td.greyBG{
    width:25px;
    background-color:#c0c0c0;
}
.modHead{
    color:gray;font-size: 1.2em; margin-left:40px
}
.save{display:none}
.edit{display:block}
.delete{display:block}

.comment{
    width:26em;
    height:5em;
}
@media screen and (max-width: 799px) and (min-width: 10px) {
    .login{ display:none}
    .logstat{display:inline;}
    .contentIdx{ min-height:380px;background-color:#fff;opacity:1
}
}

