/*	This is the master css of the website where all css code should go.
        NOTE: If you are using individual css for each page this should only contain the items you want to be constant throughout the website.
*/

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic|Amaranth&subset=latin,latin-ext);
@font-face {
    font-family: 'cac_champagneregular';
    src: url('/styles/stylesets/201708gifthampers/fonts/cacchamp.woff2') format('woff2'),
         url('/styles/stylesets/201708gifthampers/fonts/cacchamp.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
body{font-family: 'Open Sans', sans-serif; font-size:1em; padding: 0px; margin:0px; width:100%; color:#111111; background:url('/styles/stylesets/201708gifthampers/images/bg.jpg') center center fixed;}
img{border:0px; max-width:100%; height:auto !important;}
img[src*="gstatic.com/"], img[src*="googleapis.com/"] {max-width: none;}
a:link, a:visited{text-decoration:none; color:#2121aa;}
a:hover, a:active{text-decoration:none; color:#6b21aa;}
h1, h2, h3, h4, h5, h6, .title, .boxtitle, .boxtitledefault{margin-bottom:5px;font-family: 'cac_champagneregular', sans-serif; color: #000000;}
.title, .boxtitle, .boxtitledefault{font-size:2.5em;}

h1{font-size: 3em; margin: 0 !important;}
h2{font-size: 2em; margin: 0 !important;}
h3{}

#container{width:100%; margin:0; padding:0;}
#hdrTop{background:url('/styles/stylesets/201708gifthampers/images/hdr.jpg') center top fixed; height: 500px;}
#header{width:100%;  margin:0 auto; padding:0; background: rgba(40,159,186,0.8);}
#header #hdrWrap{max-width: 1200px;margin:auto;text-align: center; }
#header #hdrLogo{display:inline-block;width:50%;vertical-align: middle;}
#header #hdrInfo{display:inline-block;width:50%;vertical-align: middle;}
#header #hdrLogo #logoBg{max-width: 100%; padding:5px; display:inline-block;margin:10px 5px;font-family: 'cac_champagneregular', sans-serif; color:#ffffff; }
#header #hdrLogo #logoBg a:link, #header #hdrLogo #logoBg a:visited{text-decoration:none; color:#ffffff; font-size: 5em;}
#header #hdrLogo #logoBg a:hover, #header #hdrLogo #logoBg a:active{text-decoration:none; color:#ffffff;}
#header #hdrInfo #keyBg{max-width: 100%; padding:5px; display:inline-block; font-size: 1.5em;margin:5px 5px;font-family: 'cac_champagneregular', sans-serif; color:#ffffff;}

#header #hdrInfo #detailBg{max-width: 100%; padding:5px; display:inline-block; font-size: 1.5em;margin:5px 5px;font-family: 'cac_champagneregular', sans-serif;}
#header #hdrInfo #detailBg>ul{padding:0;margin:0;}
#header #hdrInfo #detailBg>ul>li{display:inline-block;list-style: none;margin:0;padding:0;}
#header #hdrInfo #detailBg>ul>li>a:link,#header #hdrInfo #detailBg>ul>li>a:visited{display: block;padding:0px 15px; margin:0; color:#ffffff;}
#header #hdrInfo #detailBg>ul>li>a:hover,#header #hdrInfo #detailBg>ul>li>a:active{color:#111;}
#header #hdrInfo #detailBg>ul>li>a>span{display:inline-block;vertical-align: middle;height: 40px;line-height: 40px;padding:0px 2px;}
#header #hdrInfo #detailBg.mobile>ul>li>a>.detailTxt{display:none;}

.secBox{background: #ffffff; box-shadow: 0 1px 2px #b0b0b0; padding: 15px;}
.secBox h2{font-size: 2.6em;}
.secBox .textBox{max-width: 1200px; margin: auto;}
.productWrap{display: flex; max-width:1200px; margin: auto;}
.productBox{vertical-align: middle; background: #ffffff; box-shadow: 0 1px 2px #b0b0b0; padding: 15px; margin: 5px; align-items: center; width: 33%;}
.productDetails{}
.productImg{text-align: center;margin: auto;}
.productTitleWrap{display: flex;}
.productTitle{flex-grow: 2;}
.productPrice{flex-grow: 2; color: #ffffff; background: #30a2bc; padding: 5px; border-radius: 5px;}
.productPrice h2{color: #ffffff;font-size: 1.5em; text-align: center;}
.productInfo{}
.Info{margin: 5px 0 5px 0; height: 125px;}
.Info2{margin: 5px 0 5px 0; height: 100px;}
.order{margin: auto; text-align: center;}
.order a:link,.order a:visited{display: block;padding:0px 15px; margin:0; color:#ffffff; background: #30a2bc; font-family: 'cac_champagneregular', sans-serif; font-size: 1.5em; padding: 10px; border-radius: 5px; text-align: center;}
.order a:hover,.order a:active{color:#000000; background: #bebebe; }


#quicklinks{background:#efefef; border:1px solid #cfcfcf;}
#quicklinks ul, #quicklinks li{list-style:none; display:inline;}
#contentmask{width:100%; height:100%; margin: auto; }
#contentbox{max-width:100%; margin:0 auto;padding: 0; }
#sidebar{max-width:100% ;margin: auto;}
#footer{width:100%;margin:0; padding:0;color:#fff; background: rgba(40,159,186,0.8);}
#footer a:link, #footer a:visited{text-decoration:none; color:#fff;}
#footer a:hover, #footer a:active{text-decoration:underline; color:#ddd;}
#footer #copytext{text-align:center; line-height:2em; min-height:3em; font-size:0.8em;padding:10px;}

.clearboth{clear:both;}
.list_row1{padding:5px;border-bottom:1px solid rgba(0,0,0,0.1); background-color:rgba(200,200,200,0.1); border-top:1px solid rgba(0,0,0,0.1);transition: 0.3s ease-in-out;}
.list_row2{padding:5px;background-color:rgba(250,250,250,0.1);transition: 0.3s ease-in-out;}
.highlight, .list_row1:hover, .list_row2:hover{background-color:rgba(255,255,255,0.9);}
form{ background: #ffffff;margin:2px;padding:5px;}
form div{max-width: 1200px !important; margin: auto;}
.buttons{display:inline-block;padding:4px 2px 4px;font-size:1em;line-height:1.5em;color:#303030;text-align:left;text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);background-color:#fefefe;border:1px solid #a0a0a0;border-bottom-color:#505050;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);margin:1px;}
.buttons:hover{box-shadow:0 0 4px #808080;background-color:#e0e0e0; background:linear-gradient(#e0e0e0, #e0e0e0 25%, #fefefe);}
input[type="text"]{cursor:text;}
input[type="submit"]{cursor:pointer;}
input[type="reset"]{cursor:pointer;}
input[type="checkbox"]{cursor:pointer;}
textarea{cursor:text;}
select{cursor:pointer;}

@media screen and (max-width:1200px){
    
}

@media screen and (max-width:1100px){
    .Info{font-size: 0.9em;}
    .Info2{font-size: 0.9em;}
    h2{font-size: 1.5em;}
    .secBox h2{font-size: 2.4em;}
}

@media screen and (max-width:1000px){
    #hdrTop{background:#53b2c8 url("/classes/timthumb.php?w=1000&h=500&zc=1&q=85&src=/styles/stylesets/201708gifthampers/images/hdr.jpg") no-repeat fixed top center;}
}

@media screen and (max-width:900px){
    .spcBox{margin:5px;}
    #header #hdrLogo #logoBg a:link, #header #hdrLogo #logoBg a:visited{font-size: 4em;}
    .productWrap{flex-wrap: wrap;}
    .productBox{width: 95%; margin: 0 auto 5px;}
    .productImg{display: inline-block;vertical-align: middle;width: 40%;}
    .productDetails{display: inline-block;width: 55%;vertical-align: middle;margin: 0 0 0 20px;}
    .Info{height: auto;}
    .Info2{height: auto;}
}

@media screen and (max-width:800px){
    #hdrTop{background:#53b2c8 url("/classes/timthumb.php?w=800&h=500&zc=1&q=75&src=/styles/stylesets/201708gifthampers/images/hdr.jpg")  no-repeat fixed top center; height: 350px;}
    #ddb_left_column{float:none !important;width:auto !important;}
    #ddb_right_column{float:none !important;width:auto !important;}
    .UserFormSecure13>div>div{min-height:2px; width:auto !important;float:none !important;}
    #header #hdrLogo #logoBg a:link, #header #hdrLogo #logoBg a:visited{font-size: 3em;}
    #header #hdrLogo{display:block;width:auto;}
    #header #hdrInfo{display:block;width:auto;}
}

@media screen and (max-width:700px){
    #header #hdrLogo{display:block;width:90%; margin:auto;}
    #header #hdrInfo{display:block;width:90%; margin:auto;}
    #header #hdrLogo #logoBg{max-width: 90%;}
    .productPrice h2{font-size: 1.2em; }
    h1{text-align: center;}
}

@media screen and (max-width:600px){
    #hdrTop{background:#53b2c8 url("/classes/timthumb.php?w=600&h=250&zc=1&q=65&src=/styles/stylesets/201708gifthampers/images/hdr.jpg") no-repeat fixed top center; height: 250px;} 
    #map-canvas{ width: 80% !important; margin:0 !important;}
    #header #hdrInfo #keyBg{font-size: 1.4em;}
    .Info{font-size: 0.8em;}
    .Info2{font-size: 0.8em;}
    .productBox{width: auto; ;}
    .productImg{display: block;width: auto;}
    .productDetails{display: block;width: auto;margin: 5px 0 0 0;}
}

@media screen and (max-width:500px){
    #header #hdrInfo #keyBg{font-size: 1.3em;}
}

@media screen and (max-width:400px){
}

@media screen and (max-width:360px){
}