html{
    width: 100%;
}
body{
    /*min-height: 2000px;*/
    padding-top: 70px;
    width: 100%;
    margin:0;
    background-color: #072B3B;  
    font: 0.8em/1.5 "arial", sans-serif;
}
.container{margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px}
@media(min-width:768px){.container{width:750px}}
@media(min-width:992px){.container{width:970px}}
@media(min-width:1200px){.container{width:1170px}}

.white_container{
    width: 100%;
    background-color: white;
}
.grey_container{
    width: 100%;
    background-color: #eeeeee;
}
.blue_container{
    width: 100%;
    background-color: #072B3B;
}
.darkblue_container{
    width: 100%;
    background-color: #000012;
}
.transparent_container{
    width: 100%;
}
.blue{background-color: #072B3B;}
.darkblue{background-color: #000012;}
.grey{background-color: #EEEEEE;}
.white{background-color: white;}
.black{background-color: black;}

.green_text{
    color: #6cbe13;
}
.blue_text{
    color: #072b3b;
}

/*fonts*/

h1 {
    width: 50%;
    text-shadow: 0px 2px 10px #fff;
    font-size: 39px;
    font-style: normal;
    color: black;
    font-size: 48pt;
    font-weight: 300;
    letter-spacing: -3px;
    text-align: center;
    position: absolute;
    left:10%;
    top:20%;
    z-index: 99999999;
}
h2 {
    font-size: 39px;
    /*font-family: 'Roboto',serif;*/
    font-family: 'Advent Pro', sans-serif;
    font-style: normal;
    font-weight: 300;
    color: #093869;
    text-align: center;
}
h3 {
    font-size: 35px;
    /*font-family: 'Roboto',serif;*/
    font-family: 'Advent Pro', sans-serif;
    /*font-family: 'Lato', sans-serif;*/
    font-style: normal;
    font-weight: 300;
    color: black;
    text-align: center;
}
p {
    font-size: 35px;
    font-family: 'Roboto',serif;
    /*font-family: 'Lato', sans-serif;*/
    font-style: normal;
    font-weight: bold;
    color: black;
    text-align: center;
}
.menu_container{
    height: 70px;
    background-color: #072B3B;
    z-index: 20000;
}

/*-----------------BANNERS----------------*/
.banner_digisoft, .ban_security, .ban_network, .ban_support, .ban_web, .ban_design, .ban_distribution, .ban_contact, .ban_jobs{width: 100%;background-size: 100% 100%;}
@media screen and (max-width:480px){.banner_digisoft{background-image: url("../imgs/logo_digisoft_sp.jpg");}}
@media screen and (min-width:480px){.banner_digisoft{background-image: url("../imgs/logo_digisoft_mt.jpg");}}
@media screen and (min-width:1000px){.banner_digisoft{background-image: url("../imgs/logo_digisoft.jpg");}}
@media screen and (max-width:480px){.ban_security{background-image: url("../imgs/security_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_security{background-image: url("../imgs/security_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_security{background-image: url("../imgs/security_ban.jpg");}}
@media screen and (max-width:480px){.ban_network{background-image: url("../imgs/network_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_network{background-image: url("../imgs/network_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_network{background-image: url("../imgs/network_ban.jpg");}}
@media screen and (max-width:480px){.ban_support{background-image: url("../imgs/support_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_support{background-image: url("../imgs/support_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_support{background-image: url("../imgs/support_ban.jpg");}}
@media screen and (max-width:480px){.ban_web{background-image: url("../imgs/web_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_web{background-image: url("../imgs/web_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_web{background-image: url("../imgs/web_ban.jpg");}}
@media screen and (max-width:480px){.ban_design{background-image: url("../imgs/design_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_design{background-image: url("../imgs/design_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_design{background-image: url("../imgs/design_ban.jpg");}}
@media screen and (max-width:480px){.ban_distribution{background-image: url("../imgs/distribution_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_distribution{background-image: url("../imgs/distribution_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_distribution{background-image: url("../imgs/distribution_ban.jpg");}}
@media screen and (max-width:480px){.ban_contact{background-image: url("../imgs/contact_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_contact{background-image: url("../imgs/contact_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_contact{background-image: url("../imgs/contact_ban.jpg");}}
@media screen and (max-width:480px){.ban_jobs{background-image: url("../imgs/jobs_ban_sp.jpg");}}
@media screen and (min-width:480px){.ban_jobs{background-image: url("../imgs/jobs_ban_mt.jpg");}}
@media screen and (min-width:1000px){.ban_jobs{background-image: url("../imgs/jobs_ban.jpg");}}


/*----------------SEPARATORS-------------*/
.separator{
    width: 100%;
    height: 50px;
}
@media(max-width:800px){.separator{
                            height: 25px;
                        }}
.right_separator{
    height: 50px;
    width: 70%;
    float: right;
    position: relative;
    top: -50px;
}
.right_triangle{
    position: absolute;
    left: -50px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 50px 50px;
    border-color: transparent transparent #072B3B transparent;
}
@media(max-width:800px){.right_separator{
                            height: 25px;
                            top: -25px;
                        }}
@media(max-width:800px){.right_triangle{
                            border-width: 0 0 25px 25px;
                            left: -25px;
                        }}
.left_separator{
    height: 50px;
    width: 28%;
    float: left;
    position: relative;
}
.left_triangle{
    position: absolute;
    right: -50px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 50px 50px 0 0;
}
.triangle_blue{
    border-color: #072B3B transparent transparent transparent;
}.triangle_darkblue{
    border-color: #000012 transparent transparent transparent;
}
.triangle_darkblue{
    border-color: #000012 transparent transparent transparent;
}
.triangle_grey{
    border-color: #EEEEEE transparent transparent transparent;
}
.triangle_white{
    border-color: #ffffff transparent transparent transparent;
}
.triangle_black{
    border-color: #000000 transparent transparent transparent;
}
@media(max-width:800px){.left_separator{
                            height: 25px;
                        }}
@media(max-width:800px){.left_triangle{
                            border-width: 25px 25px 0 0;
                            right: -25px;
                        }}
/*----------------End of Separators-------------*/

/*----------------BRANDS-------------*/
#scroller2 {position: relative;top:12px;padding:0;margin:0;border:0;height:48px;width:100%;background-image:url(../imgs/brands.png); }
#tech-slideshow {
    height: 48px;
    position: relative;
    overflow: hidden;
    top: 12px;
}
#tech-slideshow > div {
    height: 48px;
    width: 2700px;
    background: url(../imgs/brands.png);
    position: absolute;
    top:0;
    left: 0;
    height: 100%;
    -moz-transition:  opacity 0.5s ease-out; 
    -o-transition: opacity 0.5s ease-out; 
    -webkit-transition: opacity 0.5s ease-out; 
    -ms-transition: opacity 0.5s ease-out; 
    -webkit-animation: moveSlideshow 10s linear infinite;
    -moz-animation:    moveSlideshow 10s linear infinite;

}
@-webkit-keyframes moveSlideshow {
    0% { left: 0; }
    100% { left: -1684px; }
}
@-moz-keyframes moveSlideshow {
    0% { left: 0; }
    100% { left: -1684px; }
}

/*----------------VIDEO-------------*/
@media screen and (max-width:600px){.video_holder{
                                        position: relative; 
                                        width: 100%; 
                                        height: 0px; 
                                        padding-bottom: 60%;
                                        margin-bottom: 50px;
                                    }}
@media screen and (min-width:600px){.video_holder{
                                        position: relative; 
                                        width: 100%; 
                                        height: 0px; 
                                        padding-bottom: 60%;
                                        margin-bottom: 70px;
                                    }}
/*@media screen and (min-width:801px){.video_holder{
    position: relative; 
    width: 100%; 
    height: 0px; 
    padding-bottom: 60%;
    margin-bottom: 70px;
}}*/



/*----------------PROCESS-------------*/

.it_delivery{
    border-radius: 40px 0px 0px 0px;
    margin: 0px 0px 15px 0px;
    background: -webkit-linear-gradient(#6C0000, #FF0000); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#6C0000, #FF0000); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#6C0000, #FF0000); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#6C0000, #FF0000); /* Standard syntax */
}
.it_installation{
    border-radius: 0px 40px 0px 0px;
    margin: 0px 0px 15px 0px;
    background: -webkit-linear-gradient(#15731A, #7FBA00); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#15731A, #7FBA00); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#15731A, #7FBA00); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#15731A, #7FBA00); /* Standard syntax */
}
.it_support{
    border-radius: 0px 0px 0px 40px;
    margin: 0px 0px 15px 0px;
    background: -webkit-linear-gradient(#000099, #01A4EF); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#000099, #01A4EF); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#000099, #01A4EF); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#000099, #01A4EF); /* Standard syntax */
}
.it_update{
    margin: 0px 0px 15px 0px;
    background: -webkit-linear-gradient(#CF8400, #FFB901); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#CF8400, #FFB901); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#CF8400, #FFB901); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#CF8400, #FFB901); /* Standard syntax */
}
@media(min-width:992px){.it_delivery{height: 150px; border-radius: 40px 0px 0px 0px;}}
@media(min-width:992px){.it_installation{height: 150px; border-radius: 0px 40px 0px 0px;}}
@media(min-width:992px){.it_support{height: 150px; border-radius: 0px 0px 0px 40px;}}
@media(min-width:992px){.it_update{height: 150px; border-radius: 0px 0px 40px 0px;}}

@media(max-width:991px){.it_delivery,.it_installation,.it_support,.it_update{
                            border-radius: 40px 40px 40px 40px; height: 50px;}}

.step_icon_left{
    position: relative;
    height: 90px;
    top: 25px;
    left: 20px;
    float: left;
}
.step_icon_right{
    position: relative;
    height: 90px;
    top: 25px;
    right: 20px;
    float: right;
}
@media(max-width:991px){.step_icon_left,.step_icon_right{
                            height: 40px; top:5px; float:left; right:0px; left:10px;}}

.arquitext{
    color:white;
    position: absolute;
    top: 20%;
}
@media(min-width:992px){.arquiright{right:25%;}.arquileft{left:25%;}}
@media(max-width:991px){.arquitext{
                            top:-15px; }}
@media(max-width:991px){
    .arquiright{left:25%;}.arquileft{left:25%;}
}

.roundy{
    width: 388px;
    height: 388px;
    top: -367px;
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    border-radius: 194px 194px 194px 194px;
}
@media(max-width:991px){.roundy{
                            display:none;}}

.circle1{
    -webkit-animation:spin1 12s linear infinite;
    -moz-animation:spin1 12s linear infinite;
    animation:spin1 12s linear infinite;
}
@-moz-keyframes spin1 { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin1 { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin1 { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.circle2{
    -webkit-animation:spin2 10s linear infinite;
    -moz-animation:spin2 10s linear infinite;
    animation:spin2 10s linear infinite;
}
@-moz-keyframes spin2 { 100% { -moz-transform: rotate(-360deg); } }
@-webkit-keyframes spin2 { 100% { -webkit-transform: rotate(-360deg); } }
@keyframes spin2 { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }
.circle3{
    -webkit-animation:spin 16s linear infinite;
    -moz-animation:spin 16s linear infinite;
    animation:spin 16s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.circle0, .circle1, .circle2, .circle3{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    right: 0px;
    top:0px;
}
/*seguridad*/

.sec{
    float:none;
    display:inline-block;
    vertical-align:middle;
    margin-right:-4px;
}
.whitetext{
    color: white;
}

/*REDES*/

.black_container{
    background-color: black;
}

.voiptext{
    color:white; margin:0px; padding:0px;
}
@media(max-width:500px){.voiptext{
                            margin:-30px;}}

.bottomtext p{
    color: whitesmoke;
    text-align: left;
    font-size: 16px;
    font-family: 'Roboto',serif;
}
.bottomtext a{
    color: whitesmoke;
    text-align: right;
    font-size: 16px;
    font-family: 'Roboto',serif;
}

.form_holder{

}
@media(max-width:992px){.bottom_menu{
                            display:none;}}

/*--------JOBS---------*/

.btn_form_holder{
    text-align: center;
}