﻿body 
{
    font-size:100%;
    margin:0px 0px 0px 0px; font-family:arial;
    background: #d6d8d9; /* Old browsers */

}

#container {
    margin: 0 auto;
    position: absolute;
    width: 100%;
    background: #f2f2f3;
    /*background: -moz-linear-gradient(top, #6097b2 1%, #dbdbdb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#6097b2), color-stop(100%,#dbdbdb));
background: -webkit-linear-gradient(top, #6097b2 1%,#dbdbdb 100%);
background: -o-linear-gradient(top, #6097b2 1%,#dbdbdb 100%);
background: -ms-linear-gradient(top, #6097b2 1%,#dbdbdb 100%);
background: linear-gradient(to bottom, #6097b2 1%,#dbdbdb 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6097b2', endColorstr='#dbdbdb',GradientType=0 );*/
}
#header {
    text-align: left;
    font-family: arial;
    padding: 1%;
    color: #ffffff;
    font-size: 1.2em;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 10%;
    padding-top: 2%;
    background-color: #00afed;
    padding-bottom: 2%;
}
.textberaleoflogo{  padding-left:5px;}
.textteldanoflogo{ letter-spacing:-0.03em;}
.slogen {
    font-size: 1.5em;
    color: #fff;
    text-align: left;
    padding-top: 30px;
    font-family: 'Cabin', sans-serif;

}
.slogencontact{font-size:1em; color:#ffffff; text-align:left; padding-top:30px;
       
        font-family: 'Cabin', sans-serif; font-style:italic; margin-left:10% }
