﻿/*
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(http://fonts.googleapis.com/css?family=Open+Sans);
@import url(http://fonts.googleapis.com/css?family=Federo);
@media all and (min-width: 980px) {
    .profile_box{
        margin-left: 0px;
        left: 0px;
    }
}
body{
    margin:auto;
    padding: 0px;
   // background-image: url(../images/top.png);
   background-image:url('../images/DGMbg2.jpg');
    background-repeat: no-repeat;
    background-attachment:  fixed;
  //  min-width: 1050px;
    font-family: sans-serif;
    font-size:12pt;
    min-height: 100%;
    overflow-y: scroll; 
  
}
.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;
}
body:after {
  
}
div.content{
    position:relative;box-shadow: 5px 5px 5px #000;margin-top:-60px;margin-left:auto; margin-right:auto;width:100%;
    min-height: calc(100vh - 300px);background-color:#fff;opacity:0.9;

}
div.menu-line{
    width:100%; margin-left:auto; margin-right:auto; margin-top:-15px;border-radius:0px;
}
div.bigTxt{
    font-size:18pt
}
.top{
    height: 133px;
    width: 100%;  

        overflow:hidden;
        background: rgba(226,226,226,1);
background: -moz-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 22%, rgba(219,219,219,1) 35%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(226,226,226,1)), color-stop(22%, rgba(219,219,219,1)), color-stop(35%, rgba(219,219,219,1)), color-stop(51%, rgba(209,209,209,1)), color-stop(100%, rgba(254,254,254,1)));
background: -webkit-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 22%, rgba(219,219,219,1) 35%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
background: -o-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 22%, rgba(219,219,219,1) 35%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
background: -ms-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 22%, rgba(219,219,219,1) 35%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
background: linear-gradient(to bottom, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 22%, rgba(219,219,219,1) 35%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe', GradientType=0 );
}
.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);
}
.containerLoad{
    display:none;
    position:fixed;
    top:-50%;
        left:50%;
}

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

.top_cart{
    position: absolute; 
    top:165px;
    right:180px;
    z-index:10;
    
}
.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;
    //box-shadow: 3px 3px #1d1d1d;
    border-radius: 5px;
}
.search_wrapper{
    margin-left:-525px;
    left:50%;
    position: relative;
    width:1053px;
    height:60px;
    background-color: #fc9835;
    //top:620px;
    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{
    //font-weight: bold;
    border-style:solid;
    border-width:thin;
    border-color:#fc9845;;
    height:35px;
    width:310px;
    padding: 5px;
    padding-bottom:30px;
    font-family: sans-serif;
    font-size: 12pt;  
    cursor:pointer;
    
  //  background-color:#808080;
        //padding:7px;
      //  left:740px;
    //    color:#f0f0f0;
       // cursor: pointer;
       // border-radius:12px;
}
.search_label:hover{
border-color:#303030;
}
.search_label{
    //font-weight: bold;
    height:35px;
    width:310px;
    padding: 5px;
    padding-bottom:30px;
    font-family: sans-serif;
    font-size: 12pt;  
    cursor:pointer;
    
  //  background-color:#808080;
        //padding:7px;
      //  left:740px;
    //    color:#f0f0f0;
       // cursor: pointer;
       // border-radius:12px;
}

.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{
    //font-weight: bold;
            border-style:solid;
    border-width:thin;
    border-color:#fc9845;;
    height:20px;
    width:320px;
    padding: 12px;
    font-family: sans-serif;
    font-size: 12pt;  
    
  //  background-color:#808080;
        //padding:7px;
      //  left:740px;
    //    color:#f0f0f0;
       // cursor: pointer;
       // border-radius:12px;
}
.search_label_sml{
    width:150px;
    height:60px;
}

 
  .combobox-border {
    
   // border: 2px solid #fc9835;
    height:25px;
    margin-top:3px;
   
   
  }
  .combobox-inside{
     position:absolute;
     
  }
  .custom-option{
   color:#fc9845;
  }
  .custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
  }
  .custom-combobox-input {
    margin: 0;
        width:130px;
  
    padding: 5px 10px;
  }
  ul.ui-autocomplete.ui-menu{width:150px; font-size: 0.7em}
 

.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;
}

.sliderDiv{
    font-size:9pt;
}
.results_box{
    margin-left:20px;
    width:200px;
    height:200px;
    padding-bottom: 0px;
    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: 0px;
    position:relative;
}
.logstat{
    float:left;
    background-color: #c0c0c0;
    border-radius: 10px;
    margin-top:10px;
    padding:5px;
    cursor: pointer;
}
.results_label{
    
    color:#222;
    height:63px;
    width:200px;
    font-family: sans-serif;
    font-size: 8pt;
    top:133px;
    left:0px;
    padding-top: 35px;
    padding-right: 2px;
    text-align: right;
    position: absolute;
   
}
.results_txt{
    font-family: sans-serif;
    font-size:8pt;
    top:140px;
    position:absolute;
    left:15px;
  font-weight:bold
}
.result_pic{
    max-width:100%;
    cursor:pointer;    
    position:absolute ;  
}
.add_cart{
    color:9c2d2d;
    opacity: 0.8;
    left:13px;
    top:170px;
    background-color: #c0c0c0;
    position:absolute;
    height:20px;
    width:80px;
    border-radius: 20px;
    text-align: center;
    
    font-size: 9pt;
    cursor:pointer;
}

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-image: url(../images/top.png);
    background-repeat: no-repeat;
   
    color:#999999;
    opacity: 0.8   
}
.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;
}
        
input.filterInp{
    width: 130px;
    font-size:9pt;
}
        /* jssor slider arrow navigator skin 02 css */
        /*
        .jssora02l                  (normal)
        .jssora02r                  (normal)
        .jssora02l:hover            (normal mouseover)
        .jssora02r:hover            (normal mouseover)
        .jssora02l.jssora02ldn      (mousedown)
        .jssora02r.jssora02rdn      (mousedown)
        */
         .jssorb01 {
                position: absolute;
            }
            .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
                position: absolute;
                /* size of bullet elment */
                width: 12px;
                height: 12px;
                filter: alpha(opacity=70);
                opacity: .7;
                overflow: hidden;
                cursor: pointer;
                border: #000 1px solid;
            }
            
            .jssorb01 div { background-color: gray; }
            .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
            .jssorb01 .av { background-color: #fff; }
            .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }

        .jssora02l, .jssora02r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 55px;
            height: 55px;
            cursor: pointer;
            background: url('../img/a02.png') no-repeat;
            overflow: hidden;
        }
        .jssora02l { background-position: -3px -33px; }
        .jssora02r { background-position: -63px -33px; }
        .jssora02l:hover { background-position: -123px -33px; }
        .jssora02r:hover { background-position: -183px -33px; }
        .jssora02l.jssora02ldn { background-position: -3px -33px; }
        .jssora02r.jssora02rdn { background-position: -63px -33px; }
