* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }


/* Colorings ----------------------------------------------------------------------------------- */
:root {
   --color_main: #47d46d;       --color_main_light: #47d46d54;      --color_main_light_extra: #47d46d0a;
   --color_sub: #404E67;        --color_sub_light: #404E67;         --color_sub_light_extra: #404E67;
   --color_thrd: #fe5d70d1;     --color_thrd_light: #fe5d708f;      --color_thrd_light_extra: #fe5d7033;
   --color_grey: #dedede;       --color_grey_light: #f6f7fb;



   --bg_1_left: #6ca4ff87;  --bg_1_right: #47d46d;
   --bg_1_left: #6ca4ff87;  --bg_1_right: #47d46d;

}

a:link      {text-decoration: none; color:blue;}
a:visited   {text-decoration: none; color:blue;}
a:hover     {text-decoration: none; color:blue;}
a:active    {text-decoration: none; color:blue;}



/* General ----------------------------------------------------------------------------------- */
html {  margin: 0;    padding: 0;    color: #222;    font-size: 1em;    line-height: 1.4;
        min-height: 100%;   width:100vw; font-family: 'Open Sans', serif;    text-rendering: optimizelegibility;
        -webkit-font-smoothing: antialiased;    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
        font-smooth: always;    -webkit-font-smoothing: antialiased;	-moz-osx-font-smoothing: grayscale;
}