.slogenl2s h1{font-size:0.7em; color:#0ca2c7; padding-left:9%; text-align:left; padding-top:1%;font-family: 'Montserrat Alternates', sans-serif; }
#content{width:89%; margin:0 auto;  display:block;  text-align:center;}
#contactcontent{width:90%; margin:0 auto; margin-left:5%;  display:block;  text-align:center;}
#contentl2s{width:89%; margin:0 auto;  display:block;  text-align:center; min-width:900px;}
#contentclassboost{width:100%; margin:0 auto;  display:block;  text-align:center; }

.products {  list-style-type:none; padding:0; margin:0; font-size:1.1em; color:#2d5383; padding-top:2%; }
 ul{list-style-type:none;  vertical-align:top;  padding:0; margin:0;
             display:inline-block;padding:0.2%; text-align:left;  
              margin:4px; 
            
             border-radius: 20px;
border-top-left-radius: 0;
             }
             
/*box-shadow: 1px 1px 2px #949595;
 -webkit-border-radius: 20px;
-webkit-border-top-left-radius: 60px;
-moz-border-radius: 20px;
-moz-border-radius-topleft: 60px;
border-radius: 20px;
border-top-left-radius:60px;
border:solid 10px #e6e497;
 */
div.simboost {
    background-color: #ffffff;
    WIDTH: 100%;
    border-radius: 0;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    height: 600px;
    padding: 0;
    overflow: hidden;
}
div.classboost {
    border-radius: 20px;
    background-color: #ffffff;
    WIDTH: 100%;
    -moz-border-radius: 15px;
    border-radius: 0;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    height: 360px;
    height: 600px;
    padding: 0;
    overflow: hidden;
}

 ul.about{padding-left:5%;padding-right:5%;}   
  .about .deftext{ padding-right:10px;}   
     .about
   { 
        position:relative;
     overflow:hidden;
WIDTH:48%
  
     } 
div.l2s
 { background-color:#ffffff;
      position:relative;
WIDTH:100%;border-radius: 20px;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;height:360px;
     }
.products li.other {
    width: 90%;
}
div.other {
    background-color: #fff;
    position: relative;
    overflow: hidden;
    WIDTH: 100%;
    border-radius: 0;
    min-height: 360PX;
    margin-top: 40px;
}
.color-classboost {
    background-color: #ffa043;
}
.color-simboost {
    background-color: #378acd;
}
.color-video {
    background-color: #000;
    color:white;
}  

  @keyframes slide 
  {
  0%  { opacity:0;  width:0; }
  50% { opacity:0; width:0;}
  100% { opacity:1; width:43%; }
    }      
 @-webkit-keyframes slide 
{
  0%  { opacity:0;  width:0; }
  50% { opacity:0; width:0;}
  100% { opacity:1; width:43%; }
}
 @-moz-keyframes slide 
 {
  0%  { opacity:0;  width:0; }
  50% { opacity:0; width:0;}
  100% { opacity:1; width:43%; }
    }
    
 @keyframes slidefull 
  {
  0%  { opacity:0;  width:0; }
  50% { opacity:0; width:0;}
  100% { opacity:1; width:90%; }
    }      
 @-webkit-keyframes slidefull 
{
  0%  { opacity:0;  width:0; }
  50% { opacity:0; width:0;}
  100% { opacity:1; width:90%; }
}
 @-moz-keyframes slidefull 
 {
  0%  { opacity:0;  width:0; }
  50% { opacity:0; width:0;}
  100% { opacity:1; width:90%; }
    }   
    
 
a:link{ color:#fff;}
a:hover{color:#fff;}
a:visited{color:#fff;}

.masklink{ position:absolute; bottom:0px; 
           height:35px; z-index:0; opacity:1; 
           background-color:#388fa7;  line-height:1.8em;  width:0%;
             -webkit-transition: all 0.7s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
   -o-transition: all 0.5s ease-in-out;
   -ms-transition: all 0.5s ease-in-out;
   transition: all 0.5s ease-in-out;
   border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;border-bottom-right-radius: 20px;border-top-right-radius: 20px; border-radius:0;
    }

.simboost:hover{ background-color:#b1dafb}
/*.simboost:hover a:link{ color:White;}
.simboost:hover a:visited{ color:White;}
.simboost:hover a:hover{ color:White;}*/
li > .simboost {
    border: solid 2px #fff;
}
    li > .simboost:hover  {
        background-color: #fff;
        border: solid 2px #000;
    }



/*.classboost:hover a:link{ color:White;}
.classboost:hover a:visited{ color:White;}
.classboost:hover a:hover{ color:White;}*/
li > .classboost {
    border: solid 2px #fff;
}
li > .classboost:hover  {
    background-color: #fff;
    border: solid 2px #000;
}
.products ul{list-style-type: none;}
.products li {
    display: inline-block;
    width: 32%;
    height: Auto;
    min-width: 280px;
    position: relative;
    float: left;
    margin-bottom: 10px;
    margin-right: 10px;
    margin: 0 5%;
    width: 40%;
}

#contactonimg{ background-color:#E0EC88; font-family:arial; height:35%; 
               position:absolute; top:0; width:90%; padding:5%; text-align:center; color:#25538e; opacity:0;   -webkit-transition: all 0.7s ease-in-out;
   -moz-transition: all 0.7s ease-in-out;
   -o-transition: all 0.7s ease-in-out;
   -ms-transition: all 0.7s ease-in-out;
   transition: all 0.7s ease-in-out;background-color:#eaeae5;font-size:1.2em;
               }

.l2s:hover{ background-color:#b1dafb}
.l2s:hover a:link{ color:White;}
.l2s:hover a:visited{ color:White;}
.l2s:hover a:hover{ color:White;}
.l2s:hover .linkto{ background-color:#6a9db5;}

.about:hover .masklink{ margin-left:-10%;}
div.cont{ background-color:#ffffff;  margin:0 auto; width:100%;border-radius:0;}
.cont li{ width:100%}
.subcontent{ top:10%;}
.contentforfisical{opacity:0; }
 .maskcolor{ 
   
              
 }
.simboost:hover .maskcolor
{ background-color:#e8e71b;  margin-left:-500%; } 
.simboost:hover{ background-color:#fff; }
.classboost:hover .maskcolor
{background-color:#e8e71b;  margin-left:-500%;} 
.classboost:hover{ background-color:#fff; }

.l2s:hover .maskcolor
{background-color:#e8e71b; margin-left:-500%;}
.l2s:hover{ background-color:#f7fdbc; }
.other:hover .maskcolor
{background-color:#e8e71b;  margin-left:-500%;}  
 
 .about:hover .maskcolor
{background-color:red; opacity:0.1;  margin-left:-200%;} 
 
            
#footer { list-style-type:none; color:#00759f; margin-top:10px; }            
#footer ul{list-style-type:none; width:60px; text-align:center;  display:inline-block;
   -webkit-transition: all 0.5s ease-in;
   -moz-transition: all 0.5s ease-in;
   -o-transition: all 0.5s ease-in;
   -ms-transition: all 0.5s ease-in;
   transition: all 0.5s ease-in; }
#footer ul:hover{  font-weight:bold;width:60px;}
.title {
    font-size: 1.8em;
    color: #000;
    z-index: 1;
    width: 97%;
    text-align: center;
    font-family: 'Cabin', sans-serif;
    letter-spacing: -0.02em;
    line-height: 1.2em; margin-top:20px;
}

.other .title {
    min-height: 10px;
    text-align: left;
 
}

.deftext {
    z-index: 1;
    font-size: 0.8em;
    line-height: 1.1em;
    margin-top: 0px;
    margin-bottom: 5px;
    color: #444447;

    text-align: center;
    max-width: 300px;
    margin: 0 auto;
}
.other .deftext {
    max-width: none;
    text-align: left;
    max-width: 80%;
    margin: 0 auto;
}
.linkto {
    position: absolute;
    bottom: 0px;
    line-height: 2em;
    bottom: 0;
    /*-webkit-box-shadow: 0px -5px 4px 0px rgba(50, 53, 55, 0.71);
-moz-box-shadow:    0px -5px 4px 0px rgba(50, 53, 55, 0.71);
box-shadow:         0px -5px 4px 0px rgba(50, 53, 55, 0.71);*/
    /*border-top-left-radius: 20px;
border-bottom-left-radius: 20px;#container
 margin-left:20px;*/ /*border-top-right-radius: 20px;*/
    padding-right: 20px;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    font-size: 1.2em;
    text-decoration: none;
    background-color: #fff;
}
.linkto a{display:block; text-decoration:none;}
span.textlogo {
    display: inline-block;
 
    padding: 6px 20px;
}
@-webkit-keyframes moveFromLeft {
    from {    
      width:0;
      
    }
    to {    
      width:49%
       
    }
}
 @-moz-keyframes moveFromLeft {
   from {    
      width:0;
      
    }
    to {    
      width:49%
       
    }
}

@keyframes moveFromLeft {
     from {    
      width:0;
      
    }
    to {    
      width:49%
       
    }
}

.about .subcontent{position:relative}

.ill_classboost{  width:100% ; text-align:center; height:180px; float:right; top:0; vertical-align:top;
                
right: 0;
z-index: 0; 
background-repeat: no-repeat;
                  
                 }

.linkbox{ height:30px;}

#l2s_content{ font-size:1em; color:#0e6980; text-align:right; direction:rtl; font-family:Arial, Helvetica, sans-serif; }
#l2s_content{ text-align:center}
#maintitlel2s{ background-color:#0ca2c7; margin:0 auto;  width:89%;
               background-image:url(images/back_ltspage.jpg); background-size: auto 140%; min-width:900px;
               background-position:top left; background-repeat:no-repeat; 
               font-size:3em; height:250px;  text-align:center;  color:#ffffff;font-family: 'Cabin', sans-serif;;}
.vis_l2s_1{ background-size:90%; height:100px; width:100px; background-image:url('images/vis_l2s_1.jpg'); 
             -moz-transition: all 0.3s ease-in; background-position:center;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in;}
   .vis_l2s_2{ background-size:90%; height:100px; width:100px; background-image:url('images/vis_l2s_2.jpg'); 
             -moz-transition: all 0.3s ease-in; background-position:center;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in;}
   .vis_l2s_3{ background-size:90%; height:100px; width:100px; background-image:url('images/vis_l2s_3.jpg'); 
             -moz-transition: all 0.3s ease-in; background-position:center;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in;}
   .vis_l2s_4{ background-size:90%; height:100px; width:100px; background-image:url('images/vis_l2s_4.jpg'); 
             -moz-transition: all 0.3s ease-in; background-position:center;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in;}
   .vis_l2s_5{ background-size:90%; height:100px; width:100px; background-image:url('images/vis_l2s_5.jpg'); 
             -moz-transition: all 0.3s ease-in; background-position:center;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in;}
.imgside{ vertical-align:top; text-align:center;  display:block; background-color:#f6f3ea;}
.textside{vertical-align:top; display:inline-block;   -moz-transition: all 0.5s ease-in;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in; padding:3%;}
.blockst { text-align:right; font-size:0.95em; background-color:#ffffff; display:inline-block; width:33%;   -webkit-transition: all 0.5s ease-in;
   -moz-transition: all 0.3s ease-in;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in; vertical-align:top; min-height:320px; border-bottom:solid 4px #eaeae5;
 }

.firstword{color:#888573; letter-spacing:-0.01cm; font-size:18px;-webkit-transition: all 0.5s ease-in;
   -moz-transition: all 0.3s ease-in;
   -o-transition: all 0.3s ease-in;
   -ms-transition: all 0.3s ease-in;
   transition: all 0.3s ease-in;}
.blockst:hover .firstword{padding-right:20px; background-color:#ebe6d6; color:#0b9fc5;}

.blockst  .boxonetext{font-size:1.2em; text-align:right; float:right;height: 240px;
padding: 5%;}
#imgl2s{ background-repeat:no-repeat;
        }
#imgl2s img{ width:99%;} 
.module{  font-family:arial; text-align:right;  display:inline-block;
 font-size:1em; direction:rtl; color:#0e6980; margin:2.5%;}
 
#bottomcontentl2s{ width:95% ; margin:0 auto; padding-top:5%;  padding-bottom:5%;}

.loginimg:hover #contactonimg{  opacity:0.8; }
.loginimg:hover{ background-color:#0ca2c7;}
.loginimg{ background-color:#0ca2c7;}
#logol2s{ background-image:url(images/l2s_logo.jpg); background-repeat:no-repeat; background-position:left top; width:100%; height:80%; }
#logol2sdiv{  background-position:left; height:100%; margin-left:66.5%; }

.blockst:hover .vis_l2s_1{ background-size:100%;}
.blockst:hover .vis_l2s_2{ background-size:100%;}
.blockst:hover .vis_l2s_3{ background-size:100%;}
.blockst:hover .vis_l2s_4{ background-size:100%;}
.blockst:hover .vis_l2s_5{ background-size:100%;}


.rightbar{ display:inline-block;  vertical-align:top;}
.contact_right{height:440px; width:50%; display:inline-block;  float: LEFT;direction: ltr;}
.contact_left{width:270px;height:440px;display:inline-block; text-align:left; padding-bottom:0px; padding-top:5px; border-bottom-width:1px;border-top-width:1px; border-left-width:1px;border-right-width:1px;padding-left:20px; padding-right:20px;}
.container table{ FONT-SIZE:1.1EM}
.contacttytle{ min-height:50px;}

.projectpic{}
.sentdiv{ background:#f7f6cd; padding:10%;}
.fildesdiv{ position:relative;}
.icon_logo {
    height: 40px;
    background-color :#00afed;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background-image: url(images/berale/icon-logo.png);
    background-position: center;
    background-size: 100%;
}

.mentext{ font-size:0.6em; color:#7b7b6e; font-style:italic}	
.bodyl2s{ background-color:#F1F1F1}



#parallelogram 
{
    position: relative;
width: 150px;
height: 150px;

border-radius: 100px;
-webkit-box-shadow: 0px 5px 4px 0px rgba(50, 53, 55, 0.71);
-moz-box-shadow: 0px 5px 4px 0px rgba(50, 53, 55, 0.71);
box-shadow: 0px 5px 4px 0px rgba(50, 53, 55, 0.71);
transform: rotate(12deg);
-ms-transform: rotate(12deg);
-webkit-transform: rotate(12deg);  zoom:0.5; left:40%
}
#divin{right: 0;
position: absolute;
top: 15%;
width: 80%;
height: 85%;

border-radius: 60%;
-webkit-box-shadow: 0px -5px 4px 0px rgba(50, 53, 55, 0.71);
-moz-box-shadow: 0px -5px 4px 0px rgba(50, 53, 55, 0.71);
box-shadow: 0px -5px 4px 0px rgba(50, 53, 55, 0.71);
z-index: 10;}

#divinin{right: 0;
top: 0;
width: 80%;
height: 80%;

border-radius: 200px;

z-index: 10;
-webkit-box-shadow: 0px 5px 4px 0px rgba(50, 53, 55, 0.71);
-moz-box-shadow: 0px 5px 4px 0px rgba(50, 53, 55, 0.71);
box-shadow: 0px 5px 4px 0px rgba(50, 53, 55, 0.71);
transform: rotate(12deg);
-ms-transform: rotate(12deg);
}

 footer a:link{ color:#237c9c; font-weight:normal;}
 footer a:visited{ color:#237c9c;  font-weight:normal;}
footer a:hover{ color:#237c9c; font-weight:normal;}

.contactdiv{ width:100%; 
             margin:0 auto;
 height:80px;  }
.classboostcontact{ text-align:center;  }
.contactdiv a:link {
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
    transition: all 0.3s;
    margin-left: 10%;
    padding: 10px;
    line-height: 60px;
    text-decoration: none;
    text-align: center;
    background-color: #00afed;
    color: white;
}

.products li.licontactdiv{  height:80px;}


.contactdiv:hover a:hover{  margin-left:11%;color:#ffffff;line-height: 60px;background-color: #6a9db5;}
.classboost_logo{ background-image:url(images/classboost_logover.png); height:240px; background-position:center; width:100%;  background-size:auto 100%; background-repeat:no-repeat;}
.classboost_illpage{ background-image:url(images/ill_classboost_page.jpg); background-repeat:no-repeat; background-position:center;background-size:auto 100%; background-color:#ebebeb;}

.div1{ background-color:#ebebeb}
.classboost_div1_right{background-image:url(images/ill_classboost_d1.jpg); background-repeat:no-repeat;background-size:auto  100%; background-position:center; width:100%;height:450px; display:inline-block;}
.classboost_div1_left{ display:inline-block; width:30%;  vertical-align:top; text-align:left; padding:5%;}


.div2{ background-color:#ffffff}
.classboost_div2_right{background-image:url(images/ill_classboost_d2.jpg); background-repeat:no-repeat;background-size:auto  100%; background-position:center; width:100%;height:450px; display:inline-block;}

.div3{ background-color:#f8f8d2}
.classboost_div3_right{background-image:url(images/ill_classboost_d3.jpg); background-repeat:no-repeat;background-size:auto  100%; background-position:center; width:100%;height:450px; display:inline-block;}


.div4{ background-color:#ffffff}
.classboost_div4_right{background-image:url(images/ill_classboost_d4.jpg); background-repeat:no-repeat;background-size:auto  100%; background-position:center; width:100%;height:450px; display:inline-block;}




.div5{ background-color:#ebebeb}
.classboost_div5_right{background-image:url(images/classboost_device.gif); background-repeat:no-repeat;background-size:auto 80%; background-position:center; width:100%;height:450px; display:inline-block;}
.classboost_div5_left{ display:inline-block; width:30%;  vertical-align:top; text-align:left; padding-top:1%; padding-right:1%; padding-left:1%;}


.div6{ background-color:#ebebeb}
.classboost_div6_right{background-image:url(images/visual_support.gif); background-repeat:no-repeat;background-size:auto 80%; background-position:center; width:100%;height:450px; display:inline-block;}
.classboost_div6_left{ display:inline-block; width:30%;  vertical-align:top; text-align:left; padding-top:1%; padding-right:1%; padding-left:1%;}


.div7{ background-color:#ebebeb}
.classboost_div7_right{background-image:url(images/visual_internet.gif); background-repeat:no-repeat; background-size:auto 80%; background-position:center; width:100%;height:450px; display:inline-block;}
.classboost_div7_left{ display:inline-block; width:30%;  vertical-align:top; text-align:left;padding-top:1%; padding-right:1%; padding-left:1%;}




.divbotdsubtext{ font-size:2em; display:inline-block}
.howtitle{border-bottom: solid 2px #bdc738; background-color:#bdc738; font-size:1.6em; font-weight:normal; color:#ffffff; padding:1%; margin-top:30px;  font-family: Microsoft Sans Serif;}
.classboost_logo h1{ visibility:hidden;}
.demodiv{ position:static; margin:0 auto;vertical-align:top; border:solid; top:0; border:none;  width:50%; padding-left:25%; padding-right:25%;}
@media screen and (max-width: 767px) {

    .products li {
        width: 100%; margin:0; padding:0;
    }
}