:root{
--main-color:#0F2C4A;
/*--main-color:#1e3f5a;*/
--main-font-color:#EDEDED;
--devider-color:#DDD;
--fs-small :12pt;
--fs-normal :14pt;
--fs-between :16pt;
--fs-big :20pt;
}
 
*,*:before,*:after{-webkit-box-sizing:inherit;-moz-box-sizing:inherit;box-sizing:inherit;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
@font-face{font-family:Lucida Grande;src:url(../bin/fonts/LucidaGrande.ttf);}
html{height:100%;box-sizing:border-box;}
html,body{font-family:'Montserrat', sans-serif;margin:0;padding:0;/* height:100%;padding-bottom:20rem;*/}

/* HEADER ################################################################### */
.logo{margin-top:10px;height:80px;}
.right-icon{float:right;}
header{background:#ff0;padding:10px;}

/* BODY ##################################################################### */
body{/* Height of the footer */ /* color:#222;font-size:var(--fs-normal);min-height:100%;height:100vh;*/}
body{position:relative;margin:0;padding-bottom:26rem;min-height:100%;}

/* FOOTER ################################################################### */
footer{min-height:17.4rem;color:var(--main-font-color);background-color:var(--main-color);width:100%;position:absolute;right:0;bottom:0;left:0;padding:1rem;}
footer a,footer a:hover{color:var(--main-font-color);}
.footer-flexbox-container{display:flex;gap:10px;padding:10px;}
.footer-flexbox-item{padding:10px;width:100%;}
.footer-flexbox-item:last-child{text-align-last:right;align-self:flex-end;flex-shrink:2;}
.flexbox-container{display:flex;}
.btn-red{background-color:#0096DB;}
.btn-red:hover{background-color:#0078AF;box-shadow:0 0 10px #0096DB;}
.btn-div{color:#FFF;padding:10px 20px;display:inline;background-color:#0096DB;border-radius:3px;}
.btn-div:hover{background-color:#0078AF;box-shadow:0 0 10px #0096DB;}
.one-object-image{max-width:400px;}
.flexbox-item{text-align:center;flex-basis:50%; align-content:center}

/* MASTERS OBJECTS ########################################################## */
.limited-digits{width:60px;}
.custom-file-input{color:transparent;}
.custom-file-input::-webkit-file-upload-button{visibility:hidden;}
.custom-file-input::before{content:'Select some files';color:black;display:inline-block;background:-webkit-linear-gradient(top, #f9f9f9, #e3e3e3);border:1px solid #999;border-radius:3px;padding:5px 8px;outline:none;white-space:nowrap;-webkit-user-select:none;cursor:pointer;text-shadow:1px 1px #fff;font-weight:700;font-size:10pt;}
.custom-file-input:hover::before{border-color:black;}
.custom-file-input:active{outline:0;}
.custom-file-input:active::before{background:-webkit-linear-gradient(top, #e3e3e3, #f9f9f9);}
.custom-file-input{margin-right:-120px;}
.object-fb-container{display:flex;gap:4px;flex-direction:row;flex-wrap:wrap;width:100%;}
.object-footer{position:absolute;right:0;left:0;bottom:10px; padding:10px 0;} /*background-color: yellow;*/
.object-name{color:var(--main-color);font-weight:bold;margin:10px 0;}
.object-image{max-height:200px; max-width: 94%;z-index:-1;}
.object-image-container{position:absolute;right:0;left:0;}
.price-reduced{text-decoration:line-through;font-size:var(--fs-small);color:#bbb;}
.cart-notis,#antal-i-korgen{background-color: #CC0000; color: #fff; font-size: 12pt; margin-left:  -3px; margin-top: -10px; padding:0 6px; border-radius:50px;}

/* CIRCLES ################################################################## */
.circle-fb-container{gap:10px;justify-content:center;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;}
.circle-text{text-align:center;-ms-transform:translateY(-50%);transform:translateY(-50%);top:50%;left:0%;right:0%;position:absolute;}
.circle-fb-item{position:relative;width:240px;height:240px;background:var(--main-color)  ;border-radius:50%;color:#fff;background-color:var(--main-color);margin:10px auto;}
/* CIRCLES SLUT ############################################################# */

/* ADMIN #################################################################### */
div.admin-section{border:thick red solid;padding:10px;}
.admin-section{border:thick red solid;}
.admin-icon{height:20px;/*border:red 3px solid;padding:10px;margin:10px 0;font-size:120%*/}

/* Messages  ################################################################### */
.message2user{padding:20px;margin:20px;border:1px solid red;color:green;}
main{margin:0 auto;}

hr{margin: 50px 0; border-top:1px solid #F1f1f1;}

.square{max-width:300px;margin:10px;padding:10px;box-shadow:rgba(3, 102, 214, 0.3) 0px 0px 0px 3px;box-shadow:rgba(15, 44, 74, 1) 0px 0px 0px 1px;color:var(--main-color);/*background-color:var(--main-color);*/ /*color:var(--main-color);*/}
.stone-color{width:38px;height:38px;border-radius:50%;}
/*.stone-color{width:38px;height:38px;border-radius:50%;margin:10px auto;}*/
.stone-color:hover{cursor:pointer;border:2px solid #fff;}
.close-cross{float:right;border:thin #999 solid;padding:1px 4px 2px 4px;border-radius:2px;color:#999;cursor:pointer;font-size:7.5pt;font-weight:500;}
.close-cross:hover{border-color:red;color:#fff;background-color:red;transition:ease-in .25s;}

.social{height:30px;margin:0 2px;}
.error-message,.warning{border:thin #EEE solid;color:black;margin-top:35px;text-align:center;padding:4px;font-size:16pt;background-color:yellow;position:relative;z-index:2000;}
.admin-controlpanel{border-bottom:thin red solid;clear:both;text-align:left;font-size:10pt;height:56px;}
.center-object{position:absolute;top:50%;left:50%;margin-right:-50%;transform:translate(-50%, -50%);}
select{background-color:#EDEDED;}
#loader{border:12px solid #f3f3f3;border-radius:50%;border-top:12px solid #444444;width:70px;height:70px;animation:spin 1s linear infinite;z-index:1000;float:left;}
@keyframes spin{100%{transform:rotate(360deg);}}
body{position:relative;}
.center{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;}
.annons-text{color:#222;font-style:italic;margin-left:12px;margin-bottom:2px;padding:8px;font-size:.9vw;background:rgb(125,112,90);background:linear-gradient(0deg, rgba(125,112,90,1) 0%, rgba(225,198,153,1) 10%, rgba(225,198,153,1) 95%, rgba(255,255,255,1) 100%);border-radius:0  30% 0 30%;text-align:center;}
.annons-text:hover{background:#40E0D0;}
.annons-text-container{position:absolute;z-index:1;margin-top:10px;display:inline;width:500px;}

/* DESIGN ORDER ############################################################# */
.input-text{font-size:16pt;margin-top:4px;}
.hole{width:100%;}
.halv{width:49.411499%;}
.fb-container{display:flex;}
.fb-item{flex-basis:50%;}
.demo-image{width:100%;}
.fb-container{display:block;}
/* DESIGN ORDER ############################################################# */

/* MASTER  ############################################################# */
.limited-digits{width:60px;}
.custom-file-input{color:transparent;}
.custom-file-input::-webkit-file-upload-button{visibility:hidden;}
.custom-file-input::before{content:'Select some files';color:black;display:inline-block;background:-webkit-linear-gradient(top, #f9f9f9, #e3e3e3);border:1px solid #999;border-radius:3px;padding:5px 8px;outline:none;white-space:nowrap;-webkit-user-select:none;cursor:pointer;text-shadow:1px 1px #fff;font-weight:700;font-size:10pt;}
.custom-file-input:hover::before{border-color:black;}
.custom-file-input:active{outline:0;}
.custom-file-input:active::before{background:-webkit-linear-gradient(top, #e3e3e3, #f9f9f9);}
.custom-file-input{margin-right:-120px;}

#offer-message{display:none;}
.offer{background-image:url('../images/offer.png');background-repeat:no-repeat;position:absolute;z-index:1;height:110px;width:110px;font-size:10pt;color:black;background-size:120px;/*position:relative;font-weight:bold;font-weight:200;border:black thin solid;float:right;*/}
.offer-position{position:absolute;top:6px;right:120px;}
.offer-text{position:absolute;}
.result,.result2{color:red;font-weight:bold;}





    .offer-text{
        position: absolute;
    }
    
 

.thumbnail{
    cursor: pointer;
    padding:2px;
    height: 30px;
    height:45px;
    border:thin #DDD solid;
    max-width:100%;
}
.thumbnail-holder{
    height:20px ;
    padding:3px;
    display: inline-block;
    margin: 2px;
    /*
    border:red 2px solid; 
    */
}




/* object  ############################################################# */
/*.flexbox-item:last-child{padding-left:40px;text-align:left;border-left:1px #EDEDED solid;}*/
.price_label{font-size:1.45rem;margin-bottom:25px ;}
.old-price{text-decoration:line-through;}
.new-price{color:red;}
.marge{height:100px;}
.pagetitel{font-weight:bold;border-bottom:solid thin #EDEDED;margin:30px 0;color:#222;padding-bottom:6px;}
.one-object-image{max-height:430px;z-index:-1; margin-top: auto;}

/* SECTION-waranty  ############################################################# */

ul.warranty{list-style-type:square;list-style-position:outside;list-style-image:none;}
.list-title{text-align:left;font-size:20pt;}
ul.warranty li{text-align:left;}
li{/*list-style-image:url(/right-arrow.svg);*//*list-style-type:'👉';*//*padding-inline-start:1ch;*/}

/* SUPER PAGE  ############################################################# */
/*.sub-container{position:absolute;width:100%;bottom:0;margin-top:auto;left:0;padding:4px;height:auto;}*/

/* NAVIGATOR */
.navig{text-align:center;display:inline-block;border:1px solid var(--main-color);margin:1px;width:30px;height:30px;line-height:30px;color:var(--main-color);}
.navig:hover{background-color:var(--main-color);color:#fff;}
.nav_act{color:#fff;background-color:var(--main-color);border:1px solid var(--main-color);font-weight:bold;}
a{text-decoration:none;}
/* NAVIGATOR SLUT */


/*campaign.php ######################################################*/
.limited-digits{width:60px;}
/*customer.php*/
.field{font-size:20pt;}
.admin-flex{display:flex;justify-content:center;}
.admin-felt{font-size:10pt;padding:10px;}

/* NAVIGATOR ################################################################ */


/* FORM ##################################################################### */
input[type=text],select{margin:2px 0;}
input[type=submit],.btn,button{margin:10px 0;min-width:100px;background-color:var(--main-color);color:white;border:none;border-radius:4px;padding:10px 20px;font-size:var(--fs-small);}
input[type=submit]:hover,.btn:hover,button:hover{cursor:pointer;background-color:#026e9f;box-shadow:0 0 10px var(--main-color);}
input[type=checkbox]{transform:scale(1.5);}
textarea,input.kontakt{;width:100%;margin:10px auto;}
textarea{height:100px;overflow:auto;resize:none;}


/* HTML ##################################################################### */

h2{margin:20px 0;box-shadow:rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;color:#333;margin:4px 4px 4px 4px;padding:10px;/* background-color:var(--main-color);background-color:#fff;color:var(--main-color);*/}
h3{color:#000;padding:0px;border-radius:2px;margin-bottom:40px;box-shadow:rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;box-shadow:rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;box-shadow:rgba(0, 0, 0, 0.16) 0px 1px 4px;/*background-color:#212F3D;*/ /*margin:0px;*/ /*background-color:var(--main-color);*/}
a{text-decoration:none;color:blue;}
a:hover{color:#004E7C;}
.text-left{text-align:left !important;}
.warning_text{color:red;}
.warning-danger{color:#FFF; background-color: #BB1938  }
.warning_end{ text-align: center;color: #000; font-size:20px; background-color: orange; border: none; margin: 0 4px; padding: 10px 0;}
/* STARTSIDA ################################################################ */
.expo-text{text-align:center;margin:50px 10px;font-size:var(--fs-between);}
.text-left{text-align:left;}
.white-color{color:#fff}
.garanti-icon{float:right;margin:8px 2px}
.txt-rotate{text-shadow:1px 1px 1px #000, 3px 3px 5px blue;-ms-transform:rotate(10deg);/* IE 9 */transform:rotate(-10deg);font-size:var(--fs-big);}
.slideshow{list-style-type:none;}
.slideshow, .slideshow:after{position:relative;top:-20px;/*Not sure why I needed this fix*/left:0px;width:100%;z-index:0;}
.slideshow li span{position:absolute;width:100%;height:100%;top:0px;left:0px;color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;opacity:0;z-index:0;animation:imageAnimation 30s linear infinite 0s;}
/*.slideshow li:nth-child(1) span{background-image:url("../images/slideshow/slide2.jpg");}
.slideshow li:nth-child(2) span{background-image:url("../images/slideshow/slide1.jpg");animation-delay:6s;}
.slideshow li:nth-child(3) span{background-image:url("../images/slideshow/slide3.jpg");animation-delay:12s;}
.slideshow li:nth-child(4) span{background-image:url("../images/slideshow/slide4.jpg");animation-delay:18s;}
.slideshow li:nth-child(5) span{background-image:url("../images/slideshow/slide5.jpg");animation-delay:24s;}*/
@keyframes imageAnimation{0%{opacity:0;animation-timing-function:ease-in;}8%{opacity:1;animation-timing-function:ease-out;}17%{opacity:1}25%{opacity:1}100%{opacity:0}}
@keyframes titleAnimation{0%{opacity:0}8%{opacity:1}17%{opacity:1}19%{opacity:0}100%{opacity:0}}
.no-cssanimations .cb-slideshow li span{opacity:1;}
.slideshow ul{width:100px;}
.design-bild{max-height:300px;}
/* ADMIN */
.image{width:200px;}
.objects-container{display:flex;flex-wrap:wrap;gap:0;border:red 2px solid;}
.objects-container *{position:relative;text-align:center;}
.object-container{display:inline-block;margin:10px;border:#ededed thin solid;width:23%;}
.edit-icon{display:none;}
.edit-icon:hover + .object-container{border:black thin solid;display:inline-block;}
.delete-cross{position:absolute;right:20px;top:-40px;border:#222 thin solid;padding:0 4px;display:none;}
.delete-cross-object{ color:red;right:0px;top:0px; font-size: 10pt; padding:0 5px 2px 5px; cursor: pointer; }
.delete-cross-object:hover{ background-color: red; color:#fff;}
.image{border:#222 thin dashed;}
.hide{display:none;}
/* ADMIN */
#imagecontainer{background:url("https://svenskagravstenar.se/images/prisgaranti.png") no-repeat;width:88px;height:96px;border:1px solid;background-size:contain;display:inline-block;float:right;color:white;font-size:8pt;text-align:center;padding-top:15px;}
.kampanj{position:absolute;top:44px;right:10px;font-size:10pt;background-image:url("../images/rabatt.png");z-index:1;width:60px;height:56px;padding-top:18px;text-align:center;color:#BB1938;color:#FFF;font-weight:bold;}
.object-fb-item{border:1px solid #DDD;flex:0 0 24.5%;text-align:center;position:relative;}
.object-fb-item:hover,.fb-expo-item:hover{box-shadow:rgba(0, 0, 0, 0.35) 0px 5px 15px;}

.object-footer-text-info{color:#999;margin-bottom:23px;}

.responsive-on{ display: none;}
.responsive-off{ display: block;}    

 .front-label{text-align: center; font-size: 16pt; font-weight: 600;box-shadow:rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;color:#333; padding: 10px 0; margin:4px;}
 

.fb-expo-container{display: flex;flex-wrap: wrap; }
.fb-expo-item{ position: relative; text-align: center; padding-top:20px;  flex-basis: 33%;margin-top: auto;}


    input[type=text],select{
        margin: 2px 0;
    }
 

        
    
.gravsten{
    /*width: 200px;*/
    max-height:190px;
    
}


/* master */


 
        table.admin td{
            vertical-align: top;
        }
        .limited-digits{
            width: 60px;
        }
         table.admin td:first-child{
            
            vertical-align: middle;
        }
        
        
        .custom-file-input {
  color: transparent;
}
.custom-file-input::-webkit-file-upload-button {
  visibility: hidden;
}
.custom-file-input::before {
  content: 'Select some files';
  color: black;
  display: inline-block;
  background: -webkit-linear-gradient(top, #f9f9f9, #e3e3e3);
  border: 1px solid #999;
  border-radius: 3px;
  padding: 5px 8px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  text-shadow: 1px 1px #fff;
  font-weight: 700;
  font-size: 10pt;
}
.custom-file-input:hover::before {
  border-color: black;
}
.custom-file-input:active {
  outline: 0;
}
.custom-file-input:active::before {
  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9); 
}
 
.custom-file-input{
    
    margin-right: -120px;
}


/* MEDIA QUERIES  ########################################################### */

@media only screen and (max-width:760px){
 .front-label{font-size: 12pt;}
body{padding-bottom:50rem;/* height:100vh;height:100%;*/}
main{padding:1rem;}
nav ul li{display:block;width:94%;}
.bild{width:100px;}
.call-out{width:47%;margin:.5em 1em;}
.call-out{width:23.5%;margin:0;}
.call-outs{justify-content:space-between;}
.circle-fb-item{width:55vw;height:55vw;}
.circle-fb-container{display:block;flex-direction:column;}
.design-bild{width:100%;height:auto;}
.flexbox-container,.flexbox-object-container{display:block;}
.flexbox-object{max-width:none;}
.flexbox-item,.fb-item{width:100% ;margin:10px auto ;}
.fb-item{height:350px;}
.object-fb-item{flex-basis:49.5%;padding-top:20px;width:40%;}
.footer-flexbox-container{display:block;}
.footer-flexbox-item:last-child{text-align-last:center;}
.garanti-icon{width:120px;}
.logo,.right-icon{height:50px;}
.slideshow, .slideshow:after{top:0;}
.toggle{display:block;}
.txt-rotate{transform:none;/*margin-top:-50px;*/ ;width:200px;}
#imagecontainer{ display: none;}
h2{ font-size:14pt;}
.stone-color{width:25px;height:25px;}
/*h1{text-align:center;}*/
.responsive-on{ display: block;}
.responsive-off{ display: none;}
.offer-responsive{top:-10px;left: 30px;font-size:8pt;background-size:80px;}

.gravsten{max-width: 90%;}



}
  @media screen and (max-width:930px){ .annons-text-container{ display: none;} }
/*@media screen and (max-width:900px){.object-fb-item{flex-basis:32.3%;}}*/
@media screen and (max-width:900px){.object-fb-item{flex-basis:32.3%;}}
@media screen and (max-width:600px){.object-fb-item{flex-basis:48.3%;}}
@media screen and (max-width:600px){.object-fb-item{flex-basis:48.3%;}}
@media screen and (max-width:600px){.fb-expo-item{flex-basis:47.3%;}}

@media screen and (max-width:900px){
    body{padding-bottom:30rem;}
    footer{min-height:20rem;}
}