body {  margin: 0;    padding: 0;  width:100vw;  min-height: 100%;    float:left;    font-family: 'Open Sans', serif;
        text-rendering: optimizelegibility;   -webkit-font-smoothing: antialiased;
        text-shadow: 1px 1px 1px rgba(0,0,0,0.004); font-smooth: always;
        -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
.hidden {display:none;}

form:focus {outline: none;}


/* Scrol bar  ----------------------------------------------------------------------------------- */

::-webkit-scrollbar {width: 7px; background: transparent;}
::-webkit-scrollbar-track {background: transparent;;}
::-webkit-scrollbar-track:hover { background: transparent;}
::-webkit-scrollbar-thumb {background: #888; }
::-webkit-scrollbar-thumb:hover {background: #555; }



/* side menu ----------------------------------------------------------------------------------- */
.side_logo              { width:100px; display:none; height:100px; position:fixed; left:20px; top:30px; vertical-align:middle;text-align:center; z-index:1; overflow:unset; z-index:99;}
.side_logo img          { width:65px; height:auto; }


.side_menu              { width:100px; height:100vh; position:fixed; top:0; vertical-align:middle; z-index:1; overflow:unset; z-index:999;}

.side_m_btn             { vertical-align:middle; position: relative;top: 50%; transform: translateY(-50%);width:fit-content; padding:15px; cursor: pointer; }
.side_m_btn img         { width: 70px; height:45px; margin-left:20px;}

.side_m_list            { width:175px; vertical-align:middle; position: relative; top: 50%; left:-200px; transform: translateY(-55%); }
.side_m_item            { color:white; padding:5px 10px 5px 30px; width:fit-content; margin-bottom:4px; text-transform: uppercase; cursor: pointer;
                          box-shadow:3px 0px 7px 0px rgba(185, 176, 176, 0.22); border-radius: 3px; margin-left: -3px;}




/* sections  ------------------------------------------------------------------------------ */
.container              { width:100%; height:100vh; overflow:auto; float:left; }

.section                { width: 100%; height:100vh; position:relative; overflow:hidden;}

.section_content        { width:100%; height:85%; position: absolute; padding-left:8%; padding-right:8%; margin-top:3%; display:table; vertical-align:middle; z-index:1; overflow:hidden;}

.section_title          {float:right; margin-top:10px; margin-bottom:40px; font-size:2.4vmin; font-weight:bold;  text-align:right;
                         text-transform: uppercase; border-bottom:4px solid #000; width:18%; margin-left:calc(100% - 230px);   padding-right: 4px;}

.section_img_big        { width:45vw; height:50vh; padding-left:120px; padding-right:120px; box-shadow: 0 0 12px rgba(0,0,0,0.3); background: #f72f66; margin-top:20vh;}

.section_scroller       { position:absolute; bottom:6%; left:10%; cursor: pointer; padding-top:10px; width:60px; height:40px; z-index:99;}
.section_scroller img   { position:absolute; top:17px; width:60px;}
.section_scroller span  { position:absolute; top:30px; left:-15px; width:90px; font-size: 12px; text-align: center; display:none;}

.section_scroller:hover span {display:block;}

/* subs  ------------------------------------------------------------------------------ */
.sub_right          { vertical-align:middle; text-align:left; display:inline-block; width:55%; padding-left:30px;}
.sub_left           { vertical-align:middle; text-align:right; display:inline-block; width:45%; padding-left:2.5%;}
.sub_wide           { vertical-align:middle; text-align:left;   display:inline-block; width:100%; padding-left:2.5%; padding-right:2.5%; padding-bottom:25px;}

.sub_big            { vertical-align:middle; text-align:left;  display:inline-block; width:75%; min-width:120px;  padding-bottom:25px; float:right; padding-right:3%;}
.sub_mid            { vertical-align:middle; text-align:left;  display:inline-block; width:66%; min-width:120px;  padding-bottom:25px; float:right;}
.sub_half           { vertical-align:top; text-align:center; display:inline-block; width:49%; min-width:120px; padding-top:15px; padding-left:20px; padding-right:20px; padding-bottom:12px; margin-left:-4px; }
.sub_thrd           { vertical-align:top; text-align:center; display:inline-block; width:33%; min-width:120px; padding-top:15px; padding-left:15px; padding-right:15px; padding-bottom:12px; margin-left:-4px; }
.sub_quar           { vertical-align:top; text-align:center; display:inline-block; width:23%; min-width:120px; padding-left:15px; padding-right:15px; padding-bottom:12px;}

.sub_flyer          { position:absolute; width:422px; left:56%; height:65px; bottom:5%;  padding:15px; padding-top:10px; font-size:1.6vmin !important;}

.sub_box            { vertical-align:middle; text-align:left; display:inline-block; width:60%; padding:30px; margin:20px; background: white;}

.sub_top            { vertical-align:top; !important;}

.sub_border         {border: 3px solid #000;   border-radius: 4px;   box-sizing: border-box;}

.tags_container     {height:100%; vertical-align:middle; text-align: center; padding:40px;}
.sub_tag_img        {width:21%; min-width:50px; margin-bottom:10px;}

.text_home          {display:table-cell; text-shadow: 0px 0px 2px #cccccc}

.text_big           {font-size:3vmin; font-weight:bold;}
.text_mid           {font-size:2.5vmin; font-weight:bold;}
.text_mds           {font-size:2.2vmin; font-weight:none;}
.text_sml           {font-size:1.8vmin; font-weight:none;}
.text_bld           {font-weight:bold;}
.text_tny           {font-size:calc(7px + 0.4vw); font-weight:bold;}


/* About us  ------------------------------------------------------------------------------ */

.about_us_companies {margin-top:0px; margin-left:20px; text-align:center; width:100%; padding: 2px 0px 20px 0px;
                     position:relative; }
.about_us_company    {max-height:90px; max-width:140px; min-width:55px; width:17%; margin-left:1.2%; margin-right:7px;}

#aboutus_imgs       {position: relative; margin-top:-40px; }
#aboutus_img_cur    {position:absolute;z-index:3; width:100%; top:0; left:0; opacity:0.8}
#aboutus_img_nxt    {position:absolute;z-index:1; width:100%; top:0; left:0;}



/* adhoc  ------------------------------------------------------------------------------ */

.screenshot_big     {width:100%; position:relative; box-shadow:9px 8px 18px 0px rgba(185, 176, 176, 0.22); }
.add_tick           {padding-left:20px !important; background-image:url("../img/tick.svg");  background-repeat: no-repeat;
                     background-position: left center; background-size: 15px 15px; }
.bar_lines          {border-left: 5px solid #00000087; border-right: 5px solid #00000087; }

.list_point      {text-align:left; margin: 0 12px 10px 12px; color:#021a46; }

/* Home  ------------------------------------------------------------------------------ */
#main_logo                  {margin-right:9%;margin-top:10%; width:37%; min-width: 440px; padding-left:37px;}
#the_letters                {}
#the_letters div            {display:inline-block; margin-right:2px; min-width:80px; text-align:center; padding:0 5px; margin-bottom:4px; }
#the_letters div span       {width:auto;}
#the_letters firstletter    {font-weight:bold !important; font-size:21px !important; margin-right:1px; }


/* img Changer  ------------------------------------------------------------------------------ */
.img_changer        {width:100%; padding:6px; cursor:pointer;}
.img_changer:hover  {background:#ffffff69;}


/* Rotator  ------------------------------------------------------------------------------ */
.rotator    {padding: 37px 20px; height:55%; margin-top: 0px; width:100%; overflow:hidden; background:#ffffff50; overflow:hidden; }
.rotator .item {height: 400px;}

/* horizontal_slider  ------------------------------------------------------------------------------ */
.horizontal_slider    {padding: 37px 20px; height:55%; margin-top: 0px; width:100%; overflow:hidden; overflow:hidden; }
.horizontal_slider    .item {width: 200px; height:160px}


/* contact us form   ------------------------------------------------------------------------------ */
#contact_us_form            {text-align:left;}
input[type=text], select, textarea {width: 100%;  padding: 10px; border: 1px solid #ccc;   border-radius: 4px;   box-sizing: border-box; margin-top: 6px;   margin-bottom: 16px; }
textarea                    {height:150px !important;}

input[type=submit]          { background-color: #4CAF50;   color: white;  padding: 8px 20px;  border: none;  border-radius: 4px;  cursor: pointer; width:100px; margin-right:calc(50% - 50px)}
input[type=submit]:hover    { background-color: #45a049; }



/* ---- reset ---- */
 #particles-js{ z-index:-1; width: 100%; height: 100%;  }
/* background-color: #209bde; background-image: url(""); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; */



/* Mobile  ------------------------------------------------------------------------------ */
@media (min-width: 200px) and (max-width: 500px) {
    ::-webkit-scrollbar { display: none;}
    .section                    {height:100%}
    .text_big                   {font-size:2.6vmax; font-weight:bold;}
    .text_mid                   {font-size:2.2vmax; font-weight:bold;}
    .text_mds                   {font-size:2vmax; font-weight:bold;}
    .text_sml                   {font-size:1.6vmax; font-weight:bold;}
    .text_tny                   {font-size:calc(7px + 0.4vw); font-weight:bold;}

    .side_menu                  {left:-10px;}
    .side_m_btn                 {top:20%; left:-55px;}
    .side_logo                  {top:50px; left:-25px;}
    .side_logo img              {width:40px; }
    .section_scroller           {display:none;}

    .section_content            {margin-left:0px; width:95%; }
    .text_home                  {display:block;}
    #main_logo img              {max-width:80vw !important; margin-top:15%;}
    #the_letters                {text-align: left;width: 100%; bottom:12%; position:absolute; padding-left:5px;}
    #the_letters div            {min-width:55px; font-size:1.4vmax !important; }
    #the_letters firstletter    {font-size:2.2vmax !important; }
    .sub_flyer                  {left:5%; width:90%; font-size:1.6vmax !important; }

    .section_title              {width:22%; border-bottom:2px solid black;}
    #aboutus_imgs               {margin-top:50px;margin-left:-10px;}

    .sub_big                    {width:95%; margin-left:5%;}
    .sub_wide                   {margin-left:5%}
    .sub_quar                   {min-width:100px;}

    .tags_container            {padding:40px 20px;}
    .about_us_companies         {width:95%; margin-left:0px; margin-top:10px}
    #aboutus_imgs               {display:none;}
    #aboutus_imgs img           {float:left; }
    #about_us .sub_big          {margin-top:-5%;}
    #about_us .text_big         {width:55%; float:right; height:15%}
    .about_us_companies         {bottom:0px;}

    .rotator                    {height:350px;}
    .rotator .sub_thrd          {width:100%; height:350px;}

    .side_m_list                {top:25%;}
    #about_us                   {height:105%;}
    #consultancy                {height:220%;}
    #develop_and_build          {height:135%;}
    #consultancy .sub_thrd      {height:34% !important; width:100%; display:block;}

    #contact_us                 {height:150%;}
    #contact_us .sub_wide       {width:auto}
    #contact_us .sub_left       {display:block; width:100% !important; padding-left:0px;}
    #contact_us .sub_right      {display:block; width:100% !important; padding-left:0px;}
    #contact_us .section_content {margin-bottom:25px;}

    #arbitrium_engine_3 .sub_mid  { width:100%;}
    #arbitrium_engine_3 .sub_thrd { width:100%; padding-left:40px !important; }
    #arbitrium_engine_3 .sub_wide { margin-top: 20px !important; width: 90% !important; }
    #arbitrium_engine_3 .img_changer { padding:2px; }

}