/* 
    Created on : 19-Dec-2017, 18:22:06
    Author     : Theta Design
*/
/*base colours: 
dark grey   dg #464646
grey        gr  #d6d7d5
light grey  lg  #f1f2f0

 logobg #1aaae0
 imgbg 4face1
coralblue ls #02baee  02baee
blue      slm  #0271c2 0271c2
orage f08a24
f1a5f1
*/


@font-face
{
font-family: Humanst521;  
src: url('Humanst521.eot');
src: url('Humanst521.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('Humanst521.ttf')  format('truetype') ;
}
@font-face
{
font-family: Xpress;
src: url(XpressSF.eot);
src: url('XpressSF.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('XpressSF.ttf')  format('truetype') ;
}
@font-face
{
font-family: Vivaldi;
src: url(Vivaldi.eot);
src: url('Vivaldi.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('Vivaldi.ttf')  format('truetype') ;
}

html,
body {
  font-family: Humanst521,  "Calibri", sans-serif;
  font-size: 100%;  
  }
  body {
      background-color: #8d8d8d;
  }
.row {
  margin: 0 auto;
  max-width: 55rem;
  width: auto;
} 
p {
    font-size: 1.1rem;
}
ul, ol, dl {
    font-size: 1.1rem;
}
#tilbud p#telefon {
     color: #02baee;
     font-weight: bold;  
     font-size: 1.5rem;
}
#portfolio .row {
    max-width: 100%;
}
#priser div.icon {
    text-align: center;
}
.menuimage {
    background-image: url(https://dev2.webforu.hu/antonia/img/menu1.png);
    background-repeat: no-repeat;
    background-position: center;
}
.top-bar-section ul li {
    height: 60px;
}
.slideshow{
  margin: 0 auto;
  max-width: none;
  width: 100%;
}  
.slideshow .columns {
    padding-left: 0;
    padding-right: 0;
 }
 div#startbutton {
   position: absolute;
top: 55%;
text-align: center;
 width: 100%;
 color: white;
  }
 div#startbutton p {
     width: 90%;
     margin: 0 auto;
     border-top: 1px solid white;
     /*font-family:Xpress, sans-serif;*/
     font-size: 1rem;
 }
 div#startbutton a#arrow{
     width: 0;
height: 0;
display: block;
width: 2rem;
margin: 0 auto;
/*border-style: solid;
color: #F2F1F0;
border: 1px solid #F2F1F0;
padding: 0.2rem;
border-width: 0.6rem 1.5rem 0 1.5rem;
border-color: #ffffff transparent transparent transparent;
text-transform: uppercase;
font-size: 1rem;
font-weight: bold;*/
opacity: 0.7;
 }
 div#startbutton a#arrow img {
     width: 80%;
     height: auto;
 }
  div#startbutton  a#arrow:hover{
 opacity: 1;
 }
 #startbutton button {
     background-color: #f1a51f;
     
 } 
 #startbutton button a {
     color: #000000;
 }
 footer.row a{
    color:#02baee;
    font-size: 1.2rem;
 }
 .photo  {
     text-align: center;
/*     background-color: #666;*/
     padding-bottom: 1rem;
 }
.big {font-size: 4rem;} 
h1 {
    text-align: center;
   font-family: Humanst521, "Humanst521", serif;
    font-size: 2.5rem;
    /*text-transform: uppercase;*/
    padding-bottom: 1rem;
}
#omos h1, #tilbud h1 {
    color: #0271c2 /*slm*/;
}
#tilbud h1 {
    color: #02baee /*slm*/;
}
#portfolio h1 {
    color: #02baee;
}
#special h1 {
    color: #1864a5;
    font-weight: bold;
    margin-top: 1rem;
}
/*elastic grid override*/
div.columns.elastic {
    padding-left: 0;
    padding-right: 0;
}
#elastic_grid {
    background-color: #555;
   }
  .og-grid li {
     width: 8rem;
} 
.elastislide-horizontal {
    padding: 10px 20px;
}
.elastislide-horizontal ul li {
    width: 50%;  
}
.og-details {
    padding: 0px 0px;
}
.og-details h3{
    height: 1px;
}
.og-details .infosep {
    margin: 2px 0px;
}
/*button*/
button, .button {
  font-family: Humanst521, "Arial", sans-serif;
  padding-top: 1rem;
  padding-right: 3rem;
  padding-left: 3rem;
  font-size: 1.3rem;
  background-color: #02baee;
  border-color: #0271c2;
  color: #f1f2f0;
 }
  button:hover, button:focus, .button:hover, .button:focus {
    background-color: #0271c2; }
  button:hover, button:focus, .button:hover, .button:focus {
    color: white; }
  /* end button*/

  section {
      padding: 1rem;
  }
  section#priser {
      background-color: #d6d7d5 /*gr*/; 
      padding: 0.5rem;
  }
  section#omos, section#success {
      background-color: #f1f2f0 /*lg*/;
  }
  section#portfolio, section#tilbud {
      background-color: #464646 /*dg*/;
  }
  section#omos{
      /*margin-top: -3.5rem;*/
  }
  section#special {
    background-color: #e5e6e6;
    text-align: center;
    padding: 0.5rem;
  }
  div.success {
       width:100%; 
  }
  #success .columns {
      padding-left: 0;
      padding-right: 0;
  }
  .successslides p {
     text-align: center;
     color: #0271c2;
     font-style: italic;  
     font-size: 1rem;
   }
   #tilbud p {
       color: #f1f2f0;
   }
  .tabs-content {
    background-color: /*lg*/ #fff;
}
dl.tabs dd {
    width: 33.3333%;
}

