:root {
  --bk2:#363636;
  --contain:contain;
  --colF:#ffffff;
  --hh1col:#383462;
  --footheight:110px;
  --hflow2left:86px;
  --hflow2wdth:30%;
  
  --pad1:9vw;
  --pad2:10vw;
  --pad3:11vw;
  --wval:1px;
 
  /* Small only */
@media screen and (max-width: 39.9375em) {
  --pad1:1vw;
  --pad2:1vw;
  --pad3:vw; 
  --wval:1px;
  --footheight:50px;
  --hflow2left:20px;
  --hflow2wdth:25%;
  }
  
/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
  --pad1:1vw;
  --pad2:1vw;
  --pad3:3vw;
  --footheight:70px;
}  
  
}

body{
background:#383462;
}

.at {
  color: white;
  cursor: pointer;
  display:inline;
}
.at:hover {
  color: blue;
}


.orFnt1{
color:#E0D9CD;
font-weight:bolder;
}
 .orFnt2{
color:#010920;
font-weight:bolder;
}


/* List */
.listel, .list2 , .list3 {
       list-style: none;    
       margin-left: 3%;      
       padding-left: 1.2em;   
       text-indent: -1.2em; 

}

ul.listel>li:before{               
      content: "\1F4A1";       
      font-size: large;      
      color: #d9534f;       
      margin-right: .5em;    
}

ul.list2>li:before{             
      content: "\272d";     
      font-size: large;       
      color: #E0D9CD;         
      margin-right: .5em;   
}

ul.list3>li:before{               
      content:"";        
      font-size: large;      
      color: #E0D9CD;        
      margin-right: .5em;    
}
ul.list3>li{                     
  padding-inline-start: 15px;
  list-style-type: '👉';
}

li {
      padding: .2em;          
}


.c-sel {
  display:inline-block;
  font-family: Arial;
width:100px;

background:transparent;
}

div.c-sel>select {

  background: transparent;
  color: #fff;
  border-color: #E0D9CD;
}

div.c-sel>select option {

  background-color:#3E3E3E !important;
  border: 0px !important;
  color: #E0D9CD;
  -webkit-appearance: none;
  line-height: 0px;
  outline: none;
}


div.c-sel>select:focus {
  border-color: blue;
  background-color:  transparent;
}

abbr {
    position: relative;
  }
abbr:hover::after {
     content: attr(data-title);
    position: absolute;    
    width: auto;
    top: 100%;
    left: 100%;
    display: block;
    padding: 1em;
    background: transparent;
    
  }
  
  
table  tr td {
    background-color:#e8faf6;
    border-top:1px solid black;
}


table tr:last-child td:last-child {
  border-bottom:1px solid black;}



#cont_el { }
 .hh1 {
 font-family:Georgia,serif;
 color:var(--hh1col);
 font-style: italic;
 display:block;
 font-size:calc(10px + 0.8vw);
 font-weight:normal;
 letter-spacing:-1.2px;
 line-height:1em;
 }

.hh1 strong{
 color:black;
 display:block;
 font-size:calc(28px + 3.5vw);
 font-weight:normal;
 letter-spacing:-0.2vw;
 line-height:1em;
 }
 
 div.card {
  max-width: 550px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  text-align: center;
  margin:0px auto;
  background-color:transparent;
    padding:0px;
}

div.header {
  background-color:  #eae7da ;
  color: black;
  padding: 0px;
  display: table;
  width:100%;position: relative;
}

div.contcard {
  padding: 10px;
  background-color: white;
  border-top:1px solid black;
text-align: center;
 font: italic small-caps bold 40px Georgia, serif;
 display: block;
}

.headerleft{
display:table-cell;
width:30%;
height:100%;
background-color:var(--bk2);

}
.headerright{
display:table-cell;
width:70%;
height:100%;
padding-right:15px;
}

.headerflow2{
margin:0px;
padding:0px;
position:absolute;
background-color:transparent;
top:86px;
left:var(--hflow2left);
width:var(--hflow2wdth);
height:auto;
}



