/*
Theme Name: Cisco DNA Spaces
Theme URI: https://spaces.cisco.com
Author: Sowmya S
Author URI: https://spaces.cisco.com
Description: DNA Spaces theme for WordPress.
Version: 1.0
Tags: light, blue, white, Cisco, DNA Spaces
*/
body{font-size: 18px !important}
.sg-light-grey-bg{background-color: #f3f5f8}
.sg-light-grey{color: #9E9EA2}
.sg-grey-bg{background-color: #F8F8F8}
.sg-blue-bg{background-color: #00BCEB}
.grey_bg {
    background-color: #f5f5f5 !important;
}
.sg-text-pink{color: #FF446F}
.sg-border-pink{border: solid 1px #FF446F; border-radius: 10px}
.sg-blue{color: #00BCEB} 
.sg-navy-blue{color: #1E4471} 
.sg-btn-primary{border-radius: 20px; background-color: #00BCEB}
.text-opacity-5{opacity: 0.5}
.w-50{width: 50%}
.mt-60{margin-top: 60%}
.sg_orange_grdnt{background: linear-gradient(147.48deg, #E2B04D 0%, #DA9C64 100%); background-color: #DA9C64}
.sg_green_grdnt{background: linear-gradient(327.48deg, #85C401 0%, #83C641 100%); background-color: #83C641}
.sg_skyblue_grdnt{background: linear-gradient(147.48deg, #2CDCD1 0%, #3894D7 100%); background-color: #3894D7}
.sg_blue_grdnt{background: linear-gradient(328.2deg, #3B6AC6 -0.1%, #008DDD 100%); background-color: #008DDD}
.orange_gradient {background-image: linear-gradient(to right, #eb3b24, #f6891f);}
.orange2_gradient{background: linear-gradient(144.42deg, #FBAB18 0%, #ED5F10 100%);}
.navy_blue_gradient{background: linear-gradient(325.23deg, #0D274D 0%, #4B607F 98.59%);}
.blue2_gradient{background: linear-gradient(144.42deg, #3891AD 0%, #315993 100%);}
.blue3_gradient{background: linear-gradient(144.42deg, #5F82AD 0%, #1E4471 100%);}
.rounded-30{border-radius: 30px}
.h-150{height: 150px}
.sg-bg-green{background-color: #6ABF4B}
nav.sg-header{margin-top: -111px !important; box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.05) !important; z-index: 100; background-color: #fff; padding-bottom: 0}
.black_bg {
    background: #00090d;
}
.black_bg2 {
    background: #00090d;
}
.green_bg{background: #abc233}
.blue_bg{background: #049fd9}
.opacity-7{opacity: 0.7}
.pt-14{padding-top: 14%}
.border-navyblue{border-color: #1E4471}

.sg-header .nav-link:hover{color: #4d4d4d !important; border-bottom: none !important;}
.sg_number {
      counter-reset: step; 
  }
  .sg_number li {
      list-style-type: none;
      width: 16%;
      float: left;
      font-size: 12px;
      position: relative;
      text-align: center;
      text-transform: uppercase;
      color: #7d7d7d;
  }
  .sg_number li.active{color: #00BCEB}
  .sg_number li:before {
      width: 15px;
      height: 15px;
      content: '';
      line-height: 30px;
      border: 2px solid #FF5722;
      background-color: #FF5722;
      display: block;
      text-align: center;
      margin: 0 auto 10px auto;
      border-radius: 50%;
      transition: all .8s;
  }
.sg_number li:after {
      width: 100%;
      height: 2px;
      content: '';
      position: absolute;
      background-color: #8BC34A;
      top: 7px;
      left: -50%;
      z-index: -1;
      transition: all .8s;
  }
  .sg_number li:first-child:after {
      content: none;
  }
.sg-header .navbar-nav li {
    margin-right: 14px;
    padding: 8px 8px 12px 8px; position: relative;
}
.sg-header .navbar-nav li a.active{color: #4d4d4d !important; border-bottom: solid 4px transparent;}
.sg-header .navbar-nav li > span{
      background: #ffffff;
    border: 2px solid #E8EBF1;
    border-radius: 30px;
    line-height: 32px;
    width: 32px;
    height: 32px;
    text-align: center;
    display: inline-block;
    font-family: CiscoSans, Arial,sans-serif !important;
    color: #1E4471;
    position: absolute;
    left: 0;
    bottom: -14px;
    right: 0;
    margin: 0 auto;
    font-size: 16px;
}
.sg-header .navbar-nav li > span:after {
    width: 180px;
    height: 2px;
    content: '';
    position: absolute;
    background-color: #D3DAE7;
    top: 14px;
    left: 7%;
    z-index: -1;
    transition: all .8s;
}
  .sg-header .navbar-nav li:last-child > span:after {
      content: none;
  }
  .signin_bg {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 1000;
   pointer-events: none;
   overflow: hidden; background: #48a1c1;
}
.signin_bg iframe {
   width: 100vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 100vh;
   min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}
.welcome_video{box-shadow: 0px 22px 30px rgba(0, 0, 0, 0.12);
    border: solid 2px #2cc9f1;
    border-radius: 6px;}
.network_blue_grdnt{ background: linear-gradient(153.7deg, #51D1FD 0%, #7C00DD 100%); box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.1); }
.network_green_grdnt{ background: linear-gradient(134.83deg, #ABC233 0%, #01D06A 100%); box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.1); }
.meraki_lightgreen_gradient { background-image: linear-gradient(56deg, #3ab54a, #d0de43);}
.meraki_darkgreen_gradient {
    background-image: linear-gradient(56deg, #00918d, #3cb54a);
}

.pt-20{padding-top: 20%}
.pt-50 {
    padding-top: 21%;
}
.index_page {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 10000;
    animation-duration: 3s;
}
.welcome {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 50px;
    padding-top: 101%;
}
.hv_zindex {
    z-index: 1000000;
    position: relative;
}
.slide_width {
    width: 0px !important;
    max-width: 0px !important;
    -webkit-transition: width 0.5s;
    transition: width 0.5s; margin-left: -40px;
}
.index_getstarted{background-image: linear-gradient(to right, #00a5d3, #4bbd9d 51%, #95ca4c); box-shadow: 0 14px 21px 0 rgba(0, 0, 0, 0.12);}
.index_getstarted h2{line-height}
.index_page .black_bg{float: left !important; overflow: hidden !important; -webkit-transition:all .4s ease-in-out; -moz-transition:all .4s ease-in-out; -o-transition:all .4s ease-in-out; transition:all .4s ease-in-out;}
.what_link{font-size: 19px; color: #00090d}

/*hubspot form*/
.home_form .hbspt-form{width: 100%}
.home_form .hbspt-form div > label{display: none}
.home_form .hbspt-form input[type="text"], .home_form .hbspt-form input[type="email"], .home_form .hbspt-form textarea{  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.13);  width: 100%;border-radius: 5px;border: none;  padding: 14px; margin-bottom: 15px}
.home_form .hbspt-form select{ box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.13); height: 50px;  width: 100%; background-color: #fff; color: #565659;  border-radius: 5px; border: none; padding: 14px; margin-bottom: 15px}
.home_form .hbspt-form .actions{text-align: right;}
.home_form .hbspt-form input[type="file"]{margin-bottom: 15px}
.home_form .hbspt-form input[type="submit"]{border-color: transparent !important; height: auto; background: linear-gradient(to right, #00a5d3, #4bbd9d 51%, #95ca4c);border-radius: 5px;box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.13); font-size: 20px !important;padding: 12px 34px !important; width: auto !important; color: #fff !important; margin-top: 20px; cursor: pointer;}


.scale_hover:hover{-webkit-transform: scale(1.1,1.1); -webkit-transition: all 0.4s cubic-bezier(0.46, 0.24, 0.58, 1); box-shadow: 0 12px 18px 0 rgba(0, 0, 0, 0.12), 0 17px 35px 0 rgba(0, 0, 0, 0.15); z-index: 100}
.tooltip_img{ width: 294px; position: absolute; top: -113px; right: -14px;}

.rounded-10{border-radius: 10px}
.p-absolute-rb{position: absolute; right: 0; bottom: 0}
.p-absolute-rt{position: absolute; right: 0; top: 0}
.p-absolute-rt-4{position: absolute; right: 4px; top: 4px}
.p-absolute-all{position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000;}
.number-padding{padding: 11px 15px 7px 15px}
.p-fixed{
  position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
}
.text-40{font-size: 40px}

.width-50 {
    width: 50px;
}

.network_blue_grdnt{background: linear-gradient(141.33deg, #51D1FD 0%, #004BDD 100%);box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.1);}
.network_orange_grdnt{background: linear-gradient(309.85deg, #F39200 0%, #F3BE00 100%); box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.1);}
.network_green_grdnt{background: linear-gradient(309.85deg, #439C7C 0%, #7DCF4B 100%); box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.1);}
.network_grey_grdnt{background: linear-gradient(155.9deg, #F5F7FB 0%, #EFF3F9 100%); box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.1);}
.choose_network > div { max-width: 30%; margin: 10px; overflow: hidden; box-shadow: 0 17px 35px 0 rgba(0, 0, 0, 0.15);}
.choose_network > div:hover{-webkit-transform: scale(1.1,1.1); -webkit-transition: all 0.4s ease-in-out; box-shadow: 0 12px 18px 0 rgba(0, 0, 0, 0.5), 0 17px 35px 0 rgba(0, 0, 0, 0.15); z-index: 100}

.sg_welcome_header{display: none;}
.page-id-202, .page-id-53, .page-id-1170{background-color: #049fd9; background: url(/utilities/setupguide/images/welcome_bg_cover.gif) no-repeat left top; background-size: cover;}
.page-id-202 .sg-header, .page-id-53 .sg-header, .page-id-1170 .sg-header{display: none}
.page-id-202 .sg_welcome_header, .page-id-53 .sg_welcome_header, .page-id-1170 .sg_welcome_header{display: block; margin-top: -64px; padding-bottom: 12px;}

.welcome_steps .scale_hover:hover{background-color: #ffffff; color: #1E4471 !important}
.welcome_steps .scale_hover:hover p > span{background-color: #00BCEB; color: #ffffff !important}
.welcome_pop.modal-lg{max-width: 1300px}
.welcome_pop.modal-dialog,
.welcome_pop .modal-content {
    min-height: 800px;
}

.what_link{font-size: 17px}
.welcome_pop .modal-body {
    /* 100% = dialog height, 120px = header + footer */
    max-height: calc(100% - 120px);
    overflow-y: scroll;
}
.welcome_pop_close .close img{width: 30px; outline: 0; border: 0}
.welcome_tabs nav a { border-top: solid 5px #e8ebf1 !important;margin-top: 3px !important;}
.welcome_tabs nav a.active { border-top: solid 5px #00BCEB !important; color: #00BCEB !important; background-color: #fff; }
.welcome_tab_number {
    padding: 4px 12px;
    display: inline-block;
    color: #1E4471; border: 2px solid #E8EBF1;  border-radius: 20px;}
.see_tab{background: url(/utilities/setupguide/images/packages_s_sign.png) no-repeat top center; background-size: cover;background-size: 70%;}

.popover_content{    position: absolute;
    bottom: 80px;
    left: 0; right: 0;
    padding: 12% 8% 0 8%;
    color: #fff;
    font-size: 15px; z-index: 10000; border-radius: 6px 6px 0 0}
.popover_content > span{position: absolute;
    right: 15px;
    top: 15px; cursor: pointer;}
.pop_active{background: #00BCEB !important; border-radius: 0 0 6px 6px}
.pop_active a,.pop_active a:hover {color: #ffffff}
.pop_active > a > span{background-image: none; color: #ffffff; font-weight: bold; }
.popover_content > .container > .row > span {
    position: absolute;
    right: 10px;
    top: 9px;
    cursor: pointer;
}

.sg_footer{padding: 0 }
.step{color: #00090d; font-size: 18px; font-weight: bold; display: inline-block; font-family: CiscoSans,Arial,sans-serif !important; padding-right: 30px;position: absolute;left: 0; top: 0;}

.step span {
    color: #049fd9;
    padding-left: 4px;
}

.lh_list > li{position: relative;}
.list-group li{ list-style: none; font-family: ciscosans-extralight, Arial,sans-serif !important;  position: relative;  padding-left: 80px; padding-bottom: 16px;}
.list-group li b{font-family: CiscoSans,Arial,sans-serif !important;font-weight: bold;}
.back_link{ margin-top: -14px; display: block; z-index: 1000; position: relative; font-size: 20px}
.back_link > img {margin-right: 20px}
.number_lst > li{padding-left: 36px !important}


/*pre req*/
.preq_container{margin-bottom: 14%}


/*lightbox*/

.auto_img {
    max-width: 100%;
    width: auto !important;
}
.open-lightbox {    margin-top: 20px;
    display: block;}
.open-lightbox  .auto_img{width: 85% !important}
.lightbox-opened {
  background-color: #333;
  background-color: rgba(51, 51, 51, 0.9);
  cursor: pointer;
  height: 100%;
  left: 0;
  overflow-y: scroll;
  padding-top: 4%;
  position: fixed;
  text-align: center;
  top: 0;
  width: 100%; z-index: 100000;
}
.lightbox-opened:before {
  background: url(/utilities/setupguide/images/close-grey-icon.png) no-repeat center;
  color: #eee;
  content: "";
  font-family: sans-serif;
  padding: 20px;
  position: fixed;
  text-transform: uppercase; right: 20px;
    top: 20px;
}
.lightbox-opened img {  max-width: 90%; max-height: 90%}
a.lightbox-close { display: block; width:50px; height:50px; box-sizing: border-box; background: white; color: black; text-decoration: none; position: absolute; top: -80px; right: 0; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; }

/* Provides part of the "X" to eliminate an image from the close link */
a.lightbox-close:before { content: ""; display: block; height: 30px; width: 1px; background: black; position: absolute; left: 26px; top:10px; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); }
/* Provides part of the "X" to eliminate an image from the close link */
a.lightbox-close:after { content: ""; display: block; height: 30px; width: 1px; background: black; position: absolute; left: 26px; top:10px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); }

.no-scroll {
  overflow: hidden;
}

.lh_form .hbspt-form{width: 100%}
.lh_form .hbspt-form div > label{display: none}
.lh_form .hbspt-form input[type="text"], .lh_form .hbspt-form input[type="email"], .lh_form .hbspt-form textarea{  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.13);  width: 100%;border-radius: 5px;border: none;  padding: 14px; margin-bottom: 15px; background-color: #ffffff}
.lh_form .hbspt-form select{ box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.13); height: 50px;  width: 100%; background-color: #fff; color: #565659;  border-radius: 5px; border: none; padding: 14px; margin-bottom: 15px}
.lh_form .hbspt-form input[type="file"]{margin-bottom: 15px}
.lh_form .hbspt-form .actions{margin: 0; padding: 0; text-align: right;}
.lh_form .hbspt-form .actions input{margin-top:0 !important;}
.lh_form .hbspt-form label{color: #049fd9 !important; font-weight: bold}
.lh_form .hbspt-form div ul{    margin: 0;
    padding: 0;}
.lh_form .hbspt-form div ul > li{padding-bottom: 0 !important}
.lh_form .hbspt-form legend{    font-size: 17px;}
.lh_form .hbspt-form label.hs-error-msg{color: #ea6a6a !important; font-size: 14px;}
.lh_form .hbspt-form .submitted-message  p:last-child{color: #032f1d; font-family: ciscosans-extralight, Arial,sans-serif !important;font-size: 24px; margin-top:10px;}
.lh_form .hbspt-form input[type="submit"]{border-color: transparent !important; background: linear-gradient(to right, #00a5d3, #4bbd9d 51%, #95ca4c);border-radius: 5px;box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.13); font-size: 20px !important;padding: 12px 34px !important; width: auto !important; color: #fff !important; margin-top: 20px; cursor: pointer;}

/*header login*/
.sg_login_dropdown.dropdown:hover>.dropdown-menu {display: block;}
  .sg_login_dropdown.dropdown>.dropdown-toggle:active {pointer-events: none;}
  .sg_login_dropdown.dropdown .dropdown-menu{top: 141%;
    min-width: 198px;
    background-color: #f4f9ff;
    border: none;
    border-radius: 0;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
    padding: .5rem 0 0 0;}
  .sg_login_dropdown.dropdown .dropdown-item{ border-bottom: solid 1px #ccc;    padding: .25rem 11px; font-size: 13px;}
  .sg_login_dropdown.dropdown .dropdown-item:last-child{ border-bottom: none}


/*App tab styles*/
.nav-tabs.app_tabs .nav-link{border: none; border-bottom: solid 2px #ffffff; padding: 12px 6px; color: #1E4471; opacity: 0.75}
.nav-tabs.app_tabs .nav-link.active{border-bottom: solid #00BCEB 3px; color: #00BCEB; opacity: 10}
.nav-tabs.app_tabs .nav-item{margin-bottom: 0}
.nav-tabs.app_tabs{border: 0}
.tab-content .fade:not(.show) {
    opacity: 1;
}

.app_yes_btn{background-color: #6ABF4B;padding: 11px 15px 12px 21px;border-radius: 24px;color: #fff;}
.app_no_btn{background-color: #ffffff;padding: 11px 15px 12px 21px;border-radius: 24px;color: #666666;}


.steps_footer{position: fixed; bottom: 0; left: 0; right: 0; z-index: 100000}
.welcome_video_bg {
    position: relative;
    height: 42vh;
}
.welcome_video_bg > iframe {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 90%;
    height: 100%;
    margin: 0 auto;
}


.sguide_panel {
    width: 500px;
    background-color: #014f6ced;
    color: #fff;
    font-size: 12px;
    text-align: center;
    position: relative;
    height: 300px;
    margin: 0 0 3% 7%;
}
.sguide_panel > iframe {
    width: 100%;
    height: 100%;
}

/*Accordion App*/
.accordion .card-header:after {
    font-family: 'FontAwesome';  
    content: "-";
    float: right; 
    font-size: 58px;
    line-height: 28px;
    color: #00BCEB; position: absolute;
    right: 0;
    top: 10px;
}
.accordion .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "+"; 
    font-size: 30px;
    line-height: 28px;
    color: #00BCEB; position: absolute;
    right: 0;
    top: 10px;
}
.card-title{color: #00BCEB !important}
.card-header{background: none; border: none; position: relative;cursor: pointer;}
.card-body{padding-top: 0; }
.accordion .card{background-color: transparent;; border: none}


/* connector network tab*/
.nav-tabs.spaces_tab .nav-link{border: none; color: #b3b3b3; font-size: 13px; margin-left: 6px}
.nav-tabs.spaces_tab .nav-item.show .nav-link, .nav-tabs.spaces_tab .nav-link.active{color: #00BCEB}



li.page-item a.page-link:hover{background-color: #049fd9 !important;}
.pstep{position: relative;}
.navigation{position: fixed;left: 0; right: 0; bottom: 0; margin-bottom: 91px; z-index: 100000}
.prereq_number {
      background: #ffffff;
    border: solid 2px #00BCEB;
    border-radius: 31px;
    line-height: 40px;
    width: 40px;
    height: 40px;
    text-align: center;
    display: inline-block;
    font-family: ciscosans-bold, Arial,sans-serif !important;
    color: #00BCEB;
    position: absolute;
    left: -22px;
    top: 22px;
}
/*Progress bar*/
 .step-container > div {
  height:auto;
}

.progressbar {
      counter-reset: step; 
  }
  .progressbar li {
      list-style-type: none;
      width: 16%;
      float: left;
      font-size: 12px;
      position: relative;
      text-align: center;
      text-transform: uppercase;
      color: #7d7d7d;
  }
  .progressbar li.active{color: #00BCEB}
  .progressbar li:before {
      width: 15px;
      height: 15px;
      content: '';
      line-height: 30px;
      border: 2px solid #E8EBF1;
      background-color: #E8EBF1;
      display: block;
      text-align: center;
      margin: 0 auto 10px auto;
      border-radius: 50%;
      transition: all .8s;
  }
  .progressbar li:after {
      width: 100%;
      height: 2px;
      content: '';
      position: absolute;
      background-color: #E8EBF1;
      top: 7px;
      left: -50%;
      z-index: -1;
      transition: all .8s;
  }
  .progressbar li:first-child:after {
      content: none;
  }
  .progressbar li.active:before {
      border-color: #00BCEB;
      background-color: #00BCEB;
      transition: all .8s;
  }
  .progressbar li.active:after {
      background-color: #00BCEB;
      transition: all .8s;
  }
.btn-container {
  display: flex;
  justify-content: center;
  width: 100%;
  position: absolute;
  bottom: 0;
}
.pr_next, .pr_submit{    background-image: url(/utilities/setupguide/images/right_arrow_icon.png);
    background-repeat: no-repeat;
    background-position: 90%;
    background-size: 12px;
    padding: 8px 50px;}
button.pr_next:disabled,
button.pr_next[disabled]{
  border: 1px solid #CCCCCC;
  background-color: #CCCCCC;
}


.pr_step li ul.list-group > li:before, .hierarchy_panel li ul.list-group > li:before {
    content: " ";
    width: 12px;
    height: 12px;
    background-color: #049fd9;
    border-radius: 40px;
    display: inline-block;
    margin: 9px 0 0 -26px;
    float: left;
}

.app-success-form input[type="text"], .hbspt-form input[type="email"], .app-success-form textarea {
    margin-bottom: 5%;
    font-size: 14px;
    box-sizing: border-box;
    width: 100%;
    height: 63px;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    padding: 10px;
    margin-bottom: 2%;
}
.app-success-form .hs_email label{font-size: 18px; font-family: CiscoSans,Arial,sans-serif !important}

.app-success-form .hbspt-form{width: auto;}
.app-success-form .hbspt-form li{display: inline-block; padding-right: 16px}
.app-success-form .hbspt-form fieldset input, .app-success-form .hbspt-form fieldset textarea{ background-color: #f8f8f8}
.app-success-form .hbspt-form fieldset label{font-size: 15px; font-family: CiscoSans,Arial,sans-serif !important}
.app-success-form .hbspt-form fieldset li span{font-family: ciscosans-light, Arial,sans-serif !important; padding-left: 6px}
.app-success-form .hs-form-field{padding: 6px 10px}
.app-success-form .hs-form-field ul{padding-left: 14px}
.app-success-form .hbspt-form fieldset li input[type=checkbox], .app-success-form .hbspt-form fieldset li input[type=radio] {
    box-sizing: border-box;
    padding: 0;
    vertical-align: top;
    margin-top: 2px;
    margin-right: 4px;
}
.app-success-form fieldset.form-columns-2 > div{
    padding: 6px 18px;
    border: 1px solid #dee2e6!important;
    width: 46% !important;
    margin: 3px 9px;
    height: 110px;
    border-radius: 4px; margin-top: 16px
}
.pagination-lg .page-link{padding: 5px 10px}
.pagination-lg .page-link > img{width: 20px}
.app-success-form .hbspt-form >form > div >label{display: block;}
.app-success-form .hbspt-form li label input { margin-right: 10px }

/*Breadcrum*/
.breadcrumb{display: inline-block;box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05); padding: 5px 26px;
border-radius: 56px;}
.breadcrumb li{display: inline-block; color: #B2B2B2; font-size: 16px}
.breadcrumb li a{color: #9c9c9c;}
.breadcrumb li.current{color: #00BCEB}

/*apps sorting*/
.sort-btn.active {border-top: solid 4px #00bceb; background-color: #F7F7F7}
.sort-btn { 
  background-color: #ffffff;
    padding: 24px 26px;
    border: none;  outline: 0;
        margin-top: -4px; cursor: pointer;}
.sort-btn:first-child{padding: 32px 26px;}

.submitted-message {
    font-size: 24px !important;
    color: #319247;
}

/*for mobile screens*/
@media (max-width: 480px){
  .app-success-form fieldset.form-columns-2 > div{width: 100% !important}
  .app-success-form .hbspt-form{text-align: left !important;}
  .choose_network > div {
    max-width: 100%;
    margin: 0 0 10px 0; }
   

.signinform_hide{display: none}
}


@media (max-width: 991px) and (min-width: 330px){
.index_page .black_bg.h-100 {
    height: 68% !important;
}
.index_page .pt-50 {
    padding: 20px;
}
.index_page .black_bg2.h-100, .index_page .blue_bg.h-100
{height: auto !important;}
 .display-2 {
    font-size: 3rem !important; text-align: center;
}
.index_ciscologo{margin-top: 38%}
.no-gutter {
    margin: 0 !important;
}
.signinform_hide{display: none}
.home_form_container {
    background: #f2f2f2;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
}