#tilbud img {
    width: 10%;
    margin-right: 1rem;
}
/*nav override*/ 

li.name > h1 > a {
    text-align: left;
    font-size: 1.5rem;
}

  .contain-to-grid {
  background: none repeat scroll 0 0 #FFF; 
}
.top-bar {
  background: none repeat scroll 0 0 #FFF; 
}
.top-bar-section {
    padding: 0;
}
.top-bar-section ul {
  background: none;
  font-size: 1rem;
  top: 0px;
  position: relative;
}
@media only screen and (max-width: 767px) {
.top-bar-section ul {
  top: 20px;
}
}

  .top-bar-section .divider,
  .top-bar-section [role="separator"] {
    border-top: solid 1px #1a1a1a;
    clear: both;
    height: 1px;
    width: 100%; }
  .top-bar-section ul li > a {
    display: block;
    width: 100%;
    color: #464646;
    padding: 12px 0 12px 0;
    padding-left: 15px;
    font-family: Humanst521, sans-serif;
    font-size: 1rem;
    font-weight: normal;
    text-transform: none;
    background: none; }
  
    .top-bar-section ul li > a.button {
      font-size: 1rem;
      padding-right: 15px;
      padding-left: 15px;
      background:none;
      background:none;
      color: #FFFFFF; }
      .top-bar-section ul li > a.button:hover, .top-bar-section ul li > a.button:focus {
        background:none; }
      .top-bar-section ul li > a.button:hover, .top-bar-section ul li > a.button:focus {
        color: #464646; }
    .top-bar-section ul li > a.button.secondary {
      background:none;
      border-color: #b9b9b9;
     color: #464646;}
      .top-bar-section ul li > a.button.secondary:hover, .top-bar-section ul li > a.button.secondary:focus {
        background-color: #b9b9b9; }
      .top-bar-section ul li > a.button.secondary:hover, .top-bar-section ul li > a.button.secondary:focus {
       color: #464646;}
    .top-bar-section ul li > a.button.success {
      background-color: #43ac6a;
      border-color: #368a55;
      color: #464646; }
      .top-bar-section ul li > a.button.success:hover, .top-bar-section ul li > a.button.success:focus {
        background-color: #368a55; }
      .top-bar-section ul li > a.button.success:hover, .top-bar-section ul li > a.button.success:focus {
        color: #464646; }
    .top-bar-section ul li > a.button.alert {
      background-color: #4face1;
      border-color: #cf2a0e;
      color: #464646; }
      .top-bar-section ul li > a.button.alert:hover, .top-bar-section ul li > a.button.alert:focus {
        background-color: #cf2a0e; }
      .top-bar-section ul li > a.button.alert:hover, .top-bar-section ul li > a.button.alert:focus {
        color: #464646; }
  .top-bar-section ul li > button {
    font-size: 0.8125rem;
    padding-right: 15px;
    padding-left: 15px;
    background:none;
    background:none;
    color: #464646; }
    .top-bar-section ul li > button:hover, .top-bar-section ul li > button:focus {
      background:none; }
    .top-bar-section ul li > button:hover, .top-bar-section ul li > button:focus {
      color: #464646; }

  .top-bar-section ul li:hover:not(.has-form) > a {
    background:none;
    color: #0271c2; }
  .top-bar-section ul li.active > a {
    background: #0271c2;
    color: #464646; }
    .top-bar-section ul li.active > a:hover {
      background:none;
      color: #0271c2; }
  .top-bar-section .has-form {
    padding: 15px; }


 .top-bar .toggle-topbar a {
     color: #464646;  
}
.top-bar-section .button  {
    background: none;
   color: #464646 /*dg*/;
  text-transform: uppercase;
  font-weight: normal;
} 
.contain-to-grid .top-bar {
  margin: 0 auto;
  max-width: 100%;
  background-color: #158fbc;
  border-bottom: 3px solid #f1a51f;
  height: 65px;
}
.top-bar.expanded {
  background: #158fbc;
  color: white;
}
.top-bar.expanded .title-area {
    background: none repeat scroll 0% 0% #158fbc;;
}

 
/*end topbar*/

/* Tiny Carousel */


/*#textslider { height: 1%; overflow:hidden; position: relative;   top: -25rem;  z-index: 100;  }*/
#textslider {
  height: 1px;
  position: absolute;
  top: 20%;
  width: 100%;
  z-index: 30;
  left: 0;
}
#textslider .viewport { 
    height: 2.9rem; 
    overflow: hidden; 
    position: relative;    
   }

#textslider .disable { visibility: hidden; }
#textslider .overview { 
    list-style: none;
    position: absolute;
    padding: 0; 
    margin: 0;
    width: 100%; 
/*    left: 50%; 
    margin-left: -25%; */
    top:0; 
}
#textslider .overview li{ 
/*    float: left; */
    margin: 0 auto;
    padding: 1px;
     /*text-transform: uppercase;*/ 
    text-align: center;
    font-size: 2.4rem; 
    color: #FFF; 
    height: 3.568rem; 
     line-height: 2.4rem;
    border:none;
    width: 320px;
}
#textslider .overview li span{
    font-family: Humanst521, "Arial", sans-serif;
    /*font-weight:  bold;*/
    /*font-style:  italic  ;*/
   font-size: 2.6rem;
    /*text-transform: none;*/
    letter-spacing: 0.4rem;
 }


/*form validation*/
.invalid input:required:invalid {
     border: 4px solid #0271c2;
     background: #f1f2f0;
    
}

.invalid input:invalid {
    border: 2px solid white;
     background:  #02baee;
    
}
.invalid input:required:valid {
   border: 2px solid #5da423;
}

.invalid input:valid {
  border: 2px solid #5da423;
}
input {
  display: block;
  margin-bottom: 10px;
}
input.button:valid {
    border: none;
}
 @media only screen and (min-width: 25em) {

#textslider .viewport { 
    height: 4.5rem;        
   }
 #textslider .overview li{ 
    font-size: 3rem;      
    height: 4.5rem;
     line-height: 3rem;
    width: 360px;
} 
#textslider .overview li span{
       font-size: 3.5rem;
  }
  
}
  
 


@media only screen and (min-width: 40.063em) { 
  html {
  font-size: 110%;  
  }
  p {
      font-size: 1.2rem;
  }
  ul, ol, dl {
    font-size: 1.2rem;
}
 .successslides p {
     font-size: 1.3rem;
   }
      section {
      padding: 2rem;
  } 
   div#startbutton  a#tilbud{
width: 3rem;
 }
  div#startbutton p {
      font-size: 1.5rem;
      width: 70%;
 }
#textslider .viewport { 
    height: 5rem;        
   }
 #textslider .overview li{ 
    font-size: 4rem;      
    height:5rem;    
     line-height: 4rem;
    width: 700px;
} 
#textslider .overview li span{
       font-size: 4.5rem;
}
 .og-grid li {
     width: 12rem;
} 
}
 @media only screen and (min-width: 64.063em) {
 
   div#startbutton a{
width: 4rem;
 }
  div#startbutton p {
     width: 60%;
     font-size: 2rem;
  }
#textslider .viewport { 
    height: 6rem;        
   }
 #textslider .overview li{ 
    font-size: 5rem;      
    height: 6rem; 
    line-height: 5rem;
    width: 960px;
} 
#textslider {
  top: 30%;}
#textslider .overview li span{
       font-size: 5.5rem;   }
#portfolio .row {
    max-width: 90%;
}
  }
 
@media only screen and (min-width: 80em) { 
 #portfolio .row {
    max-width: 70%;
}   
}
@media only screen and (max-width: 600px) { 
 
    .startbuttonbox {
      margin-bottom: 50px;
    }
    #priser .medium-4 {
        margin-bottom: 40px;
    }
    .validate-form .button {
        margin-top: 20px;
    }
    .top-bar-section ul {
        display: none;
    }
    .successslides {
    height: 16rem;
    width: 80%;
    margin: 1.5rem auto 0 auto;
}
}