.front1{
background:#99aff9; mix-blend-mode:hard-light;opacity: 0.5;
}
.front2{
background:#99aff9; mix-blend-mode:color-dodge;
}
.front3{
background: #000000;  mix-blend-mode:hard-light;
}
.front33{
background: #000000;  mix-blend-mode:hard-light;
}
.front4{
background: #000000; mix-blend-mode:overlay;
}
.front5{
background: #99aff9; mix-blend-mode:color-burn;
}

.frontt{
background: transparent; 
}

.medium-footer{
 font-family:Georgia,serif;
 color:white;
padding-top:12px;
font-size:25px;
 font-weight:normal;
}

.med-footer{
padding-top:22px;
font-size:25px;
border-top:2px solid white;
}

.med2-footer{
padding-top:12px;
font-size:17px;
border-top:2px solid white;
}

.sm1-foot{
padding-top:17px; margin:0px;
}

.sm2-foot{
padding-top:17px; margin:0px;
}

.wr13 {
    display: flex;
     
    padding:28px 0px 28px 0px;
    justify-content:center;
    background: #363636;
      }
      
      
.w12 {
 height: calc(433px + 2vw);
  display:flex;
   flex-direction: column;
    justify-content: flex-end;
    align-items: center; 
      }
      
.chcar{
 width:80px;
 height:130px;

} 
.chcar2{
 width:200px;
 height:120px;

}      
      
.btn {
    position: relative;
    cursor: pointer;
    font-family: "Bebas Neue", sans-serif;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 1px;
    border: none;
    padding: 14px 32px;
    background: #262626;
    color: #fff;
    font-size: 20px;
    text-transform: uppercase; 
     
  }
  
  .btn:before {
    content: "\A"; 
    position: absolute;
    width: 30px;
    height: 30px;
    top: -10px;
    left: -10px;
    border-top: 3px solid #fff;
    border-left: 3px solid #fff;
    transition: all 0.5s;
  }
  
  .btn:after {
    content: "\A";

    position: absolute;
    width: 30px;
    height: 30px;
    bottom: -10px;
    right: -10px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
    transition: all 0.5s; 
  }

  .btn:hover:before,
  .btn:hover:after {
    height: 100%;
    width: 100%;
  }
ul.no-bullets {
  list-style-type: none; /* Remove bullets */
  padding: 0; /* Remove padding */
  margin: 0; /* Remove margins */
}


.table{
    display: table;
        
}

.cella2{
        width:500px;
    height:400px;
    background:transparent;
    display:table-cell;
    vertical-align: middle;
    margin: 0 auto;
 }
 
.cella3{
        width:300px;
    height:260px;
    background:transparent;
    display:table-cell;
    vertical-align: middle;
    margin: 0 auto;
 } 

.imgspan{
   display:table-cell;
}



