span.mes {
    display: inline-block;
    vertical-align: middle;
    margin-top: 36px;
    margin-left: 1px;
    font-size: 17px;
    line-height: 100%;
    text-align: center;
}

.custom-button{
position:fixed!important; bottom:85px; right:10px; z-index:999!important; 
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
    
  
  
}


a.custom-button2{
text-transform:none!important; 
background: #20292e;
color: #00c4ff!important;
font-family: 'CYLICOMB';
border: 2px solid#00c4ff;  
border-radius: 100%;
width: 99px;
height: 99px;
-webkit-transition: all 0.65s ease;
    -moz-transition: all 0.65s ease;
    -o-transition: all 0.65s ease;
    transition: all 0.65s ease;  
  
}

a.custom-button2:hover{
text-transform:none!important; 
background: #00c4ff!important;
color: #222!important;
border: 2px solid#222;   

  
}






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


span.mes {
    display: inline-block;
    vertical-align: middle;
    margin-top: 20px;
    font-size: 13px;
    margin-left: 0px;
    letter-spacing: -1px;
}

.custom-button{
position:fixed!important; bottom:130px; right:6px; z-index:999!important; 
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
    
  
  
}


a.custom-button2{
text-transform:none!important;
background: #20292e;
color: #00c4ff!important;
font-family: 'CYLICOMB';
border: 2px solid#00c4ff;  
border-radius: 100%;
width:60px;
height:60px;
  
}


a.custom-button2:hover{
text-transform:none!important; 
background: #00c4ff!important;
color: #222!important;
border:2px solid#222; 
  
}


}




.scroll-top {
    width: 60px;
    height: 60px;
}









































span.help-you-btn{font-family:cylicomb!important;}

.help-you-btn{position:fixed!important; bottom:90px!important; right:20px!important;}}

.is_bottom_right{position:fixed!important; bottom:50px!important; right:50px!important;}

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

.forma2-title {
    font-size: 40px!important;
    font-family: cylicomb;
    color: #00c4ff;
    margin-top: 50px;
    line-height: 42px;
  
}
  
  
.kiallo-kato{margin-top:50px!important;}  
  
}
.kiallo-kato{margin-top:0px;}  





.explane {
    color: #7e7e7e!important;
    font-family: 'CYLICOML';
    padding-top: 30px;
    border-bottom: 1px solid#00c4ff;
    
    font-size: 22px;
    padding-left: 10px;
}
.forma2-title{font-size:57px; font-family:cylicomb; color:#00c4ff; margin-top:50px;}


.rpx_field_11{padding-top:20px;}

.rpx_field_10{padding-top:20px;}

.rpx_field_input
{
    font-family: 'CYLICOML';
    font-size: 17px;
}




#rpx_2rpx_submit {
    /* border: 1px solid#00c4ff; */
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid#00c4ff;
    border-radius: 0px;
    width: 100px;
}

#rpx_div_rpx_2{padding-bottom:50px;}






.rpx_form_container input, .rpx_form_container input[type="text"], .rpx_form_container input[type="number"], .rpx_form_container input[type="email"], .rpx_form_container input[type="tel"], .rpx_form_container textarea, .rpx_form_container select {
    padding-top: 20px;
    color: #fff;
    font-family: 'CYLICOML';
    font-size: 22px;
    box-sizing: border-box;
    height: auto;
    background: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid#00c4ff;
}


.forma2{width:100%; max-width:1289px; margin:0 auto; padding:15px;}









.contact__text {
   color: #00c4ff!important;
}



.cpnb-outer.cpnb-div-position-top-left, .cpnb-outer.cpnb-div-position-top-right, .cpnb-outer.cpnb-div-position-bottom-left, .cpnb-outer.cpnb-div-position-bottom-right {
  border-width: 1px;
  opacity: 0.8;
}





.cpnb-div-position-top-left .cpnb-inner, .cpnb-div-position-top-right .cpnb-inner, .cpnb-div-position-bottom-left .cpnb-inner, .cpnb-div-position-bottom-right .cpnb-inner {
  padding: 15px 20px 5px 20px;
  border:1px solid #4f4f4f;
}


