/* Responsive Classes */

html{
  scroll-behavior: smooth;
}

.DesktopBox{display:block;}
.MobileBox{display:none;}

.RedBox{background-color:#E10D26;}
.OrangeBox{background-color:#E1730D;}
.GreenBox{background-color:#207C09;}
.BlueBox{background-color:#0A6390;}
.GreyBox{background-color:#888888;}
.BlackBox{background-color:#000000;}
.LightGreyBox, .LightGrey{background-color:#EEEEEE;}

.GreyScale{
    -webkit-filter: grayscale(100%); 
    filter: grayscale(100%);
}

.GreyScale50{
    -webkit-filter: grayscale(50%); 
    filter: grayscale(50%);
}

.Transparent25{
   opacity: 0.75;
   filter: alpha(opacity=75);
}

.Transparent50{
   opacity: 0.5;
   filter: alpha(opacity=50);
}

.Transparent75{
   opacity: 0.25;
   filter: alpha(opacity=25);
}

.Clear{
  width:100%;
  clear:both;
  height:0px;
  overflow:hidden;
}

.Circle{border-radius:50%;}

.Divider1, .Divider2, .Divider3{
  position:absolute;
  left: 50%;
  top: -15px;
  width: 30px;
  height: 30px;
  content: '';
  background:#FFFFFF;
  -webkit-transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%) rotate(45deg);
}

.Divider2{
  background:#CCCCCC;
}

.Divider3{
  background:#EEEEEE;
}

.Div900, .Div700, .Div500{
  width:92%;
  max-width:900px;
  margin:0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.Div700{max-width:700px;}
.Div500{max-width:500px;}

.ColonContainer{
  overflow: hidden;
}

.Colon{
  padding-bottom:1000px;
  margin-bottom:-1000px;
}

.Padding0{padding:0;}
.Padding10{padding:10px;}
.Padding20{padding:20px;}
.Padding30{padding:30px;}
.Padding40{padding:40px;}
.Padding50{padding:50px;}

.WideDiv0,.WideDiv1,.WideDiv2,.WideDiv3{
   width:100%;
   height:auto;
   min-height:50px;
   padding:70px 0;
   position:relative;
}

.WideDiv0{
   padding:0;
   background:transparent;
}

.Div75{width:75%; float:left; height:auto; min-height:50px;}
.Div50{width:50%; float:left; height:auto; min-height:50px;}
.Div33{width:33.333%; float:left; height:auto; min-height:50px;}
.Div25{width:25%; float:left; height:auto; min-height:50px;}
.Div20{width:20%; float:left; height:auto; min-height:50px;}
.Div16{width:16.666%; float:left; height:auto; min-height:50px;}

.Div75, .Div50, .Div25, .Div33, .Div20, .Div16{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.Div50L, .Div50R{
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   padding:50px;
   width:100%;
   max-width:600px;
   min-width:300px;
}

.Div50L{
   float:right;
   padding-left:0;
}

.Div50R{
   float:left;
   padding-right:0;
}

.Square25{
  height:25vw;
  width:25vw;
  max-width:299px;
  max-height:300px;
  min-width:250px;
  min-height:250px;
  display:table;
  overflow:hidden;
  background:#777777;
  color:#FFFFFF;
  font-size:18px;
  float:left;
}

.Square25Inner{
  display: table-cell;
  vertical-align: middle;
  text-align:center;
  padding:15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.Square1-4{
  height:25vw;
  width:25vw;
  display:table;
  min-width:250px;
  min-height:250px;
  max-width:300px;
  max-height:300px;
}

.Square1-4Inner{
  display:table-cell;
  vertical-align:middle;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.Div1-2, .Div1-3, .Div2-3, .Div1-4, .Div1-5, .Div1-6{
  float:left;
  text-align:left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding:25px;
}

.Div1-2{
  width:50%;
}

.Div1-3{
  width:33.333%;
}

.Div2-3{
  width:66.666%;
}

.Div1-4{
  width:25%;
}

.Div1-6{
  width:16.666%;
}

.Div1-2L, .Div1-2R{
  width:46%;
  margin:0;
  float:left;
}

.Div1-2R{
  margin-left:8%;
}

.Div1-2L0, .Div1-2R0{
  width:48%;
  margin:0;
  float:left;
}

.Div1-2R0{
  margin-left:4%;
}

.Div1-2L1, .Div1-2R1{
  width:48%;
  margin:0;
  float:left;
}

.Div1-2R1{
  margin-left:4%;
}

.Div1-3L, .Div1-3R{
  width:30.66%;
  float:left;
  margin:0;
}

.Div1-3R{
  margin-left:4%;
}

.Div2-3L, .Div2-3R{
  width:65.34%;
  float:left;
  margin:0;
}

.Div2-3R{
  width:65.34%;
  float:left;
  margin-left:4%;
}

.Div1-4L, .Div1-4R{
  width:22%;
  float:left;
  margin:0;
}

.Div1-4R{
  margin-left:4%;
}

.Row {
  display: flex; /* equal height of the children */
}

.Col, .ColLeftHidden, .ColRightHidden{
  flex: 1; /* additionally, equal width */
  min-width:350px;
  min-height:250px;
}

.VSpace{
  height:60px;
}

.ColLeftHidden{
  display:none;
}

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

  .Div50L, .Div50R{
    margin:0 auto;
    padding-left:40px;
    padding-right:40px;
  }
}

/* Media Screen 750 */
@media screen and (min-width: 481px) and (max-width: 750px){

  .Div1-3L, .Div1-3R, .Div2-3L, .Div2-3R{
    width:100%;
    margin:0;
    margin-bottom:30px;
  }

  .Div1-4L, .Div1-4R{
    width:100%;
    margin:0;
    margin-bottom:30px;
  }

  .Div1-2L0, .Div1-2R0{
    width:100%;
    margin:0;
  }

  .Div1-2L, .Div1-2R{
    width:48.75%;
    margin:0;
    float:left;
  }

  .Div1-2R{
    margin-left:2.5%;
  }

  .Div1-2, .Div1-3, .Div2-3, .Div1-5{
    width:100%;
  }

  .Div1-4{
    width:50%;
  }

 .Square25{
    height:50vw;
    width:50vw;
    max-height:45.5vw;
    max-width:45.5vw;
    min-width:300px;
    min-height:350px;
 }

  .Div25, .Div75{
     width:50%;
  }

  .Div33, .Div50, .Div20{
     width:100%;
  }

  .Div16, .Div1-6{
     width:33.333%;
  }

  .Div50L, .Div50R{
    float:none;
    margin:0 auto;
    padding-left:40px;
    padding-right:40px;
  }

  .Div1-2L0, .Div1-2R0,.Div1-2L1, .Div1-2R1{
    width:100%;
    margin:0;
    margin-bottom:30px;
  }

  .Row{
    display:block;
  }

  .VSpace{
    height:30px;
  }

  .ColLeftHidden{
    display:block;
  }

  .ColRightHidden{
    display:none;
  }
}

/* Media Screen 480 */
@media screen and (max-width: 480px){

  .DesktopBox{display:none;}
  .MobileBox{display:block;}

  .Div1-3L, .Div1-3R, .Div1-4L, .Div1-4R, .Div2-3L, .Div2-3R, .Div1-2L, .Div1-2R{
    width:100%;
    margin:0;
    margin-bottom:30px;
  }

  .Div75, .Div25, .Div33, .Div50, .Div20, .Div16, .Div1-6{
     width:100%;
  }

  .Div1-2L0, .Div1-2R0,.Div1-2L1, .Div1-2R1{
    width:100%;
    margin:0;
    margin-bottom:30px;
  }

  .Div1-2L0{
     margin-bottom:0;
  }

  .Div1-2, .Div1-3, .Div2-3, .Div1-4, .Div1-5{
    width:100%;
  }

  .CircleIcon1{
     width:70px;
     border: 2px solid grey;
  }

  .Header{
    display:none;
  }

 .Square25{
   width:300px;
   height:300px;
   float:none;
   margin:0 auto;
 }

  .Div50L, .Div50R{
    float:none;
    margin:0 auto;
    padding:30px;
  }

  .Row{
    display:block;
  }

  .VSpace{
    height:10px;
  }

  .ColLeftHidden{
    display:block;
  }

  .ColRightHidden{
    display:none;
  }
}

/*.ckeditor .DesktopBox{display:block;}*/
/*.ckeditor .MobileBox{display:block;}*/

.InnerBox{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


/* Youtube Container */
.YoutubeContainer{
  position: relative;
  padding-top: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.YoutubeContainer iframe, .YoutubeContainer object, .YoutubeContainer embed, .YoutubeContainer div, .YoutubeContainer img {
  position: absolute;
  margin: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
}

/* FADE IN ON PAGE LOAD */
@-webkit-keyframes fadeIn{from { opacity:0; opacity: 1\9;} to { opacity:1; }}
@-moz-keyframes fadeIn{from { opacity:0; opacity: 1\9;} to { opacity:1; }}
@keyframes fadeIn{from{ opacity:0; opacity: 1\9;} to { opacity:1; }}

.FadeIn{
    opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;

    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;

    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;
}

.HomeSlider .FadeIn{
  -webkit-animation-delay: 0.9s;
  -moz-animation-delay: 0.9s;
  animation-delay: 0.9s;
}

.HoverGrey{
  background:transparent;
  -moz-transition: all .3s ease-in-out;
  -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
}

.HoverGrey:hover{
  background:rgba(0,0,0,0.1);
}

.HoverTransp{
   opacity: 1.0;
   filter: alpha(opacity=100);
  -moz-transition: all .3s ease-in-out;
  -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  cursor:pointer;
}

.HoverTransp:hover{
   opacity: 0.6;
   filter: alpha(opacity=60);
}

.GreyIcon{
    -webkit-filter: grayscale(100%); 
    filter: grayscale(100%);
}

.GreyIcon:hover{
    -webkit-filter: grayscale(50%); 
    filter: grayscale(50%);
}

.Table{
  display:table;
  width:100%;
}

.TableCell{
  display:table-cell;
}

.TableCell50{
  display:table-cell;
  width:50%;
}

.TableCell33{
  display:table-cell;
  width:33.33%;
}

.TableCell25{
  display:table-cell;
  width:25%;
}

.TableCell20{
  display:table-cell;
  width:20%;
}

.TableCellMidlle{
  display:table-cell;
  vertical-align:middle;
  text-align:center;
}

.BoxHeight30{
  position:relative;
  padding-top:30%;
}

.BoxHeight60{
  position:relative;
  padding-top:60%;
}

.BoxHeight75{
  position:relative;
  padding-top:75%;
}

.BoxHeight85{
  position:relative;
  padding-top:85%;
}

.BoxHeight60Inner{
  position:absolute;
  width:100%;
  left:0;
  top:50%;
  transform:translateY(-50%);
}

.BoxHeight60InnerL, .BoxHeight60InnerR{
  position:absolute;
  width:90%;
  left:0;
  top:50%;
  transform:translateY(-50%);
}

.BoxHeight60InnerR{
  left:10%;
}

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

  .BoxHeight30{
    padding-top:55%;
  }

  .BoxHeight60{
    padding-top:75%;
  }

  .BoxHeight60InnerL, .BoxHeight60InnerR{
    left:5%;
    width:90%;
  }
}

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

  .BoxHeight30, .BoxHeight60, .BoxHeight75, .BoxHeight85{
    position:relative;
    padding-top:0;
  }

  .BoxHeight60Inner, .BoxHeight60InnerL, .BoxHeight60InnerR{
    position:relative;
    top:0;
    width:95%;
    transform:translateY(0);
  }

  .BoxHeight60InnerL{left:0;}
  .BoxHeight60InnerR{left:5%;}

  .BoxHeight60Inner{width:100%;left:0;}

  .PageWidth table tr {
    /*display: block;*/
  }
  .PageWidth table td {
    /*display: block;*/
    /*padding-top:10px;*/
    /*padding-bottom:10px;*/
  }
}

@media screen and (max-width:750px){
  .BoxHeight60Inner, .BoxHeight60InnerL, .BoxHeight60InnerR{
     padding:20px 0;
     width:100%;
     left:0;
  }
  .TableCell, .TableCellMidlle, .TableCell50, .TableCell33, .TableCell25, .TableCell20{
    display:block; width:100%;
  }
}

.CenterBox{
  display: flex;
  align-items: center;
  justify-content: center;
}

.CenterBox100, .CenterBox75, .CenterBox60, .CenterBox50, .CenterBox33, .CenterBox20{
  width:100%;
  overflow:hidden;
  position:relative;
  padding-top:100%;
  height:0;
}
.CenterBox75{padding-top:75%;}
.CenterBox60{padding-top:60%;}
.CenterBox50{padding-top:50%;}
.CenterBox33{padding-top:33%;}
.CenterBox20{padding-top:20%;}

.CenterBoxIn{
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  display:table;
}

.CenterBoxInner{
  position:absolute;
  width:100%;
  top:50%;
  transform:translateY(-50%);
}

.CenterBoxImage{
   width:100%;
   display:block;
   position:absolute;
   top:0;
   left:0;
}

/* Bounce Container */
.BounceContainer{
  width:100%;
  height:auto;
  overflow:hidden;
}

.BounceBox0, .BounceBox1, .BounceBox2, .BounceBox3, .BounceBox4, .BounceBox5{
  width:100%;
  height:auto;
  margin-left:100vw;
  -moz-transition: all 1.2s ease-in-out;
  -webkit-transition: all 1.2s ease-in-out;
  -o-transition: all 1.2s ease-in-out;
}

.BounceBox1, .BounceBox3, .BounceBox3{
  margin-left:-100vw;
}

.ckeditor .BounceBox0, .ckeditor .BounceBox1, .ckeditor .BounceBox2, .ckeditor .BounceBox3, .ckeditor .BounceBox4, .ckeditor .BounceBox5{
  margin-left:0;
}

@media screen and (max-width: 1000px){
  .BounceBox0, .BounceBox1, .BounceBox2, .BounceBox3, .BounceBox4, .BounceBox5{
    margin-left:0;
  }
}

/* Zero Bleak Block */
.ZeroBreak{
  width:100%;
  display:none;
}

.ckeditor .ZeroBreak{
  display:block;
  background:#FFAAAA;
}