.fancy {
  --b: 5px;   /* control the border thickness */
  --w: var(--wval); /* control the width of the line*/
  --h: 1.6em; /* control the height of the element */
  --c: #0B486B;
  --mb:5px;
 
  width: fit-content;
  padding: 0 calc(2*var(--h)/3);
  padding-bottom:0px;
  margin-bottom:var(--mb);
  line-height: var(--h);
  color: var(--colF);
  clip-path: 
    polygon(
     calc(var(--h)/2) 0,100vw 0,
     100vw var(--b),100%  var(--b),
     calc(100% - var(--h)/2) 100%,-100vw 100%,
    -100vw calc(100% - var(--b)),0 calc(100% - var(--b))
    );
  border-image: var(--_g,linear-gradient(var(--c) 0 0)) fill 0//0 var(--w);
  margin-inline: auto;
}
.dash {
  background: var(--c);
  --_g: repeating-linear-gradient(90deg,var(--c) 0 10px,#0000 0 15px);
}




.imgBorder {
  padding: 15px 15px 0;
  background-color: white;
  box-shadow: 0 42px 43px rgba(34, 25, 25, 0.4);
  -moz-box-shadow: 0 11px 21px rgba(34,25,25,0.4);
  -webkit-box-shadow: 0 4px 34px rgba(34, 25, 25, 0.4);
}

.boxshadow 
{
  -moz-box-shadow: 3px 3px 5px #535353;
  -webkit-box-shadow: 3px 3px 5px #535353;       
  box-shadow: 3px 3px 5px #535353;
}
.roundbox
{  
  -moz-border-radius: 16px 16px 16px 16px;
  -webkit-border-radius: 16px;  
  border-radius: 16px 16px 16px 16px;
}



.iS1
{
box-shadow: 0.1rem 0.1rem #fff, -0.1rem -0.1rem #000;
}
.iS2
{
box-shadow: 0.1rem 0.1rem #000, -0.1rem -0.1rem #fff;
}


     

.img-rsp{     
max-width:100%;     
width: 100%!important;     
height: auto!important; }  

.img-rfit {
   width:auto ;/*100%*/
  object-fit: var(--contain);
  object-position: bottom;
}

.hovImg{    
max-width:100%;     
width: 100%!important;     
height: auto!important; 
position: relative;
display: inline-block;
}
.hovImg .imgTop {
display: none;
position: absolute;
top: 0;
left: 0;
z-index: 99;  animation-name: fade;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-duration: 3s;
  animation-direction: alternate;
    }
.hovImg:hover .imgTop {
        display: inline;

    }
@keyframes fade {
  0% { opacity: 1; }
  25% { opacity: 1; }
  75% { opacity: 0; }
  100% { opacity: 0; }
}

.socrow2{
display:block;
position:relative;
height:100px;
width: 370px;
padding:0px;
margin:0px;
}  
 
div.socrow2>ul {
  display: flex;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  align-items: center;
   align-content: stretch;
    flex-direction: row;
    padding:0px;
margin:0px;
}

div.socrow2>ul li {
  list-style: none;
      padding:0px 0px 0px 11px;
margin:0px;
}

div.socrow2>ul li a {
  width: 60px;
  height: 60px;
  background-color: #fff;
  text-align: center;
  line-height: 60px;
  font-size: 1.2em;
  margin:0px;
  display: flex;
  justify-content:center;
align-items: center;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
  border: 3px solid #fff;
  z-index: 1;
  padding:0px;
}

div.socrow2>ul li a .icon {
  position: relative;
  color: #262626;
  transition: .5s;
  z-index: 3; 
  padding:0px;margin:0px;text-align: center;
}

div.socrow2>ul li a:hover .icon {
  color: #fff;
  transform: rotateY(360deg);
}


div.socrow2>ul li a:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: #f00;
  transition: .5s;
  z-index: 2;
   padding:0px;
}

div.socrow2>ul li a:hover:before {
  top: 0;
}

div.socrow2>ul li:nth-child(1) a:before{

  background:var(--bk2);z-index:1;
}

div.socrow2>ul li:nth-child(2) a:before{
  background: #3b5999;
}

div.socrow2>ul li:nth-child(3) a:before{
  background: #55acee;
}

div.socrow2>ul li:nth-child(4) a:before {
  background: #0077b5;
}

div.socrow2>ul li:nth-child(5) a:before {
  background: #dd4b39;
} 

.cont1 {
  color: #e5e5e5;
  font-size: 30px;
  text-transform: uppercase;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.anima1 {
  height:50px;
  overflow:hidden;
  margin-left:0px;
}

.anima1 > div > div {
  padding: 0px;
  height:2.81rem;
  margin-bottom: 2.81rem;
  display:inline-block;
}

.anima1 div:first-child {
  animation: text-animation 8s infinite;
}

.first div {
  background-color:transparent;
}
.second div {
  background-color:transparent;
}
.third div {
  background-color:transparent;
}

@keyframes text-animation {
  0% {margin-top: 0;}
  10% {margin-top: 0;}
  20% {margin-top: -5.62rem;}
  30% {margin-top: -5.62rem;}
  40% {margin-top: -11.24rem;}
  60% {margin-top: -11.24rem;}
  70% {margin-top: -5.62rem;}
  80% {margin-top: -5.62rem;}
  90% {margin-top: 0;}
  100% {margin-top: 0;}
}



.fl33center{
display:flex; 
flex-direction:column; 
justify-content:center;
height:320px;
margin:0px;
padding:0px;
}

.fl33bottom{
display:box; 
margin:0px;padding:0px;
}


.imgbkcomplr{
padding:0px;
background-image:url("../img/bkmid.jpg") ;
  width:2048px; /* You must set a specified height */
  height:600px;
  background-position: center; /* Center the image */
  max-width:100%;     
width: 100%!important;background-repeat: no-repeat;
}

.fthght{
height: var(--footheight);
}