.rpx_msg_sent{color:#fff!important; font-family: cylicom!important; font-size:22px!important;}


.rpx_form_container .checkbox, .rpx_form_container .radio {
    vertical-align: bottom;
    margin-right: 5px;
    width: 15px;
    margin-top: 5px;
    float: left;
    margin-left: 12px;
}


.switcher__area {display: none;!important;}



.coo{font-size:12px; font-family:cylicom; color:#fff;}

.cpnb-div-position-top-left .cpnb-button, .cpnb-div-position-top-right .cpnb-button, .cpnb-div-position-bottom-left .cpnb-button, .cpnb-div-position-bottom-right .cpnb-button {
  margin-bottom: 15px;
  border: 1px solid #b7b7b7!important;
}






.cpnb-div-position-top-left .cpnb-message, .cpnb-div-position-top-right .cpnb-message, .cpnb-div-position-bottom-left .cpnb-message, .cpnb-div-position-bottom-right .cpnb-message, .cpnb-div-position-center .cpnb-message {
  text-align: center;
  display: block;
  padding: 0 8px;
  margin-bottom: 15px;
  font-family: cylicom!important;
}



/*--------------MODULE FULL SCREEN---------------------------------------------------- */
/*--------------MODULE FULL SCREEN---------------------------------------------------- */
/*--------------MODULE FULL SCREEN---------------------------------------------------- */
/*--------------MODULE FULL SCREEN---------------------------------------------------- */
/*--------------MODULE FULL SCREEN---------------------------------------------------- */

.full-screen{width:100%; min-height:100vh; background-color:#f3f3f3; display:table;}


.container-vertical-middle {
    display: table-cell;
    vertical-align: middle;
    max-width: 1200px;
    margin: auto;
}


h4.full-screen-text {
    font-family: cylicoml!important;
    font-size: 37px;
    max-width: 1200px;
    margin: 0 auto;
}

.plaisio2 {
    margin-left: 63px;
    border: 39px solid#ededed;
    width: 678px;
    height: 389px;
    position: absolute;
}




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

.plaisio2 {display:none!important;}
}







/*--------------TELOS MODULE FULL SCREEN---------------------------------------------------- */
/*--------------TELOS MODULE FULL SCREEN---------------------------------------------------- */
/*--------------TELOS MODULE FULL SCREEN---------------------------------------------------- */
/*--------------TELOS MODULE FULL SCREEN---------------------------------------------------- */
/*--------------TELOS MODULE FULL SCREEN---------------------------------------------------- */

.rpx_field_input label {
    display: block;
    /* width: 15px; */
    float: left;
    color: #fff;
}




.rpx_field_input label {
    display: block;
    
    float: left;
}

.dark .contact__form textarea, .dark .contact__form input, .dark .contact__form input::placeholder, .dark .contact__form textarea::placeholder {
    font-size: 22px;
    color: var(--white);
    border-color: #00c4ff!important;
    font-family: 'CYLICOML';
    background: transparent!important;
}






@media only screen and (max-width: 1024px)
{
.forma {font-size:29px!important;}  
  
}  




.contact__info {padding-top: 0px!important;}





.forma {
    color: #00c4ff;
    font-family: 'CYLICOM';
    font-size: 34px;
    padding-bottom: 20px;
    text-decoration: underline;
}



.icons2{  max-width: 50px;  margin-right: 10px;}



.contact__area-6 { background-color: #192126!important;}

.uses-preset .rpx_field input:focus, .uses-preset .rpx_field textarea:focus {
    outline: none;
    background: transparent!important;
}

.contact__form input:focus, .contact__form textarea:focus {
    border-bottom: 1px solid#00c4ff!important;
}


.dark .contact__form textarea, .dark .contact__form input, .dark .contact__form input::placeholder, .dark .contact__form textarea::placeholder {
    font-size: 22px;
    border-radius: 0px!important;
    color: var(--white);
    border-color: #00c4ff!important;
    font-family: 'CYLICOML';
}

.form-control{border-radius:0px!important;}

.uses-preset .rpx_field input.checkbox {
    vertical-align: baseline;
    width: 14px;
    background: transparent;
  float:left;
}

.rpx-compact .rpx_field .rpx_field_input label:first-child {
    font-size: 14px;
    margin-top: 25px;
    color: #fff;
    font-family: 'CYLICOMB';
}


.contact__form textarea{height:170px; margin-bottom:20px;}

div.rapid_contact_ex.rpx-orange .button {
    background:#00c4ff;
    color:#20292e;
    margin-top: 20px;
   font-family:cylicomb!important;
  font-size:22px;
  border:1px solid#00c4ff;
}





div.rapid_contact_ex.rpx-orange .button:hover {
    background:#20292e;
    color:#00c4ff;
   border:1px solid#00c4ff;
}



.form-control:focus {box-shadow:none!important;}




a.terms:link {color:#00c4ff; }
a.terms:visited{color:#00c4ff; } 
a.terms:hover {color:#fff; }   
a.terms.active {color:#00c4ff; }




@media only screen and (max-width: 1024px)
{
 .sec-title, .dark .sec-title-2, .dark .sec-title-3, .dark .sec-sub-title { margin-top:0px;}
}


.sec-title, .dark .sec-title-2, .dark .sec-title-3, .dark .sec-sub-title {
    color: #00c4ff!important;
}

.contact__info h3, .dark .contact__info ul li span, .dark .contact__info ul li a {
    color: var(--white);
    font-size: 22px;
    font-family: 'CYLICOML';
}




@media only screen and (max-width: 767px){
.contact__btm {
    padding-top: 0px!important;
}
}  









.col-md-4{float:left;}
.col-md-8{float:left;}


p.keno-pano{padding-top:0px!important;}



.dark { background-color:#192126!important;}


.prosperasi{width:auto!important; height:auto!important;}

.dark .solution__area {background-color: #ffffff!important;}



.hero__area .hero1_bg {
    position: absolute;
    bottom: 0;
    z-index: 0;
    left: 0;
    width: 100%;
    height: auto;
    -webkit-animation: none!important;
    animation:none!important;
}






@font-face
{
font-family:CYLICOMEB;
src: url('../fonts/OpenSans-ExtraBold.ttf');
}


@font-face
{
font-family:CYLICOMB;
src: url('../fonts/OpenSans-Bold.ttf');
}

@font-face
{
font-family:CYLICOM;
src: url('../fonts/OpenSans-Regular.ttf');
}
@font-face
{
font-family:CYLICOML;
src: url('../fonts/OpenSans-Light.ttf');
}

@font-face
{
font-family:CYLICOMEL;
src: url('../fonts/OpenSans-Light.ttf');
}

@font-face
{
font-family:CYLICOMI;
src: url('../fonts/OpenSans-Italic.ttf');
}


@font-face
{
font-family:CYLICOMBI;
src: url('../fonts/OpenSans-BoldItalic.ttf');
}


@font-face
{
font-family:pl;
src: url('../fonts/OpenSans-Regular.ttf');
}



/* TEMPLATE ---------------------------------------------------------- */




@media only screen and (max-width: 767px)
{
br {display: block!important;}
}





.stroggylo-kedro {  margin: 0 auto;}

.space50{width:100%; height:50px;}



a.mylink{color:#fff!important;}



.offcanvas__menu-wrapper.mean-container .mean-nav ul li a {border-top: 1px solid#536066!important;}

.offcanvas__logo {border-bottom: 1px solid#536066!important;}

.offcanvas__social {border-bottom: 1px solid#536066!important;}

.offcanvas__left {border-bottom: 1px solid#536066!important;}

.offcanvas__left {border-right: 1px solid#536066!important;}

.offcanvas__right {background-color: #20292e!important;}

.offcanvas__menu-wrapper.mean-container .mean-nav > ul > li:last-child > a {
    border-bottom: 1px solid#536066!important;}





.preloader { background-color:#20292e!important;}

.offcanvas__area {background-color:#192126!important;}

.offcanvas__menu-wrapper.mean-container .mean-nav ul li a {color:#00c4ff!IMPORTANT;}

.offcanvas__social ul li a:hover {color:#00c4ff!IMPORTANT;}



@media only screen and (max-width: 767px)
{
  .header__area {color:#20292e!important;}
}


.keno-d{padding-right:50px;}
.keno-a{padding-left:50px;} 



.line::before, .dark .line::after, .dark .line-3 {background-color: #e3e3e3!important;}


@media screen and (min-width:0px) and (max-width:1024px) 
{
.exida-exi{width:100%!important; float:left; }
  
.triada-tria{width:100%!important; float:left; }    
}





@media screen and (min-width:0px) and (max-width:767px) 
{
  
.keno-d{padding-right:0px!important;}
  
.keno-a{padding-left:0px!important;}   
  
.penida{width:100%!important; float:left; }
  
.article-home-d2 { padding-left:8px!important;  padding-right:8px!important;}  
  

  
  
}  

.exida-exi{width:66%; float:left;   }

.triada-tria{width:33%; float:left;  }

.penida {
    width: 50%;
    float: left;
    
}



:root { --primary: #00c4ff!important;}

.switcher__icon { background: #00c4ff!important;}

.cursor1 {position:fixed; width:40px; height:40px; border: 1px solid #00c4ff!important; border-radius: 50%;}

.cursor2 {position:fixed; width:8px; height:8px; background-color:#00c4ff!important; border-radius: 50%;}

.dark .wc-btn-primary, .dark .wc-btn-black, .dark .wc-btn-light, .dark .wc-btn-pink, .dark .wc-btn-secondary 
{
background: #20292e;  color:#00c4ff!important; font-family: 'CYLICOMB'; border: 1px solid#fff;
}

.wc-btn-primary span, .wc-btn-black span, .wc-btn-light span, .wc-btn-pink span, .wc-btn-secondary span
{background: #00c4ff!important; font-family: 'CYLICOMB';}


.wc-btn-primary:hover, .wc-btn-black:hover, .wc-btn-light:hover, .wc-btn-pink:hover, .wc-btn-secondary:hover {
border: 1px solid#00c4ff!important;
}


.wc-btn-primary:hover, .wc-btn-black:hover, .wc-btn-light:hover, .wc-btn-pink:hover, .wc-btn-secondary:hover
{ 
background: #00c4ff!important; color:#20292e!important; font-family: 'CYLICOMB';
}

.header__support p a {
    font-family: 'CYLICOMB';
    display: inline-block;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.3;
    color: var(--white);
}

.offcanvas__menu-wrapper.mean-container .mean-nav ul li a{font-family:cylicoml!important;}


.canvas-contact{font-family:cylicomb; font-size:25px; color:#fff;}

.canvas-contact-details{margin-top:20px;}

.offcanvas__contact li{font-family:cylicoml; font-size:15px!important; color:#fff;}





@media screen and (min-width:0px) and (max-width:767px) 
{

.acym_module_form input {
    cursor: pointer;
    max-width: 100%;
}

}


/* TELOS  TEMPLATE ---------------------------------------------------------- */

















/* SLIDER ---------------------------------------------------------- */
/* SLIDER ---------------------------------------------------------- */
/* SLIDER ---------------------------------------------------------- */
/* SLIDER ---------------------------------------------------------- */
/* SLIDER ---------------------------------------------------------- */
/* SLIDER ---------------------------------------------------------- */
/* SLIDER ---------------------------------------------------------- */

.hero__title {font-size:118px; line-height:120%; font-family: 'CYLICOMB';}


@media screen and (min-width:0px) and (max-width:767px) 
{
.hero__title {font-size:48px!important; line-height: 120%;}
}


.hero__title::after{display:none!important;}

.hero__content a {font-family: 'CYLICOMel'!important;}

p.hero__sub-title{font-family:cylicom!important;}



/* TELOS SLIDER ---------------------------------------------------------- */
/* TELOS SLIDER ---------------------------------------------------------- */
/* TELOS SLIDER ---------------------------------------------------------- */
/* TELOS SLIDER ---------------------------------------------------------- */
/* TELOS SLIDER ---------------------------------------------------------- */
/* TELOS SLIDER ---------------------------------------------------------- */
/* TELOS SLIDER ---------------------------------------------------------- */
/* TELOS SLIDER ---------------------------------------------------------- */










/* ROLLING ---------------------------------------------------------- */
/* ROLLING ---------------------------------------------------------- */
/* ROLLING ---------------------------------------------------------- */
/* ROLLING ---------------------------------------------------------- */
/* ROLLING ---------------------------------------------------------- */
/* ROLLING ---------------------------------------------------------- */
/* ROLLING ---------------------------------------------------------- */
/* ROLLING ---------------------------------------------------------- */





.roll__area {background-color: #20292e!important; margin-top: -5px; z-index:999; position:relative;
border-top:1px solid#484848; border-bottom:1px solid#484848;

}

.message-roll{color:#00c4ff!important; font-size:17px;  font-family:cylicomb;   z-index:99;  }


@media screen and (min-width:0px) and (max-width:767px) 
{
.message-roll{font-size:17px;}
}


/* TELOS ROLLING ---------------------------------------------------------- */
/* TELOS ROLLING ---------------------------------------------------------- */
/* TELOS ROLLING ---------------------------------------------------------- */
/* TELOS ROLLING ---------------------------------------------------------- */
/* TELOS ROLLING ---------------------------------------------------------- */
/* TELOS ROLLING ---------------------------------------------------------- */
/* TELOS ROLLING ---------------------------------------------------------- */
/* TELOS ROLLING ---------------------------------------------------------- */















/* ARTICLE ---------------------------------------------------------- */
/* ARTICLE ---------------------------------------------------------- */
/* ARTICLE ---------------------------------------------------------- */
/* ARTICLE ---------------------------------------------------------- */
/* ARTICLE ---------------------------------------------------------- */
/* ARTICLE ---------------------------------------------------------- */
/* ARTICLE ---------------------------------------------------------- */
/* ARTICLE ---------------------------------------------------------- */



.container-article-dark{width:100%; display:flex; background:#192126;}

.container-article-light{width:100%; display:flex; background:#f3f3f3;}

.container-article-eso { padding-top:100px; width:100%; max-width:1400px; margin: 0 auto; padding-bottom:100px; padding-left:100px; padding-right:100px;}


span.telia {
   
    color:#00c4ff!important;
  font-family:cylicomeb!important;
  font-size:90px;
   
}


span.adistrofi {
    /* background-color: #383838!important; */
    color: #20292e!important;
    padding: 3px 3px;
    border-bottom: 2px solid#222;
}



span.adistrofi2 {
    background-color:#00c4ff;
    color: #192126;
    padding: 8px 3px;
}









/*** titles------------------------------------------------------------------------------------------------------------------------ */


.art-home-title {font-family:cylicoml!important; font-size:40px; color:#fff; LINE-HEIGHT:108%; padding-top:0px; padding-bottom:30px;}

h1.article1 {font-family:cylicomb!important; color:#fff; font-size:22px; padding-bottom: 20px;}

h2.article2 {font-family:cylicomb!important; color: #fff; font-size:22px; padding-bottom:20px;}

h2.article3 {font-family:cylicomb!important; color:#fff; font-size:22px; padding-bottom: 20px;}

h3.article1 {font-family:cylicomi!important; color:#fff; font-size:18px!important; padding-bottom: 20px; text-align:right;}







.title-dark-ebold-padding-top{font-size:36px; line-height:100%; color:#000; padding-top:100px; padding-bottom:20px; font-family:cylicomeb!important;}

.title-white-ebold-padding-top{font-size:36px; line-height:100%; color:#fff; padding-top:100px; padding-bottom:20px; font-family:cylicomeb!important;}

.title-green-ebold-padding-top{font-size:36px; line-height:100%; color:#00c4ff; padding-top:100px; padding-bottom:20px; font-family:cylicomeb!important;}



.title-dark-bold-padding-top{font-size:36px; line-height:100%; color:#000; padding-top:100px; padding-bottom:20px; font-family:cylicomb!important;}

.title-white-bold-padding-top{font-size:36px; line-height:100%; color:#fff; padding-top:100px; padding-bottom:20px; font-family:cylicomb!important;}

.title-green-bold-padding-top{font-size:36px; line-height:100%; color:#00c4ff; padding-top:100px; padding-bottom:20px; font-family:cylicomb!important;}



.title-dark-normal-padding-top{font-size:36px; line-height:100%; color:#000; padding-top:100px; padding-bottom:20px; font-family:cylicom!important;}

.title-white-normal-padding-top{font-size:36px; line-height:100%; color:#fff; padding-top:100px; padding-bottom:20px; font-family:cylicom!important;}

.title-green-normal-padding-top{font-size:36px; line-height:100%; color:#00c4ff; padding-top:100px; padding-bottom:20px; font-family:cylicom!important;}



.title-dark-light-padding-top{font-size:36px; line-height:100%; color:#000; padding-top:100px; padding-bottom:20px; font-family:cylicoml!important;}

.title-white-light-padding-top{font-size:36px; line-height:100%; color:#fff; padding-top:100px; padding-bottom:20px; font-family:cylicoml!important;}

.title-green-light-padding-top{font-size:36px; line-height:100%; color:#00c4ff; padding-top:100px; padding-bottom:20px; font-family:cylicoml!important;}




@media screen and (min-width:0px) and (max-width:767px) 
{
.container-article-eso { padding-left:8px!important;  padding-right:8px!important;}   
  
.art-home-title{padding-top:30px!important;}  
  
   

.title-dark-ebold-padding-top{font-size:36px; line-height:100%;  padding-top:0px; padding-bottom:20px;}

.title-white-ebold-padding-top{font-size:36px; line-height:100%; padding-top:20px; padding-bottom:20px; }

.title-green-ebold-padding-top{font-size:36px; line-height:100%;  padding-top:20px; padding-bottom:20px; }



.title-dark-bold-padding-top{font-size:36px; line-height:100%; padding-top:20px; padding-bottom:20px; }

.title-white-bold-padding-top{font-size:36px; line-height:100%;  padding-top:20px; padding-bottom:20px; }

.title-green-bold-padding-top{font-size:36px; line-height:100%; padding-top:20px; padding-bottom:20px; }



.title-dark-normal-padding-top{font-size:36px; line-height:100%; padding-top:20px; padding-bottom:20px; }

.title-white-normal-padding-top{font-size:36px; line-height:100%; padding-top:20px; padding-bottom:20px; }

.title-green-normal-padding-top{font-size:36px; line-height:100%;  padding-top:20px; padding-bottom:20px;}



.title-dark-light-padding-top{font-size:36px; line-height:100%; padding-top:20px; padding-bottom:20px; }

.title-white-light-padding-top{font-size:36px; line-height:100%;  padding-top:20px; padding-bottom:20px; }

.title-green-light-padding-top{font-size:36px; line-height:100%;  padding-top:20px; padding-bottom:20px; }


  
}  


/*** telos titles------------------------------------------------------------------------------------------------------------------------ */




/*** pppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppppp */



p.excerpt1 {font-family:cylicomb!important; color:#00c4ff!important; text-align:left!important; font-size:19px; padding-bottom:0px; letter-spacing:0px!important; line-height:143%;}




/*** dark */
p.dark-bold-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#20292e; font-family: cylicomb!important; padding-top:0px; 
padding-bottom:0px;}

p.dark-bold-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#20292e; font-family: cylicomb!important; padding-top:100px; 
padding-bottom:0px;}



p.dark-normal-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#20292e; font-family: cylicom!important; padding-top:0px; 
padding-bottom:0px;}

p.dark-normal-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#20292e; font-family: cylicom!important; padding-top:0px; 
padding-bottom:0px;}



p.dark-light-with-title {font-size: 19px; line-height: 113%; letter-spacing: 0px; color:#20292e; font-family: cylicoml!important; padding-top:0px; 
padding-bottom:0px;}

p.dark-light-no-title {font-size: 19px; line-height: 113%; letter-spacing: 0px; color:#20292e; font-family: cylicoml!important; padding-top:0px; 
padding-bottom:0px;}

p.dark-light-no-title-big {font-size: 23px; line-height: 130%; letter-spacing: 0px; color:#20292e; font-family: cylicoml!important; padding-top:100px; 
padding-bottom:0px;}


/*** telos dark */



/*** white */

p.white-bold-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#fff; font-family: cylicomb!important; padding-top:0px; 
padding-bottom:0px;}

p.white-bold-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#fff; font-family: cylicomb!important; padding-top:0px; 
padding-bottom:0px;}


p.white-normal-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#fff; font-family: cylicom!important; padding-top:0px; 
padding-bottom:0px;}

p.white-normal-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#fff; font-family: cylicom!important; padding-top:0px; 
padding-bottom:0px;}



p.white-light-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#fff; font-family: cylicoml!important; padding-top:0px; 
padding-bottom:0px;}

p.white-light-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#fff; font-family: cylicoml!important; padding-top:0px; 
padding-bottom:0px;}

/*** telos white */



/*** green */

p.green-bold-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#00c4ff; font-family: cylicomb!important; padding-top:0px; 
padding-bottom:0px;}

p.green-bold-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#00c4ff; font-family: cylicomb!important; padding-top:100px; 
padding-bottom:0px;}


p.green-normal-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#00c4ff; font-family: cylicom!important; padding-top:0px; 
padding-bottom:0px;}

p.green-normal-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#00c4ff; font-family: cylicom!important; padding-top:0px; 
padding-bottom:0px;}



p.green-light-with-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#00c4ff; font-family: cylicoml!important; padding-top:0px; 
padding-bottom:0px;}

p.green-light-no-title {font-size: 19px; line-height: 143%; letter-spacing: 0px; color:#00c4ff; font-family: cylicoml!important; padding-top:0px; 
padding-bottom:0px;}

/*** telos green */




@media screen and (min-width:0px) and (max-width:767px) 
{


p.excerpt1 {font-size:19px; padding-bottom:40px; letter-spacing:0px!important; line-height:143%;}




/*** dark */
p.dark-bold-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:30px;}

p.dark-bold-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px; padding-top:0px; padding-bottom:10px;}



p.dark-normal-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px; padding-top:0px; padding-bottom:0px;}

p.dark-normal-no-title {font-size: 19px; line-height: 113%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}



p.dark-light-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px; padding-top:0px; padding-bottom:0px;}

p.dark-light-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

p.dark-light-no-title-big {font-size: 19px;
    line-height: 139%; letter-spacing: 0px; color:#20292e; font-family: cylicoml!important; padding-top:0px; 
padding-bottom:25px;}  
  
/*** telos dark */



/*** white */

p.white-bold-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

p.white-bold-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}


p.white-normal-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

p.white-normal-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}



p.white-light-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

p.white-light-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px; padding-top:0px; padding-bottom:0px;}

/*** telos white */



/*** green */

p.green-bold-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

p.green-bold-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}


p.green-normal-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

p.green-normal-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}



p.green-light-with-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

p.green-light-no-title {font-size: 19px; line-height: 133%; letter-spacing: 0px;  padding-top:0px; padding-bottom:0px;}

/*** telos green */

  
  
}  
















/*** telos pppppppppppppppp00000000000000000000000000000000000000000000000000000000000000000000000000000000ppppppppppppppppppppppppppppp */










.about__content-wrapper { grid-gap: 15px;}




.about__content { padding-top: 20px;}


#toggle-view {
list-style:none;	
margin:0;
padding:0;
width:100%;
}

#toggle-view li {
position:relative;
cursor:pointer;
color:#000;
}

#toggle-view h3 {
margin:0;
font-size:14px;
}

#toggle-view span {
position:absolute;
right:5px; top:0;
color:#ccc;
font-size:13px;
}

#toggle-view .panel {
margin:5px 0;
display:none;
}	

.panel {
margin-bottom: 20px;
background-color: transparent!important;
border: 0px solid transparent!important;
border-radius: 0px; !important;
-webkit-box-shadow: none!important;
box-shadow: 0 0px 0px rgba(0, 0, 0, .05)!important; 
}

#topcontrol{Z-INDEX:9999999!IMPORTANT;}


p.excerpt {
width: 150px;  
font-size: 16px;
font-family: 'CYLICOMB'!important;
background: #20292e!important;
color:#00c4ff!important;
padding: 11px 15px 11px 15px;
-webkit-transition: all 0.65s ease;
-moz-transition: all 0.65s ease;
-o-transition: all 0.65s ease;
transition: all 0.65s ease;

}

p.excerpt:hover { 
width: 150px;  
font-size: 16px;
font-family: 'CYLICOMB'!important;
background: #00c4ff!important;
color:#20292e!important;
padding: 11px 15px 11px 15px;

}




p.excerpt2 {
    font-family: cylicoml!important;
    color: #fff!important;
    text-align: left!important;
    font-size: 16px;
    padding-bottom: 0px!important;
    letter-spacing: 0px!important;
    line-height: 214%;
}



p.excerpt3 {
    font-family: cylicomb!important;
    color: #fff!important;
    text-align: left!important;
    font-size: 18px;
    padding-bottom: 0px!important;
    letter-spacing: 0px!important;
    line-height: 140%;
}




















/* TELOS ARTICLE ---------------------------------------------------------- */
/* TELOS ARTICLE ---------------------------------------------------------- */
/* TELOS ARTICLE ---------------------------------------------------------- */
/* TELOS ARTICLE ---------------------------------------------------------- */
/* TELOS ARTICLE ---------------------------------------------------------- */
/* TELOS ARTICLE ---------------------------------------------------------- */
/* TELOS ARTICLE ---------------------------------------------------------- */















/* VIDEO SECTION ---------------------------------------------------------- */

#myVideo-top-demo {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    top: 0;
    left: 0;
    z-index: 9;
    position: absolute;
}

#myVideo-top {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    top: 0;
 
  z-index:10;
  
}






.titlos-video{font-family:cylicoml!important; color:#00c4ff!important;}

audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline;
}








.arist{float:left;}

.arist2{float:left; padding-left:50px;}


@media screen and (min-width:0px) and (max-width:767px) 
{
.arist2{float:left; padding-left:0px;}  
}  

p.agency-white {
    font-family: cylicom!important;
    color: #fff;
    line-height: 180%;
}




hr.right {
    background: #fff!important;
    clear: both;
    float: right;
    width: 101px;
    height: 1px;
    /* margin-right: 54px; */
    border: none;
    margin-top: 0px;
    margin-bottom: 0px;
}


p.right {
    clear: both;
    color: #fff;
    font-family: cylicomi;
    text-align: right;
    font-size: 13px;
    margin-bottom: 40px;
}




/* TELOS VIDEO SECTION ---------------------------------------------------------- */













/* SECTION SERVICES ---------------------------------------------------------- */


.service-title-manos{font-family:cylicomb!important; color:#00c4ff!important;}


.service__title-3 {text-transform: none!important;}


.service__area-3 .sec-title { text-transform: none!important;}




@media screen and (min-width:0px) and (max-width:767px) 
{
  
.service__area {background-color: var(--black-2); overflow: visible; margin-top:30px;}

p.excerpt4 {font-size: 19px!important;}

.service__title-3 {padding-bottom: 0px!important;}  

.title-services {font-size: 40px!important;}  
  
  
}
  
  
  
  
h4.service__title {
    display: block;
    font-weight: 400;
    font-size: 21px;
    line-height: 1.3;
    color: var(--gray-2);
    font-family: 'CYLICOMB'!IMPORTANT;
}


p.excerpt4 {
    font-family: cylicoml!important;
    color: #fff!important;
    text-align: left!important;
    font-size: 14px;
    padding-bottom: 0px!important;
    letter-spacing: 0px!important;
    line-height: 144%;
}


.service__list .active .service__number span, .service__list .active .service__title, .service__list .active .service__link p {
  color: #00c4ff!important;}





.service__top-text p {
    max-width: 505px;
    color: var(--gray-2);
    font-weight: 300;
    font-size: 18px;
    line-height: 1.4;
    font-family: 'CYLICOMB'!important;
}




.dark .service__area {
    background-color:#20292e;
}




.dark .service__area-3 {
    background-color:#192126!important
}

.title-service-d {
    color: #00c4ff!important;
    font-family: cylicoml!important;
    line-height: 100%;
    font-size: 33px;
}

.text-service-d{color:#000!important; font-family:cylicomb!important;}


.title-services {
    color: #f3f3f3!important;
    font-family: cylicomb!important;
    font-size: 60px;
}

p.excerpt4 {
    font-family: cylicomb!important;
    color: #f3f3f3!important;
    text-align: left!important;
    font-size: 19px;
    padding-bottom: 0px!important;
    letter-spacing: 0px!important;
    line-height: 144%;
}

.service__content-3 {
    max-width: 100%!important;
    position: relative;
    z-index: 1;
}


.service__area-3 .sec-title {
    background-color: transparent!important;
}

.service__area-3 .sec-sub-title {
    background-color: transparent!important;
    color: #00c4ff!important;
}


.m-t-s{font-family:cylicomb!important; color:#222!important;}

.service__area-3 .sec-title-wrapper::after {
    background-color:transparent!important;
}


h6.moto{font-family:pl!important; padding-right: 25px; padding-bottom:13px;  color:#75918d!important;}

.service__item-3, .dark .service__item-3:first-child {
    border-color: #a1a1a1!important;
}





/* TELOS SECTION SERVICES ---------------------------------------------------------- */









/* COUNTER SECTION  ---------------------------------------------------------- */
.counter__item {
    border-color: #747474!important;
}


.counter__area {
    background-color: #f3f3f3!important;
}



.counter__item p {
    font-size: 20px;
    text-align: center;
  font-family:cylicomb!important;
   color:#20292e!important;
}

.counter__number {
    color: #20292e!important;
    font-family: 'CYLICOM';
}

/* TELOS COUNTER SECTION  ---------------------------------------------------------- */











/* WORKFLOW SECTION  ---------------------------------------------------------- */



@media only screen and (max-width: 767px)
{
.sec-title {font-size: 40px!important;}
}

.workflow__step {color: #20292e!important;}


.workflow__number {color:#e7e7e7!important;}


.workflow__slide::before { background-color:#3e3e3e!important;}


.workflow__area {background-color:#f3f3f3!important;}








.dark .workflow__area .sec-title {
    color:#20292e!important;
    FONT-FAMILY: 'CYLICOMB';
}



.sec-sub-title {font-family: 'CYLICOMB'!IMPORTANT;  color:#00c4ff!IMPORTANT;}





.workflow__step {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.3;
    color: var(--black-2);
    text-transform: NONE;
    padding-bottom: 50px;
    FONT-FAMILY: 'CYLICOM';
}




.dark .workflow__title {
    color:#20292e!important;
    FONT-SIZE: 20PX;
    FONT-FAMILY: 'CYLICOMB'!IMPORTANT;
}


.workflow__slide p {
    max-width: 230px;
    margin: 0 auto;
    color:#20292e!important;
    font-family: 'CYLICOMB'!important;
}





/* TELOS WORKFLOW  SECTION  ---------------------------------------------------------- */








/* PORTFOLIO  SECTION  ---------------------------------------------------------- */


.portfolio__area {background-color: #20292e!important;}



/*telos PORTFOLIO  SECTION  ---------------------------------------------------------- */

















/* CLIENTS  SECTION  ---------------------------------------------------------- */


.dark .brand__area {
    background-color: #192126!important;
}


.cl {
    float: left;
    width: 15%;
    /* margin-left: 50px; */
    border: 1px solid#040404;
    padding: 20px;
}

.cleso {
    float: left;
    width: 23%;
    /* margin-left: 50px; */
    border: 1px solid#040404;
    padding: 20px;
}


.cl2{width:100%;}

@media screen and (min-width: 0px) and (max-width: 599px)
{
.cl {
    width: 50%!important;
    max-width: 300px;
    margin-left: 0px!important;
}
.cleso {
    width: 50%!important;
    max-width: 300px;
    margin-left: 0px!important;
}  
}  



/* TELOS CLIENTS  SECTION  ---------------------------------------------------------- */















/* LETS TALK  SECTION  ---------------------------------------------------------- */



.cta__area {background-color: #f3f3f3!IMPORTANT;}

.cta__title {color: #060606!IMPORTANT;}

.cta__sub-title {color: #000!IMPORTANT;}


.cta__sub-title {
    font-weight: 400;
    font-size: 19px;
    line-height: 1.3;
    text-transform: none;
    color: var(--black-3);
    border: 1px solid var(--gray);
    display: inline-block;
    padding: 9px 43px 9px 43px;
    border-radius: 30px;
    margin-bottom: 10px;
    font-family: 'CYLICOML';
}

.cta__title {
    padding-top: 24px;
    font-weight: 400;
    font-size: 46px;
    line-height: 1;
    font-family: 'CYLICOM';
}

@media screen and (min-width: 0px) and (max-width:768px)
{

.cta__title {font-size: 35px!important;}

}

/* TELOS LETS TALK  SECTION  ---------------------------------------------------------- */
























/* FOOTER  SECTION  ---------------------------------------------------------- */


.footer__widget p {FONT-FAMILY: 'CYLICOMB'!IMPORTANT;}

.footer__widget-title {FONT-FAMILY: 'CYLICOMB'!IMPORTANT;}

.footer__link li a {font-family: 'CYLICOML'; color:#00c4ff!important;}

.dark .footer__inner {background-color: #192126!important;}

.footer__contact li a {font-family:'CYLICOM'!important;}

.footer__contact li { padding-bottom: 15px; font-family: cylicom!important;}

.footer__widget-4 .project-title {font-size: 34px; font-family: 'CYLICOMB'!important;}

.footer__widget-4 .contact-time {font-family:'CYLICOMB'!important;}

.footer__widget-4 .contact-day { font-family: 'CYLICOM'!important;}

.footer__copyright p {font-family: 'CYLICOM'!important;}

.footer__subscribe input {
   
    text-align: center!important;
    font-family: 'CYLICOMB'!important;
}


@media screen and (min-width: 0px) and (max-width: 599px)
{
  .footer__widget{margin-left:10px;}
  .footer__widget-2{margin-left:10px;}
  .footer__widget-3{margin-left:10px;}
  .footer__widget-4{margin-left:0px;}
}

.footer__area {  background-color: #f3f3f3!important;}

.footer__widget-4 {background-color:#20292e!important}

.footer-line::after {
    background: #e3e3e3!important;
}


/* TELOS FOOTER  SECTION  ---------------------------------------------------------- */






/* ---------------------------------
-----------------------------------
---------------------------------------------
------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------
---------------------------------------------------------- */


/* ---------------------------------
-----------------------------------
---------------------------------------------
------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------
---------------------------------------------------------- */


/* ---------------------------------
-----------------------------------
---------------------------------------------
------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------
---------------------------------------------------------- */




/* ---------------------------------
-----------------------------------
---------------------------------------------
------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------
---------------------------------------------------------- */



/* Slide ---------------------------------------------------------- */




@media screen and (min-width:768px) and (max-width:1024px) 
{
 
.box { position: absolute; left:4px!important;}  
  

  
}  



@media screen and (min-width:0px) and (max-width:767px) 
{
 
.box { position: absolute; left:3px!important; width: 98%!important;}  
  
.slide-title {font-size: 50px!important;
    line-height: 38px!important;
    padding-bottom: 10px;}

.slide-text {font-size: 22px!important; line-height: 120%!important;}  

  
}  




.re{  width: 100%; height: 100vh; object-fit: cover;}

.box {
    position: absolute;
    left: 140px;
    z-index: 9;
    padding-left: 3px;
    text-align: left;
    margin-top: -500px;
    padding-right: 5px;
    width: 100%;
    max-width: 940px;
}



.slide-title {
    color: #fff;
    font-family: cylicomeb!important;
    font-size: 70px;
    line-height: 120%;
}


.slide-text {
    color:#fff!important;
    font-family: cylicomeb!important;
    font-size: 27px;
    line-height: 120%;
}

  







/* Telos Slide ---------------------------------------------------------- */








/* MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */

.development__area { background-color: #F3F3F3!IMPORTANT;}

.workflow__area-6 { background-color: #F3F3F3!IMPORTANT;}

.service__detail { background-color: #F3F3F3!IMPORTANT;}



@media screen and (min-width:0px) and (max-width:767px) 
{
h2.espa-title { padding-top:50px; font-size:36px!important; line-height:100%!important;}
}

h2.espa-title {
    color: #192126!IMPORTANT;
    font-family: CYLICOMeb;
    padding-top: 50px;
}

p.espa {
    color: #192126!IMPORTANT;
    font-family: 'CYLICOML';
    font-size: 19px;
    line-height: 163%;
}
/* TELOS MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* TELOS MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* TELOS MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* TELOS MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */
/* TELOS MODULE YPIRESIA ESOTERIKI ---------------------------------------------------------- */




/* TOOGLE=======================================================================================*/
/* TOOGLE=======================================================================================*/
/* TOOGLE=======================================================================================*/
/* TOOGLE=======================================================================================*/
/* TOOGLE=======================================================================================*/
/* TOOGLE=======================================================================================*/
/* TOOGLE=======================================================================================*/




.faq__area { background-color:#192126!IMPORTANT;}

.titlos-faq { font-family: cylicomeb!important; color: #00c4ff!important;}

.titlos-faq2{font-family:cylicomb!important;  color: #00c4ff!important;}

.faq__list .accordion-button, .dark .faq__list-3 .accordion-button, .dark .faq__list-6 .accordion-button {color: #00c4ff!important; font-size: 21px;}



p.text-faq {
    font-family: cylicom!important;
    color: #fff!important;
    font-size: 17px;
    line-height: 142%;
}




@media screen and (min-width:0px) and (max-width:768px) 
{
 

p.text-faq { font-size: 19px!important;}
  

  
}  

.accordion-item { border-color: #818181!important;}





/* TELOS TOOGLE=======================================================================================*/
/* TELOS TOOGLE=======================================================================================*/
/* TELOS TOOGLE=======================================================================================*/
/* TELOS TOOGLE=======================================================================================*/
/* TELOS TOOGLE=======================================================================================*/














/*--------------------------PORTFOLIO---------------------------------------------------- */
/*--------------------------PORTFOLIO---------------------------------------------------- */
/*--------------------------PORTFOLIO---------------------------------------------------- */
/*--------------------------PORTFOLIO---------------------------------------------------- */
/*--------------------------PORTFOLIO---------------------------------------------------- */




/* -------------------------------------- PORTFOLIO ------------------------------------------------ */


/*

.gray {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); 
  filter: gray; 
  -webkit-filter: grayscale(100%); 
    -moz-transition:  .5s ease-out;
  -webkit-transition: .5s ease-out;
  -o-transition:  .5s ease-out;
}

.gray:hover {
    filter: none;
  -webkit-filter: grayscale(0%);
  -moz-transition:  .5s ease-out;
  -webkit-transition: .5s ease-out;
  -o-transition:  .5s ease-out;
}

*/



.case-studies{width:100%; display:flex; background:#192126!important; border-top: 2px solid#000;}


.case-studies-eso{padding-top: 100px;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding-bottom: 100px;
    padding-left: 100px;
    padding-right: 100px;
}

.case-studies-eso2{padding-top:0px;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding-bottom: 100px;
    padding-left: 100px;
    padding-right: 100px;
}


@media screen and (min-width:0px) and (max-width:767px) 
{

.case-studies-eso {
    padding-top: 20px;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding-bottom: 100px;
    padding-left: 5px;
    padding-right: 5px;
}
  
  
.case-studies-eso2{padding-top:0px;
    padding-top: 20px;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding-bottom: 100px;
    padding-left: 5px;
    padding-right: 5px;
}
  
  
  
  
  
}  





.col-sm-6{float:left;} 
.col-md-6 {float:left;} 
.col-lg-6{float:left;} 

.col-sm-12{float:left;} 
.col-md-12 {float:left;} 
.col-lg-12{float:left;} 







.plaisiol {
    margin-left: 63px;
    border:39px solid#ededed;
    width:300px;
    height: 500px;
    position: absolute;
}

.dwdeka{width:100%;}

















.zoom, .small{
    overflow: hidden;
    padding: 0;
    width: 100%;
    height: auto;
    float:left; 
}
.zoom img {
    transition-duration: 4s;
    margin: 0 auto;
    display: block;
}
.zoom img:hover {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    z-index: 0;
}
.small img{
  transition-duration: 4s;
    margin: 0 auto;
    display: block;
  transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
}
.small img:hover {
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    z-index: 0;
}





.l-case{padding-right:50px;}

.r-case{padding-left:50px;}


.down1{margin-top:90px;}
.down2{margin-top:100px;}
.down3{margin-top:150px;}
.down4{margin-top:200px;}



.up1{margin-top:-50px;}
.up2{margin-top:-100px;}
.up3{margin-top:-150px;}

.text-ergo {
   z-index:9;
    position: absolute;
    bottom: 0px;
    background: #192126!important;
    opacity: 0.7;
    padding: 20px;
}

h4.ergo{font-family:cylicomb!important; font-size:25px!important; color:#fff!important; padding-left:5px;}
h5.ergo{font-family:cylicomb!important; font-size:16px!important; color:#fff!important; padding-left:5px;}


a.deite-max:link {text-decoration: none; font-size: 20px; color: #00c4ff; font-family: CYLICOMB;}
a.deite-max:visited{text-decoration: none; font-size: 20px; color:#00c4ff; font-family: CYLICOMB;} 
a.deite-max:hover {text-decoration: none; font-size: 20px; color: #00c4ff; font-family: CYLICOMB;}   
a.deite-max.active {text-decoration: none; font-size: 20px; color: #00c4ff; font-family: CYLICOMB;} 

a.deite:link {text-decoration: none; font-size: 16px; color: #00c4ff; font-family: CYLICOMB;}
a.deite:visited{text-decoration: none; font-size: 16px; color:#00c4ff; font-family: CYLICOMB;} 
a.deite:hover {text-decoration: none; font-size: 16px; color: #00c4ff; font-family: CYLICOMB;}   
a.deite.active {text-decoration: none; font-size: 16px; color: #00c4ff; font-family: CYLICOMB;} 



a.min-deite:link {text-decoration: none; font-size: 16px; color: #ff5b5b; font-family: CYLICOMB;}
a.min-deite:visited{text-decoration: none; font-size: 16px; color:#ff5b5b; font-family: CYLICOMB;} 
a.min-deite:hover {text-decoration: none; font-size: 16px; color: #ff5b5b; font-family: CYLICOMB;}   
a.min-deite.active {text-decoration: none; font-size: 16px; color: #ff5b5b; font-family: CYLICOMB;} 



h6.ergo {font-family: cylicomb!important; font-size: 14px!important; color: #fff!important; padding-left: 5px;}





@media screen and (min-width:768px) and (max-width:1100px) 
{
h4.ergo{ font-size:20px!important; }
h5.ergo{ font-size:14px!important; }


a.deite:link {font-size: 14px; }
a.deite:visited{ font-size: 14px; } 
a.deite:hover {font-size: 14px; }   
a.deite.active {font-size: 14px;} 



a.min-deite:link {font-size: 14px; }
a.min-deite:visited{font-size: 14px;} 
a.min-deite:hover {font-size: 14px; }   
a.min-deite.active { font-size: 14px; } 



h6.ergo { font-size: 12px!important; }
  
  
.case-studies{padding:20px;}  
.l-case{padding-right:10px;}
.r-case{padding-left:10px;}
}



@media screen and (min-width:0px) and (max-width:767px) 
{



.zoom, .small{ float:none; }

/*
.gray {
    filter: none;
  -webkit-filter: grayscale(100%); 
    -moz-transition:  .5s ease-out;
  -webkit-transition: .5s ease-out;
  -o-transition:  .5s ease-out;
}

.gray:hover {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); 
  filter: gray; 
  -webkit-filter: grayscale(0%);
  -moz-transition:  .5s ease-out;
  -webkit-transition: .5s ease-out;
  -o-transition:  .5s ease-out;
}
  
*/  
  
  
  
  
  
  
  
.text-ergo {
    position:absolute;
    bottom:0px;
    background: #192126!important;
    opacity: 0.7;
    padding: 20px;
}  
  
  
.l-case{padding-right:0px;}

.r-case{padding-left:0px;}

  
h4.ergo{ font-size:20px!important; padding-top:5px;}
h5.ergo{ font-size:16px!important; }


a.deite:link {font-size: 16px; }
a.deite:visited{ font-size: 16px; } 
a.deite:hover {font-size: 16px; }   
a.deite.active {font-size: 16px;} 



a.min-deite:link {font-size: 16px; }
a.min-deite:visited{font-size: 16px;} 
a.min-deite:hover {font-size: 16px; }   
a.min-deite.active { font-size: 16px; } 



h6.ergo {
    font-size: 13px!important;
    padding-top: 3px;
}
    
  

}






/* -------------------------------------- TELOS PORTFOLIO ------------------------------------------------ */




/*----------------------TELOS PORTFOLIO---------------------------------------------------- */
/*----------------------TELOS PORTFOLIO---------------------------------------------------- */
/*----------------------TELOS PORTFOLIO---------------------------------------------------- */
/*----------------------TELOS PORTFOLIO---------------------------------------------------- */
/*----------------------TELOS PORTFOLIO---------------------------------------------------- */




/* Portfolio Section
===========================================*/
.nopadding {
    padding: 0;
    margin-top: -15px;
}

#portfolio .small-box{
    overflow: hidden;
    -webkit-backface-visibility:hidden;
  border:0px solid#fff;
  background-color: #fff;
}

#portfolio .medium-box{
    overflow: hidden;
    -webkit-backface-visibility:hidden;
  border:0px solid#fff;
  background-color: #fff;
}

#portfolio .large-box{
    height: 768px;
    overflow: hidden;
    -webkit-backface-visibility:hidden;
  border:0px solid#fff;
   background:#fff; 
}

#portfolio .manos-box {
    height: 396px;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    border: 0px solid#fff;
    background: #fff;
}

.small-box img.img-responsive {
    width: -webkit-calc(100% + 80px);
    width: calc(100% + 80px);
    max-width: 120%;
    -webkit-backface-visibility:hidden;
    transform: translateX(-20px) translateY(-20px);
    -webkit-transform: translateX(-20px) translateY(-20px);
    -moz-transform: translateX(-20px) translateY(-20px);
    -ms-transform: translateX(-20px) translateY(-20px);
    -o-transform: translateX(-20px) translateY(-20px);
}

.large-box img.img-responsive {
    max-width: 120%;
    -webkit-backface-visibility:hidden;
    transform: translateX(-50px) translateY(-50px);
    -webkit-transform: translateX(-50px) translateY(-50px);
    -moz-transform: translateX(-50px) translateY(-50px);
    -ms-transform: translateX(-50px) translateY(-50px);
    -o-transform: translateX(-50px) translateY(-50px);
}

.medium-box img.img-responsive {
    max-width: 120%;
    -webkit-backface-visibility:hidden;
    transform: translateX(-50px) translateY(-50px);
    -webkit-transform: translateX(-50px) translateY(-50px);
    -moz-transform: translateX(-50px) translateY(-50px);
    -ms-transform: translateX(-50px) translateY(-50px);
    -o-transform: translateX(-50px) translateY(-50px);
}

.manos img.img-responsive {
    max-width: 120%;
    -webkit-backface-visibility:hidden;
    transform: translateX(-50px) translateY(-50px);
    -webkit-transform: translateX(-50px) translateY(-50px);
    -moz-transform: translateX(-50px) translateY(-50px);
    -ms-transform: translateX(-50px) translateY(-50px);
    -o-transform: translateX(-50px) translateY(-50px);
}


/* Portfolio Small Box - Hover Effects
===========================================*/
.btn:active, .btn.active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 3px 5px transparent !important;
    box-shadow: inset 0 3px 5px transparent !important;
}

.small-box .hover-bg{
    position: relative;
}

.small-box .hover-text{
    display: none;
    position: absolute;
    top: 0;
    padding: 13px 13px;
    transition: all 1.1s ease-in-out;
    -webkit-transition: all 1.1s ease-in-out;
    -moz-transition: all 1.1s ease-in-out;
    -ms-transition: all 1.1s ease-in-out;
    -o-transition: all 1.1s ease-in-out;
}

.small-box .hover-text.on{
    display: block;
}

.small-box:hover .hover-text.animated{
    display: block;
    -webkit-animation-duration: 0.2s;
    animation-duration:0.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig { 
    0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        transform: translateY(-2000px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY();
        transform: translateY();
    }
}
.small-box .hover-text .ptitle {
  
    padding: 2px 5px;
    width: 100%;
    font-size: 100%;
}
.hover-text h2 {
   
   color: #000;
 font-family:MANOS;
    font-size: 20px;
    letter-spacing: 2px;
    margin: 0;
    text-align: left;
}
.small-box a { color: #0c1026 !important }

.small-box .hover-text {
    background: #fff; 
  
    width: 100%;
    height: 100%;
    color: #fff;
}
.small-box a.btn.read-more-btn,
a.btn.btn2 {
    background:#011641;
    color: #ffffff !important;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none !important;
    padding: 10px 10px;
}
.small-box .hover-text a.btn.read-more-btn span.fa,
a.btn.btn2 span.fa,
a.btn { margin-right: 20px }
/* Portfolio Large Box - Hover Effects 
===========================================*/
.large-box .hover-bg { position: relative }
.large-box .hover-text {
    display: none;
    position: absolute;
    top: 0;
    padding: 13px 13px;
    transition: all .1s ease-in-out;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
}
.large-box:hover .hover-text.animated {
    display: block;
    -webkit-animation-duration: 0.2s;
    animation-duration: 0.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig { 
    0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        transform: translateY(-2000px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY();
        transform: translateY();
    }
}
.large-box .hover-text.on { display: block }
.large-box .hover-text {
    background: #fff;
    color: #000;
    width: 100%;
    height: 100%;
    min-height: 560px;
  border:0px solid#fff;
  
}
.large-box a { color: #000; font-size:15px; }
.large-box .hover-text .ptitle {
    border: 1px solid #ffffff;
    padding: 2px 5px;
    width: 100%;
    font-size: 100%;
}
.client-logo {
    text-align: center;
    padding-bottom: 20px;
}
.large-box .hover-text .client-logo img {
    width: 120px;
    text-align: center;
}
.large-box .hover-text a.btn.read-more-btn {
    position: absolute;
    top: 500px;
    background: transparent;
    color: #222222 !important;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    border: none !important;
}
.large-box a.btn.read-more-btn {
    background: transparent;
    color: #0b102c !important;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    border: none !important;
    padding: 6px 0px;
}
.large-box .hover-text a.btn.read-more-btn span.fa { margin-right: 20px }
.medium-box .hover-bg { position: relative }
.medium-box .hover-text {
    display: none;
    position: absolute;
    top: 0;
    padding: 13px 13px;
    transition: all .1s ease-in-out;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
}
.medium-box:hover .hover-text.animated {
    display: block;
    -webkit-animation-duration: 0.2s;
    animation-duration: 0.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig { 
    0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        transform: translateY(-2000px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY();
        transform: translateY();
    }
}
.medium-box .hover-text.on { display: block }
.medium-box .hover-text {
    background: #fff;
    color: #000;
    width: 100%;
    height: 100%;
    min-height: 560px;
  border:0px solid#fff;
  
}
.medium-box a { color: #000; font-size:15px; }
.medium-box .hover-text .ptitle {
    border: 1px solid #ffffff;
    padding: 2px 5px;
    width: 100%;
    font-size: 100%;
}
.client-logo {
    text-align: center;
    padding-bottom: 20px;
}
.medium-box .hover-text .client-logo img {
    width: 120px;
    text-align: center;
}
.medium-box .hover-text a.btn.read-more-btn {
    position: absolute;
    top: 500px;
    background: transparent;
    color: #222222 !important;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    border: none !important;
}
.medium-box a.btn.read-more-btn {
    background: transparent;
    color: #0b102c !important;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    border: none !important;
    padding: 6px 0px;
}
.medium-box .hover-text a.btn.read-more-btn span.fa { margin-right: 20px }

.content > h2 {
	clear: both;
	margin: 0;
	padding: 4em 1% 0;
	color: #FFF;
	font-weight: 800;
	font-size: 1.5em;
}

.content > h2:first-child {
	padding-top: 0em;
}

/* Header */
.codrops-header {
	margin: 0 auto;
	padding: 4em 1em;
	text-align: center;
}

.codrops-header h1 {
	margin: 0;
	font-weight: 800;
	font-size: 4em;
	line-height: 1.3;
}

.codrops-header h1 span {
	display: block;
	padding: 0 0 0.6em 0.1em;
	color: #FFF;
	font-weight: 300;
	font-size: 45%;
}

/* Demo links */
.codrops-demos {
	clear: both;
	padding: 1em 0 0;
	text-align: center;
}

.content + .codrops-demos {
	padding-top: 5em;
}

.codrops-demos a {
	display: inline-block;
	margin: 0 5px;
	padding: 1em 1.5em;
	text-transform: uppercase;
	font-weight: bold;
}

.codrops-demos a:hover,
.codrops-demos a:focus,
.codrops-demos a.current-demo {
	background: #fff;
	color: #fff;
}

/* To Navigation Style */
.codrops-top {
	width: 100%;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 0.69em;
	line-height: 2.2;
}

.codrops-top a {
	display: inline-block;
	padding: 1em 2em;
	text-decoration: none;
	letter-spacing: 1px;
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	display: block;
	float: left;
}

.codrops-icon:before {
	margin: 0 4px;
	text-transform: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	font-family: 'codropsicons';
	line-height: 1;
	speak: none;
	-webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
	content: "\e001";
}

.codrops-icon-prev:before {
	content: "\e004";
}

/* Related demos */
.related {
	clear: both;
	padding: 6em 1em;
	font-size: 120%;
}

.related > a {
	display: inline-block;
	margin: 20px 10px;
	padding: 25px;
	border: 1px solid #4f7f90;
	text-align: center;
}

.related a:hover {
	border-color: #39545e;
}

.related a img {
	max-width: 100%;
	opacity: 0.8;
}

.related a:hover img,
.related a:active img {
	opacity: 1;
}

.related a h3 {
	margin: 0;
	padding: 0.5em 0 0.3em;
	max-width: 300px;
	text-align: left;
}

@media screen and (max-width: 25em) {
	.codrops-header {
		font-size: 75%;
	}
	.codrops-icon span {
		display: none;
	}
}


.grid figure {
position: relative;
float: left;
overflow: hidden;
margin: 0px 0%;
width: 100%;
height: 100%;
background: none;
text-align: center;
cursor: pointer;
margin-left: 0px;
}

.grid figure img {
	position: relative;
	display: block;
	height: 100%;
	width: 100%;
	opacity: 0.8;
}

.grid figure img2 {
	position: relative;
	display: block;
	height: 100%;
	width: 100%;
	opacity: 0.8;
}

.grid figure figcaption {
	padding: 1em;

	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
  opacity: 1;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h2 {
	word-spacing: -0.15em;
	font-weight: 300;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 90%;
}

/* Individual effects */

/*---------------*/
/***** Milo *****/
/*---------------*/

figure.effect-milo {
	background: none;
}

figure.effect-milo img {
	max-width: none;
	width: -webkit-calc(100% + 60px);
	width: calc(100% + 60px);
	opacity: 1;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-30px,0,0) scale(1.12);
	transform: translate3d(-30px,0,0) scale(1.12);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

figure.effect-milo:hover img {
	opacity: 0;
	-webkit-transform: translate3d(0,0,0) scale(1);
	transform: translate3d(0,0,0) scale(1);
}

figure.effect-milo h2 {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 1em 1.2em;
}

figure.effect-milo p {
  FONT-FAMILY:CYLICOMO!IMPORTANT;
	padding: 0 100px 0 100px;
	width: 100%;
	line-height:343%;
	text-align: left;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-40px,0,0);
	transform: translate3d(-40px,0,0);
}

figure.effect-milo:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
  font-size:13px!important;
}

/*---------------*/
/***** Milo2 *****/
/*---------------*/

figure.effect-milo2 {
	background: none;
}

figure.effect-milo2 img {
	max-width: none;
	width: -webkit-calc(100% + 60px);
	width: calc(100% + 60px);
	opacity: 1;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-30px,0,0) scale(1.12);
	transform: translate3d(-30px,0,0) scale(1.12);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

figure.effect-milo2:hover img {
	opacity: 0;
	-webkit-transform: translate3d(0,0,0) scale(1);
	transform: translate3d(0,0,0) scale(1);
}

figure.effect-milo2 h2 {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 1em 1.2em;
}

figure.effect-milo2 p {
   FONT-FAMILY:CYLICOMO!IMPORTANT;
	padding: 0 100px 0 100px;
	width: 100%;
	line-height:343%;
	text-align: right;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-40px,0,0);
	transform: translate3d(-40px,0,0);
}

figure.effect-milo2:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
  font-size:13px!important;
}

/*---------------*/
/***** Milo3 *****/
/*---------------*/

figure.effect-milo3 {
	background: none;
}

figure.effect-milo3 img {
	max-width: none;
	width: -webkit-calc(100% + 60px);
	width: calc(100% + 60px);
	opacity: 1;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-30px,0,0) scale(1.12);
	transform: translate3d(-30px,0,0) scale(1.12);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

figure.effect-milo3:hover img {
	
}

figure.effect-milo3 h2 {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 1em 1.2em;
}

figure.effect-milo3 p {
   FONT-FAMILY:CYLICOMO!IMPORTANT;
	padding: 0 100px 0 100px;
	width: 100%;
	line-height:343%;
	text-align: right;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-40px,0,0);
	transform: translate3d(-40px,0,0);
}

figure.effect-milo3:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
  font-size:13px!important;
}

@charset "UTF-8";
/*!
  Ionicons, v2.0.0
  Created by Ben Sperry for the Ionic Framework, http://ionicons.com/
  https://twitter.com/benjsperry  https://twitter.com/ionicframework
  MIT License: https://github.com/driftyco/ionicons

  Android-style icons originally built by Google’s
  Material Design Icons: https://github.com/google/material-design-icons
  used under CC BY http://creativecommons.org/licenses/by/4.0/
  Modified icons to fit ionicon’s grid from original.
*/
@font-face { font-family: "Ionicons"; src: url("../fonts/ionicons.eot?v=2.0.0"); src: url("../fonts/ionicons.eot?v=2.0.0#iefix") format("embedded-opentype"), url("../fonts/ionicons.ttf?v=2.0.0") format("truetype"), url("../fonts/ionicons.woff?v=2.0.0") format("woff"), url("../fonts/ionicons.svg?v=2.0.0#Ionicons") format("svg"); font-weight: normal; font-style: normal; }
.ion-social-facebook:before, .ion-social-facebook-outline:before,.ion-social-instagram:before, .ion-social-instagram-outline:before, .ion-social-twitter:before, .ion-social-twitter-outline:before, .ion-social-googleplus:before, .ion-social-googleplus-outline:before

{ display: inline-block; font-family: "Ionicons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.ion-social-facebook:before { content: "\f231"; }
.ion-social-instagram:before { content: "\f351"; }
.ion-social-twitter:before { content: "\f243"; }
.ion-social-googleplus:before { content: "\f235"; }


@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
          animation-name: fadeInUpBig;
}

.animated {
    font-family: cylicomo;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  
    font-size: 25px!important;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}