/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : Dec 8, 2016, 12:25:49 PM
    Author     : grupohost
*/
body{
    font-family: 'Open Sans', sans-serif;
    font-size:18px;
    color:#231F20;
}

.font{
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
}


.itemportfolio .title{
    opacity: 0;
    transition: all ease-in-out .25s;
}

.itemportfolio:hover .title{
    opacity: 1;
}

.rotate{
    transform: rotate(-5deg);
}
.fontd{
    font-family: 'Roboto Condensed', sans-serif;
}
.no-padding{
    padding: 0;
}

.no-margin{
    margin: 0;
}

.titleunder{
    font-weight: lighter;
}

.titleunder:after{
    content: "";
    display: block;
    width: 70px;
    border-bottom: 3px solid #fff;
    margin: 25px 0;
}

.pillgas{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#404041+0,585859+50,404041+51,2a2a2b+100 */
    background: #404041; /* Old browsers */
    background: -moz-linear-gradient(left, #404041 0%, #585859 50%, #404041 51%, #2a2a2b 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #404041 0%,#585859 50%,#404041 51%,#2a2a2b 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #404041 0%,#585859 50%,#404041 51%,#2a2a2b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#404041', endColorstr='#2a2a2b',GradientType=1 ); /* IE6-9 */
    padding: 5px 15px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    font-size: 27px;
    text-align: center
}

.gillgasd{
    padding: 5px 15px;
    -webkit-border-radius: 0 0 7px 7px;
    border-radius: 0 0 7px 7px;
    font-size: 21px;
    text-align: center;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#26a3da+0,26a3da+50,217ebc+51,26a3da+100 */
    background: #26a3da; /* Old browsers */
    background: -moz-linear-gradient(left, #26a3da 0%, #26a3da 50%, #217ebc 51%, #26a3da 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #26a3da 0%,#26a3da 50%,#217ebc 51%,#26a3da 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #26a3da 0%,#26a3da 50%,#217ebc 51%,#26a3da 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26a3da', endColorstr='#26a3da',GradientType=1 ); /* IE6-9 */
}

.pillvgas{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#404041+0,585859+50,404041+51,2a2a2b+100 */
    background: #6dd966; /* Old browsers */
    background: -moz-linear-gradient(left, #6dd966 0%, #6dd966 50%, #0ed800 51%, #6dd966 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #6dd966 0%,#6dd966 50%,#0ed800 51%,#6dd966 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #6dd966 0%,#6dd966 50%,#0ed800 51%,#6dd966 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6dd966', endColorstr='#6dd966',GradientType=1 ); /* IE6-9 */padding: 5px 15px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    font-size: 27px;
    text-align: center
}

.gillwgasd{
    padding: 5px 15px;
    -webkit-border-radius: 0 0 7px 7px;
    border-radius: 0 0 7px 7px;
    font-size: 21px;
    text-align: center;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#26a3da+0,26a3da+50,217ebc+51,26a3da+100 */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+50,efefef+51,efefef+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(left, #ffffff 0%, #ffffff 50%, #efefef 51%, #efefef 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #ffffff 0%,#ffffff 50%,#efefef 51%,#efefef 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #ffffff 0%,#ffffff 50%,#efefef 51%,#efefef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=1 ); /* IE6-9 */}

.modal-body .select2-container{
    width:250px !important;
}

.products .select2-container{
    width:100% !important;
}

img{
    max-width: 100%;
}
.relative{
    position: relative;
}

.mainmenu {
    padding: 10px;
}

.mainmenu li.current a{
    color: #00abec;
    font-weight:bold;
}

.mainmenu li li a{
    padding: 10px;
    display: block;
    text-transform:none;
}

.mainmenu li a:hover{
    background-color: #00abec;
    color:#fff !important;
}

.border-red{
    border-bottom:9px solid #EE4137;
}

.titleborder,.titleborderd{
    position: relative;
}

.mainmenu .open>a{
    background-color:#444 !important;
}

.titleborder:before {
    content: "";
    width: 40px;
    bottom: -20px;
    transform: rotate(5deg);
    left: 50%;
    margin-left: -20px;
    position: absolute;
    border-top: 7px solid #ccc;
}

.titleborderd:before {
    content: "";
    width: 40px;
    bottom: -20px;
    transform: rotate(5deg);
    left: 0;
    position: absolute;
    border-top: 7px solid #ccc;
}

select{
    background-color: white;
    display: inline-block;

    line-height: 20px !important;
    background-image:
    linear-gradient(45deg, transparent 50%, white 50%),
    linear-gradient(135deg, white 50%, transparent 50%),
    linear-gradient(to right, #EC008C, #EC008C) !important;
    background-position:calc(100% - 23px) calc(1em + 2px), calc(100% - 18px) calc(1em + 2px), 100% 0 !important;
    background-size:
    5px 5px,
    5px 5px,
    2.5em 2.5em !important;
    background-repeat: no-repeat !important;
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.border-top{
    border-top:1px solid #efefef;
}

.border-bottom{
    border-bottom:1px solid #efefef;
}
.border-bottom-pink{
    border-bottom:5px solid #EC008C;
}


h1{
    font-size: 40px;
    position: relative;
    display: inline-block;
    padding: 0px 0px 30px;
    margin-bottom: 0px;
}

h3{
    font-size: 25px;
}

.absolute{
    position: absolute;
}

.fixed{
    position: fixed;
}

.no-padding-margin{
    margin:0;
    padding:0;
}


.circle{
    -webkit-border-radius: 50%;
    border-radius: 50%;
}

.shadowpink{
    -webkit-box-shadow: -7px 7px 0 0 rgba(236,0,140,.3);
    box-shadow: -7px 7px 0 0 rgba(236,0,140,.3);
}

.shadowgrey{
    -webkit-box-shadow: -5px 5px 0 0 rgba(0,0,0,.3);
    box-shadow: -5px 5px 0 0 rgba(0,0,0,.3);
}

.pink{
    color:#EC008C !important;
}

.bgpink{
    background:#EC008C !important;
}

.black{
    color:#000;
}

.height100{
    height: 100%;
}

.height100px{
    height: 100px;
}

.bgdarkblue{
    background-color:#001a43;
}

.bgpink{
    background-color:#EC008C;
}

.cabecera a:focus, .cabecera a:hover {
    text-decoration: none;
    background-color: #000;
}

.bggrey{
    background-color:#efefef;
    padding: 10px;
}


.bggreyd{
    background-color:#444;
    padding: 10px;
}

.textshadow{
    text-shadow:1px 1px 1px rgba(0,0,0,.5);
    width:80%;
}

.padding{
    padding: 40px;
}

.padding-horizontal{
    padding:0 40px;
}

.width60{
    max-width: 60%;
}

.width80{
    max-width: 80%;
}

.width100{
    width:100%;
}

.z-index1{
    z-index: 1;
}

.z-index2{
    z-index: 2;
}

.z-index3{
    z-index: 3;
}

.z-index4{
    z-index: 4;
}

.z-index101{
    z-index: 101;
}


.no-padding-margin-left{
    margin-left:0;
    padding-left:0;
}

.bgwhite{
    background:#fff;
}

.white,.white a,.white p{
    color:#fff !important;
}

.red{
    color:#e91b4a;
}

.grey{
    color:#999;
}

.carousel-item{
    margin-bottom:55px;
}

.bgred{
    background-color:#ee4238;
}

.hoverblue:hover{
    background: #00b3fd;
    color: #fff;
}

.bgblack{
    background-color: rgba(0,0,0,.7);
}

.bgblacka{
    background-color: rgba(0,0,0,1);
}

.bgblue{
    background-color:#30c1de;
}

.blue{
   color:#116DB4;
}

.bgblued{
    background-color:#116DB4;
}

.bgrightdiagonal{
    background-image:url('../img/bgdiagonal.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 34% 487px;
    padding-right: 47px;
}
.dotted{
    border-top:none;
    border-left:none;
    border-right:none;
    border-bottom: 1px dotted #fff;
}

.border{
    border:1px solid #efefef;
}

.selected.iconservice a {
    border-bottom: 5px solid #EC008C;
}

.border-left{
    border-left:1px solid #2e3192;
}

.border-right{
    border-right:1px solid #efefef;
}

.borderwhite{
    border:1px solid #fff;}

.bgimg{
    background-repeat:no-repeat;
    background-position:center;
    background-size:160% auto;
}

.bgimgh{
    background-repeat:no-repeat;
    background-position:center;
    background-size:100% auto;
}

.bgimgt{
    background-repeat:no-repeat;
    background-position:center;
    background-size:auto 80% ;
}

.bgimgd{
    background-repeat:no-repeat;
    background-position:center;
    background-size:auto 160%;
}

.bgimgvertical{
    background-size:auto 100%;
}

.titlegrey{
    color:#808080;
    font-size:43px;
}

.green{
    color:#b6dc77;
}

.bggreen{
    background-color:#6DD966;
}

.align-right{
    text-align:right;
}

.align-left{
    text-align:left;
}

.align-center{
    text-align:center;
}

.border-round{

    border-radius: 25px;
}
.iconsinside{
    line-height: 190px;
    text-align: center;
}

.justified{
    text-align: justify;
}

.menumain ul li{
    display:inline-block;
    position: relative;
}

.menumain ul li a{
    display:block;
    padding: 15px 30px;
}

.socialicons a{
    color:#4d4959;
}

.bold{
    font-weight: 800;
}

.light{
    font-weight: 200;
}

.uppercase{
    text-transform: uppercase;
}

.letterspacing{
    letter-spacing: 2px;
}

.letterspacingsm{
    letter-spacing: 1px;
}

.iconservice a{
    color: #323232;
    width: 100%;
}

.iconservice p{
    margin: 0;
    padding: 0;
}

.iconservice a i{
    margin-bottom: 20px;
    color:#ccc;
}


.selected.iconservice a i{
    margin-bottom: 20px;
    color:#EC008C;
}


.dt-sc-title.with-desc span:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 2px solid #f0f0f0;
    display: inline-block;
    width: 203px;
    height: 2px;
    top: 0;
    margin: auto 0;
    z-index: 0;
}

.dt-sc-title.with-desc span {
    position: relative;
    clear: both;
    display: block;
    top: -10px;
    width: 470px;
    margin: 0 auto;
}

.dt-sc-title.with-desc span:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    border-bottom: 2px solid #f0f0f0;
    display: inline-block;
    width: 203px;
    height: 2px;
    top: 0;
    margin: auto 0;
    z-index: 0;
}

.dt-sc-title {
    position: relative;
    clear: both;
    text-align: center;
    width: 100%;
}

footer .nav a{
    padding:5px 0;
    font-size:14px;
}

.margin-right{
    margin-right:25px;
}

.margin-left-small{
    margin-left:23px;
}

.margin-vertical{
    margin:45px 0;
}

.bottom{
    bottom:0;
}

.bottom35{
    bottom:35px;
}

.top{
    top:0;
}

.left{
    left:0;
}

.right{
    right:25px;
}

.margin-vertical-small{
    margin:25px 0;
}

.margin-vertical-xsmall{
    margin:15px 0;
}

.margin-bottom-small{
    margin-bottom:15px;
}

.margin-bottom-xsmall{
    margin-bottom:10px;
}

.margin{
    margin:45px;
}

.pointer, .pointer:hover{
    cursor: pointer;
}

.invisible{
    display:none;
}

.margin-right-small{
    margin-right:10px;
}

.margin-horizontal-small{
    margin:0 15px;
}

.inline-block{
    display:inline-block !important;
}

.inline-flex{
    display:inline-flex;
}

.paddingsm{
    padding:15px;
}

.paddingxs{
    padding:5px;
}

.padding-right-medium{
    padding-right: 45px;
}


.padding-vertical{
    padding:75px 0;
}

.padding-vertical-medium{
    padding:35px 0;
}

.block{
    display:block;
}

.margin-top{
    margin:75px 0 0 0;
}

.margin-top-small{
    margin-top:25px;
}

.margin-top-xsmall{
    margin-top:15px;
}

.margin-bottom{
    margin-bottom:40px;
}

.margin-bottom-small{
    margin-bottom:25px;
}

.margin-vertical{
    margin:75px 0;
}

.padding-vertical-small{
    padding:25px 0;
}

.padding-vertical-xsmall{
    padding:10px;
}

.margin-vertical-small{
    margin:25px 0;
}

.margin-vertical-xsmall{
    margin:10px 0;
}


.padding-small{
    padding:25px;
}

.padding-xsmall{
    padding:5px;
}

.round{
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
}

.bg-grey{
    background:#f4f4f4;
}

.bg-light-blue{
    background:#1bb7ea;
}

.width30{
    width:30%;
}

.width60{
    width:60%;
}

.width80{
    width:80%;
}

.height150{
    height:150px;
}

.height75{
    height:75px;
}

.height250{
    height:250px;
}

.height350{
    height:350px;
}

.height93vh{
    height: 93vh;
}

.height87vh{
    height: 50vh;
}

#datepicker{
    background-image:url(/img/calendar-3-xxl.png);
    background-repeat:no-repeat;
    background-position: 96% 4px;
    background-size: auto 80%;
}

.height40vh{
    height: 40vh;
}




.margin0auto{
    margin:0 auto;
}

.widthicon{
    width:60px;
}

.bg-white{
    background-color:#fff !important;
}

.lightgrey{
    background:#f4f4f4 !important;
    color:#333;
}

.float-right{
    float: right;
}

.float-left{
    float: left;
}

.bootstrap-select div.dropdown-menu {

    display: block !important;
    height: 300px !important;
    overflow: auto !important;
    width: 300px !important;
}

.pc{
        display:block;
    }

.ipad{
        display:none;
    }

.cell{
        display:none;
}

.dl-menu{
    position:absolute;
    top:50px;
    right: 0px;
    padding: 0;
    z-index: 999;
}

.dl-menu a{
    display:block;
    padding:10px;
    margin-bottom:5px;
    color:#fff !important;
    text-align: left;
}

.dl-menu li{
    display:block;
}


@media (max-width: 990px) {
    .ipad{
        display:block;
    }

    .itemport{
        background-size:100%;
    }

    .logoside{
        text-align: center;
    }
    .pc{
        display:none;
    }

    .dt-sc-title.with-desc span {
        width: 100%;
    }

    .dt-sc-title.with-desc span:after {
        width: 42%;
    }

    .dt-sc-title.with-desc span:before {
        width: 42%;
    }

    footer, footer .align-right{
        text-align: center;
    }

    .bgimg {
        background-repeat: no-repeat;
        background-position: center;
        background-size: 200% auto;
    }
}

@media (max-width: 650px) {
    .cell{
        display:block;
    }

    .bgimgh {
        background-repeat: no-repeat;
        background-position: center;
        background-size: auto 100%;
    }

    .pc{
        display:none;
    }


}