/* jssor slider thumbnail navigator skin 11 css *//*.jssort11 .p            (normal).jssort11 .p:hover      (normal mouseover).jssort11 .pav          (active).jssort11 .pav:hover    (active mouseover).jssort11 .pdn          (mousedown)*/
.jssort11 .p {    font-size: 100pt; position: absolute;    top: 0;    left: 0;    width: 200px;    height: 69px;    background: #000000;}.jssort11 .tp {    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    border: none;}.jssort11 .i, .jssort11 .pav:hover .i {    position: absolute;    top: 3px;    left: 3px;    width: 60px;    height: 30px;    border: white 1px;}* html .jssort11 .i {    width /**/: 62px;    height /**/: 32px;}.jssort11 .pav .i {    border: white 1px solid;}.jssort11 .t, .jssort11 .pav:hover .t {    position: absolute;    top: 3px;    left: 68px;    width: 129px;    height: 32px;    line-height: 32px;    text-align: center;    color: #fc9835;    font-size: 13px;    font-weight: 700;}.jssort11 .pav .t, .jssort11 .p:hover .t {    color: #fff;}.jssort11 .c, .jssort11 .pav:hover .c {    position: absolute;    top: 38px;    left: 3px;    width: 197px;    height: 31px;    line-height: 31px;    color: #fff;    font-size: 11px;    font-weight: 400;    overflow: hidden;}.jssort11 .pav .c, .jssort11 .p:hover .c {    color: #fc9835;}.jssort11 .t, .jssort11 .c {    transition: color 2s;    -moz-transition: color 2s;    -webkit-transition: color 2s;    -o-transition: color 2s;}.jssort11 .p:hover .t, .jssort11 .pav:hover .t, .jssort11 .p:hover .c, .jssort11 .pav:hover .c {    transition: none;    -moz-transition: none;    -webkit-transition: none;    -o-transition: none;}.jssort11 .p:hover, .jssort11 .pav:hover {    background: #333;}.jssort11 .pav, .jssort11 .p.pdn {    background: #462300;}
     

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

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 100;
    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;
}
.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;
}
.righttxt{
    text-align:right;
}
.mymodal {
    width: 70%;
    max-width:920px;
    height: 80%;
    line-height: 20px;
    position: fixed;
    top: 0px; 
    left: 0;
    margin-left: 25%;
    margin-top:2%;
    overflow:auto;
    
    background-color: #fff;
    border-radius: 15px;
    text-align: center;
    z-index: 110; /* 1px higher than the overlay layer */
}


.modal2 {
    width: 20%;
    height: 90%;
    padding:10px;
    line-height: 20px;
    position: fixed;
    top: 100px; 
   // left: 50%;
    margin: 10%;
    overflow:auto;
    opacity: .7;
    background-color: #ff5;
    border-radius: 15px;
    text-align: center;
    z-index: 110; /* 1px higher than the overlay layer */
}
.modal2:hover{
     width: 20%;
    height: 90%;
    padding:10px;
    line-height: 20px;
    position: fixed;
    top: 100px; 
   // left: 50%;
    margin: 10%;
    overflow:auto;
    opacity:0;
    background-color: #ff5;
    border-radius: 15px;
    text-align: center;
    z-index: 110; /* 1px higher than the overlay layer */
}
.removePhoto{
   position:absolute;top:40px;left:-8px;height:20px;width:40px;overflow:hidden;cursor:pointer
}
.round {
    background-color: #990000;
    border-radius: 10px;
    padding-top: 2px;
    height:25px;
    width:180px;
    color:#c0c0c0
}
.round:hover{
    background-color:#bb0000;
    color:#fff;
}
a{cursor:pointer}
input{font-size:8pt}
.lightText{
    color:#939393;
    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
}
@media screen and (max-width: 1000px) {
	.faces{
	display:none;
}

        .topTruck {
            display:none;
        }
        div.bigTxt{
            font-size:10pt;
        }
        div.search_label{
                height:25px;
    width:300px;
    padding: 5px;
    padding-bottom:10px;
    font-family: sans-serif;
    font-size: 10pt; 
        }
}
